* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: system-ui, sans-serif;
  background: #f5f5f2;
  color: #171717;
}
main { max-width: 760px; margin: 0 auto; padding: 64px 24px; }
h1 { font-size: clamp(3rem, 10vw, 6rem); line-height: .9; margin: 8px 0 24px; }
h2 { margin-top: 0; }
.eyebrow { font-size: .75rem; letter-spacing: .14em; font-weight: 700; }
.lead { font-size: 1.5rem; max-width: 580px; }
section {
  margin-top: 48px;
  padding: 24px;
  background: white;
  border: 1px solid #d8d8d2;
}
label { display: block; font-weight: 700; margin: 16px 0 8px; }
select, textarea, button { width: 100%; font: inherit; padding: 12px; }
textarea { resize: vertical; }
button { margin-top: 16px; cursor: pointer; font-weight: 700; }
pre, code {
  display: block;
  overflow-x: auto;
  background: #171717;
  color: #f5f5f2;
  padding: 16px;
  margin-top: 16px;
}
a { color: inherit; }
footer { margin-top: 48px; font-size: .9rem; }