/* ============================================================
   BECOME — Legal page (Terms & Privacy)
   ============================================================ */
.legal-hero{
  position:relative; padding:150px 0 56px; overflow:hidden;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(70% 90% at 85% 0%, rgba(255,88,0,.18), transparent 60%),
    var(--bg);
}
.legal-hero .eyebrow{ justify-content:flex-start; }
.legal-hero h1{ font-size:clamp(44px,6vw,84px); margin-top:18px; }
.legal-hero .meta{ margin-top:22px; display:flex; flex-wrap:wrap; gap:10px 26px; color:var(--muted); font-size:15px; }
.legal-hero .meta b{ color:var(--txt); font-weight:600; }
.legal-hero .meta a{ color:var(--orange); }
.legal-intro{ margin-top:24px; max-width:760px; font-size:17px; line-height:1.6; color:var(--muted); }
.legal-intro b{ color:var(--txt); font-weight:600; }

/* quick jump pills */
.legal-jump{ margin-top:30px; display:flex; gap:12px; flex-wrap:wrap; }
.legal-jump a{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--display); font-weight:700; font-size:15px; letter-spacing:.04em; text-transform:uppercase;
  padding:11px 20px; border-radius:12px; border:1px solid var(--line-strong); color:var(--txt);
  transition:border-color .18s ease, color .18s ease, transform .18s ease;
}
.legal-jump a:hover{ border-color:var(--orange); color:var(--orange); transform:translateY(-2px); }
.legal-jump a::before{ content:''; width:7px; height:7px; border-radius:50%; background:var(--orange); }

/* layout: sticky TOC + content */
.legal-body{ padding:64px 0 110px; }
.legal-layout{ display:grid; grid-template-columns:248px 1fr; gap:64px; align-items:start; }

.toc{ position:sticky; top:104px; }
.toc h4{ font-family:var(--display); font-weight:700; font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2); margin-bottom:16px; }
.toc nav{ display:flex; flex-direction:column; gap:2px; border-left:1px solid var(--line); }
.toc a{
  display:block;
  font-size:14px; color:var(--muted); padding:8px 0 8px 16px; margin-left:-1px;
  border-left:2px solid transparent; transition:color .15s ease, border-color .15s ease;
  line-height:1.35;
}
.toc a:hover{ color:var(--txt); }
.toc a.active{ color:var(--orange); border-left-color:var(--orange); }
.toc .toc-group{ margin-top:20px; }
.toc .toc-group:first-child{ margin-top:0; }
.toc .toc-group > span{ display:block; font-family:var(--display); font-weight:700; font-size:14px; letter-spacing:.08em; text-transform:uppercase; color:var(--txt); padding:8px 0 8px 16px; }

/* article */
.legal-doc{ max-width:760px; }
.legal-section + .legal-section{ margin-top:64px; padding-top:64px; border-top:1px solid var(--line); }
.legal-section > h2{
  font-family:var(--display); font-weight:800; font-size:clamp(30px,3.6vw,44px);
  text-transform:uppercase; letter-spacing:.005em; line-height:1; scroll-margin-top:100px;
}
.legal-section .doc-lead{ margin-top:18px; font-size:17px; line-height:1.65; color:var(--muted); }
.legal-section .doc-lead b{ color:var(--txt); }

.legal-doc h3{
  font-family:var(--body); font-weight:600; font-size:20px; color:var(--txt);
  margin-top:40px; scroll-margin-top:100px;
  display:flex; gap:12px; align-items:baseline;
}
.legal-doc h3 .ix{ font-family:var(--display); font-weight:800; color:var(--orange); font-size:18px; letter-spacing:.02em; flex:none; }
.legal-doc p{ margin-top:14px; font-size:16px; line-height:1.7; color:var(--muted); }
.legal-doc p b, .legal-doc li b{ color:var(--txt); font-weight:600; }
.legal-doc a{ color:var(--orange); text-decoration:none; }
.legal-doc a:hover{ text-decoration:underline; }
.legal-doc ul{ list-style:none; margin-top:16px; display:flex; flex-direction:column; gap:12px; }
.legal-doc ul li{ position:relative; padding-left:24px; font-size:16px; line-height:1.65; color:var(--muted); }
.legal-doc ul li::before{ content:''; position:absolute; left:4px; top:11px; width:7px; height:7px; border-radius:2px; background:var(--orange); }

.legal-doc .callout{
  margin-top:20px; background:var(--surface); border:1px solid var(--line);
  border-left:3px solid var(--orange); border-radius:12px; padding:18px 22px;
}
.legal-doc .callout p{ margin-top:0; color:var(--txt); }
.legal-doc .callout p + p{ margin-top:10px; }

.legal-foot-note{ margin-top:64px; padding-top:28px; border-top:1px solid var(--line); color:var(--muted-2); font-size:14px; line-height:1.6; }

.back-home{
  display:flex; width:fit-content; align-items:center; gap:9px; margin-bottom:30px;
  font-size:14px; font-weight:500; color:var(--muted); transition:color .15s ease;
}
.back-home:hover{ color:var(--orange); }

@media (max-width:1024px){
  .legal-layout{ grid-template-columns:1fr; gap:0; }
  .toc{ display:none; }
}
@media (max-width:680px){
  .legal-hero{ padding:122px 0 44px; }
  .legal-body{ padding:44px 0 80px; }
  .legal-section + .legal-section{ margin-top:48px; padding-top:48px; }
}