/*--------------------------------------------------------------
# Variables
--------------------------------------------------------------*/

/* Root
--------------------------------------------- */

:root {
  /* --font-sans: 'GT-America Standard', sans-serif; */
  --font-sans: 'Stag Sans', sans-serif;
  --font-sans-condensed: 'GT-America Condensed', sans-serif;
  --font-serif: 'Canela Deck', serif;
  --font-mono: 'GT-America Mono', monospace;
  --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-light: 300;
  --font-regular: 400;
  --font-medium: 500;
  --font-bold: 700;

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

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

  --color-primary-0: 255, 255, 255;
  --color-primary-50: 247, 247, 247;
  --color-primary-100: 239, 239, 239;
  --color-primary-200: 220, 220, 220;
  --color-primary-300: 189, 189, 189;
  --color-primary-400: 152, 152, 152;
  --color-primary-500: 124, 124, 124;
  --color-primary-600: 101, 101, 101;
  --color-primary-700: 82, 82, 82;
  --color-primary-800: 70, 70, 70;
  --color-primary-900: 61, 61, 61;
  --color-primary-950: 41, 41, 41;
  --color-primary-1000: 0, 0, 0;

  --color-secondary-50: 247, 247, 243;
  --color-secondary-100: 231, 231, 222;
  --color-secondary-200: 205, 205, 186;
  --color-secondary-300: 184, 184, 156;
  --color-secondary-400: 162, 161, 125;
  --color-secondary-500: 148, 142, 108;
  --color-secondary-600: 129, 121, 94;
  --color-secondary-700: 109, 100, 80;
  --color-secondary-800: 91, 82, 69;
  --color-secondary-900: 76, 69, 59;
  --color-secondary-950: 42, 37, 30;

  --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%;
}

@media (max-width: 720px) {
  :root {
    --font-2xl: 1.25rem;
    --font-3xl: 1.5rem;
    --font-4xl: 1.875rem;
    --font-5xl: 2.25rem;
    --font-6xl: 3rem;
  }
}