:root{
  --navy:#14173f; --navy-2:#1f2360; --green:#FE6102; --green-d:#15803d;
  --ink:#0f172a; --muted:#5b6478; --line:#e6e9f2; --bg:#f6f8fc; --card:#fff;
  --radius:18px; --shadow:0 10px 30px rgba(20,23,63,.08);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,Cairo,'Segoe UI',Tahoma,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
html[lang=ar] body{font-family:Cairo,Inter,Tahoma,sans-serif}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{width:min(1160px,92%);margin-inline:auto}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.8rem 1.4rem;border-radius:999px;font-weight:700;border:0;cursor:pointer;font:inherit;font-weight:700;transition:transform .15s,box-shadow .15s,background .15s}
.btn:hover{transform:translateY(-2px)}
.btn-green{background:var(--green);color:#052e16;box-shadow:0 8px 20px rgba(34,197,94,.35)}
.btn-green:hover{background:#4ade80}
.btn-ghost{background:#fff;color:var(--navy);border:1px solid var(--line)}
.btn-wa{background:#25d366;color:#053b1b;width:100%}
.btn-wa:hover{background:#3ee27c}
/* top bar */
.topbar{background:#ecfdf3;color:#166534;border-bottom:1px solid #d1fae5;font-size:.85rem;font-weight:600;text-align:center;padding:.5rem 1rem}
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px;gap:1rem}
.logo{display:flex;align-items:center;gap:.6rem;font-weight:800;letter-spacing:.02em;color:var(--navy);line-height:1.05}
.logo small{display:block;font-size:.62rem;letter-spacing:.22em;color:var(--green-d);font-weight:700}
.logo-mark{width:38px;height:38px;border-radius:11px;background:var(--navy);display:grid;place-items:center}
nav ul{display:flex;gap:1.6rem;list-style:none;font-weight:600;font-size:.95rem}
nav a:hover{color:var(--green-d)}
.nav-actions{display:flex;align-items:center;gap:.6rem}
.lang{display:inline-block;border:1px solid transparent;background:linear-gradient(135deg,#0E8BD8,#0A6DAE);border-radius:999px;padding:.4rem .9rem;font-weight:700;cursor:pointer;font:inherit;font-weight:700;color:#fff;box-shadow:0 6px 16px rgba(14,139,216,.28)}
.menu-btn{display:none;background:none;border:0;cursor:pointer;padding:.3rem}
@media(max-width:960px){
  nav ul{position:absolute;top:70px;inset-inline:0;background:#fff;flex-direction:column;padding:1rem 4%;gap:1rem;border-bottom:1px solid var(--line);display:none}
  nav ul.open{display:flex}
  .menu-btn{display:block}
  .nav-actions .btn{display:none}
}
/* hero */
.hero{background:#f3f7ff;color:var(--ink);padding:5rem 0 4.5rem;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.eyebrow{display:inline-block;background:#e8f9ee;color:var(--green-d);border:1px solid #bbf7d0;padding:.3rem .9rem;border-radius:999px;font-weight:700;font-size:.82rem;margin-bottom:1.2rem}
.hero h1{font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1.12;font-weight:800;letter-spacing:-.02em}
html[lang=ar] .hero h1{line-height:1.35;letter-spacing:0}
.hero h1 span{color:var(--green-d)}
.hero p{margin:1.2rem 0 2rem;color:var(--muted);font-size:1.1rem;max-width:34rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem}
.hero-art{display:grid;place-items:center}
.hero-card{width:min(360px,100%);background:#fff;border:1px solid var(--line);border-radius:28px;padding:2rem;box-shadow:var(--shadow)}
.pulse{animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{opacity:.45}}
@media(max-width:860px){.hero-grid{grid-template-columns:1fr}.hero-art{order:-1}.hero{padding:3rem 0}}
/* trust strip */
.strip{background:#fff;border-bottom:1px solid var(--line)}
.strip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:1.4rem 0}
.strip-item{display:flex;align-items:center;gap:.8rem;font-weight:600;font-size:.95rem}
.strip-item svg{flex:none;width:34px;height:34px;padding:7px;border-radius:10px;background:#e8f9ee;color:var(--green-d)}
@media(max-width:860px){.strip-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.strip-grid{grid-template-columns:1fr}}
/* sections */
section{padding:4.5rem 0}
.sec-head{text-align:center;max-width:40rem;margin:0 auto 2.4rem}
.sec-head h2{font-size:clamp(1.7rem,3vw,2.3rem);font-weight:800;color:var(--navy);letter-spacing:-.01em}
.sec-head p{color:var(--muted);margin-top:.6rem}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-bottom:2rem}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.5rem 1.1rem;font:inherit;font-weight:700;cursor:pointer;color:var(--muted)}
.chip.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.4rem}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden;transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(20,23,63,.14)}
.card-art{aspect-ratio:1/1;display:grid;place-items:center;background:#fff;position:relative;border-bottom:1px solid var(--line)}
.card-art svg{width:46%;height:auto}
.card-art img{width:100%;height:100%;object-fit:contain;padding:.6rem}
.badge{position:absolute;top:.8rem;inset-inline-start:.8rem;background:var(--green);color:#052e16;font-size:.75rem;font-weight:800;padding:.2rem .65rem;border-radius:999px}
.cat{position:absolute;bottom:.8rem;inset-inline-start:.8rem;font-size:.72rem;font-weight:700;color:var(--navy-2);background:#fff;border:1px solid var(--line);padding:.15rem .6rem;border-radius:999px}
.card-body{padding:1.1rem 1.2rem 1.3rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.card h3{font-size:1.02rem;line-height:1.35;color:var(--navy)}
.card p{font-size:.9rem;color:var(--muted);flex:1}
.price{display:flex;align-items:baseline;gap:.6rem;margin:.3rem 0 .6rem}
.price b{font-size:1.35rem;color:var(--navy);font-weight:800}
.price s{color:#94a0b8;font-size:.9rem}
.note{text-align:center;color:var(--muted);font-size:.88rem;margin-top:1.6rem}
.tools{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;margin:-.6rem 0 1.8rem}
.tools input,.tools select{max-width:320px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.6rem 1.1rem;font:inherit}
.tools input{flex:1 1 220px}
.about{background:#fff}
.about-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:2.4rem;align-items:center}
.about p{color:var(--muted);margin-top:.8rem}
.about-box{background:#f3f7ff;border:1px solid var(--line);color:var(--ink);border-radius:var(--radius);padding:2rem}
.about-box h3{color:var(--green-d);margin-bottom:.8rem}
.about-box li{list-style:none;padding:.35rem 0;border-bottom:1px solid var(--line)}
.about-box li:last-child{border:0}
@media(max-width:820px){.about-grid{grid-template-columns:1fr}}
nav a{white-space:nowrap}
@media(max-width:1120px){nav ul{gap:1.05rem;font-size:.88rem}.nav-actions .btn{padding:.7rem 1rem}}
.sol{background:#fff}
.sol-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.sol-card{display:block;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:1.8rem;transition:transform .2s,box-shadow .2s}
.sol-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.sol-card svg{width:52px;height:52px;padding:12px;border-radius:14px;background:var(--navy);color:var(--green);margin-bottom:1rem}
.sol-card h3{color:var(--navy);margin-bottom:.4rem}
.sol-card p{color:var(--muted);font-size:.94rem}
.sol-card b{display:inline-block;margin-top:.8rem;color:var(--green-d)}
.spaces{margin-top:2.4rem;text-align:center}
.spaces h3{color:var(--navy);margin-bottom:1rem}
.spaces div{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center}
.spaces span{background:#e8f9ee;color:var(--green-d);font-weight:700;border-radius:999px;padding:.5rem 1.2rem}
.brands{background:#fff;color:var(--navy);padding:2rem 0;border-block:1px solid var(--line)}
.brands-in{display:flex;flex-wrap:wrap;gap:1.2rem 3rem;align-items:center;justify-content:center}
.brands-in small{color:var(--muted);font-weight:600;letter-spacing:.04em}
.brands-in strong{font-size:1.6rem;font-weight:800;letter-spacing:.08em;color:var(--navy)}
.cta{padding:0 0 4.5rem}
.cta-box{background:#ecfdf3;border:1px solid #bbf7d0;border-radius:28px;padding:3rem 2rem;text-align:center;color:var(--navy)}
.cta-box h2{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800}
.cta-box p{color:var(--muted);margin:.8rem auto 1.6rem;max-width:34rem}
@media(max-width:860px){.sol-grid{grid-template-columns:1fr}}
.g-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.g-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem;box-shadow:var(--shadow);transition:transform .2s}
.g-card:hover{transform:translateY(-4px)}
.g-card small{color:var(--green-d);font-weight:700;letter-spacing:.04em}
.g-card h3{color:var(--navy);margin:.5rem 0}
.g-card p{color:var(--muted);font-size:.94rem;flex:1}
.g-card b{margin-top:1rem;color:var(--green-d)}
@media(max-width:860px){.g-grid{grid-template-columns:1fr}}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
select.f{font:inherit;padding:.8rem 1rem;border:1px solid var(--line);border-radius:12px;background:var(--bg);width:100%}
@media(max-width:520px){.frow{grid-template-columns:1fr}}
/* how */
.steps{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem;counter-reset:s}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.8rem;box-shadow:var(--shadow);position:relative}
.step::before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--green);color:#052e16;font-weight:800;margin-bottom:1rem}
.step h3{color:var(--navy);margin-bottom:.3rem}
.step p{color:var(--muted);font-size:.93rem}
@media(max-width:760px){.steps{grid-template-columns:1fr}}
/* faq */
.faq{background:#fff}
.faq-list{max-width:760px;margin:0 auto;display:grid;gap:.8rem}
details{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:1rem 1.2rem}
summary{cursor:pointer;font-weight:700;color:var(--navy);list-style:none;display:flex;justify-content:space-between;gap:1rem}
summary::after{content:'+';font-size:1.3rem;line-height:1;color:var(--green-d)}
details[open] summary::after{content:'\2212'}
details p{margin-top:.7rem;color:var(--muted);font-size:.95rem}
/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;align-items:start}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.8rem;box-shadow:var(--shadow)}
.panel h3{color:var(--navy);margin-bottom:1rem}
.info{display:grid;gap:1rem}
.info div{display:flex;gap:.9rem;align-items:flex-start}
.info svg{flex:none;width:38px;height:38px;padding:9px;border-radius:11px;background:#e8f9ee;color:var(--green-d)}
.info small{display:block;color:var(--muted);font-size:.8rem}
.info strong{color:var(--navy)}
form{display:grid;gap:.8rem}
input,textarea{font:inherit;padding:.8rem 1rem;border:1px solid var(--line);border-radius:12px;background:var(--bg);width:100%}
input:focus,textarea:focus{outline:2px solid var(--green);background:#fff}
textarea{min-height:110px;resize:vertical}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr}}
/* footer */
footer{background:#fff;color:var(--muted);border-top:1px solid var(--line);padding:3rem 0 1.5rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem;padding-bottom:2rem;border-bottom:1px solid var(--line)}
footer h4{color:var(--navy);margin-bottom:.8rem}
footer ul{list-style:none;display:grid;gap:.5rem;font-size:.93rem}
footer a:hover{color:var(--green-d)}
.copy{padding-top:1.2rem;font-size:.85rem;text-align:center;color:var(--muted)}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr}}
/* floating whatsapp */
.fab{z-index:60;width:58px;height:58px;border-radius:50%;background:#25d366;display:grid;place-items:center;box-shadow:0 10px 26px rgba(37,211,102,.5)}
.fab:hover{transform:scale(1.08)}
.fab svg{width:30px;height:30px;color:#fff}


:root{--navy:#0A263F;--navy-2:#0D2E4A;--green:#0E8BD8;--green-d:#0A6DAE;--accent:#FE6102;--tint:#EAF5FF;--ink:#0f1b2a;--muted:#56667a;--line:#dfe9f3;--bg:#f4f8fc;--shadow:0 10px 30px rgba(10,38,63,.08)}
[hidden]{display:none!important}
body{font-family:Inter,Cairo,'Segoe UI',Tahoma,sans-serif}
.topbar{background:linear-gradient(90deg,#061a2c,#0A263F,#061a2c);color:#bfe0f6;border:0;letter-spacing:.01em}
header{background:rgba(255,255,255,.9)}
.btn-green{background:linear-gradient(135deg,#0E8BD8,#0A6DAE);color:#fff;box-shadow:0 8px 24px rgba(14,139,216,.35)}
.btn-green:hover{background:linear-gradient(135deg,#25a0ec,#0B78BC)}
.btn-ghost:hover{border-color:var(--green)}
.btn-wa2{background:#fff;color:#128c4a;border:1px solid #b8e7cc;width:100%;font-size:.9rem;padding:.6rem 1rem}
.btn-wa2:hover{background:#f0fbf5}
.card-body .btn{width:100%}
.badge{background:var(--accent);color:#fff}
.step::before{background:linear-gradient(135deg,var(--accent),#ff8a3d);color:#fff}
.chip.on{background:var(--navy);border-color:var(--navy)}
.lang:hover{background:linear-gradient(135deg,#25a0ec,#0B78BC)}
/* cart link */
.cart-link{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--tint);color:var(--navy);transition:.2s}
.cart-link:hover{background:#d5eafb}
.cart-n{position:absolute;top:-4px;inset-inline-end:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--accent);color:#fff;font-size:.72rem;font-weight:800;display:grid;place-items:center}
.menu-btn{color:var(--navy);font-size:1.4rem}
/* hero */
.hero{background:radial-gradient(900px 480px at 82% 8%,rgba(14,139,216,.5),transparent 60%),radial-gradient(620px 420px at 6% 100%,rgba(254,97,2,.24),transparent 60%),linear-gradient(160deg,#0A263F,#061a2c);color:#fff;padding:4.5rem 0 4.5rem;border-bottom:0}
.hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:46px 46px;-webkit-mask-image:radial-gradient(ellipse at 62% 42%,#000 25%,transparent 75%);mask-image:radial-gradient(ellipse at 62% 42%,#000 25%,transparent 75%);pointer-events:none}
.hero .wrap{position:relative}
.eyebrow{background:rgba(14,139,216,.18);color:#9bd6fa;border:1px solid rgba(14,139,216,.55);box-shadow:0 0 22px rgba(14,139,216,.35)}
.eyebrow::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-inline-end:.5rem;box-shadow:0 0 10px var(--accent);animation:pulse 2s infinite}
.hero h1{color:#fff}
.hero h1 span{background:linear-gradient(90deg,#4cc0ff,#ff8a3d);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{color:#b9d2e6}
.hero .btn-ghost{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.28);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hero .btn-ghost:hover{background:rgba(255,255,255,.16)}
.hero-art{position:relative;height:460px;width:100%;display:block}
.gl{position:absolute;margin:0;border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,.28);box-shadow:0 24px 60px rgba(0,0,0,.5),0 0 0 1px rgba(14,139,216,.35),0 0 40px rgba(14,139,216,.25);background:#0D2E4A;animation:floaty 7s ease-in-out infinite}
.gl img{width:100%;height:100%;object-fit:cover}
.gl-a{width:56%;height:76%;inset-inline-end:2%;top:8%;z-index:2}
.gl-b{width:40%;height:44%;inset-inline-start:0;bottom:0;z-index:3;animation-delay:-2.3s}
.gl-c{width:34%;height:32%;inset-inline-start:10%;top:0;z-index:1;animation-delay:-4.6s}
.fchip{position:absolute;z-index:4;display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .9rem;border-radius:999px;font-weight:700;font-size:.82rem;color:#fff;background:rgba(10,38,63,.65);border:1px solid rgba(255,255,255,.25);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 8px 24px rgba(0,0,0,.35);animation:floaty 6s ease-in-out infinite}
.fchip i{color:var(--accent)}
.fc1{top:52%;inset-inline-start:36%}.fc2{top:2%;inset-inline-end:0}.fc3{bottom:6%;inset-inline-end:8%}
@keyframes floaty{50%{transform:translateY(-12px)}}
@media(prefers-reduced-motion:reduce){.gl,.fchip,.eyebrow::before,.pulse{animation:none!important}}
@media(max-width:860px){.hero-art{height:340px;order:2}.hero{padding:2.5rem 0 3rem}.fc1{display:none}}
/* icons (Font Awesome) */
.strip-item i{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--tint);color:var(--accent);font-size:1.05rem}
.sol-card i{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:linear-gradient(145deg,#0A263F,#0D2E4A);color:var(--accent);font-size:1.4rem;margin-bottom:1rem;box-shadow:0 10px 24px rgba(10,38,63,.28)}
.info i{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--tint);color:var(--accent)}
.strip-item span{line-height:1.3}
.sol-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.sol-card:hover{box-shadow:0 0 0 1px rgba(14,139,216,.4),0 18px 40px rgba(14,139,216,.16)}
.sol-card b i,.g-card b i{all:unset}
.spaces span{background:var(--tint);color:var(--green-d)}
.about-box{background:linear-gradient(160deg,#0A263F,#0D2E4A);border:0;color:#d6e8f6}
.about-box h3{color:#ffb185}
.about-box li{border-bottom:1px solid rgba(255,255,255,.12)}
.card{transition:transform .2s,box-shadow .2s}
.card:hover{box-shadow:0 0 0 1px rgba(14,139,216,.4),0 18px 40px rgba(14,139,216,.18)}
.card-art{cursor:pointer}
.card h3 a{color:inherit;text-decoration:none}.card h3 a:hover{color:var(--green-d)}
.card-art .alt{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:.6rem;background:#fff;opacity:0;transition:opacity .35s}
.card:hover .card-art .alt{opacity:1}
.cat{color:var(--green-d)}
.fab-wrap{position:fixed;bottom:calc(22px + env(safe-area-inset-bottom));inset-inline-end:max(22px,env(safe-area-inset-right));z-index:60;display:grid;gap:12px;transition:opacity .15s,visibility 0s}
.fab-wrap.fab-away{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s,visibility 0s .15s}
body.pz-open .fab-wrap{display:none}
@media(max-width:600px){.fab-wrap{gap:10px}.fab-wrap .fab,.fab-wrap .fab-call{width:48px;height:48px}.fab-wrap .fab{font-size:1.45rem}.fab-wrap .fab-call{font-size:1.15rem}}
.fab{position:static;width:56px;height:56px;color:#fff;font-size:1.6rem}
.fab-call{background:var(--green);box-shadow:0 10px 26px rgba(14,139,216,.5);width:56px;height:56px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:1.3rem}
.fab-call:hover{transform:scale(1.08)}
/* highlights gallery */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.gal figure{position:relative;margin:0;border-radius:20px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);aspect-ratio:3/4}
.gal img{width:100%;height:100%;object-fit:cover}
.gal figcaption{position:absolute;inset-inline:0;bottom:0;padding:2.2rem 1rem .9rem;color:#fff;font-weight:700;font-size:.92rem;background:linear-gradient(transparent,rgba(6,26,44,.9))}
@media(max-width:900px){.gal{grid-template-columns:1fr 1fr}}
/* cta + footer (futuristic dark bands) */
.cta-box{background:radial-gradient(520px 260px at 92% 0,rgba(14,139,216,.55),transparent 60%),radial-gradient(420px 240px at 0 100%,rgba(254,97,2,.28),transparent 60%),linear-gradient(135deg,#0A263F,#0D2E4A);border:0;color:#fff;box-shadow:0 24px 60px rgba(10,38,63,.35)}
.cta-box p{color:#b9d2e6}
footer{background:#061a2c;color:#a9c3d8;border-top:0}
.foot-grid{border-bottom:1px solid rgba(255,255,255,.1)}
footer h4{color:#fff}
footer a:hover{color:#ffb185}
footer .logo{color:#fff}footer .logo small{color:#8fd0f7}footer .logo-mark{background:#0D2E4A}
.copy{color:#7f9db4}
.foot-contact{list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.5rem;font-size:.92rem}
.foot-contact li{display:flex;align-items:center;gap:.65rem}
.foot-contact i{width:1.15rem;text-align:center;color:#ffb185;font-size:.95rem}
.foot-contact i.fb{color:#1877F2;font-size:1.15rem}
.foot-contact a{color:inherit}
.foot-contact a:hover{color:#ffb185}
.info i.fb{color:#1877F2;background:#eaf2fe;font-size:1.3rem}
.info span{min-width:0}.info strong{overflow-wrap:anywhere}.info a.ph{display:block}
.brands strong{color:var(--navy)}
/* toast + lightbox */
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%,20px);background:#0A263F;color:#fff;padding:.8rem 1.2rem;border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.3);display:flex;gap:1rem;align-items:center;opacity:0;pointer-events:none;transition:.3s;z-index:90}
.toast.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.toast a{color:#ffb185;font-weight:700}
/* checkout */
.co-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:start}
.co-grid h2{color:var(--navy);margin-bottom:1rem}
.co-list{display:grid;gap:.8rem}
.co-row{display:grid;grid-template-columns:72px 1fr auto auto auto;gap:1rem;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:.8rem 1rem}
.co-row img{width:72px;height:72px;object-fit:contain;background:#fff;border-radius:10px}
.co-info b{display:block;color:var(--navy);font-size:.95rem;line-height:1.3}
.co-info span{color:var(--muted);font-size:.85rem}
.co-qty{display:flex;align-items:center;gap:.5rem}
.co-qty button{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:var(--tint);color:var(--navy);font-weight:800;cursor:pointer;font-size:1rem}
.co-line{font-weight:800;color:var(--navy);white-space:nowrap}
.co-rm{background:none;border:0;color:#c0392b;cursor:pointer;font-size:1rem}
.co-side{background:#fff;border:1px solid var(--line);border-radius:20px;padding:1.5rem;box-shadow:var(--shadow);position:sticky;top:90px}
.co-side h3{color:var(--navy);margin:1rem 0 .6rem}
.co-side h3:first-child{margin-top:0}
.co-side form{display:grid;gap:.7rem}
.co-opt{display:flex;gap:.8rem;align-items:flex-start;border:1px solid var(--line);border-radius:14px;padding:.9rem;cursor:pointer}
.co-opt input{width:auto;margin-top:.3rem}
.co-opt small{display:block;color:var(--muted);font-size:.82rem;margin-top:.2rem}
.co-opt:has(input:checked){border-color:var(--green);background:var(--tint)}
.co-opt i{color:var(--accent);margin-inline-end:.35rem}
.co-sum{background:var(--bg);border-radius:14px;padding:1rem}
.co-sum div{display:flex;justify-content:space-between;font-size:1.1rem;color:var(--navy)}
.co-sum small{display:block;color:var(--muted);margin-top:.4rem}
.co-agree{display:flex;gap:.6rem;align-items:flex-start;font-size:.9rem}
.co-agree input{width:auto;margin-top:.25rem}
.co-agree a{color:var(--green-d);text-decoration:underline}
.co-err{color:#b3261e;background:#fdecea;border-radius:10px;padding:.6rem .9rem;font-weight:600}
.co-empty,.co-done{text-align:center;max-width:34rem;margin:2rem auto;padding:2rem}
.co-empty i,.co-done i{font-size:3rem;color:var(--green);margin-bottom:1rem}
.co-done i{color:#1a9e5c}
.co-ref{background:var(--tint);border-radius:12px;padding:.8rem;margin:1rem 0}
.co-side .btn-wa{background:#25d366;color:#053b1b;border:0;font-size:1rem;padding:.9rem}
@media(max-width:900px){.co-grid{grid-template-columns:1fr}.co-side{position:static}.co-row{grid-template-columns:56px 1fr auto}.co-row img{width:56px;height:56px}.co-line{grid-column:2}}


.promo{background:linear-gradient(90deg,#E85500,#FF7A1F);color:#fff}
.promo-in{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;padding:.85rem 0;font-weight:800;font-size:1.05rem;text-align:center}
.promo-in i{font-size:1.3rem}
.promo .btn{background:#fff;color:#B84200;box-shadow:none;padding:.45rem 1.1rem;font-size:.9rem}
.promo .btn:hover{background:#fff4ec}
.co-free{background:#fff4ec;border:1px solid #ffd6b8;border-radius:14px;padding:.8rem 1rem;color:#8a3a00;font-weight:600;font-size:.92rem}
.co-free i{color:var(--accent);margin-inline-end:.35rem}
.co-bar{height:8px;background:#ffe3cf;border-radius:99px;overflow:hidden;margin-top:.5rem}
.co-bar span{display:block;height:100%;background:linear-gradient(90deg,#FE6102,#ff9a4d);border-radius:99px;transition:width .3s}
.co-sum .co-del{display:block;font-size:.95rem;color:var(--green-d);font-weight:700;margin-top:.3rem}


.price-row{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:auto}
.price-row .price{margin:.2rem 0;flex-wrap:wrap;row-gap:0;column-gap:.5rem;min-width:0}
.price b,.price s{white-space:nowrap}
.add-ic{flex:none;width:46px;height:46px;border-radius:50%;border:0;cursor:pointer;background:linear-gradient(135deg,#0E8BD8,#0A6DAE);color:#fff;font-size:1.05rem;display:grid;place-items:center;box-shadow:0 8px 20px rgba(14,139,216,.4);transition:transform .15s,box-shadow .15s}
.add-ic:hover{transform:translateY(-2px) scale(1.06);box-shadow:0 12px 26px rgba(14,139,216,.5)}
.add-ic:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.more-wrap{text-align:center;margin-top:2rem}
.pay-row{display:flex;align-items:center;justify-content:center;gap:.9rem;flex-wrap:wrap;padding:1.2rem 0 .4rem;color:#9bbbd3;font-weight:600}
.pay-row img{height:38px;width:38px;object-fit:contain;background:#fff;border-radius:10px;padding:2px}
.pay-row img.vf{width:auto;height:38px;background:none;padding:0;border-radius:8px}
.pay-row .cash{display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.08);padding:.4rem .9rem;border-radius:999px;color:#fff}
.social-row{display:flex;justify-content:center;gap:.7rem;padding:1rem 0 0}
.social-row a{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;font-size:1.1rem;transition:.2s}
.social-row a:hover{background:var(--accent)}
.ip-logo{height:26px;width:26px;object-fit:contain;vertical-align:middle;margin-inline-end:.4rem;border-radius:6px}
@media(max-width:700px){.chips{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding-bottom:.5rem;-webkit-overflow-scrolling:touch}.chip{white-space:nowrap;flex:none}}


.money{unicode-bidi:isolate;white-space:nowrap}
.co-list,.co-info,.co-opt span{min-width:0}
.co-info b,.co-opt small,.co-opt b{overflow-wrap:anywhere}
.co-qty{direction:ltr}
.co-qty button{min-width:40px;min-height:40px}
.co-rm{min-width:40px;min-height:40px}
.co-opt{min-height:60px}
.co-side input:not([type=radio]):not([type=checkbox]),.co-side textarea{min-height:48px;font-size:1rem;width:100%}
.co-summary{background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:1rem 1.1rem}
.co-summary h3{margin:0 0 .6rem!important}
.cs-row{display:grid;grid-template-columns:1fr auto;gap:.2rem .8rem;padding:.55rem 0;border-bottom:1px dashed var(--line);font-size:.92rem}
.cs-row b{color:var(--navy);font-weight:700;overflow-wrap:anywhere}
.cs-row small{grid-column:1/2;color:var(--muted)}
.cs-row .cs-l{grid-column:2;grid-row:1/3;align-self:center;font-weight:800;color:var(--navy)}
.cs-line{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 0;font-size:.95rem;color:var(--navy)}
.cs-line span:last-child{font-weight:700;text-align:end}
.cs-total{border-top:2px solid var(--navy);margin-top:.3rem;padding-top:.7rem;font-size:1.15rem;font-weight:800}
.cs-note{display:block;color:var(--muted);font-size:.82rem;margin-top:.3rem}
.co-cta{margin-top:.2rem}
.co-hint{color:var(--muted);font-size:.85rem;margin:.5rem 0 0;text-align:center}
.co-agree{align-items:flex-start;gap:.6rem;font-size:.95rem;line-height:1.5}
.co-agree input{flex:none;width:22px!important;height:22px;min-height:22px!important;margin-top:.15rem}
@media(max-width:900px){
  .co-cta{position:sticky;bottom:0;z-index:5;background:linear-gradient(rgba(255,255,255,0),#fff 22%);padding:.9rem 0 .4rem;margin-inline:-.2rem}
  .co-row{grid-template-columns:56px minmax(0,1fr) auto}
  .co-row .co-qty{grid-column:2}
  .co-row .co-line{grid-column:2}
  .co-row .co-rm{grid-column:3;grid-row:1}
}


@media(max-width:400px){
  .wrap{width:94%}
  .nav{gap:.4rem}
  .nav-actions{gap:.35rem}
  .logo{gap:.4rem;min-width:0}
  .logo-mark{width:34px;height:34px;border-radius:10px}
  .logo>span:last-child{font-size:.82rem}
  .logo small{font-size:.5rem;letter-spacing:.1em}
  .cart-link{width:38px;height:38px}
  .lang{padding:.32rem .6rem;font-size:.82rem}
  .menu-btn{padding:.2rem;font-size:1.25rem}
}
@media(max-width:340px){.logo small{display:none}.logo>span:last-child{font-size:.78rem}}


.co-done>i{font-size:3rem}.co-done>.fa-whatsapp{color:#25d366}
.co-done .btn i{font-size:1em;color:inherit;margin:0}
.co-confirm{margin-top:1.4rem;padding:1.1rem;border:1px solid var(--line);border-radius:16px;background:var(--bg);text-align:center}
.co-confirm b{display:block;color:var(--navy);margin-bottom:.8rem}
.co-confirm-btns{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}
.co-confirm .btn{flex:1 1 14rem}


/* contrast: white text needs 4.5:1 - darker blue and orange for filled controls */
:root{--green:#0A78BE;--green-d:#075C94;--accent-d:#C74400}
.btn-green,.add-ic{background:linear-gradient(135deg,#0A78BE,#075C94);color:#fff}
.btn-green:hover{background:linear-gradient(135deg,#0E86CF,#0A6DAE)}
.badge,.cart-n{background:var(--accent-d);color:#fff}
.btn-accent{color:#0A263F}
.pl-tab em{color:#0A263F}
.price s{color:#66758a}
.chip.on{background:var(--navy);color:#fff}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #0A78BE;outline-offset:2px}
/* hero: clean product cards */
.gl{background:#fff;display:block;color:var(--navy);text-decoration:none}
.gl img{object-fit:contain;padding:.5rem .5rem 2.6rem;background:#fff}
.gl-a img{padding:.9rem .9rem 2.8rem}
.gl-cap{position:absolute;inset-inline:0;bottom:0;display:grid;gap:.1rem;padding:.6rem .85rem .7rem;background:linear-gradient(transparent,rgba(10,38,63,.95) 38%);color:#fff;font-size:.74rem;font-weight:600;line-height:1.3;text-align:start}
.gl-cap span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gl-cap b{color:#ffb185;font-size:.88rem}
.gl-b .gl-cap span,.gl-c .gl-cap span{-webkit-line-clamp:1}
.sv-vis.sv-pack{display:block;background:#fff}
.sv-pack img{object-fit:contain;padding:1.2rem 1.2rem 3.6rem;transform:none!important}
.sv-pack::after{display:none}
.sv-pack .gl-cap{font-size:.85rem;padding:.8rem 1.1rem .9rem}
.sv-pack .gl-cap b{font-size:1rem}
/* product cards: every photo box is a true square, tall or wide images can no longer stretch the card */
.card-art{aspect-ratio:1/1;overflow:hidden}
.card-art>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:.6rem}
/* shop by category */
.cats{padding:3.2rem 0 1rem}
.cat-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}
.cat-tile{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.2rem;background:#fff;border:1px solid var(--line);border-radius:18px;padding:.8rem .7rem 1rem;color:var(--navy);transition:transform .2s,box-shadow .2s}
.cat-tile:hover{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(14,139,216,.4),0 14px 32px rgba(14,139,216,.16)}
.ct-img{position:relative;width:100%;aspect-ratio:1/1;margin-bottom:.4rem;overflow:hidden}
.ct-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.cat-tile b{font-size:.92rem;line-height:1.3}
.cat-tile small{color:var(--muted);font-size:.78rem}
.cat-grp{margin:1.4rem 0 .6rem;font-size:.82rem;font-weight:800;color:var(--navy);letter-spacing:.02em}
.cat-grp:first-child{margin-top:0}
.cat-tile.is-smart{border-color:rgba(14,139,216,.45)}
@media(min-width:701px){.cat-tiles{grid-template-columns:repeat(5,1fr)}}
/* deals */
.deals{background:#fff;padding:3rem 0;border-block:1px solid var(--line);margin-top:2rem}
.deal-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.3rem}
@media(max-width:700px){
  .cat-tiles,.deal-row{display:flex;overflow-x:auto;scroll-snap-type:x proximity;gap:.8rem;padding-bottom:.6rem;-webkit-overflow-scrolling:touch}
  .cat-tile{flex:none;width:132px;scroll-snap-align:start}
  .deal-row .card{flex:none;width:232px;scroll-snap-align:start}
}
/* sub-category chips */
.chips.sub{margin:-1rem 0 1.4rem}
.chip.sm{font-size:.85rem;padding:.4rem .9rem}
.chip.sm.on{background:var(--green);border-color:var(--green);color:#fff}
.cat-view{text-align:center;margin:-.8rem 0 1.4rem}
.cat-view a{font-weight:700;color:var(--green-d)}
/* mini-cart drawer */
.cd-back{position:fixed;inset:0;background:rgba(6,26,44,.55);z-index:150;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.cd{position:fixed;top:0;bottom:0;inset-inline-end:0;width:min(420px,100%);background:#fff;z-index:151;display:flex;flex-direction:column;transform:translateX(100%);visibility:hidden;transition:transform .28s,visibility .28s;box-shadow:-20px 0 60px rgba(6,26,44,.3)}
[dir=rtl] .cd{transform:translateX(-100%);box-shadow:20px 0 60px rgba(6,26,44,.3)}
.cd-back.on{opacity:1;visibility:visible}
.cd.on{transform:none;visibility:visible}
body.cd-open{overflow:hidden}
@media(prefers-reduced-motion:reduce){.cd,.cd-back{transition:none}}
.cd-head{display:flex;justify-content:space-between;align-items:center;padding:.6rem 1.2rem;border-bottom:1px solid var(--line)}
.cd-head h2{font-size:1.15rem;color:var(--navy)}
.cd-head h2 span{color:var(--muted);font-weight:600}
.cd-x{width:44px;height:44px;border:0;background:none;font-size:1.9rem;line-height:1;cursor:pointer;color:var(--navy)}
.cd-free{padding:.8rem 1.2rem;background:var(--tint);font-size:.88rem;color:var(--navy)}
.cd-free p{margin:0 0 .4rem}
.cd-list{flex:1;overflow:auto;padding:.2rem 1.2rem}
.cd-row{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:.8rem;align-items:start;padding:.9rem 0;border-bottom:1px solid var(--line)}
.cd-row.new{animation:cdflash 1.4s}
@keyframes cdflash{0%{background:#fff1e3}100%{background:transparent}}
.cd-row img{width:64px;height:64px;object-fit:contain;border:1px solid var(--line);border-radius:12px;background:#fff}
.cd-info{display:grid;gap:.3rem;min-width:0}
.cd-name{font-weight:700;color:var(--navy);font-size:.9rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cd-price{font-weight:800;color:var(--navy);font-size:.92rem}
.cd-q{display:inline-flex;align-items:center;justify-self:start;border:1px solid var(--line);border-radius:999px;direction:ltr}
.cd-q button{width:40px;height:38px;border:0;background:none;font-size:1.1rem;cursor:pointer;color:var(--navy)}
.cd-q span{min-width:1.6rem;text-align:center;font-weight:700}
.cd-rm{width:44px;height:44px;border:0;background:none;color:#66758a;cursor:pointer;font-size:1rem}
.cd-rm:hover{color:#b42318}
.cd-foot{padding:1rem 1.2rem calc(1rem + env(safe-area-inset-bottom));border-top:1px solid var(--line);display:grid;gap:.7rem;background:#fff}
.cd-foot .btn{width:100%}
.cd-sub{display:flex;justify-content:space-between;align-items:baseline;font-size:1.05rem;color:var(--navy)}
.cd-empty{margin:auto;padding:2rem;text-align:center;color:var(--muted)}
.cd-empty i{font-size:2.6rem;color:var(--green);margin-bottom:.8rem}


/* top bar: static, solid navy, two short messages (no animation, no marquee) */
.topbar{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.15rem 1.1rem;padding:.45rem 1rem;background:#0A263F;color:#fff;font-size:.86rem;line-height:1.45;font-weight:600;letter-spacing:0;border:0}
.tb-dot{width:1px;height:14px;background:rgba(255,255,255,.35);flex:none}
.topbar .nb{white-space:nowrap}
.topbar span{text-wrap:balance}
.topbar .tb-2{display:inline-flex;align-items:center;justify-content:center;gap:.55rem}.topbar .tb-sep{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.45}.topbar .tb-eg{display:inline-flex;align-items:center;gap:.35rem;font-weight:500;opacity:.9;white-space:nowrap}.topbar .tb-flag{flex:none;border-radius:1.5px;box-shadow:0 0 0 1px rgba(255,255,255,.35)}
@media(max-width:640px){.topbar{flex-direction:column;gap:.05rem;padding:.4rem .8rem}.tb-dot{display:none}}
/* no continuous motion on the hero cards */
.gl,.fchip,.eyebrow::before{animation:none!important}
/* mobile shop menu: accordion, categories always visible, sub-categories open underneath */
.shop-mob{display:none}
@media(max-width:1200px){
  nav ul.open{max-height:calc(100vh - 118px);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
  .shop-mob{display:block;border-top:1px solid var(--line);padding-top:.7rem}
  .acc-h{font-size:.78rem;font-weight:800;letter-spacing:.06em;color:var(--muted);margin:0 0 .2rem;text-transform:uppercase}
  html[lang=ar] .acc-h{letter-spacing:0;font-size:.85rem}
  nav .shop-mob ul{list-style:none;margin:0;padding:0;display:block;position:static;top:auto;inset-inline:auto;background:none;border:0;gap:0}
  .acc-i{border-bottom:1px solid var(--line)}
  .acc-b,.acc-a{display:flex;align-items:center;justify-content:space-between;gap:.8rem;width:100%;min-height:52px;padding:.5rem .1rem;background:none;border:0;font:inherit;font-weight:700;font-size:1rem;color:var(--navy);text-align:start;cursor:pointer}
  .acc-a small,.acc-p small{color:var(--muted);font-weight:600;font-size:.8rem;flex:none}
  .acc-b i{flex:none;width:44px;height:44px;display:grid;place-items:center;font-size:1rem;color:var(--navy);transition:transform .2s}
  .acc-b[aria-expanded=true]{color:var(--green-d)}
  .acc-b[aria-expanded=true] i{transform:rotate(180deg)}
  nav .shop-mob .acc-p{padding:0 0 .5rem;background:var(--bg);border-radius:6px;margin-bottom:.6rem}
  .acc-p[hidden]{display:none}
  .acc-p li a{display:flex;justify-content:space-between;align-items:center;gap:.8rem;min-height:48px;padding:.4rem .9rem;color:var(--navy);font-weight:600;border-bottom:1px solid var(--line)}
  .acc-p li:last-child a{border-bottom:0}
  .acc-p li:first-child a{color:var(--green-d);font-weight:800}
}
@media(prefers-reduced-motion:reduce){.acc-b i{transition:none}}
body:has(#menu.open) .fab-wrap{display:none}
/* Open Box / Refurbished */
.openbox{padding:2.6rem 0;background:#fff;border-block:1px solid var(--line)}
.ob-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap;margin-bottom:1.4rem}
.ob-head h2{font-size:clamp(1.5rem,2.6vw,2rem);color:var(--navy);font-weight:800;margin:0}
.ob-head p{color:var(--muted);margin:.4rem 0 0;max-width:38rem}
.ob-head p.ob-ar{color:var(--muted);font-weight:700;font-size:.95rem;margin:.1rem 0 .3rem}.ob-head p.ob-ar:empty{display:none}
.ob-head p.ob-promise{color:var(--navy);font-weight:800;font-size:1.05rem;margin:.55rem 0 0}
.ob-trust{list-style:none;display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;padding:0;margin:.7rem 0 0;font-size:.88rem;font-weight:600;color:var(--navy)}
.ob-trust li::before{content:'\2713';color:#0f6b3a;font-weight:800;margin-inline-end:.4rem}
.ob-all{font-weight:700;color:var(--green-d);border-bottom:2px solid currentColor;padding-bottom:.1rem}
.cond-tag{position:absolute;top:.8rem;inset-inline-end:.8rem;background:#fff;color:#0A263F;border:1px solid #0A263F;font-size:.72rem;font-weight:800;padding:.16rem .5rem;border-radius:4px;letter-spacing:.02em;z-index:2}
.cond-info{display:flex;flex-wrap:wrap;gap:.2rem .9rem;font-size:.84rem;font-weight:600;color:var(--navy);margin:0}
.cond-save{color:#0f6b3a}
/* badges stay above the (now absolutely positioned) product photo; the category label of home cards gets its own strip */
.card-art .badge{z-index:2}
.grid .card-art>img,.deal-row .card-art>img{padding-bottom:2.6rem}


/* one product card, two variants (clean / technical) */
.c-brand{font-size:.74rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
html[lang=ar] .c-brand{letter-spacing:0;font-size:.8rem}
.c-brand-logo{display:flex;align-items:center;height:24px;margin-block:-2.5px}
.c-brand-logo img{display:block;height:auto;max-height:100%;max-width:100%;object-fit:contain}
.c-brand-logo img.mul{mix-blend-mode:multiply}
.c-attrs{list-style:none;display:flex;flex-wrap:wrap;gap:.3rem;margin:.1rem 0 0;padding:0}
.c-attrs li{font-size:.72rem;font-weight:700;color:var(--navy);border:1px solid #b3c3d6;border-radius:4px;padding:.1rem .45rem}
.card-body>p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
/* mini-cart: side drawer on desktop, bottom sheet on phones (same markup, same cart logic) */
.cd-list{min-height:0}
@media(max-width:640px){
  .cd{top:auto;bottom:0;inset-inline:0;width:100%;height:auto;max-height:88vh;border-radius:12px 12px 0 0;transform:translateY(100%);box-shadow:0 -12px 40px rgba(6,26,44,.3)}
  [dir=rtl] .cd{transform:translateY(100%);box-shadow:0 -12px 40px rgba(6,26,44,.3)}
  .cd.on,[dir=rtl] .cd.on{transform:none}
  .cd-head{position:relative;padding-top:1.1rem}
  .cd-head::before{content:'';position:absolute;top:.45rem;inset-inline-start:50%;width:40px;height:4px;border-radius:2px;background:#c5d1de;transform:translateX(-50%)}
}
body.cd-open .fab-wrap{display:none}
@media(prefers-reduced-motion:reduce){.cd,.cd-back{transition:none}}
/* cart notices and the warranty line on condition listings */
.co-note{background:#fff7ed;border:1px solid #f3c98b;border-radius:8px;padding:.7rem 1rem;margin:0 0 1rem;font-size:.92rem;color:#7a4a00}
.cd .co-note{margin:.6rem 1.2rem 0}
.co-cond{display:block;color:var(--navy);font-weight:600;font-size:.82rem}
.deals-more{margin:1.2rem 0 0}

/* brands + filters batch: Brands section */
.brandsec{background:#fff;border-block:1px solid var(--line)}
.brand-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.8rem}
.brand-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem;text-align:center;padding:1rem .6rem;border:1px solid var(--line);border-radius:14px;background:#f6f9fc;color:var(--navy);transition:box-shadow .2s,border-color .2s}
.brand-tile .bl{display:flex;align-items:center;justify-content:center;width:100%;height:44px}
.brand-tile .bl img.mul{mix-blend-mode:multiply}
.brand-tile .bl img{display:block;max-width:88%;height:auto;max-height:100%;object-fit:contain}
.brand-tile b{font-size:1.15rem;font-weight:800;letter-spacing:.04em;overflow-wrap:anywhere}
.brand-tile small{color:var(--muted);font-weight:600;font-size:.78rem}
.brand-tile:hover,.brand-tile:focus-visible{border-color:#0E8BD8;box-shadow:0 8px 22px rgba(14,139,216,.16)}
/* phase 2: bento solutions, header search, offers dot */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1rem}
.bt{position:relative;display:flex;gap:1rem;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:26px;padding:1.6rem;color:var(--navy);transition:box-shadow .2s,border-color .2s,transform .2s}
a.bt:hover,a.bt:focus-visible{border-color:#0E8BD8;box-shadow:0 14px 34px rgba(14,139,216,.16);transform:translateY(-2px)}
.bt-txt{display:flex;flex-direction:column;gap:.5rem;min-width:0;flex:1}
.bt-txt>i{width:44px;height:44px;border-radius:14px;background:var(--tint);color:var(--accent);display:grid;place-items:center;font-size:1.1rem}
.bt h3{font-size:1.2rem;line-height:1.35}
.bt p{color:var(--muted);font-size:.94rem}
.bt-txt>b{margin-top:auto;color:var(--green-d);font-size:.95rem;padding-top:.4rem}
.bt-pic{display:flex;align-items:center;justify-content:center;background:#fff;border-radius:18px;min-width:0}
.bt-pic img{display:block;width:100%;height:100%;object-fit:contain}
.bt-entry{grid-column:span 6;grid-row:span 2;flex-direction:column;background:linear-gradient(180deg,#f3f8fd,#fff 55%)}
.bt-entry .bt-pic{flex:1;min-height:240px;max-height:380px}
.bt-entry h3{font-size:1.5rem}
.bt-light{grid-column:span 6}
.bt-light .bt-pic,.bt-power .bt-pic{flex:0 0 38%}
.bt-sm{grid-column:span 3}
.bt-power{grid-column:span 8}
.bt-spaces{grid-column:span 4;flex-direction:column;justify-content:center;background:var(--tint);gap:.9rem}
.bt-chips{display:flex;flex-wrap:wrap;gap:.45rem}
.bt-chips span{background:#fff;border:1px solid #cfe4f4;border-radius:999px;padding:.3rem .85rem;font-size:.86rem;font-weight:600;color:var(--navy)}
.bt-spaces .btn{align-self:flex-start}
@media(max-width:900px){.bt-entry{grid-column:1/-1;grid-row:auto}.bt-entry .bt-pic{flex:none;aspect-ratio:16/9;min-height:0;max-height:none}.bt-pic img{max-height:260px}.bt-light,.bt-power{grid-column:1/-1}.bt-sm{grid-column:span 6}.bt-spaces{grid-column:1/-1}}
@media(max-width:560px){.bento{gap:.7rem}.bt{padding:1.1rem;border-radius:20px}.bt-sm{grid-column:span 6}.bt-sm p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.bt-light .bt-pic,.bt-power .bt-pic{flex-basis:34%}.bt-entry .bt-pic{flex:none;min-height:0;aspect-ratio:4/3}}
@media(max-width:420px){.bt-sm{grid-column:1/-1}}
.srch-link{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--tint);color:var(--navy);transition:.2s}
.srch-link:hover{background:#d5eafb}
@media(max-width:760px){.srch-link{width:38px;height:38px}}
.nav-outlet,.nav-offers{display:inline-flex;align-items:center;gap:.45rem}
.nav-ic{display:inline-grid;place-items:center;flex:none;width:1.75rem;height:1.75rem;border-radius:50%;background:#FFF1E8;color:var(--accent-d,#C74400);font-size:.8rem}
nav a.nav-offers.has-offers::after{content:none}
.nav-sale{position:relative;inset-block-start:-.55em;background:var(--accent-d,#C74400);color:#fff;font-size:.62rem;font-weight:800;letter-spacing:.05em;line-height:1;padding:.2rem .4rem;border-radius:999px;white-space:nowrap}
@media(max-width:960px){.nav-sale{inset-block-start:0;font-size:.66rem}}
.out-promise{margin:0 0 1.4rem;background:#fff;border:1px solid var(--line);border-radius:12px;padding:.8rem 1rem;color:var(--navy)}
.out-promise b{display:block;margin-bottom:.15rem}
nav a.has-offers::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#FE6102;margin-inline-start:.35rem;vertical-align:super;box-shadow:0 0 0 2px rgba(254,97,2,.22)}
.deals-all{text-align:center;margin-top:1.4rem}
#dealRow{grid-template-columns:repeat(auto-fit,minmax(240px,300px));justify-content:center}
@media(max-width:700px){#dealRow{grid-template-columns:none;justify-content:flex-start}}
/* phase 3: product rails (Best Sellers / New Arrivals) and tighter section rhythm on phones */
@media(max-width:700px){
  .rail{display:flex;overflow-x:auto;scroll-snap-type:x proximity;gap:.8rem;padding-bottom:.8rem;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
  .rail .card{flex:none;width:min(252px,72vw);scroll-snap-align:start}
  #cats,#deals,#bestsellers,#newarrivals,#solutions,#brands,#explore,#guides,#faq,#shopcta{padding-top:2.6rem;padding-bottom:2.6rem}
  #cats{padding-bottom:.4rem}#shopcta{padding-top:1.2rem}
  #cats .sec-head,#deals .sec-head,#bestsellers .sec-head,#newarrivals .sec-head,#solutions .sec-head,#brands .sec-head,#explore .sec-head,#guides .sec-head,#faq .sec-head{margin-bottom:1.4rem}
  .feat-all{margin-top:1.2rem}
}
.newsec{padding-top:0}
.mbadge{position:absolute;top:.8rem;inset-inline-end:.8rem;z-index:2;display:inline-flex;align-items:center;gap:.28rem;max-width:calc(100% - 5.4rem);white-space:nowrap;padding:.2rem .6rem;border-radius:999px;font-size:.72rem;font-weight:800;line-height:1.5;letter-spacing:.01em;box-shadow:0 4px 12px rgba(10,38,63,.18)}
.mbadge i{font-size:.62rem;color:#ffb347}
.mb-best{background:#0A263F;color:#fff}
.mb-new{background:#fff;color:#0A6DAE;border:1px solid #bfdff5}
/* products mega menu (desktop) + Smart Home grouping in the mobile accordion */
.has-mega{position:static}
.mega{position:absolute;top:100%;left:50%;width:min(1060px,calc(100vw - 2rem));transform:translate(-50%,8px);background:#fff;border:1px solid var(--line);border-top:0;border-radius:0 0 24px 24px;box-shadow:0 30px 60px rgba(10,38,63,.18);opacity:0;visibility:hidden;transition:opacity .14s ease,transform .14s ease,visibility 0s linear .14s;z-index:60;font-weight:500;text-align:start}
.mega.open{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .14s ease,transform .14s ease}
.mega::before{content:"";position:absolute;inset-inline:0;top:-16px;height:16px}
.mega-in{display:grid;grid-template-columns:1.45fr 1fr 1.05fr;overflow:hidden;border-radius:0 0 24px 24px}
.mg-col{padding:1.4rem 1.6rem 1.5rem}
.mg-col h3{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:800;margin:0 0 .7rem}
html[lang=ar] .mg-col h3{letter-spacing:0;font-size:.85rem;text-transform:none}
.mg-col ul{display:grid;gap:.1rem;list-style:none;margin:0;padding:0;position:static;background:none;border:0;flex-direction:initial;font-size:inherit}
.mg-col a{display:flex;align-items:center;gap:.7rem;border-radius:12px;color:var(--navy);transition:background .12s}
.mg-col a:hover,.mg-col a:focus-visible{background:#eef6fd}
.mg-col a:focus-visible,.mega a:focus-visible{outline:2px solid #0E8BD8;outline-offset:-2px}
.mg-smart{background:linear-gradient(160deg,#eef6fd,#f8fbff);border-inline-end:1px solid var(--line)}
.mg-smart ul{grid-template-columns:1fr}
.mg-smart a{padding:.55rem .6rem;font-size:1rem;font-weight:700}
.mg-smart a i{flex:none;width:34px;height:34px;border-radius:10px;background:#fff;color:var(--accent);display:grid;place-items:center;font-size:.95rem;box-shadow:0 1px 4px rgba(10,38,63,.1)}
.mg-smart a span{flex:1}
.mg-smart a small{color:var(--muted);font-weight:600;font-size:.78rem}
.mg-more a{padding:.4rem .6rem;font-size:.9rem;font-weight:600;color:#3d5167}
.mg-disc a{padding:.5rem .6rem;font-size:.95rem;font-weight:700}
.mg-disc ul a i{flex:none;width:1.2rem;text-align:center;color:var(--accent)}
.mg-disc .nav-ic i{width:auto;color:inherit}
.mg-disc a{display:flex;align-items:center;gap:.6rem}
.mg-dot{width:7px;height:7px;border-radius:50%;background:#FE6102;display:inline-block;margin-inline-start:.1rem}
.mg-feat{margin-top:.9rem;border:1px solid var(--line);padding:.55rem !important;background:#fff}
.mg-feat img{flex:none;width:56px;height:56px;object-fit:contain;border-radius:10px;background:#fff}
.mg-feat span{min-width:0;display:grid;gap:.1rem}
.mg-feat small{color:#0A6DAE;font-weight:800;font-size:.7rem;letter-spacing:.04em}
.mg-feat b{font-size:.84rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.mg-feat i{font-style:normal;font-weight:800;color:var(--navy);font-size:.88rem}
.mg-all{margin-top:.7rem;padding:.6rem .8rem !important;font-weight:800;color:var(--green-d) !important}
@media(max-width:1100px){.mg-feat{display:none}}
@media(max-width:960px){.mega{display:none}}
/* narrow desktop (961-1060px): the header incl. the search icon must fit */
@media(min-width:961px) and (max-width:1060px){nav ul{gap:.8rem;font-size:.85rem}.srch-link,.cart-link{width:36px;height:36px}.nav-actions{gap:.35rem}.lang{padding:.3rem .65rem;font-size:.9rem}.logo>span:last-child{font-size:.95rem}}
@media(prefers-reduced-motion:reduce){.mega,.mega.open{transition:none}}
.acc-g{list-style:none;font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);padding:.9rem .1rem .2rem}
html[lang=ar] .acc-g{letter-spacing:0;font-size:.85rem;text-transform:none}
.acc-all{display:flex;margin:.5rem 0 .3rem;min-height:48px;justify-content:center}
.hero-paths{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.1rem}
.hero-paths a{display:inline-flex;align-items:center;gap:.45rem;padding:.42rem .95rem;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;font-size:.88rem;font-weight:600;white-space:nowrap;transition:background .15s,border-color .15s}
.hero-paths a i{font-size:.8rem;color:#ffb347}
.hero-paths a:hover,.hero-paths a:focus-visible{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.6)}
@media(max-width:420px){.hero-paths{gap:.4rem}.hero-paths a{padding:.38rem .75rem;font-size:.82rem}}
.feat-all{text-align:center;margin-top:2rem}
.fcta-row{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap;margin-top:1.4rem}
.brand-more{background:none;border:0;border-bottom:2px solid currentColor;cursor:pointer;font:inherit}
@media(max-width:600px){.brand-grid{grid-template-columns:repeat(2,1fr);gap:.6rem}.brand-tile{padding:.8rem .4rem}.brand-tile b{font-size:1rem}}

/* cleanup batch: Open Box & Refurbished section stands out; the two conditions have different badge colours */
.openbox{background:linear-gradient(180deg,#eaf5fd 0,#f6f9fc 100%);border-block:1px solid #cfe5f6}
.openbox.ob-none{padding:1.8rem 0}.openbox.ob-none .ob-head{margin-bottom:.8rem}.openbox.ob-none .ob-all{display:none}.openbox.ob-none .ob-head p.ob-promise{margin-top:.3rem;font-size:1rem}
.ob-empty{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.2rem}.ob-empty p{margin:0;color:var(--muted)}
.ob-legend{display:flex;flex-wrap:wrap;gap:.5rem;margin:.6rem 0 .2rem}
.ob-legend .cond-tag{position:static;font-size:.8rem}
.cond-tag.c-open-box{border-color:#0E8BD8;color:#0A6DAE;background:#eaf5fd}
.cond-tag.c-refurbished{border-color:#0f6b3a;color:#0f6b3a;background:#ecfdf3}


.page-hero{background:radial-gradient(700px 320px at 85% 0,rgba(14,139,216,.5),transparent 60%),radial-gradient(500px 300px at 0 100%,rgba(254,97,2,.22),transparent 60%),linear-gradient(160deg,#0A263F,#061a2c);color:#fff;padding:3.2rem 0 3rem;text-align:center;position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:46px 46px;-webkit-mask-image:radial-gradient(ellipse at 50% 40%,#000 25%,transparent 75%);mask-image:radial-gradient(ellipse at 50% 40%,#000 25%,transparent 75%)}
.page-hero .wrap{position:relative}
.page-hero h1{font-size:clamp(2rem,4vw,3rem);font-weight:800;color:#fff;letter-spacing:-.02em}
html[lang=ar] .page-hero h1{letter-spacing:0;line-height:1.4}
.page-hero p{color:#b9d2e6;max-width:40rem;margin:.9rem auto 0;font-size:1.05rem}
.crumbs{font-size:.85rem;color:#9bbbd3;margin-bottom:.8rem}.crumbs a{color:#8fd0f7;font-weight:600}
.block{padding:3.5rem 0;border-bottom:1px solid var(--line)}
.block:nth-of-type(even){background:#fff}
.block h2{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;color:var(--navy)}
.block .lead{color:var(--muted);max-width:44rem;margin:.6rem 0 1.6rem}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:2.2rem;align-items:center;margin-bottom:1.6rem}
.split img{border-radius:22px;box-shadow:var(--shadow);aspect-ratio:4/3;object-fit:cover;width:100%;background:#fff;border:1px solid var(--line)}
.split .lead{margin-bottom:0}
.feat{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:2rem}
.feat div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1.1rem 1.2rem}
.block:nth-of-type(even) .feat div{background:var(--bg)}
.feat b{display:block;color:var(--navy);margin-bottom:.2rem}
.feat span{color:var(--muted);font-size:.9rem}
.feat b::before{content:'\2713';color:var(--accent);margin-inline-end:.45rem;font-weight:800}
.mini{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.1rem}
.mini .card-art{aspect-ratio:1/1}
.checks{max-width:44rem;display:grid;gap:.8rem}
.checks div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1rem 1.2rem}
.checks b{color:var(--navy)}
.checks p{color:var(--muted);font-size:.93rem;margin-top:.2rem}
.hint{max-width:44rem;color:var(--muted);font-size:.9rem;margin-top:1.2rem}
@media(max-width:900px){.feat{grid-template-columns:1fr 1fr}.split{grid-template-columns:1fr}}
@media(max-width:520px){.feat{grid-template-columns:1fr}}
.article{max-width:46rem;margin-inline:auto;padding:2.5rem 0 1rem}
.article h2{color:var(--navy);font-size:1.35rem;margin:1.8rem 0 .5rem}
.article p{color:#334155;margin:.6rem 0}
.note-box{background:var(--tint);border:1px solid #cfe8fa;border-radius:14px;padding:1rem 1.2rem;margin:1.6rem 0;color:#0A4F80}