/* ──────────────── DESIGN TOKENS ──────────────── */

:root {
  /* ------------ FONT SIZE ---------*/
  --fontSize-h1: clamp(60px, 4.5vw, 104px);
  --fontSize-h2: clamp(28px, 3.5vw, 64px);
  --fontSize-h3: clamp(22px, 2vw, 32px);
  --fontSize-h4: clamp(14px, 2vw, 20px);
  --fontSize-p: clamp(18px, 1.6vw, 26px);

  --lineHeight-h1: 1.3;
  --lineHeight-h2: 1.4;
  --lineHeight-h3: 1.8;
  --lineHeight-h4: 1.4;
  --lineHeight-p: 1.75;

  /* ------------ SPACING ------------ */
  --marginBottom: 30px;
  --marginBottomh4: 15px;

  /* ------------ FONT FAMILIES ------------ */
  --font-mono: "Space Mono", monospace;
  --font-sans: "Manrope", sans-serif;

  /* ------------ COLORS — brand palette ------------ */
  --color-primary: #4332c7;
  --color-primary-light: #5a7bff;
  --color-accent-purple: #b44df4;
  --color-accent-red: #a8424f;
  --color-accent-orange: #aa4619;
  --color-accent-gold: #cf852a;

  /* ------------ COLORS — neutral ------------ */
  --color-bg: #000;
  --color-bg-light: #ececec;
  --color-bg-card: #111;
  --color-bg-card-media: #1a1a1a;
  --color-bg-disabled: #7e7e7e;
  --color-text: white;
  --color-text-dark: #222;
  --color-text-muted: #333;
  --color-border-muted: rgba(255, 255, 255, 0.6);
  --color-border-subtle: rgba(255, 255, 255, 0.15);

}