:root {
  --font-family-base: "Inter", Arial, sans-serif;

  --color-white: #ffffff;
  --color-white-rgb: 255, 255, 255;
  --color-page: #ffffff;
  --color-surface: #f8fafb;
  --color-surface-muted: #eceff1;
  --color-text: #171717;
  --color-text-strong: #333a48;
  --color-text-muted: #929497;
  --color-heading-muted: #455a64;
  --color-accent: #ed5025;
  --color-footer: #003463;
  --color-menu-dark: #263238;
  --color-section-dark: #37474f;
  --color-gradient-start: #8c3393;
  --color-gradient-end: #f05022;
  --color-focus: #f27b5b;
  --color-border-blue: #d0e5f0;
  --color-link-blue: #0f5b7c;
  --color-title-blue: #206189;
  --color-highlight: #b13976;
  --color-story-accent: #e53eb0;
  --color-control-muted: #cfd8dc;
  --color-success: #35b75d;
  --color-bg-green: #7cb342;
  --color-bg-green-dark: #388e3c;
  --color-bg-yellow: #eee649;

  --radius-sm: 4px;
  --radius-md: 8px;
  --container-mobile: 380px;
  --container-desktop: 1326px;
  --page-desktop: 1920px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 48px;
  --space-9: 56px;
  --space-10: 64px;
  --space-11: 72px;
  --space-12: 80px;

  --text-xs: 12px;
  --text-sm: 14px;
  --text-md: 16px;
  --text-lg: 18px;
  --text-xl: 22px;
  --text-2xl: 32px;
  --text-3xl: 40px;
  --text-4xl: 56px;

  --line-tight: 1.2;
  --line-base: 1.5;
  --line-loose: 1.65;

  --breakpoint-sm: 640px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
  --breakpoint-2xl: 1326px;
}