/* MUGEN — shared styles for subpages (404, thanks, privacy, terms).
   Loads after styles.css + landing.css; reuses .nav / .btn / .eyebrow / footer. */

body.page { display: flex; flex-direction: column; min-height: 100svh; }
body.page main { flex: 1; }

/* Solid nav on subpages (no hero behind it). */
body.page .nav { background: linear-gradient(to bottom, rgba(0,0,0,.88), rgba(0,0,0,.55)); }

/* ---------- Prose pages (privacy, terms) ---------- */
.page-main { padding: 180px 0 120px; }
.page-main .wrap { max-width: 820px; }
.page-main h1 {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(2.4rem, 5vw, 3.6rem); letter-spacing: -0.03em; line-height: 1.05;
  margin: 16px 0 10px; color: #F4F4F6;
}
.page-meta { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .08em; color: var(--neutral-500); margin: 0 0 56px; }
.prose h2 {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(1.4rem, 2.4vw, 1.8rem); letter-spacing: -0.02em;
  margin: 48px 0 14px; color: #F4F4F6;
}
.prose p, .prose li { color: var(--neutral-400); line-height: 1.7; font-size: var(--text-md); }
.prose p { margin: 0 0 16px; }
.prose ul { margin: 0 0 16px; padding-left: 22px; }
.prose li { margin-bottom: 8px; }
.prose li::marker { color: var(--purple-400); }
.prose a { color: var(--lime-400); }
.prose a:hover { color: var(--lime-300); }
.prose strong { color: var(--neutral-300); font-weight: 600; }
.prose code { font-family: var(--font-mono); font-size: .9em; color: var(--neutral-300); background: var(--neutral-900); border: 1px solid #2A2A31; border-radius: 6px; padding: 1px 6px; }

/* ---------- Status pages (404, thanks) ---------- */
.status-main {
  display: flex; align-items: center; text-align: center;
  padding: 140px 0 100px; position: relative; overflow: hidden;
  background:
    radial-gradient(900px 600px at 50% 30%, color-mix(in srgb, var(--purple-500) 14%, transparent), transparent 70%),
    var(--neutral-950);
}
.status-main .wrap { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; }
.status-main .mark { width: 72px; margin-bottom: 32px; }
.status-main .code {
  font-family: var(--font-mono); font-size: var(--text-sm); letter-spacing: .2em;
  text-transform: uppercase; color: var(--accent);
}
.status-main h1 {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(2.6rem, 7vw, 5rem); letter-spacing: -0.03em; line-height: 1.02;
  margin: 18px 0 20px; color: #F4F4F6;
}
.status-main h1 .lim { color: var(--purple-400); }
.status-main p { color: var(--neutral-400); line-height: 1.65; font-size: var(--text-md); max-width: 34em; margin: 0 auto 36px; }
.status-main .cta-row { justify-content: center; }

@media (max-width: 720px) {
  .page-main { padding: 140px 0 80px; }
}