/* =========================================================
   Subjex — the Terms of Use and Privacy Policy pages
   (terms.html, privacy.html). Builds on landing.css: its colours,
   type, header and footer. Each page holds the English and the Arabic
   text; legal.js shows one of them.
   ========================================================= */

.legal { padding-block: clamp(28px, 5vw, 56px) clamp(40px, 6vw, 72px); }

/* English | العربية */
.legal-switch { display: flex; gap: 8px; margin-inline-start: auto; }
.legal-switch a {
  font-size: var(--s-1); font-weight: 600; text-decoration: none;
  padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--card);
}
.legal-switch a[aria-current="true"] { background: var(--emerald); border-color: var(--emerald); color: var(--on-emerald); }
.legal-switch a[lang="ar"] { font-family: "Cairo", "Segoe UI", Tahoma, sans-serif; }

.legal-doc {
  max-width: 74ch; margin-inline: auto;
  background: var(--card); border: 1px solid var(--line); border-radius: 20px;
  padding: clamp(22px, 4vw, 48px);
}
.legal-doc + .legal-doc { margin-top: 32px; }
/* opened at #ar or #en: the title clears the sticky header */
.legal-doc { scroll-margin-top: 96px; }
.legal-doc h1 { font-size: clamp(1.9rem, 4vw, 2.6rem); margin-bottom: 10px; }
.legal-doc .updated { font-family: "IBM Plex Mono", monospace; font-size: .75rem; color: var(--ink-2); margin-bottom: 18px; }
.legal-doc .lead { color: var(--ink-2); margin-bottom: 14px; }
.legal-doc h2 { font-size: 1.2rem; letter-spacing: -.01em; line-height: 1.3; margin: 32px 0 10px; }
.legal-doc p { margin: 0 0 12px; }
.legal-doc ul { list-style: disc; padding-inline-start: 22px; margin: 0 0 14px; display: grid; gap: 7px; }
.legal-doc a { color: var(--emerald); font-weight: 600; overflow-wrap: anywhere; }
.legal-doc .box {
  background: var(--emerald-a); border-radius: 14px; padding: 14px 18px; margin: 0 0 14px;
}

/* the Arabic text in an Arabic face, without the Latin letter-spacing */
.legal-doc[lang="ar"],
.legal-doc[lang="ar"] h1,
.legal-doc[lang="ar"] h2 { font-family: "Cairo", "Segoe UI", Tahoma, sans-serif; letter-spacing: 0; }
.legal-doc[lang="ar"] { line-height: 1.9; }
.legal-doc[lang="ar"] h1,
.legal-doc[lang="ar"] h2 { line-height: 1.45; }
.legal-doc[lang="ar"] .updated { font-family: "Cairo", "Segoe UI", Tahoma, sans-serif; font-size: .85rem; }
.legal-doc [dir="ltr"] { unicode-bidi: isolate; }

.legal-foot .colophon { margin-top: 0; }
.legal-foot .colophon a { text-decoration: none; }
.legal-foot .colophon a:hover { text-decoration: underline; }