:root {
  color-scheme: dark;
  background: #101923;
  color: #f0f4f8;
  font: 17px/1.6 "Segoe UI", Roboto, sans-serif;
}

body { margin: 0 auto; max-width: 44rem; padding: 1.5rem clamp(1.25rem, 5vw, 3rem) 2rem; }
nav { display: flex; justify-content: space-between; gap: 1rem; padding-bottom: 1.25rem; border-bottom: 1px solid #425061; }
nav a:first-child { color: inherit; font-weight: 700; text-decoration: none; }
a { color: #9bd7ff; text-underline-offset: .2em; }
a:focus-visible { outline: 2px solid #9bd7ff; outline-offset: 4px; }
main { margin: clamp(2rem, 9vw, 5rem) 0 3rem; }
h1 { font-size: clamp(2.25rem, 8vw, 4rem); letter-spacing: -.04em; line-height: 1.07; margin: 0 0 1rem; }
h2 { font-size: 1.3rem; margin: 2rem 0 .5rem; }
p { color: #c9d5df; margin: 0 0 1rem; }
.intro { font-size: 1.2rem; }
footer { border-top: 1px solid #425061; padding: 1.25rem 0 0; }