:root {
  color-scheme: dark;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #09090b;
  color: #f4f4f5;
}

* { box-sizing: border-box; }
body { margin: 0; }
a { color: #6ea6e7; }
.top-line { height: 3px; background: #0055bb; }
.shell { width: min(760px, calc(100% - 40px)); margin: 0 auto; padding: 42px 0 72px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.mark { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 6px; background: #0055bb; font-weight: 800; }
.brand span:last-child { font-size: 13px; font-weight: 800; letter-spacing: .06em; }
main { margin-top: 48px; }
.eyebrow { color: #71717a; font-size: 10px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
h1 { margin: 8px 0 14px; font-size: clamp(28px, 5vw, 44px); letter-spacing: -.04em; }
.lead { color: #a1a1aa; line-height: 1.8; }
section { margin-top: 34px; padding-top: 22px; border-top: 1px solid #2c2c31; }
h2 { margin: 0 0 10px; font-size: 17px; }
p, li { color: #d4d4d8; line-height: 1.8; }
ul { padding-left: 20px; }
footer { display: flex; gap: 16px; margin-top: 48px; padding-top: 20px; border-top: 1px solid #2c2c31; color: #71717a; font-size: 12px; }

@media (prefers-color-scheme: light) {
  :root { color-scheme: light; background: #f4f4f5; color: #18181b; }
  .lead { color: #52525b; }
  p, li { color: #3f3f46; }
  section, footer { border-color: #d4d4d8; }
}