@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;700&display=swap');
:root{--primary:#2F5BFF;--accent:#FFC700;--ink:#0F172A;--muted:#64748B;--bg:#F6F8FC;--card:#FFFFFF;--ring:rgba(47,91,255,.14);--radius:16px;--maxw:1160px}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;font-family:'Cairo',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);
background:
radial-gradient(1200px 600px at 75% -10%, rgba(47,91,255,.08) 0%, transparent 50%),
radial-gradient(900px 480px at 10% 110%, rgba(255,199,0,.08) 0%, transparent 60%),
linear-gradient(180deg, var(--bg), #fff);line-height:1.8}
html[data-lang="ar"] .en{display:none!important} html[data-lang="en"] .ar{display:none!important}
html[data-lang="ar"]{direction:rtl} html[data-lang="en"]{direction:ltr}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 20px}
header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.78);backdrop-filter:saturate(150%) blur(6px);border-bottom:1px solid #e9eef7}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px;gap:16px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-weight:700}
.brand img{width:38px;height:38px;border-radius:10px;border:2px solid #fff;box-shadow:0 4px 14px var(--ring)}
.menu{display:flex;gap:14px;align-items:center}
.menu a{text-decoration:none;color:var(--ink);opacity:.9}.menu a:hover{color:var(--primary)}
.lang-btn{border:1px solid #dbe2f0;background:#fff;border-radius:999px;padding:8px 14px;cursor:pointer;font-weight:700}
.cta{background:var(--primary);color:#fff;padding:10px 16px;border-radius:12px;text-decoration:none;font-weight:700;box-shadow:0 6px 16px var(--ring)}
.cta.alt{background:var(--accent);color:#111}
.hero{padding:56px 0 30px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:center}
.badge{display:inline-flex;align-items:center;gap:10px;padding:8px 12px;border-radius:999px;background:#fff;border:1px solid #e8edfb;box-shadow:0 4px 12px var(--ring);margin-bottom:16px}
.badge span{font-weight:700;color:var(--primary)}
h1,h2,h3{font-weight:700;margin:0 0 10px} p,li,small,div,button,a,figcaption,summary{font-weight:400}
.subtitle{color:var(--muted)}
.mock{display:grid;place-items:center}
.mock img{width:100%;max-width:360px;height:auto;display:block;filter:drop-shadow(0 12px 24px rgba(0,0,0,.15))}
.windows{padding:12px 0 36px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.card{background:var(--card);border:1px solid #e8edf8;border-radius:18px;padding:12px;box-shadow:0 6px 18px var(--ring)}
.card h3{margin:6px 0 6px}.card p{margin:0;color:var(--muted)}
.thumb{border-radius:12px;border:1px solid #eaeef8;overflow:hidden;display:block}
.thumb img{width:100%;height:auto;display:block;transition:transform .25s ease}
.card:hover .thumb img{transform:scale(1.03)}
.cap{margin-top:8px}.cap small{display:block;color:#94a3b8}
.lightbox{position:fixed;inset:0;background:rgba(15,23,42,.65);display:none;align-items:center;justify-content:center;padding:20px;z-index:50}
.lightbox.open{display:flex}
.lb-content{background:#fff;border-radius:16px;box-shadow:0 24px 64px rgba(0,0,0,.2);max-width:95vw;max-height:90vh;display:grid;grid-template-rows:auto auto;gap:8px;padding:12px;border:1px solid #e7ecfb}
.lb-figure{display:grid;place-items:center}
.lb-figure img{max-width:92vw;max-height:72vh;border-radius:10px}
.lb-caption{text-align:center;color:#475569}
.lb-actions{position:absolute;inset-block-start:18px;inset-inline:18px;display:flex;justify-content:space-between;align-items:center}
.btn{border:1px solid #e2e8f0;background:#fff;border-radius:10px;padding:8px 12px;cursor:pointer;font-weight:700}
.lb-next,.lb-prev{position:absolute;inset-block-start:50%;transform:translateY(-50%)}
.lb-next{inset-inline-end:24px}.lb-prev{inset-inline-start:24px}
.lb-close{position:absolute;inset-block-start:18px;inset-inline-end:18px}
.contact{padding:8px 0 36px}
.contact .wrap{display:grid;gap:10px;border:1px solid #e7ecfb;border-radius:18px;padding:16px;background:linear-gradient(180deg,#F8FAFF,#FFFFFF);box-shadow:0 8px 24px rgba(47,91,255,.12)}
.form{display:grid;gap:10px;max-width:720px;width:100%}
label{font-weight:700}
input,textarea{width:100%;border:1px solid #dbe2f0;border-radius:12px;padding:10px 12px;font-family:'Cairo',sans-serif;font-size:16px}
textarea{min-height:120px;resize:vertical}
.help{color:#64748B}
footer{padding:24px 0;border-top:1px solid #e5e9f2;color:var(--muted)}
.foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
@media (max-width:1080px){.hero-grid{grid-template-columns:1fr}}
@media (max-width:900px){.grid{grid-template-columns:1fr 1fr}}
@media (max-width:540px){.grid{grid-template-columns:1fr}}

/* Center contact section (added by build) */
.contact .wrap{margin-left:auto;margin-right:auto;text-align:center;}
.contact .form{margin-left:auto;margin-right:auto;}