/* The privacy policy and 404 pages: on top of styles.css (tokens, fonts, dark mode). */

.page-top { background: var(--sky); }
.page-top .nav { padding-bottom: 28px; }
.doc { max-width: 760px; margin: -8px auto 0; padding: 0 16px 64px; position: relative; }
.doc article {
  background: var(--card); border: 1px solid var(--cardBorder); box-shadow: var(--shadow);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-radius: 28px; padding: clamp(24px, 5vw, 44px);
}
.doc h1 { margin: 0 0 6px; font-weight: 800; font-size: clamp(32px, 5vw, 44px); line-height: 1.05; letter-spacing: -.015em; }
.doc h2 { margin: 32px 0 8px; font-weight: 700; font-size: 22px; line-height: 1.2; color: var(--ink); }
.doc p, .doc li { margin: 0 0 10px; }
.doc ul { padding-left: 22px; }
.doc .meta { color: var(--muted); margin-bottom: 22px; font-size: 15px; }
.doc a { color: var(--accent); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.doc a:hover { text-decoration-thickness: 2px; }

.lost { min-height: 100vh; display: grid; place-items: center; text-align: center; padding: 24px 16px; background: var(--sky); }
.lost-box { display: flex; flex-direction: column; align-items: center; gap: 18px; }
.lost-box img { width: 120px; height: 120px; border-radius: 28px; transform: rotate(-6deg); box-shadow: 0 20px 40px -16px rgba(20,32,74,.45); }
.lost h1 { margin: 0; font-weight: 800; font-size: clamp(44px, 9vw, 80px); line-height: .95; letter-spacing: -.02em; }
.lost p { margin: 0; max-width: 32ch; color: var(--muted); font-size: 18px; }
.home-btn { display: inline-block; margin-top: 6px; padding: 10px 26px; border-radius: 999px; background: #0e1530; color: #fff; font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: 18px; }
.home-btn:hover { color: #fff; }