:root {
  /* Brand colors */
  --color-white: #ffffff;
  --color-off-white: #171b52;
  --color-cream: #eafbfd;
  --color-surface-tint: #f2fbfd;

  --color-charcoal-950: #171b52;
  --color-charcoal-900: #232b75;
  --color-charcoal-800: #000000;
  --color-charcoal-700: #2e3894;
  --color-charcoal-600: #3d47a8;

  --color-accent-900: #0d5266;
  --color-accent-700: #157e9c;
  --color-accent-600: #1fa3c4;
  --color-accent-500: #2cbcde;
  --color-accent-400: #6bd2e8;
  --color-accent-100: #e3f7fc;

  --color-button: #232b75;
  --color-button-hover: #2e3894;
  --color-headline: #232b75;

  --color-orange-600: #232b75;
  --color-orange-500: #2e3894;
  --color-orange-100: #e3f7fc;

  --color-gold-500: #232b75;

  --color-text-primary: #000000;
  --color-text-secondary: #1a1a1a;
  --color-text-muted: #4d4d4d;
  --color-text-on-dark: #ffffff;
  --color-text-on-dark-muted: #d9dcf2;

  --color-border: #d7eef3;
  --color-border-dark: #3d47a8;

  /* Typography */
  --font-heading: "Poppins", "Segoe UI", system-ui, sans-serif;
  --font-body: "Inter", "Segoe UI", system-ui, sans-serif;

  --fs-h1: clamp(2.4rem, 4.4vw + 1rem, 4.2rem);
  --fs-h2: clamp(1.9rem, 2.6vw + 1rem, 3rem);
  --fs-h3: clamp(1.35rem, 1.2vw + 1rem, 1.75rem);
  --fs-lead: clamp(1.1rem, 0.6vw + 1rem, 1.35rem);
  --fs-body: 1.05rem;
  --fs-small: 0.9rem;

  /* Spacing scale */
  --space-2xs: 0.4rem;
  --space-xs: 0.75rem;
  --space-sm: 1.25rem;
  --space-md: 2rem;
  --space-lg: 3.25rem;
  --space-xl: 5rem;
  --space-2xl: 7.5rem;

  --container-max: 1240px;
  --container-pad: clamp(1.25rem, 4vw, 2.5rem);

  /* Shape */
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  /* Shadow */
  --shadow-sm: 0 2px 10px rgba(23, 27, 82, 0.07);
  --shadow-md: 0 12px 32px rgba(23, 27, 82, 0.12);
  --shadow-lg: 0 24px 60px rgba(23, 27, 82, 0.18);
  --shadow-btn: 0 10px 24px rgba(35, 43, 117, 0.32);

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 180ms;
  --dur-mid: 360ms;
  --dur-slow: 640ms;
}
