@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url("../assets/fonts/source-serif-4-latin-wght-normal.woff2") format("woff2-variations");
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url("../assets/fonts/source-sans-3-latin-wght-normal.woff2") format("woff2-variations");
}

:root {
  color-scheme: dark;

  --heritage-teal: #071f1c;
  --midnight-navy: #071827;
  --champagne-gold: #b38a4a;
  --warm-alabaster: #f2e9da;
  --graphite: #737675;
  --ink: var(--heritage-teal);
  --ink-deep: #041310;
  --stone: #0a2925;
  --stone-raised: #10352f;
  --cream: var(--warm-alabaster);
  --cream-soft: #d8cec0;
  --muted: #9da3a0;
  --brass: var(--champagne-gold);
  --brass-light: #d0ad70;
  --line: rgb(179 138 74 / 0.28);
  --line-soft: rgb(242 233 218 / 0.13);
  --error: #e5a09a;
  --success: #b6cfb6;
  --font-display: "Source Serif 4", georgia, serif;
  --font-body: "Source Sans 3", arial, sans-serif;
  --container: min(1180px, calc(100vw - 48px));
  --header-height: 72px;
  --section-space: clamp(5rem, 9vw, 9rem);
  --focus: 0 0 0 3px var(--ink), 0 0 0 5px var(--brass-light);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

@media (width <= 540px) {
  :root {
    --container: min(100% - 32px, 1180px);
    --header-height: 68px;
    --section-space: 4.5rem;
  }
}