@font-face {
  font-family: "Martian Grotesk";
  src: url("/assets/fonts/MartianGrotesk-VF.woff2?v=20260805-font2") format("woff2");
  font-style: normal;
  font-weight: 100 1000;
  font-display: swap;
}

@font-face {
  font-family: "Martian Grotesk Wide";
  src: url("/assets/fonts/MartianGrotesk-xWdxBd.woff2?v=20260805-font2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

html,
body,
body input,
body select,
body textarea {
  font-family: "Martian Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-synthesis: none;
}

body button,
body .btn,
body h1,
body h2,
body h3,
body h4,
body .card-head-title,
body .metric-value,
body .hero-stat strong {
  font-family: "Martian Grotesk Wide", "Martian Grotesk", sans-serif !important;
  font-weight: 700;
  font-synthesis: none;
}

body .brand-wordmark,
body .wg-wordmark,
body .portal-wordmark {
  display: inline-flex;
  align-items: baseline;
  font-family: "Martian Grotesk Wide", "Martian Grotesk", sans-serif !important;
  font-size: clamp(15px, 1.55vw, 21px) !important;
  font-weight: 700 !important;
  font-stretch: 100%;
  font-synthesis: none;
  font-kerning: auto;
  letter-spacing: -.055em !important;
  line-height: 1.5 !important;
}

body .brand-wordmark strong,
body .wg-wordmark strong,
body .portal-wordmark strong {
  color: #c81755 !important;
  font: inherit !important;
}

body .brand-wordmark span,
body .wg-wordmark span,
body .portal-wordmark span {
  color: inherit;
  font: inherit;
}

@media (max-width: 640px) {
  body .brand-wordmark,
  body .wg-wordmark,
  body .portal-wordmark {
    font-size: 14px !important;
  }
}