:root {
  --color-primary: #2563eb;
  --color-primary-light: #5b8def;
  --color-primary-dark: #1e3a5f;
  --color-primary-soft: #eaf2ff;
  --color-primary-soft-2: #dbe8ff;
  --color-background: #ffffff;
  --color-background-alt: #f6f8fb;
  --color-surface: #ffffff;
  --color-text: #172033;
  --color-text-muted: #667085;
  --color-border: #e5eaf1;
  --color-footer: #0d2242;
  --gradient-primary: linear-gradient(135deg, #2f6df0 0%, #1e3a5f 100%);
  --gradient-soft: linear-gradient(160deg, #eef4ff 0%, #ffffff 60%);
  --gradient-footer: linear-gradient(160deg, #123361 0%, #0a1c38 100%);
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --shadow-sm: 0 8px 24px rgba(16, 39, 70, 0.08);
  --shadow-md: 0 16px 36px rgba(16, 39, 70, 0.12);
  --shadow-glow: 0 18px 40px rgba(37, 99, 235, 0.16);
  --container-width: 1140px;
  --transition: 200ms ease;
}