/* =============================================
   CLEAR PATH WEB — CSS Variables
   ============================================= */
:root {
  /* Brand Colors */
  --clr-primary: #0057ff;
  --clr-primary-light: #3b82f6;
  --clr-primary-dark: #0041cc;
  --clr-accent: #00e5a0;
  --clr-accent-dark: #00b87d;
  --clr-cyan: #00c4ff;

  /* Dark Background Palette */
  --clr-bg: #050a14;
  --clr-bg-2: #080f1e;
  --clr-bg-3: #0c1526;
  --clr-bg-4: #111c33;
  --clr-surface: #0d1829;
  --clr-surface-2: #13213a;
  --clr-surface-3: #192845;

  /* Text */
  --clr-text: #e8edf5;
  --clr-text-muted: #8a97b0;
  --clr-text-dim: #5a6a85;
  --clr-white: #ffffff;

  /* Gradients */
  --gradient-primary: linear-gradient(135deg, #0057ff 0%, #00c4ff 100%);
  --gradient-accent: linear-gradient(135deg, #00e5a0 0%, #00c4ff 100%);
  --gradient-hero: linear-gradient(135deg, #050a14 0%, #0a1628 50%, #050a14 100%);
  --gradient-card: linear-gradient(145deg, #0d1829 0%, #13213a 100%);
  --gradient-glow-blue: radial-gradient(circle, rgba(0,87,255,0.15) 0%, transparent 70%);
  --gradient-glow-green: radial-gradient(circle, rgba(0,229,160,0.12) 0%, transparent 70%);

  /* Borders */
  --border-subtle: 1px solid rgba(255,255,255,0.06);
  --border-card: 1px solid rgba(0,87,255,0.15);
  --border-accent: 1px solid rgba(0,229,160,0.2);

  /* Spacing */
  --spacing-xs: 0.5rem;
  --spacing-sm: 1rem;
  --spacing-md: 1.5rem;
  --spacing-lg: 2.5rem;
  --spacing-xl: 4rem;
  --spacing-2xl: 6rem;
  --spacing-3xl: 8rem;

  /* Typography */
  --font-primary: 'Plus Jakarta Sans', 'Inter', -apple-system, sans-serif;
  --font-body: 'Inter', -apple-system, sans-serif;

  /* Border Radius */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 32px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-card: 0 8px 32px rgba(0,0,0,0.4);
  --shadow-glow-blue: 0 0 30px rgba(0,87,255,0.3), 0 0 60px rgba(0,87,255,0.1);
  --shadow-glow-green: 0 0 30px rgba(0,229,160,0.25), 0 0 60px rgba(0,229,160,0.08);
  --shadow-glow-cyan: 0 0 30px rgba(0,196,255,0.25);

  /* Transitions */
  --transition-fast: 0.2s ease;
  --transition-smooth: 0.35s cubic-bezier(0.25,0.46,0.45,0.94);
  --transition-bounce: 0.5s cubic-bezier(0.34,1.56,0.64,1);

  /* Z-index */
  --z-navbar: 1000;
  --z-modal: 2000;
  --z-overlay: 900;
}