/* Legal pages (privacy policy, terms, data deletion): one readable text column on top of style.css.
   Type follows the screen width only: 15px on phones, about 17px on a 1080p monitor, capped for 4K. */
body { font-size: clamp(15px, 0.7vw + 4px, 28px); }
.top { max-width: 50em; }
a.logo { color: inherit; text-decoration: none; }

.legal { flex: 1; width: 100%; max-width: 50em; margin: 0 auto; padding: 0.6em max(16px, 2.2em) 2.5em; }
.legal h1 { font-size: 2.2em; font-weight: 800; letter-spacing: -0.035em; line-height: 1.1; margin: 0.5em 0 0.3em; }
.legal h2 { font-size: 1.3em; font-weight: 800; letter-spacing: -0.02em; line-height: 1.25; margin: 2em 0 0.6em; }
.legal h3 { font-size: 1.05em; font-weight: 800; margin: 1.4em 0 0.4em; }
.legal p, .legal ul, .legal ol { margin: 0 0 0.9em; line-height: 1.6; }
.legal ul, .legal ol { padding-left: 1.4em; }
.legal li { margin-bottom: 0.35em; }
.legal a { color: var(--accent); font-weight: 700; text-underline-offset: 0.15em; overflow-wrap: anywhere; }
.legal code { font: inherit; font-weight: 700; padding: 0 0.3em; border-radius: 0.3em; background: var(--surface2); border: 1px solid var(--line); }
.legal .meta { color: var(--muted); font-size: 0.85em; }
.legal .lead { max-width: none; font-size: 1.05em; margin-bottom: 1.4em; }
.legal .card { margin: 1.4em 0; }
.legal .card h2 { margin-top: 0; }
.legal .card p { color: var(--text); }
.legal .card > :last-child { margin-bottom: 0; }

/* Tables scroll sideways on narrow phones instead of widening the page. */
.table { overflow-x: auto; margin: 0 0 1em; }
.legal table { width: 100%; border-collapse: collapse; font-size: 0.92em; }
.legal th, .legal td { text-align: left; vertical-align: top; padding: 0.55em 0.7em; border-bottom: 1px solid var(--line2); }
.legal th { font-weight: 800; background: var(--surface2); }

.legal .foot { margin-top: 3em; }
.legal-links { list-style: none; padding: 0; margin: 0.4em 0 0; }
.legal-links li { margin: 0.2em 0; }
.legal-links a[aria-current="page"] { color: var(--text); text-decoration: none; }

@media (max-width: 760px) {
  .legal { padding-left: 16px; padding-right: 16px; }
  .legal h1 { font-size: 1.8em; }
}