/* ─────────────────────────────────────────────────────────────────────────
   VoltTechAI design tokens — the single source for every colour, type, and
   spacing decision. Values from 02_BRAND_AND_DESIGN_SYSTEM.md, verbatim.
   Blue means current is flowing: --volt appears nowhere except the current.
   ───────────────────────────────────────────────────────────────────────── */

:root {
  /* Palette */
  --paper:     #FAFAF8;   /* the 3D studio background (parked scenes)       */
  --page:      #FFFFFF;   /* the DELIVERED page background: full white      */
  --paper-0:   rgba(250, 250, 248, 0);   /* zero-alpha twin for gradients   */
  --ink:       #0B0D10;   /* all body and display type, leaders, hairlines  */
  --ink-60:    #5A5F66;   /* secondary type, specifications, captions       */
  --graphite:  #D4D7DA;   /* hairline rules, dividers, inactive states      */
  --volt:      #2B50FF;   /* legacy blue — parked 3D scenes only, never DOM */
  --volt-hot:  #5FC8FF;   /* legacy blue — parked 3D scenes only            */
  --volt-08:   rgba(43, 80, 255, 0.08);  /* legacy blue — parked 3D only    */
  --signal:    #25D366;   /* retired with the WhatsApp CTA (3 Aug 2026)     */

  /* GREEN IS THE CURRENT (redesign, 2 Aug 2026). Green on white is the
     site's whole colour story: packets, rings, icons, live states. */
  --leaf:      #1FBF66;   /* the current: packets, rings, icons, live edges */
  --leaf-ink:  #0E7C43;   /* green that must read as TEXT on white          */
  --leaf-hot:  #8CF7B9;   /* only the brightest centre of a travelling pulse */
  --leaf-30:   rgba(31, 191, 102, 0.30);
  --leaf-14:   rgba(31, 191, 102, 0.14);
  --leaf-08:   rgba(31, 191, 102, 0.08);

  /* Machined greys — PBR targets for the Core (Stage 2+), kept here so the
     3D materials and any UI reference read from one place */
  --machined-chassis:  #C8CBCE;
  --machined-top:      #DDE0E2;
  --machined-chamfer:  #F0F2F3;
  --machined-bay:      #3A3E44;
  --machined-contact:  #C9A227;

  /* Type families (vendored, OFL) */
  --font-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-body:    'Inter', 'Helvetica Neue', Arial, sans-serif;
  --font-mono:    'JetBrains Mono', 'SF Mono', Menlo, monospace;

  /* Type treatments */
  --display-weight: 900;
  --display-tracking: -0.03em;        /* −3% */
  --display-leading: 0.92;
  --display-size: clamp(64px, 11vw, 190px);   /* 8–14vw band, clamped */
  --body-leading: 1.5;
  --body-size: 17px;
  --body-max: 62ch;
  --eyebrow-tracking: 0.18em;
  --eyebrow-size: 12px;
  --tech-size: 13px;

  /* Spacing scale (8-base) */
  --s1: 4px;  --s2: 8px;  --s3: 16px;  --s4: 24px;
  --s5: 40px; --s6: 64px; --s7: 104px; --s8: 168px;

  /* Rules */
  --hairline: 1px solid var(--graphite);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-reveal: 600ms;

  /* Layers */
  --z-canvas: 0;
  --z-content: 10;
  --z-header: 20;
  --z-debug: 30;
}