:root {
  /* --- Color --- */
  --bg-primary:     #000002;
  --bg-secondary:   #0B0B0C;
  --bg-tertiary:    #16161A;
  --bg-card:        #101013;
  --text-primary:   #FFFFFF;
  --text-secondary: #D1D3D4;
  --text-muted:     #8A8A8E;
  --text-dim:       #5A5A5F;
  --accent-red:     #D52B1E;
  --accent-red-hot: #FF2A1B;
  --accent-red-dim: rgba(213, 43, 30, 0.12);
  --em-gold:        #D4A853;
  --border-subtle:  rgba(255, 255, 255, 0.06);
  --border-strong:  rgba(255, 255, 255, 0.14);
  --border-red:     rgba(213, 43, 30, 0.35);

  /* --- Platform brand colors (for social hub hover) --- */
  --plat-youtube:   #FF0033;
  --plat-instagram: #E1306C;
  --plat-tiktok:    #25F4EE;
  --plat-x:         #FFFFFF;
  --plat-telegram:  #29A9EA;
  --plat-threads:   #FFFFFF;
  --plat-snapchat:  #FFFC00;
  --plat-whatsapp:  #25D366;

  /* --- Typography --- */
  --font-display: 'ChunkFive', 'Rockwell', 'Georgia', serif;
  --font-body:    'GeneralSans', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  --font-mono:    'JetBrainsMono', 'SF Mono', 'Consolas', monospace;

  /* fluid scale */
  --fs-hero:     clamp(2.55rem, 11.05vw, 9.35rem);
  --fs-display:  clamp(2.75rem, 7vw, 5.5rem);
  --fs-h2:       clamp(1.75rem, 4vw, 3rem);
  --fs-h3:       clamp(1.25rem, 2.4vw, 1.75rem);
  --fs-eyebrow:  0.6875rem;
  --fs-body:     clamp(1rem, 1.05vw, 1.0625rem);
  --fs-body-lg:  clamp(1.125rem, 1.3vw, 1.25rem);
  --fs-small:    0.8125rem;
  --fs-micro:    0.625rem;

  /* weights */
  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semibold: 600;

  /* line-heights */
  --lh-tight:   0.92;
  --lh-snug:    1.15;
  --lh-normal:  1.45;
  --lh-relaxed: 1.65;

  /* letter-spacing */
  --tr-hero:     -0.02em;
  --tr-display:  -0.015em;
  --tr-body:     -0.005em;
  --tr-eyebrow:  0.18em;
  --tr-mono:     0.02em;

  /* --- Spacing (modular 4px base) --- */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   24px;
  --space-6:   32px;
  --space-7:   48px;
  --space-8:   64px;
  --space-9:   96px;
  --space-10:  128px;
  --space-section: clamp(5rem, 11vw, 9rem);
  --container-max: 1440px;
  --container-pad: clamp(1.25rem, 4vw, 3rem);

  /* --- Timing --- */
  --ease-out:       cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out-soft:  cubic-bezier(0.25, 0.8, 0.4, 1);
  --ease-in-out:    cubic-bezier(0.6, 0, 0.4, 1);
  --dur-xs:  120ms;
  --dur-sm:  200ms;
  --dur-md:  400ms;
  --dur-lg:  700ms;
  --dur-xl:  1100ms;

  /* --- Elevation --- */
  --shadow-soft: 0 10px 40px rgba(0,0,0,0.45);
  --shadow-red:  0 0 0 1px rgba(213,43,30,0.3), 0 10px 40px rgba(213,43,30,0.18);

  /* misc */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-pill: 999px;
}
