/* Privacy Policy and Terms of Service: violet header, readable text column,
   sticky contents list on wide screens. Colours from tokens.css only. */

.legal-hero { padding-bottom: 70px; }
.legal-hero__inner { max-width: var(--page-width); margin: 0 auto; padding: 60px var(--gutter) 0; }
.legal-hero__eyebrow { font-weight: 600; font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-2); }
.legal-hero h1 { font-size: clamp(52px, 8vw, 120px); margin-top: 14px; }
.legal-hero__meta { margin: 22px 0 0; color: var(--text-2); font-weight: 500; }

.legal {
  max-width: var(--page-width); margin: 0 auto; padding: 70px var(--gutter) 110px;
  display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 70px; align-items: start;
}
.legal__toc { position: sticky; top: calc(var(--nav-h) + 24px); background: var(--card); border-radius: var(--radius-md); padding: 22px; }
.legal__toc b { display: block; font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-3); margin-bottom: 12px; }
.legal__toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; counter-reset: toc; }
.legal__toc li { counter-increment: toc; }
.legal__toc ol a { display: flex; gap: 10px; padding: 6px 0; color: var(--text-2); font-weight: 500; font-size: 15px; line-height: 1.35; }
.legal__toc ol a::before { content: counter(toc, decimal-leading-zero); color: var(--text-3); font-variant-numeric: tabular-nums; font-size: 13px; padding-top: 1px; }
.legal__toc ol a:hover { color: var(--accent-text); }
.legal__other { display: inline-block; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--hairline); width: 100%; font-weight: 600; font-size: 15px; color: var(--accent-text); }

.legal__body { max-width: 72ch; color: var(--text-2); font-size: 17px; line-height: 1.7; }
.legal__section { scroll-margin-top: 12px; }
.legal__section + .legal__section { margin-top: 44px; }
.legal__intro { font-size: 19px; color: var(--text); }
.legal__body h2 {
  font-family: var(--font-display); font-stretch: var(--display-stretch); font-style: italic; font-weight: 900;
  font-size: 30px; line-height: 1.05; letter-spacing: -0.03em; color: var(--text); margin: 0 0 14px;
}
.legal__body h3 { font-size: 18px; color: var(--text); margin: 24px 0 8px; }
.legal__body p { margin: 0 0 14px; }
.legal__body ul, .legal__body ol { margin: 0 0 14px; padding-left: 22px; }
.legal__body li { margin-bottom: 8px; }
.legal__body li::marker { color: var(--accent-text); }
.legal__body strong, .legal__body b { color: var(--text); font-weight: 600; }
.legal__body a { color: var(--accent-text); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.legal__body table { width: 100%; border-collapse: collapse; margin: 0 0 18px; font-size: 15px; }
.legal__body th, .legal__body td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--hairline); vertical-align: top; }
.legal__body th { color: var(--text); font-weight: 600; }

@media (max-width: 900px) {
  .legal-hero { padding-bottom: 44px; }
  .legal-hero__inner { padding-top: 24px; }
  .legal { grid-template-columns: minmax(0, 1fr); gap: 36px; padding-top: 36px; padding-bottom: 80px; }
  .legal__toc { position: static; }
  .legal__body { font-size: 16px; }
  .legal__intro { font-size: 17px; }
  .legal__body h2 { font-size: 25px; }
}