/* One column of prose, and nothing this site does not already have.

   styles.css brings the club's faces and its palette; member-theme.css turns
   the page linen and re-tones the header and the footer this page borrows
   from the booking site. What is left is the shape of a document — a column
   narrow enough to read, headings that are quiet, and a hairline between
   sections instead of a box around each one.

   Every colour here is one of the skin's own tokens, so this file can never
   be the place a fifth grey is invented. ink on linen is 13.9:1 and ink-600
   is 7.0; the date and the eyebrow are muted at 5.2. */

.legal {
  max-width:680px;
  margin:0 auto;
  /* Clear of the fixed top bar, the same way the booking page's hero is. */
  padding:130px 24px 24px;
}

.legal-eyebrow {
  margin:0 0 14px;
  font-size:12px; font-weight:700; letter-spacing:.24em; text-transform:uppercase;
  color:var(--muted);
}
.legal h1 {
  margin:0 0 10px;
  font-family:var(--display); font-weight:900; line-height:1;
  font-size:clamp(38px, 7vw, 58px);
  color:var(--ink);
}
.legal-date {
  margin:0 0 26px;
  font-size:13px; color:var(--muted);
}
.legal-lede {
  margin:0;
  font-size:17.5px; color:var(--ink); text-wrap:pretty;
}

.legal section {
  margin-top:32px; padding-top:24px;
  border-top:1px solid var(--hairline);
}
.legal h2 {
  margin:0 0 12px;
  font-family:var(--display); font-size:20px; font-weight:900;
  color:var(--ink);
}
.legal p {
  margin:0 0 12px;
  font-size:15.5px; color:var(--ink-600); text-wrap:pretty;
}
.legal p:last-child { margin-bottom:0; }
.legal ul {
  margin:0 0 12px; padding-left:20px;
  font-size:15.5px; color:var(--ink-600);
}
.legal li { margin-bottom:7px; }
.legal li:last-child { margin-bottom:0; }
.legal a { color:var(--accent); }
.legal a:hover { color:var(--primary); }

@media (max-width:900px) {
  .legal { padding:104px 20px 16px; }
}

/* ---- after dark ----

   The skin follows the browser now (member-theme.css), and this page follows
   it for free: every colour above is one of its tokens. The two lines that do
   not survive the swap are these. `--muted` is linen at .72 in the dark, which
   is 3.4:1 on the page — and both of them sit in the top wash, the lightest
   band of it, where even the skin's own quiet voice is 4.4. So they take the
   linen, which is 5.0 there. Nothing else on the page needs a word: the
   headline and the lede are --ink, the prose is --ink-600 at 4.6 on the
   ground below the wash, and the links are the accent on the same. */
@media (prefers-color-scheme: dark) {
  .legal-eyebrow, .legal-date { color:var(--ink); }
}