:root {
  /* Brand Palette (Figma Exact Light Values) */
  --purple-50:  #F5F3FF;
  --purple-100: #EDE9FE;
  --purple-200: #DDD6FE;
  --purple-300: #C4B5FD;
  --purple-400: #A78BFA;
  --purple-500: #8B5CF6;
  --purple-600: #7C3AED;  /* Primary Brand Color */
  --purple-700: #6D28D9;
  --purple-800: #5B21B6;
  --purple-900: #4C1D95;

  --cyan-50:  #ECFEFF;
  --cyan-100: #CFFAFE;
  --cyan-200: #A5F3FC;
  --cyan-300: #67E8F9;
  --cyan-400: #22D3EE;
  --cyan-500: #06B6D4;
  --cyan-600: #0891B2;

  /* Neutrals */
  --neutral-0:    #FFFFFF;
  --neutral-50:   #F8FAFC;
  --neutral-100:  #F1F5F9;
  --neutral-200:  #E2E8F0;
  --neutral-300:  #CBD5E1;
  --neutral-400:  #94A3B8;
  --neutral-500:  #64748B;
  --neutral-600:  #475569;
  --neutral-700:  #334155;
  --neutral-800:  #1E293B;
  --neutral-900:  #0F172A;

  /* Light Theme System Tokens */
  --bg-light:         #FFFFFF;
  --bg-light-alt:     #F8FAFC;
  --surface-light:    #FFFFFF;
  --border-light:     #E2E8F0;
  --text-main:        #0F172A;
  --text-sub:         #475569;
  --text-muted:       #64748B;

  /* Typography Fonts */
  --font-heading: 'Outfit', 'Montserrat', system-ui, -apple-system, sans-serif;
  --font-body:    'Inter', 'Roboto', system-ui, -apple-system, sans-serif;

  /* Fluid Font Sizes (Mobile -> Desktop) */
  --fs-display: clamp(2rem, 1.5rem + 2.5vw, 4.5rem);   /* 32px -> 72px */
  --fs-h1:      clamp(2rem, 1.3rem + 2vw, 3.5rem);      /* 32px -> 56px */
  --fs-h2:      clamp(1.75rem, 1.35rem + 1.06vw, 2.25rem);  /* 28px -> 36px */
  --fs-h3:      clamp(1.375rem, 1.1rem + 0.73vw, 1.75rem);  /* 22px -> 28px */
  --fs-h4:      clamp(1.125rem, 0.95rem + 0.46vw, 1.375rem);/* 18px -> 22px */
  --fs-h5:      clamp(1rem, 0.9rem + 0.27vw, 1.125rem);     /* 16px -> 18px */
  --fs-h6:      clamp(0.875rem, 0.8rem + 0.2vw, 1rem);      /* 14px -> 16px */

  --fs-lead:    clamp(1.125rem, 1rem + 0.33vw, 1.25rem);     /* 18px -> 20px */
  --fs-body:    1rem;                                         /* 16px */
  --fs-sm:      0.875rem;                                     /* 14px */
  --fs-xs:      0.75rem;                                      /* 12px */

  /* Line Heights */
  --lh-h1: 1.15;
  --lh-h2: 1.2;
  --lh-h3: 1.3;
  --lh-h4: 1.35;
  --lh-body: 1.6;

  /* Font Weights */
  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semibold: 600;
  --fw-bold:    700;
  --fw-extrabold: 800;

  /* Spacing */
  --spacing-1: 4px;
  --spacing-2: 8px;
  --spacing-4: 16px;
  --spacing-6: 24px;
  --spacing-8: 32px;
  --spacing-12: 48px;
  --spacing-16: 64px;

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

  /* Z-Index */
  --z-header: 1000;
}