/* MAVYN — design tokens (S2 close-out, 2026-09-18). ONE source for colour, type, space, radius, motion and sound
   levels. Every site surface reads from here; a value typed anywhere else is a defect. */
:root{
  /* colour — one dark world */
  --ink:#05070D;--ink-2:#0A0F1D;--ink-3:#0D1424;--ink-4:#121A2C;
  --hair:rgba(180,205,225,.12);--hair-2:rgba(180,205,225,.2);--hair-3:rgba(180,205,225,.32);--accent-hair:rgba(126,243,248,.3);
  --text:#EAF2F8;--text-2:#9FB1C6;--text-3:#8A9BB0;--text-4:#5E6E82;
  --cyan:#2CCCD3;--cyan-bright:#7EF3F8;--violet:#6B54D3;--violet-bright:#9D8BF0;--amber:#E9B949;--dawn:#F2D9A8;--red:#EA6A62;--green:#4ED08A;
  --grad:linear-gradient(135deg,#2CCCD3,#6B54D3);--grad-btn:linear-gradient(135deg,#2CCCD3,#7F6BE6);   /* buttons: #7F6BE6 on ink is 4.9:1 */--grad-dawn:linear-gradient(135deg,#7EF3F8,#F2D9A8);--glow:rgba(44,204,211,.4);
  /* superseded, readers remain: --text-4 (non-text) -> --ink-mute, --glow -> --glow-action (build 11); card fills/edges on --ink-3/4,
     --hair, --hair-2, --accent-hair -> --surface-*, --edge-* (build 14) */
  /* type — Space Grotesk for display, the system face for reading, JetBrains Mono for readouts */
  --disp:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;--body:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono','Cascadia Code',monospace;
  --t-display:clamp(3rem,7.4vw,6.4rem);--t-display-lh:.98;--t-display-ls:-.035em;
  --t-h2:clamp(2.1rem,4.2vw,3.5rem);--t-h2-lh:1.04;--t-h2-ls:-.025em;
  --t-h3-lg:clamp(1.4rem,2.4vw,1.95rem);--t-h3:clamp(1.15rem,1.5vw,1.3rem);--t-body-lg:clamp(1rem,1.25vw,1.13rem);--t-small:.875rem;--t-lede:clamp(1.1rem,1.45vw,1.28rem);--t-body:1.0625rem;--t-body-lh:1.6;
  --t-eyebrow:12px;--t-eyebrow-ls:.22em;--t-caption:13px;--t-readout:clamp(1.4rem,2.2vw,2rem);
  /* LEGACY, read by the home (the tour until build 2), retired in build 12: --t-h2*, --t-h3*, --t-body-lg, --t-caption, --t-eyebrow* */
  /* space — an 8-based scale; --gutter breathes with the viewport */
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;--s-7:48px;--s-8:64px;--s-9:96px;--s-10:128px;--s-11:192px;
  --gutter:clamp(20px,5vw,72px);--max:1440px;--measure:34em; /* r6: was 60ch; 0 readers */
  /* radius + edges */
  --r-1:8px;--r-2:12px;--r-3:18px;--r-4:28px;--r-pill:999px;
  /* motion — durations by size, easings by intent */
  --d-1:120ms;--d-2:200ms;--d-3:350ms;--d-4:600ms;--d-5:900ms;--d-6:1400ms;
  --ease:cubic-bezier(.2,.8,.25,1);--ease-out:cubic-bezier(.22,1,.36,1);--ease-in-out:cubic-bezier(.65,0,.35,1);--ease-spring:cubic-bezier(.34,1.3,.64,1);
}
/* r6 scale (2026-09-23), additive. Steps by role, each with -lh/-ls; display roles -w. */
:root{
  --t-display-w:700;--t-lede-lh:1.55;--t-readout-lh:1;
  --t-title:clamp(2.5rem,1.6rem + 3.6vw,4.5rem);--t-title-lh:1.02;--t-title-ls:-.03em;--t-title-w:700;
  --t-section:clamp(2rem,1.5rem + 2vw,3rem);--t-section-lh:1.08;--t-section-ls:-.025em;--t-section-w:700;
  --t-feature:clamp(1.625rem,1.4rem + .8vw,2rem);--t-feature-lh:1.15;--t-feature-ls:-.02em;--t-feature-w:700;
  --t-subhead:clamp(1.25rem,1.1rem + .6vw,1.5rem);--t-subhead-lh:1.25;--t-subhead-ls:-.015em;--t-subhead-w:700;
  --t-card:clamp(1.125rem,1.05rem + .25vw,1.25rem);--t-card-lh:1.3;--t-card-ls:-.01em;--t-card-w:500;
  --t-read:clamp(1.0625rem,1rem + .25vw,1.125rem);--t-read-lh:1.7;--t-read-ls:0;
  --t-body-sm:1rem;--t-body-sm-lh:1.6;--t-body-sm-ls:0;--t-small-lh:1.55;
  --t-micro:.8125rem;--t-micro-lh:1.5;--t-micro-ls:0; /* the Inter floor */
  --t-label:12px;--t-label-lh:1.2;--t-label-ls:.16em;--t-label-sm:11px;--t-label-sm-lh:1.2;--t-label-sm-ls:.12em;
  --t-button:1.0625rem;--t-button-lh:1.2;--t-button-ls:0;
  /* 12 columns in the 1200px frame from 1024px; the film unit is the one exception */
  --frame:1200px;--col-gap:24px;--wrap:calc(var(--frame) + 2*clamp(20px,6vw,80px));
  --span-3:100%;--span-4:100%;--span-5:100%;--span-6:100%;--span-7:100%;--span-8:100%;
  --media-w:1040px;--measure-read:36em;
  --band-y:clamp(64px,6.667vw,96px);--band-close:clamp(96px,8.889vw,128px);--page-top:clamp(70px,9vw,120px);
  --card-pad:var(--s-5);--card-pad-lg:var(--s-6);--r-card:16px;--r-media:var(--r-1);
  /* one opaque ladder; accent light is the ask's alone */
  --surface-1:#0E1524;--surface-2:#131D2F;--surface-3:#18253B;
  --edge-1:rgba(180,205,225,.10);--edge-2:rgba(180,205,225,.18);--edge-accent:rgba(126,243,248,.35);
  --lip:inset 0 1px 0 rgba(255,255,255,.05);--lip-2:inset 0 1px 0 rgba(255,255,255,.07);
  --shadow-1:0 12px 32px -18px rgba(0,0,0,.7);--shadow-2:0 24px 60px -28px rgba(0,0,0,.85);
  --glow-action:0 10px 34px -10px rgba(44,204,211,.4);
  --ink-mute:#5E6E82; /* decorative only: 3.9:1 on ink, 2.95:1 on surface-3 - never text, a meaningful icon or border */
}
@media(min-width:1024px){:root{
  --span-3:calc((100% - 11*var(--col-gap))/12*3 + 2*var(--col-gap));--span-4:calc((100% - 11*var(--col-gap))/12*4 + 3*var(--col-gap));
  --span-5:calc((100% - 11*var(--col-gap))/12*5 + 4*var(--col-gap));--span-6:calc((100% - 11*var(--col-gap))/12*6 + 5*var(--col-gap));
  --span-7:calc((100% - 11*var(--col-gap))/12*7 + 6*var(--col-gap));--span-8:calc((100% - 11*var(--col-gap))/12*8 + 7*var(--col-gap))}}
@media(min-width:1600px) and (min-height:910px){:root{--media-w:1200px}}
