/* ==========================================================================
   LEGAL PAGES — Privacy / Terms / Shipping / Refund / Disclaimer
   Extends the existing MII Ret Cam design system. Does not modify
   or override any rule in style.css — additive only.
   ========================================================================== */

.legal-shell{ display:grid; gap:var(--space-6); }
@media (min-width:992px){
  .legal-shell{ grid-template-columns:250px 1fr; align-items:start; gap:var(--space-6); }
}

/* ---- table of contents ---- */
.legal-toc{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md);
  padding:var(--space-4);
}
@media (min-width:992px){
  .legal-toc{ position:sticky; top:calc(var(--header-h) + var(--space-4)); }
}
.legal-toc h4{
  font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--text-muted); margin-bottom:var(--space-3);
}
.legal-toc ol{ counter-reset:legal-toc; }
.legal-toc li{ counter-increment:legal-toc; }
.legal-toc a{
  display:flex; gap:.6rem; align-items:baseline;
  padding:.45rem 0; font-size:.88rem; color:var(--text-muted);
  border-left:2px solid transparent; padding-left:.7rem; margin-left:-.7rem;
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.legal-toc a::before{
  content:counter(legal-toc, decimal-leading-zero);
  font-family:var(--font-mono); font-size:.72rem; color:var(--text-faint); flex:none;
}
.legal-toc a:hover{ color:var(--primary); border-color:var(--border-strong); }

/* ---- content column ---- */
.legal-doc .card{ margin-top:0; }
.legal-section{
  padding-bottom:var(--space-6); margin-bottom:var(--space-6);
  border-bottom:1px solid var(--border);
  scroll-margin-top:calc(var(--header-h) + var(--space-4));
}
.legal-section:last-child{ border-bottom:none; margin-bottom:0; padding-bottom:0; }
.legal-section .legal-index{
  font-family:var(--font-mono); font-size:.75rem; color:var(--text-faint); letter-spacing:.04em;
}
.legal-section h2{ font-size:1.3rem; margin-top:.35rem; }
.legal-section > p{ margin-top:var(--space-3); color:var(--text-muted); max-width:70ch; }
.legal-section h3.legal-sub{
  margin-top:var(--space-5); margin-bottom:.4rem; font-size:1rem; font-weight:600;
}
.legal-section .feature-list{ margin-top:var(--space-2); }
.legal-section .feature-list li span{ color:var(--text-muted); }

.legal-updated{
  display:inline-flex; align-items:center; gap:.4rem; margin-top:var(--space-3);
}

.legal-jump{
  display:flex; flex-wrap:wrap; gap:.5rem; margin-top:var(--space-5);
}
@media (min-width:992px){ .legal-jump{ display:none; } }