/* NANU Market — Header Unified V3
   Loaded LAST on purpose. One warm palette, no hard separator stripes. */
:root{
  --nu-bg:#f7f2ee;
  --nu-head:#fff8f3;
  --nu-head-2:#fff5ee;
  --nu-surface:rgba(255,252,249,.88);
  --nu-line:rgba(236,102,8,.075);
  --nu-shadow:0 12px 34px rgba(75,44,20,.045);
  --nu-orange:#ec6608;
  --nu-orange-2:#df5b00;
  --nu-ink:#231f20;
}

html,
body{
  border:0!important;
  border-top:0!important;
  background:linear-gradient(180deg,#f8f3ef 0%,#f5f0ec 38%,#f8f5f2 100%)!important;
}

/* One continuous header surface */
header{
  position:relative!important;
  margin:0 0 14px!important;
  padding:0 0 10px!important;
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  background:linear-gradient(180deg,var(--nu-head) 0%,var(--nu-head-2) 100%)!important;
  box-shadow:0 16px 42px rgba(71,43,22,.035)!important;
  overflow:visible!important;
}
header:before,
header:after{
  content:none!important;
  display:none!important;
}

/* Work status bar becomes part of the same surface */
header .nanu-workbar{
  background:transparent!important;
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
}
header .nanu-workbar__inner{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
header .nanu-workbar__cluster{
  background:rgba(255,255,255,.44)!important;
  border:1px solid rgba(236,102,8,.055)!important;
  box-shadow:0 7px 20px rgba(73,43,20,.025)!important;
}
header .nanu-workbar__divider{
  opacity:.35!important;
}

/* Main logo/navigation row: no separate stripe */
header .header-top{
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
}
header .header-top>.container,
header .header-top .container{
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
header .header-flex{
  position:relative!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
header .header-flex:before,
header .header-flex:after{
  content:none!important;
  display:none!important;
}

/* Navigation pills stay premium but melt into the palette */
header .nanu-main-nav>ul{
  background:rgba(255,255,255,.20)!important;
  border-color:rgba(236,102,8,.045)!important;
  box-shadow:none!important;
}
header .nanu-main-nav>ul>li{
  background:rgba(255,255,255,.50)!important;
  border-color:rgba(236,102,8,.055)!important;
  box-shadow:0 6px 18px rgba(65,39,20,.025)!important;
}
header .phones.nanu-top-actions .main,
header form.langlang{
  background:rgba(255,255,255,.52)!important;
  border-color:rgba(236,102,8,.055)!important;
  box-shadow:0 7px 20px rgba(65,39,20,.028)!important;
}
header .phone-info-toggle{
  background:rgba(255,248,242,.86)!important;
  border:1px solid rgba(236,102,8,.08)!important;
  box-shadow:none!important;
}

/* Search/catalog row: same background as the row above */
header>.container{
  background:transparent!important;
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
header .menu-flex{
  position:relative!important;
  margin:0!important;
  padding-top:10px!important;
  padding-bottom:12px!important;
  background:transparent!important;
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
}
header .menu-flex:before,
header .menu-flex:after{
  content:none!important;
  display:none!important;
}

header #search input,
header .search input,
header input[name='search'],
header .something .btns{
  background:linear-gradient(180deg,rgba(255,253,251,.96) 0%,rgba(255,249,245,.94) 100%)!important;
  border:1px solid rgba(236,102,8,.07)!important;
  box-shadow:var(--nu-shadow)!important;
}
header #search input:focus,
header .search input:focus,
header input[name='search']:focus{
  background:#fff!important;
  border-color:rgba(236,102,8,.20)!important;
  box-shadow:0 0 0 4px rgba(236,102,8,.055),0 12px 30px rgba(75,44,20,.045)!important;
}

/* Keep brand orange as the only strong header accent */
header .menu-triger,
header a.sale,
header #search button,
header .search button{
  background:linear-gradient(135deg,var(--nu-orange) 0%,var(--nu-orange-2) 100%)!important;
}
header .menu-triger{box-shadow:0 12px 27px rgba(236,102,8,.17)!important;}
header a.sale{box-shadow:0 11px 25px rgba(236,102,8,.18)!important;}
header #search button,
header .search button{box-shadow:0 8px 20px rgba(236,102,8,.16)!important;}

/* Smooth transition from header into home content / hero */
#common-home,
body.common-home,
body[class*='common-home']{
  background:transparent!important;
}
#common-home .container:first-child,
.slideshow,
.slideshow.swiper-container{
  border-top:0!important;
}
.slideshow{
  margin-top:4px!important;
}
.slideshow .swiper-container,
.slideshow-item{
  border-color:rgba(236,102,8,.045)!important;
  box-shadow:0 16px 38px rgba(65,39,20,.055)!important;
}

/* Remove accidental horizontal rules around the first screen */
header + *,
header + main,
header + #common-home{
  border-top:0!important;
}

@media(max-width:767px){
  header{margin-bottom:10px!important;padding-bottom:6px!important;}
  header .header-top{padding:8px 0!important;}
  header .menu-flex{padding-top:6px!important;padding-bottom:10px!important;}
  header .nanu-workbar__cluster{border-radius:13px!important;}
}


/* === Glass Sticky Search Row Hotfix === */
header .menu-flex{
  position:sticky!important;
  top:8px!important;
  z-index:120!important;
  margin:6px 0 0!important;
  padding:12px!important;
  border-radius:28px!important;
  background:rgba(255,248,241,.56)!important;
  border:1px solid rgba(236,102,8,.09)!important;
  box-shadow:0 18px 42px rgba(73,43,20,.08)!important;
  backdrop-filter:blur(16px) saturate(118%)!important;
  -webkit-backdrop-filter:blur(16px) saturate(118%)!important;
}
header .menu-flex:before,
header .menu-flex:after{
  content:none!important;
  display:none!important;
}
header .menu-triger,
header #search input,
header .search input,
header input[name='search'],
header .something .btns{
  backdrop-filter:blur(10px) saturate(115%)!important;
  -webkit-backdrop-filter:blur(10px) saturate(115%)!important;
}
header #search input,
header .search input,
header input[name='search']{
  background:rgba(255,255,255,.72)!important;
  border:1px solid rgba(236,102,8,.08)!important;
  box-shadow:0 10px 26px rgba(65,39,20,.05)!important;
}
header .something .btns{
  background:rgba(255,255,255,.68)!important;
  border:1px solid rgba(236,102,8,.08)!important;
  box-shadow:0 10px 26px rgba(65,39,20,.05)!important;
}
header .menu-triger{
  box-shadow:0 12px 28px rgba(236,102,8,.18)!important;
}
header .menu-flex.is-stuck,
header .menu-flex:hover{
  background:rgba(255,248,241,.68)!important;
}
/* keep hero close but not glued */
.slideshow{margin-top:10px!important;}

@media(max-width:991px){
  header .menu-flex{
    top:6px!important;
    border-radius:22px!important;
    padding:10px!important;
  }
}
@media(max-width:767px){
  header .menu-flex{
    top:4px!important;
    border-radius:18px!important;
    padding:8px!important;
  }
  header #search input,
  header .search input,
  header input[name='search'],
  header .something .btns{
    background:rgba(255,255,255,.76)!important;
  }
}


/* === Floating Search Row No-Push Fix === */
header .menu-flex{
  position:relative!important;
  top:auto!important;
}
header .menu-flex.is-floating{
  position:fixed!important;
  top:8px!important;
  left:var(--nmf-left,12px)!important;
  width:var(--nmf-width,calc(100% - 24px))!important;
  margin:0!important;
  z-index:1300!important;
  background:rgba(255,248,241,.72)!important;
  box-shadow:0 20px 42px rgba(73,43,20,.10)!important;
}
header .menu-flex.is-floating,
header .menu-flex:hover{
  background:rgba(255,248,241,.72)!important;
}
header .menu-flex.is-floating + *{
  margin-top:0!important;
}
.slideshow{margin-top:6px!important;}
@media(max-width:991px){
  header .menu-flex.is-floating{
    top:6px!important;
  }
}
@media(max-width:767px){
  header .menu-flex.is-floating{
    top:4px!important;
    left:10px!important;
    width:calc(100% - 20px)!important;
    border-radius:18px!important;
  }
}


/* === Centered Floating Search Row Final Fix === */
header>.container.has-floating-row{
  padding-top:calc(var(--nmf-row-h, 0px) + 8px)!important;
}
header .menu-flex.is-floating{
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(calc(100vw - 24px), 1328px)!important;
  max-width:1328px!important;
}
@media(max-width:767px){
  header>.container.has-floating-row{
    padding-top:calc(var(--nmf-row-h, 0px) + 6px)!important;
  }
  header .menu-flex.is-floating{
    left:50%!important;
    transform:translateX(-50%)!important;
    width:calc(100vw - 20px)!important;
    max-width:none!important;
  }
}


/* === TRUE NO-LAYOUT-SHIFT FIX ===
   Disable legacy theme sticky that adds body padding-top:200px and fixes whole header.
   Only our search/catalog row is allowed to float. */
body.scrolled{
  padding-top:0!important;
}
body.scrolled header{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  width:auto!important;
  z-index:50!important;
  box-shadow:0 16px 42px rgba(71,43,22,.035)!important;
  background:linear-gradient(180deg,var(--nu-head) 0%,var(--nu-head-2) 100%)!important;
}
body.scrolled header .header-top{
  display:block!important;
}
body.scrolled header .menu-flex{
  margin:6px 0 0!important;
}
/* old host padding compensation was the second source of the downward kick */
header>.container.has-floating-row{
  padding-top:0!important;
}
.nanu-menu-flex-spacer{
  display:block!important;
  width:100%!important;
  height:0;
  margin:0!important;
  padding:0!important;
  border:0!important;
  pointer-events:none!important;
  visibility:hidden!important;
}
.nanu-menu-flex-spacer.is-active{
  height:var(--nmf-spacer-h,0px)!important;
}
header .menu-flex.is-floating{
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(calc(100vw - 24px),1328px)!important;
  max-width:1328px!important;
  margin:0!important;
  top:8px!important;
  position:fixed!important;
  z-index:1300!important;
}
@media(max-width:991px){
  body.scrolled{padding-top:0!important;}
}
@media(max-width:767px){
  body.scrolled{padding-top:0!important;}
  header>.container.has-floating-row{padding-top:0!important;}
  header .menu-flex.is-floating{
    width:calc(100vw - 20px)!important;
    max-width:none!important;
    top:4px!important;
  }
}


/* === ZERO-SHIFT V2: permanent flow reservation ===
   The host reserves the menu row height from page load. Nothing is added/removed on scroll. */
header>.container.nanu-floating-host{
  min-height:var(--nmf-host-h,0px)!important;
  position:relative!important;
}
.nanu-menu-flex-spacer{
  display:none!important;
  height:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
}
header>.container.has-floating-row{
  padding-top:0!important;
}
header .menu-flex{
  top:auto!important;
}
header .menu-flex.is-floating{
  position:fixed!important;
  top:8px!important;
  left:50%!important;
  transform:translate3d(-50%,0,0)!important;
  width:min(calc(100vw - 24px),1328px)!important;
  max-width:1328px!important;
  margin:0!important;
  z-index:1300!important;
  will-change:transform!important;
}
/* legacy scroll mode must never change document geometry */
body.scrolled,
body.scrolled header,
body.scrolled header>.container,
body.scrolled header .header-top,
body.scrolled header .menu-flex{
  transition-property:background,box-shadow,border-color,opacity!important;
}
body.scrolled{padding-top:0!important;}
body.scrolled header{position:relative!important;top:auto!important;}
body.scrolled header .header-top{display:block!important;}
@media(max-width:767px){
  header .menu-flex.is-floating{
    top:4px!important;
    width:calc(100vw - 20px)!important;
    max-width:none!important;
  }
}