@font-face {
  font-family: "Geist";
  src: url("/fonts/geist.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
:root {
  --ink: #0a0b0d;
  --muted: #4a4f57;
  --teal: #007c85;
  --cyan: #66ffff;
  --paper: #ffffff;
}
* { box-sizing: border-box; }
html { background: var(--paper); color: var(--ink); }
body {
  margin: 0;
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px 16px;
  font: 400 17px/1.55 "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
}
main { max-width: 34rem; }
.brand { margin: 0 0 8px; font-weight: 600; letter-spacing: 0.08em; font-size: 14px; color: var(--teal); }
h1 { margin: 0 0 16px; font-size: clamp(40px, 9vw, 64px); line-height: 1.05; letter-spacing: -0.02em; font-weight: 650; }
p { margin: 0 0 16px; color: var(--muted); }
.links { display: flex; gap: 20px; margin-top: 24px; }
a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--cyan); text-decoration-thickness: 3px; text-underline-offset: 4px; }
a:hover, a:focus-visible { text-decoration-color: var(--teal); }
a:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }