:root { font-family: system-ui, sans-serif; color: #eceee9; background: #141714; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: grid; align-items: center; padding: clamp(24px, 6vw, 96px); }
main { width: min(100%, 1060px); margin: 0 auto; }
.wordmark { display: inline-block; color: inherit; text-decoration: none; font: 700 28px ui-monospace, monospace; margin-bottom: clamp(64px, 12vh, 140px); }
.wordmark span { color: #b6ee86; }
.wordmark:focus-visible { outline: 2px solid #b6ee86; outline-offset: 8px; }
.eyebrow { color: #b6ee86; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; }
h1 { max-width: 940px; font-size: clamp(36px, 5.8vw, 76px); line-height: 1.08; font-weight: 550; letter-spacing: -.055em; margin: 24px 0; overflow-wrap: anywhere; }
.description { max-width: 510px; color: #a7b0a4; font-size: clamp(16px, 2vw, 20px); line-height: 1.7; }
footer { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; border-top: 1px solid #343b32; margin-top: 72px; padding-top: 24px; color: #a7b0a4; font-size: 13px; }
.dot { width: 7px; height: 7px; background: #b6ee86; border-radius: 50%; }
.domain { margin-left: auto; font-family: ui-monospace, monospace; }
@media (max-width: 420px) { .domain { flex-basis: 100%; margin: 6px 0 0 17px; } }