/* Privacy Policy & Terms of Service — readable long-form document styling. */
.legal { padding: 140px 0 100px; }
.legal .doc { max-width: 780px; margin: 0 auto; }
/* ── Codex index (/guides) ────────────────────────────────────────
   An archive page, not a document: cards in a grid so it reads as a list of
   articles at a glance and stays scannable as guides are added. Mirrors the
   landing page's .cap-card language (elevated panel, gold border on hover). */
.codex { max-width: 1040px; margin: 0 auto; padding: 0 24px; }
.codex-head { max-width: 780px; margin: 0 auto 56px; }
.codex-section { margin-bottom: 56px; }
.legal .codex-section > h2 {
  font-family: var(--font-display); font-size: var(--text-sm);
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold-dim); margin: 0 0 20px;
  padding-bottom: 12px; border-bottom: 1px solid var(--ash);
}
.codex-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.codex-card {
  background: var(--dark-elevated); border: 1px solid var(--ash); padding: 28px 26px;
  display: flex; flex-direction: column;
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.codex-card:hover {
  border-color: var(--gold-primary); box-shadow: 0 0 30px rgba(201,168,76,0.18);
  transform: translateY(-3px);
}
.legal .codex-card h3 {
  font-family: var(--font-display); font-weight: 700; font-size: var(--text-xl);
  line-height: 1.25; margin: 0 0 12px;
}
/* The whole card is the click target; ::after stretches the title's link. */
.legal .codex-card h3 a { color: var(--gold-primary); }
.codex-card { position: relative; }
.codex-card h3 a::after { content: ""; position: absolute; inset: 0; }
.legal .codex-card p { color: var(--text-secondary); font-size: var(--text-base); margin: 0; }
.codex-card .codex-more {
  margin-top: auto; padding-top: 18px;
  font-family: var(--font-display); font-size: var(--text-sm);
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted);
  transition: color .25s ease;
}
.codex-card:hover .codex-more { color: var(--gold-primary); }
/* FAQ accordion on the Codex index. Duplicated from landing.css rather than
   pulling that whole stylesheet in for three panels; keep the two in sync. */
.codex-faq { max-width: 780px; margin: 0 auto; }
.legal .codex-faq > h2 {
  font-family: var(--font-display); font-size: var(--text-sm);
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold-dim); margin: 0 0 20px;
  padding-bottom: 12px; border-bottom: 1px solid var(--ash);
}
.codex-faq .faq-item { border: 1px solid var(--ash); background: var(--dark-elevated);
  margin-bottom: 12px; }
.codex-faq .faq-item summary { cursor: pointer; list-style: none; padding: 18px 20px;
  font-family: var(--font-display); font-weight: 700; font-size: var(--text-base);
  color: var(--gold-primary); display: flex; justify-content: space-between; align-items: center; }
.codex-faq .faq-item summary::-webkit-details-marker { display: none; }
.codex-faq .faq-item summary::after { content: "+"; color: var(--gold-dim); font-size: 20px;
  margin-left: 16px; flex-shrink: 0; }
.codex-faq .faq-item[open] summary::after { content: "\2212"; }
.legal .codex-faq .faq-item p { padding: 0 20px 18px; color: var(--text-muted); line-height: 1.7;
  font-size: var(--text-sm); margin: 0; }
.codex-outro { max-width: 780px; margin: 48px auto 0; text-align: center; }
@media (max-width: 760px) {
  .codex-grid { grid-template-columns: 1fr; }
}

/* Breadcrumb trail above the article title (mirrors BreadcrumbList schema). */
.legal .crumbs { font-size: var(--text-sm); color: var(--text-muted); margin-bottom: 14px;
  letter-spacing: 0.04em; }
.legal .crumbs a { color: var(--text-secondary); }
.legal .crumbs a:hover { color: var(--gold-primary); }
.legal h1 { font-size: var(--text-4xl); color: var(--text-primary); margin-bottom: 6px; }
.legal .updated { color: var(--text-muted); font-size: var(--text-sm); margin-bottom: 8px; }
.legal .placeholder-note {
  border: 1px solid var(--gold-dim); background: rgba(201,168,76,0.05);
  color: var(--text-secondary); font-size: var(--text-sm); padding: 14px 18px; margin: 24px 0 40px;
}
.legal h2 { font-size: var(--text-xl); color: var(--gold-primary); margin: 40px 0 14px;
  padding-top: 24px; border-top: 1px solid var(--ash); letter-spacing: 0.03em; }
.legal h3 { font-family: var(--font-body); font-weight: 600; font-size: var(--text-base);
  color: var(--text-primary); margin: 22px 0 8px; }
