/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:3rem;padding:.75rem 1.5rem;border:1px solid transparent;border-radius:var(--radius-sm);font:600 var(--fs-sm)/1 var(--font-body);text-decoration:none;cursor:pointer;transition:background var(--t-fast) var(--ease),color var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),transform var(--t-fast) var(--ease)}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--signal);color:#fff}
.btn--primary:hover{background:var(--signal-deep);color:#fff}
.btn--secondary{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--secondary:hover{background:var(--ink);color:var(--paper)}
.btn--quiet{padding-inline:0;min-height:auto;color:var(--spruce);border-radius:0;border-bottom:1px solid currentColor;padding-bottom:.2rem}
.btn .arrow{transition:transform var(--t-base) var(--ease)}
.btn:hover .arrow{transform:translateX(3px)}
.section--dark .btn--secondary{color:#fff;border-color:#fff}
.section--dark .btn--secondary:hover{background:#fff;color:var(--spruce-deep)}

/* Cards — use sparingly; prefer rule-lists */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s6);transition:border-color var(--t-base) var(--ease),transform var(--t-base) var(--ease)}
a.card{display:block;text-decoration:none;color:inherit}
a.card:hover{border-color:var(--spruce);transform:translateY(-2px)}
.card--outline{background:transparent}
.tag{display:inline-block;padding:.25rem .6rem;border:1px solid var(--line-strong);border-radius:999px;font:500 var(--fs-xs)/1 var(--font-body);color:var(--ink-2)}
.notice{border-left:3px solid var(--spruce);background:var(--spruce-tint);padding:var(--s4) var(--s5);font-size:var(--fs-sm);color:var(--spruce-deep)}

/* Navigation */
.site-header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:4.25rem}
.brand{font:600 1.3rem/1 var(--font-display);letter-spacing:-.02em;color:var(--ink);text-decoration:none}
.brand span{color:var(--signal)}
.nav__list{display:none;list-style:none;margin:0;padding:0;gap:var(--s6);align-items:center}
.nav__list a{font-size:var(--fs-sm);font-weight:500;color:var(--ink-2);text-decoration:none;padding-block:.5rem;border-bottom:1px solid transparent;transition:color var(--t-fast),border-color var(--t-fast)}
.nav__list a:hover,.nav__list a[aria-current="page"]{color:var(--ink);border-color:var(--ink)}
.nav__list .btn{color:#fff;border:0;min-height:2.5rem;padding:.6rem 1.1rem}
.nav__toggle{min-height:2.75rem;background:none;border:1px solid var(--line-strong);border-radius:var(--radius-sm);padding:.6rem .9rem;font:600 var(--fs-sm) var(--font-body);color:var(--ink);cursor:pointer}
.nav__list.is-open{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s4);position:absolute;inset:4.25rem 0 auto;background:var(--paper);padding:var(--s5) var(--gutter) var(--s6);border-bottom:1px solid var(--line)}
@media(min-width:900px){.nav__toggle{display:none}.nav__list{display:flex}}

/* Footer */
.site-footer{background:var(--ink);color:#C9D1CE;padding-block:var(--s8)}
.site-footer a{color:#fff}
.site-footer p{color:#9AA5A0;font-size:var(--fs-sm)}

/* Forms */
.field{display:grid;gap:var(--s2);margin-bottom:var(--s5)}
.field label{font:600 var(--fs-sm)/1.3 var(--font-body);color:var(--ink)}
.field .hint{font-size:var(--fs-xs);color:var(--ink-3)}
.input,.select,.textarea{width:100%;min-height:3rem;padding:.75rem .9rem;background:var(--surface);color:var(--ink);border:1px solid var(--line-strong);border-radius:var(--radius-sm);font:inherit;font-size:1rem;transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.textarea{min-height:8rem;resize:vertical}
.input:hover,.select:hover,.textarea:hover{border-color:var(--ink-3)}
.input:focus,.select:focus,.textarea:focus{outline:0;border-color:var(--spruce);box-shadow:0 0 0 3px var(--spruce-tint)}
.field.is-error .input,.field.is-error .textarea{border-color:var(--err)}
.field .error{font-size:var(--fs-xs);color:var(--err)}

/* Motion: reveal on scroll (JS adds .is-in) */
.reveal{opacity:0;transform:translateY(12px);transition:opacity var(--t-slow) var(--ease),transform var(--t-slow) var(--ease)}
.reveal.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}
@media(scripting:none){.reveal{opacity:1;transform:none}}

.btn--lg{min-height:3.5rem;padding-inline:2rem;font-size:1rem}
.section--dark :focus-visible,.site-footer :focus-visible{outline-color:#fff}
.site-footer .brand{font-size:1.4rem}
.nav__list .btn{font-weight:600}
.nav__list.is-open{gap:0}
.nav__list.is-open li{width:100%}
.nav__list.is-open a:not(.btn){display:block;padding:.95rem 0;font-size:1.125rem;border-bottom:1px solid var(--line)}
.nav__list.is-open .btn{width:100%;min-height:3.25rem;margin-top:var(--s4);font-size:1rem}