:root{--bg:#0B1628;--lime:#E1FE64;--ice:#8BC4DF;--card:#101E36;--text:#fff}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:"Segoe UI",Tahoma,"Noto Sans Arabic",Arial,sans-serif;line-height:1.75}
a{color:var(--ice)}
.hero{text-align:center;padding:48px 20px 32px;background:radial-gradient(circle at 50% 0,#1A3A6B 0,var(--bg) 70%)}
.hero img{border-radius:24px}
h1{margin:12px 0 4px;font-size:2.2rem}
.lead{max-width:640px;margin:8px auto 20px;font-size:1.15rem}
.cta{display:inline-block;background:var(--lime);color:var(--bg);font-weight:700;padding:14px 28px;border-radius:14px;text-decoration:none;font-size:1.1rem}
.links{margin-top:14px}
main{max-width:960px;margin:0 auto;padding:0 20px 40px}
h2{color:var(--lime);border-bottom:1px solid #1A3A6B;padding-bottom:6px;margin-top:40px}
.grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.grid li{background:var(--card);border:1px solid #1A3A6B;border-radius:16px;padding:6px 18px}
.grid h3{color:var(--ice);margin:12px 0 0}
.steps li{margin:6px 0}
.note{background:var(--card);border-right:4px solid var(--lime);padding:10px 14px;border-radius:8px}
details{background:var(--card);border-radius:12px;margin:10px 0;padding:10px 16px}
summary{cursor:pointer;font-weight:700}
.en{color:#c9d6e3}
footer{text-align:center;color:#8aa0b8;font-size:.9rem;padding:20px;border-top:1px solid #1A3A6B}