/* Shared reading styles for /privacy and /terms, on top of brand.css. Wording and emphasis in the
   documents are counsel's; this file only sets the site's typography around them. */
body { min-height: 100dvh; display: flex; flex-direction: column; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.foot .wrap { color: var(--ink-2); }

.legal {
  width: 100%; max-width: 760px; margin: 0 auto; padding: 48px 20px 72px; flex: 1;
  color: var(--ink); font-size: 1rem; line-height: 1.65; overflow-wrap: anywhere;
}
.legal h1 { margin: 16px 0 12px; font-size: clamp(2rem, 5vw, 2.75rem); line-height: 1.15; letter-spacing: -.03em; text-wrap: balance; }
.legal .updated { margin: 0 0 32px; font-size: .9375rem; color: var(--ink-2); }
.legal h2 { margin: 40px 0 12px; font-size: 1.25rem; line-height: 1.3; font-weight: 600; letter-spacing: -.01em; scroll-margin-top: 20px; break-after: avoid; }
.legal h3 { margin: 28px 0 8px; font-size: 1.0625rem; line-height: 1.35; font-weight: 600; }
.legal p, .legal ul { margin: 0 0 14px; }
.legal ul { padding-left: 1.25rem; }
.legal .indented-list { padding-left: 2.5rem; }
.legal li { margin: 0 0 8px; }
.legal li::marker { color: var(--muted); }
.legal strong { font-weight: 600; }
.legal a { color: var(--blue); text-underline-offset: 2px; }

/* Terms: numbered subsections (4.1, 12.3, ...) keep their bold run-in labels. */
.legal .number { display: inline-block; min-width: 2.25em; margin-right: .25em; }
.legal .subsection .number { min-width: 3em; }
.legal .smallCaps { font-variant: normal; }
.legal .blank { display: none; }

@media (max-width: 640px) { .legal { padding-top: 32px; } }