:root { color-scheme: light; --ink: #3f2c2b; --muted: #806a63; --paper: #f7f1e9; --rose: #8b4e59; --line: rgba(63, 44, 43, .16); }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: #e5d7ca; color: var(--ink); font-family: Georgia, 'Times New Roman', serif; }
.shell { width: min(760px, calc(100% - 40px)); margin: 0 auto; }
.hero { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; padding: 72px 0; }
.mark { width: 72px; height: 72px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; background: #56353b; color: #fff8eb; font-size: 44px; font-style: italic; box-shadow: 0 16px 38px rgba(63,44,43,.18); }
.eyebrow { margin: 28px 0 12px; color: var(--rose); font: 600 12px/1.4 Arial, sans-serif; letter-spacing: 2px; text-transform: uppercase; }
h1 { max-width: 680px; margin: 0; font-size: clamp(44px, 8vw, 76px); line-height: .98; font-weight: 500; }
.lead { max-width: 600px; margin: 28px 0 0; color: var(--muted); font-size: 22px; line-height: 1.5; }
.links { display: flex; gap: 12px; margin-top: 42px; flex-wrap: wrap; }
.links a { padding: 13px 18px; border: 1px solid var(--line); color: var(--ink); text-decoration: none; background: rgba(255,255,255,.35); }
.document { margin-top: 54px; margin-bottom: 80px; padding: 42px clamp(24px, 6vw, 68px); background: rgba(255,252,247,.76); border: 1px solid rgba(255,255,255,.7); box-shadow: 0 24px 70px rgba(63,44,43,.12); }
.document h1 { font-size: clamp(40px, 7vw, 64px); }
.document h2 { margin: 36px 0 10px; font-size: 23px; font-weight: 500; }
.document p { color: var(--muted); font: 17px/1.75 Arial, sans-serif; }
.document a { color: var(--rose); }
.back { color: var(--rose); font: 600 13px Arial, sans-serif; text-decoration: none; }
.muted { color: var(--muted); font: 14px Arial, sans-serif; }
@media (max-width: 520px) { .shell { width: min(100% - 28px, 760px); } .document { margin-top: 14px; padding: 28px 20px; } .lead { font-size: 19px; } }