@font-face {
  font-family: "Open Sans";
  src: url("/assets/fonts/open-sans-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
}
:root {
  --paper: #f2f2f2;
  --ink: #000;
  --blue: #174a88;
  --reverse: #fff;
  --font: "Open Sans", sans-serif;
  --regular: 400;
  --bold: 700;
  --extra-bold: 800;
  --unit: 4px;
  --space-2: calc(var(--unit) * 2);
  --space-4: calc(var(--unit) * 4);
  --space-6: calc(var(--unit) * 6);
  --space-8: calc(var(--unit) * 8);
  --gutter: clamp(1.25rem, 5vw, 5rem);
  --measure: 72rem;
  --section-space: clamp(3rem, 6vw, 5.5rem);
  --body-size: max(12pt, 1rem);
  --body-large: clamp(1.125rem, 1.6vw, 1.32rem);
  --display: clamp(3.15rem, 7.2vw, 6.65rem);
  --bar-title: 1.25rem;
  --bar-height: 4.25rem;
  --mast-height: clamp(27rem, 60svh, 36rem);
  --mast-title-top: clamp(7.5rem, 18svh, 11rem);
  --open: 1;
  --fold: 0px;
  --control: 3rem;
  --nav-text: var(--reverse);
  --action-fill: var(--blue);
  --action-text: var(--reverse);
  --field-fill: var(--paper);
  --field-text: var(--ink);
}
@media (max-width: 42rem) {
  :root {
    --bar-height: 4rem;
    --bar-title: 1.0625rem;
    --mast-height: clamp(27rem, 63svh, 32rem);
    --mast-title-top: 7.25rem;
    --display: clamp(2.6rem, 9.2vw, 3.8rem);
  }
}
@media (max-width: 21.25rem) {
  :root { --mast-title-top: 6rem; --display: 2.4rem; --mast-height: max(28.5rem, 63svh); }
}