/* Shared FLOW header motion and the compact scrolled state. */
.site-header,
.site-header * {
  transition-duration: 280ms;
  transition-timing-function: ease;
}

.site-header__bottom ul.menu-main-header {
  gap: 16px;
}

ul.menu-main-header li {
  margin-right: 0;
}

.site-header.scrolled .site-header__bottom {
  background-color: rgba(0, 0, 0, 0.72);
  border-bottom-color: transparent;
  color: #fff;
}

.site-header.scrolled .site-header__bottom a,
.site-header.scrolled .site-header__bottom i,
.site-header.scrolled .burger-menu {
  color: #fff !important;
}

.site-header.scrolled .site-header__bottom .site-logo-white {
  display: block;
}

.site-header.scrolled .site-header__bottom .site-logo-black {
  display: none;
}

.site-header.scrolled .navbar-fav-wrapper a,
.site-header.scrolled .navbar-cart-wrapper a.navbar-cart {
  background-color: #fff;
  border-color: rgba(255, 255, 255, 0.7);
  color: #151515 !important;
}

.site-header.scrolled .navbar-fav-wrapper a i,
.site-header.scrolled .navbar-cart-wrapper a.navbar-cart i {
  color: #151515 !important;
}

.site-header.scrolled .navbar-fav-wrapper a:hover,
.site-header.scrolled .navbar-cart-wrapper a.navbar-cart:hover,
.site-header.scrolled .navbar-fav-wrapper a:focus-visible,
.site-header.scrolled .navbar-cart-wrapper a.navbar-cart:focus-visible {
  background-color: #f1f1ef;
  border-color: #fff;
  color: #151515 !important;
}

.site-header.scrolled .burger-menu span,
.site-header.is-home .burger-menu span {
  background-color: #fff;
}

@media (prefers-reduced-motion: reduce) {
  .site-header,
  .site-header * {
    animation: none !important;
    transition: none !important;
  }
}