/* kw-priority.css — additive components for the priority pages.
   Loads BEFORE /lib/site.css. Uses only the theme tokens from site.css
   (:root --ink, --paper, --gold, --line …). All classes are namespaced kwp-. */

.kwp-sec{scroll-margin-top:6rem}

/* copy blocks — left-aligned, theme reading width */
.kwp-copy{max-width:44rem}
.kwp-copy p{color:var(--ink-2);line-height:1.7;margin:0 0 1.1rem}
.kwp-copy p:last-child{margin-bottom:0}
.kwp-sec a:not(.btn){color:var(--gold-deep);text-decoration:underline;text-decoration-color:rgba(200,164,92,.5);text-underline-offset:.2em}
.kwp-sec a:not(.btn):hover{text-decoration-color:var(--gold-deep)}
.kwp-sec h3{margin-top:0}
.kwp-cards{margin-top:.5rem}
.kwp-cards + .kwp-copy,.kwp-steps + .kwp-copy,.kwp-tabs + .kwp-copy{margin-top:2rem}

/* panel — white card with the theme's gold accent */
.kwp-panel{background:var(--white);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:6px;padding:clamp(1.5rem,4vw,3rem);box-shadow:var(--shadow)}
.kwp-panel--center{text-align:center;border-left:1px solid var(--line);border-top:3px solid var(--gold)}
.kwp-panel--center header{margin-left:auto;margin-right:auto}
.kwp-panel--center .eyebrow{justify-content:center}
.kwp-panel--center .kwp-copy{margin-left:auto;margin-right:auto}
.kwp-panel--center .kwp-cta{justify-content:center}

/* numbered list — mirrors .process / .step */
.kwp-steps{list-style:none;margin:0;padding:0;display:grid;gap:1rem;grid-template-columns:1fr;counter-reset:kwpstep;max-width:60rem}
@media(min-width:48em){.kwp-steps{grid-template-columns:repeat(2,1fr)}}
.kwp-steps li{position:relative;background:var(--white);border-top:2px solid var(--gold);border-radius:0 0 6px 6px;padding:1.25rem 1.5rem}
.bg-paper-2 .kwp-steps li{background:var(--white)}
.kwp-panel .kwp-steps li{background:var(--paper)}
.kwp-steps li::before{counter-increment:kwpstep;content:"0" counter(kwpstep);font-family:var(--mono);font-size:.75rem;color:var(--gold-deep);letter-spacing:.08em;display:block;margin-bottom:.5rem}
.kwp-steps li p{margin:0;color:var(--ink-2);font-size:.9375rem;line-height:1.6}

/* tabs — all panels are in the HTML; without JS they simply stack */
.kwp-tablist{display:none}
.kwp-tabpanels{display:grid;gap:1rem}
.kwp-tabpanel{background:var(--white);border:1px solid var(--line);border-top:2px solid var(--gold);border-radius:0 0 6px 6px;padding:clamp(1.25rem,3vw,2rem);max-width:52rem}
.kwp-tabpanel h3{font-size:1.25rem;margin-bottom:.625rem}
.kwp-tabpanel p{color:var(--mute);font-size:.9375rem;line-height:1.65;margin:0 0 .75rem}
.kwp-tabpanel p:last-child{margin-bottom:0}
.kwp-tabs.kwp-ready .kwp-tablist{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.kwp-tabs.kwp-ready .kwp-tabpanel[hidden]{display:none}
.kwp-tab{font-family:var(--sans);font-size:.9375rem;font-weight:500;line-height:1.2;padding:.75rem 1.25rem;border-radius:999px;border:1px solid var(--line);background:var(--white);color:var(--ink);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
.kwp-tab:hover{border-color:var(--gold)}
.kwp-tab[aria-selected="true"]{background:var(--ink);color:var(--white);border-color:var(--ink)}
.kwp-tab:focus-visible,.kwp-tabpanel:focus-visible,.kwp-cta .btn:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* call to action row */
.kwp-cta{margin-top:2rem;display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem}
.kwp-micro{margin:0;color:var(--mute);font-size:.875rem;max-width:30rem}

/* fix: theme FAQ "close" sign is mis-encoded in site.css ("âˆ'"); this wins on specificity */
html body .faq details[open] summary::after{content:"\2212"}

@media (max-width:520px){
  .kwp-tab{font-size:.875rem;padding:.625rem 1rem}
  .kwp-cta .btn{width:100%}
}

/* spacing between copy and the component that follows it */
.kwp-copy + .kwp-steps,.kwp-copy + .kwp-cards,.kwp-copy + .kwp-tabs,.kwp-copy + h3{margin-top:1.75rem}