/* ============================================================================
   LEGAL PAGES (privacy, terms, accessibility)
   ========================================================================== */
.legal-hero{background:radial-gradient(50% 70% at 85% -10%,rgba(56,145,254,.10),transparent 60%),var(--bg-cream)}
.legal-updated{
  display:inline-flex;align-items:center;gap:.45rem;margin-top:1.4rem;
  font-size:var(--fs-tiny);font-weight:600;color:var(--ink-soft);
  background:#fff;border:1px solid var(--line);
  padding:.45rem .9rem;border-radius:var(--r-pill);
}
.legal-layout{display:grid;gap:clamp(2rem,4vw,3.5rem);align-items:start}
@media(min-width:960px){.legal-layout{grid-template-columns:250px 1fr}}
.legal-toc{position:sticky;top:130px}
@media(min-width:960px){
  /* these documents run to 20-30 sections, so the sticky rail scrolls
     internally instead of running its tail off the bottom of the viewport. */
  .legal-toc{max-height:calc(100dvh - 160px);overflow-y:auto;overscroll-behavior:contain}
}
@media(max-width:959px){
  .legal-toc{
    position:static;background:var(--bg-soft);border:1px solid var(--line);
    border-radius:var(--r-lg);padding:1.3rem;
    /* 30 sections stack to ~1300px, so the reader scrolls a full phone-and-a-half
       of contents before reaching clause one. Cap it and scroll it in place. */
    max-height:15rem;overflow-y:auto;overscroll-behavior:contain;
  }
}
.toc-label{
  font-size:var(--fs-tiny);font-weight:650;text-transform:uppercase;letter-spacing:.13em;
  color:var(--ink-faint);margin-bottom:.9rem;
}
.legal-toc ul{display:grid;gap:.1rem}
.legal-toc a{
  display:block;padding:.45rem .75rem;border-radius:var(--r-sm);
  font-size:var(--fs-small);color:var(--ink-soft);
  border-left:2px solid transparent;
  transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast);
}
.legal-toc a:hover{color:var(--purple);background:var(--purple-tint);border-left-color:var(--purple)}
.legal-prose{max-width:44rem}
.legal-prose h2{scroll-margin-top:130px}
.legal-prose h2:first-child{margin-top:0}
.legal-prose .pill-note{margin:1.6rem 0}
.legal-prose h3{font-size:1.05rem;font-weight:650;color:var(--ink);margin:1.8rem 0 .7rem}
/* clause lists carry their own (a)/(b) labels as text, because legal
   cross-references cite them - so no marker and no extra indent. */
.legal-prose ul.legal-alpha{list-style:none;margin-left:0}