/* ===== NABIISH — Motion layer (Malak) ===== */
:root{--nb-dark:#003337;--nb-teal:#3f8c90;--nb-main:#65b2b6;--nb-light:#8bd8dc;--nb-ease:cubic-bezier(.2,.8,.2,1)}
html{scroll-behavior:smooth}
::selection{background:var(--nb-light);color:var(--nb-dark)}

/* 1) Top scroll progress bar */
@supports (animation-timeline: scroll()){
  body::after{content:"";position:fixed;top:0;right:0;left:0;height:4px;z-index:99999;pointer-events:none;
    background:linear-gradient(90deg,var(--nb-light),var(--nb-main),var(--nb-dark));
    transform-origin:100% 50%;transform:scaleX(0);animation:nbProg linear both;animation-timeline:scroll(root)}
  @keyframes nbProg{to{transform:scaleX(1)}}
}

/* 2) Sections reveal while scrolling */
@supports (animation-timeline: view()){
  .nb-products,.nb-wide,.nb-tiles,
  main section:not(.nb-hero){animation:nbReveal linear both;animation-timeline:view();animation-range:entry 0% cover 20%}
  @keyframes nbReveal{from{opacity:0;transform:translateY(70px) scale(.96);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
  /* product cards stagger-in */
  .nb-products .swiper-slide, .nb-products .s-product-card-entry{animation:nbCard linear both;animation-timeline:view();animation-range:entry 5% cover 25%}
  @keyframes nbCard{from{opacity:0;transform:translateY(40px) rotate(-2deg)}to{opacity:1;transform:none}}
}

/* 3) Hero: Ken Burns + glow */
.nb-hero .swiper-slide img{transform-origin:30% 50%}
.nb-hero .swiper-slide-active img{animation:nbKen 8s var(--nb-ease) both}
@keyframes nbKen{from{transform:scale(1.1)}to{transform:scale(1)}}
.nb-hero .swiper-pagination-bullet-active{background:var(--nb-light)!important;width:28px!important;border-radius:8px!important;transition:width .4s var(--nb-ease)}

/* 4) Category tiles: float + playful hover */
.nb-tiles img{border-radius:28px;transition:transform .5s var(--nb-ease),box-shadow .5s}
.nb-tiles .swiper-slide:nth-child(odd) img{animation:nbFloat 4.5s ease-in-out infinite}
.nb-tiles .swiper-slide:nth-child(even) img{animation:nbFloat 4.5s ease-in-out -2.2s infinite}
@keyframes nbFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.nb-tiles a:hover img{animation-play-state:paused;transform:translateY(-6px) scale(1.06) rotate(-3deg);box-shadow:0 18px 40px -14px rgba(0,51,55,.55)}

/* 5) Product cards: lift, image zoom, shine */
.s-product-card-entry{transition:transform .45s var(--nb-ease),box-shadow .45s var(--nb-ease);will-change:transform}
.s-product-card-entry:hover{transform:translateY(-10px);box-shadow:0 22px 44px -18px rgba(0,51,55,.45)}
.s-product-card-image{overflow:hidden;position:relative}
.s-product-card-image img{transition:transform .8s var(--nb-ease)}
.s-product-card-entry:hover .s-product-card-image img{transform:scale(1.09)}
.s-product-card-image::after{content:"";position:absolute;top:0;bottom:0;width:45%;left:-60%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg)}
.s-product-card-entry:hover .s-product-card-image::after{animation:nbShine .9s var(--nb-ease)}
@keyframes nbShine{to{left:130%}}

/* 6) Buttons: shimmer + press */
.s-button-element,.s-button-btn,.btn{transition:transform .25s var(--nb-ease),box-shadow .25s}
.s-button-element:hover,.s-button-btn:hover,.btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(0,51,55,.6)}
.s-button-element:active,.s-button-btn:active,.btn:active{transform:scale(.96)}
.s-add-product-button-main .s-button-element, .s-product-card-entry .s-button-primary{position:relative;overflow:hidden}
.s-add-product-button-main .s-button-element::before, .s-product-card-entry .s-button-primary::before{content:"";position:absolute;inset:0;
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);background-size:250% 100%;animation:nbShimmer 3.2s linear infinite;pointer-events:none}
@keyframes nbShimmer{from{background-position:130% 0}to{background-position:-130% 0}}

