/**
 * ALFA-WIN design tokens
 * Single source of truth for color, typography, spacing, and motion.
 * WCAG 2.2 AA contrast targets against --color-bg-primary / --color-bg-card.
 */

:root {
  /* ——— Surfaces ——— */
  --color-bg-primary: #0a0e1a;
  --color-bg-secondary: #101827;
  --color-bg-card: #1a2332;
  --color-bg-card-hover: #243044;
  --color-bg-elevated: #1e2a3d;

  /* ——— Brand (primary tuned for ≥4.5:1 on bg-card) ——— */
  --color-primary: #4b8ff8;
  --color-primary-hover: #2563eb;
  --color-primary-light: #60a5fa;
  --color-primary-dark: #1d4ed8;
  --color-primary-soft: #93c5fd;

  /* ——— Semantic ——— */
  --color-success: #10b981;
  --color-success-light: #34d399;
  --color-success-dark: #059669;
  --color-warning: #f59e0b;
  --color-warning-light: #fbbf24;
  --color-error: #ef4444;

  /* ——— CTA (green buttons — fills chosen for white text ≥4.5:1) ——— */
  --color-cta-from: #15803d;
  --color-cta-mid: #166534;
  --color-cta-to: #14532d;
  --gradient-cta: linear-gradient(135deg, var(--color-cta-from), var(--color-cta-mid), var(--color-cta-to));
  --gradient-brand-text: linear-gradient(135deg, var(--color-primary-light), var(--color-primary-soft), #818cf8);
  --gradient-brand-text-alt: linear-gradient(135deg, var(--color-primary-soft), var(--color-primary-light), var(--color-primary-hover));

  /* ——— Button fills (white label text ≥4.5:1) ——— */
  --color-btn-primary: #2563eb;
  --color-btn-primary-hover: #1d4ed8;
  --gradient-btn-primary: linear-gradient(135deg, var(--color-btn-primary) 0%, var(--color-btn-primary-hover) 100%);
  --gradient-btn-primary-hover: linear-gradient(135deg, var(--color-btn-primary) 0%, #1e40af 100%);

  /* ——— Text (AA ≥ 4.5:1 on bg-primary / bg-card) ——— */
  --color-text-primary: #f1f5f9;   /* ~15:1 on bg-primary */
  --color-text-secondary: #cbd5e1; /* ~11:1 on bg-primary */
  --color-text-muted: #94a3b8;     /* ~7:1 — was #64748b (~4.0:1, failed AA) */
  --color-text-faint: #a8b4c4;     /* ~8:1 — replaces rgba(255,255,255,0.4–0.55) body copy */
  --color-text-inverse: #ffffff;
  --color-text-link: var(--color-primary-light);
  --color-text-link-hover: var(--color-primary);

  /* ——— Borders / glass ——— */
  --color-border: rgba(255, 255, 255, 0.06);
  --color-border-light: rgba(255, 255, 255, 0.1);
  --color-border-focus: rgba(75, 143, 248, 0.4);
  --color-glass: rgba(15, 23, 42, 0.7);
  --color-glass-strong: rgba(15, 23, 42, 0.9);

  /* ——— Brand alpha ladder ——— */
  --color-primary-a03: rgba(75, 143, 248, 0.03);
  --color-primary-a06: rgba(75, 143, 248, 0.06);
  --color-primary-a08: rgba(75, 143, 248, 0.08);
  --color-primary-a10: rgba(75, 143, 248, 0.1);
  --color-primary-a15: rgba(75, 143, 248, 0.15);
  --color-primary-a20: rgba(75, 143, 248, 0.2);
  --color-primary-a25: rgba(75, 143, 248, 0.25);
  --color-primary-a30: rgba(75, 143, 248, 0.3);
  --color-primary-a40: rgba(75, 143, 248, 0.4);

  /* ——— White alpha (decorative only; use text-* for copy) ——— */
  --color-white-a04: rgba(255, 255, 255, 0.04);
  --color-white-a06: rgba(255, 255, 255, 0.06);
  --color-white-a08: rgba(255, 255, 255, 0.08);
  --color-white-a10: rgba(255, 255, 255, 0.1);
  --color-white-a12: rgba(255, 255, 255, 0.12);
  --color-white-a15: rgba(255, 255, 255, 0.15);
  --color-white-a20: rgba(255, 255, 255, 0.2);

  /* ——— Typography: families ——— */
  --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display: 'Montserrat', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-logo: 'Montserrat', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ——— Typography: scale (consolidates ~89 rem micro-variants) ——— */
  --text-2xs: 0.68rem;   /* badges / eyebrows */
  --text-xs: 0.75rem;    /* labels */
  --text-sm: 0.85rem;    /* secondary UI (was 0.82–0.88) */
  --text-md: 0.9rem;     /* default UI copy */
  --text-lg: 0.95rem;    /* section subcopy */
  --text-xl: 1.1rem;     /* logo / emphasis */
  --text-2xl: 1.2rem;
  --text-3xl: 1.5rem;
  --text-4xl: clamp(1.6rem, 3.5vw, 2.5rem); /* h2 */
  --text-5xl: clamp(2.2rem, 5vw, 3.5rem);   /* h1 */

  /* ——— Typography: weights & leading ——— */
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;
  --font-weight-black: 900;
  --leading-none: 1;
  --leading-tight: 1.1;
  --leading-snug: 1.35;
  --leading-normal: 1.6;
  --leading-relaxed: 1.7;
  --leading-loose: 1.75;

  /* ——— Spacing ——— */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --spacing-2xl: 48px;
  --spacing-3xl: 64px;
  --spacing-4xl: 96px;

  /* ——— Radius ——— */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* ——— Shadows ——— */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 24px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 12px 48px rgba(0, 0, 0, 0.5);
  --shadow-glow: 0 4px 30px rgba(75, 143, 248, 0.15);
  --shadow-glow-strong: 0 8px 40px rgba(75, 143, 248, 0.25);

  /* ——— Motion ——— */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.3s cubic-bezier(0.22, 1, 0.36, 1);
  --transition-slow: 0.5s cubic-bezier(0.22, 1, 0.36, 1);

  /* ——— Layout ——— */
  --max-width: 1200px;

  /* ——— Legacy aliases (inline styles / older class names) ——— */
  --color-gold: var(--color-primary);
  --color-gold-light: var(--color-primary-light);
  --color-gold-dark: var(--color-primary-dark);
  --color-green: var(--color-success);
  --color-green-light: var(--color-success-light);
  --color-green-dark: var(--color-success-dark);
}
