:root {
  /* Warm light palette — cream surfaces + muted earthy accents */
  --color-bg: #f6f1e9;
  --color-bg-elevated: #fffdf8;
  --color-bg-card: #fffdfa;
  --color-bg-card-hover: #fbf5ec;
  --color-glass: #fffdf9;
  --color-glass-border: rgba(95, 75, 55, 0.16);

  --color-accent: #a85d42;
  --color-accent-light: #c07d5f;
  --color-accent-glow: rgba(168, 93, 66, 0.22);
  --color-cyan: #5f8a82;
  --color-cyan-glow: rgba(95, 138, 130, 0.22);
  --color-magenta: #b06a82;
  --color-magenta-glow: rgba(176, 106, 130, 0.22);
  --color-gold: #b07d22;
  --color-gold-glow: rgba(176, 125, 34, 0.2);

  --color-neon-green: #4e9a6a;
  --color-neon-green-dark: #3d7d54;
  --color-neon-green-glow: rgba(78, 154, 106, 0.3);
  --color-cta-red: #c0584a;
  --color-cta-red-dark: #a5412f;

  --color-text: #2c2620;
  --color-text-muted: #6f6457;
  --color-text-dim: #9a8d7d;

  /* Typography */
  --font-display: 'Orbitron', sans-serif;
  --font-hindi: 'Hind', 'Noto Sans Devanagari', sans-serif;
  --font-body: 'Hind', sans-serif;
  --font-size-base: 17px;
  --font-size-sm: 0.8125rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.375rem;
  --font-size-2xl: clamp(1.5rem, 4vw, 2rem);
  --font-size-3xl: clamp(2rem, 6vw, 3rem);

  /* Spacing */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-section: clamp(4rem, 10vw, 7rem);

  /* Layout */
  --container-max: 1140px;
  --radius-sm: 10px;
  --radius-card: 16px;
  --radius-lg: 24px;
  --radius-full: 9999px;

  /* Effects */
  --shadow-soft: 0 8px 32px rgba(80, 60, 40, 0.12);
  --shadow-glow: 0 0 40px var(--color-accent-glow);
  --blur-glass: 12px;

  --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 0s;
    --transition-base: 0s;
  }
}

@media (max-width: 767px) {
  :root {
    --font-size-base: 16px;
    --font-size-lg: 1rem;
    --font-size-xl: 1.125rem;
    --space-sm: 0.875rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2.25rem;
    --space-section: 3.5rem;
    --radius-card: 14px;
    --radius-lg: 18px;
  }
}

@media (max-width: 360px) {
  :root {
    --font-size-base: 15.5px;
    --space-sm: 0.75rem;
    --space-section: 3rem;
  }
}
