/* الفريح العقارية — الأنماط الكاملة (فُصلت من index.html للتخزين المؤقت المستقل وسهولة الصيانة) */
:root{
  --white:#FFFFFF; --black:#05080F;
  --navy:#0A1B3D; --blue-d:#0E2A5C; --blue-m:#1E5FB0; --blue-l:#4EA3F5;
  --sky:#EAF2FC; --bg:#F6F9FD; --surface:#FFFFFF;
  --text:#0C1A33; --muted:#5B6C8A; --line:#DCE6F4;
  --shadow:0 24px 55px -28px rgba(10,27,61,.5);
  --shadow-sm:0 10px 28px -18px rgba(10,27,61,.45);
  --disp:"Alexandria","Segoe UI",Tahoma,sans-serif;
  --body:"IBM Plex Sans Arabic","Segoe UI",Tahoma,sans-serif;
}
[data-theme="ocean"]{--navy:#06183A;--blue-d:#0A2454;--blue-m:#0F6ACB;--blue-l:#3D9BF0;--sky:#E4EEFB}
[data-theme="azure"]{--navy:#0B2340;--blue-d:#123566;--blue-m:#1E88E5;--blue-l:#63B3F7;--sky:#E8F3FE}
[data-theme="ice"]{--navy:#0A2038;--blue-d:#0F3253;--blue-m:#2196C9;--blue-l:#6FD3F2;--sky:#E6F5FB}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html{overflow-x:hidden}
body{font-family:var(--body);color:var(--text);background:var(--bg);line-height:1.75;overflow-x:hidden;max-width:100vw}
h1,h2,h3,h4,h5{font-family:var(--disp);line-height:1.3;color:var(--navy)}
a{color:inherit;text-decoration:none}
button{font-family:var(--body)}
.wrap{max-width:1220px;margin:0 auto;padding:0 24px}
.section{padding:92px 0;position:relative}
::selection{background:var(--blue-m);color:#fff}
:focus-visible{outline:2.5px solid var(--blue-l);outline-offset:2px}
.sec-head{text-align:center;max-width:700px;margin:0 auto 48px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;background:rgba(30,95,176,.08);border:1px solid rgba(30,95,176,.25);color:var(--blue-m);border-radius:24px;padding:7px 18px;font-weight:700;font-size:.78rem;letter-spacing:.05em}
.eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--blue-m);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(30,95,176,.5)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
.sec-title{font-size:clamp(1.75rem,3.7vw,2.6rem);font-weight:800;margin:18px 0 10px}
.sec-title .grad{background:linear-gradient(92deg,var(--blue-m),var(--blue-l));-webkit-background-clip:text;background-clip:text;color:transparent}
.sec-lead{color:var(--muted);font-size:1.02rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:700;font-size:.95rem;border:none;border-radius:14px;padding:14px 26px;cursor:pointer;transition:.22s;white-space:nowrap}
.btn-blue{background:linear-gradient(135deg,var(--blue-m),var(--blue-l));color:#fff;box-shadow:0 12px 26px -12px var(--blue-m)}
.btn-blue:hover{transform:translateY(-2px);box-shadow:0 18px 36px -12px var(--blue-m)}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--blue-d);transform:translateY(-2px)}
.btn-ghost-l{background:#fff;border:1.5px solid var(--line);color:var(--navy)}
.btn-ghost-l:hover{border-color:var(--blue-m);color:var(--blue-m)}
.btn-glass{background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.3);color:#fff;backdrop-filter:blur(6px)}
.btn-glass:hover{background:rgba(255,255,255,.18)}
.btn-wa{background:#1FA855;color:#fff;box-shadow:0 12px 26px -12px #1FA855}
.btn-wa:hover{filter:brightness(1.08);transform:translateY(-2px)}
.ico{width:19px;height:19px;flex:none}
.reveal{opacity:0;transform:translateY(28px);transition:.8s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.progressbar{position:fixed;top:0;inset-inline:0;height:3px;z-index:99}
.progressbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue-m),var(--blue-l))}
.toast{position:fixed;bottom:26px;left:50%;transform:translate(-50%,90px);z-index:1500;background:var(--navy);color:#fff;border-radius:14px;padding:14px 22px;display:flex;gap:11px;align-items:center;box-shadow:0 20px 50px -18px rgba(0,0,0,.6);transition:.4s cubic-bezier(.2,.9,.3,1.2);font-weight:600;font-size:.92rem;max-width:92vw}
.toast.show{transform:translate(-50%,0)}
.toast .tico{width:26px;height:26px;border-radius:50%;background:#1FA855;display:grid;place-items:center;flex:none}
.toast .tico svg{width:15px;height:15px;color:#fff}

header{position:fixed;inset-inline:0;top:0;z-index:80;transition:.35s}
header .bar{margin:14px auto 0;max-width:1220px;padding:0 24px}
header .inner{display:flex;align-items:center;justify-content:space-between;gap:14px;height:64px;padding:0 18px;border-radius:20px;background:rgba(5,8,15,.45);border:1px solid rgba(120,170,240,.2);backdrop-filter:blur(18px);transition:.35s}
header.scrolled .inner{background:rgba(5,8,15,.88);box-shadow:0 16px 40px -20px rgba(0,0,0,.6)}
.brand{display:flex;align-items:center;gap:11px}
.brand .mark{width:42px;height:42px;flex:none;filter:drop-shadow(0 0 10px rgba(78,163,245,.45))}
.brand b{font-family:var(--disp);font-weight:900;font-size:1.12rem;color:#fff;display:block;line-height:1.15}
.brand span{font-size:.63rem;color:#9db4dd;letter-spacing:.03em;display:block;max-width:210px;line-height:1.35}
.menu{display:flex;gap:2px}
.menu a{padding:9px 11px;border-radius:10px;font-weight:600;color:#dbe6f8;font-size:.89rem;transition:.2s}
.menu a:hover{background:rgba(78,163,245,.16);color:#fff}
.nav-right{display:flex;gap:9px;align-items:center}
.langbtn{background:rgba(255,255,255,.09);border:1px solid rgba(120,170,240,.22);height:42px;padding:0 .95rem;border-radius:12px;cursor:pointer;color:#fff;font-weight:800;font-size:.76rem;letter-spacing:.04em;transition:.2s}
.langbtn:hover{background:rgba(78,163,245,.22)}
.cmpbtn,.burger{position:relative;background:rgba(255,255,255,.09);border:1px solid rgba(120,170,240,.22);width:42px;height:42px;border-radius:12px;cursor:pointer;display:grid;place-items:center;color:#fff;transition:.2s}
.cmpbtn:hover,.burger:hover{background:rgba(78,163,245,.22)}
.cmpbtn svg{width:20px;height:20px}
.cmpbadge{position:absolute;top:-6px;inset-inline-end:-6px;background:var(--blue-l);color:var(--black);font-size:.7rem;font-weight:800;min-width:19px;height:19px;border-radius:10px;display:grid;place-items:center;padding:0 4px;transform:scale(0);transition:.25s cubic-bezier(.6,1.6,.5,1)}
.cmpbadge.show{transform:scale(1)}
.burger{flex-direction:column;gap:5px}
.burger span{width:20px;height:2px;background:#fff;border-radius:2px;display:block}
@media(max-width:1090px){.menu,.hd-wa{display:none}}

/* سهم التمرير بمودال التفاصيل: مخفي تمامًا بالحاسوب */
.scrollHint{display:none;position:sticky;bottom:6px;margin:-6px auto 0;width:40px;height:40px;place-items:center;border-radius:50%;background:linear-gradient(135deg,var(--blue-m),var(--blue-l));color:#fff;box-shadow:0 6px 16px rgba(18,58,122,.45);cursor:pointer;animation:hintBob 1.6s ease-in-out infinite;z-index:5;border:none}
.scrollHint svg{width:20px;height:20px}
@keyframes hintBob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@media(min-width:1091px){.burger{display:none}}
.drawer{position:fixed;inset:0;z-index:95;background:rgba(4,7,14,.6);opacity:0;pointer-events:none;transition:.3s;backdrop-filter:blur(4px)}
.drawer.open{opacity:1;pointer-events:auto}
.drawer .panel{position:absolute;top:0;bottom:0;right:0;width:min(320px,86%);background:linear-gradient(180deg,var(--navy),var(--black));padding:24px 20px;transform:translateX(100%);transition:.32s;display:flex;flex-direction:column;gap:4px;overflow:auto}
.drawer.open .panel{transform:translateX(0)}
.drawer a{padding:13px 12px;border-radius:11px;font-weight:600;color:#dbe6f8;border-bottom:1px solid rgba(255,255,255,.08)}
.drawer a:hover{background:rgba(78,163,245,.14);color:#fff}
.drawer .dclose{align-self:flex-start;background:none;border:none;font-size:1.8rem;color:#fff;cursor:pointer;margin-bottom:6px}

.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;color:#eaf1fc;overflow:hidden;padding:150px 0 120px;text-align:center;
background:radial-gradient(1100px 560px at 50% -14%,rgba(30,95,176,.4),transparent 58%),linear-gradient(178deg,var(--black) 0%,var(--navy) 56%,var(--blue-d) 100%)}
#bg3d{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity 1.6s ease}
#bg3d.on{opacity:1}
/* خلفية بديلة فورية (تظهر قبل اكتمال تحميل مكتبة 3D وتبقى أساساً خلفها) */
.hero-fallback{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  background:
   radial-gradient(1100px 520px at 78% 18%,rgba(78,163,245,.16),transparent 60%),
   radial-gradient(900px 600px at 15% 85%,rgba(37,99,235,.13),transparent 55%);
  animation:fallGlow 9s ease-in-out infinite alternate}
.hero-fallback::before{content:"";position:absolute;inset:-50%;
  background-image:radial-gradient(rgba(160,200,255,.55) 1px,transparent 1.6px),radial-gradient(rgba(120,170,240,.35) 1px,transparent 1.6px);
  background-size:190px 190px,290px 290px;background-position:0 0,80px 120px;
  animation:fallDrift 60s linear infinite;opacity:.5}
@keyframes fallGlow{from{opacity:.75}to{opacity:1}}
@keyframes fallDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(120px,80px,0)}}
@media(prefers-reduced-motion:reduce){.hero-fallback,.hero-fallback::before{animation:none}}
.hero .halo{position:absolute;left:50%;top:36%;transform:translate(-50%,-50%);width:min(720px,92vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(78,163,245,.22),transparent 62%);pointer-events:none;animation:breathe 7s ease-in-out infinite;z-index:1}
@keyframes breathe{0%,100%{opacity:.7;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.07)}}
.hero .content{position:relative;z-index:3}
.kicker{display:inline-flex;align-items:center;gap:10px;background:rgba(78,163,245,.12);border:1px solid rgba(78,163,245,.35);color:var(--blue-l);border-radius:26px;padding:8px 20px;font-weight:700;font-size:.78rem;margin-bottom:26px}
.kicker .kdot{width:8px;height:8px;border-radius:50%;background:var(--blue-l);animation:pulse 2s infinite}
.hero h1{font-size:clamp(2.1rem,6vw,4.3rem);font-weight:900;line-height:1.5;color:#fff}
.hero h1 .grad{background:linear-gradient(94deg,var(--blue-l) 10%,#d4e8ff 50%,var(--blue-l) 90%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:shimmer 5s linear infinite}
@keyframes shimmer{to{background-position:200% 0}}
.hero .tw{color:var(--blue-l)}
.hero .caret{display:inline-block;width:3px;height:.9em;background:var(--blue-l);vertical-align:-2px;animation:blink 1s steps(1) infinite;margin-inline-start:4px}

@keyframes blink{50%{opacity:0}}
.hero .lead{color:#b9cdec;font-size:1.1rem;max-width:640px;margin:34px auto 32px}
.hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.hero-stats{display:flex;gap:14px;justify-content:center;margin-top:44px;flex-wrap:wrap}
.hst{padding:16px 26px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(120,170,240,.22);backdrop-filter:blur(12px);min-width:140px;transition:.25s}
.hst:hover{transform:translateY(-4px);border-color:rgba(78,163,245,.5)}
.hst b{font-family:var(--disp);font-weight:900;font-size:1.85rem;color:#fff;display:block;line-height:1.15}
.hst b i{font-style:normal;color:var(--blue-l)}
.hst span{color:#9db4dd;font-size:.82rem}
.hticker{margin-top:48px;display:flex;overflow:hidden;mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.hticker .track{display:flex;gap:14px;animation:tick 30s linear infinite;flex:none;padding-inline-end:14px}
@keyframes tick{to{transform:translateX(50%)}}
html[dir="ltr"] .hticker .track{animation-name:tickL} /* بالإنجليزية الاتجاه معاكس — وإلا خرج الشريط من الحاوية واختفى */
@keyframes tickL{to{transform:translateX(-50%)}}
.tk{flex:none;display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.06);border:1px solid rgba(120,170,240,.2);border-radius:14px;padding:10px 18px;font-size:.85rem;color:#cfdef5;cursor:pointer;transition:.2s;backdrop-filter:blur(8px)}
.tk:hover{border-color:var(--blue-l);transform:translateY(-2px)}
.tk b{color:var(--blue-l);font-family:var(--disp)}
.tk .tag{font-size:.68rem;font-weight:800;padding:2px 10px;border-radius:12px;background:var(--blue-m);color:#fff}
.tk .tag.s{background:#fff;color:var(--navy)}
.hero .fade{position:absolute;inset-inline:0;bottom:0;height:130px;background:linear-gradient(180deg,transparent,var(--bg));z-index:2;pointer-events:none}
.scrolldn{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:#9db4dd;font-size:.75rem;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:3}

.scrolldn .mouse{width:22px;height:36px;border:2px solid #9db4dd;border-radius:12px;position:relative}
.scrolldn .mouse::after{content:"";position:absolute;top:6px;left:50%;transform:translateX(-50%);width:3px;height:7px;border-radius:2px;background:var(--blue-l);animation:wheel 1.6s infinite}
@keyframes wheel{0%{opacity:1;top:6px}100%{opacity:0;top:18px}}

.matcher-strip{position:relative;z-index:5;margin-top:-64px}

.matcher{max-width:1020px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);padding:22px 28px;display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center}
.matcher .mtop{display:flex;align-items:center;gap:12px;padding-inline-end:22px;border-inline-end:1px solid var(--line)}
.matcher .mi{width:52px;height:52px;border-radius:15px;background:linear-gradient(135deg,var(--blue-m),var(--blue-l));display:grid;place-items:center;color:#fff;flex:none;box-shadow:0 10px 24px -10px var(--blue-m)}
.matcher .mi svg{width:26px;height:26px}
.matcher .mtop b{font-family:var(--disp);font-size:1.05rem;color:var(--navy);display:block;white-space:nowrap}
.matcher .mtop span{color:var(--muted);font-size:.75rem;white-space:nowrap}
.mflow{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.mq{font-weight:800;color:var(--navy);font-size:1rem}
.mopts{display:flex;gap:9px;flex-wrap:wrap}
.mopt{background:var(--sky);border:1.5px solid transparent;border-radius:13px;padding:11px 20px;color:var(--navy);font-weight:700;font-size:.88rem;cursor:pointer;transition:.2s}
.mopt:hover{border-color:var(--blue-m);background:#fff;transform:translateY(-2px)}
.mprog{display:flex;gap:5px;margin-inline-start:auto}
.mprog i{width:24px;height:4px;border-radius:3px;background:var(--line)}
.mprog i.done{background:linear-gradient(90deg,var(--blue-m),var(--blue-l))}
.mres{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.mres .big{font-family:var(--disp);font-weight:800;color:var(--navy);font-size:1rem}
.mres p{color:var(--muted);font-size:.85rem}
.mreset{background:none;border:none;color:var(--muted);font-size:.8rem;cursor:pointer;text-decoration:underline}
@media(max-width:860px){.matcher{grid-template-columns:1fr}.matcher .mtop{border-inline-end:none;border-bottom:1px solid var(--line);padding:0 0 14px}}

#listings{padding-top:88px}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:26px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:14px 18px;box-shadow:var(--shadow-sm)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1.5px solid var(--line);background:#fff;color:var(--navy);font-weight:700;font-size:.85rem;padding:9px 18px;border-radius:24px;cursor:pointer;transition:.2s}
.chip.on{background:linear-gradient(135deg,var(--blue-m),var(--blue-l));border-color:transparent;color:#fff;box-shadow:0 8px 20px -8px var(--blue-m)}
.chip:hover:not(.on){border-color:var(--blue-m);color:var(--blue-m)}
.tb-controls{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.pricectl{display:flex;flex-direction:column;gap:2px;min-width:180px}
.pricectl label{font-size:.75rem;color:var(--muted);font-weight:700;display:flex;justify-content:space-between}
.pricectl label b{color:var(--blue-m);font-family:var(--disp)}
.pricectl input[type=range]{width:100%;accent-color:var(--blue-m);cursor:pointer}
.sortctl select{border:1.5px solid var(--line);border-radius:11px;padding:9px 12px;font-family:var(--body);font-weight:600;color:var(--navy);background:#fff;font-size:.87rem}
.rescount{font-size:.9rem;color:var(--muted);font-weight:600}
.rescount b{color:var(--blue-m);font-family:var(--disp)}
.viewtg{display:flex;border:1.5px solid var(--line);border-radius:12px;overflow:hidden}
.viewtg button{border:none;background:#fff;padding:9px 14px;cursor:pointer;color:var(--muted);display:grid;place-items:center;transition:.2s}
.viewtg button.on{background:var(--navy);color:#fff}
.viewtg svg{width:17px;height:17px}
.tblwrap{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;border-radius:14px}
.xlsbtn{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--line);background:#fff;color:var(--navy);font-weight:700;font-size:.83rem;padding:9px 15px;border-radius:12px;cursor:pointer;transition:.2s}
.xlsbtn:hover{border-color:#1FA855;color:#1FA855}
.xlsbtn svg{width:16px;height:16px}
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.pcard{position:relative;border-radius:20px;overflow:hidden;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm);transition:border-color .25s,box-shadow .25s;display:flex;flex-direction:column;will-change:transform}
.pcard:hover{border-color:#b9d0ef;box-shadow:var(--shadow)}
.pcard.hl{outline:2.5px solid var(--blue-m);outline-offset:3px}
.pcard.feat{grid-column:span 2;grid-row:span 2}
@media(max-width:1000px){.bento{grid-template-columns:repeat(2,1fr)}.pcard.feat{grid-column:span 2;grid-row:span 1}}
@media(max-width:620px){.bento{grid-template-columns:1fr}.pcard.feat{grid-column:span 1}}
.shine{position:absolute;inset:0;background:radial-gradient(440px circle at var(--mx,50%) var(--my,50%),rgba(78,163,245,.14),transparent 46%);opacity:0;transition:.3s;pointer-events:none;z-index:2}
.pcard:hover .shine{opacity:1}
.pcar{position:relative;aspect-ratio:16/10;overflow:hidden;direction:ltr;flex:none}
.pcard.feat .pcar{aspect-ratio:auto;flex:1;min-height:260px}
.ptrack{display:flex;height:100%;transition:transform .38s cubic-bezier(.3,.8,.3,1)}
.pslide{min-width:100%;height:100%;display:grid;place-items:center;color:rgba(255,255,255,.55)}
.pslide svg{width:58px;height:58px}
.pcard.feat .pslide svg{width:90px;height:90px}
.pcar .arw{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;background:rgba(5,8,15,.5);border:none;color:#fff;cursor:pointer;display:grid;place-items:center;opacity:0;transition:.2s;z-index:3}
.pcar:hover .arw{opacity:1}
.pcar .arw:hover{background:var(--blue-m)}
.pcar .arw.l{left:8px}.pcar .arw.r{right:8px}
.pcar .arw svg{width:15px;height:15px}
.pdots{position:absolute;bottom:9px;left:50%;transform:translateX(-50%);display:flex;gap:5px;z-index:3}
.pdots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.55);transition:.2s}
.pdots i.on{background:#fff;width:18px;border-radius:4px}
.ptag{position:absolute;top:12px;inset-inline-end:12px;font-weight:800;font-size:.73rem;color:#fff;padding:5px 14px;border-radius:20px;z-index:3}
.ptag.sale{background:var(--navy)}
.ptag.rent{background:var(--blue-m)}
.pnew{position:absolute;top:12px;inset-inline-end:86px;background:linear-gradient(135deg,#16a34a,#22c55e);color:#fff;border:none;font-weight:800;font-size:.68rem;padding:5px 12px;border-radius:20px;z-index:3;box-shadow:0 4px 12px rgba(22,163,74,.45);text-shadow:0 1px 2px rgba(0,0,0,.15)}
.cmpchk{position:absolute;top:10px;left:10px;z-index:4;display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.94);border:none;border-radius:20px;padding:7px 13px;font-size:.73rem;font-weight:800;color:var(--navy);cursor:pointer;transition:.2s;box-shadow:0 4px 12px rgba(0,0,0,.18)}
.cmpchk:hover{transform:scale(1.06)}
.cmpchk.on{background:var(--blue-m);color:#fff}
.cmpchk svg{width:13px;height:13px}
.pbody{padding:16px 18px 18px;display:flex;flex-direction:column;gap:10px;flex:1;position:relative;z-index:3;background:var(--surface)}
.ptype{font-size:.78rem;color:var(--muted);font-weight:700}
.pname{font-family:var(--disp);font-size:1.14rem;font-weight:800;color:var(--navy)}
.pcard.feat .pname{font-size:1.5rem}
.pprice{font-family:var(--disp);font-weight:900;font-size:1.3rem;color:var(--blue-m)}
.pcard.feat .pprice{font-size:1.7rem}
.pprice small{font-family:var(--body);font-weight:500;color:var(--muted);font-size:.74rem}
.pspecs{display:flex;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:.82rem;padding:10px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pspecs span{display:inline-flex;align-items:center;gap:5px}
.pspecs svg{width:16px;height:16px;color:var(--blue-m)}
.ploc{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:.85rem}
.ploc svg{width:15px;height:15px;color:var(--blue-m);flex:none}
.ploc code{background:var(--sky);color:var(--blue-m);padding:1px 9px;border-radius:6px;font-size:.73rem;margin-inline-start:auto;font-weight:700}
.pactions{display:flex;gap:8px;margin-top:auto}
.pactions .btn{flex:1;padding:11px 8px;font-size:.84rem;border-radius:12px}
.empty{grid-column:1/-1;text-align:center;color:var(--muted);padding:56px;background:var(--surface);border:1.5px dashed var(--line);border-radius:20px}

.tblwrap{overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm)}
.ltable{width:100%;border-collapse:collapse;font-size:.88rem;min-width:820px}
.ltable th{background:var(--navy);color:#fff;font-family:var(--disp);font-weight:700;padding:13px 12px;text-align:right;white-space:nowrap}
.ltable td{padding:12px;border-bottom:1px solid var(--line);white-space:nowrap}
.ltable tr:hover td{background:var(--sky)}
.ltable .tprice{font-family:var(--disp);font-weight:800;color:var(--blue-m)}
.ltable .ttag{font-size:.7rem;font-weight:800;color:#fff;padding:3px 11px;border-radius:14px}
.ltable .tbtn{border:1.5px solid var(--line);background:#fff;border-radius:9px;padding:6px 12px;font-size:.78rem;font-weight:700;color:var(--navy);cursor:pointer;transition:.2s}
.ltable .tbtn:hover{border-color:var(--blue-m);color:var(--blue-m)}
.ltable .tbtn.bk{background:var(--blue-m);border-color:var(--blue-m);color:#fff}

.tray{position:fixed;bottom:-130px;inset-inline:0;z-index:85;transition:.4s cubic-bezier(.3,.9,.3,1)}
.tray.show{bottom:18px}
.tray .tinner{max-width:760px;margin:0 auto;background:var(--navy);color:#fff;border-radius:18px;padding:13px 16px;display:flex;align-items:center;gap:14px;box-shadow:0 24px 55px -22px rgba(0,0,0,.7);border:1px solid rgba(120,170,240,.25);margin-inline:22px}
@media(min-width:800px){.tray .tinner{margin-inline:auto}}
.tray .titems{display:flex;gap:8px;flex:1;overflow:auto}
.trayClose{background:rgba(255,255,255,.12);border:none;color:#fff;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:.95rem;flex:none;display:grid;place-items:center}
.trayClose:hover{background:rgba(255,255,255,.25)}
.titem{background:rgba(255,255,255,.1);border-radius:11px;padding:7px 12px;font-size:.8rem;font-weight:700;display:flex;align-items:center;gap:8px;white-space:nowrap}
.titem button{background:none;border:none;color:#9db4dd;cursor:pointer;font-size:1rem}

.map-sec{background:linear-gradient(180deg,var(--navy) 0%,var(--blue-d) 100%);color:#dbe6f7;position:relative}
.map-sec::before{content:"";position:absolute;inset-inline:0;top:-1px;height:80px;background:linear-gradient(180deg,var(--bg),transparent)}
.map-sec .sec-title{color:#fff}.map-sec .sec-lead{color:#9db4dd}
.map-sec .eyebrow{background:rgba(78,163,245,.12);border-color:rgba(78,163,245,.35);color:var(--blue-l)}
.map-sec .eyebrow .dot{background:var(--blue-l)}
.map-grid{display:grid;grid-template-columns:1.55fr .85fr;gap:22px}
.map-mode{position:absolute;top:14px;inset-inline-end:14px;z-index:500;background:rgba(10,23,48,.85);color:#fff;border:1px solid rgba(120,170,240,.35);border-radius:11px;padding:7px 13px;font-size:.74rem;font-weight:800;cursor:pointer;backdrop-filter:blur(8px);transition:.2s}
.map-mode:hover{background:rgba(37,99,235,.9)}
.map-wrap.lightmap{background:#e8eef7}
.map-wrap{position:relative;border-radius:24px;overflow:hidden;border:1px solid rgba(120,170,240,.25);min-height:540px;background:#0a1836;box-shadow:0 34px 70px -32px rgba(0,0,0,.8)}
#leafmap{position:absolute;inset:0;direction:ltr;z-index:1;background:#0a1836}
.map-legend{position:absolute;bottom:14px;inset-inline-start:14px;z-index:500;background:rgba(5,8,15,.82);backdrop-filter:blur(10px);border:1px solid rgba(120,170,240,.25);border-radius:13px;padding:10px 16px;display:flex;gap:16px;font-size:.8rem;color:#dbe6f7}
.map-legend span{display:inline-flex;align-items:center;gap:7px;font-weight:600}
.map-legend i{width:12px;height:12px;border-radius:50%}
.map-fallback{position:absolute;inset:0;display:none;place-items:center;text-align:center;color:#9db4dd;padding:30px;z-index:2}
.lmk{background:none!important;border:none!important}
.lmk .pinwrap{position:relative;transform:translate(-50%,-100%);cursor:pointer}
.lmk .pin{background:#fff;color:var(--navy);font-family:var(--disp);font-weight:800;font-size:12px;padding:6px 12px;border-radius:20px;white-space:nowrap;box-shadow:0 8px 22px -4px rgba(0,0,0,.6);transition:.2s;display:block;border:2px solid var(--blue-m);direction:rtl}
.lmk .pin small{font-weight:600;color:#5b6c8a;font-size:10px}
.lmk.rent .pin{border-color:var(--blue-l)}
.lmk .tip{position:absolute;top:100%;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:#fff}
.lmk .ring{position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%,-50%);width:12px;height:12px;border-radius:50%;background:var(--blue-l)}
.lmk .ring::after{content:"";position:absolute;inset:-9px;border-radius:50%;border:2px solid var(--blue-l);animation:ringp 2.2s infinite}
@keyframes ringp{0%{transform:scale(.45);opacity:1}100%{transform:scale(1.55);opacity:0}}
.lmk:hover .pin,.lmk.active .pin{background:var(--blue-m);color:#fff;transform:scale(1.15)}
.lmk:hover .pin small,.lmk.active .pin small{color:#dbeafe}
.leaflet-container{font-family:var(--body)}
.leaflet-control-attribution{background:rgba(5,8,15,.7)!important;color:#63769c!important;font-size:9px!important}
.leaflet-control-attribution a{color:#8fa6ce!important}
.leaflet-control-zoom a{background:rgba(5,8,15,.85)!important;color:#fff!important;border-color:rgba(120,170,240,.25)!important}
.map-side{background:rgba(255,255,255,.05);border:1px solid rgba(120,170,240,.22);border-radius:24px;padding:20px;display:flex;flex-direction:column;gap:12px;max-height:540px;backdrop-filter:blur(8px)}
.map-side h3{color:#fff;font-size:1.18rem}
.map-side .mnote{color:#9db4dd;font-size:.83rem;margin-top:-4px}
.mapListWrap{padding-inline-end:38px} /* مساحة ثابتة لعمود الأسهم كي لا يتراكب مع نص البطاقات */
.mlist{display:flex;flex-direction:column;gap:9px;overflow:auto;height:100%}
.vnav{display:none;position:absolute;inset-inline-end:0;top:0;bottom:0;width:32px;flex-direction:column;justify-content:space-between;align-items:center;pointer-events:none;padding:2px 0}
.vnav button{pointer-events:auto;width:32px;height:32px;border-radius:10px;border:1px solid rgba(120,170,240,.3);background:rgba(10,23,48,.85);color:#fff;cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 12px rgba(0,0,0,.35);transition:.2s}
.vnav button svg{width:16px;height:16px}
.vnav button:hover{background:var(--blue-m)}
.vnav button:active{transform:scale(.92)}
.mrow{display:flex;gap:11px;align-items:center;padding:12px;border:1px solid rgba(120,170,240,.2);border-radius:14px;cursor:pointer;transition:.2s;background:rgba(255,255,255,.04)}
.mrow:hover,.mrow.active{border-color:var(--blue-l);background:rgba(78,163,245,.16);transform:translateX(-4px)}
.mrow .mdot{width:11px;height:11px;border-radius:50%;flex:none}
.mrow b{font-size:.9rem;color:#fff;display:block}
.mrow small{color:#9db4dd;font-size:.77rem}
.mrow .mp{margin-inline-start:auto;font-family:var(--disp);font-weight:800;color:var(--blue-l);font-size:.88rem;white-space:nowrap}
@media(max-width:920px){.map-grid{grid-template-columns:1fr}.map-wrap{min-height:410px}.map-side{max-height:330px}}

.band-img{position:relative;min-height:420px;display:grid;place-items:center;overflow:hidden;isolation:isolate;text-align:center;color:#fff;padding:90px 24px;
background-image:
 linear-gradient(180deg,rgba(5,8,15,.72),rgba(10,27,61,.78)),
 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='700' viewBox='0 0 1600 700'%3E%3Cdefs%3E%3ClinearGradient id='s' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%231E5FB0'/%3E%3Cstop offset='1' stop-color='%2305080F'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='1600' height='700' fill='url(%23s)'/%3E%3Cg fill='%230A1B3D'%3E%3Crect x='40' y='330' width='120' height='370'/%3E%3Crect x='180' y='240' width='90' height='460'/%3E%3Crect x='290' y='390' width='140' height='310'/%3E%3Crect x='450' y='170' width='110' height='530'/%3E%3Cpath d='M505 170 L505 90 L560 170 Z'/%3E%3Crect x='580' y='300' width='100' height='400'/%3E%3Crect x='700' y='120' width='130' height='580'/%3E%3Crect x='850' y='260' width='95' height='440'/%3E%3Crect x='965' y='350' width='140' height='350'/%3E%3Crect x='1125' y='200' width='105' height='500'/%3E%3Crect x='1250' y='310' width='120' height='390'/%3E%3Crect x='1390' y='250' width='95' height='450'/%3E%3C/g%3E%3Cg fill='%234EA3F5' opacity='.85'%3E%3Crect x='470' y='210' width='9' height='9'/%3E%3Crect x='492' y='210' width='9' height='9'/%3E%3Crect x='514' y='210' width='9' height='9'/%3E%3Crect x='470' y='240' width='9' height='9'/%3E%3Crect x='514' y='240' width='9' height='9'/%3E%3Crect x='470' y='270' width='9' height='9'/%3E%3Crect x='492' y='270' width='9' height='9'/%3E%3Crect x='725' y='160' width='9' height='9'/%3E%3Crect x='748' y='160' width='9' height='9'/%3E%3Crect x='771' y='160' width='9' height='9'/%3E%3Crect x='794' y='160' width='9' height='9'/%3E%3Crect x='725' y='195' width='9' height='9'/%3E%3Crect x='771' y='195' width='9' height='9'/%3E%3Crect x='725' y='230' width='9' height='9'/%3E%3Crect x='748' y='230' width='9' height='9'/%3E%3Crect x='794' y='230' width='9' height='9'/%3E%3Crect x='748' y='265' width='9' height='9'/%3E%3Crect x='771' y='265' width='9' height='9'/%3E%3Crect x='1150' y='240' width='9' height='9'/%3E%3Crect x='1173' y='240' width='9' height='9'/%3E%3Crect x='1196' y='240' width='9' height='9'/%3E%3Crect x='1150' y='275' width='9' height='9'/%3E%3Crect x='1196' y='275' width='9' height='9'/%3E%3Crect x='1150' y='310' width='9' height='9'/%3E%3Crect x='1173' y='310' width='9' height='9'/%3E%3Crect x='205' y='280' width='8' height='8'/%3E%3Crect x='225' y='280' width='8' height='8'/%3E%3Crect x='205' y='310' width='8' height='8'/%3E%3Crect x='872' y='300' width='8' height='8'/%3E%3Crect x='892' y='300' width='8' height='8'/%3E%3Crect x='912' y='300' width='8' height='8'/%3E%3Crect x='872' y='330' width='8' height='8'/%3E%3Crect x='912' y='330' width='8' height='8'/%3E%3C/g%3E%3C/svg%3E");
background-size:cover;background-position:center;background-attachment:fixed}
@media(hover:none),(max-width:760px){.band-img{background-attachment:scroll}}
.band-img h2{color:#fff;font-size:clamp(1.7rem,4vw,2.6rem);font-weight:900;margin-bottom:12px}
.band-img h2 .grad{background:linear-gradient(92deg,var(--blue-l),#cfe6ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.band-img p{color:#c4d6f1;max-width:560px;margin:0 auto 26px;font-size:1.05rem}
.band-badges{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.bbadge{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.08);border:1px solid rgba(120,170,240,.3);backdrop-filter:blur(8px);border-radius:14px;padding:11px 18px;font-size:.88rem;font-weight:700;color:#eaf1fc}
.bbadge svg{width:18px;height:18px;color:var(--blue-l)}

.serv-cta{margin-top:40px;background:linear-gradient(135deg,var(--navy),#123a7a);border-radius:22px;padding:28px 32px;display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;box-shadow:0 24px 50px -28px rgba(10,23,48,.7)}
.serv-cta h3{color:#fff;font-size:1.15rem;margin-bottom:6px}
.serv-cta p{color:#b9cdf0;font-size:.85rem;max-width:440px}
.serv-cta-btns{display:flex;gap:10px;flex-wrap:wrap}
.serv-sec{background:var(--bg);position:relative}
.serv-sec::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(30,95,176,.09) 1.5px,transparent 1.5px);background-size:26px 26px;mask:linear-gradient(180deg,transparent,#000 18%,#000 82%,transparent);pointer-events:none}
.serv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px;position:relative}
.flip{perspective:1100px;height:250px}
.flipin{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.3,.8,.3,1)}
.flip:hover .flipin,.flip.tapped .flipin{transform:rotateY(180deg)}
.fface{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:22px;padding:28px 24px;display:flex;flex-direction:column;justify-content:center;gap:12px}
.fface.front{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm);align-items:center;text-align:center}
.fface.front .si{width:64px;height:64px;border-radius:18px;background:linear-gradient(135deg,var(--blue-m),var(--blue-l));display:grid;place-items:center;color:#fff;box-shadow:0 12px 28px -12px var(--blue-m)}
.fface.front .si svg{width:32px;height:32px}
.fface.front h4{font-size:1.2rem}
.fface.front .hint{color:var(--muted);font-size:.76rem;display:inline-flex;align-items:center;gap:6px}
.fface.front .hint svg{width:14px;height:14px}
.fface.back{background:linear-gradient(150deg,var(--blue-d),var(--navy));border:1px solid rgba(78,163,245,.4);transform:rotateY(180deg)}
.fface.back h4{font-size:1.1rem;color:var(--blue-l)}
.fface.back p{color:#cdddf5;font-size:.9rem}
.fface.back .btn{margin-top:auto;padding:11px;font-size:.85rem}

.about-sec{background:var(--surface)}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.stat{padding:22px;border-radius:18px;background:var(--bg);border:1px solid var(--line);position:relative;overflow:hidden;transition:.25s}
.stat::after{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--blue-m),var(--blue-l))}
.stat:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm)}
.stat b{font-family:var(--disp);font-size:2rem;font-weight:900;color:var(--navy);display:block;line-height:1}
.stat b i{font-style:normal;color:var(--blue-m)}
.stat span{color:var(--muted);font-size:.86rem;font-weight:600}
.values{display:flex;flex-direction:column;gap:14px;margin-top:22px}
.value{display:flex;gap:14px;align-items:flex-start}
.value .vi{width:42px;height:42px;flex:none;border-radius:12px;background:var(--sky);display:grid;place-items:center;color:var(--blue-m)}
.value .vi svg{width:21px;height:21px}
.value h4{font-size:1rem;margin-bottom:2px}
.value p{color:var(--muted);font-size:.88rem}
@media(max-width:860px){.about-grid{grid-template-columns:1fr;gap:30px}}
.tstm{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px;margin-top:52px}
.tcard{background:var(--bg);border:1px solid var(--line);border-radius:18px;padding:22px;position:relative;transition:.25s}
.tcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm)}
.tcard .q{font-size:2.4rem;font-family:var(--disp);color:var(--blue-l);line-height:1;position:absolute;top:12px;inset-inline-end:18px;opacity:.5}
.tcard p{color:var(--muted);font-size:.92rem;margin-bottom:14px}
.tcard .who{display:flex;align-items:center;gap:11px}
.tcard .av{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--blue-m),var(--blue-l));color:#fff;display:grid;place-items:center;font-family:var(--disp);font-weight:800}
.tcard b{font-size:.9rem;color:var(--navy);display:block;line-height:1.3}
.tcard small{color:var(--muted);font-size:.76rem}
.tcard .strs{color:#F5A623;font-size:.8rem;letter-spacing:2px}

.career-sec{background:var(--sky)}
.jobs{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px}
.job{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:12px;transition:.25s}
.job:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.job .jtop{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.job h4{font-size:1.12rem}
.job .jbadge{font-size:.71rem;font-weight:800;color:var(--blue-m);background:var(--sky);padding:5px 12px;border-radius:20px;white-space:normal;align-self:flex-start;max-width:100%}
.job .jmeta{display:flex;gap:16px;color:var(--muted);font-size:.85rem}
.job .jmeta span{display:inline-flex;align-items:center;gap:6px}
.job .jmeta svg{width:15px;height:15px;color:var(--blue-m)}
.job p{color:var(--muted);font-size:.9rem;flex:1}
.hire-cta{margin-top:24px;background:linear-gradient(135deg,var(--navy),var(--blue-d));color:#eaf1fb;border-radius:22px;padding:28px;display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;position:relative;overflow:hidden}
.hire-cta::after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(78,163,245,.32),transparent 70%);top:-130px;inset-inline-end:-70px}
.hire-cta b{color:#fff;font-family:var(--disp);font-size:1.2rem}
.hire-cta p{color:#9db4dd}
.hire-cta>*{position:relative;z-index:2}

.contact-sec{background:var(--surface)}
.contact-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:26px}
.cinfo{display:flex;flex-direction:column;gap:13px}
.cline{display:flex;gap:14px;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:16px 18px;transition:.2s}
.cline:hover{transform:translateX(-4px);box-shadow:var(--shadow-sm)}
.cline .ci{width:46px;height:46px;flex:none;border-radius:13px;background:var(--sky);display:grid;place-items:center;color:var(--blue-m)}
.cline .ci svg{width:22px;height:22px}
.cline b{display:block;color:var(--navy);font-family:var(--disp);font-size:.97rem}
.cline span{color:var(--muted);font-size:.86rem}
.cline.wa{background:#1FA855;border-color:#1FA855;cursor:pointer}
.cline.wa .ci{background:rgba(255,255,255,.2);color:#fff}
.cline.wa b,.cline.wa span{color:#fff}
.cform{background:var(--bg);border:1px solid var(--line);border-radius:22px;padding:28px}
.cform h3{font-size:1.28rem;margin-bottom:6px}
.cform .sub{color:var(--muted);font-size:.85rem;margin-bottom:16px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field label{display:block;font-size:.79rem;font-weight:700;color:var(--muted);margin-bottom:6px}
.field select,.field input,.field textarea{width:100%;font-family:var(--body);font-size:.95rem;color:var(--text);background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:12px 13px;transition:.2s}
.field :is(select,input,textarea):focus{outline:none;border-color:var(--blue-m);box-shadow:0 0 0 3px rgba(30,95,176,.12)}
.cform .field,.bkform .field{margin-bottom:13px}
.cform textarea{min-height:92px;resize:vertical}
.cnote{font-size:.77rem;color:var(--muted);margin-top:8px}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}.frow{grid-template-columns:1fr}}

footer{background:var(--black);color:#9db2d5;padding:60px 0 24px;position:relative;overflow:hidden}
.fsky{position:absolute;inset-inline:0;top:0;opacity:.08;pointer-events:none}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px;position:relative;z-index:2}
.fbrand .mark{width:46px;height:46px;filter:drop-shadow(0 0 12px rgba(78,163,245,.5))}
.fbrand b{font-family:var(--disp);color:#fff;font-size:1.15rem;display:block;margin-top:12px}
.fbrand p{font-size:.88rem;margin-top:8px;max-width:280px}
.fsocial{display:flex;gap:10px;margin-top:16px}
.fsocial a{width:38px;height:38px;border-radius:11px;border:1px solid rgba(120,170,240,.25);display:grid;place-items:center;color:#cdd9f0;transition:.2s}
.fsocial a:hover{background:var(--blue-m);border-color:var(--blue-m);color:#fff;transform:translateY(-3px)}
.fsocial svg{width:18px;height:18px}
footer h5{color:#fff;font-size:1rem;margin-bottom:14px;font-family:var(--disp)}
footer ul{list-style:none;display:flex;flex-direction:column;gap:9px}
footer ul a{font-size:.88rem;transition:.2s}
footer ul a:hover{color:var(--blue-l)}
.license{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.05);border:1px solid rgba(120,170,240,.25);border-radius:12px;padding:9px 13px;font-size:.79rem;margin-top:14px}
.license svg{width:18px;height:18px;color:var(--blue-l)}
.fbottom{border-top:1px solid rgba(255,255,255,.1);margin-top:34px;padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.8rem;opacity:.85;position:relative;z-index:2}
@media(max-width:860px){.fgrid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.fgrid{grid-template-columns:1fr}}

.fabs{position:fixed;bottom:20px;inset-inline-start:20px;z-index:88;display:flex;flex-direction:column;gap:11px}
.fab{width:52px;height:52px;border-radius:50%;border:none;cursor:pointer;display:grid;place-items:center;color:#fff;box-shadow:0 14px 30px -10px rgba(0,0,0,.4);transition:.25s;position:relative}
.fab:hover{transform:translateY(-3px) scale(1.06)}
.fab.wa{background:#1FA855}.fab.wa svg{width:27px;height:27px}
.fab.wa::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid #1FA855;animation:ringp 2.4s infinite}
.fab.top{background:var(--navy);opacity:0;pointer-events:none}
.fab.top.show{opacity:1;pointer-events:auto}
.fab.top svg{width:20px;height:20px}
.fab.theme{background:linear-gradient(135deg,var(--blue-m),var(--blue-l))}.fab.theme svg{width:23px;height:23px}
.themepop{position:absolute;bottom:0;inset-inline-start:62px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:12px;box-shadow:var(--shadow);display:none;gap:8px;flex-direction:column;min-width:175px}
.themepop.open{display:flex}
.themepop small{font-weight:800;color:var(--muted);font-size:.72rem}
.themerow{display:flex;gap:8px}
.swatch{width:31px;height:31px;border-radius:10px;cursor:pointer;border:2px solid transparent;transition:.2s}
.swatch:hover{transform:scale(1.12)}
.swatch.sel{border-color:var(--navy)}
.fb-tab{position:fixed;inset-inline-end:-4px;top:50%;transform:translateY(-50%);z-index:87;background:linear-gradient(135deg,var(--blue-m),var(--blue-l));color:#fff;border:none;border-radius:12px 0 0 12px;padding:0 9px;cursor:pointer;font-weight:800;font-size:.76rem;writing-mode:vertical-rl;letter-spacing:1px;box-shadow:-6px 8px 20px -8px rgba(10,27,61,.5);transition:.2s;height:128px;max-height:128px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.fb-tab:hover{filter:brightness(1.12);box-shadow:-8px 10px 24px -8px rgba(10,27,61,.6)}
/* بالإنجليزية: نفس الأبعاد والموضع تماماً — فقط ينعكس للحافة المقابلة بزوايا معكوسة */
html[dir="ltr"] .fb-tab{border-radius:0 12px 12px 0;box-shadow:6px 8px 20px -8px rgba(10,27,61,.5)}
html[dir="ltr"] .fb-tab:hover{box-shadow:8px 10px 24px -8px rgba(10,27,61,.6)}
.fb-emojis{display:flex;gap:10px;justify-content:center;margin:14px 0}
.fb-em{font-size:2rem;background:var(--sky);border:2px solid transparent;border-radius:16px;padding:10px 16px;cursor:pointer;transition:.2s}
.fb-em:hover{transform:scale(1.12)}
.fb-em.sel{border-color:var(--blue-m);background:#fff}

.modal{position:fixed;inset:0;z-index:900;background:rgba(4,7,14,.6);display:none;place-items:center;padding:18px;overflow:auto;backdrop-filter:blur(5px)}
.modal.open{display:grid}
.mbox{background:#fff;border-radius:24px;max-width:820px;width:100%;box-shadow:0 40px 90px -30px rgba(0,0,0,.55);overflow:hidden;max-height:94vh;display:flex;flex-direction:column;position:relative;animation:pop .35s cubic-bezier(.3,1.3,.4,1)}
@keyframes pop{from{transform:scale(.94);opacity:0}}
.mbox.sm{max-width:500px}
.mbox.lg{max-width:920px}
.mclose{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.94);border:none;cursor:pointer;font-size:1.3rem;color:var(--navy);z-index:6;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.22)}
.mhead{position:relative;aspect-ratio:16/7.2;overflow:hidden;direction:ltr;flex:none}
.mtrack{display:flex;height:100%;transition:transform .38s;width:100%}
.galtabs{position:absolute;bottom:10px;inset-inline-start:50%;transform:translateX(50%);display:flex;gap:6px;z-index:6;background:rgba(10,23,48,.6);padding:5px;border-radius:12px;backdrop-filter:blur(6px)}
[dir=ltr] .galtabs{transform:translateX(-50%)}
.galtab{border:none;background:transparent;color:#dbe6f7;font-size:.7rem;font-weight:700;padding:5px 12px;border-radius:8px;cursor:pointer;transition:.2s}
.galtab.on,.galtab:hover{background:#fff;color:var(--navy)}
.mslide{flex:none;display:grid;place-items:center;color:rgba(255,255,255,.5)}
.mslide svg{width:80px;height:80px}
.mhead .arw{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;background:rgba(5,8,15,.55);border:none;color:#fff;cursor:pointer;display:grid;place-items:center;z-index:3}
.mhead .arw:hover{background:var(--blue-m)}
.mhead .arw.l{left:10px}.mhead .arw.r{right:10px}
.mbody{padding:24px 28px 28px;overflow:auto}
.mtag{display:inline-block;font-weight:800;font-size:.73rem;color:#fff;padding:5px 14px;border-radius:20px}
.mcode{display:inline-block;background:var(--sky);color:var(--blue-m);font-weight:800;font-size:.75rem;border-radius:20px;padding:5px 14px;margin-inline-start:8px}
.mbody h3{font-size:1.42rem;margin-top:10px}
.mprice{font-family:var(--disp);font-weight:900;font-size:1.7rem;color:var(--blue-m);margin:4px 0 2px}
.mprice small{font-size:.8rem;color:var(--muted);font-weight:500}
.mtax{font-size:.75rem;color:var(--muted)}
.specgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin:16px 0}
.spec{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:11px 13px;display:flex;gap:10px;align-items:center}
.spec svg{width:20px;height:20px;color:var(--blue-m);flex:none}
.spec b{font-family:var(--disp);font-size:.92rem;color:var(--navy);display:block;line-height:1.25}
.spec small{color:var(--muted);font-size:.7rem}
.mh4{font-family:var(--disp);font-size:1rem;color:var(--navy);margin:16px 0 9px;display:flex;align-items:center;gap:8px}
.mh4::after{content:"";flex:1;height:1px;background:var(--line)}
.featchips{display:flex;gap:8px;flex-wrap:wrap}
.fchip{display:inline-flex;align-items:center;gap:6px;background:var(--sky);color:var(--navy);font-weight:600;font-size:.8rem;border-radius:20px;padding:6px 14px}
.fchip svg{width:13px;height:13px;color:var(--blue-m)}
.mdesc{color:var(--muted);font-size:.92rem}
.minimap{height:210px;border-radius:16px;overflow:hidden;border:1px solid var(--line);direction:ltr;position:relative;background:var(--sky)}
.minimap .mm{position:absolute;inset:0}
.reginfo{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.reg{flex:1;min-width:200px;display:flex;gap:10px;align-items:center;background:var(--bg);border:1px dashed var(--line);border-radius:13px;padding:10px 14px;font-size:.78rem;color:var(--muted)}
.reg svg{width:19px;height:19px;color:var(--blue-m);flex:none}
.reg b{color:var(--navy);display:block;font-size:.82rem}
.mactions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.mactions .btn{flex:1;min-width:140px;padding:13px 10px;font-size:.9rem}
.sharebar{display:flex;gap:8px;align-items:center;margin-top:12px;justify-content:center;flex-wrap:wrap}
.sharebar span{font-size:.78rem;color:var(--muted);font-weight:700}
.shbtn{width:38px;height:38px;border-radius:50%;border:1.5px solid var(--line);background:#fff;color:var(--navy);cursor:pointer;display:grid;place-items:center;transition:.2s}
.shbtn:hover{border-color:var(--blue-m);color:var(--blue-m);transform:translateY(-2px)}
.shbtn svg{width:17px;height:17px}
.ctable{width:100%;border-collapse:collapse;font-size:.9rem}
.ctable th,.ctable td{padding:12px 10px;text-align:center;border-bottom:1px solid var(--line)}
.ctable th{background:var(--sky);color:var(--navy);font-family:var(--disp);font-size:.95rem}
.ctable td:first-child,.ctable th:first-child{text-align:right;font-weight:700;color:var(--muted);white-space:nowrap}
.ctable .cp{font-family:var(--disp);font-weight:900;color:var(--blue-m);font-size:1.05rem}
.ctable .best{background:rgba(78,163,245,.12);border-radius:8px;font-weight:800;color:var(--blue-m)}
.bk-ok{text-align:center;padding:20px 6px}
.bk-ok .okic{width:72px;height:72px;border-radius:50%;background:#E7F8EE;display:grid;place-items:center;margin:0 auto 16px;animation:pop .5s cubic-bezier(.3,1.5,.4,1)}
.bk-ok .okic svg{width:36px;height:36px;color:#1FA855}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto}#bg3d{display:none}}

/* فخ مكافحة السبام (Honeypot): حقل لا يراه البشر — تعبئته تكشف الروبوت */
.hpf{position:absolute !important;inset-inline-start:-9999px !important;width:1px;height:1px;opacity:0;pointer-events:none}

/* ═══════════ المرحلة الثالثة: طبقة الفخامة النهائية ═══════════ */
/* صور كسولة داخل الشرائح */
.pslide img,.mslide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
/* ═══ [49-م3] معرض نافذة التفاصيل يعرض الصورة كاملة ═══
   الحاوية نسبتها 16:7.2 (شريط عريض قصير)، وobject-fit:cover كان يقصّ الصورة
   العمودية أو المربّعة إلى شريحة وسطى ويُكبّرها لملء العرض — فتبدو غير واضحة
   ويضطر الزائر لضغط زر التكبير ليرى الصورة الأصلية.
   contain يُظهرها كاملة بأبعادها الحقيقية بلا تكبير ولا قصّ. والفراغ حولها
   يُملأ بنسخة مموّهة من الصورة نفسها فلا يظهر شريطان أسودان.
   بطاقات العروض (.pslide) تبقى cover عمداً — الشبكة تحتاج تساوي الارتفاعات. */
.mhead .mslide img{object-fit:contain;z-index:1}
.mhead .mslide{background:#0b1730}
.mhead .mslide::before{content:"";position:absolute;inset:0;background:inherit;
  background-image:var(--bg-blur);background-size:cover;background-position:center;
  filter:blur(26px) brightness(.55);transform:scale(1.15);z-index:0}
.pslide,.mslide{position:relative;overflow:hidden}
.pslide:hover img{transform:scale(1.06)}
/* تفاعلات دقيقة: ضغطة محسوسة + حلقة تركيز فاخرة للوصولية */
button:active,.btn:active,a.btn:active{transform:scale(.97)}
:focus-visible{outline:2px solid #4EA3F5;outline-offset:2.5px;border-radius:6px}
::selection{background:#2563eb;color:#fff}
/* زجاجية أعمق للهيدر والنوافذ */
#header .bar{backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6)}
/* شريط تمرير أنيق للموقع */
::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#274d86,#4EA3F5);border-radius:10px;border:2px solid rgba(0,0,0,.15)}
/* شاشات عريضة و4K: مقاس أرحب وخط أوضح */
@media(min-width:1900px){
  html{font-size:17.5px}
  .wrap{max-width:1460px}
}
@media(min-width:2500px){
  html{font-size:19px}
  .wrap{max-width:1720px}
}
@media(prefers-reduced-motion:reduce){.pslide img,.mslide img{transition:none}.pslide:hover img{transform:none}}
.tw{display:inline-block;transform:translateY(.07em)}
/* فتح خرائط Google من الخريطة المصغرة */
.minimap{position:relative}
.gmapsGo{position:absolute;inset:0;z-index:5}
.gmapsBadge{position:absolute;bottom:8px;inset-inline-start:8px;z-index:6;background:rgba(10,23,48,.88);color:#fff;font-size:.68rem;font-weight:700;padding:4px 10px;border-radius:8px;pointer-events:none}
.simGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:10px}
.simCard{cursor:pointer;border-radius:12px;overflow:hidden;border:1px solid rgba(120,170,240,.18);transition:.2s;background:#0b1730}
.simCard:hover{transform:translateY(-3px);box-shadow:0 12px 28px -14px rgba(0,0,0,.5)}
.simImg{height:88px;position:relative;overflow:hidden}
.simImg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.simBody{padding:8px 10px}
.simBody b{display:block;font-size:.74rem;color:#e7edf7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.simBody span{font-size:.7rem;color:#8aa3c9}
.trustrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.tbadge{display:inline-flex;align-items:center;gap:6px;font-size:.66rem;font-weight:700;color:#c9d8f2;background:rgba(255,255,255,.06);border:1px solid rgba(120,170,240,.22);border-radius:20px;padding:5px 11px}
.tbadge svg{width:14px;height:14px;flex-shrink:0;color:#6fd3f2}
.phrow{display:flex;gap:8px;direction:ltr}
.phrow select{flex:0 0 auto;width:110px;border:1.5px solid var(--line,#dbe3f0);border-radius:12px;padding:12px 8px;font-size:.85rem;background:#fff;cursor:pointer}
.phrow input{flex:1;min-width:0}
.phrow.err select,.phrow.err input{border-color:#dc2626!important;background:#fff5f5}
.phrow.err{animation:shake .4s}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.pherr{color:#dc2626;font-size:.74rem;font-weight:700;margin-top:6px;display:flex;align-items:center;gap:5px}
.pherr::before{content:"⚠";font-size:.85rem}
#lightbox{position:fixed;inset:0;z-index:1200;background:rgba(3,6,13,.94);display:none;place-items:center;backdrop-filter:blur(6px)}
#lightbox.on{display:grid}
#lightbox img{max-width:94vw;max-height:88vh;object-fit:contain;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.5);opacity:1;transition:opacity .18s ease}
#lightbox img.fading{opacity:0}
.lb-x{position:fixed;top:18px;inset-inline-end:20px;width:44px;height:44px;border-radius:50%;border:none;background:rgba(255,255,255,.12);color:#fff;font-size:1.15rem;cursor:pointer;z-index:2}
.lb-x:hover{background:rgba(255,255,255,.25)}
.lb-ar{position:fixed;top:0;bottom:0;margin-block:auto;width:50px;height:50px;border-radius:50%;border:none;background:rgba(255,255,255,.12);color:#fff;font-size:1.7rem;cursor:pointer;z-index:2;display:grid;place-items:center}
.lb-ar:hover{background:rgba(255,255,255,.25)}
.lb-prev{left:18px}.lb-next{right:18px}
.lb-count{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);color:#cdd9f0;font-size:.85rem;font-weight:700;direction:ltr}
/* ═══ تحسينات إضافية للجوال حصرياً (≤640px) — لا تمس عرض الحاسوب إطلاقاً ═══ */

/* ═══════ حزمة إعادة تنسيق الجوال الشاملة (≤640px حصرياً — الحاسوب لا يتأثر إطلاقاً) ═══════ */

/* سهم "مرر لأسفل" بنافذة التفاصيل — مخفي بالحاسوب، يظهر بالجوال فقط */
.scrollhint{display:none;position:sticky;bottom:10px;margin:-38px auto 4px;width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--blue-m),var(--blue-l));color:#fff;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(29,78,216,.45);z-index:5;pointer-events:none;animation:hintbob 1.6s ease-in-out infinite}
.scrollhint svg{width:22px;height:22px}
.rollwrap{position:relative}
.rollnav{display:none}
.rollnav button{position:absolute;top:50%;transform:translateY(-50%);z-index:6;width:36px;height:36px;border-radius:50%;border:none;background:linear-gradient(135deg,var(--blue-m),var(--blue-l));color:#fff;font-size:1.25rem;cursor:pointer;display:grid;place-items:center;box-shadow:0 6px 16px rgba(30,95,176,.45)}
.rollnav .rn-prev{inset-inline-start:-4px}
.rollnav .rn-next{inset-inline-end:-4px}
.rollnav button:active{filter:brightness(.9);transform:translateY(-50%) scale(.92)}
.scrollhint.gone{opacity:0;transition:opacity .35s}
@keyframes hintbob{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
.maprow{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.mapbtn{flex:1;min-width:170px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border-radius:12px;font-size:.85rem;font-weight:800;cursor:pointer;border:1.5px solid var(--line);transition:.2s;text-decoration:none}
.mapbtn svg{width:18px;height:18px}
.mapbtn.go{background:#0F9D58;color:#fff;border-color:#0F9D58}
.mapbtn.go:hover{filter:brightness(1.07);transform:translateY(-2px)}
.mapbtn.copy{background:#fff;color:var(--navy)}
.mapbtn.copy:hover{border-color:var(--blue-m);color:var(--blue-m);transform:translateY(-2px)}
/* ═══ نُقلت هذه الكتلة إلى نهاية الأنماط عمداً — إصلاح جذري: كانت قبل القواعد الأساسية (fb-tab، bento، h1...) فتُلغى بترتيب الكاسكيد رغم صحتها ═══ */




/* ═══════════════════════════════════════════════════════════
   قواعد الجوال الموحّدة (≤640px) — كتلة واحدة بنهاية الأنماط
   عمداً في النهاية: تفوز دائماً بترتيب الكاسكيد على كل القواعد الأساسية
   ═══════════════════════════════════════════════════════════ */
@media(max-width:640px){
.hero .caret{display:none}

.scrolldn{display:none}

.matcher-strip{margin-top:6px}

.toolbar{flex-direction:column;align-items:stretch}.tb-controls{justify-content:space-between}

/* ═ هيرو الجوال: المحتوى أطول من الشاشة — يبدأ من الأعلى بارتفاع طبيعي بدل التوسيط القسري الذي كان يقصّ العنوان ═ */
  .hero{min-height:auto;justify-content:flex-start;padding:92px 0 54px}
  /* قفص هيكلي: يمنع أي عنصر داخلي — مهما كان — من تمديد الهيرو أفقياً أو إزاحة التمركز */
  .hero .wrap{max-width:100%;overflow-x:clip}
  .hero .content{max-width:100%;overflow-x:clip}
  .hero .content>*{max-width:100%;overflow-x:clip}
  .hero h1{overflow-x:visible!important} /* استثناء حاسم: overflow-x:clip يكسر خاصية background-clip:text للتدرج */
  .hero h1 .grad{text-shadow:none} /* ظل العنوان بالجوال كان يُرسم خلف الحروف الشفافة (clip:text) فتبدو داكنة — الاستثناء يعيد التدرج */
  html[dir="ltr"] .hero h1{font-size:clamp(1.45rem,7vw,2rem)} /* أطول كلمة إنجليزية تدخل بسطر واحد — فلا نزول سطر أثناء الكتابة */
  html[dir="ltr"] .hero h1{min-height:calc(3 * 1.6em)}
  .hero h1{overflow-wrap:break-word}
  .hero .kicker{font-size:.62rem;padding:7px 12px;max-width:94%;text-align:center;line-height:1.7}
  .hero h1{font-size:clamp(1.85rem,9vw,2.5rem);line-height:1.6;text-shadow:0 2px 18px rgba(3,8,20,.85),0 1px 3px rgba(3,8,20,.9);padding:0 4px}
  .hero .lead{font-size:.92rem;line-height:1.9;margin:18px auto 22px;padding:0 10px;text-shadow:0 1px 10px rgba(3,8,20,.8)}
  .hero-cta{gap:10px}
  .hero-cta .btn{flex:1;min-width:150px;padding:14px 10px;font-size:.9rem}
  .hero-stats{gap:8px;margin-top:24px}
  .hero-stats .hst{padding:11px 8px;min-width:calc(50% - 8px);flex:1}
  .hero-stats .hst b{font-size:1.35rem}
  .hero-stats .hst span{font-size:.68rem}
  .hticker{margin-top:24px}
  .hticker .tk{font-size:.7rem;padding:7px 10px}
  .wrap{padding-inline:14px}
  .brand span{font-size:.58rem;max-width:150px}
  .brand b{font-size:.98rem}
  body.hero-in-view .fb-tab,body.hero-in-view .fabs{display:none} /* لا تغطية إطلاقاً على محتوى الهيرو وأزرار CTA */
  .fb-tab{top:auto;bottom:20px;transform:none;padding:0 7px;font-size:.66rem;height:44px;max-height:44px;writing-mode:horizontal-tb;border-radius:24px 0 0 24px;padding-inline:16px}
  .fabs{bottom:14px;gap:9px}
  body.tray-open .fabs{bottom:96px}
  body.tray-open .fb-tab{bottom:230px}
  .fab{width:46px;height:46px}
  /* ═ قسم العروض بالجوال: بطاقات وشريط أدوات أصغر وأنظف ═ */
  .lbar{padding:10px;gap:8px}
  .lbar .seg button{padding:8px 13px;font-size:.76rem}
  .lbar select{padding:8px 10px;font-size:.76rem}
  .xlsbtn{padding:8px 12px;font-size:.74rem}
  .rescount{font-size:.76rem}
  .pcar{aspect-ratio:16/9}
  .pbody{padding:11px 12px 12px;gap:6px}
  .pspecs{font-size:.68rem;padding:6px 0}
  /* العروض: رول أفقي — بطاقتان متكدستان عمودياً بكل عمود، وتمرير يساراً */
  .bento{display:grid;grid-auto-flow:column;grid-template-rows:auto auto;grid-template-columns:none;grid-auto-columns:70%;gap:11px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;-webkit-overflow-scrolling:touch}
  .bento::-webkit-scrollbar{height:5px}
  .bento::-webkit-scrollbar-thumb{background:var(--blue-m);border-radius:4px}
  .bento>*{scroll-snap-align:start}
  .pcard.feat{grid-column:auto;grid-row:auto}
  .pbody{padding:13px 14px 15px}
  .pbody .ttl{font-size:1.02rem}
  .pbody .prc{font-size:1.15rem}
  .pmeta{gap:7px;font-size:.7rem}
  .pfoot{gap:8px}
  .pfoot .btn{padding:11px 8px;font-size:.8rem}
  .pnew{font-size:.62rem;padding:4px 10px}
  .sec-title{font-size:1.5rem}
  .sec-lead{font-size:.86rem;padding:0 8px}
  /* سهم "معلومات بالأسفل" داخل تفاصيل العرض — جوال فقط */
  .scrollHint{display:grid}

.sec-title{font-size:1.5rem}
  .sec-lead{font-size:.85rem}
  .chips .chip{padding:8px 14px;font-size:.76rem}
  .pricectl{flex:1 1 100%}
  .pricectl label{font-size:.72rem}
  .sortctl select{padding:9px 10px;font-size:.78rem}
  .xlsbtn{padding:9px 12px;font-size:.74rem}
  .rescount{font-size:.78rem}
  .pcard .ptitle{font-size:1.02rem}
  .pcard .pprice{font-size:1.15rem}
  .pnew{top:10px;right:76px;font-size:.62rem;padding:4px 10px}
  .scrollhint{display:flex}

/* إيقاع موحد للأقسام */
  .section{padding:56px 0}
  .sec-title{font-size:1.45rem;line-height:1.5}
  .sec-lead{font-size:.84rem;padding:0 8px}
  .kicker{font-size:.6rem}
  /* الهيرو: عنوان بارز بثبات ارتفاع (الكلمة المتحركة لا تقفز) وأزرار عمودية واضحة */
  .hero h1{min-height:calc(4 * 1.6em)} /* حجز أعلى — بعض الكلمات الإنجليزية المترجمة أطول فتحتاج سطرًا إضافيًا، فلا قفزة تخطيط بأي لغة */
  .hero .tw{display:block}
  .hero-cta{flex-direction:column;padding:0 22px;gap:10px}
  .hero-cta .btn{width:100%;min-width:0;padding:15px 10px;font-size:.92rem}
  .hero .kicker{margin-inline:auto}
  /* الخريطة */
  .map-wrap{min-height:330px}
  .map-side{max-height:280px}
  .sec-head{margin-bottom:28px}
  .rollnav{display:block}
  /* أمان النصوص: لا كلمة (خصوصاً الإنجليزية الطويلة) تخرج من حدود بطاقتها */
  .pbody,.job,.cline,.flip,.mrow,.tcard,.hst,.cchan{min-width:0}
  .pbody .ttl,.job h3,.job p,.cline b,.cline span,.sec-title,.flip h4,.flip p,.mrow b{overflow-wrap:break-word;word-break:break-word}
  .btn{white-space:normal}
  /* (3) الخدمات: رول أفقي أنيق — بطاقتان بكل شاشة، بتثبيت انزلاق */
  .serv-grid{display:grid;grid-auto-flow:column;grid-auto-columns:calc(50% - 6px);grid-template-columns:none;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;-webkit-overflow-scrolling:touch}
  .serv-grid::-webkit-scrollbar{height:5px}
  .serv-grid::-webkit-scrollbar-thumb{background:var(--blue-m);border-radius:4px}
  .flip{height:215px;scroll-snap-align:start}
  /* (4) الوظائف: نفس الرول */
  .jobs{display:grid;grid-auto-flow:column;grid-auto-columns:calc(50% - 6px);grid-template-columns:none;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;-webkit-overflow-scrolling:touch}
  .jobs::-webkit-scrollbar{height:5px}
  .jobs::-webkit-scrollbar-thumb{background:var(--blue-m);border-radius:4px}
  .jobs>*{scroll-snap-align:start}
  /* (5) قنوات التواصل: رول أفقي بدل التكديس الطويل */
  .cinfo{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:11px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;-webkit-overflow-scrolling:touch}
  .cinfo::-webkit-scrollbar{height:5px}
  .cinfo::-webkit-scrollbar-thumb{background:var(--blue-m);border-radius:4px}
  .cinfo>*{scroll-snap-align:start;margin:0}
  /* من نحن والتواصل */
  .about-grid{gap:22px}
  .tcard{padding:16px}
  .contact-grid{gap:18px}
  .cchan{padding:14px}
  .cform{padding:18px 14px}
  /* الفوتر: عمود واحد بمحاذاة وسط أنيقة */
  .fgrid{grid-template-columns:1fr;gap:26px;text-align:center}
  .fbrand p{margin-inline:auto}
  .fsocial{justify-content:center}
  footer{padding:44px 0 20px}
  /* المودالات: ملء مريح للشاشة الصغيرة */
  .modal{padding:10px}
  .modal .card{max-height:92svh;border-radius:16px}
  /* أزرار الخريطة بالتفاصيل: عمودية كاملة */
  .maprow{flex-direction:column}
  .mapbtn{min-width:0}
}