/* ═══════════════════════════════════════════════════════════
   ADCEL — Design Tokens
   Solar Flare palette (Energetic Light Mode)
═══════════════════════════════════════════════════════════ */

:root {
  /* ── Colors ─────────────────────────── */
  --clr-bg:          #FAF8F2; /* Soft warm cream */
  --clr-surface:     #FFFFFF; /* Pure white */
  --clr-surface-2:   #F3F1EA; /* Slightly darker cream for cards */
  --clr-border:      rgba(0, 0, 0, 0.08);
  --clr-border-hov:  rgba(250, 204, 21, 0.8); /* Yellow border */

  --clr-blue:        #FACC15; /* Re-mapped to Yellow for legacy var names */
  --clr-cyan:        #FDE047; /* Lighter yellow */
  --clr-violet:      #F97316; /* Re-mapped to Orange */
  --clr-magenta:     #EF4444; /* Vibrant Red */

  --clr-text-1:      #0F172A; /* Deep charcoal */
  --clr-text-2:      #334155; /* Slate gray */
  --clr-text-3:      #64748B; /* Lighter gray */
  --clr-text-ghost:  #CBD5E1; /* Very light gray for huge numbers */

  --clr-glass:       rgba(255, 255, 255, 0.5);
  --clr-glass-hov:   rgba(255, 255, 255, 0.8);

  /* ── Gradients ───────────────────────── */
  --grad-accent:   linear-gradient(135deg, var(--clr-blue), var(--clr-violet), var(--clr-magenta));
  --grad-blue-vi:  linear-gradient(135deg, var(--clr-blue), var(--clr-violet));
  --grad-hero-glow: radial-gradient(ellipse at 20% 60%, rgba(250, 204, 21, 0.4) 0%, transparent 60%),
                    radial-gradient(ellipse at 80% 20%, rgba(249, 115, 22, 0.3) 0%, transparent 60%);
  --grad-text:     linear-gradient(135deg, #EAB308 0%, #EA580C 50%, #DC2626 100%);

  /* ── Typography ──────────────────────── */
  --font-display:  'Clash Display', 'Inter', sans-serif;
  --font-body:     'Inter', system-ui, sans-serif;
  --font-ui:       'Space Grotesk', system-ui, sans-serif;

  --text-hero:    clamp(3.25rem, 8.5vw, 8.5rem);
  --text-display: clamp(2rem, 4.5vw, 4.5rem);
  --text-title:   clamp(1.25rem, 2.5vw, 2rem);
  --text-body:    clamp(0.9375rem, 1.1vw, 1.0625rem);
  --text-sm:      0.8125rem;
  --text-xs:      0.6875rem;

  --lh-tight:   1.08;
  --lh-snug:    1.25;
  --lh-normal:  1.6;
  --lh-loose:   1.75;

  /* ── Spacing ─────────────────────────── */
  --space-1:   0.25rem;
  --space-2:   0.5rem;
  --space-3:   0.75rem;
  --space-4:   1rem;
  --space-6:   1.5rem;
  --space-8:   2rem;
  --space-12:  3rem;
  --space-16:  4rem;
  --space-24:  6rem;
  --space-32:  8rem;
  --space-40:  10rem;

  /* ── Layout ──────────────────────────── */
  --max-w:        1280px;
  --section-px:   clamp(1.25rem, 5vw, 5rem);
  --section-py:   clamp(5rem, 10vw, 9rem);
  --nav-h:        72px;
  --radius-sm:    8px;
  --radius-md:    14px;
  --radius-lg:    20px;
  --radius-xl:    28px;
  --radius-full:  9999px;

  /* ── Shadows / Glows ─────────────────── */
  --glow-blue:   0 0 40px rgba(250,204,21,0.4), 0 0 80px rgba(250,204,21,0.2);
  --glow-violet: 0 0 40px rgba(249,115,22,0.4), 0 0 80px rgba(249,115,22,0.2);
  --shadow-card: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 10px 15px -3px rgba(0, 0, 0, 0.05);

  /* ── Transitions ─────────────────────── */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast:    160ms;
  --dur-med:     320ms;
  --dur-slow:    600ms;
}