.legal-page { padding-top: clamp(56px, 10vh, 120px); padding-bottom: clamp(96px, 14vh, 200px); }
.legal-page .head { grid-column: 1 / span 12; }
.legal-page h1 { font-size: var(--t-display); font-weight: 300; line-height: 1.1; letter-spacing: 0.02em; }
.legal-page .updated { margin-top: 20px; font-size: var(--t-small); letter-spacing: 0.14em; color: var(--ink-2); }
.legal-page .toc { grid-column: 1 / span 12; margin-top: clamp(40px, 6vh, 72px); font-size: var(--t-small); letter-spacing: 0.12em; line-height: 2.1; }
.legal-page .toc a { text-decoration: none; }
@media (hover: hover) and (pointer: fine) { .legal-page .toc a:hover { text-decoration: underline; } }
.legal-page .body { grid-column: 1 / span 12; margin-top: clamp(40px, 6vh, 72px); text-transform: none; letter-spacing: 0; font-size: var(--t-read); line-height: 1.75; max-width: 66ch; }
.legal-page .body h2 { text-transform: uppercase; letter-spacing: 0.14em; font-size: var(--t-small); margin-top: 56px; margin-bottom: 16px; padding-top: 16px; border-top: 1px solid var(--hair); }
.legal-page .body h3 { text-transform: uppercase; letter-spacing: 0.12em; font-size: var(--t-small); margin-top: 24px; margin-bottom: 8px; color: var(--ink-2); }
.legal-page .body p + p { margin-top: 1em; }
.legal-page .body ul { margin: 0.6em 0; padding-left: 0; }
.legal-page .body li { padding-left: 16px; text-indent: -16px; margin: 0.35em 0; }
.legal-page .body li::before { content: "· "; }
.legal-page .body .intro { font-size: var(--t-read-lead); font-weight: 300; line-height: 1.5; }
@media (min-width: 900px) {
.legal-page .toc { grid-column: 1 / span 3; margin-top: 0; position: sticky; top: 96px; align-self: start; }
.legal-page .body { grid-column: 5 / span 7; margin-top: 0; }
.legal-page .head { margin-bottom: clamp(48px, 8vh, 96px); }
}
.legal-page .table-wrap { overflow-x: auto; margin: 1em 0; }
.legal-page table { border-collapse: collapse; width: 100%; min-width: 520px; font-size: var(--t-body); }
.legal-page th, .legal-page td { text-align: left; vertical-align: top; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--hair); }
.legal-page th { font-size: var(--t-small); letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-2); font-weight: 400; }
.legal-page .body .button { margin-top: 8px; }
@media (max-width: 599px) {
  .legal-page .table-wrap { overflow: visible; }
  .legal-page table, .legal-page tbody, .legal-page tr, .legal-page td { display: block; min-width: 0; width: 100%; }
  .legal-page thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .legal-page tr { border-top: 1px solid var(--hair); padding: 8px 0; }
  .legal-page td { border: 0; padding: 4px 0; overflow-wrap: anywhere; }
  .legal-page td::before { content: attr(data-label); display: block; font-size: var(--t-small); letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-2); }
}