/* 7) Section titles: animated underline */
.s-block__title h2,.s-block__title,.section-title h2{position:relative}
.s-block__title h2::after,.section-title h2::after{content:"";display:block;height:4px;width:56px;margin-top:8px;border-radius:4px;
  background:linear-gradient(90deg,var(--nb-light),var(--nb-dark));background-size:200% 100%;animation:nbBar 3s ease-in-out infinite}
@keyframes nbBar{0%,100%{background-position:0 0;width:56px}50%{background-position:100% 0;width:96px}}

/* 8) Wide banners: soft zoom on hover */
.nb-wide img{border-radius:24px;transition:transform 1s var(--nb-ease)}
.nb-wide a:hover img,.nb-wide:hover img{transform:scale(1.025)}

/* 9) Floating WhatsApp button pulse */
a[href*="wa.me"]:not(:has(img)),a[href*="whatsapp"]:not(:has(img)){animation:nbPulse 2.4s ease-out infinite}
@keyframes nbPulse{0%{box-shadow:0 0 0 0 rgba(101,178,182,.6)}80%,100%{box-shadow:0 0 0 18px rgba(101,178,182,0)}}

/* 10) Logo wiggle */
header a img[alt*="logo" i]:hover,.navbar-brand img:hover{animation:nbWiggle .6s ease-in-out}
@keyframes nbWiggle{25%{transform:rotate(-6deg)}75%{transform:rotate(6deg)}}

/* Accessibility */
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* 11) Product page: hide empty reviews block (removes blank gap) */
form.product-form > .product-reviews:not(:has(salla-reviews-summary *, salla-comment-form *, .s-comments-header *, salla-comment-item, [class*="comment-item"], textarea)){display:none}

/* 12) WhatsApp floating button: smaller, tucked to the corner */
#wa-angel{zoom:.8;opacity:.92;transition:opacity .2s}
#wa-angel:hover{opacity:1}

