/* Fonts: self-hosted, latin + latin-ext. Paths are relative to dist/assets/main.css. */
@font-face{
  font-family:'Bebas Neue'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../fonts/bebas-neue-400.woff2') format('woff2');
}
@font-face{
  font-family:'Cabin'; font-style:normal; font-weight:400 600; font-display:swap;
  src:url('../fonts/cabin-variable.woff2') format('woff2');
}
@font-face{
  font-family:'Cabin'; font-style:italic; font-weight:400 600; font-display:swap;
  src:url('../fonts/cabin-variable-italic.woff2') format('woff2');
}
/* Fallbacks matched to the web fonts' width and vertical metrics.
   Bebas is all caps, so its fallback is matched against Arial capitals (display text is uppercased). */
@font-face{
  font-family:'Bebas Neue Fallback'; src:local('Arial'), local('ArialMT'), local('Liberation Sans');
  size-adjust:60.93%; ascent-override:147.71%; descent-override:49.24%; line-gap-override:0%;
}
@font-face{
  font-family:'Cabin Fallback'; src:local('Arial'), local('ArialMT'), local('Liberation Sans');
  size-adjust:94.66%; ascent-override:101.94%; descent-override:26.41%; line-gap-override:0%;
}

/* Reset */
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
@media (prefers-reduced-motion:no-preference){ html{ scroll-behavior:smooth; } }
/* Anchor targets land below the sticky header. */
[id]{ scroll-margin-top:calc(var(--ws-nav-h) + var(--ws-space-2)); }
body{
  min-height:100vh;
  background:var(--ws-dark);
  color:var(--ws-white);
  font-family:var(--ws-font-body);
  font-size:var(--ws-fs-body);
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img,svg,video{ display:block; max-width:100%; height:auto; }
input,button,textarea,select{ font:inherit; color:inherit; }
button{ cursor:pointer; }
ul[role="list"],ol[role="list"]{ list-style:none; padding:0; }
p,li,h1,h2,h3,h4{ overflow-wrap:break-word; }
/* Hidden always wins over a component's display value (no !important: the selector is weighted instead). */
[hidden][hidden][hidden]{ display:none; }

/* Typography */
h1,h2,h3{
  font-family:var(--ws-font-display);
  font-weight:400;
  line-height:.92;
  letter-spacing:.01em;
  text-transform:uppercase;
}
h1{ font-size:var(--ws-fs-h1); }
h2{ font-size:var(--ws-fs-h2); }
h3{ font-size:var(--ws-fs-h3); }

p{ max-width:65ch; }
.ws-lead{
  font-size:var(--ws-fs-lead);
  line-height:1.45;
  max-width:50ch;
  color:var(--ws-fg-muted);
}
.ws-small{ font-size:var(--ws-fs-small); }
strong,b{ font-weight:600; }

.ws-eyebrow{
  font-family:var(--ws-font-body);
  font-size:var(--ws-fs-eyebrow);
  font-weight:600;
  letter-spacing:.2em;
  line-height:1.4;
  text-transform:uppercase;
}
.ws-eyebrow--red{ color:var(--ws-accent-text); }
.ws-eyebrow--muted{ color:var(--ws-fg-dim); }

a{ color:inherit; text-underline-offset:.2em; text-decoration-thickness:1px; }
a:hover{ color:var(--ws-accent-text); }

/* Focus: 2px outline, 2px offset, white on dark, dark on light (set per section in layout.css). */
:focus-visible{ outline:2px solid var(--ws-focus,var(--ws-white)); outline-offset:2px; }
:focus:not(:focus-visible){ outline:none; }

/* Utilities */
.ws-visually-hidden{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}
.ws-skip-link{
  position:absolute; left:var(--ws-space-2); top:var(--ws-space-2); z-index:100;
  padding:12px 20px; background:var(--ws-white); color:var(--ws-dark);
  font-size:var(--ws-fs-small); font-weight:600; text-decoration:none;
  transform:translateY(-200%);
}
.ws-skip-link:focus{ transform:none; outline-color:var(--ws-dark); }

/* Missing content marker. Visible on purpose; never ships. */
.ws-todo{
  background:#FFE066; color:#0F1014;
  font-family:var(--ws-font-body); font-size:.8em; font-weight:600;
  letter-spacing:0; text-transform:none; line-height:1.4;
  padding:0 .3em;
}

