/* ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓  L E G A L  P A G E  ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓ */
  /* Plain pages, written to be read: one column of text at a comfortable width, a contents list that stays beside it, nothing in the way. */
  body { margin: 0; }

  .page-hero { padding-block: clamp(40px, 5.5vw, 84px) clamp(36px, 5vw, 64px); }
  .page-hero .crumb { margin-bottom: clamp(20px, 3vw, 36px); }
  .page-hero .crumb a { text-decoration: none; }
  .page-hero .crumb a:hover { color: var(--ink); }
  .page-hero .crumb .kind-px { margin-right: 0.6em; }                 /* same air either side of the pixel between the two words */
  .page-hero h1 { font-size: var(--step-hero); line-height: 0.98; letter-spacing: -0.045em; }
  .page-hero h1 .px { animation: blink 0.9s steps(1, end) 0.6s 3 backwards; }   /* three blinks, then it holds as the full stop, as on the homepage */
  .page-hero .lead { max-width: 52ch; margin-top: clamp(18px, 2.4vw, 28px); }
  .page-hero .dates { margin-top: 22px; display: flex; flex-wrap: wrap; gap: 8px 28px; }

  /* the body: contents on the left, the text on the right */
  .legal { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); gap: clamp(28px, 5vw, 72px); align-items: start; padding-bottom: clamp(64px, 9vw, 128px); }
  @media (max-width: 860px) { .legal { grid-template-columns: minmax(0, 1fr); } }
  .toc { position: sticky; top: 96px; border-top: 1px solid var(--rule); padding-top: 18px; }   /* 96px clears the sticky nav */
  @media (max-width: 860px) { .toc { position: static; } }
  .toc ol { list-style: none; margin: 14px 0 0; padding: 0; counter-reset: toc; }
  .toc li { counter-increment: toc; }
  .toc a { display: flex; gap: 12px; padding-block: 7px; color: var(--soft); text-decoration: none; transition: color 0.25s ease; }
  .toc a::before { content: counter(toc, decimal-leading-zero); color: color-mix(in srgb, var(--soft) 60%, transparent); }
  .toc a:hover, .toc a.is-here { color: var(--ink); }
  .toc a.is-here::before { color: var(--pink); }

  .prose { min-width: 0; max-width: 68ch; counter-reset: part; }
  .prose section { border-top: 1px solid var(--rule); padding-block: 26px 10px; scroll-margin-top: 96px; counter-increment: part; }
  .prose h2 { font-size: clamp(1.35rem, 2.2vw, 1.75rem); line-height: 1.15; letter-spacing: -0.02em; margin: 0 0 16px; text-wrap: balance; }
  .prose h2::before { content: counter(part, decimal-leading-zero); display: block; margin-bottom: 10px; font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.14em; color: var(--pink); }
  .prose h3 { font-size: 1.02rem; letter-spacing: -0.01em; margin: 22px 0 8px; color: var(--ink); }
  .prose p, .prose li { color: var(--soft); line-height: 1.65; }
  .prose p { margin: 0 0 14px; }
  .prose strong { color: var(--ink); font-weight: 600; }
  .prose ul { margin: 0 0 16px; padding-left: 1.1em; }
  .prose li { margin-bottom: 6px; }
  .prose li::marker { color: var(--pink); }
  .prose a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--pink); text-underline-offset: 3px; }
  .prose a:hover { color: var(--pink); }
  .prose .plain { border-left: 2px solid var(--pink); padding: 2px 0 2px 16px; color: var(--ink); }   /* the one-line plain-English version that opens each section */
  .table-wrap { overflow-x: auto; margin: 0 0 18px; }
  .prose table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 0.92rem; }
  .prose th, .prose td { text-align: left; vertical-align: top; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--rule); color: var(--soft); line-height: 1.5; }
  .prose th { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 400; color: var(--ink); }

  /* anything still to be filled in before launch: impossible to miss */
  .ph { background: none; color: var(--pink); border: 1px dashed var(--pink); padding: 0 6px; font-family: var(--mono); font-size: 0.86em; }

  /* a plain page or post: the text alone, no contents list */
  .legal.is-single { grid-template-columns: minmax(0, 1fr); }