/* Shared styles for Sabaat inner pages (articles, privacy policies, 404) */
:root{
  --bg-0:#04060f;--ink:#e9f0ff;--ink-dim:#9aa6c7;--brand:#22d3ee;--brand-2:#7c5cff;
  --glass-stroke:rgba(255,255,255,.12);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Tajawal','Cairo',system-ui,sans-serif;color:var(--ink);line-height:1.9;min-height:100vh;
  background:
    radial-gradient(1000px 600px at 85% -10%, rgba(124,92,255,.22), transparent 60%),
    radial-gradient(900px 500px at -10% 15%, rgba(34,211,238,.16), transparent 55%),
    var(--bg-0);
}
a{color:#9fe9f7}
img{max-width:100%;height:auto;display:block}
.top{position:sticky;top:0;z-index:10;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:rgba(4,6,15,.72);border-bottom:1px solid var(--glass-stroke)}
.top-in{max-width:1100px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.top-in .logo img{height:34px;width:auto}
.top nav{display:flex;gap:6px;flex-wrap:wrap}
.top nav a{color:var(--ink-dim);text-decoration:none;font-size:14px;padding:8px 12px;border-radius:10px}
.top nav a:hover{color:#fff;background:rgba(255,255,255,.06)}
.top nav a.cta{color:#001019;font-weight:700;background:linear-gradient(135deg,#22d3ee,#3b82f6)}
@media(max-width:640px){.top nav a:not(.cta){display:none}}
.wrap{max-width:820px;margin:0 auto;padding:48px 20px 80px}
.crumbs{font-size:13px;color:var(--ink-dim);margin-bottom:18px}
.crumbs a{color:var(--ink-dim);text-decoration:none}
.crumbs a:hover{color:#fff}
h1,h2,h3{font-family:'Cairo','Tajawal',sans-serif;line-height:1.45;color:#fff}
h1{font-size:clamp(30px,4.6vw,46px);font-weight:900;margin:0 0 12px}
h2{font-size:clamp(22px,2.6vw,28px);font-weight:800;margin:40px 0 12px}
h3{font-size:20px;margin:28px 0 10px}
.meta{color:var(--ink-dim);font-size:14px;margin-bottom:28px}
.cover{border-radius:20px;border:1px solid var(--glass-stroke);margin:0 0 32px;overflow:hidden}
.prose{font-size:17px;color:#cdd6f0}
.prose p{margin:0 0 16px}
.prose ul,.prose ol{padding-inline-start:22px;margin:0 0 18px}
.prose li{margin-bottom:8px}
.prose strong{color:#fff}
.prose table{width:100%;border-collapse:collapse;margin:8px 0 24px;font-size:15px;display:block;overflow-x:auto}
.prose th,.prose td{border:1px solid var(--glass-stroke);padding:10px 12px;text-align:start;vertical-align:top}
.prose th{background:rgba(34,211,238,.08);color:#fff}
.cards{display:grid;gap:18px}
.card{display:grid;grid-template-columns:220px 1fr;gap:20px;align-items:center;padding:16px;border-radius:20px;text-decoration:none;color:inherit;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid var(--glass-stroke);transition:border-color .25s,transform .25s}
.card:hover{border-color:rgba(34,211,238,.45);transform:translateY(-2px)}
.card img{border-radius:14px;aspect-ratio:16/10;object-fit:cover;width:100%}
.card h2{margin:0 0 6px;font-size:21px}
.card p{margin:0;color:var(--ink-dim);font-size:15px;line-height:1.8}
@media(max-width:640px){.card{grid-template-columns:1fr}}
.cta-box{margin-top:48px;padding:28px;border-radius:22px;text-align:center;background:radial-gradient(600px 200px at 50% -20%, rgba(124,92,255,.35), transparent 60%),linear-gradient(180deg,#0a1330,#04060f);border:1px solid var(--glass-stroke)}
.cta-box p{margin:0 0 16px;color:#cdd6f0}
.btn{display:inline-block;padding:13px 24px;border-radius:12px;font-weight:800;text-decoration:none;color:#001019;background:linear-gradient(135deg,#22d3ee,#3b82f6)}
.foot{border-top:1px solid var(--glass-stroke);padding:28px 20px;text-align:center;color:var(--ink-dim);font-size:13px}
.foot a{color:var(--ink-dim);margin:0 8px}
[dir="ltr"] .prose{font-size:16px}
