:root {
  /* ==========================================================================
     COLOR TOKENS - Vibrant, Expressive & High-End Studio Palette
     ========================================================================== */
  /* Vibrant Primary & Accent Palette */
  --color-amber: #F59E0B;
  --color-amber-hover: #D97706;
  --color-amber-light: #FEF3C7;
  
  --color-emerald: #10B981;
  --color-emerald-dark: #059669;
  --color-emerald-light: #D1FAE5;
  
  --color-blue: #3B82F6;
  --color-blue-dark: #1D4ED8;
  --color-blue-light: #EFF6FF;
  
  --color-coral: #F43F5E;
  --color-coral-light: #FFE4E6;
  
  --color-purple: #8B5CF6;
  --color-purple-light: #F3E8FF;

  /* Surfaces & Ink */
  --color-ink: #0F172A;
  --color-ink-muted: #334155;
  --color-ink-light: #64748B;
  --color-surface-bg: #F8FAFC;
  --color-surface-white: #FFFFFF;
  --color-surface-tint: #F1F5F9;
  --color-surface-dark: #0B1120;

  /* Gradients for Visual Wow Effect */
  --gradient-hero-glow: radial-gradient(circle at 50% 20%, rgba(245, 158, 11, 0.18) 0%, rgba(59, 130, 246, 0.12) 35%, transparent 70%);
  --gradient-card-amber: linear-gradient(135deg, rgba(254, 243, 199, 0.6) 0%, rgba(255, 255, 255, 0.9) 100%);
  --gradient-card-emerald: linear-gradient(135deg, rgba(209, 250, 229, 0.6) 0%, rgba(255, 255, 255, 0.9) 100%);
  --gradient-card-blue: linear-gradient(135deg, rgba(239, 246, 255, 0.6) 0%, rgba(255, 255, 255, 0.9) 100%);

  /* Refined Precision Borders */
  --border-thick: 2px solid var(--color-ink);
  --border-medium: 1.5px solid var(--color-ink);
  --border-thin: 1px solid #CBD5E1;
  --border-subtle: 1px solid rgba(15, 23, 42, 0.08);

  /* Sophisticated Studio Shadows */
  --shadow-brutal-sm: 2px 2px 0px var(--color-ink);
  --shadow-brutal: 4px 4px 0px var(--color-ink);
  --shadow-brutal-hover: 6px 6px 0px var(--color-ink);
  --shadow-brutal-lg: 6px 6px 0px var(--color-ink), 0 20px 30px -10px rgba(15, 23, 42, 0.12);
  --shadow-brutal-active: 1px 1px 0px var(--color-ink);

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-full: 9999px;

  /* Typography */
  --font-display: 'Space Grotesk', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Fluid Spacing Scale */
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;

  /* Container Widths */
  --container-max: 1200px;
  --container-narrow: 840px;

  /* Transitions */
  --transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}