/* ===== Privacy & Terms pages: every rule is scoped to .legal-page (nothing touches header/footer) ===== */
.legal-page{color:var(--ink); line-height:1.6}
.legal-page *{box-sizing:border-box}
.legal-page ul,.legal-page ol{padding:0; margin:0; list-style:none}
.legal-page .l-in{max-width:1240px; margin:0 auto; padding:0 32px}
.legal-page .l-block{padding-top:32px; padding-bottom:48px}

/* hero (same as About / FAQ) */
.legal-page .a-hero{background:linear-gradient(135deg,#FFF1D6,#FFFFFF 50%,#E4F5EA); border-bottom:1px solid var(--line); padding:34px 0 40px; position:relative}
.legal-page .a-hero::after{content:""; position:absolute; left:0; right:0; bottom:0; height:4px; background:linear-gradient(90deg,var(--saffron) 33%,#fff 33% 66%,var(--green) 66%)}
.legal-page .crumb{font-size:13.5px; color:var(--slate); margin-bottom:10px}
.legal-page .crumb a{color:var(--navy); font-weight:600}
.legal-page .crumb a:hover{color:var(--saffron-deep)}
.legal-page .a-hero h1{font-size:clamp(32px,4.6vw,50px); font-weight:800; color:var(--ink); margin:0 0 8px}
.legal-page .a-hero p{color:var(--slate); font-size:17px; max-width:62ch; margin:0}

/* layout: contents on the left, text on the right */
.legal-page .legal{display:grid; grid-template-columns:260px minmax(0,1fr); gap:32px; align-items:start}

.legal-page .toc{position:sticky; top:96px; background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px; box-shadow:0 10px 24px -18px rgba(32,28,25,.35)}
.legal-page .toc b{display:block; font-family:var(--sat); font-size:17px; color:var(--navy); padding-bottom:8px; margin-bottom:6px; border-bottom:2px solid var(--saffron)}
.legal-page .toc a{display:block; padding:7px 10px; font-size:13.5px; line-height:1.35; color:var(--slate); border-radius:8px; transition:background .2s ease,color .2s ease}
.legal-page .toc a:hover{background:var(--soft); color:var(--ink)}

.legal-page .prose{background:#fff; border:1px solid var(--line); border-radius:18px; padding:32px 36px; box-shadow:0 10px 24px -18px rgba(32,28,25,.35)}
.legal-page .prose section{padding:0; margin:0 0 26px; scroll-margin-top:96px}
.legal-page .prose section:last-child{margin-bottom:0}
.legal-page .prose h2{font-size:24px; font-weight:800; margin:0 0 8px; color:var(--navy)}
.legal-page .prose p{color:var(--slate); margin:0 0 10px}
.legal-page .prose a{color:var(--saffron-deep); text-decoration:underline}
.legal-page .prose ul{margin:6px 0 10px}
.legal-page .prose li{position:relative; padding:4px 0 4px 24px; color:var(--slate)}
.legal-page .prose li::before{content:"✓"; position:absolute; left:0; font-weight:800; color:var(--green)}
.legal-page .upd{display:inline-block; background:var(--soft); padding:4px 14px; border-radius:99px; font-size:13px!important; font-weight:600; color:var(--ink)!important; margin:0 0 20px!important}

@media(max-width:900px){
  .legal-page .legal{grid-template-columns:1fr}
  .legal-page .toc{position:static}
}
@media(max-width:640px){
  .legal-page .l-in{padding:0 18px}
  .legal-page .a-hero{padding:26px 0 32px}
  .legal-page .l-block{padding-top:24px; padding-bottom:36px}
  .legal-page .prose{padding:22px 18px}
  .legal-page .prose h2{font-size:21px}
}