@font-face {
  font-family: "Soul Display";
  src: url("../assets/fonts/soul-display-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 600;
  font-display: swap;
}

@font-face {
  font-family: "Soul Display";
  src: url("../assets/fonts/soul-display-bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
}

@font-face {
  font-family: "Soul Body";
  src: url("../assets/fonts/soul-body-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 500;
  font-display: swap;
}

@font-face {
  font-family: "Soul Body";
  src: url("../assets/fonts/soul-body-semibold.woff2") format("woff2");
  font-style: normal;
  font-weight: 600 900;
  font-display: swap;
}

:root {
  color-scheme: light;
  --soul-blue: #126bff;
  --soul-navy: #06265e;
  --soul-ink: #111111;
  --soul-white: #ffffff;
  --soul-paper-blue: #eaf2ff;
  --soul-soft-blue: #d8e6f8;
  --soul-mid-blue: #9eb8de;
  --font-body: "Soul Body", Arial, sans-serif;
  --font-display: "Soul Display", Impact, sans-serif;
  --content-width: 1240px;
  --page-gutter: clamp(20px, 4.5vw, 72px);
  --radius: 12px;
}