/* ═══════════════════════════════════════════════════════════
   LEGAL PAGES: privacy and terms, in both languages.
   Loaded ALONGSIDE home.css, never instead of it, the same way
   compare.css is: every token (--ink, --brand, --g1/g2, --line,
   --r-panel, the type scale) comes from home.css's own :root.
   This file only adds a single reading column, numbered section
   headings, a short-version box and a list of outside services
   that stacks on a phone.
   ═══════════════════════════════════════════════════════════ */

.legal-hero{padding:88px 0 48px;border-bottom:1px solid var(--line)}
.legal-hero .wrap,.legal-body .wrap{max-width:740px}
.legal-hero .d-xl{margin:16px 0 18px;font-size:60px}
.legal-hero .subhead{color:var(--ink-2);max-width:54ch}
.legal-meta{margin-top:20px}

.legal-body{padding:56px 0 88px}
.legal-body section{padding-top:40px;scroll-margin-top:88px}
.legal-body section:first-child{padding-top:0}
.legal-body h2{font-family:'Newsreader',serif;font-weight:500;font-size:30px;line-height:1.15;
  letter-spacing:-.02em;color:var(--ink);margin-bottom:14px}
.legal-body h3{font-size:17px;font-weight:600;line-height:1.4;letter-spacing:-.006em;
  color:var(--ink);margin:24px 0 6px}
.legal-body p,.legal-body li{font-size:17px;line-height:1.62;letter-spacing:-.004em;color:var(--ink-2)}
.legal-body p{margin-top:12px;max-width:none}
.legal-body h2+p,.legal-body h3+p{margin-top:0}
.legal-body ul{margin:12px 0 0 0;padding-left:22px}
.legal-body li+li{margin-top:8px}
.legal-body strong{font-weight:600;color:var(--ink)}
.legal-body a{color:var(--brand);text-underline-offset:3px}
.legal-body a:hover{color:var(--brand-deep)}

.legal-body section.legal-short{border:1px solid var(--line-2);border-radius:var(--r-panel);background:var(--g1);
  padding:26px 28px 28px;margin-bottom:8px}
.legal-short h2{font-size:24px;margin-bottom:10px}

.legal-toc{position:static;z-index:auto;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0;margin:32px 0 0}
.legal-toc .label{margin-bottom:10px}
.legal-toc ol{list-style:none;padding:0;margin:0;columns:2;column-gap:32px}
.legal-toc li{font-size:15px;line-height:1.5;margin:0 0 6px;break-inside:avoid}
.legal-toc li+li{margin-top:0}
.legal-toc a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-2)}
.legal-toc a:hover{color:var(--brand);border-bottom-color:var(--brand)}

.svc{border:1px solid var(--line-2);border-radius:var(--r-panel);overflow:hidden;margin-top:18px}
.svc-row{display:grid;grid-template-columns:180px 1fr;border-top:1px solid var(--line-2)}
.svc-row:first-child{border-top:none}
.svc-name{padding:16px 18px;background:var(--g1);font-size:15px;font-weight:600;line-height:1.4;color:var(--ink)}
.svc-what{padding:16px 18px;border-left:1px solid var(--line-2)}
.legal-body .svc-what p{font-size:15px;line-height:1.55;margin:0}
.legal-body .svc-what p+p{margin-top:6px;color:var(--ink-3)}

@media (max-width:560px){
  .legal-hero{padding:44px 0 32px}
  .legal-hero .d-xl{font-size:40px;line-height:1.05}
  .legal-body{padding:36px 0 56px}
  .legal-body section{padding-top:32px}
  .legal-body h2{font-size:26px}
  .legal-body p,.legal-body li{font-size:16px}
  .legal-body section.legal-short{padding:20px 20px 22px}
  .legal-toc ol{columns:1}
  .svc-row{grid-template-columns:1fr}
  .svc-what{border-left:none;border-top:1px solid var(--line-2)}
}