:root {
  --font-sans: 'GT-America-Standard', sans-serif;
  --font-sans-condensed: 'GT-America-Condensed', sans-serif;
  --font-symbol: 'Material Symbols Outlined';

  --font-xs: 0.75rem;
  --font-sm: 0.875rem;
  --font-base: 1rem;
  --font-lg: 1.125rem;
  --font-xl: 1.25rem;
  --font-2xl: 1.5rem;
  --font-3xl: 1.875rem;
  --font-4xl: 2.25rem;
  --font-5xl: 3rem;
  --font-6xl: 3.75rem;
  --font-7xl: 4.5rem;

  --font-regular: 400;
  --font-text: 450;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;
  --font-black: 900;

  --font-normal: normal;
  --font-italic: italic;

  --leading-none: 1;
  --leading-tight: 1.15;
  --leading-snug: 1.375;
  --leading-base: 1.5;

  --max-w-base: 2560px;
  --max-w-sm: 540px;
  --max-w-md: 720px;
  --max-w-lg: 960px;
  --max-w-xl: 1140px;
  --max-w-xxl: 1320px;
  --max-w-full: 100%;

  --base-0: 255, 255, 255;
  --base-50: 246, 246, 246;
  --base-100: 231, 231, 231;
  --base-200: 209, 209, 209;
  --base-300: 176, 176, 176;
  --base-400: 136, 136, 136;
  --base-500: 109, 109, 109;
  --base-600: 93, 93, 93;
  --base-700: 79, 79, 79;
  --base-800: 69, 69, 69;
  --base-900: 61, 61, 61;
  --base-950: 17, 17, 17;
  --base-1000: 0, 0, 0;

  --cobalt-50: 238, 247, 255;
  --cobalt-100: 217, 237, 255;
  --cobalt-200: 187, 224, 255;
  --cobalt-300: 140, 206, 255;
  --cobalt-400: 85, 177, 255;
  --cobalt-500: 46, 142, 255;
  --cobalt-600: 23, 111, 249;
  --cobalt-700: 16, 88, 229;
  --cobalt-800: 20, 71, 185;
  --cobalt-900: 23, 65, 149;
  --cobalt-950: 19, 40, 88;

  --emerald-50: 236,253,245;
  --emerald-100: 209,250,229;
  --emerald-200: 167,243,208;
  --emerald-300: 110,231,183;
  --emerald-400: 52,211,153;
  --emerald-500: 16,185,129;
  --emerald-600: 5,150,105;
  --emerald-700: 4,120,87;
  --emerald-800: 6,95,70;
  --emerald-900: 6,78,59;
  --emerald-950: 2,44,34;

  --primary-50: var(--emerald-50);
  --primary-100: var(--emerald-100);
  --primary-200: var(--emerald-200);
  --primary-300: var(--emerald-300);
  --primary-400: var(--emerald-400);
  --primary-500: var(--emerald-500);
  --primary-600: var(--emerald-600);
  --primary-700: var(--emerald-700);
  --primary-800: var(--emerald-800);
  --primary-900: var(--emerald-900);
  --primary-950: var(--emerald-950);
}

@media (max-width: 720px) {
  :root {
    --font-4xl: 1.875rem;
    --font-3xl: 1.5rem;
    --font-2xl: 1.25rem;
    --font-xl: 1.125rem;
    --font-lg: 1rem;
  }
}