/* Fairhold text pages (privacy policy, support): the home page's masthead and footer from site.css, and a plain
   reading column between them. Loaded after site.css. */
.page { padding: 0 20px 8px; }
.page h1 { font-size: clamp(38px, 10.3vw, 56px); }
.text { max-width: 38em; }
.updated { margin-top: 18px; font-size: 16px; color: var(--muted); }
.text .lede { margin-top: 20px; }
.facts { margin: 20px 0 0; padding: 16px 18px; background: var(--sheet); border: 1px solid var(--line); border-radius: 10px; display: grid; gap: 10px; }
.facts div { display: grid; gap: 2px; }
.facts dt { font-size: 14px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.facts dd { margin: 0; }
.text h2 { margin-top: 44px; font: 800 26px/1.15 var(--display); letter-spacing: -0.012em; color: var(--forest); text-wrap: balance; }
.text p, .text ul { margin: 14px 0 0; }
.text p, .text li { text-wrap: pretty; }
.text ul { padding-left: 1.15em; }
.text li { margin-top: 10px; padding-left: 2px; }
.text li::marker { color: var(--forest); }
.text a { color: var(--forest); font-weight: 600; text-underline-offset: 3px; overflow-wrap: anywhere; }   /* long addresses wrap, never a sideways scroll */
.text .note { font-size: 16px; color: var(--ink2); }
.foot-nav a[aria-current="page"] { text-decoration: none; color: var(--ink2); }

@media (min-width: 720px) {
  .page { max-width: 760px; margin: 0 auto; padding: 0 32px 8px; }
}
@media (min-width: 1120px) {
  /* the band holds the name only from here up (as on the home page): the heading sits on paper, on the logo's left edge */
  .page { max-width: 1280px; padding: 0 48px 16px; }
  .page h1 { margin-top: 48px; font-size: 56px; max-width: none; }
  .facts { grid-template-columns: auto minmax(0, 1fr); column-gap: 24px; }
  .facts div { display: contents; }
}