@font-face{font-family:'Cairo';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/cairo-arabic-400-normal.woff2') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Cairo';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/cairo-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Cairo';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/cairo-arabic-600-normal.woff2') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Cairo';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/cairo-latin-600-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Cairo';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/cairo-arabic-700-normal.woff2') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Cairo';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/cairo-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/inter-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/inter-latin-500-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/inter-latin-600-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/inter-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'ABeeZee';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/abeezee-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ===== Design tokens (all colours live here; brand colours sampled from the logo) ===== */
:root{
  --brand-orange:#F86030; --brand-orange-text:#CC4316; --brand-orange-soft:#FFF1EB;
  --brand-navy:#182858; --brand-navy-deep:#0F1A3D; --brand-navy-soft:#EEF1F8;
  --ink:#16203F; --muted:#5B6585; --line:#E3E7F0; --surface:#FFFFFF; --surface-soft:#F6F8FC;
  --on-dark:#FFFFFF; --on-dark-muted:#B9C2DD; --whatsapp:#1FA855; --overlay:rgba(8,14,36,.62);
  --shadow-1:0 8px 28px rgba(15,26,61,.14); --shadow-2:0 2px 10px rgba(15,26,61,.18);
  --font-ui:'Inter','Cairo',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --font-menu:'ABeeZee','Cairo',system-ui,sans-serif;
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:40px; --s6:48px; --s8:64px;
  --container:1280px; --header-h:72px; --radius:12px;
}
.lang-ar{--font-ui:'Cairo','Inter',system-ui,-apple-system,'Segoe UI',Tahoma,Arial,sans-serif}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + var(--s2))}
body{margin:0;font-family:var(--font-ui);font-size:16px;line-height:1.6;color:var(--ink);background:var(--surface);min-height:100vh;display:flex;flex-direction:column}
main{flex:1 0 auto}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul{list-style:none;margin:0;padding:0}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3{line-height:1.25;margin:0 0 var(--s2)}
:focus-visible{outline:3px solid var(--brand-orange);outline-offset:2px;border-radius:6px}
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--s2)}
@media (min-width:768px){.container{padding-inline:var(--s3)}}
.skip{position:absolute;inset-inline-start:var(--s2);top:-100px;z-index:200;background:var(--brand-navy);color:var(--on-dark);padding:var(--s1) var(--s2);border-radius:8px}
.skip:focus{top:var(--s1)}
.i{display:block;flex:none}
.page-stub{padding-block:var(--s8)}
[hidden]{display:none!important}

