/* Shared layout for the platform's legal pages (privacy, terms, deletion).
   Kept separate from style.css so the landing page stays untouched. */
.legal { max-width: 820px; margin: 0 auto; padding: 44px 22px 90px; }
.legal-back { display:inline-block; margin-bottom:26px; font-size:13px; color:var(--muted); text-decoration:none; }
.legal-back:hover { color:var(--brand); }
.legal h1 { font-size:32px; line-height:1.15; margin:0 0 8px; letter-spacing:-0.6px; color:var(--text); }
.legal .updated { color:var(--muted); font-size:13px; margin:0 0 32px; }
.legal .lead { color:var(--text-soft); font-size:15.5px; line-height:1.7; margin:0 0 28px; }
.legal h2 { font-size:19px; margin:34px 0 12px; letter-spacing:-0.2px; color:var(--text); }
.legal h3 { font-size:15px; margin:22px 0 8px; color:var(--brand); }
.legal p, .legal li { color:var(--text-soft); line-height:1.7; font-size:14.5px; }
.legal ul, .legal ol { padding-left:20px; }
.legal li { margin-bottom:6px; }
.legal strong { color:var(--text); }
.legal a { color:var(--brand); }
.legal table { width:100%; border-collapse:collapse; margin:14px 0; font-size:13.5px; }
.legal th, .legal td { text-align:left; padding:9px 12px; border-bottom:1px solid var(--line); vertical-align:top; color:var(--text-soft); }
.legal th { color:var(--muted); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:0.6px; }
.legal .box { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:16px 18px; margin:18px 0; }
.legal .box.warn { border-left:3px solid var(--brand); }
.legal .scroll { overflow-x:auto; }
.steps-num { counter-reset:step; list-style:none; padding-left:0; }
.steps-num li { counter-increment:step; position:relative; padding-left:34px; margin-bottom:12px; }
.steps-num li::before {
  content:counter(step); position:absolute; left:0; top:1px;
  width:22px; height:22px; border-radius:50%; background:var(--brand); color:#fff;
  font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center;
}

/* Footer links on the landing page */
.footer-legal { display:flex; gap:16px; flex-wrap:wrap; margin-top:10px; }
.footer-legal a { color:var(--muted); font-size:12.5px; text-decoration:none; }
.footer-legal a:hover { color:var(--brand); text-decoration:underline; }