/* The legal pages (terms, privacy, refunds) in English and Arabic.
   Served as /static/legal.css; the site's own colours and type. */
:root {
  --ink:#0A1220; --surface:#0F1B2E; --card:#142743; --border:#223A5E;
  --signal:#F2A93B; --signal2:#17B4CE; --muted:#7686A0; --text:#C9D4E3; --white:#F3F7FC;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--ink); color:var(--text); font-family:'Inter',sans-serif;
       font-size:16px; line-height:1.75; }
html[lang=ar] body { font-family:'Cairo',sans-serif; font-size:16.5px; line-height:1.9; }
a { color:var(--signal); }

nav { position:sticky; top:0; z-index:10; display:flex; align-items:center; justify-content:space-between;
      gap:16px; padding:14px 40px; border-bottom:1px solid var(--border); background:rgba(10,18,32,.94);
      backdrop-filter:blur(10px); }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; }
.brand-mark { width:36px; height:36px; border-radius:9px; background:#fff; flex:none;
              display:flex; align-items:center; justify-content:center; }
.brand-mark img { width:100%; height:100%; object-fit:contain; padding:3px; }
.logo { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:20px; color:var(--white); letter-spacing:-.4px; }
.logo span { color:var(--signal); }
.nav-links { display:flex; align-items:center; gap:22px; font-size:14px; font-weight:500; }
.nav-links a { color:var(--text); text-decoration:none; }
.nav-links a:hover, .nav-links a.on { color:var(--signal); }

main { max-width:820px; margin:0 auto; padding:52px 28px 70px; }
.eyebrow { font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--signal); letter-spacing:3px;
           text-transform:uppercase; margin-bottom:14px; }
html[lang=ar] .eyebrow { letter-spacing:0; font-family:'Cairo',sans-serif; font-size:13px; font-weight:600; }
h1 { font-family:'Space Grotesk',sans-serif; font-size:clamp(30px,4.6vw,44px); font-weight:700; color:var(--white);
     letter-spacing:-1px; line-height:1.15; margin-bottom:12px; }
html[lang=ar] h1 { font-family:'Cairo',sans-serif; letter-spacing:0; line-height:1.4; }
.updated { color:var(--muted); font-size:14px; margin-bottom:26px; }
.summary { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:18px 22px;
           margin-bottom:30px; }
.summary b { color:var(--white); }
.toc { border:1px solid var(--border); border-radius:14px; padding:16px 22px; margin-bottom:36px; font-size:14.5px; }
.toc ol { padding-inline-start:20px; columns:2; column-gap:30px; }
.toc a { color:var(--text); text-decoration:none; }
.toc a:hover { color:var(--signal); }
h2 { font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:700; color:var(--white);
     margin:38px 0 10px; scroll-margin-top:80px; }
html[lang=ar] h2 { font-family:'Cairo',sans-serif; }
h3 { font-size:16.5px; color:var(--white); margin:18px 0 6px; }
p { margin-bottom:12px; }
ul, ol { padding-inline-start:22px; margin-bottom:12px; }
li { margin-bottom:6px; }
li::marker { color:var(--signal); }
strong { color:var(--white); font-weight:600; }
table { width:100%; border-collapse:collapse; margin:10px 0 16px; font-size:14.5px; }
th, td { border:1px solid var(--border); padding:9px 12px; text-align:start; vertical-align:top; }
th { background:var(--surface); color:var(--white); font-weight:600; }
.num { direction:ltr; unicode-bidi:isolate; }
.contact { background:var(--card); border-radius:14px; padding:18px 22px; margin-top:30px; }

footer { border-top:1px solid var(--border); padding:24px 40px; display:flex; justify-content:space-between;
         gap:14px; flex-wrap:wrap; font-size:13px; color:var(--muted); }
.footer-links { display:flex; gap:18px; flex-wrap:wrap; }
.footer-links a { color:var(--muted); text-decoration:none; }
.footer-links a:hover { color:var(--signal); }

@media (max-width:700px) {
  nav { padding:12px 16px; }
  .nav-links { gap:14px; font-size:13px; }
  .nav-links .wide { display:none; }
  main { padding:34px 16px 50px; }
  .toc ol { columns:1; }
  footer { padding:20px 16px; flex-direction:column; }
}