/* ===== Announcement bar (moving text, continuous loop) ===== */
.announce{background:var(--brand-navy-deep);color:var(--on-dark);overflow:hidden;font-size:14px;line-height:36px;height:36px;direction:ltr}
.announce__track{display:flex;width:max-content;animation:announce-ltr var(--dur,40s) linear infinite;will-change:transform}
.announce__group{display:flex;flex:none}
.announce__group li{flex:none;padding-inline:var(--s4);white-space:nowrap;position:relative}
.announce__group li::after{content:"";position:absolute;inset-inline-end:-2px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--brand-orange)}
.lang-ar .announce__group li{direction:rtl}
.lang-ar .announce__track{animation-name:announce-rtl}
@keyframes announce-ltr{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes announce-rtl{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@media (prefers-reduced-motion:reduce){.announce__track{animation:none}.announce__group[aria-hidden=true]{display:none}.announce{overflow-x:auto}}

/* ===== Header ===== */
.site-header{position:sticky;top:0;z-index:100;background:var(--surface);border-bottom:1px solid var(--line)}
.header__row{display:flex;align-items:center;gap:var(--s2);height:var(--header-h)}
.header__logo{flex:none;display:block;line-height:0}
.header__logo img{height:56px;width:auto}
.header__burger{display:inline-flex}
.icon-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;background:transparent;border-radius:50%;color:var(--ink);transition:background .15s}
.icon-btn:hover{background:var(--brand-navy-soft)}
.badge{position:absolute;top:4px;inset-inline-end:2px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--brand-orange);color:var(--brand-navy-deep);font:700 11px/18px var(--font-ui);text-align:center}
.nav{display:none;flex:1;min-width:0}
.nav__list{display:flex;align-items:center;justify-content:center;gap:var(--s1);width:100%}
.nav__item{position:relative;display:flex;align-items:center}
.nav__link{font-family:var(--font-menu);font-size:15px;font-weight:400;padding:var(--s1) 4px var(--s1) var(--s1);white-space:nowrap;border-radius:8px;color:var(--ink)}
.nav__item:not(.has-menu) .nav__link{padding-inline:var(--s1)}
.nav__link:hover,.nav__caret:hover,.nav__plus:hover{color:var(--brand-orange-text)}
.nav__caret,.nav__plus{display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;width:24px;height:32px;padding:0;color:var(--muted)}
.nav__plus{width:40px;height:40px;border-radius:50%;color:var(--ink)}
.nav__caret .i{transition:transform .15s}
.nav__item.is-open .nav__caret .i{transform:rotate(180deg)}
.menu{position:absolute;top:100%;inset-inline-start:0;z-index:20;min-width:260px;margin-top:8px;padding:var(--s1);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-1);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .15s,transform .15s,visibility 0s .15s}
.menu::before{content:"";position:absolute;inset-inline:0;top:-10px;height:10px} /* hover bridge */
.nav__item.is-open>.menu{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.menu a{display:block;padding:10px var(--s2);border-radius:8px;font-family:var(--font-menu);font-size:15px;white-space:nowrap}
.menu a:hover,.menu a:focus-visible{background:var(--brand-navy-soft);color:var(--brand-navy)}
.menu__all{font-weight:700}
.menu--wide{inset-inline-start:auto;inset-inline-end:0;min-width:min(620px,90vw);display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.nav__more .menu--wide{margin-top:4px}
.header__actions{display:flex;align-items:center;gap:4px;margin-inline-start:auto}
.header__signin{display:none;font-weight:600;font-size:14px;padding:var(--s1) var(--s2);margin-inline:var(--s1);white-space:nowrap}
.header__signin:hover{color:var(--brand-orange-text)}
.header__wish,.header__signin-icon{display:none}
.lang-switch{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border:1px solid var(--line);border-radius:18px;font-size:13px;font-weight:600;color:var(--brand-navy)}
.lang-switch:hover{border-color:var(--brand-navy);background:var(--brand-navy-soft)}
@media (min-width:640px){.header__wish{display:inline-flex}}
@media (min-width:1024px){
  .header__burger{display:none}
  .nav{display:block}
  .header__signin{display:inline-block}
  .header__row{gap:var(--s3)}
}
@media (max-width:1023.98px){.header__actions{gap:0}.lang-switch span{display:none}.lang-switch{width:44px;height:44px;padding:0;justify-content:center;border:0;border-radius:50%}.header__signin-icon{display:inline-flex}.header__logo{margin-inline-end:auto}.header__actions{margin-inline-start:0}}

/* ===== Search layer: opens at the TOP of the page, dark blurred backdrop ===== */
.search-layer{position:fixed;inset:0;z-index:150}
.search-layer__backdrop{position:absolute;inset:0;background:var(--overlay);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.search-layer__panel{position:relative;background:var(--surface);box-shadow:var(--shadow-1);padding-block:var(--s3);animation:drop .18s ease-out}
.search-form{display:flex;align-items:center;gap:var(--s2);color:var(--muted)}
.search-form input{flex:1;min-width:0;height:52px;border:0;border-bottom:2px solid var(--line);background:transparent;font:500 18px var(--font-ui);color:var(--ink);padding-inline:var(--s1)}
.search-form input:focus{outline:0;border-color:var(--brand-orange)}
@keyframes drop{from{transform:translateY(-16px);opacity:0}to{transform:none;opacity:1}}

/* ===== Mobile drawer (accordion) ===== */
.drawer{position:fixed;inset:0;z-index:160}
.drawer__backdrop{position:absolute;inset:0;background:var(--overlay)}
.drawer__panel{position:absolute;top:0;bottom:0;inset-inline-start:0;width:min(86vw,360px);background:var(--surface);display:flex;flex-direction:column;box-shadow:var(--shadow-1);animation:slide-ltr .22s ease-out;overflow:hidden}
.lang-ar .drawer__panel{animation-name:slide-rtl}
@keyframes slide-ltr{from{transform:translateX(-100%)}to{transform:none}}
@keyframes slide-rtl{from{transform:translateX(100%)}to{transform:none}}
.drawer__head{display:flex;align-items:center;justify-content:space-between;padding:var(--s1) var(--s2);border-bottom:1px solid var(--line)}
.drawer__head img{height:40px;width:auto;display:block}
.acc{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:var(--s1) 0}
.acc__btn,.acc__link{display:flex;width:100%;align-items:center;justify-content:space-between;gap:var(--s2);padding:14px var(--s2);border:0;background:transparent;font:600 16px var(--font-ui);text-align:start}
.acc__btn .i{transition:transform .2s}
.acc__btn[aria-expanded=true] .i{transform:rotate(180deg)}
.acc__btn[aria-expanded=true]{color:var(--brand-orange-text)}
.acc__panel{display:none;background:var(--surface-soft);padding:4px 0}
.acc__btn[aria-expanded=true]+.acc__panel{display:block}
.acc__panel a{display:block;padding:11px var(--s4);font-size:15px}
.acc__panel a:hover{color:var(--brand-orange-text)}
.drawer__foot{border-top:1px solid var(--line);padding:var(--s1) var(--s2) calc(var(--s2) + env(safe-area-inset-bottom,0px));display:grid;gap:2px}
.drawer__foot a{display:flex;align-items:center;gap:var(--s1);padding:12px 0;font-weight:600;font-size:15px}
body.no-scroll{overflow:hidden}

/* ===== Footer ===== */
.site-footer{background:var(--brand-navy);color:var(--on-dark);margin-top:var(--s8)}
.footer__grid{display:grid;gap:var(--s4);padding-block:var(--s6);grid-template-columns:1fr}
@media (min-width:640px){.footer__grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.footer__grid{grid-template-columns:1.4fr 1fr 1fr 1.4fr;gap:var(--s6)}}
.footer__brand img{background:var(--surface);border-radius:var(--radius);padding:6px 10px;height:68px;width:auto}
.footer__brand p{margin:var(--s2) 0 0;color:var(--on-dark-muted);max-width:34ch}
.footer__col h2{font-size:16px;font-weight:700;margin-bottom:var(--s2)}
.footer__col li{margin-bottom:10px}
.footer__col a{color:var(--on-dark-muted)}
.footer__col a:hover{color:var(--on-dark);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--brand-orange)}
.footer__contact li{display:flex;gap:12px;align-items:flex-start;color:var(--on-dark-muted)}
.footer__contact .i{margin-top:3px;color:var(--brand-orange)}
.social{display:flex;gap:var(--s1);margin-top:var(--s2)}
.social a{display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;border:1px solid var(--on-dark-muted);border-radius:50%;color:var(--on-dark)}
.social a:hover{background:var(--brand-orange);border-color:var(--brand-orange);color:var(--brand-navy-deep)}
.footer__bar{background:var(--brand-navy-deep);padding-block:var(--s2)}
.footer__bar p{margin:0;font-size:14px;color:var(--on-dark-muted);text-align:center;direction:ltr}

/* ===== Floating buttons: WhatsApp on the end side, Back-to-top on the start side (flip with RTL) ===== */
.fab{position:fixed;z-index:90;bottom:calc(var(--s3) + env(safe-area-inset-bottom,0px));width:52px;height:52px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:0;box-shadow:var(--shadow-2);transition:transform .15s,opacity .2s}
.fab:hover{transform:translateY(-2px)}
.fab--wa{inset-inline-end:var(--s3);background:var(--whatsapp);color:var(--on-dark)}
.fab--top{inset-inline-start:var(--s3);background:var(--brand-navy);color:var(--on-dark)}
@media (max-width:640px){.fab--wa{inset-inline-end:var(--s2)}.fab--top{inset-inline-start:var(--s2)}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}.announce__track{animation:none!important}}

/* ===== Home: server-rendered content, progressive carousel controls ===== */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.home{overflow:hidden}
.hero{position:relative;background:var(--surface-soft)}
.hero__slides{position:relative;aspect-ratio:1920/700;max-height:700px;overflow:hidden}
.hero__slide{position:absolute;inset:0}
.hero__slide[hidden]{display:none}
.hero__slide a,.hero__slide picture{display:block;width:100%;height:100%}
.hero__slide img{display:block;width:100%;height:100%;object-fit:cover}
.hero__controls{position:absolute;inset-inline:var(--s2);top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:space-between;pointer-events:none}
.hero__controls button,.shelf-controls button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--brand-navy);box-shadow:var(--shadow-1);pointer-events:auto}
.hero__controls button:hover,.shelf-controls button:hover{background:var(--brand-navy);color:var(--on-dark)}
.hero__controls button:first-child .i,.shelf-controls button:first-child .i{transform:rotate(90deg)}
.hero__controls button:last-child .i,.shelf-controls button:last-child .i{transform:rotate(-90deg)}
.hero__position{background:var(--surface);padding:2px var(--s1);border-radius:16px;font-size:13px;direction:ltr;opacity:.85}
@media (max-width:640px){.hero__slides{aspect-ratio:4/5;max-height:none}.hero__slide img{object-fit:contain}.hero__controls{position:static;transform:none;padding:var(--s1) var(--s2);background:var(--surface-soft)}}
.brand-strip{padding-block:var(--s3);border-bottom:1px solid var(--line);background:var(--surface)}
.marquee{display:flex;width:max-content;max-width:none;animation:home-loop 80s linear infinite}
.marquee__group{display:flex;flex:none;align-items:center}
.marquee__group>a,.marquee__group>span{width:168px;height:72px;padding:var(--s1) var(--s2);display:flex;align-items:center;justify-content:center;text-align:center;flex:none;font-weight:700;font-size:15px;color:var(--brand-navy);overflow:hidden}
.marquee__group img{display:block;width:136px;height:56px;object-fit:contain}
.marquee:hover,.features__track:hover{animation-play-state:paused}
@keyframes home-loop{to{transform:translateX(-50%)}}
.lang-ar .marquee,.lang-ar .features__track{animation-direction:reverse}
.features{overflow:hidden;background:var(--brand-navy-soft);color:var(--brand-navy);padding-block:12px}
.features__track{display:flex;width:max-content;animation:home-loop 28s linear infinite}
.features__group{display:flex;flex:none;align-items:center;gap:var(--s3);padding-inline:var(--s2)}
.features__group span{white-space:nowrap;font-weight:600;font-size:14px}
.features__group span+span::before{content:'•';margin-inline-end:var(--s3);color:var(--brand-orange-text)}
.home-section{padding-block:var(--s6)}
.home-section--dynamic{padding-top:var(--s3)}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);margin-bottom:var(--s3)}
.section-head h2{margin:0;font-size:clamp(21px,2.4vw,30px);color:var(--brand-navy)}
.category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}
.category-card{min-width:0;text-align:center;display:block}
.category-card__image{aspect-ratio:1;display:grid;place-items:center;background:var(--surface-soft);border:1px solid var(--line);border-radius:var(--radius);color:var(--brand-navy-soft);overflow:hidden}
.category-card__image img{width:100%;height:100%;object-fit:contain;transition:transform .2s}
.category-card:hover .category-card__image img{transform:scale(1.035)}
.category-card__image>.i,.media-empty .i{color:var(--muted);opacity:.5}
.category-card__name{display:block;margin-top:var(--s1);font-size:17px;font-weight:700;color:var(--brand-navy);line-height:1.5}
.shelf-controls{display:flex;gap:var(--s1)}
.shelf-controls button{width:40px;height:40px;box-shadow:none}
.product-shelf{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - var(--s2)) / 2);gap:var(--s2);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scroll-padding-inline:2px;padding:4px 2px var(--s2);overscroll-behavior-inline:contain}
.product-card{position:relative;scroll-snap-align:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;min-width:0;transition:box-shadow .2s,transform .2s}
.product-card:hover{box-shadow:var(--shadow-1);transform:translateY(-2px)}
.product-card__image{position:relative;aspect-ratio:1;background:var(--surface);display:grid;place-items:center;overflow:hidden}
.product-card__image img{width:100%;height:100%;object-fit:contain;transition:transform .2s}
.product-card:hover .product-card__image img{transform:scale(1.035)}
.media-empty{width:100%;height:100%;display:grid;place-items:center;background:var(--surface-soft)}
.product-card__discount{position:absolute;top:var(--s1);inset-inline-start:var(--s1);background:var(--brand-orange);color:var(--brand-navy-deep);border-radius:6px;padding:2px var(--s1);font-size:12px;font-weight:700}
.product-card__body{padding:var(--s2)}
.product-card__brand{font-size:12px;color:var(--muted);font-weight:600}
.product-card h3{font-size:15px;line-height:1.5;height:3em;margin:4px 0 var(--s2);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
.product-card h3 a::after{content:'';position:absolute;inset:0;z-index:1}
.product-card__bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s1);flex-wrap:wrap}
.product-card__prices{display:flex;align-items:baseline;gap:var(--s1);flex-wrap:wrap;line-height:1.3}
.product-card__prices strong{font-size:17px;color:var(--brand-navy)}
.product-card__prices del{font-size:12px;color:var(--muted)}
.product-card__stock{font-size:11px;font-weight:700;white-space:nowrap}
.product-card__stock.is-available{color:var(--whatsapp)}
.product-card__stock.is-unavailable{color:var(--brand-orange-text)}
.product-card__wish{position:absolute;top:var(--s1);inset-inline-end:var(--s1);z-index:2;width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--muted)}
.product-card__wish:disabled{cursor:not-allowed;opacity:.7}
.section-banner{max-width:1600px;margin-inline:auto;background:var(--surface-soft);aspect-ratio:1600/450}
.section-banner a,.section-banner picture{display:block;width:100%;height:100%}
.section-banner img{display:block;width:100%;height:100%;object-fit:contain}
.show-all{display:inline-flex;align-items:center;gap:var(--s1);color:var(--brand-orange-text);font-weight:700;white-space:nowrap}
.lang-ar .show-all .i{transform:rotate(180deg)}
@media (min-width:768px){.category-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s3)}.product-shelf{grid-auto-columns:calc((100% - var(--s3)*3) / 4);gap:var(--s3)}}
@media (max-width:640px){.home-section{padding-block:var(--s4)}.section-head h2{font-size:20px}.section-banner{aspect-ratio:1080/620}.product-card__body{padding:var(--s1)}.product-card__prices strong{font-size:14px}.category-card__name{font-size:14px}}
@media (prefers-reduced-motion:reduce){.marquee,.features__track{animation:none;width:auto;max-width:100%;overflow-x:auto}.marquee__group[aria-hidden],.features__group[aria-hidden]{display:none}.product-shelf{scroll-behavior:auto}}

