/* The privacy page: the app's sub-page pattern, a brand header with a white sheet for the text. */

.legal-header {
  color: var(--white);
  /* Full-width green; the logo and title line up with the 760px text column. */
  padding: 22px max(var(--gutter), calc((100% - 760px) / 2)) calc(var(--sheet-radius) + 56px);
}
.legal-header h1 {
  margin-top: 40px;
  font-size: clamp(2.5rem, 6vw, 4rem);
  font-weight: 900;
  letter-spacing: -0.04em;
}
.legal-header .nav-logo { display: inline-block; }
.legal-header .nav-logo:focus-visible { outline-color: var(--white); }

.legal { padding-bottom: 72px; }
.legal article { max-width: 760px; margin: 0 auto; }
.legal h2 { font-size: 1.75rem; margin: 44px 0 12px; }
.legal h3 { font-size: 1.25rem; margin: 28px 0 8px; letter-spacing: -0.02em; }
.legal p, .legal li { color: var(--text-2); max-width: 68ch; }
.legal p + p { margin-top: 12px; }
.legal ul { padding-left: 1.2em; }
.legal li + li { margin-top: 6px; }
.legal strong { color: var(--ink); }
.legal a { color: var(--primary-deep); text-underline-offset: 3px; }
.legal article > p:first-child em { color: var(--text-2); }

.closing-small { padding-block: 40px; }
.closing-small .closing-links { margin-top: 0; }