/* ═══ Atlas Studio site kit · tokens ═══════════════════════════════════════════════════════
   Every colour, type size, space, radius and timing the site uses. Lifted from the approved
   design (proto/home-combined: home.css :root, embers.css, stats.css); values are identical.
   Pages never name a colour literally: use these. Contrast ratios are on --ground unless noted.
   ══════════════════════════════════════════════════════════════════════════════════════════ */
:root{
  /* ── the ground ── */
  --ground:#0c0907;           --ground-rgb:12 9 7;
  --ground-2:#14100d;         /* raised: row hover, tiles */
  --ground-3:#1d1814;         /* ceramic face, top */
  --foot:#080605;             /* the footer, a step deeper */
  /* ── ink ── */
  --ink:#F4EDE4;              --ink-rgb:244 237 228;   /* 17.1:1 */
  --cream:#EFE7DA;            /* 16.2:1; 14.3:1 on ground-3; --ground text on it 16.2:1 */
  --ink-2:#BDB3A5;            /*  9.6:1; 9.2:1 on ground-2; 9.8:1 on foot */
  --ink-3:#9A9083;            /*  6.3:1; 6.0:1 on ground-2; 5.6:1 on ground-3; 6.4:1 on foot */
  /* ── the fire ── */
  --fire:#FF6A1A;             --fire-rgb:255 106 26;   /* 6.9:1: marks, large text; --ground on it 6.9:1 */
  --fire-ink:#FF8A45;         /* 8.5:1, 8.1:1 on ground-2: fire for SMALL text */
  --fire-deep:#E85A12;        /* pressed fill: --ground on it 5.6:1 */
  --amber:#FFB238;            --amber-rgb:255 178 56;
  --yellow:#FFD66B;
  --core:#FFF4D8;
  --red:#C4260C;
  /* ── light, shade, glass ── */
  --hi-rgb:255 250 242;       /* a top highlight on cream fills */
  --white-rgb:255 255 255;
  --shade-rgb:0 0 0;          /* every shadow on the ground */
  --glass-rgb:20 16 13;       /* the nav pill's fill */
  /* ── dark ceramic (panels: the stats popout, the mobile menu) ── */
  --cer-hi:#221c17;
  --cer-lo:#14100d;
  --cer-top:#2c241e;
  --cer-bot:#090706;
  --slab:#050403;
  --slab-cream:#A99D8B;
  /* ── the products' own colours (accents only: a dot, a small mark; never a fill behind text) ── */
  --helm-hi:#2c2d30;          --helm-lo:#1b1c1e;
  --helm-dot-w:#9fb4cc;       --helm-dot-n:#d6b874;
  --q-bg:#1b1c1e;  --q-edge:#070708;  --q-fg:#a9aaa7;  --q-fg-on:#ececea;  --q-on:#252629;  --q-dot:#9fb4cc;
  --q-mono-rgb:62 63 66;
  --p-helm:#9fb4cc;           /* Helm's accent (helm/ui/styles/tokens.css) */
  --p-quartz:#5f9bb8;         /* Quartz's logo */
  --p-mantle:#5245ee;         /* Mantle's indigo: a dot only, never text (too dark on the ground) */

  /* ── the headline's firelight (embers.js sets --fh-lit 0..1) ── */
  --lit-cool:#E8E8E6;  --lit-mid:#F2ECE5;  --lit-warm-0:#F7E3CB;  --lit-warm-1:#FFBD72;
  --open-0:#FFEBC9;  --open-1:#FFC86A;  --open-2:#FF9245;
  /* ── the designed still (no WebGL2 / no JS) ── */
  --still-1-rgb:255 236 190;  --still-2-rgb:255 170 70;  --still-3-rgb:236 92 20;
  --still-4-rgb:120 26 6;     --still-5-rgb:214 70 14;   --still-6-rgb:90 20 6;

  /* ── type ── */
  --f-sans:"Archivo","Segoe UI Variable Text","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono","Cascadia Mono",Consolas,monospace;
  --f-serif:"Newsreader",Georgia,serif;
  --f-win:"Segoe UI Variable Text","Segoe UI Variable","Segoe UI",system-ui,sans-serif;
  --t-h1:clamp(50px,6.6vw,108px);       /* the home hero line */
  --t-h1-page:clamp(42px,5vw,76px);     /* a side page's title */
  --t-h2:clamp(30px,2.9vw,44px);        /* a section head */
  --t-h3:clamp(28px,2.5vw,38px);        /* a product row's name */
  --t-lede:clamp(17px,1.38vw,20px);
  --t-body:16.5px;
  --t-small:13px;
  --t-mono:12px;
  --t-label:11.5px;                     /* mono uppercase labels, letter-spacing .14em */

  /* ── space and layout ── */
  --gut:clamp(24px,4.2vw,64px);
  --wrap:1376px;
  --edge-l:max(var(--gut),calc((100% - var(--wrap)) / 2 + var(--gut)));
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:36px; --s-7:56px;
  --sec-y:clamp(48px,8vh,96px);         /* a section's top/bottom padding */

  /* ── radii ── */
  --r-pill:999px;  --r-panel:16px;  --r-row:18px;  --r-cue:12px;  --r-btn:10px;  --r-chip:10px;  --r-tile:12px;

  /* ── motion ── */
  --e:cubic-bezier(.32,.72,0,1);        /* every ease */
  --d-fast:160ms;  --d-mid:200ms;  --d-slow:300ms;

  /* composed from the tokens above */
  --cer:linear-gradient(172deg,var(--cer-hi) 0%,var(--cer-lo) 100%);
  --cer-rim:inset 0 0 0 1px rgb(var(--ink-rgb) / .08),inset 0 1px 0 rgb(var(--ink-rgb) / .06),inset 0 -1px 0 rgb(var(--amber-rgb) / .28);
  --glass-shadow:inset 0 0 0 1px rgb(var(--ink-rgb) / .08),inset 0 1px 0 rgb(var(--ink-rgb) / .10),
    0 1px 2px rgb(var(--shade-rgb) / .32),0 12px 30px -12px rgb(var(--shade-rgb) / .5);
  color-scheme:dark;
}