/* legal.css — privacy.html and terms.html. Same tokens as landing.html / index.html. */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg: #F8F6F1; --surface: #FFFFFF; --text: #1D2433; --muted: #5A6273;
  --border: #E5E0D6; --primary: #1F2A44; --accent: #B08D57; --accent-ink: #7D6234;
  --font-body: "IBM Plex Sans Arabic", system-ui, sans-serif;
  --font-display: "Noto Naskh Arabic", Georgia, serif;
}
html { color-scheme: only light; -webkit-text-size-adjust: 100%; }
body { font-family: var(--font-body); line-height: 1.85; background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }
a { color: var(--primary); text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 3px; border-radius: 4px; }

.top { border-bottom: 1px solid var(--border); background: var(--surface); }
.top .in { width: min(820px, 100% - 40px); margin-inline: auto; min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.brand { font-weight: 700; text-decoration: none; color: var(--text); }
.back { font-size: 0.9375rem; color: var(--muted); text-decoration: none; }
.back:hover { color: var(--text); }

main { width: min(820px, 100% - 40px); margin: 48px auto 72px; }
h1 { font-family: var(--font-display); font-size: clamp(1.75rem, 5vw, 2.375rem); line-height: 1.4; }
.updated { color: var(--muted); font-size: 0.9375rem; margin-top: 6px; }
.intro { margin-top: 24px; padding: 18px 22px; background: var(--surface); border: 1px solid var(--border); border-inline-start: 3px solid var(--accent); border-radius: 12px; }
h2 { font-size: 1.25rem; font-weight: 600; margin: 40px 0 12px; scroll-margin-top: 16px; }
h3 { font-size: 1.0625rem; font-weight: 600; margin: 20px 0 8px; }
p, li { color: #2E3545; }
p + p { margin-top: 10px; }
ul { padding-inline-start: 22px; display: grid; gap: 8px; margin-top: 8px; }
.toc { margin-top: 28px; padding: 18px 22px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }
.toc strong { display: block; margin-bottom: 6px; }
.toc ol { padding-inline-start: 22px; display: grid; gap: 4px; }
.ltr { direction: ltr; unicode-bidi: isolate; }
footer { border-top: 1px solid var(--border); padding: 24px 20px; text-align: center; font-size: 0.875rem; color: var(--muted); }
footer a { color: var(--muted); margin: 0 10px; }