:root {
  --color-bg: #ffffff;
  --color-surface: #ffffff;
  --color-surface-muted: #f6f9ff;
  --color-navy: #0b2d5c;
  --color-navy-dark: #071f42;
  --color-sidebar: #0b2d5c;
  --color-sidebar-soft: #eaf2ff;
  --color-text: #0a1f3f;
  --color-text-soft: #526783;
  --color-text-faint: #8094af;
  --color-border: #cbddf5;
  --color-primary: #176be7;
  --color-primary-dark: #0e4fae;
  --color-primary-soft: #edf5ff;
  --color-success: #14a673;
  --color-success-soft: #e8f8f2;
  --color-warning: #e79a1b;
  --color-warning-soft: #fff6df;
  --color-danger: #e05252;
  --color-danger-soft: #fff0f0;
  --color-info: #168cc8;
  --color-info-soft: #eaf7fd;

  --font-family: "Poppins", "Segoe UI", Arial, sans-serif;
  --font-size-xs: 0.72rem;
  --font-size-sm: 0.82rem;
  --font-size-base: 0.92rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.15rem;
  --font-size-xl: clamp(1.35rem, 2vw, 1.75rem);
  --font-size-hero: clamp(1.75rem, 3vw, 2.5rem);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;

  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 26px;
  --radius-pill: 999px;
  --shadow-sm: 0 8px 24px rgba(8, 45, 92, 0.065);
  --shadow-md: 0 18px 46px rgba(8, 45, 92, 0.13);
  --shadow-lg: 0 30px 70px rgba(7, 31, 66, 0.2);
  --topbar-height: 82px;
  --content-max: 1720px;
  --transition: 220ms cubic-bezier(0.2, 0.7, 0.2, 1);
}