/* ============================================================
   SOHO SESSIONS — Design Tokens
   The single source of truth for the brand layer. Everything
   downstream (brand.css, Bootstrap overrides) reads from here.
   Each colour has ONE job — see §4.2 of the build spec.
   ============================================================ */

:root {
  /* ---- Surface ---- */
  --ss-black:        #000000;
  --ss-near-black:   #0A0A0A;   /* section alternation */
  --ss-panel:        #121212;   /* raised panels on near-black */
  --ss-line:         #242424;   /* hairline borders / instrument edges */
  --ss-bone:         #EDE8E0;   /* sparing light text/panels */
  --ss-bone-dim:     #9A958C;   /* muted body text on black (AA on #000) */

  /* ---- Red — PRIMARY / ticket CTAs / urgency edge ---- */
  --ss-red:          #DC2626;   /* primary */
  --ss-red-bright:   #EF4444;   /* hover/active */
  --ss-red-deep:     #A33030;   /* shadow/edge */

  /* ---- Kinetic Blue — PODCAST + CONTENT LAYER ONLY ---- */
  --ss-blue-lg:      #1D4ED8;   /* large fills */
  --ss-blue:         #60A5FA;   /* default — AA-passing text on black */
  --ss-blue-deco:    #172554;   /* decoration only, never text */

  /* ---- Hazard Amber — URGENCY ONLY, MAX 4 PLACES (see §4.3) ---- */
  --ss-amber:        #F59E0B;
  --ss-amber-bright: #FCD34D;
  --ss-amber-deep:   #92400E;

  /* ---- Type ---- */
  --ss-display: "Bebas Neue", "Arial Narrow", sans-serif;  /* headlines, numerals */
  --ss-body:    "Rajdhani", "Segoe UI", sans-serif;        /* body, UI */
  --ss-mono:    "JetBrains Mono", ui-monospace, monospace; /* instrument-panel labels */

  /* ---- Type scale (fluid, mobile-first) ---- */
  --ss-fs-mega:  clamp(3.5rem, 18vw, 11rem);   /* hero session numeral */
  --ss-fs-h1:    clamp(2.4rem, 9vw, 5rem);
  --ss-fs-h2:    clamp(1.8rem, 6vw, 3.25rem);
  --ss-fs-h3:    clamp(1.4rem, 4vw, 2rem);
  --ss-fs-lead:  clamp(1.05rem, 2.4vw, 1.3rem);
  --ss-fs-body:  1rem;
  --ss-fs-label: 0.78rem;   /* mono technical labels */

  /* ---- Spacing / structure ---- */
  --ss-gap:      clamp(1rem, 4vw, 2.5rem);
  --ss-section-y: clamp(3.5rem, 10vw, 7rem);
  --ss-tap:      44px;   /* minimum tap target */
  --ss-maxw:     1240px;

  /* ---- Motion (mechanical only) ---- */
  --ss-ease-mech: cubic-bezier(0.7, 0, 0.3, 1);
  --ss-dur-fast: 120ms;
  --ss-dur-base: 240ms;
  --ss-dur-slow: 420ms;

  /* ---- Hand-rolled shadows (Bootstrap shadows disabled) ---- */
  --ss-shadow-hard: 0 0 0 1px var(--ss-line), 0 18px 40px rgba(0,0,0,0.75);
  --ss-glow-red:    0 0 0 1px var(--ss-red-deep), 0 0 28px rgba(220,38,38,0.35);
}