/* ============================================================
   DESIGN TOKENS — single source of truth for all values
   ============================================================ */
:root {
  /* Colors */
  --color-primary:       #2563eb;
  --color-primary-dark:  #1d4ed8;
  --color-purple:        #7c3aed;
  --color-teal:          #0d9488;
  --color-success:       #16a34a;
  --color-warning:       #d97706;
  --color-danger:        #dc2626;
  --color-rose:          #e11d48;

  /* Text */
  --color-text:          #0f172a;
  --color-text-muted:    #64748b;
  --color-text-subtle:   #94a3b8;

  /* Surfaces */
  --color-bg:            #ffffff;
  --color-bg-alt:        #f8fafc;
  --color-border:        #e2e8f0;
  --color-border-strong: #cbd5e1;

  /* Gradients */
  --gradient-primary: linear-gradient(135deg, var(--color-primary) 0%, var(--color-purple) 100%);
  --gradient-hero:    linear-gradient(160deg, #f0f7ff 0%, #fafbff 50%, #f5f0ff 100%);

  /* Shadows */
  --shadow-sm:    0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.05);
  --shadow-md:    0 4px 6px rgba(0,0,0,.05), 0 10px 15px rgba(0,0,0,.05);
  --shadow-lg:    0 8px 32px rgba(37,99,235,.12);
  --shadow-xl:    0 20px 60px rgba(37,99,235,.1);
  --shadow-focus: 0 0 0 3px rgba(37,99,235,.25);

  /* Border radius */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   14px;
  --radius-xl:   20px;
  --radius-full: 9999px;

  /* Spacing scale */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* Typography */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-size-xs:   0.75rem;
  --font-size-sm:   0.875rem;
  --font-size-base: 1rem;
  --font-size-lg:   1.125rem;
  --font-size-xl:   1.25rem;
  --font-size-2xl:  1.5rem;
  --font-size-3xl:  1.875rem;
  --font-size-4xl:  2.25rem;
  --font-size-5xl:  3rem;

  /* Line heights */
  --leading-tight:  1.2;
  --leading-snug:   1.375;
  --leading-normal: 1.6;
  --leading-relaxed: 1.75;

  /* Layout */
  --container-max:    1140px;
  --container-narrow: 720px;
  --nav-height:       64px;

  /* Transitions */
  --transition-fast:   150ms ease;
  --transition-normal: 200ms ease;
  --transition-slow:   300ms ease;
}