/* design-a page tokens.
   Copied from /Users/aditya/projects/mm-corporate/src/app/globals.css (the candy
   revival layer at :root line ~603 and the v5 layer at :root line ~922), 8 Oct 2026.
   Values are verbatim; do not retune them here. Lines marked PROTO are not in
   globals.css: they come from the brag-kinetic prototypes and are named so.

   Fonts (v3, 12 Oct 2026): the Anybody, Manrope and JetBrains Mono notes that stood here are retired. --display and --body
   are Proza Libre (700 and 500), --ui and --mono are Chivo 500, loaded by the Google Fonts CSS URL; the final values are the
   v3 block at the end of this file. The earlier --display, --body, --ui and --mono lines below are kept only as history. */

:root {
  /* ── core palette (globals.css candy layer, verbatim) ── */
  --dark-surface: #0b2a2b;        /* dark ground (the chamber) + all dark text */
  --primary: #ff485a;             /* brand red: display-only on light grounds (3.32:1) */
  --red-text: #D91E36;            /* sub-24px red text on white/light */
  --red-accent-peach: #E8283E;    /* display-size red on --pastel-pink */
  --surface-light: #f6f6f6;       /* body ground, text on the chamber */
  --pastel-pink: #ffe6da;
  --pastel-green: #a1de6e;
  --pastel-teal: #a7f4ff;
  --pastel-yellow: #f7c30e;
  --pastel-purple: #c882ff;
  --white: #fff;
  --outline-variant: #647878;
  --nav-hover-dark: #1f3a3a; --nav-active-dark: #274243;
  --btn-light-hover: #e2e6e6; --btn-light-active: #dadede;
  --pill-hover: #ff6173; --pill-active: #e6485a;

  /* ── grounds (verbatim; --gradient-red is the hero, never retuned) ── */
  --gradient-red: linear-gradient(180deg, #ff485a 0%, #ff8894 40%, #ffb2b9 100%);
  --gradient-green: linear-gradient(180deg, #579721 0%, #e8fed5 96.3%);
  --gradient-yellow: linear-gradient(180deg, #fff -50%, #f7c30e 40%, #d48e05 100%);
  --gradient-purple: linear-gradient(180deg, #ffe7ea -50%, #b780ff 40%, #9747ff 100%);

  /* ── v5 layer (verbatim) ── */
  --sheet: #f9fbfa;               /* frames and sheets, never #fff */
  --lane-you: var(--pastel-yellow);   /* yellow means YOU and nothing else */
  --lane-intel: var(--pastel-teal);   /* Muffin Intel */
  --lane-team: var(--pastel-green);   /* our team */
  --plate-neutral: rgba(11, 42, 43, 0.18);
  --plate-neutral-dark: rgba(246, 246, 246, 0.22);
  --plate: 10px;
  --ink-75: rgba(11, 42, 43, 0.75);
  --paper-75: rgba(246, 246, 246, 0.75);
  --ring-on-dark: #f7c30e;
  --ring-on-light: #0b2a2b;
  --ring-chamber: var(--surface-light);

  /* ── ink screens (globals.css Overprint tints, verbatim) ── */
  --op-green-75: rgba(11, 42, 43, 0.75);
  --op-green-50: rgba(11, 42, 43, 0.5);
  --op-green-25: rgba(11, 42, 43, 0.25);
  --op-green-10: rgba(11, 42, 43, 0.1);
  --op-green-s10: #e2e3de;
  --op-green-s25: #bec4c0;
  --op-coral-s10: #fbe6e3;
  --op-coral-s25: #fbcbcc;

  /* ── PROTO: story tones and inks from proto-hero / proto-see-beats ── */
  --story-open: #e2e3de;          /* = --op-green-s10 */
  --story-show: #bec4c0;          /* = --op-green-s25 */
  --story-ask: #475d5d;
  --ink-55: rgba(11, 42, 43, 0.55);
  --hair: rgba(11, 42, 43, 0.18); /* = --plate-neutral */
  --hair-dark: rgba(246, 246, 246, 0.16);
  /* PROTO: the beat tones of proto-see-beats (Hook red, Product reveal pink,
     Demonstration purple, Ask paper). Data colours: never lane colours. */
  --beat-hook: var(--primary);
  --beat-reveal: var(--pastel-pink);
  --beat-demo: var(--pastel-purple);
  --beat-ask: var(--surface-light);
  /* PROTO: report stamp red (BRIEF part 6, report-proof) */
  --stamp-red: #c42a3f;

  /* ── type ── */
  --display: 'Anybody', 'Arial Narrow', sans-serif;
  --body: 'Anybody', 'Arial Narrow', sans-serif;
  --ui: 'Manrope', system-ui, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, Menlo, monospace;
  --telugu: "Kohinoor Telugu", "Telugu Sangam MN", "Noto Sans Telugu", "Nirmala UI", 'Manrope', sans-serif;
  --deva: "Kohinoor Devanagari", "Devanagari Sangam MN", "Noto Sans Devanagari", 'Manrope', sans-serif;
  --wdth-display: 72;             /* condensed: H1, H2 heads, buttons, big figures */
  --wdth-body: 87.5;              /* semicondensed: lines, labels, tabs */

  /* ── layout (verbatim) ── */
  --container: min(87.5vw, 1024px);
  --container-wide: min(92vw, 1360px);
  --py-section: 80px;
  --nav-h: 64px;
  --rail-h: 44px;
  --sticky-offset: calc(var(--nav-h) + var(--rail-h) + 8px);
  --clip-max: 880px;
  --hero-clip-max: 760px;

  /* ── radii, shadows, borders (verbatim: hard, zero-blur sticker shadows only) ── */
  --r-1: 4px; --r-2: 8px; --r-3: 12px; --r-6: 24px; --r-slide: 10px; --r-full: 9999px;
  --shadow-1: 0 8px 0 rgba(0,0,0,.16);
  --shadow-2: 0 4px 0 rgba(0,0,0,.24);
  --shadow-pressed: 0 2px 0 rgba(0,0,0,.24);
  --border-field: 4px solid #000;
  --border-cta: 1px solid #0b2a2b;

  /* ── page motion (CSS side only; loops use GSAP eases; the easing tokens are at the end of this file) ── */
  --dur-color: 150ms; --dur-fade: 200ms; --dur-settle: 450ms;
}
@media (max-width: 799px) {
  :root { --plate: 4px; }
}
@media (max-width: 767px) {
  :root { --py-section: 48px; }
}

/* ════════ v3 (12 Oct 2026, BUILD-PLAN-v3 B1) ════════
   1. The v3 type tokens: page-design-v3/build/v3-tokens.css, its :root block verbatim (this block overrides the type
      tokens above; the Anybody, Manrope and JetBrains Mono faces are retired and their files are not referenced). */
/* v3 type tokens (11 Oct 2026). Appended after kit/tokens.css, which stays untouched.
   Owner: "Ink with the strip, Proza Libre, yes to all". Pairing = type-test/humanist-a.
   Faces load by Google Fonts CSS URL (see build.mjs FONT_URL); no font file is saved.
     Proza Libre 700 / 500  display and text (the voice)
     Chivo 500              every figure, table cell, chip, label and rupee price (tabular, lining)
     Noto Sans Telugu 600, Noto Sans Devanagari 500   Indic lines, Latin face first in the stack
   Chivo is loaded at 500 only: a heavier weight asked of it resolves to 500 (font-synthesis is off, so nothing is faked).
   Proza Libre is loaded at 500 and 700: 400 resolves to 500, 600 and 800 to 700. */
:root {
  --display: 'Proza Libre', 'Chivo', system-ui, sans-serif;
  --body: 'Proza Libre', 'Chivo', system-ui, sans-serif;
  --ui: 'Chivo', system-ui, sans-serif;
  --mono: 'Chivo', system-ui, sans-serif;      /* the mono is retired: figures and timecodes use Chivo's tabular lining figures */
  --telugu: 'Chivo', 'Noto Sans Telugu', system-ui, sans-serif;
  --deva: 'Noto Sans Devanagari', 'Chivo', system-ui, sans-serif;
  --wdth-display: 100; --wdth-body: 100;       /* no width axis any more; kept so a stray reference cannot resolve to nothing */
}

/* 2. B1: the two local metric fallbacks (kit.css) go second in the four stacks, so a late web face swaps with 2 percent or
      less change in width and none in line height. The telugu and deva stacks are the verbatim v3 ones. */
:root {
  --display: 'Proza Libre', 'Proza Libre Fallback', 'Chivo', system-ui, sans-serif;
  --body: 'Proza Libre', 'Proza Libre Fallback', 'Chivo', system-ui, sans-serif;
  --ui: 'Chivo', 'Chivo Fallback', system-ui, sans-serif;
  --mono: 'Chivo', 'Chivo Fallback', system-ui, sans-serif;
}

/* 3. MOTION-MAP 4.0 tokens, verbatim (the one easing family and every duration, distance, dim and budget the page uses). */
:root{
 --ease-out:cubic-bezier(.23,1,.32,1);     /* power4.out   small enters, stamps, lit, hover, press */
 --ease-enter:cubic-bezier(.16,1,.3,1);    /* expo.out     cards, panels, sheets, emerge, veil */
 --ease-travel:cubic-bezier(.77,0,.175,1); /* power3.inOut A to B: flights, glides, rewind, trail, camera */
 --ease-exit:cubic-bezier(.32,0,.67,0);    /* power2.in    the takedown, 200 ms or less */
 /* linear: film time only (playheads, timecodes, progress lines, the hold ring); steps() for digit strips */
 --dur-press:90ms;--dur-release:120ms;--dur-color:150ms;--dur-clear:200ms;
 --dur-sm:240ms;--dur-md:380ms;--dur-lg:520ms;--dur-scene:700ms;--dur-hold:600ms;
 --enter-min:12px;--enter-max:24px;--exit-dist:10px;
 --enter-scale:.96;--icon-scale:.9;--press-scale:.97;--press-sink:2px;
 --stagger-tile:40ms;--stagger-card:60ms;--stagger-group:100ms;--stagger-cap:500ms;
 --veil-soft:.62;--veil-deep:.86;--recede:.38;--skeleton:.18;
 --dwell:500ms;--settle:1500ms;--dip:200ms;--lead:15;--lead-hold:300ms;
 --hyst:48px;--hyst-touch:36px;--lerp:45ms;--reverse-rate:1.6;
 --movers-loud:12;--movers-medium:8;--movers-quiet:6;--movers-phone:10;
 --layers-max:10;--layers-full:2;--will-change-off:260ms;
}

/* 4. B1: the v3 nav is 56 px on phones (page-design-v3/hero/hero-390.html); the ink bar is 64 px from 768 px. */
@media (max-width: 767px) { :root { --nav-h: 56px; } }