/* ============================================================
   NEXI · nexi-editorial · tokens.css
   The canonical design tokens. Full system: C:/NEXI_ROOT/DESIGN.md

   NEXI-owned surface  -> use these tokens as-is.
   CLIENT / partner surface -> override the PALETTE + TYPE blocks
   in your own :root AFTER this file. The structural tokens
   (spacing, radius, motion, layout, z-index) stay fixed.
   ============================================================ */

:root{
  /* ---- PALETTE — NEXI editorial default: cool graphite (2026-05-21).
         ~19 vars. Override these for a client surface. ---- */
  --bg:#0D0E11;            /* ground — near-black, cool. Never pure #000. */
  --bg-2:#121419;          /* raised ground */
  --surface:#171A20;       /* card / panel surface */

  --ink:#E7E8EC;           /* primary ink — cool light gray. Never pure #fff. */
  --ink-2:#9A9DA6;         /* secondary ink — body, descriptions */
  --ink-3:#696D77;         /* dim ink — labels, register lines */
  --ink-4:#42454D;         /* faint ink — meta */

  --rule:rgba(231,232,236,.12);        /* hairline — the primary structure */
  --rule-soft:rgba(231,232,236,.055);  /* faintest hairline */
  --rule-strong:rgba(231,232,236,.24); /* emphasis hairline */

  --accent:#8B97AD;                    /* one accent per surface — NEXI cool slate */
  --accent-hi:#AAB4C6;                 /* accent, brighter (hover) */
  --accent-dim:rgba(139,151,173,.14);  /* accent wash */

  --c-verify:#5FB585;                  /* product marks — small dots only, */
  --c-verify-hi:#6FE7BE;               /* verify, brighter — links, the green V */
  --c-spectra:#C77DA0;                 /* never a full-section wash */
  --c-horizon:#5E8AD0;
  --c-amber:#D6A748;                   /* status: planned / caution */
  --c-rose:#D1788A;                    /* status: out of scope / not applicable */

  /* ---- TYPE ---- */
  --font-display:'Fraunces','Georgia',serif;          /* editorial headlines */
  --font-body:'Hanken Grotesk',system-ui,sans-serif;  /* body copy */
  --font-mono:'IBM Plex Mono',ui-monospace,monospace; /* register, labels, actions */
  --font-wordmark:'Syne',var(--font-body);            /* brand mark ONLY — never serif */

  --t-hero:clamp(46px,9vw,124px);
  --t-title:clamp(30px,4.6vw,54px);
  --t-statement:clamp(23px,3.6vw,44px);
  --t-iname:clamp(26px,3.6vw,44px);
  --t-lead:clamp(15.5px,1.5vw,18px);
  --t-body:16px;
  --t-label:11px;

  /* ---- SPACING (8px base) ---- */
  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-8:48px; --s-10:64px; --s-12:80px; --s-16:128px;
  --gut:32px;                          /* page gutter */
  --sec-pad:clamp(74px,11vw,148px);    /* section vertical padding */

  /* ---- RADIUS — editorial is tight; no pill-shaped cards ---- */
  --r:2px; --r-2:3px; --r-full:999px;

  /* ---- MOTION — no bounce, no elastic, no spring ---- */
  --ease:cubic-bezier(.2,.65,.2,1);
  --d-micro:.15s; --d-std:.3s; --d-reveal:.95s;

  /* ---- LAYOUT ---- */
  --wrap:1060px;
  --nav-h:62px;

  /* ---- Z-INDEX ---- */
  --z-base:1; --z-nav:60; --z-overlay:100;
}

@media(max-width:720px){ :root{ --gut:22px; } }
@media(max-width:430px){ :root{ --gut:17px; } }