@font-face {
  font-family: "Fraunces Roasted";
  src: url("/fonts/FrauncesRoasted-Black.ttf") format("truetype");
  font-weight: 900;
  font-display: swap;
}

:root { color-scheme: light; --ink: #1a1a1a; --muted: #8a8a8a; --orange: #f15a24; }

* { box-sizing: border-box; margin: 0; }

html, body { height: 100%; background: #fff; color: var(--ink); }

body {
  display: flex;
  flex-direction: column;
  font: 17px/1.5 -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}

main { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 24px 16px; text-align: center; }

.wordmark { font: 900 clamp(64px, 16vw, 144px)/1 "Fraunces Roasted", Georgia, serif; letter-spacing: -0.02em; color: var(--ink); text-decoration: none; }
.wordmark span { color: var(--orange); }
.wordmark.small { font-size: 40px; margin-bottom: 24px; }

main > p { color: var(--muted); }

main.text { align-items: flex-start; justify-content: flex-start; max-width: 560px; width: 100%; margin: 0 auto; padding-top: 64px; text-align: left; gap: 16px; }
main.text h2 { font-size: 24px; }

a { color: var(--ink); }

footer { padding: 24px 16px; text-align: center; font-size: 14px; color: var(--muted); }
footer a { color: var(--muted); }