/* ===========================================================================
   Halaman legal (Syarat & Ketentuan, Kebijakan Privasi) — format dokumen resmi.
   Dimuat SETELAH style.css; meng-override .legal-* dengan tampilan serif formal.
   =========================================================================== */
:root{
  --lg-paper:#ffffff;
  --lg-bg:#f3f1ec;
  --lg-ink:#2b2a26;
  --lg-muted:#6a675e;
  --lg-faint:#9a968b;
  --lg-line:#e6e2d8;
  --lg-accent:#1d4ed8;
  --lg-serif:'Source Serif 4','Lora',Georgia,'Times New Roman',serif;
  --lg-sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}

body.legal-body{
  background:var(--lg-bg);
  color:var(--lg-ink);
  font-family:var(--lg-serif);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

/* Topbar (tetap sans, ringkas) */
.legal-topbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:13px 28px;background:var(--lg-paper);border-bottom:1px solid var(--lg-line);
  position:sticky;top:0;z-index:20;font-family:var(--lg-sans);
}
.legal-topbar__brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--lg-ink)}
.legal-topbar__brand img{border-radius:8px}
.legal-topbar__brand strong{font-weight:700;font-size:16px;letter-spacing:-.01em}
.legal-topbar__nav{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.legal-topbar__back{display:inline-flex;align-items:center;gap:6px;color:var(--lg-muted);text-decoration:none;font-size:13.5px;font-weight:600;transition:color .15s}
.legal-topbar__back:hover{color:var(--lg-accent)}
.legal-topbar__link{color:var(--lg-muted);text-decoration:none;font-size:13.5px;font-weight:600;transition:color .15s}
.legal-topbar__link:hover{color:var(--lg-accent)}

/* Halaman + "kertas" dokumen */
.legal-page{padding:40px 20px 64px}
.legal-container{
  max-width:800px;margin:0 auto;background:var(--lg-paper);
  border:1px solid var(--lg-line);border-radius:6px;
  box-shadow:0 1px 2px rgba(40,35,20,.04),0 10px 36px rgba(40,35,20,.06);
  padding:58px 68px 50px;
  counter-reset:legal-sec;
}

.legal-eyebrow{
  font-family:var(--lg-sans);text-transform:uppercase;letter-spacing:.2em;
  font-size:11px;font-weight:700;color:var(--lg-accent);margin:0 0 12px;
}
.legal-container h1{
  font-family:var(--lg-serif);font-size:34px;font-weight:700;line-height:1.15;
  letter-spacing:-.01em;color:var(--lg-ink);margin:0 0 10px;
}
.legal-meta{font-family:var(--lg-sans);font-size:13px;color:var(--lg-muted);margin:0 0 6px}
.legal-meta strong{color:var(--lg-ink);font-weight:600}
.legal-intro{
  font-size:16.5px;line-height:1.75;color:var(--lg-muted);font-style:italic;
  border-left:3px solid var(--lg-line);padding-left:18px;margin:22px 0 8px;
}

.legal-rule{border:0;border-top:1px solid var(--lg-line);margin:26px 0 8px}

.legal-section{margin-top:30px}
.legal-section h2{
  font-family:var(--lg-serif);font-size:19px;font-weight:700;color:var(--lg-ink);
  margin:0 0 12px;padding-bottom:0;line-height:1.3;
}
.legal-section h3{font-family:var(--lg-serif);font-size:16px;font-weight:700;margin:18px 0 8px;color:var(--lg-ink)}
.legal-section p{font-size:15.5px;line-height:1.78;color:var(--lg-ink);margin:0 0 12px;text-align:justify;hyphens:auto}
.legal-section p:last-child{margin-bottom:0}
.legal-section ul,.legal-section ol{margin:0 0 12px;padding-left:26px}
.legal-section li{font-size:15.5px;line-height:1.75;color:var(--lg-ink);margin-bottom:8px;text-align:justify}
.legal-section li::marker{color:var(--lg-faint)}
.legal-section strong{font-weight:700}
.legal-section a{color:var(--lg-accent);text-decoration:none;border-bottom:1px solid rgba(29,78,216,.3)}
.legal-section a:hover{border-bottom-color:var(--lg-accent)}
.legal-section code{
  font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:13px;
  background:#f4f2ec;border:1px solid var(--lg-line);border-radius:4px;padding:1px 6px;color:#4a463c;
}

/* Catatan / disclaimer box */
.legal-callout{
  background:#fbf8ef;border:1px solid #ece3cb;border-left:3px solid #c79a2e;
  border-radius:6px;padding:14px 16px;margin:24px 0 6px;
  font-size:13.5px;line-height:1.65;color:#6b5a2e;font-family:var(--lg-sans);
}
.legal-callout strong{color:#5a4a1e}

.legal-bottom-nav{margin-top:38px;padding-top:24px;border-top:1px solid var(--lg-line);display:flex;gap:12px;flex-wrap:wrap}
.legal-bottom-nav .btn{font-family:var(--lg-sans)}

.legal-footer{text-align:center;padding:26px 20px 40px;font-family:var(--lg-sans);font-size:12.5px;color:var(--lg-faint)}
.legal-footer a{color:var(--lg-muted);text-decoration:none}
.legal-footer a:hover{color:var(--lg-accent)}

@media (max-width:640px){
  .legal-container{padding:32px 22px 36px}
  .legal-container h1{font-size:26px}
  .legal-topbar{padding:11px 16px}
  .legal-section p,.legal-section li{text-align:left}
}