:root{--navy:#24354D;--amber:#FAAC39;--ink:#111;--muted:#5a6676;--bg:#fff;--soft:#f4f6f9}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans Arabic",Tahoma,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}
a{color:var(--navy)}.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
header.nav{position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);border-bottom:1px solid #e6e9ee;z-index:5}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;color:var(--navy);text-decoration:none;font-size:1.2rem}
.brand img{width:36px;height:36px}.nav nav a{margin-inline-start:20px;text-decoration:none;color:var(--navy);font-weight:600}
.lang{border:2px solid var(--navy);background:none;border-radius:999px;padding:4px 14px;font-weight:700;color:var(--navy);cursor:pointer;margin-inline-start:20px;font:inherit}
.hero{background:var(--navy);color:#fff;padding:80px 0;text-align:center}
.hero img{width:min(260px,60vw);height:auto}
.hero h1{font-size:clamp(2.4rem,6vw,4rem);margin:10px 0 0;letter-spacing:.02em}
.hero p{font-size:clamp(1.1rem,2.5vw,1.5rem);color:var(--amber);margin:8px 0 28px}
.btn{display:inline-block;background:var(--amber);color:var(--navy);padding:12px 28px;border-radius:999px;font-weight:800;text-decoration:none}
section{padding:72px 0}section h2{color:var(--navy);font-size:2rem;margin:0 0 8px}
.lead{color:var(--muted);margin:0 0 32px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.card{background:var(--soft);border-radius:18px;padding:28px;border-top:4px solid var(--amber)}
.card .ic{font-size:2rem}.card h3{margin:8px 0;color:var(--navy)}.card p{margin:0;color:var(--muted)}
.alt{background:var(--soft)}.alt .card{background:#fff}
.contact a.mail{font-size:1.3rem;font-weight:700}
.note{display:inline-block;margin-top:10px;font-size:.85rem;color:var(--muted)}
footer{background:var(--navy);color:#cfd6e0;padding:28px 0;font-size:.95rem}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}footer a{color:var(--amber)}
.doc{padding:48px 0;max-width:760px}.doc h1{color:var(--navy)}.doc h2{font-size:1.3rem;margin-top:28px}
[dir=rtl] .ltr{direction:ltr;unicode-bidi:embed}
@media(max-width:640px){.nav nav a.hide-sm{display:none}}