.legal p, .legal li { color: var(--text-secondary); font-size: var(--text-base); line-height: 1.7; }
.legal ul { padding-left: 22px; }
.legal li { margin-bottom: 6px; }
.legal strong { color: var(--text-primary); }
.legal a { color: var(--gold-primary); }
.legal table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: var(--text-sm); }
.legal th, .legal td { text-align: left; padding: 10px 12px; border: 1px solid var(--ash); color: var(--text-secondary); vertical-align: top; }
.legal th { background: var(--dark-surface); color: var(--text-primary); font-weight: 600; }
.legal .brackets { color: var(--gold-primary); font-style: italic; }
.legal .disclaimer { border-left: 3px solid var(--danger); padding-left: 16px; }
.legal .back { display: inline-block; margin-top: 40px; font-family: var(--font-display);
  font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase; }

/* ── Account-deletion self-service widget ─────────────────────── */
.da-widget {
  border: 1px solid var(--gold-dim); background: rgba(201,168,76,0.04);
  padding: 28px; margin: 18px 0 8px;
}
.da-widget .da-status { color: var(--text-muted); font-size: var(--text-sm); margin: 0; }
.da-form { display: flex; flex-direction: column; gap: 0; max-width: 420px; }
.da-form .field { margin-bottom: 12px; }
.da-form .cta-primary { width: 100%; text-align: center; }
.da-signed { color: var(--text-secondary); font-size: var(--text-sm); margin: 0 0 16px; }
.da-signed strong { color: var(--gold-primary); }
.da-link { background: none; border: none; padding: 0; cursor: pointer;
  color: var(--gold-primary); font-size: var(--text-sm); text-decoration: underline; }
.da-warn {
  border-left: 3px solid var(--danger); padding-left: 16px;
  color: var(--text-primary); font-size: var(--text-sm); margin: 0 0 18px;
}
.da-typelabel { display: block; color: var(--text-secondary); font-size: var(--text-sm); margin-bottom: 8px; }
.da-typelabel b { color: var(--danger); letter-spacing: 0.1em; }
.da-confirm .field { max-width: 220px; letter-spacing: 0.2em; text-transform: uppercase; }
.da-email-link { font-family: var(--font-display); font-size: 13px; letter-spacing: 0.08em; }

.btn-danger {
  display: inline-block; margin-top: 6px;
  background: transparent; border: 1.5px solid var(--danger); color: #C85A5A;
  font-family: var(--font-display); font-size: 14px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase; padding: 14px 32px; cursor: pointer;
  transition: all 0.25s ease;
}
.btn-danger:hover:not(:disabled) {
  background: rgba(139,32,32,0.14); border-color: #B33; color: #E88;
  box-shadow: 0 0 20px rgba(139,32,32,0.3);
}
.btn-danger:disabled { opacity: 0.4; cursor: not-allowed; }

.da-note { color: var(--text-secondary); font-size: var(--text-sm); margin: 0 0 12px;
  border-left: 3px solid var(--gold-dim); padding-left: 12px; }
.da-form .da-link { align-self: flex-start; margin-top: 12px; }
.da-download { display: flex; flex-direction: column; gap: 8px;
  margin: 4px 0 22px; padding-bottom: 22px; border-bottom: 1px solid var(--ash); }
.da-download .cta-primary { align-self: flex-start; }
.da-download-hint { color: var(--text-muted); font-size: var(--text-xs); line-height: 1.6; }
.da-error { color: var(--danger); font-size: var(--text-sm); }
.da-done { text-align: center; padding: 12px 0; }
.da-done .da-rune { font-size: 44px; color: var(--gold-primary); line-height: 1; }
.da-done h3 { font-family: var(--font-display); color: var(--gold-primary); margin: 12px 0 8px; }
.da-done .cta-primary { margin-top: 12px; }

/* Answer-first block on category guides: the passage an AI answer or a scanning
   reader lifts first. Bordered, not boxed-in-a-box — it must read as the opening
   of the article, not as a banner people skip. */
.legal .quick-answer { border-left: 2px solid var(--gold-dim); padding: 2px 0 2px 18px;
  margin: 0 0 28px; }
.legal .quick-answer .qa-label { font-family: var(--font-mono); font-size: 11px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--gold-dim); margin: 0 0 6px; }
.legal .quick-answer p { margin: 0; }
.legal .quick-answer strong { color: var(--text-primary); }

/* Citations on the science page: present, checkable, but never louder than the
   sentence they support. */
.legal .ref { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); white-space: normal; }
.legal ol.refs { margin: 0 0 28px; padding-left: 20px; }
.legal ol.refs li { font-size: 14px; line-height: 1.6; color: var(--text-secondary); margin-bottom: 8px; }
.legal .ref-authors { color: var(--text-primary); }
