html { scrollbar-gutter: stable; }

.waveMenu,
.waveMenu *,
.waveMenu *::before,
.waveMenu *::after {
  box-sizing: border-box;
}

.waveMenu{
  position:fixed;
  inset:0;
  z-index:999999;
  pointer-events:none;
  opacity:0;
  visibility:hidden;
}
.waveMenu.is-open,
.waveMenu.is-closing{
  pointer-events:auto;
  opacity:1;
  visibility:visible;
}

.waveMenu__backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.35);
  opacity:0;
  z-index:40;
  will-change:opacity;
}

.waveMenu__panel{
  position:absolute;
  inset:0;
  z-index:50;
  background:transparent;
  overflow:hidden;
  will-change:transform;
  transform:translate3d(-110vw,0,0);
}

.waveMenu__grid{
  width:100%;
  height:100vh;
  display:grid;
  grid-template-columns:380px 1fr;
  overflow:hidden;
  background:#fff;
}

.waveMenu__left{
  background:#fff;
  padding:29px 48px;
  border-right:1px solid #E6E7EB;
  display:flex;
  flex-direction:column;
}
.waveMenu__top{
  display:flex;
  align-items:center;
  gap:18px;
  margin-bottom:34px;
}
.waveMenu__close{
  width:33px;
  height:33px;
  border:0 !important;
  padding:0 !important;
  background:transparent !important;
  border-radius:999px !important;
  display:grid;
  place-items:center;
  cursor:pointer;
  box-shadow:none !important;
  transition:transform .18s ease;
}
.waveMenu__close:hover,
.waveMenu__close:focus,
.waveMenu__close:active{
  background:transparent !important;
  color:inherit !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
.waveMenu__closeImg{ width:33px; height:33px; display:block; }
.waveMenu__logoWrap{ display:flex; align-items:center; }
.waveMenu__logoLink,
.waveMenu__logoLink:hover,
.waveMenu__logoLink:focus,
.waveMenu__logoLink:active{ text-decoration:none !important; }
.waveMenu__logo{ width:110px; max-width:110px; height:24px; object-fit:contain; display:block; }

.waveMenu__menu{ display:flex; flex-direction:column; gap:0; margin-top:6px; }
.waveMenu__item,
.waveMenu__item:hover,
.waveMenu__item:focus,
.waveMenu__item:active{
  font-family:Lato,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif !important;
  font-size:24px !important;
  font-weight:600 !important;
  line-height:1.22 !important;
  color:#000 !important;
  text-decoration:none !important;
  padding:12px 18px;
  border-radius:18px !important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:transparent;
  border:0 !important;
  box-shadow:none !important;
  transition:background .15s ease,color .15s ease;
}
.waveMenu__itemArrow{
  width:18px;
  height:18px;
  opacity:0;
  display:grid;
  place-items:center;
  transform:translateX(-2px);
  transition:opacity .15s ease, transform .15s ease;
}
.waveMenu__itemArrow svg{ width:100%; height:100%; display:block; }
.waveMenu__item:hover{ background:#F3F5F7 !important; }
.waveMenu__item:hover .waveMenu__itemArrow{ opacity:1; transform:translateX(0); }
.waveMenu__item.is-active{
  background:#F9FAFB !important;
  color:#435669 !important;
}
.waveMenu__item.is-active .waveMenu__itemArrow{ opacity:1; transform:translateX(0); }
.waveMenu__item.is-active:hover{ background:#EEF1F4 !important; }

.waveMenu__social{ margin-top:auto; padding-top:28px; }
.waveMenu__socialTitle{
  font-family:Lato,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif !important;
  font-size:16px !important;
  font-weight:600 !important;
  color:#435669 !important;
  margin-bottom:14px;
}
.waveMenu__socialRow{ display:flex; gap:14px; }
.waveMenu__socialBtn,
.waveMenu__socialBtn:hover,
.waveMenu__socialBtn:focus,
.waveMenu__socialBtn:active{
  width:44px;
  height:44px;
  border-radius:999px !important;
  background:#000 !important;
  display:grid;
  place-items:center;
  text-decoration:none !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:none !important;
}
.waveMenu__socialBtn svg{ width:22px; height:22px; display:block; color:#fff; }

.waveMenu__right{
  background:#F9FAFB;
  padding:29px 48px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.waveMenu__railSection + .waveMenu__railSection{
  margin-top:42px;
  padding-top:34px;
  border-top:1px solid rgba(17,17,17,.06);
}
.waveMenu__rightTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:20px;
}
.waveMenu__productsTitle{
  font-family:Anton,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif !important;
  font-size:28px !important;
  font-weight:400 !important;
  line-height:1 !important;
  letter-spacing:0 !important;
  color:#000 !important;
  margin:0;
}
.waveMenu__viewAll,
.waveMenu__viewAll:hover,
.waveMenu__viewAll:focus,
.waveMenu__viewAll:active{
  font-family:Lato,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif !important;
  font-size:12px !important;
  font-weight:600 !important;
  line-height:1 !important;
  padding:10px 18px;
  border-radius:999px !important;
  background:#000 !important;
  color:#fff !important;
  text-decoration:none !important;
  border:1px solid #000 !important;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.waveMenu__viewAll:hover,
.waveMenu__viewAll:focus{
  background:#fff !important;
  color:#000 !important;
}

.waveMenu__railViewport{
  overflow-x:hidden;
  overflow-y:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x pan-y pinch-zoom;
  overscroll-behavior-x:contain;
  overscroll-behavior-y:auto;
  padding-bottom:2px;
}
.waveMenu__railViewport::-webkit-scrollbar{ display:none; }
.waveMenu__rail{
  display:flex;
  gap:26px;
  min-width:0;
  will-change:transform;
}

.waveMenu__card{
  min-width:0;
  flex:0 0 calc((100% - 52px) / 3);
  max-width:calc((100% - 52px) / 3);
  display:flex;
  flex-direction:column;
  gap:16px;
  scroll-snap-align:none;
  scroll-snap-stop:normal;
}
.waveMenu__card.is-snap-anchor{
  scroll-snap-align:start;
  scroll-snap-stop:always;
}
.waveMenu__cardLink,
.waveMenu__cardLink:hover,
.waveMenu__cardLink:focus,
.waveMenu__cardLink:active{
  display:block;
  text-decoration:none !important;
  color:inherit !important;
  box-shadow:none !important;
}
.waveMenu__imgWrap{
  border-radius:24px;
  background:#EFEFEF;
  overflow:hidden;
  aspect-ratio:1/1;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.waveMenu__img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  transition:transform .28s ease, opacity .24s ease;
}
.waveMenu__img.is-swapping{ opacity:.62; transform:scale(1.03); }
.waveMenu__card:hover .waveMenu__img{ transform:scale(1.022); }

.waveMenu__cardBody{
  padding:0 2px;
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:104px;
}
.waveMenu__cardMeta{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.waveMenu__cardTitle,
.waveMenu__cardTitle a,
.waveMenu__cardTitle a:hover,
.waveMenu__cardTitle a:focus,
.waveMenu__cardTitle a:active{
  margin:0;
  color:#111 !important;
  text-decoration:none !important;
  font-family:'Lato',sans-serif !important;
  font-size:15px !important;
  line-height:1.34 !important;
  font-weight:700 !important;
}
.waveMenu__cardSubtitle,
.waveMenu__cardUnit{
  color:#6A6A6A !important;
  font-family:'Lato',sans-serif !important;
  font-size:14px !important;
  line-height:1.4 !important;
  min-height:0;
}
.waveMenu__cardPrice,
.waveMenu__cardPrice *,
.waveMenu .woocommerce-Price-amount,
.waveMenu .woocommerce-Price-currencySymbol{
  margin:0;
  color:#111 !important;
  font-size:14px !important;
  line-height:1.25 !important;
  font-family:'Lato',sans-serif !important;
  font-weight:700 !important;
}

.waveMenu__swatches{
  display:flex;
  gap:7px;
  margin:2px 0 4px;
}
.waveMenu__swatch,
.waveMenu button.waveMenu__swatch,
.waveMenu .waveMenu__swatch:hover,
.waveMenu .waveMenu__swatch:focus,
.waveMenu .waveMenu__swatch:active{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:22px;
  height:22px;
  min-width:22px;
  min-height:22px;
  padding:0 !important;
  margin:0 !important;
  border-radius:999px !important;
  border:1px solid rgba(17,17,17,.16) !important;
  background:#fff !important;
  box-shadow:none !important;
  outline:none !important;
  line-height:0 !important;
  font-size:0 !important;
  color:transparent !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  flex:0 0 auto;
  transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease;
  position:relative;
}
.waveMenu__swatch::before,
.waveMenu__swatch::after{ content:none !important; display:none !important; }
.waveMenu__swatchDot{
  background-clip:padding-box;
  width:14px !important;
  height:14px !important;
  min-width:14px !important;
  min-height:14px !important;
  border-radius:999px !important;
  border:1px solid rgba(0,0,0,.08) !important;
  display:block !important;
  box-shadow:none !important;
  flex:0 0 auto;
}
.waveMenu__swatch.is-active{
  border-color:#111 !important;
  box-shadow:0 0 0 1px #111 inset !important;
}
.waveMenu__swatch.is-active .waveMenu__swatchDot{
  box-shadow:0 0 0 1px rgba(255,255,255,.92) inset !important;
}
.waveMenu__swatch.is-active::after{
  content:'' !important;
  display:block !important;
  position:absolute;
  inset:-3px;
  border:1px solid #111;
  border-radius:999px;
}
.waveMenu__swatch:hover,
.waveMenu__swatch:focus,
.waveMenu__swatch:active{
  background:#fff !important;
  border-color:rgba(17,17,17,.46) !important;
  box-shadow:none !important;
  transform:translateY(-1px);
}

.waveMenu__railControls{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  margin-top:18px;
  width:100%;
}
.waveMenu__navBtn,
.waveMenu__navBtn:hover,
.waveMenu__navBtn:focus,
.waveMenu__navBtn:active{
  width:34px;
  height:34px;
  min-width:34px;
  min-height:34px;
  padding:0 !important;
  border-radius:999px !important;
  border:1px solid rgba(17,17,17,.12) !important;
  background:rgba(255,255,255,.84) !important;
  color:#111 !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 6px 18px rgba(17,17,17,.06);
  transition:transform .18s ease, border-color .18s ease, background .18s ease, opacity .18s ease, box-shadow .18s ease;
}
.waveMenu__navBtn:hover,
.waveMenu__navBtn:focus{
  transform:translateY(-1px);
  border-color:rgba(17,17,17,.24) !important;
  background:#fff !important;
  box-shadow:0 10px 24px rgba(17,17,17,.1);
}
.waveMenu__navBtn[disabled]{
  opacity:.34;
  cursor:default;
  transform:none !important;
  box-shadow:none;
}
.waveMenu__navBtnIcon{
  width:14px;
  height:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:0;
}
.waveMenu__navBtnIcon svg{ width:100%; height:100%; display:block; }
.waveMenu__pagination{
  position:relative;
  width:118px;
  height:3px;
  border-radius:999px;
  background:rgba(17,17,17,.12);
  overflow:hidden;
  flex:0 0 auto;
}
.waveMenu__paginationBar{
  position:absolute;
  inset:0 auto 0 0;
  width:0;
  border-radius:999px;
  background:#111;
  transform:translateX(0);
  transition:transform .24s ease, width .24s ease;
}

.waveMenu__empty{
  width:100%;
  padding:24px 0 8px;
  font-family:'Lato',sans-serif !important;
  font-size:14px !important;
  color:#666 !important;
}


@media (max-width: 980px){
  .waveMenu__railViewport{
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-padding-left:0;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x pan-y pinch-zoom;
  }
  .waveMenu__rail{
    transform:translateZ(0);
  }
  .waveMenu__panel{
    position:fixed;
    inset:0;
    width:100%;
    height:100dvh;
    max-height:100dvh;
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    background:#fff;
  }
  .waveMenu__grid{
    height:auto;
    min-height:100%;
    grid-template-columns:1fr;
    grid-template-rows:auto auto;
  }
  .waveMenu__left{
    border-right:0;
    border-bottom:1px solid #E6E7EB;
    padding:29px 24px;
  }
  .waveMenu__top{ justify-content:center; position:relative; }
  .waveMenu__close{ position:absolute; left:22px; top:0; }
  .waveMenu__right{ overflow:visible !important; padding:29px 24px 34px; }
  .waveMenu__rightTop{ margin-bottom:16px; }
  .waveMenu__railSection + .waveMenu__railSection{ margin-top:34px; padding-top:28px; }
  .waveMenu__rail{ gap:16px; }
  .waveMenu__card{
    flex-basis:calc((100% - 16px) / 2);
    max-width:calc((100% - 16px) / 2);
  }
  .waveMenu__pagination{ width:92px; }
}

@media (max-width: 640px){
  .waveMenu__productsTitle{ font-size:24px !important; }
  .waveMenu__viewAll{ padding:9px 14px; font-size:11px !important; }
  .waveMenu__card{
    flex-basis:calc((100% - 14px) / 2);
    max-width:calc((100% - 14px) / 2);
  }
  .waveMenu__cardTitle,
  .waveMenu__cardTitle a{ font-size:13px !important; }
  .waveMenu__cardSubtitle,
  .waveMenu__cardUnit,
  .waveMenu__cardPrice,
  .waveMenu__cardPrice *{ font-size:12px !important; }
  .waveMenu__imgWrap{ border-radius:18px; }
  .waveMenu__cardBody{ min-height:92px; }
}

@supports not (height: 100dvh){
  @media (max-width: 980px){
    .waveMenu__panel{ height:100vh; max-height:100vh; }
  }
}

@media (prefers-reduced-motion: reduce){
  .waveMenu__backdrop,
  .waveMenu__panel,
  .waveMenu__item,
  .waveMenu__navBtn,
  .waveMenu__img,
  .waveMenu__swatch,
  .waveMenu__viewAll,
  .waveMenu__close{ transition:none !important; animation:none !important; }
}
