/* Legal pages and the 404 page: a quiet reading layout inside the site's header and footer. */
.page-main {
  max-width: calc(760px + 2 * var(--gutter));
  padding-block: clamp(40px, 6vw, 72px) clamp(64px, 9vw, 112px);
}

.back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 28px;
  font-size: 14px;
  color: var(--ink-2);
}
.back-link:hover { color: var(--ink); }
.back-link .i { width: 14px; height: 14px; }

.legal-lang-note { margin: 0 0 28px; font-size: 13.5px; color: var(--ink-3); }
.legal-lang-note:empty { display: none; }

/* Shown only while details in src/site.config.json are still missing. */
.legal-draft {
  margin: 0 0 24px;
  padding: 12px 16px;
  border: 1px solid color-mix(in srgb, var(--warn) 45%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--warn) 10%, transparent);
  font-size: 14px;
}
mark.todo {
  padding: 1px 6px;
  border-radius: 5px;
  background: color-mix(in srgb, var(--warn) 22%, transparent);
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: 0.85em;
}

.prose { max-width: 68ch; font-size: 16px; line-height: 1.7; color: var(--ink-2); }
.prose h1 {
  margin: 0 0 12px;
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.5rem + 2vw, 2.8rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.04em;
  color: var(--ink);
}
.prose h2 {
  margin: 36px 0 10px;
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--ink);
}
.prose p,
.prose ul { margin: 0 0 14px; }
.prose a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-strong); }
.prose code { font-family: var(--font-mono); font-size: 0.9em; }
.prose strong { color: var(--ink); }
.legal-list { padding-inline-start: 1.2em; }
.legal-list li { margin-bottom: 6px; }
.legal-meta { font-size: 14px; color: var(--ink-3); }
.legal-summary {
  padding: 14px 18px;
  border-radius: 14px;
  background: var(--bg-soft);
  color: var(--ink);
}

/* The page header has no mobile menu, so keep the language switch visible and drop the button. */
@media (max-width: 860px) {
  .page .nav-actions .lang-switch { display: flex; }
}
@media (max-width: 520px) {
  .page .nav-actions .btn { display: none; }
}

/* ---------- 404 ---------- */
.not-found { display: grid; justify-items: start; gap: 14px; }
.not-found-code {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 14px;
  letter-spacing: 0.14em;
  color: var(--ink-3);
}
.not-found h1 { margin-bottom: 0; }
.not-found p { margin: 0; }
.not-found-links { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 0 18px; }
