/* OCD Rebuild — Design tokens. Palette sampled from brand logo (cyan-on-black). */
:root{
  /* surfaces */
  --ink:#0A1413;          /* off-black base (no pure #000 per design rules) */
  --ink-soft:#0E1A18;
  --surface:#0F211E;      /* raised dark surface */
  --paper:#FFFFFF;        /* light section base */
  --band:#ECFEFF;         /* light cyan-tinted band (accent use only) */
  --band-2:#FBF6EF;       /* WARM off-white band — grounds the brand (was cool) */
  --sand:#F4ECE0;         /* warm sand for human/photo sections */
  --warm-line:#EADFD0;

  /* brand */
  --cyan:#00E5E8;         /* accent — CTAs, links, text on dark (AA-safe) */
  --cyan-deep:#04898F;    /* accent on light backgrounds (contrast — WCAG AA ≥4.5:1 on band/white) */
  --glow:#00FFFF;         /* pure brand cyan — R3F glows + sparkle ONLY */
  --gray:#9AA3A3;         /* logo gray — muted text on dark */

  /* ink on light */
  --text:#0A1413;
  --muted:#566260;
  --line:#E4E8E8;
  --line-dark:#1C2E2B;

  /* type */
  --font-display:'Sora',system-ui,sans-serif;
  --font-body:'Hanken Grotesk',system-ui,sans-serif;

  /* radius — tightened, more grounded/industrial (was 10/14/22/30) */
  --r-sm:4px; --r:6px; --r-lg:10px; --r-xl:14px; --r-pill:999px;

  /* spacing rhythm */
  --section:clamp(3rem,6vw,5.5rem);
  --gap:clamp(1rem,2.5vw,1.8rem);
  --wrap:1200px;

  /* shadow — tinted to bg hue, no neon glow on UI */
  --shadow:0 20px 45px -22px rgba(10,20,19,.45);
  --shadow-cyan:0 18px 40px -20px rgba(0,174,182,.35);

  /* motion */
  --ease:cubic-bezier(.16,1,.3,1);
  --t:.35s var(--ease);
}
