/* ==========================================================================
   PITLANE — BRAND TOKENS
   Source: logo/PitLane Brand Guidelines.pdf (v1.0), section 02.
   Single source of truth for every color, face and measure on the site.
   Do not hard-code colors anywhere else in the codebase.

   Guide rule: DO NOT TINT OR DESATURATE ACCENTS. There are no "light teal"
   or "dark teal" variants of the accents here on purpose — states change
   between official colors (teal -> cyan) or add glow, never mix a tint.
   ========================================================================== */

:root {
  /* ---- Official palette (guide §02) ---------------------------------- */
  --pl-teal:      #00F2C3;   /* Apex Teal      — primary action, energy      */
  --pl-cyan:      #00C2FF;   /* Telemetry Cyan — secondary, AI data feeds    */
  --pl-tarmac:    #0E1318;   /* Tarmac Dark    — core ground, page bg        */
  --pl-carbon:    #1F2A38;   /* Carbon Steel   — structural borders, panels  */
  --pl-kerb:      #F5F8FA;   /* Kerb White     — high-readability type       */
  --pl-delta:     #FF3366;   /* Delta Red      — critical alert, speed loss  */

  /* ---- From the logo artwork ----------------------------------------- */
  --pl-velocity:  #00A3FF;   /* Teal Velocity gradient end stop              */
  --pl-lane:      #2B3A4C;   /* Second telemetry streak; raised borders      */
  --pl-steel:     #5B728D;   /* Logo subtitle. 3.77:1 — large/UI only        */

  /* ---- Web extensions (not in the guide; contrast-verified) ---------- */
  --pl-asphalt:   #131A22;   /* Raised surface between Tarmac and Carbon     */
  --pl-pitwall:   #9AABBF;   /* Body copy on dark — 7.96:1 on Tarmac, AAA    */
  --pl-ash:       #8796AB;   /* Captions, meta — 6.21:1 on Tarmac, AA        */
  --pl-white:     #FFFFFF;   /* Mono-white logo, node highlights             */
  /* Light/editorial ink. Apex Teal on white is 1.45:1 (fails), so the
     guide's "enhanced deep-teal ink" is defined as: */
  --pl-ink-teal:  #007E68;   /* 5.02:1 on white                              */
  --pl-ink-cyan:  #006BB8;   /* 5.53:1 on white                              */

  /* ---- Gradients ----------------------------------------------------- */
  --pl-grad-velocity: linear-gradient(135deg, var(--pl-teal) 0%, var(--pl-velocity) 100%);
  --pl-grad-text:     linear-gradient(100deg, var(--pl-teal) 0%, var(--pl-cyan) 55%, var(--pl-velocity) 100%);
  --pl-grad-surface:  linear-gradient(160deg,
                        rgba(255,255,255,0.05) 0%,
                        rgba(255,255,255,0.015) 46%,
                        rgba(255,255,255,0.004) 100%);

  /* ---- Glass system -------------------------------------------------- */
  --glass-bg:        rgba(31, 42, 56, 0.34);    /* Carbon Steel, translucent */
  --glass-bg-strong: rgba(31, 42, 56, 0.55);
  --glass-border:    rgba(0, 242, 195, 0.14);
  --glass-border-hi: rgba(0, 242, 195, 0.42);
  --glass-inner:     inset 0 1px 0 rgba(255, 255, 255, 0.07);
  --glass-blur:      blur(18px) saturate(140%);

  /* ---- Elevation ----------------------------------------------------- */
  --shadow-sm:  0 2px 10px rgba(0,0,0,.45);
  --shadow-md:  0 14px 38px rgba(0,0,0,.55);
  --shadow-lg:  0 30px 72px rgba(0,0,0,.65);
  --glow-teal:  0 0 0 1px rgba(0,242,195,.28), 0 14px 44px rgba(0,242,195,.18);

  /* ---- Type (guide §02: "heavy weights set in italicized geometric
          sans-serif" for display; "neutral, legible, high-density
          system font stack" for body) ---------------------------------- */
  --font-display: 'Saira', system-ui, -apple-system, 'Segoe UI', Roboto, 'Arial Black', sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --fs-display: clamp(2.7rem, 1.35rem + 6vw, 6rem);
  --fs-h1:      clamp(2.3rem, 1.3rem + 4.3vw, 4.1rem);
  --fs-h2:      clamp(1.8rem, 1.18rem + 2.8vw, 3rem);
  --fs-h3:      clamp(1.28rem, 1.04rem + 1.1vw, 1.8rem);
  --fs-h4:      clamp(1.06rem, 0.97rem + 0.4vw, 1.25rem);
  --fs-lead:    clamp(1.06rem, 0.98rem + 0.42vw, 1.26rem);
  --fs-body:    1rem;
  --fs-sm:      0.9125rem;
  --fs-xs:      0.8125rem;
  --fs-eyebrow: 0.72rem;

  /* ---- Space (8pt) ---------------------------------------------------- */
  --sp-1: .25rem;  --sp-2: .5rem;   --sp-3: .75rem;  --sp-4: 1rem;
  --sp-5: 1.5rem;  --sp-6: 2rem;    --sp-7: 2.75rem; --sp-8: 3.5rem;
  --sp-9: 5rem;    --sp-10: 7rem;   --sp-11: 9.5rem;

  /* ---- Geometry: tighter radii than a luxury brand — machined, not soft */
  --r-xs: 4px;  --r-sm: 8px;  --r-md: 12px;  --r-lg: 16px;
  --r-xl: 22px; --r-pill: 999px;
  --container: 1240px;
  --container-narrow: 820px;
  --header-h: 76px;

  /* ---- Motion: quick and snappy — this brand is speed */
  --ease-out:  cubic-bezier(.16, .84, .3, 1);
  --ease-soft: cubic-bezier(.4, 0, .2, 1);
  --t-fast: .14s;  --t-mid: .28s;  --t-slow: .55s;
}
