/* Legal pages (privacy, terms, data deletion): the landing's tokens and
   footer, with a plain reading column. Loaded after style.css. */
.legal-body{ font-family:"IBM Plex Sans",system-ui,sans-serif; }
.legal-hdr{ border-bottom:1px solid var(--line); background:var(--card); }
.legal-hdr-in{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.5rem 1rem; min-height:64px; }
.legal-brand img{ height:34px; width:auto; display:block; }
.legal-nav{ display:flex; gap:1.25rem; font-size:.9rem; }
.legal-nav a{ color:#3F5468; text-decoration:none; padding:.35rem 0; border-bottom:2px solid transparent; }
.legal-nav a:hover, .legal-nav a[aria-current="page"]{ color:var(--ink); border-bottom-color:var(--cyan); }
.legal{ max-width:760px; padding-top:48px; padding-bottom:88px; line-height:1.65; font-size:1rem; color:#1C2F42; }
.legal-kicker{ font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:#1F7A8C; margin:0 0 10px; }
.legal h1{ font-family:"Sora",sans-serif; font-weight:800; font-size:clamp(2rem,4.5vw,2.75rem); letter-spacing:-.02em; line-height:1.1; margin:0 0 14px; color:var(--ink); }
.legal h2{ font-family:"Sora",sans-serif; font-weight:700; font-size:1.25rem; letter-spacing:-.01em; margin:2.2rem 0 .6rem; color:var(--ink); }
.legal h3{ font-family:"Sora",sans-serif; font-weight:600; font-size:1rem; margin:1.3rem 0 .35rem; color:var(--ink); }
.legal p, .legal li{ margin:0 0 .75rem; }
.legal ul, .legal ol{ padding-left:1.3rem; }
.legal a{ color:#0E6F80; text-underline-offset:2px; }
.legal-meta{ color:#55697C; font-size:.95rem; }
.legal-toc{ display:flex; flex-wrap:wrap; gap:.4rem .9rem; margin:1.4rem 0 .4rem; padding:.9rem 1rem; background:var(--card); border:1px solid var(--line); border-radius:12px; font-size:.86rem; }
.legal-toc a{ text-decoration:none; color:#3F5468; }
.legal-toc a:hover{ color:var(--ink); }
.foot-links{ display:flex; gap:1rem; font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:.72rem; letter-spacing:.02em; }
.foot-links a{ color:#9FB4C6; text-decoration:none; }
.foot-links a:hover{ color:var(--cyan); }
@media (max-width:640px){ .legal-nav{ gap:.8rem; font-size:.82rem; } .legal-hdr-in{ height:auto; padding-block:12px; flex-wrap:wrap; } }
/* The header's links wrap on narrow screens rather than run off the page. */
.legal-nav{ flex-wrap:wrap; row-gap:.2rem; }
/* FAQ page: questions grouped under headings, opened like the landing page's. */
.faq-page .faq-group{ margin-top:2rem; }
.faq-page details{ border-bottom:1px solid var(--line); }
.faq-page h2 + details{ border-top:1px solid var(--line); }
.faq-page summary{ display:flex; justify-content:space-between; align-items:center; gap:1rem; min-height:44px; padding:.85rem 0; cursor:pointer; list-style:none; font-weight:600; color:var(--ink); }
.faq-page summary::-webkit-details-marker{ display:none; }
.faq-page summary::after{ content:'+'; font-size:1.3rem; font-weight:400; color:#1F7A8C; }
.faq-page details[open] summary::after{ content:'−'; }
.faq-page summary:focus-visible{ outline:2px solid #1F7A8C; outline-offset:3px; border-radius:4px; }
.faq-page details p{ margin:0 0 1rem; color:#33475B; }
.faq-talk{ display:inline-flex; margin-top:1.5rem; font-weight:600; }
/* Language switcher: plain links to the same page in each language. */
.legal-lang{ display:flex; gap:.3rem; font-size:.8rem; }
.legal-lang a{ display:inline-flex; align-items:center; min-height:32px; padding:0 .6rem; border:1px solid var(--line); border-radius:999px; color:#3F5468; text-decoration:none; }
.legal-lang a:hover{ border-color:#1F7A8C; color:var(--ink); }
.legal-lang a[aria-current]{ background:var(--ink); border-color:var(--ink); color:#fff; }
/* Chinese and Malay legal pages: the English version prevails. */
.legal-note{ margin:0 0 1.5rem; padding:.75rem 1rem; border-left:3px solid #1F7A8C; background:var(--card); font-size:.92rem; color:#33475B; }
/* Between phones and desktops the links take their own row under the logo and the language switcher, so nothing in
   the header is cut off; the pills keep their size. */
@media (max-width:900px){ .legal-nav{ order:3; flex-basis:100%; } .legal-hdr-in{ padding-block:10px; } }
.legal-lang{ flex-shrink:0; }
.legal-lang a{ white-space:nowrap; }