/* ===== 13) NABIISH brand colors (instead of plain white) ===== */
/* page ground: light brand teal, same as product photo background */
body, .app-inner{background-color:#F1F6F6 !important}
/* header stays crisp white */
.store-header .header-inner{background-color:#ffffff !important}
/* brands strip: soft brand tint */
.s-block--logos-slider.bg-gray-100{background-color:#E3EFEF !important}
/* dark brand sections: numbers + why nabiish */
.s-block--features.angel-features.bg-gray-100{background-color:#08363b !important}
.angel-features h2, .angel-features p, .angel-features span{color:#ffffff !important}
.angel-features .text-gray-600, .angel-features h2 + p{color:#B9DCDD !important}
.angel-features img, .angel-features i{filter:none}
/* FAQ items: white cards on the tinted ground */
.s-block--faqs .faqs-list__item{background-color:#ffffff !important;border:1px solid #D5E3E3}
/* prices + accents */
.s-product-card-price, .s-product-card-sale-price h4{color:#1F5F63}.angel-features{-webkit-mask-image:none !important;mask-image:none !important}
.angel-features h2::after{background:linear-gradient(90deg,#65B2B6,#B9DCDD) !important}

/* 14) Side menu: brand line icons for main categories */
nav.mobile-menu .main-menu > li > a.sidemenu-link::before{content:"";flex:0 0 24px;width:24px;height:24px;margin-inline-end:12px;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%224%22%20y%3D%224%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22%2F%3E%3Crect%20x%3D%2213%22%20y%3D%224%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22%2F%3E%3Crect%20x%3D%224%22%20y%3D%2213%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22%2F%3E%3Crect%20x%3D%2213%22%20y%3D%2213%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1581445284"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%2017h14M6%2017l1.5-5h9L18%2017%22%2F%3E%3Cpath%20d%3D%22M4%2017v2M20%2017v2%22%2F%3E%3Ccircle%20cx%3D%227.5%22%20cy%3D%2217%22%20r%3D%221.5%22%2F%3E%3Ccircle%20cx%3D%2216.5%22%20cy%3D%2217%22%20r%3D%221.5%22%2F%3E%3Crect%20x%3D%229%22%20y%3D%223%22%20width%3D%226%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1113618532"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l8%204.5v9L12%2021l-8-4.5v-9z%22%2F%3E%3Cpath%20d%3D%22M12%2012l8-4.5M12%2012v9M12%2012L4%207.5%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1280924406"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%227%22%20width%3D%2213%22%20height%3D%2210%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M16%2011l5-3v8l-5-3%22%2F%3E%3Ccircle%20cx%3D%229.5%22%20cy%3D%2212%22%20r%3D%222.5%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1920744437"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222.5%22%2F%3E%3Cpath%20d%3D%22M12%2014.5V21M9.6%2011.3L3.5%209.5M14.4%2011.3l6.1-1.8%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1354910693"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%202v5M15%202v5%22%2F%3E%3Cpath%20d%3D%22M7%207h10v4a5%205%200%200%201-10%200z%22%2F%3E%3Cpath%20d%3D%22M12%2016v6%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1185554521"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%2018h6M10%2021h4%22%2F%3E%3Cpath%20d%3D%22M12%203a6%206%200%200%200-3.5%2010.9c.6.5%201%201.2%201%202.1h5c0-.9.4-1.6%201-2.1A6%206%200%200%200%2012%203z%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1214965394"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l8%203v6c0%204.5-3.4%208.3-8%209-4.6-.7-8-4.5-8-9V6z%22%2F%3E%3Cpath%20d%3D%22M9%2012l2%202%204-4%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1030771438"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2014v-2a8%208%200%200%201%2016%200v2%22%2F%3E%3Crect%20x%3D%223%22%20y%3D%2214%22%20width%3D%224%22%20height%3D%226%22%20rx%3D%221.5%22%2F%3E%3Crect%20x%3D%2217%22%20y%3D%2214%22%20width%3D%224%22%20height%3D%226%22%20rx%3D%221.5%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c975225916"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%228%22%20y%3D%222%22%20width%3D%228%22%20height%3D%2214%22%20rx%3D%221.5%22%2F%3E%3Cpath%20d%3D%22M12%2016v3M7%2021h10%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c754959827"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%226%22%20y%3D%226%22%20width%3D%2212%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Crect%20x%3D%229.5%22%20y%3D%229.5%22%20width%3D%225%22%20height%3D%225%22%2F%3E%3Cpath%20d%3D%22M9%202v3M15%202v3M9%2019v3M15%2019v3M2%209h3M2%2015h3M19%209h3M19%2015h3%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1236533777"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%226%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2213%22%20r%3D%223.5%22%2F%3E%3Cpath%20d%3D%22M8%206l1.5-2h5L16%206%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1154954929"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%224%22%20y%3D%227%22%20width%3D%2216%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M9%207V4h6v3M4%2012h16%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href$="c1816795415"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%208h14l-1%2012H6z%22%2F%3E%3Cpath%20d%3D%22M9%208V6a3%203%200%200%201%206%200v2%22%2F%3E%3C%2Fsvg%3E")}
nav.mobile-menu .main-menu > li > a.sidemenu-link[href*="brands"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2012V4h8l10%2010-8%208z%22%2F%3E%3Ccircle%20cx%3D%227.5%22%20cy%3D%228.5%22%20r%3D%221.5%22%2F%3E%3C%2Fsvg%3E")}nav.mobile-menu .main-menu > li > a.offers-link .menu-img{display:none !important}
nav.mobile-menu .main-menu > li > a.offers-link::before{content:"";flex:0 0 24px;width:24px;height:24px;margin-inline-end:12px;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365B2B6%22%20stroke-width%3D%222.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20.6%2013.4l-7.2%207.2a2%202%200%200%201-2.8%200L3%2013V3h10l7.6%207.6a2%202%200%200%201%200%202.8z%22%2F%3E%3Ccircle%20cx%3D%227.5%22%20cy%3D%227.5%22%20r%3D%221.5%22%2F%3E%3Cpath%20d%3D%22M15%209l-6%206M9.5%2010h.01M14.5%2014h.01%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}