:root {
  /* ========================================
     NEON MINIMALISM COLOR PALETTE
  ======================================== */

  /* Background Colors */
  --color-bg: #0a0e1a;
  --color-bg-secondary: #0f1628;
  --color-bg-tertiary: #141b2d;
  --color-bg-card: rgba(255, 255, 255, 0.05);
  --color-bg-header: rgba(10, 14, 26, 0.8);
  --color-bg-header-scroll: rgba(10, 14, 26, 0.95);

  /* Neon Accent Colors */
  --neon-blue: #00d4ff;
  --neon-blue-rgb: 0, 212, 255;
  --neon-cyan: #00ffc8;
  --neon-cyan-rgb: 0, 255, 200;
  --neon-yellow: #ffd700;
  --neon-yellow-rgb: 255, 215, 0;
  --neon-pink: #ff00ff;
  --neon-pink-rgb: 255, 0, 255;
  --neon-green: #00ff88;
  --neon-green-rgb: 0, 255, 136;
  --neon-red: #ff4757;
  --neon-red-rgb: 255, 71, 87;
  --neon-gold: #ffd700;

  /* Primary colors (alias for neon-blue) */
  --color-primary: var(--neon-blue);
  --color-primary-rgb: var(--neon-blue-rgb);

  /* Text Colors */
  --color-text: #ffffff;
  --color-text-secondary: #8892b0;
  --color-text-muted: #7a8ba8;

  /* Glassmorphism */
  --glass-bg: rgba(255, 255, 255, 0.05);
  --glass-border: rgba(255, 255, 255, 0.1);
  --glass-border-hover: rgba(255, 255, 255, 0.2);

  /* Gradients */
  --gradient-hero-text: linear-gradient(135deg, #ffffff 0%, var(--neon-blue) 100%);
  --gradient-bg: linear-gradient(180deg, var(--color-bg) 0%, var(--color-bg-secondary) 100%);
  --gradient-neon: linear-gradient(135deg, var(--neon-blue) 0%, var(--neon-cyan) 100%);
  --gradient-gold: linear-gradient(135deg, var(--neon-yellow) 0%, #ffaa00 100%);
  --gradient-text: linear-gradient(135deg, #ffffff 0%, var(--neon-cyan) 100%);

  /* Typography */
  --font-main: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-heading: var(--font-main);

  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.4vw, 1rem);
  --text-base: clamp(1rem, 0.9rem + 0.5vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.6vw, 1.25rem);
  --text-xl: clamp(1.25rem, 1.1rem + 0.75vw, 1.5rem);
  --text-2xl: clamp(1.5rem, 1.3rem + 1vw, 2rem);
  --text-3xl: clamp(2rem, 1.7rem + 1.5vw, 2.75rem);
  --text-4xl: clamp(2.5rem, 2rem + 2.5vw, 4rem);
  --text-5xl: clamp(3rem, 2.5rem + 3vw, 5rem);

  /* Spacing */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;

  /* Layout */
  --container-max: 1200px;
  --container-wide: 1400px;
  --header-height: 80px;

  /* Border Radius */
  --radius-sm: 6px;
  --radius: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-2xl: 32px;
  --radius-full: 9999px;

  /* Shadows & Glows */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 8px 32px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.6);
  --shadow-lift: 0 20px 40px rgba(0, 0, 0, 0.4);

  --glow-blue: 0 0 20px rgba(var(--neon-blue-rgb), 0.5);
  --glow-blue-strong: 0 0 40px rgba(var(--neon-blue-rgb), 0.7);
  --glow-cyan: 0 0 20px rgba(var(--neon-cyan-rgb), 0.5);
  --glow-yellow: 0 0 20px rgba(var(--neon-yellow-rgb), 0.5);
  --glow-pink: 0 0 20px rgba(var(--neon-pink-rgb), 0.5);

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition: 300ms ease;
  --transition-slow: 500ms ease;
  --transition-bounce: 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55);

  /* Z-index */
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-fixed: 300;
  --z-modal-backdrop: 400;
  --z-modal: 500;
  --z-cursor: 9999;
}
