@font-face {
  font-family: "Manrope Variable";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("../fonts/manrope-variable-latin.woff2") format("woff2-variations");
}

@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/barlow-condensed-500-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/barlow-condensed-600-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/barlow-condensed-700-latin.woff2") format("woff2");
}

:root {
  color-scheme: dark;
  font-family: "Manrope Variable", system-ui, sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  --bg: #0b0d0c;
  --surface: #121411;
  --surface-raised: #1a1d19;
  --text: #f3f0e9;
  --muted: #a4a79f;
  --line: rgba(243, 240, 233, 0.16);
  --accent: #e15e2d;
  --accent-ink: #150c08;
  --radius: 4px;
  --header-height: 72px;
  --page-pad: clamp(20px, 5vw, 80px);
  --max-width: 1440px;
}