/* Legal pages: privacy, terms, accessibility. Plain prose with a small sticky table of contents. */

.page-legal .legal-body { padding-bottom: clamp(64px, 10vw, 120px); }

.page-legal .legal-grid {
  display: grid;
  grid-template-columns: 200px minmax(0, 760px);
  justify-content: center;
  gap: clamp(32px, 5vw, 64px);
  align-items: start;
}

.page-legal .legal-toc {
  position: sticky;
  top: calc(var(--header-h) + 32px);
}
.page-legal .legal-toc p {
  font: 500 var(--t-12) / 1 var(--sans);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--stone);
  margin: 0 0 14px;
}
.page-legal .legal-toc ul { list-style: none; display: grid; gap: 10px; }
.page-legal .legal-toc a {
  display: block;
  font-size: var(--t-14);
  color: var(--stone);
  border-left: 2px solid var(--line);
  padding-left: 12px;
}
.page-legal .legal-toc a:hover { color: var(--forest); border-color: var(--leaf); }

.page-legal .prose h2 { scroll-margin-top: calc(var(--header-h) + 24px); }
.page-legal .prose h2:first-child { margin-top: 0; }
.page-legal .prose strong { color: var(--forest); }

@media (max-width: 900px) {
  .page-legal .legal-toc { display: none; }
  .page-legal .legal-grid { grid-template-columns: minmax(0, 760px); justify-content: center; }
}

/* ---------- 404 (photo) ---------- */
.nf { position: relative; min-height: 100svh; display: grid; align-items: center; color: #fff; isolation: isolate; padding: calc(var(--header-h) + 5vh) 0 10vh; }
.nf-bg { position: absolute; inset: 0; z-index: -1; background: var(--forest); }
.nf-bg img { width: 100%; height: 100%; object-fit: cover; }
.nf-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(6,18,12,.85), rgba(6,18,12,.45)); }
.nf-inner { display: grid; gap: 20px; justify-items: start; max-width: 720px; }
.nf .eyebrow { color: var(--sprout); }
.nf h1 { font-size: var(--t-64); }
.nf h1 em { color: var(--sprout); }
.nf .lede { color: rgba(255,255,255,.8); }
.nf-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; }

.page-legal .page-head { background: linear-gradient(to bottom, var(--mist), var(--canvas)); }