/* Editorial storefront refresh. Existing brand tokens remain the single colour source. */
:root{--header-h:68px;--radius:8px;--ink:#172035;--muted:#657082;--line:#EAEDF1;--surface-soft:#F7F8FA;--shadow-1:0 12px 36px rgba(15,26,61,.09)}
.announce{height:30px;line-height:30px;font-size:12px;background:var(--brand-navy)}
.site-header{box-shadow:0 2px 16px rgba(15,26,61,.035)}
.header__row{gap:var(--s2)}
.header__logo img{height:52px}
.nav__list{gap:4px}
.nav__link{font-size:13px;font-weight:400}
.nav__caret{width:17px}
.header__actions{gap:0}
.header__signin{font-size:13px;padding-inline:var(--s1);margin-inline:0}
.icon-btn{width:40px;height:40px}
.lang-switch{font-size:12px;height:34px;border-radius:6px}
.hero{max-width:1920px;margin-inline:auto;background:var(--surface-soft)}
.hero--editorial{aspect-ratio:1920/700;overflow:hidden}
.hero--editorial picture,.hero--editorial img{display:block;width:100%;height:100%}
.hero--editorial img{object-fit:cover}
.hero__slides{max-height:none}
.hero__controls button{border:0;box-shadow:var(--shadow-1)}
.brand-strip{padding-block:var(--s2);border:0}
.marquee__group>a,.marquee__group>span{height:64px;color:var(--muted);font-size:14px}
.marquee__group img{max-height:42px;filter:grayscale(1);opacity:.8;transition:filter .2s,opacity .2s}
.marquee__group a:hover img{filter:none;opacity:1}
.features{padding-block:10px;background:var(--brand-navy);color:var(--on-dark)}
.features__group span{font-size:13px;font-weight:500;letter-spacing:.02em}
.features__group span+span::before{color:var(--brand-orange)}
.home-section{padding-block:var(--s6)}
.home-section--dynamic{padding-block:var(--s4) var(--s6)}
.section-head{margin-bottom:var(--s3);padding-bottom:var(--s1);border-bottom:1px solid var(--line)}
.section-head h2{font-size:clamp(22px,2vw,28px);font-weight:700;color:var(--ink)}
.category-grid{gap:var(--s3)}
.category-card__image{background:var(--surface-soft);border:0;border-radius:4px}
.category-card__image img{object-fit:cover}
.category-card__letter{font-family:var(--font-menu);font-size:clamp(44px,8vw,96px);font-weight:400;color:var(--brand-navy);opacity:.22;line-height:1}
.category-card:hover .category-card__image{box-shadow:var(--shadow-1)}
.category-card__name{margin-top:12px;font-size:16px;color:var(--ink)}
.product-shelf{scrollbar-width:none;padding-block:3px var(--s1)}
.product-shelf::-webkit-scrollbar{display:none}
.product-card{border:0;border-radius:4px}
.product-card:hover{box-shadow:var(--shadow-1);transform:none}
.product-card__image{background:var(--surface-soft)}
.product-card__image img{object-fit:contain;mix-blend-mode:multiply}
.product-card__body{padding:var(--s2) 4px var(--s2)}
.product-card__brand{font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.product-card h3{font-weight:600;margin:6px 0 var(--s1)}
.product-card__prices strong{font-size:16px;color:var(--ink)}
.product-card__wish{border:0;box-shadow:var(--shadow-1)}
.media-empty{background:var(--surface-soft)}
.media-empty .i{width:72px;height:72px;color:var(--brand-navy);opacity:.18}
.section-banner img{object-fit:cover}
.show-all{color:var(--brand-navy);font-size:14px}
.show-all:hover{color:var(--brand-orange-text)}
.site-footer{background:var(--brand-navy-deep);margin-top:var(--s6)}
.footer__bar{background:var(--brand-navy)}
@media (min-width:1024px){.product-shelf{grid-auto-columns:calc((100% - var(--s3)*4) / 5)}.header__row{gap:var(--s2)}}
@media (max-width:640px){.hero--editorial{aspect-ratio:4/5}.hero__slide img{object-fit:cover}.brand-strip{padding-block:var(--s1)}.marquee__group>a,.marquee__group>span{width:132px;height:56px}.home-section{padding-block:var(--s4)}.category-grid{gap:var(--s2)}.category-card__name{font-size:14px}.section-head{margin-bottom:var(--s2)}.section-head h2{font-size:20px}.product-card__body{padding:var(--s1) 2px}.product-card h3{font-size:13px}.product-card__prices strong{font-size:14px}}