/* ==========================================================================
   IGNITE TECHNOLOGY GROUP - PRISM FRAMER-INSPIRED DESIGN SYSTEM
   Ultra-smooth, clean, minimal dark aesthetic with iridescent aurora accents
   ========================================================================== */

:root {
  /* Surfaces */
  --bg-darkest: #000000;
  --bg-dark: #02040a;
  --bg-card: rgba(8, 14, 30, 0.75);
  --bg-card-hover: rgba(14, 24, 52, 0.9);
  --bg-pill-nav: rgba(4, 8, 18, 0.88);
  --bg-glass-input: rgba(8, 16, 32, 0.7);

  /* Ignite Brand Signature Palette (Matched to User Logo & Fluted Texture) */
  --ignite-midnight: #02040a;
  --ignite-midnight-surface: #050914;
  --ignite-midnight-card: #081022;
  --ignite-blue-deep: #1e3a8a;
  --ignite-blue: #2563eb;
  --ignite-sapphire: #1d4ed8;
  --ignite-cyan: #38bdf8;
  --ignite-teal: #00bfa5;
  --ignite-emerald: #10b981;
  --ignite-purple: #9333ea;
  --ignite-lilac: #c084fc;
  --ignite-amber: #f59e0b;
  --ignite-gold: #fbbf24;

  /* Spectrum Aurora Accent Palette (Matched to User Visual Identity) */
  --color-amber: #f59e0b;
  --color-amber-light: #fbbf24;
  --color-amber-glow: rgba(245, 158, 11, 0.35);

  --color-purple: #9333ea;
  --color-purple-light: #c084fc;
  --color-purple-glow: rgba(147, 51, 234, 0.4);

  --color-blue: #2563eb;
  --color-blue-light: #38bdf8;
  --color-blue-glow: rgba(37, 99, 235, 0.4);

  --color-teal: #00bfa5;
  --color-teal-light: #22d3ee;
  --color-teal-glow: rgba(0, 191, 165, 0.4);

  --color-emerald: #10b981;
  --color-emerald-light: #34d399;

  /* Gradients */
  --gradient-aurora: linear-gradient(135deg, #fbbf24 0%, #a855f7 35%, #2563eb 70%, #00bfa5 100%);
  --gradient-accent: linear-gradient(90deg, #fbbf24 0%, #c084fc 35%, #38bdf8 70%, #00bfa5 100%);
  --gradient-ignite-star: linear-gradient(135deg, #fbbf24 0%, #c084fc 35%, #38bdf8 70%, #00bfa5 100%);
  --gradient-ignite-aura: radial-gradient(ellipse 65% 50% at 15% 25%, rgba(30, 64, 175, 0.28) 0%, transparent 70%),
                         radial-gradient(ellipse 60% 50% at 85% 70%, rgba(4, 120, 87, 0.22) 0%, transparent 70%);
  --gradient-ignite-ribbed: repeating-linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.015) 0px,
    rgba(255, 255, 255, 0.015) 1px,
    transparent 1px,
    transparent 38px
  );
  --gradient-primary-btn: linear-gradient(135deg, #1d4ed8 0%, #2563eb 50%, #00bfa5 100%);
  --gradient-primary-btn-hover: linear-gradient(135deg, #2563eb 0%, #38bdf8 50%, #10b981 100%);
  --gradient-card-border: linear-gradient(135deg, rgba(56, 189, 248, 0.3) 0%, rgba(255, 255, 255, 0.04) 50%, rgba(0, 191, 165, 0.3) 100%);

  /* Text Colors */
  --text-primary: #f8fafc;
  --text-secondary: #94a3b8;
  --text-muted: #64748b;
  --text-white: #ffffff;
  --text-highlight: #e2e8f0;

  /* Borders */
  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-glass: rgba(56, 189, 248, 0.15);
  --border-focus: rgba(0, 191, 165, 0.6);

  /* Typography */
  --font-display: 'Outfit', 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-heading: 'Outfit', 'Plus Jakarta Sans', 'Geist', sans-serif;
  --font-body: 'Plus Jakarta Sans', 'Geist', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'Geist Mono', 'JetBrains Mono', monospace;

  /* Layout */
  --container-width: 1180px;
  --container-fluid: 1360px;

  /* Radii */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-full: 9999px;

  /* Smooth Physics Easing Transitions */
  --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-bounce: 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}