@font-face {
  font-family: "Nunito";
  src: url("../fonts/nunito-variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 1000;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/poppins-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/poppins-semibold.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Permanent Marker";
  src: url("../fonts/permanent-marker.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --color-ink: #333333;
  --color-ink-soft: #5e5a57;
  --color-red: #bf1e2d;
  --color-red-dark: #981725;
  --color-gold: #d19333;
  --color-highlight: #fecd7f;
  --color-sand: #fecd7f;
  --color-cream: #fff6e9;
  --color-paper: #ffffff;
  --color-green: #82b74b;
  --color-blue: #9ecbff;
  --color-line: #eadfce;
  --color-focus: #bf1e2d;

  --font-display: "Poppins", Arial, sans-serif;
  --font-body: "Nunito", Arial, sans-serif;
  --font-accent: "Permanent Marker", "Comic Sans MS", cursive;

  --text-xs: 0.875rem;
  --text-sm: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.25rem;
  --heading-1: clamp(2.75rem, 5vw, 4.5rem);
  --heading-2: clamp(2rem, 3.8vw, 3.5rem);
  --heading-3: clamp(1.25rem, 2vw, 1.5rem);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-28: 7rem;
  --section-space: clamp(4rem, 8vw, 7rem);

  --radius-sm: 0.75rem;
  --radius-panel: 1.875rem;
  --radius-card: var(--radius-panel);
  --radius-large: var(--radius-panel);
  --radius-pill: 999px;

  --shadow-card: 0 1.25rem 3.75rem rgb(74 46 17 / 0.1);
  --shadow-header: 0 0.5rem 2rem rgb(74 46 17 / 0.08);
  --shadow-button: 0 0.75rem 1.75rem rgb(191 30 45 / 0.2);

  --container: 77.5rem;
  --gutter: clamp(1.25rem, 3vw, 2rem);
  --header-height: 5rem;
  --transition: 180ms ease;
}