/* Legal documents. Loaded only by the two pages under /legal, on top of
   site.css, so the marketing stylesheet stays untouched.
   A legal page is read, not scanned: one column, generous measure, and a
   contents list because these documents are long and people arrive looking
   for one clause. */
.legal { padding: 56px 0 96px; }
.legal .wrap { max-width: 760px; }
.legal-kicker {
  font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  color: var(--green, #5BC174); margin: 0 0 12px;
}
.legal h1 { font-size: clamp(30px, 5vw, 42px); line-height: 1.1; margin: 0 0 14px; }
.legal-updated { font-size: 14px; opacity: .72; margin: 0 0 22px; }
.legal-intro { font-size: 17px; line-height: 1.7; margin: 0 0 34px; max-width: 62ch; }
.legal-toc {
  border: 1px solid rgba(127,127,127,.22); border-radius: 12px;
  padding: 20px 24px; margin: 0 0 44px;
}
.legal-toc h2 {
  font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  opacity: .6; margin: 0 0 12px;
}
.legal-toc ol { margin: 0; padding-left: 20px; columns: 2; column-gap: 32px; }
.legal-toc li { margin: 0 0 7px; font-size: 14.5px; break-inside: avoid; }
@media (max-width: 620px) { .legal-toc ol { columns: 1; } }
.legal-s { margin: 0 0 38px; scroll-margin-top: 90px; }
.legal-s h2 { font-size: 21px; line-height: 1.25; margin: 0 0 12px; }
.legal-s p { font-size: 15.5px; line-height: 1.75; margin: 0 0 14px; max-width: 68ch; opacity: .88; }
.legal-s strong { opacity: 1; }

/* ── The PDF, readable in place ─────────────────────────────────────────
   The signed PDF is the authoritative document and the prose on the page is
   the same text set to be read. This lets somebody check one against the
   other without leaving the page. */
.legal-pdf { display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
             margin: 22px 0 26px; }
.legal-pdf-btn { padding: 11px 22px; font-size: 15px; }
.legal-pdf-alt { font-size: 14.5px; color: var(--muted, #4C594F); text-decoration: underline;
                 text-underline-offset: 3px; }
.legal-pdf-alt:hover { color: var(--ink, #0E2A1B); }

.legal-pdf-wrap { margin: 0 0 30px; }
.legal-pdf-wrap iframe {
  width: 100%; height: 780px; border: 1px solid var(--rule, #D6D1C0);
  border-radius: 6px; background: #fff; display: block;
}
.legal-pdf-fallback { margin-top: 10px; font-size: 13.5px; color: var(--muted, #4C594F); }
.legal-pdf-wrap[hidden] { display: none; }

@media (max-width: 700px) {
  .legal-pdf { gap: 12px; }
  /* Tall enough to be worth opening, short enough that the page is still
     scrollable past it on a phone. */
  .legal-pdf-wrap iframe { height: 60vh; min-height: 380px; }
}