@font-face {
  font-family: Newsreader;
  src: url(Newsreader-Regular.ttf) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: Inter;
  src: url(Inter-Regular.ttf) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: Nunito;
  src: url(Nunito-ExtraBold.ttf) format("truetype");
  font-weight: 800;
  font-display: swap;
}
:root {
  --ink: #352f32;
  --ink-muted: #6d6568;
  --plum: #65415b;
  --surface: #fffaf2;
  --stroke: #d9d1c8;
  --radius: 16px;
}
body {
  background: #f8f4eb;
  font-family: Inter, system-ui, sans-serif;
}
header.nav {
  background: #f8f4eb;
  backdrop-filter: none;
  position: relative;
}
header.nav .wrap {
  padding-block: 24px;
}
.brand {
  font-family: Nunito, system-ui, sans-serif;
  font-size: 23px;
  color: var(--plum);
}
h1 {
  font-family: Newsreader, Georgia, serif;
  font-weight: 400;
  font-size: clamp(48px, 7vw, 72px);
  letter-spacing: -0.04em;
}
h2,
h3 {
  font-family: Nunito, system-ui, sans-serif;
}
.doc-hero {
  padding-block: 55px 30px;
}
.doc-hero .lead {
  line-height: 1.8;
}
.eyebrow-label {
  color: var(--plum);
  font-size: 11px;
  letter-spacing: 0.13em;
}
.quick-link,
.note,
.doc-toc,
details {
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.quick-link:hover {
  background: #e9e6d8;
}
.doc-toc {
  background: #eee9de;
}
.note.caution {
  background: #f0e1bd;
}
a:focus-visible,
button:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--plum);
}
footer {
  background: transparent;
}
a {
  text-underline-offset: 4px;
}
.skip-link {
  position: fixed;
  left: 12px;
  top: -100px;
  z-index: 100;
  background: #f8f4eb;
  padding: 12px;
}
.skip-link:focus {
  top: 10px;
}
@media (max-width: 640px) {
  header.nav .wrap {
    padding-block: 18px;
    flex-wrap: wrap;
    gap: 17px;
  }
  header.nav nav {
    margin-left: 0;
    gap: 12px 20px;
    flex-wrap: wrap;
    width: 100%;
    font-size: 12px;
  }
  .doc-hero {
    padding-top: 36px;
  }
  .doc-hero .lead {
    font-size: 16px;
  }
  .wrap {
    padding-inline: 20px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}