*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--night);
  color: var(--ink);
  font-family: var(--font);
  font-size: 1rem;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
img, picture, svg, canvas { display: block; max-width: 100%; }
img { height: auto; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p { margin-block: 0; }
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }
em { color: var(--acid); font-style: normal; }
::selection { background: var(--acid); color: var(--night); }
:focus-visible { outline: .18rem solid var(--acid); outline-offset: .28rem; }
.skip-link {
  position: fixed; z-index: 1000; left: 1rem; top: 1rem; padding: .75rem 1rem;
  background: var(--acid); color: var(--night); transform: translateY(-160%);
  transition: transform var(--fast) var(--ease);
}
.skip-link:focus { transform: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.eyebrow {
  display: flex; align-items: center; gap: .65rem; color: var(--ink-soft);
  font-size: .72rem; font-weight: 650; letter-spacing: .14em; text-transform: uppercase;
}
.eyebrow > span { width: 1.7rem; height: 1px; background: var(--acid); }
.index { color: var(--ink-muted); font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; }
.button {
  display: inline-flex; min-height: 3.25rem; align-items: center; justify-content: center;
  padding: .8rem 1.35rem; border: 1px solid transparent; font-size: .86rem; font-weight: 680;
  letter-spacing: .01em; transition: transform var(--fast) var(--ease), background var(--fast), color var(--fast);
}
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--acid); color: var(--night); }
.button-primary:hover { background: oklch(92% .2 125); }
.button-muted { border-color: var(--line-dark); color: var(--ink-soft); cursor: default; }
.text-link { color: var(--ink-soft); font-size: .84rem; font-weight: 580; }
.text-link span { display: inline-block; margin-left: .4rem; transition: transform var(--fast) var(--ease); }
.text-link:hover span { transform: translateY(.25rem); }
.section-dark { background: var(--night); color: var(--ink); }
.section-light { color-scheme: light; background: var(--paper); color: var(--paper-ink); }
.section-light .eyebrow { color: var(--paper-muted); }
.section-light .index { color: var(--paper-muted); }

@media (max-width: 47.99rem) {
  html { scroll-behavior: auto; }
}