/* KS Theme base styles: reset, typography and the primitives every block uses (eyebrow, wrap,
   section, stack, split grids, buttons, strong links, actions). Token-driven only: the values
   come from the child theme's tokens (theme.json presets via tokens.css aliases, plus the
   semantic layer: --primary, --secondary, --text-body, --font-heading, --space-section …).
   Ported from the Cohen Murison prototype (pilot). Block CSS lives in each block's style.css. */

/* == base == */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);font-size:var(--text-m);line-height:1.65;color:var(--text-body);background:var(--bg-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-variant-ligatures:no-common-ligatures}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--font-heading);font-weight:500;line-height:1.1;letter-spacing:-.02em;margin:0;font-optical-sizing:auto}
h1 em,h2 em{font-style:normal;color:var(--secondary-d-1)}
h2{font-size:var(--text-display-m);text-wrap:balance}
h3{font-size:var(--text-2xl)}
p{margin:0 0 1em}
[hidden]{display:none!important}
.sprite{position:absolute}
section[id]{scroll-margin-top:var(--size-anchor-offset)}
:focus-visible{outline:3px solid var(--secondary);outline-offset:3px;border-radius:var(--radius-s)}

/* == motion == */
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes cardIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes photoIn{from{opacity:.01;transform:scale(1.04)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}

/* == eyebrow == */
.eyebrow{display:block;width:fit-content;font-family:var(--font-body);font-size:var(--text-xs);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--secondary-d-1);margin:0}

/* == wrap == */
.wrap{width:min(var(--container-max),100% - var(--space-gutter) * 2);margin-inline:auto}

/* == section == */
.section{padding-block:var(--space-section);background:var(--bg-body)}
.section--sky{background:var(--neutral-l-4)}
.section--ink{background:var(--primary);color:var(--text-on-dark)}
.section--ink .section__eyebrow{color:var(--secondary)}
.section--ink .section__title{color:var(--white)}
.section--ink .section__accent{color:var(--secondary)}
.section__head{max-width:900px;margin-bottom:var(--space-head)}
.section__title--split{font-size:var(--text-4xl)}
.section__text{color:var(--text-muted);font-size:var(--text-l)}
.section--ink .section__text{color:var(--text-on-dark-muted)}

/* == stack == */
.stack > *{margin-block:0}
.stack > * + *{margin-top:var(--space-stack-m)}
.stack > .eyebrow + *{margin-top:var(--space-stack-s)}
.stack > :is(.btn,.actions,.creds,.dl-points){margin-top:var(--space-stack-l)}

/* == split == */
/* Two-column sections: 5/12 heading column, 7/12 content column. */
.dl-grid,.imm-grid,.lawyer-grid,.faq-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--space-split);align-items:start}
.lawyer-grid{align-items:center}
@media (min-width:1021px){
  .faq-grid > .stack,.dl-grid > .dl-card,.imm-grid > .stack{position:sticky;top:calc(var(--stick,var(--size-header-scrolled)) + var(--toc-h,0px) + 36px);transition:top .4s var(--ease-out)}
}
@media (max-width:1020px){
  .dl-grid,.imm-grid,.lawyer-grid,.faq-grid{grid-template-columns:minmax(0,1fr)}
}

/* == btn == */
/* Semantic styles: primary (accent fill), secondary (dark fill), ghost (outline on dark), light. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);font:700 var(--text-s)/1 var(--font-body);letter-spacing:.01em;padding:var(--space-m) var(--space-l);border-radius:var(--radius-s);border:1px solid transparent;cursor:pointer;text-decoration:none;transition:background .25s,color .25s,border-color .25s,box-shadow .25s,transform .25s var(--ease-out)}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:none}
.btn__icon,.btn__arrow{width:18px;height:18px;flex:none}
.btn__arrow{transition:transform .3s var(--ease-out)}
.btn:hover .btn__arrow{transform:translateX(4px)}
.btn--primary{background:var(--secondary);color:var(--primary);border-color:var(--secondary);box-shadow:var(--shadow-1)}
.btn--primary:hover{background:var(--secondary-l-1);border-color:var(--secondary-l-1)}
.btn--secondary{background:var(--primary-l-1);color:var(--white);border-color:var(--primary-l-1)}
.btn--secondary:hover{background:var(--primary)}
.btn--ghost{background:transparent;color:var(--white);border-color:var(--white-35)}
.btn--ghost:hover{background:var(--white-10);border-color:var(--white)}
.btn--light{background:var(--white);color:var(--text-body);border-color:var(--border-strong)}
.btn--light:hover{border-color:var(--neutral)}
.btn[disabled]{opacity:.7;cursor:progress;transform:none}

/* == link-strong == */
.link-strong{color:var(--text-body);font-weight:700;text-decoration:underline;text-decoration-color:var(--secondary);text-decoration-thickness:2px;text-underline-offset:4px}
/* Note marker (ks/fee-note): no underline, readable on light and dark bands */
.link-strong[href^="#"][aria-label]{color:var(--secondary-d-1);text-decoration:none;padding:0 var(--space-4xs)}
.link-strong--on-dark[href^="#"][aria-label]{color:var(--secondary)}
.link-strong--white{color:var(--white)}

/* == muted == */
.muted{color:var(--text-muted)}

/* == actions == */
.actions{display:flex;gap:var(--space-s);flex-wrap:wrap}

/* == wordmark (ks/site-header, ks/site-footer) == */
.wordmark{display:flex;flex-direction:column;align-items:center;color:var(--white);text-decoration:none;line-height:1;width:max-content}
.wordmark__name{font-family:var(--font-wordmark,var(--font-heading));font-weight:500;font-size:var(--text-xl);letter-spacing:.05em}
.wordmark__sub{display:flex;align-items:center;gap:var(--space-xs);font-family:var(--font-wordmark,var(--font-heading));font-size:var(--text-xs);letter-spacing:.55em;margin-top:var(--space-2xs);color:var(--secondary);width:100%}
.wordmark__sub::before,.wordmark__sub::after{content:"";height:1px;background:var(--secondary);opacity:.75;flex:1}
@media (max-width:720px){
  .wordmark__name{font-size:var(--text-m)}
}
.wordmark--logo{width:auto}
.wordmark__logo{height:calc(var(--size-header) - 2 * var(--space-s));width:auto}