/* kp-orange-resources.v1.css: /resources/ (page 2420). Source: build/src/resources.css; template from src/resources_page.py.
   Same card language as /get-help/. One responsive layout (no desktop/phone artboard pair). Colour roles per DESIGN.md:
   #FF5A1F only on ink or as a fill with ink text; #B83A0A for orange text on paper. */
body.ko-body-resources{margin:0;background:#0B0B0C;color:#EFE9DF;font-family:"Hanken Grotesk",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.ko-res{display:block;overflow-x:clip}
.ko-res *{box-sizing:border-box}
.ko-res ::selection{background:#FF5A1F;color:#0B0B0C}
.ko-res :focus-visible{outline:3px solid #FF5A1F;outline-offset:4px;border-radius:2px}
.ko-res .disp{font-family:"Big Shoulders Display","Oswald",Impact,sans-serif;text-transform:uppercase;letter-spacing:-0.01em;font-weight:900}
.ko-res .label{font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#FF5A1F}

.ko-res .hero{max-width:1344px;margin:0 auto;padding:170px 48px 72px}
.ko-res .hero h1{margin:18px 0 28px;font-size:clamp(64px,10vw,152px);line-height:.84}
.ko-res .hero h1 span{color:#FF5A1F}
.ko-res .lede{margin:0 0 40px;max-width:720px;font-size:21px;line-height:1.55;color:#CFC8BD}
.ko-res .now{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding:24px 28px;border:1px solid rgba(255,90,31,.45);border-radius:10px;background:#151517;margin-bottom:40px}
.ko-res .now p{margin:0;font-size:18px;line-height:1.5}
.ko-res .now strong{color:#FF5A1F}
.ko-res .nowlinks{display:flex;flex-wrap:wrap;gap:12px}
.ko-res .btn{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;border-radius:999px;background:#FF5A1F;color:#0B0B0C;font-weight:700;font-size:16px;text-decoration:none}
.ko-res .btn:hover{background:#FF7A45}
.ko-res .btn.ghost{background:transparent;color:#EFE9DF;border:1px solid rgba(239,233,223,.35)}
.ko-res .btn.ghost:hover{border-color:#FF5A1F;color:#FF5A1F}
.ko-res .jump{display:flex;flex-wrap:wrap;gap:10px}
.ko-res .jump a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid rgba(239,233,223,.22);color:#EFE9DF;font-size:14px;font-weight:500;text-decoration:none}
.ko-res .jump a:hover{border-color:#FF5A1F;color:#FF5A1F}

.ko-res .paper{background:#F6F2EA;color:#17161A;padding:24px 48px 96px}
.ko-res .group,.ko-res .closer{max-width:1248px;margin:0 auto}
.ko-res .group{display:grid;grid-template-columns:340px minmax(0,1fr);gap:56px;padding:72px 0;border-top:1px solid rgba(23,22,26,.16);scroll-margin-top:96px}
.ko-res .group:first-child{border-top:0}
.ko-res .ghead h2{margin:0;font-size:48px;line-height:.9}
.ko-res .ghead p{margin:14px 0 0;font-size:16px;line-height:1.6;color:#4A4640}
.ko-res .ghead a,.ko-res .closer a{color:#B83A0A;text-decoration:underline;text-underline-offset:3px}
.ko-res .res{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-content:start}
.ko-res .card{padding:26px 28px;border-radius:8px;background:#FFFDF8;border:1px solid rgba(23,22,26,.1)}
.ko-res .card h3{margin:0 0 6px;font-size:20px;line-height:1.25;font-weight:700;color:#17161A}
.ko-res .org{display:flex;flex-direction:column;align-items:flex-start;gap:14px;color:#17161A;text-decoration:none;margin-bottom:6px}
.ko-res .org:hover h3{color:#B83A0A;text-decoration:underline;text-underline-offset:3px}
.ko-res .org:focus-visible{outline-offset:6px}
.ko-res .logo{display:flex;align-items:center;height:44px;max-width:100%}
.ko-res .logo img{display:block;height:44px;width:auto;max-width:160px;object-fit:contain}
.ko-res .org h3{margin:0}
.ko-res .card p{margin:0 0 14px;font-size:16px;line-height:1.55;color:#4A4640}
.ko-res .how{display:flex;flex-direction:column;gap:4px;font-size:17px;font-weight:600}
.ko-res .how a{color:#B83A0A;text-decoration:underline;text-underline-offset:3px;display:inline-flex;align-items:center;min-height:32px;overflow-wrap:anywhere}
.ko-res .how a:hover,.ko-res .ghead a:hover,.ko-res .closer a:hover{color:#8F2C06}
.ko-res .closer{padding:72px 0 0;border-top:1px solid rgba(23,22,26,.16)}
.ko-res .closer h2{margin:0 0 16px;font-size:48px;line-height:.9}
.ko-res .closer p{margin:0 0 12px;max-width:760px;font-size:18px;line-height:1.6;color:#4A4640}

@media (max-width:1100px){.ko-res .group{grid-template-columns:1fr;gap:28px}}
@media (max-width:899px){
  .ko-res .hero{padding:116px 20px 48px}
  .ko-res .lede{font-size:18px}
  .ko-res .now{padding:20px}
  .ko-res .now p{font-size:17px}
  .ko-res .paper{padding:8px 20px 64px}
  .ko-res .group{padding:48px 0}
  .ko-res .ghead h2,.ko-res .closer h2{font-size:38px}
  .ko-res .res{grid-template-columns:1fr;gap:14px}
  .ko-res .card{padding:22px}
  .ko-res .card h3{font-size:19px}
  .ko-res .card p{font-size:15px}
  .ko-res .how{font-size:16px}
}
