/* NANU Market by AdeptDEV — Stage 2.2 SAFE PREMIUM HEADER
   Brand palette is preserved: orange #EC6608, text #373636, white. */
:root{
  --nanu-orange:#EC6608;
  --nanu-orange-hover:#d85b05;
  --nanu-orange-soft:#fff5ee;
  --nanu-text:#373636;
  --nanu-muted:#8d929a;
  --nanu-line:#e8e8ea;
  --nanu-soft:#f7f7f8;
  --nanu-white:#fff;
  --nanu-radius:14px;
  --nanu-shadow:0 12px 32px rgba(32,32,36,.08);
}

/* Never recolor the site globally. */
body{background:#fff!important;color:var(--nanu-text)!important}
header{position:relative;z-index:90;background:#fff!important;border-bottom:1px solid var(--nanu-line)!important;box-shadow:none!important}
header.nm-scrolled{position:sticky;top:0;box-shadow:0 8px 28px rgba(20,20,24,.07)!important}

/* ---------- TOP ROW ---------- */
header .header-top{background:#fff!important;border:0!important}
header .header-top>.container{padding-top:0!important;padding-bottom:0!important}
header .header-flex{
  min-height:86px!important;
  display:grid!important;
  grid-template-columns:170px minmax(0,1fr)!important;
  align-items:center!important;
  column-gap:34px!important;
  width:100%!important;
}
header .header-flex>.logo{width:170px!important;min-width:0!important;display:flex!important;align-items:center!important;margin:0!important;padding:0!important}
header .header-flex>.logo a{display:flex!important;align-items:center!important;max-width:100%!important}
header .header-flex>.logo img{display:block!important;max-width:150px!important;max-height:48px!important;width:auto!important;height:auto!important}

header .header-flex>.else{
  min-width:0!important;
  width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:28px!important;
  margin:0!important;
}
header .header-flex>.else>ul{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:22px!important;
  margin:0!important;
  padding:0!important;
  list-style:none!important;
  white-space:nowrap!important;
}
header .header-flex>.else>ul>li{position:relative!important;margin:0!important;padding:0!important;flex:0 0 auto!important}
header .header-flex>.else>ul>li>a{
  display:inline-flex!important;
  align-items:center!important;
  min-height:38px!important;
  color:var(--nanu-text)!important;
  font-size:14px!important;
  font-weight:600!important;
  line-height:1!important;
  text-decoration:none!important;
  transition:color .18s ease!important;
}
header .header-flex>.else>ul>li>a:hover{color:var(--nanu-orange)!important}
header .header-flex>.else>ul>li>button{
  width:20px!important;height:38px!important;margin-left:2px!important;padding:0!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  vertical-align:middle!important;background:transparent!important;border:0!important;box-shadow:none!important
}
header .header-flex>.else>ul>li>button svg{width:16px!important;height:16px!important;transform:rotate(180deg)!important;transition:transform .18s ease!important}

/* Desktop dropdowns: isolated layer, no layout shifts. */
.header-flex ul>li.with.first ul,
.header-flex ul>li.with.second ul,
.header-flex ul>li.with.third ul{
  top:calc(100% + 8px)!important;left:0!important;z-index:120!important;
  min-width:210px!important;padding:8px!important;
  border:1px solid var(--nanu-line)!important;border-radius:14px!important;
  background:#fff!important;box-shadow:var(--nanu-shadow)!important;
  transform:translateY(6px)!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;
  transition:opacity .16s ease,visibility .16s ease,transform .16s ease!important
}
.header-flex ul>li.with.first:hover ul,
.header-flex ul>li.with.second:hover ul,
.header-flex ul>li.with.third:hover ul{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0)!important}
.header-flex ul>li.with.first ul a,
.header-flex ul>li.with.second ul a,
.header-flex ul>li.with.third ul a{padding:10px 12px!important;border-radius:9px!important;color:var(--nanu-text)!important;font-size:13px!important;font-weight:500!important;background:#fff!important}
.header-flex ul>li.with.first ul a:hover,
.header-flex ul>li.with.second ul a:hover,
.header-flex ul>li.with.third ul a:hover{color:var(--nanu-orange)!important;background:var(--nanu-orange-soft)!important}

/* Right utility zone: phone + sale + language stay together. */
header .phones{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:12px!important;
  min-width:max-content!important;
  flex-wrap:nowrap!important;
  margin:0!important
}
header .phones .main{display:flex!important;align-items:center!important;gap:3px!important;flex:0 0 auto!important;white-space:nowrap!important}
header .phones .main>a{display:flex!important;align-items:center!important;gap:7px!important;color:#171719!important;font-size:17px!important;font-weight:700!important;white-space:nowrap!important;text-decoration:none!important}
header .phones .main>a svg{width:21px!important;height:21px!important;flex:0 0 21px!important}
header .phones .main>a span{font-weight:500!important}
header .phones .phone-info-toggle{width:24px!important;height:32px!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;border:0!important;background:transparent!important}
header .phones .phone-info-toggle img{width:12px!important;height:12px!important}
header .phones>.sale{
  height:42px!important;padding:0 15px!important;display:inline-flex!important;align-items:center!important;gap:7px!important;
  border-radius:12px!important;background:var(--nanu-orange)!important;color:#fff!important;font-size:13px!important;font-weight:700!important;
  box-shadow:none!important;text-decoration:none!important;transition:transform .18s ease,background .18s ease,box-shadow .18s ease!important
}
header .phones>.sale:hover{background:var(--nanu-orange-hover)!important;transform:translateY(-1px)!important;box-shadow:0 8px 22px rgba(236,102,8,.18)!important}
header .phones>.sale svg{width:20px!important;height:20px!important}

/* language widget must not expand unpredictably */
header .phones>form,header .phones>.language,header .phones>[class*="language"]{flex:0 0 auto!important;white-space:nowrap!important}

/* ---------- COMMERCE ROW ---------- */
header>.container{padding-top:14px!important;padding-bottom:14px!important}
header .menu-flex{
  position:relative!important;
  width:100%!important;
  min-height:58px!important;
  display:grid!important;
  grid-template-columns:210px minmax(280px,1fr) auto!important;
  align-items:center!important;
  gap:16px!important;
  margin:0!important;padding:0!important
}

/* Keep NANU orange. */
header .menu-triger{
  width:210px!important;min-width:210px!important;height:54px!important;margin:0!important;padding:0 18px!important;
  display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;
  border:1px solid var(--nanu-orange)!important;border-radius:14px!important;background:var(--nanu-orange)!important;color:#fff!important;
  box-shadow:none!important;font-size:14px!important;font-weight:700!important;line-height:1.25!important;text-align:left!important;
  transition:transform .18s ease,background .18s ease,box-shadow .18s ease!important
}
header .menu-triger:hover{background:var(--nanu-orange-hover)!important;border-color:var(--nanu-orange-hover)!important;transform:translateY(-1px)!important;box-shadow:0 9px 24px rgba(236,102,8,.18)!important}
header .menu-triger svg{width:22px!important;height:22px!important;flex:0 0 22px!important}

/* Search uses original white/orange visual language. */
#adeptdevAjaxSearch{position:relative!important;width:100%!important;min-width:0!important;margin:0!important}
#adeptdevAjaxSearch>#search,#adeptdevAjaxSearch>.search,#adeptdevAjaxSearch>form{width:100%!important;margin:0!important}
#adeptdevAjaxSearch .input-group{
  position:relative!important;width:100%!important;height:54px!important;display:flex!important;align-items:center!important;
  border:1px solid #dedfe2!important;border-radius:14px!important;background:#fff!important;overflow:hidden!important;
  box-shadow:none!important;transition:border-color .18s ease,box-shadow .18s ease!important
}
#adeptdevAjaxSearch .input-group:focus-within{border-color:var(--nanu-orange)!important;box-shadow:0 0 0 3px rgba(236,102,8,.08)!important}
#adeptdevAjaxSearch input[name="search"],#adeptdevAjaxSearch input[type="search"],#adeptdevAjaxSearch input[type="text"]{
  width:100%!important;height:52px!important;min-height:52px!important;padding:0 62px 0 18px!important;
  border:0!important;outline:0!important;background:#fff!important;color:var(--nanu-text)!important;box-shadow:none!important;
  font-size:14px!important;font-weight:400!important
}
#adeptdevAjaxSearch input::placeholder{color:#9a9da3!important;opacity:1!important}
#adeptdevAjaxSearch button{
  position:absolute!important;right:5px!important;top:5px!important;width:44px!important;height:42px!important;min-width:44px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;
  border:0!important;border-radius:11px!important;background:var(--nanu-orange)!important;color:#fff!important;box-shadow:none!important;
  transition:background .18s ease,transform .18s ease!important
}
#adeptdevAjaxSearch button:hover{background:var(--nanu-orange-hover)!important;transform:scale(1.03)!important}

/* Action icons: same brand, same size, no random recoloring. */
header .something{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:0!important;min-width:max-content!important;margin:0!important}
header .something>.btns{display:flex!important;align-items:center!important;gap:8px!important;margin:0!important}
header .something .btns>button,header .something .btns>a{
  position:relative!important;width:48px!important;min-width:48px!important;height:48px!important;min-height:48px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;margin:0!important;padding:0!important;
  border:1px solid #e2e3e6!important;border-radius:13px!important;background:#fff!important;color:var(--nanu-text)!important;box-shadow:none!important;
  transition:border-color .18s ease,background .18s ease,transform .18s ease!important
}
header .something .btns>button:hover,header .something .btns>a:hover{border-color:#f0b48b!important;background:var(--nanu-orange-soft)!important;transform:translateY(-1px)!important}
header .something .btns svg{width:22px!important;height:22px!important}

/* Hide the extra language copy in second row on desktop; language already exists in top utilities. */
@media (min-width:768px){header .menu-flex>.something>*:not(.btns){display:none!important}}

/* -------- Responsive safety: no overlaps at laptop widths -------- */
@media (max-width:1399px) and (min-width:1100px){
  header .header-flex{grid-template-columns:150px minmax(0,1fr)!important;column-gap:22px!important}
  header .header-flex>.logo{width:150px!important}
  header .header-flex>.logo img{max-width:130px!important}
  header .header-flex>.else{gap:18px!important}
  header .header-flex>.else>ul{gap:15px!important}
  header .header-flex>.else>ul>li>a{font-size:13px!important}
  header .phones{gap:9px!important}
  header .phones .main>a{font-size:15px!important}
  header .phones>.sale{height:40px!important;padding:0 12px!important}
  header .menu-flex{grid-template-columns:190px minmax(260px,1fr) auto!important;gap:12px!important}
  header .menu-triger{width:190px!important;min-width:190px!important}
  header .something>.btns{gap:6px!important}
  header .something .btns>button,header .something .btns>a{width:46px!important;min-width:46px!important;height:46px!important;min-height:46px!important}
}

@media (max-width:1199px) and (min-width:768px){
  /* Keep useful links, remove least critical ones before they can collide. */
  header .header-flex>.else>ul>li:nth-last-child(-n+2){display:none!important}
  header .header-flex>.else>ul{gap:12px!important}
  header .phones .main>a{font-size:14px!important}
}

/* Mobile: do not fight existing NANU mobile markup. */
@media (max-width:767px){
  header .header-top{display:none!important}
  header>.container{padding-top:10px!important;padding-bottom:10px!important}
  header .menu-flex{display:flex!important;flex-wrap:wrap!important;gap:10px!important;min-height:0!important}
  header .mobile-menu-trigger{display:flex!important;align-items:center!important;justify-content:center!important;width:42px!important;height:42px!important;border:1px solid var(--nanu-line)!important;border-radius:12px!important;background:#fff!important}
  header .mobile-logo{display:flex!important;align-items:center!important;flex:1 1 auto!important;min-width:0!important}
  header .mobile-logo img{max-height:40px!important;width:auto!important}
  header .menu-triger{display:none!important}
  #adeptdevAjaxSearch{order:20!important;flex:0 0 100%!important;width:100%!important}
  #adeptdevAjaxSearch .input-group{height:50px!important}
  #adeptdevAjaxSearch input[name="search"],#adeptdevAjaxSearch input[type="search"],#adeptdevAjaxSearch input[type="text"]{height:48px!important;min-height:48px!important}
  #adeptdevAjaxSearch button{height:38px!important;width:40px!important;min-width:40px!important}
  header .something{order:10!important;margin-left:auto!important;min-width:0!important}
  header .something .btns>button,header .something .btns>a{width:40px!important;min-width:40px!important;height:40px!important;min-height:40px!important;border-radius:11px!important}
}

/* Catalog itself: improve interaction but preserve NANU colors/content. */
.category-list-menu{z-index:85!important;background:#fff!important}
.category-list-menu .menu-but>ul>li>a{transition:background .15s ease,color .15s ease,transform .15s ease!important}
.category-list-menu .menu-but>ul>li>a:hover,
.category-list-menu .menu-but>ul>li.nm-active>a{background:var(--nanu-orange-soft)!important;color:var(--nanu-orange)!important;transform:translateX(2px)!important}

@media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}