/* Privacy notice and the 404 page. */
.doc { max-width: 780px; margin: 0 auto; padding: 40px 16px 24px; }
.doc-head { padding: 0 4px 26px; animation: rise .5s var(--ease-out) both; }
.doc-head .eyebrow { display: block; margin-bottom: 14px; }
.doc-head h1 { font: 600 clamp(32px, 4.4vw, 44px)/1.08 var(--font-display); letter-spacing: -.035em; margin-bottom: 10px; }
.doc-body { padding: 10px 40px 36px; animation: rise .6s var(--ease-out) .08s both; }
.doc h2 { font-size: 18px; letter-spacing: -.02em; margin: 30px 0 10px; display: flex; align-items: center; gap: 10px; }
.doc p, .doc li { color: var(--text-2); font-size: 15px; line-height: 1.7; }
.doc p + p { margin-top: 10px; }
.doc ul { padding-left: 20px; margin: 10px 0; }
.doc li + li { margin-top: 4px; }
.doc li::marker { color: var(--text-3); }
.doc b { color: var(--text); font-weight: 600; }

.lost { min-height: calc(100vh - 64px); display: grid; place-items: center; text-align: center; padding: 16px 16px 96px; }
.lost .si-mark { margin-bottom: 26px; }
.lost .code { display: block; font: 500 12.5px var(--mono); color: var(--text-3); margin-bottom: 10px; animation: si-rise .75s var(--ease-out) both; }
.lost h1 { font: 600 30px var(--font-display); letter-spacing: -.02em; animation: si-rise .75s var(--ease-out) 50ms both; }
.lost p { color: var(--text-2); font-size: 15px; margin: 10px 0 28px; animation: si-rise .75s var(--ease-out) 100ms both; }
.lost .btn { animation: si-rise .75s var(--ease-out) 150ms both; }

@media (max-width: 600px) { .doc-body { padding: 4px 20px 26px; } }
