/* ===================================
   DESIGN TOKENS — Rett Forum 2026
   =================================== */

:root {
  /* --- Brand Colors --- */
  --navy:         #1a2b6d;
  --purple:       #7b4fa0;
  --pink:         #d64fa0;
  --navy-light:   #2a3b7d;
  --purple-light: #9b6fc0;
  --pink-light:   #e87fc0;

  /* --- Extended Gray Palette --- */
  --gray-50:  #f8f9fa;
  --gray-100: #f0f1f3;
  --gray-200: #e2e4e8;
  --gray-300: #c9cdd4;
  --gray-400: #9ca3af;
  --gray-500: #6b7280;
  --gray-600: #4b5563;
  --gray-700: #374151;
  --gray-800: #1f2937;
  --gray-900: #111827;
  --white:    #ffffff;

  /* --- Gradients --- */
  --gradient:        linear-gradient(135deg, var(--navy) 0%, var(--purple) 50%, var(--pink) 100%);
  --gradient-subtle: linear-gradient(135deg, var(--navy) 0%, var(--purple) 100%);
  --gradient-hero:   linear-gradient(135deg, var(--navy) 0%, var(--purple) 45%, var(--pink) 100%);

  /* --- Typography --- */
  --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;

  /* --- Spacing Scale (8px base) --- */
  --space-xs:  0.25rem;  /* 4px  */
  --space-sm:  0.5rem;   /* 8px  */
  --space-md:  1rem;     /* 16px */
  --space-lg:  1.5rem;   /* 24px */
  --space-xl:  2rem;     /* 32px */
  --space-2xl: 3rem;     /* 48px */
  --space-3xl: 4rem;     /* 64px */
  --space-4xl: 6rem;     /* 96px */

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

  /* --- Shadows --- */
  --shadow-sm:  0 1px 3px rgba(26, 43, 109, 0.06);
  --shadow-md:  0 4px 12px rgba(26, 43, 109, 0.08);
  --shadow-lg:  0 8px 24px rgba(26, 43, 109, 0.10);
  --shadow-xl:  0 12px 36px rgba(26, 43, 109, 0.14);
  --shadow-glow: 0 0 20px rgba(214, 79, 160, 0.15);

  /* --- Glassmorphism --- */
  --glass-bg:           rgba(255, 255, 255, 0.7);
  --glass-bg-dark:      rgba(255, 255, 255, 0.08);
  --glass-border:       rgba(255, 255, 255, 0.3);
  --glass-border-dark:  rgba(255, 255, 255, 0.15);
  --glass-blur:         blur(16px);
  --glass-shadow:       0 8px 32px rgba(26, 43, 109, 0.08);
  --glass-hover-bg:     rgba(255, 255, 255, 0.85);
  --glass-hover-blur:   blur(24px);

  /* --- Transitions / Animation Timing --- */
  --ease-out:    cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
  --duration-fast:   150ms;
  --duration-normal: 250ms;
  --duration-slow:   400ms;
  --duration-reveal: 600ms;
}