/* Legal & long-form content pages (privacy, terms, delete-account).
   Inherits the whole design system from css/style.css; this file only adds
   the prose-specific rules those pages need that the landing page doesn't. */
@import url("/css/style.css");

.legal-page { max-width: 760px; }

.legal-meta {
  color: var(--muted);
  font-size: 0.88rem;
  margin: -0.5rem 0 2.5rem;
}

.legal-page h2 {
  font-size: 1.4rem;
  margin: 2.6rem 0 0.9rem;
}
.legal-page h2:first-of-type { margin-top: 0; }

.legal-page p,
.legal-page li {
  color: var(--muted);
  line-height: 1.7;
}
.legal-page p { margin: 0 0 1.1rem; }
.legal-page strong { color: var(--text); }

.legal-page ul,
.legal-page ol {
  margin: 0 0 1.1rem;
  padding-left: 1.4rem;
}
.legal-page li { margin-bottom: 0.4rem; }

.legal-page a { color: var(--volt); }
.legal-page a:hover { text-decoration: none; }

.legal-table-wrap {
  overflow-x: auto;
  margin: 0 0 1.5rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.legal-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.legal-table th,
.legal-table td {
  padding: 0.7rem 0.9rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.legal-table tr:last-child td { border-bottom: none; }
.legal-table th {
  color: var(--muted);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.legal-table td { color: var(--text); }