.legal-hero{padding:150px 0 50px;position:relative;overflow:hidden}
.legal-hero::before{
  content:"";position:absolute;top:-40%;right:-10%;width:55vw;height:140%;
  background:radial-gradient(closest-side,rgba(90,176,255,.16),transparent 70%);z-index:-1;
}
.legal-hero h1{font-size:clamp(2rem,5vw,3.2rem);margin:18px 0 14px}
.legal-hero .meta{display:inline-flex;align-items:center;gap:.5em;font-family:var(--display);font-weight:500;font-size:.9rem;color:var(--muted);background:var(--mist);border:1px solid var(--line);padding:.5em 1em;border-radius:999px}
.legal-hero .meta svg{width:16px;height:16px;color:var(--blue)}

.legal-layout{display:grid;grid-template-columns:250px 1fr;gap:46px;align-items:start;padding-bottom:30px}

/* table of contents */
.toc{position:sticky;top:90px}
.toc h4{font-family:var(--display);font-size:.74rem;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);margin-bottom:14px}
.toc ol{list-style:none;counter-reset:t;display:grid;gap:2px}
.toc a{display:flex;gap:10px;align-items:baseline;font-family:var(--display);font-weight:500;font-size:.92rem;color:var(--ink);padding:8px 12px;border-radius:10px;transition:.2s;line-height:1.3}
.toc a::before{counter-increment:t;content:counter(t,decimal-leading-zero);font-size:.72rem;color:var(--sky);font-weight:700;flex:none}
.toc a:hover{background:var(--mist);color:var(--blue)}
.toc a.active{background:var(--mist);color:var(--blue)}

/* article */
.legal-body{max-width:760px}
.lsec{padding:26px 0;border-top:1px solid var(--line);scroll-margin-top:90px}
.lsec:first-child{border-top:none;padding-top:0}
.lsec h2{display:flex;align-items:baseline;gap:14px;font-size:1.35rem;margin-bottom:14px}
.lsec h2 .badge{
  font-family:var(--display);font-weight:700;font-size:.85rem;color:#fff;
  background:linear-gradient(135deg,var(--blue),var(--blue-deep));
  width:34px;height:34px;border-radius:10px;display:inline-grid;place-items:center;flex:none;
  transform:translateY(4px);
}
.lsec p{color:#42566e;margin-bottom:14px}
.lsec p:last-child{margin-bottom:0}
.lsec strong{color:var(--ink);font-weight:700}
.lsec ul{list-style:none;display:grid;gap:12px;margin:0 0 14px}
.lsec ul li{position:relative;padding-left:26px;color:#42566e}
.lsec ul li::before{content:"";position:absolute;left:0;top:.55em;width:9px;height:9px;border-radius:3px;background:var(--sky);transform:rotate(45deg)}
.lsec a{color:var(--blue);text-decoration:underline;text-underline-offset:2px;word-break:break-word}

/* contact callout */
.lcallout{background:var(--mist);border:1px solid var(--line);border-radius:16px;padding:22px 24px;margin:4px 0 14px}
.lcallout .who{font-family:var(--display);font-weight:700;font-size:1.05rem;color:var(--ink);margin-bottom:6px}
.lcallout p{margin:0;color:#42566e;font-size:.95rem;line-height:1.7}

@media (max-width:980px){
  .legal-layout{grid-template-columns:1fr;gap:24px}
  .toc{position:static;border:1px solid var(--line);border-radius:16px;padding:18px 16px;background:#fff}
  .toc ol{grid-template-columns:1fr 1fr;gap:2px 14px}
}
@media (max-width:760px){
  .legal-hero{padding:120px 0 40px}
  .toc ol{grid-template-columns:1fr}
}