:root { color-scheme: light; --paper: #f7f5f0; --ink: #222221; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); }
main { min-height: 100svh; max-width: 1100px; margin: auto; padding: clamp(32px, 6vh, 72px) 24px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.logo { display: block; width: min(55vw, 220px); height: auto; }
.identity { margin-top: 32px; text-align: center; font-family: Didot, "Bodoni MT", "Times New Roman", serif; }
.description { margin: 0; font-size: clamp(20px, 3.8vw, 27px); line-height: 1.45; }
.since { margin: 9px 0 0; font-size: 16px; line-height: 1.5; font-style: italic; }
nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 30px; margin-top: 30px; }
nav a { display: inline-flex; align-items: center; min-height: 44px; color: inherit; font-family: Arial, sans-serif; font-size: 14px; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 6px; transition: text-decoration-color .15s ease; }
nav a:hover { text-decoration-color: currentColor; }
nav a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; text-decoration-color: currentColor; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (max-width: 480px) { main { padding: 36px 22px; } .identity { margin-top: 28px; } nav { gap: 4px 22px; margin-top: 24px; } }
@media (prefers-reduced-motion: reduce) { nav a { transition: none; } }