/* The 4 legal pages (/privacy-policy/, /refund-policy/, /licensing-agreement/, /delivery-policy-for-digital-
   products/, web/build/page_legal.py). A plain centered hero (M4, same as support.css/whats-new.css) plus a
   readable prose column for the legal text and a small "other policies" nav. Prose rules copied from blog.css's
   .fbw-blog-body (the library's reading-size convention: h2->h4, h3->h5), scoped to .fbw-legal so nothing else
   is touched. Never edit fbw.css here. */

.fbw .fbw-legal-hero .fbw-hero__text { align-items: center; text-align: center; }

/* ---------- the legal text itself: --content-width-text is the site's own readable-column token (~70ch) ---------- */
.fbw .fbw-legal { max-width: var(--content-width-text); margin-inline: auto; font-size: var(--text-m); line-height: 1.7; color: var(--text-color); }
.fbw .fbw-legal > * { margin-block: 0; }
.fbw .fbw-legal > * + * { margin-block-start: 1.25em; }
.fbw .fbw-legal h2 { font-size: var(--h4); line-height: 1.3; color: var(--heading-color); margin-block-start: 2em; }
.fbw .fbw-legal h3 { font-size: var(--h5); line-height: 1.3; color: var(--heading-color); margin-block-start: 1.6em; }
.fbw .fbw-legal > :is(h2, h3) + * { margin-block-start: 0.75em; }
.fbw .fbw-legal > :first-child { margin-block-start: 0; }
.fbw .fbw-legal :is(strong, b) { color: var(--heading-color); font-weight: 600; }
.fbw .fbw-legal a { color: var(--heading-color); font-weight: 500; text-decoration: underline; text-decoration-color: var(--border-color-strong); text-decoration-thickness: 1px; text-underline-offset: 4px; transition: text-decoration-color var(--fbw-t-s) var(--fbw-ease-color); overflow-wrap: anywhere; }
.fbw .fbw-legal a:hover { text-decoration-color: var(--heading-color); }
.fbw .fbw-legal :is(ul, ol) { padding-inline-start: 1.4em; }
.fbw .fbw-legal li + li { margin-block-start: 0.45em; }
.fbw .fbw-legal li::marker { color: var(--border-color-strong); }

/* ---------- other policies: a small nav under the text, same column width, a hairline above it ---------- */
.fbw .fbw-legal-nav { max-width: var(--content-width-text); margin-inline: auto; padding-block-start: var(--space-m); border-block-start: 1px solid var(--fbw-line-soft); display: grid; gap: var(--space-xs); }
.fbw .fbw-legal-nav__label { font-size: var(--text-xs); color: var(--text-color); }
.fbw .fbw-legal-nav__list { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-m); padding: 0; margin: 0; list-style: none; }
.fbw .fbw-legal-nav__list li::marker { content: none; }

@media (max-width: 767px) {
  .fbw .fbw-legal, .fbw .fbw-legal-nav { max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
  .fbw .fbw-legal a { transition: none; }
}