:root {
  color-scheme: light;
  --ink: #111111;
  --paper: #f5f5f7;
  --surface: #ffffff;
  --muted: #6e6e73;
  --line: #d2d2d7;
  --red: #b40101;
  --navy: #0f206c;
  --blue: #15319a;
  --electric: #1641ff;
  --orange: #ff9f1d;
  --focus: #386eff;
  --max: 1120px;
  --ease: cubic-bezier(.2,.8,.2,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
img, svg { display: block; max-width: 100%; }
button, input { font: inherit; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.skip-link {
  position: fixed; z-index: 100; left: 16px; top: 12px; transform: translateY(-180%);
  padding: 10px 14px; border-radius: 12px; background: var(--ink); color: #fff;
}
.skip-link:focus { transform: translateY(0); }
.shell { width: min(calc(100% - 40px), var(--max)); margin-inline: auto; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font-weight: 700; }
.brand-mark {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px;
  color: #fff; background: var(--red); font-size: 13px; letter-spacing: -1px;
}
.eyebrow { color: var(--red); font-weight: 700; letter-spacing: .02em; }
.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

@media (max-width: 640px) {
  .shell { width: min(calc(100% - 28px), var(--max)); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
