/* Cypress design system — tokens, reset, base only. No components. */
:root{
  /* palette */
  --cypress:#013220; --cypress-600:#0E3D2A; --ink:#04120B;
  --sage:#C1C3AC; --olive:#90866E;
  --cotton:#EDEAE1; --cotton-card:#E4E0D4; --signal:#B7D07A;
  --label-ink:#57503B; /* AA-safe warm label on cotton (~6.4:1) */
  /* semantic */
  --bg:var(--cotton); --surface:var(--cotton-card);
  --text:var(--ink); --muted:#4A5248; --line:rgba(4,18,11,.14);
  --bg-invert:var(--cypress); --text-invert:var(--cotton);
  /* type (families overridden per direction) */
  --font-display:'Inter',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,monospace;
  --step--1:clamp(.83rem,.8rem + .1vw,.9rem);
  --step-0:clamp(1rem,.96rem + .2vw,1.1rem);
  --step-1:clamp(1.25rem,1.15rem + .5vw,1.5rem);
  --step-2:clamp(1.6rem,1.4rem + 1vw,2.2rem);
  --step-3:clamp(2.1rem,1.7rem + 2vw,3.4rem);
  --step-4:clamp(2.8rem,2rem + 4vw,5.5rem);
  /* space */
  --sp-1:.5rem; --sp-2:1rem; --sp-3:1.5rem; --sp-4:2.5rem;
  --sp-5:4rem; --sp-6:6rem; --sp-7:9rem;
  --maxw:1200px; --radius:14px; --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0}
/* no CSS smooth scrolling: it breaks GSAP ScrollTrigger.refresh(); app.js smooths in-page anchors */
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font-family:var(--font-body);
  font-size:var(--step-0);line-height:1.6;overflow-x:hidden;
  -webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--font-display);line-height:1.08;font-weight:700}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--sp-3)}
.label{font-family:var(--font-mono);font-size:var(--step--1);letter-spacing:.14em;
  text-transform:uppercase;color:var(--label-ink)}
.invert{background:var(--bg-invert);color:var(--text-invert)}
.invert .label{color:var(--sage)}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
[tabindex="-1"]:focus{outline:none}