:root {
  /* ─── Brand Colors ─── */
  --blue-50: #EBF5FF;
  --blue-100: #D1E9FF;
  --blue-200: #A3D3FF;
  --blue-300: #5FB3F5;
  --blue-400: #2E96E6;
  --blue-500: #0B6EC5;
  --blue-600: #085BA3;
  --blue-700: #064A85;
  --blue-800: #0A2540;
  --blue-900: #071A2E;

  --primary: var(--blue-500);
  --primary-hover: var(--blue-600);
  --primary-light: var(--blue-50);
  --primary-dark: var(--blue-800);

  /* ─── Neutrals ─── */
  --white: #FFFFFF;
  --gray-50: #F8FAFB;
  --gray-100: #F1F4F8;
  --gray-200: #E2E8F0;
  --gray-300: #CBD5E1;
  --gray-400: #94A3B8;
  --gray-500: #64748B;
  --gray-600: #4A5568;
  --gray-700: #334155;
  --gray-800: #1E293B;
  --gray-900: #1A1A2E;

  /* ─── Semantic ─── */
  --text-heading: var(--gray-900);
  --text-body: var(--gray-600);
  --text-muted: var(--gray-400);
  --text-on-dark: var(--white);
  --text-on-primary: var(--white);

  --bg-primary: var(--white);
  --bg-secondary: var(--gray-50);
  --bg-dark: var(--blue-800);
  --bg-card: var(--white);

  --border-color: var(--gray-200);
  --border-light: var(--gray-100);

  /* ─── Typography ─── */
  --font-heading: 'Manrope', sans-serif;
  --font-body: 'Source Sans 3', sans-serif;

  --text-xs: clamp(0.75rem, 0.7rem + 0.15vw, 0.8125rem);
  --text-sm: clamp(0.8125rem, 0.78rem + 0.2vw, 0.9375rem);
  --text-base: clamp(0.9375rem, 0.9rem + 0.2vw, 1.0625rem);
  --text-lg: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);
  --text-xl: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
  --text-2xl: clamp(1.5rem, 1.3rem + 0.8vw, 2rem);
  --text-3xl: clamp(1.875rem, 1.5rem + 1.2vw, 2.5rem);
  --text-4xl: clamp(2.25rem, 1.8rem + 1.5vw, 3.25rem);

  --leading-tight: 1.2;
  --leading-snug: 1.35;
  --leading-normal: 1.6;
  --leading-relaxed: 1.75;

  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;
  --tracking-wider: 0.08em;

  /* ─── Spacing ─── */
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;
  --space-section: clamp(4rem, 3rem + 4vw, 7.5rem);

  /* ─── Layout ─── */
  --container-max: 1200px;
  --container-narrow: 800px;
  --container-pad: clamp(1.25rem, 1rem + 2vw, 3rem);

  /* ─── Radius ─── */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* ─── Shadows ─── */
  --shadow-sm: 0 1px 3px rgba(10, 37, 64, 0.06);
  --shadow-md: 0 4px 16px rgba(10, 37, 64, 0.08);
  --shadow-lg: 0 8px 32px rgba(10, 37, 64, 0.1);
  --shadow-xl: 0 16px 48px rgba(10, 37, 64, 0.12);

  /* ─── Transitions ─── */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 150ms;
  --duration-normal: 300ms;
  --duration-slow: 500ms;

  /* ─── Hero Gradient ─── */
  --gradient-hero: linear-gradient(135deg, #0A2540 0%, #0B6EC5 40%, #2E96E6 65%, #1B8AC4 100%);
  --gradient-hero-overlay: linear-gradient(180deg, rgba(10,37,64,0.3) 0%, rgba(11,110,197,0.1) 100%);
}