.mobile {
  display: none;
}

.install-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}

.install-modal .install-modal__pic-img {
  opacity: 0;
  visibility: hidden;
}

.install-modal.install-modal--active {
  opacity: 1;
  visibility: visible;
}

.install-modal.install-modal--active .install-modal__pic-img {
  opacity: 1;
  visibility: visible;
}

.install-modal__body {
  width: 500px;
  height: 511px;
  background-color: #fff;
  border-radius: 16px;
  padding: 24px;
  position: relative;
  display: flex;
  flex-direction: column;
}

.install-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
}

.install-modal__title {
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
  padding-right: 40px;
}

.install-modal__close {
  width: 44px;
  height: 44px;
  cursor: pointer;
}

.install-modal__content {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
}

.install-modal__imagebox {
  width: 100%;
  height: 100%;
}

.install-modal__pic,
.install-modal__pic-src,
.install-modal__pic-img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.install-modal__link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.header {
  position: relative;
  width: 100%;
  z-index: 15;
}

.header .shop-regions-button {
  padding: 0 !important;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
}

.header .shop-regions-button .shop-regions__link {
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  border-bottom: none;
  color: #141414;
}

.header__container {
  display: flex;
  align-items: center;
  height: 100%;
  max-width: 1550px;
  margin: auto;
  position: relative;
}

.header__container--mobile {
  margin: 16px;
  padding: 16px;
  border: 1px solid var(--primary-container);
  border-radius: 8px;
}

.header__container--mobile .header__link {
  font-size: 12px;
  line-height: 18px;
}

.header__quiz {
  background-color: #F7F7F7;
  border-bottom: 1px solid #EFEFEF;
  padding: 12px;
  display: none;
}

.quiz__content {
  display: flex;
  align-items: center;
  gap: 30px;
  width: 660px;
  margin: auto;
  font-size: 18px;
  line-height: 28px;
}

.quiz__close {
  position: absolute;
  right: 24px;
  top: 0px;
  width: 44px;
  height: 44px;
  cursor: pointer;
}

.quiz__close svg {
  width: 100%;
  height: 100%;
}

.quiz__btn {
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 600;
  background-color: #1D7F88;
  transition: background-color .3s ease-in-out;
  color: #fff;
  font-size: 16px;
  line-height: 24px;
}

.quiz__btn:hover {
  background-color: #5DB4BD;
}

.header__top {
  padding: 12px 0;
  background: var(--primary-color);
  /* AUTH */
}

.header__top--tiled .header__container {
  padding: 0;
}

.header__top .header__right .header__group {
  display: flex;
  gap: 16px;
}

.header__top .header__block {
  display: flex;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  transition: var(--transitions);
  white-space: nowrap;
  gap: 8px;
}

.header__top .header__block:not(:last-of-type) {
  margin-right: 16px;
}

.header__top .header__block:hover {
  color: var(--hover-link);
}

.header__top .header__block:hover .header__value {
  color: var(--hover-link);
}

.header__top .header__block:hover .shop-regions-button .shop-regions__link {
  color: var(--hover-link) !important;
  transition: var(--transitions);
}

.header__top .header__block .shop-regions-button .shop-regions__link {
  position: relative;
  display: flex;
  align-items: flex-start;
}

.header__top .header__block .shop-regions-button .shop-regions__link::after {
  content: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 8%27 fill=%27none%27%3E%3Cpath d=%27M0.876953 1.40479L6.06836 6.59521L11.2588 1.40479%27 stroke=%27%23141414%27 stroke-width=%271.5%27/%3E%3C/svg%3E");
  position: relative;
  width: 9px;
  height: 8px;
  margin-left: 8px;
}

.header__top .header__block .header__value,
.header__top .header__block .header__key {
  font-size: 12px;
  line-height: 16px;
}

.header__top .header__block .header__key {
  font-weight: 600;
  z-index: 1;
}

.header__top .header__block .header__value {
  font-weight: 400;
  z-index: 1;
}

.header__top .header__block .header__value--submenu {
  position: absolute;
  top: 100%;
  right: 16px;
  visibility: hidden;
  opacity: 0;
  transition: opacity .3s;
  margin-top: 5px;
  right: 5px;
}

.header__top .header__block .header__value--arrow {
  position: relative;
  display: flex;
  align-items: flex-start;
  cursor: pointer;
}

.header__top .header__block .header__value--arrow::after {
  content: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 8%27 fill=%27none%27%3E%3Cpath d=%27M0.876953 1.40479L6.06836 6.59521L11.2588 1.40479%27 stroke=%27%23141414%27 stroke-width=%271.5%27/%3E%3C/svg%3E");
  position: relative;
  width: 9px;
  height: 16px;
  margin-left: 8px;
  transition: transform .3s;
}

.header__top .header__block:has(.header__value--submenu) {
  position: relative;
  z-index: 15;
}

.header__top .header__block:has(.header__value--submenu)::after {
  content: '';
  background: #fff;
  width: calc(100% + 16px);
  height: calc(200% + 21px);
  left: -8px;
  top: -8px;
  position: absolute;
  border-radius: 8px;
  z-index: 0;
  visibility: hidden;
  opacity: 0;
  transition: opacity .3s;
  box-shadow: 0px 4px 12px 0px #00000040;
}

.header__top .header__block:has(.header__value--submenu):hover .header__value::after {
  transform: rotate(-180deg);
}

.header__top .header__block:has(.header__value--submenu):hover .header__value--submenu {
  visibility: visible;
  opacity: 1;
}

.header__top .header__block:has(.header__value--submenu):hover::after {
  visibility: visible;
  opacity: 1;
}

.header__top .auth {
  position: relative;
  display: flex;
  align-items: center;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  transition: var(--transitions);
  white-space: nowrap;
  cursor: pointer;
}

.header__top .auth:hover {
  color: var(--hover-link);
}

.header__top .auth:hover .menu-top {
  opacity: 1;
  visibility: visible;
  transition: var(--transitions);
}

.header__top .auth__list {
  position: absolute;
  top: 100%;
  margin: 0;
  padding: 0;
  opacity: 0;
  visibility: hidden;
  list-style-type: none;
  transition: var(--transitions);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  z-index: 1;
}

.header__top .header__list {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  width: 100%;
  list-style-type: none;
}

.header__top .header__item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  flex-shrink: 0;
  color: #FFFFFF;
  text-decoration: none;
  cursor: pointer;
  transition: var(--transitions);
}

.header__top .header__item svg {
  margin-left: 8px;
}

.header__top .header__item:not(:last-of-type) {
  margin-right: 23px;
}

.header__top .header__link {
  display: flex;
  align-items: center;
  height: 100%;
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  color: #FFFFFF;
  transition: var(--transitions);
}

.header__top .header__item:hover .header__link {
  color: var(--hover-link);
  transition: var(--transitions);
}

.header__top .header__item--menu {
  z-index: 10;
}

.header__top .menu-top {
  transition: opacity .3s, visibility .3s, transform .3s;
}

.header__top .header__item--menu:hover .menu-top {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.header__top .header__item--menu svg {
  transition: transform .3s ease-in-out;
}

.header__top .header__item:hover svg {
  transform: rotate(-180deg);
}

.header__middle {
  padding: 12px 0;
  background: var(--background-color);
}

.header__middle .header__catalog {
  cursor: pointer;
  transition: .3s;
}

.header__middle .header__catalog:hover {
  color: var(--on-primary-container);
}

.header__middle .header__list {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  width: 100%;
  list-style-type: none;
}

.header__middle .header__list .header__item {
  border: 2px solid #fff;
  border-radius: 8px;
  transition: border-color .3s ease-in-out;
}

.header__middle .header__list .header__item--menu {
  position: relative;
  padding: 8px 16px;
}

.header__middle .header__list .header__item--menu .header__link {
  padding: 0;
  cursor: default;
}

.header__middle .header__list .header__item:hover:not(.header__item--menu) {
  border-color: var(--primary-container);
}

.header__middle .header__list .header__item:hover:not(.header__item--menu) .header__link {
  color: #FFF;
}

.header__middle .header__list .header__item:not(:last-of-type) {
  margin-right: 16px;
}

.header__middle .header__item svg {
  margin-left: 8px;
}

.header__middle .header__item:hover .header__link {
  color: var(--hover-link);
  transition: var(--transitions);
}

.header__middle .header__item--menu {
  z-index: 10;
}

.header__middle .header__item--menu:hover .menu-top {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.header__middle .header__item--menu svg {
  transition: transform .3s ease-in-out;
}

.header__middle .header__item:not(.header__catalog):hover svg {
  transform: rotate(-180deg);
}

.header__middle .header__link {
  transition: color .3s ease-in-out;
  position: relative;
  z-index: 12;
  display: flex;
  align-items: center;
  font-size: clamp(14px, 1vw, 16px);
  line-height: clamp(21px, 1.5vw, 24px);
  padding: 8px;
}

.header__middle .header__groupblock:not(:last-of-type) {
  margin-right: 40px;
}

.header__middle .header__block {
  display: flex;
  align-items: center;
  transition: var(--transitions);
  white-space: nowrap;
}

.header__middle .header__block:hover:not(.header__block--nolink) {
  color: var(--hover-link);
}

.header__middle .header__block:hover:not(.header__block--nolink) .header__value {
  color: var(--hover-link);
}

.header__middle .avatar__link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.header__middle .header__btn:not(:last-of-type) {
  margin-right: 8px;
}

.header__middle--tiled {
  padding: 0;
}

.header__middle--tiled .header__container {
  padding: 0;
}

.header__middle--tiled .header__btn {
  padding: 28px;
}

.header__middle--tiled .header__btn:hover {
  background: rgba(0, 0, 0, 0.1);
  color: #8C8C8C;
}

.header__middle--tiled .header__btn .header__icon {
  margin-right: 0;
}

.header__middle--tiled .header__btn:not(:last-of-type) {
  margin-right: 0;
}

.header__butn {
  margin-left: 8px;
}

.header__bottom {
  padding: 8px 0;
  background: var(--primary-container);
  min-height: 53px;
}

.header__bottom .auth:hover {
  color: var(--hover-link);
}

.header__bottom .auth:hover .menu-top {
  opacity: 1;
  visibility: visible;
  transition: var(--transitions);
}

.header__bottom .header__catalog {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.header__bottom .header__show {
  background: #FFFFFF;
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  height: 56px;
  width: 212px;
  padding: 16px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: var(--transitions);
}

.header__bottom .header__show--rounded {
  border-radius: 8px;
}

.header__bottom .header__show > * {
  pointer-events: none;
}

.header__bottom .header__show:hover {
  background: rgba(255, 255, 255, 0.6);
  transition: var(--transitions);
}

.header__bottom .header__right--rounded .search__input {
  border-radius: 8px;
}

.header__bottom .header__right--rounded .header__btn--white {
  border-radius: 8px;
}

.header__bottom .header__block {
  display: flex;
  align-items: center;
  color: #FFFFFF;
  white-space: nowrap;
  transition: var(--transitions);
}

.header__bottom .header__block .header__value {
  font-size: 18px;
  line-height: 28px;
  color: #FFFFFF;
  transition: var(--transitions);
}

.header__bottom .header__block:hover:not(.header__block--nolink) {
  color: rgba(255, 255, 255, 0.6);
}

.header__bottom .header__block:hover:not(.header__block--nolink) .header__value {
  color: rgba(255, 255, 255, 0.6);
}

.header__bottom .shop-regions-button .shop-regions__link {
  font-size: 18px;
  line-height: 28px;
  border-bottom: none;
  font-weight: 600;
}

.header__bottom .header__btn:not(:last-of-type) {
  margin-right: 8px;
}

.header__bottom .header__btn--white {
  display: flex;
  width: 170px;
  font-weight: 600;
  background: #FFFFFF;
}

.header__bottom .header__btn--white:hover {
  background: rgba(255, 255, 255, 0.6);
  transition: var(--transitions);
}

.header__bottom .header__btn--white .header__icon {
  color: #8C8C8C;
}

.header__bottom .header__btn--white .header__count {
  margin-right: 8px;
}

.header__bottom--linear .header__show {
  background: transparent;
  border: 2px solid #FFFFFF;
  color: #FFFFFF;
}

.header__bottom--linear .search__input {
  background: transparent;
  color: #FFFFFF;
  border: 2px solid #1D7F88;
}

.header__bottom--linear .search__icon {
  color: #FFFFFF;
}

.header__bottom--linear .search__input::-moz-placeholder {
  color: #FFFFFF;
}

.header__bottom--linear .search__input::placeholder {
  color: #FFFFFF;
}

.header__bottom--linear .header__btn--white {
  background: transparent;
  color: #FFFFFF;
  border: 2px solid #FFFFFF;
}

.header__bottom--linear .header__btn--white .header__icon {
  color: #FFFFFF;
}

.header__bottom--linear .header__btn--white .header__count {
  color: #FFFFFF;
  border-color: #FFFFFF;
}

.header__bottom--tiled {
  padding: 0;
  height: 80px;
}

.header__bottom--tiled .header__container {
  padding: 0;
}

.header__bottom--tiled .header__right {
  height: 100%;
}

.header__bottom--tiled .search {
  padding: 12px 0;
}

.header__bottom--tiled .header__show {
  padding: 28px 40px;
  height: auto;
  width: auto;
  background: rgba(0, 0, 0, 0.1);
  color: #FFFFFF;
}

.header__bottom--tiled .header__btn--white {
  background: rgba(0, 0, 0, 0.1);
  color: #FFFFFF;
}

.header__bottom--tiled .header__btn--white .header__icon {
  color: #FFFFFF;
}

.header__bottom--tiled .header__btn--white .header__count {
  color: #FFFFFF;
  border-color: #FFFFFF;
}

.header__left {
  display: flex;
  gap: 16px;
}

.header__right {
  display: flex;
  justify-content: space-between;
  width: calc(100% - 360px);
  align-items: center;
  width: auto;
  margin-left: auto;
}

.header__group {
  display: flex;
}

.header__group:not(:last-of-type) {
  padding-right: 16px;
}

.header__group:last-of-type {
  padding-left: 16px;
  flex-shrink: 0;
}

.header__groupblock {
  position: relative;
  display: flex;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.header__btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color .3s, border-color .3s;
  cursor: pointer;
}

.header__btn:has(.header__icon) {
  color: #141414;
  border: 1px solid transparent;
  border-radius: 50%;
}

.header__btn:has(.header__icon):hover {
  color: #7B7162;
  border-color: #7B7162;
}

.header__count {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 16px;
  min-width: 16px;
  font-weight: 600;
  border-radius: 136px;
  font-size: 12px;
  line-height: 16px;
  color: #EE6B33;
  border: 1px solid #EE6B33;
  background: #fff;
  position: absolute;
  right: -2px;
  top: -2px;
}

.header__count--empty {
  display: none;
}

.header__regions {
  display: flex;
  align-items: center;
}

.header__icon {
  margin-right: 0px;
  transition: opacity .3s ease-in-out;
  transform: scale(1.2);
}

.header__icon--hover {
  position: absolute;
  opacity: 0;
  transition: opacity .3s ease-in-out;
}

.header__badge {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-items: center;
}

.header__logobox {
  display: block;
  height: 57px;
  width: 129px;
  flex-shrink: 0;
  transition: var(--transitions);
}

.header__logobox:hover {
  opacity: 0.7;
  transition: var(--transitions);
}

.header__logo {
  height: 100%;
  width: 100%;
}

.header__logobox2 {
  width: 72px;
  height: 22px;
  margin-left: 8px;
}

.header__value {
  display: flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  transition: var(--transitions);
}

.header__avatar {
  overflow: hidden;
  display: flex;
  gap: 4px;
  justify-content: center;
  align-items: center;
}

.header__avatar:hover .auth__arrow {
  transform: rotate(180deg);
}

.auth__arrow {
  transition: transform .3s ease-in-out;
}

.avatar__ph {
  width: 32px;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #EAE6E0;
}

.avatar__link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* CART */

.cart {
  color: #404040;
}

.cart__price {
  display: flex;
  flex-direction: column;
  font-size: 14px;
  color: #FFFFFF;
}

.cart__total {
  font-weight: 600;
}

.header__group--auth {
  position: relative;
}

.header__group--auth::before {
  content: '';
  width: 1px;
  height: 32px;
  left: 0px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #8C8C8C;
}

.loupe {
  position: fixed;
  right: 28px;
  top: 16px;
  z-index: 20;
  width: 56px;
  height: 56px;
  border-radius: 100%;
  border: 1px solid #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #00aeef;
  box-shadow: 0px 4px 4px 0px #00000040;
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.loupe svg {
  margin-top: -4px;
}

.loupe .loupe__text {
  font-size: 9px;
  line-height: 11px;
  color: #FFFFFF;
}

.loupe--active {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.loupe > * {
  pointer-events: none;
}

.header_new .header__container {
  flex-wrap: nowrap;
}

.header_new .header__top {
  padding: 16px 0;
  background-color: #F7F7F7;
}

.header_new .header__top .header__item:not(:last-of-type) {
  margin-right: 40px;
}

.header_new .header__top .header__link {
  font-size: 18px;
  line-height: 28px;
  color: #141414;
  font-weight: 400;
}

.header_new .header__top .header__block .header__key {
  font-size: 16px;
  line-height: 24px;
}

.header_new .header__top .header__block .header__value,
.header_new .header__top .shop-regions-button .shop-regions__link {
  font-size: 18px;
  line-height: 28px;
}

.header_new .header__block--address {
  display: none;
}

.header_new .header__left {
  gap: 24px;
}

.header_new .header__additional {
  display: flex;
  align-items: center;
}

.header_new .additional__btn {
  display: flex;
  cursor: pointer;
}

.header_new .additional__btn:hover + .additional__menu {
  opacity: 1;
  visibility: visible;
}

.header_new .additional__menu {
  position: absolute;
  width: 300px;
  box-shadow: 0px 4px 12px 0px #00000040;
  right: 0;
  top: 100%;
  display: flex;
  flex-direction: column;
  background-color: #FFF;
  border-radius: 8px;
  padding: 16px;
  z-index: 22;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s, visibility .3s;
}

.header_new .additional__menu .header__block--city {
  display: none;
}

.header_new .additional__menu .header__block--address {
  display: flex;
}

.header_new .header__middle .header__right {
  width: 100%;
  margin-left: 24px;
}

.header_new .header__middle #search {
  margin-right: 24px;
}

.header_new .header__middle .search {
  max-width: none;
  margin-right: 0;
  border-radius: 8px;
}

.header_new .header__middle .search .search__input {
  width: 100%;
  padding: 12px 16px;
  font-size: 18px;
  line-height: 28px;
  height: 52px;
}

.header_new .header__middle .search .search__input::-moz-placeholder {
  font-size: 18px;
  line-height: 28px;
}

.header_new .header__middle .search .search__input::placeholder {
  font-size: 18px;
  line-height: 28px;
}

.header_new .header__middle .search .search__input:focus {
  border-color: var(--primary2-color);
}

.header_new .header__middle .search .search__icon {
  left: auto;
  right: 0;
  background-color: #1D7F88;
  border-radius: 0 8px 8px 0;
}

.header_new .header__logobox {
  height: 64px;
  width: 165px;
}

.header_new .header__middle .header__list .header__item:hover:not(.header__item--menu) {
  border-color: transparent;
}

.header_new .header__catalog:hover .catalog__btn {
  color: #FFF;
  background-color: var(--primary3-color);
  transition: background-color .3s ease-in-out;
}

.header_new .header__catalog:hover .catalog__icon span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

.header_new .header__catalog:hover .catalog__icon span:nth-child(2) {
  opacity: 0;
}

.header_new .header__catalog:hover .catalog__icon span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

.header_new .catalog__btn {
  font-size: 18px;
  line-height: 28px;
  padding: 12px 16px;
  background-color: #1D7F88;
  border-radius: 8px;
  color: #FFF;
  overflow: hidden;
  position: relative;
}

.header_new .catalog__btn::after {
  content: '';
  position: absolute;
  top: -50%;
  bottom: -50%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.6) 100%);
  width: 45px;
  transform: skewX(-22deg);
  left: -65%;
  -webkit-animation-name: blick;
          animation-name: blick;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

@-webkit-keyframes blink {
  60% {
    left: 100%;
  }
  100% {
    left: 130%;
  }
}

@keyframes blink {
  60% {
    left: 100%;
  }
  100% {
    left: 130%;
  }
}

.header_new .catalog__icon {
  display: flex;
  flex-direction: column;
  width: 18px;
  position: relative;
  margin-right: 8px;
  gap: 5px;
}

.header_new .catalog__icon span {
  width: 100%;
  background-color: #FFF;
  height: 1px;
  position: relative;
  display: block;
  transition: transform .3s, opacity .3s;
}

.header_new .header__middle .header__btn:not(:last-of-type) {
  margin-right: 16px;
}

.header_new .header__btn {
  display: flex;
  flex-direction: column;
}

.header_new .header__btn--text {
  font-size: 12px;
  line-height: 18px;
}

.header_new .header__btn:has(.header__icon):hover {
  border-color: transparent;
}

.header_new .header__group:not(:last-of-type) {
  padding-right: 24px;
}

.header_new .header__group:last-of-type {
  padding-left: 24px;
  flex-shrink: 0;
}

.header_new .header__bottom {
  background-color: #fff;
  border-bottom: 1px solid #D9D9D9;
}

.header_new .header__bottom .header__left {
  width: 100%;
}

.header_new .header__bottom .menu-categories .menu__item {
  opacity: 0.6;
}

.header_new .header__bottom .menu-categories .menu__item:hover {
  opacity: 1;
  color: #1D7F88;
}

.header_new .header__bottom .menu__link {
  font-size: 18px;
  line-height: 28px;
  color: #141414;
}

.header_new .header__top .header__item:hover .header__link {
  color: #1D7F88;
}

.header_new .header__right .header__additional:hover .additional__menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}

.header_new .header__right .additional__menu {
  transform: translateY(10px);
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}

.header_new .additional__menu::before {
  content: '';
  position: absolute;
  left: auto;
  right: 10px;
  top: -10px;
  z-index: 2;
  border: 5px solid transparent;
}

.header_new .additional__menu:hover {
  opacity: 1;
  visibility: visible;
}

.header_new .additional__item:last-child {
  margin-bottom: 0;
}

.header_new .additional__key {
  font-size: 14px;
  line-height: 21px;
  font-weight: 600;
  margin-bottom: 8px;
}

.header_new .additional__value {
  font-size: 14px;
  line-height: 21px;
  color: #8C8C8C;
}

.header_new .additional__value--social {
  display: flex;
  gap: 16px;
}

.header_new .additional__value:hover a {
  color: var(--primary2-color);
}

.header_new .additional__divider {
  margin: 8px 0;
  height: 1px;
  width: 100%;
  background-color: #8C8C8C;
  opacity: 0.4;
}

.header_new .fadeup-enter-active,
.header_new .fadeup-leave-active {
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.header_new .fadeup-enter-from,
.header_new .fadeup-leave-to {
  opacity: 0;
  transform: translateY(10px);
}

.header__bonuses {
  display: flex;
  padding: 8px 16px;
  background-color: var(--primary2-color);
  color: #fff;
  border-radius: 8px;
  font-size: 18px;
  line-height: 28px;
  margin-right: 16px;
}

.container {
  max-width: 1550px;
  padding: 0 24px;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
}

.container__left {
  width: 55%;
  position: relative;
}

.container__right {
  width: 45%;
}

.container__sm {
  max-width: 1328px;
  width: 100%;
  padding: 0 24px;
}

* {
  outline: none;
  box-sizing: border-box;
}

html {
  color: var(--on-background-color);
  background-color: var(--background-color);
  font-size: 16px;
  line-height: 24px;
  font-family: Montserrat;
  scroll-behavior: smooth;
}

html.lock {
  overflow: hidden;
}

body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  -ms-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

main {
  flex: auto;
  overflow: hidden;
  min-width: 360px;
}

p:not(:last-of-type) {
  margin-bottom: 24px;
}

img {
  opacity: 0;
  display: block;
}

img:not(.initial) {
  transition: opacity .6s;
}

img.initial,
img.loaded,
img.error {
  opacity: 1;
}

img:not([src]):not([srcset]) {
  visibility: hidden;
}

figure img {
  opacity: 1;
  visibility: visible;
}

button {
  background-color: unset;
  padding: unset;
  border: none;
  outline: none;
  font-family: Montserrat;
}

input {
  border: none;
  padding: unset;
  outline: none;
  font-family: Montserrat;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

.h1 {
  color: #272727;
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  margin: 0;
}

a {
  display: block;
  text-decoration: none;
  color: #272727;
}

button {
  display: block;
  color: #272727;
}

input {
  color: #272727;
}

ul {
  margin: 0;
  padding-left: 20px;
}

footer ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

li {
  margin-bottom: 4px;
}

li::marker {
  color: var(--primary-color);
}

p {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: var(--on-background-color);
  opacity: .8;
}

h2 {
  margin: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 40px;
  font-weight: 600;
  line-height: 44px;
  color: var(--on-background-color);
}

h3 {
  margin: 0;
}

.invisible {
  display: none !important;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity .3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
  transition: opacity .3s;
}

#search {
  flex: 1;
}

.lock {
  overflow: hidden;
}

.absolute {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
}

[v-cloak] {
  display: none;
}

:root {
  --primary-color: #C6BDB0;
  --on-primary-color: #FFFFFF;
  --primary-container: #F7F7F7;
  --on-primary-container: #7B7162;
  --primary2-color: #1D7F88;
  --on-primary2-color: #FFFFFF;
  --primary3-color: #5DB4BD;
  --on-primary3-color: #FFFFFF;
  --background-color: #FFFFFF;
  --on-background-color: #141414;
  --surface-variant: #F7F7F7;
  --on-surface-variant: #8C8C8C;
  --outline-color: #D9D9D9;
  --outline-variant: #EFEFEF;
  --red-color: #FF2E00;
  --green-color: #3EBA12;
  --grey-color: #BBBBBB;
  --black-color: #000000;
  --black2-color: #272727;
  --black3-color: #00000020;
  --black4-color: #00000040;
  --black5-color: #04040480;
  --grey2-color: #8C7654;
  --grey3-color: #828282;
  --brown-color: #5F5240;
  --orange-color: #FF5C00;
  --green2-color: #18AD00;
  --grey4-color: #F4F3F2;
  --grey5-color: #404040;
  --blue-color: #7590B7;
  --grey6-color: #F7F5F3;
}

.background {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  z-index: 5;
  transition: var(--transitions);
}

.background--active {
  opacity: 1;
  visibility: visible;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.5s ease;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}

.slide-leave-active, .slide-enter-active {
  transition: transform .5s ease;
}

.slide-enter, .slide-leave-to {
  transform: translateY(100%);
}

.mobile {
  display: none;
}

.install-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}

.install-modal .install-modal__pic-img {
  opacity: 0;
  visibility: hidden;
}

.install-modal.install-modal--active {
  opacity: 1;
  visibility: visible;
}

.install-modal.install-modal--active .install-modal__pic-img {
  opacity: 1;
  visibility: visible;
}

.install-modal__body {
  width: 500px;
  height: 511px;
  background-color: #fff;
  border-radius: 16px;
  padding: 24px;
  position: relative;
  display: flex;
  flex-direction: column;
}

.install-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
}

.install-modal__title {
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
  padding-right: 40px;
}

.install-modal__close {
  width: 44px;
  height: 44px;
  cursor: pointer;
}

.install-modal__content {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
}

.install-modal__imagebox {
  width: 100%;
  height: 100%;
}

.install-modal__pic,
.install-modal__pic-src,
.install-modal__pic-img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.install-modal__link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.header {
  position: relative;
  width: 100%;
  z-index: 15;
}

.header .shop-regions-button {
  padding: 0 !important;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
}

.header .shop-regions-button .shop-regions__link {
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  border-bottom: none;
  color: #141414;
}

.header__container {
  display: flex;
  align-items: center;
  height: 100%;
  max-width: 1550px;
  margin: auto;
  position: relative;
}

.header__container--mobile {
  margin: 16px;
  padding: 16px;
  border: 1px solid var(--primary-container);
  border-radius: 8px;
}

.header__container--mobile .header__link {
  font-size: 12px;
  line-height: 18px;
}

.header__quiz {
  background-color: #F7F7F7;
  border-bottom: 1px solid #EFEFEF;
  padding: 12px;
  display: none;
}

.quiz__content {
  display: flex;
  align-items: center;
  gap: 30px;
  width: 660px;
  margin: auto;
  font-size: 18px;
  line-height: 28px;
}

.quiz__close {
  position: absolute;
  right: 24px;
  top: 0px;
  width: 44px;
  height: 44px;
  cursor: pointer;
}

.quiz__close svg {
  width: 100%;
  height: 100%;
}

.quiz__btn {
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 600;
  background-color: #1D7F88;
  transition: background-color .3s ease-in-out;
  color: #fff;
  font-size: 16px;
  line-height: 24px;
}

.quiz__btn:hover {
  background-color: #5DB4BD;
}

.header__top {
  padding: 12px 0;
  background: var(--primary-color);
  /* AUTH */
}

.header__top--tiled .header__container {
  padding: 0;
}

.header__top .header__right .header__group {
  display: flex;
  gap: 16px;
}

.header__top .header__block {
  display: flex;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  transition: var(--transitions);
  white-space: nowrap;
  gap: 8px;
}

.header__top .header__block:not(:last-of-type) {
  margin-right: 16px;
}

.header__top .header__block:hover {
  color: var(--hover-link);
}

.header__top .header__block:hover .header__value {
  color: var(--hover-link);
}

.header__top .header__block:hover .shop-regions-button .shop-regions__link {
  color: var(--hover-link) !important;
  transition: var(--transitions);
}

.header__top .header__block .shop-regions-button .shop-regions__link {
  position: relative;
  display: flex;
  align-items: flex-start;
}

.header__top .header__block .shop-regions-button .shop-regions__link::after {
  content: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 8%27 fill=%27none%27%3E%3Cpath d=%27M0.876953 1.40479L6.06836 6.59521L11.2588 1.40479%27 stroke=%27%23141414%27 stroke-width=%271.5%27/%3E%3C/svg%3E");
  position: relative;
  width: 9px;
  height: 8px;
  margin-left: 8px;
}

.header__top .header__block .header__value,
.header__top .header__block .header__key {
  font-size: 12px;
  line-height: 16px;
}

.header__top .header__block .header__key {
  font-weight: 600;
  z-index: 1;
}

.header__top .header__block .header__value {
  font-weight: 400;
  z-index: 1;
}

.header__top .header__block .header__value--submenu {
  position: absolute;
  top: 100%;
  right: 16px;
  visibility: hidden;
  opacity: 0;
  transition: opacity .3s;
  margin-top: 5px;
  right: 5px;
}

.header__top .header__block .header__value--arrow {
  position: relative;
  display: flex;
  align-items: flex-start;
  cursor: pointer;
}

.header__top .header__block .header__value--arrow::after {
  content: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 8%27 fill=%27none%27%3E%3Cpath d=%27M0.876953 1.40479L6.06836 6.59521L11.2588 1.40479%27 stroke=%27%23141414%27 stroke-width=%271.5%27/%3E%3C/svg%3E");
  position: relative;
  width: 9px;
  height: 16px;
  margin-left: 8px;
  transition: transform .3s;
}

.header__top .header__block:has(.header__value--submenu) {
  position: relative;
  z-index: 15;
}

.header__top .header__block:has(.header__value--submenu)::after {
  content: '';
  background: #fff;
  width: calc(100% + 16px);
  height: calc(200% + 21px);
  left: -8px;
  top: -8px;
  position: absolute;
  border-radius: 8px;
  z-index: 0;
  visibility: hidden;
  opacity: 0;
  transition: opacity .3s;
  box-shadow: 0px 4px 12px 0px #00000040;
}

.header__top .header__block:has(.header__value--submenu):hover .header__value::after {
  transform: rotate(-180deg);
}

.header__top .header__block:has(.header__value--submenu):hover .header__value--submenu {
  visibility: visible;
  opacity: 1;
}

.header__top .header__block:has(.header__value--submenu):hover::after {
  visibility: visible;
  opacity: 1;
}

.header__top .auth {
  position: relative;
  display: flex;
  align-items: center;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  transition: var(--transitions);
  white-space: nowrap;
  cursor: pointer;
}

.header__top .auth:hover {
  color: var(--hover-link);
}

.header__top .auth:hover .menu-top {
  opacity: 1;
  visibility: visible;
  transition: var(--transitions);
}

.header__top .auth__list {
  position: absolute;
  top: 100%;
  margin: 0;
  padding: 0;
  opacity: 0;
  visibility: hidden;
  list-style-type: none;
  transition: var(--transitions);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  z-index: 1;
}

.header__top .header__list {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  width: 100%;
  list-style-type: none;
}

.header__top .header__item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  flex-shrink: 0;
  color: #FFFFFF;
  text-decoration: none;
  cursor: pointer;
  transition: var(--transitions);
}

.header__top .header__item svg {
  margin-left: 8px;
}

.header__top .header__item:not(:last-of-type) {
  margin-right: 23px;
}

.header__top .header__link {
  display: flex;
  align-items: center;
  height: 100%;
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  color: #FFFFFF;
  transition: var(--transitions);
}

.header__top .header__item:hover .header__link {
  color: var(--hover-link);
  transition: var(--transitions);
}

.header__top .header__item--menu {
  z-index: 10;
}

.header__top .menu-top {
  transition: opacity .3s, visibility .3s, transform .3s;
}

.header__top .header__item--menu:hover .menu-top {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.header__top .header__item--menu svg {
  transition: transform .3s ease-in-out;
}

.header__top .header__item:hover svg {
  transform: rotate(-180deg);
}

.header__middle {
  padding: 12px 0;
  background: var(--background-color);
}

.header__middle .header__catalog {
  cursor: pointer;
  transition: .3s;
}

.header__middle .header__catalog:hover {
  color: var(--on-primary-container);
}

.header__middle .header__list {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  width: 100%;
  list-style-type: none;
}

.header__middle .header__list .header__item {
  border: 2px solid #fff;
  border-radius: 8px;
  transition: border-color .3s ease-in-out;
}

.header__middle .header__list .header__item--menu {
  position: relative;
  padding: 8px 16px;
}

.header__middle .header__list .header__item--menu .header__link {
  padding: 0;
  cursor: default;
}

.header__middle .header__list .header__item:hover:not(.header__item--menu) {
  border-color: var(--primary-container);
}

.header__middle .header__list .header__item:hover:not(.header__item--menu) .header__link {
  color: #FFF;
}

.header__middle .header__list .header__item:not(:last-of-type) {
  margin-right: 16px;
}

.header__middle .header__item svg {
  margin-left: 8px;
}

.header__middle .header__item:hover .header__link {
  color: var(--hover-link);
  transition: var(--transitions);
}

.header__middle .header__item--menu {
  z-index: 10;
}

.header__middle .header__item--menu:hover .menu-top {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.header__middle .header__item--menu svg {
  transition: transform .3s ease-in-out;
}

.header__middle .header__item:not(.header__catalog):hover svg {
  transform: rotate(-180deg);
}

.header__middle .header__link {
  transition: color .3s ease-in-out;
  position: relative;
  z-index: 12;
  display: flex;
  align-items: center;
  font-size: clamp(14px, 1vw, 16px);
  line-height: clamp(21px, 1.5vw, 24px);
  padding: 8px;
}

.header__middle .header__groupblock:not(:last-of-type) {
  margin-right: 40px;
}

.header__middle .header__block {
  display: flex;
  align-items: center;
  transition: var(--transitions);
  white-space: nowrap;
}

.header__middle .header__block:hover:not(.header__block--nolink) {
  color: var(--hover-link);
}

.header__middle .header__block:hover:not(.header__block--nolink) .header__value {
  color: var(--hover-link);
}

.header__middle .avatar__link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.header__middle .header__btn:not(:last-of-type) {
  margin-right: 8px;
}

.header__middle--tiled {
  padding: 0;
}

.header__middle--tiled .header__container {
  padding: 0;
}

.header__middle--tiled .header__btn {
  padding: 28px;
}

.header__middle--tiled .header__btn:hover {
  background: rgba(0, 0, 0, 0.1);
  color: #8C8C8C;
}

.header__middle--tiled .header__btn .header__icon {
  margin-right: 0;
}

.header__middle--tiled .header__btn:not(:last-of-type) {
  margin-right: 0;
}

.header__butn {
  margin-left: 8px;
}

.header__bottom {
  padding: 8px 0;
  background: var(--primary-container);
  min-height: 53px;
}

.header__bottom .auth:hover {
  color: var(--hover-link);
}

.header__bottom .auth:hover .menu-top {
  opacity: 1;
  visibility: visible;
  transition: var(--transitions);
}

.header__bottom .header__catalog {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.header__bottom .header__show {
  background: #FFFFFF;
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  height: 56px;
  width: 212px;
  padding: 16px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: var(--transitions);
}

.header__bottom .header__show--rounded {
  border-radius: 8px;
}

.header__bottom .header__show > * {
  pointer-events: none;
}

.header__bottom .header__show:hover {
  background: rgba(255, 255, 255, 0.6);
  transition: var(--transitions);
}

.header__bottom .header__right--rounded .search__input {
  border-radius: 8px;
}

.header__bottom .header__right--rounded .header__btn--white {
  border-radius: 8px;
}

.header__bottom .header__block {
  display: flex;
  align-items: center;
  color: #FFFFFF;
  white-space: nowrap;
  transition: var(--transitions);
}

.header__bottom .header__block .header__value {
  font-size: 18px;
  line-height: 28px;
  color: #FFFFFF;
  transition: var(--transitions);
}

.header__bottom .header__block:hover:not(.header__block--nolink) {
  color: rgba(255, 255, 255, 0.6);
}

.header__bottom .header__block:hover:not(.header__block--nolink) .header__value {
  color: rgba(255, 255, 255, 0.6);
}

.header__bottom .shop-regions-button .shop-regions__link {
  font-size: 18px;
  line-height: 28px;
  border-bottom: none;
  font-weight: 600;
}

.header__bottom .header__btn:not(:last-of-type) {
  margin-right: 8px;
}

.header__bottom .header__btn--white {
  display: flex;
  width: 170px;
  font-weight: 600;
  background: #FFFFFF;
}

.header__bottom .header__btn--white:hover {
  background: rgba(255, 255, 255, 0.6);
  transition: var(--transitions);
}

.header__bottom .header__btn--white .header__icon {
  color: #8C8C8C;
}

.header__bottom .header__btn--white .header__count {
  margin-right: 8px;
}

.header__bottom--linear .header__show {
  background: transparent;
  border: 2px solid #FFFFFF;
  color: #FFFFFF;
}

.header__bottom--linear .search__input {
  background: transparent;
  color: #FFFFFF;
  border: 2px solid #1D7F88;
}

.header__bottom--linear .search__icon {
  color: #FFFFFF;
}

.header__bottom--linear .search__input::-moz-placeholder {
  color: #FFFFFF;
}

.header__bottom--linear .search__input::placeholder {
  color: #FFFFFF;
}

.header__bottom--linear .header__btn--white {
  background: transparent;
  color: #FFFFFF;
  border: 2px solid #FFFFFF;
}

.header__bottom--linear .header__btn--white .header__icon {
  color: #FFFFFF;
}

.header__bottom--linear .header__btn--white .header__count {
  color: #FFFFFF;
  border-color: #FFFFFF;
}

.header__bottom--tiled {
  padding: 0;
  height: 80px;
}

.header__bottom--tiled .header__container {
  padding: 0;
}

.header__bottom--tiled .header__right {
  height: 100%;
}

.header__bottom--tiled .search {
  padding: 12px 0;
}

.header__bottom--tiled .header__show {
  padding: 28px 40px;
  height: auto;
  width: auto;
  background: rgba(0, 0, 0, 0.1);
  color: #FFFFFF;
}

.header__bottom--tiled .header__btn--white {
  background: rgba(0, 0, 0, 0.1);
  color: #FFFFFF;
}

.header__bottom--tiled .header__btn--white .header__icon {
  color: #FFFFFF;
}

.header__bottom--tiled .header__btn--white .header__count {
  color: #FFFFFF;
  border-color: #FFFFFF;
}

.header__left {
  display: flex;
  gap: 16px;
}

.header__right {
  display: flex;
  justify-content: space-between;
  width: calc(100% - 360px);
  align-items: center;
  width: auto;
  margin-left: auto;
}

.header__group {
  display: flex;
}

.header__group:not(:last-of-type) {
  padding-right: 16px;
}

.header__group:last-of-type {
  padding-left: 16px;
  flex-shrink: 0;
}

.header__groupblock {
  position: relative;
  display: flex;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.header__btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color .3s, border-color .3s;
  cursor: pointer;
}

.header__btn:has(.header__icon) {
  color: #141414;
  border: 1px solid transparent;
  border-radius: 50%;
}

.header__btn:has(.header__icon):hover {
  color: #7B7162;
  border-color: #7B7162;
}

.header__count {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 16px;
  min-width: 16px;
  font-weight: 600;
  border-radius: 136px;
  font-size: 12px;
  line-height: 16px;
  color: #EE6B33;
  border: 1px solid #EE6B33;
  background: #fff;
  position: absolute;
  right: -2px;
  top: -2px;
}

.header__count--empty {
  display: none;
}

.header__regions {
  display: flex;
  align-items: center;
}

.header__icon {
  margin-right: 0px;
  transition: opacity .3s ease-in-out;
  transform: scale(1.2);
}

.header__icon--hover {
  position: absolute;
  opacity: 0;
  transition: opacity .3s ease-in-out;
}

.header__badge {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-items: center;
}

.header__logobox {
  display: block;
  height: 57px;
  width: 129px;
  flex-shrink: 0;
  transition: var(--transitions);
}

.header__logobox:hover {
  opacity: 0.7;
  transition: var(--transitions);
}

.header__logo {
  height: 100%;
  width: 100%;
}

.header__logobox2 {
  width: 72px;
  height: 22px;
  margin-left: 8px;
}

.header__value {
  display: flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  transition: var(--transitions);
}

.header__avatar {
  overflow: hidden;
  display: flex;
  gap: 4px;
  justify-content: center;
  align-items: center;
}

.header__avatar:hover .auth__arrow {
  transform: rotate(180deg);
}

.auth__arrow {
  transition: transform .3s ease-in-out;
}

.avatar__ph {
  width: 32px;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #EAE6E0;
}

.avatar__link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* CART */

.cart {
  color: #404040;
}

.cart__price {
  display: flex;
  flex-direction: column;
  font-size: 14px;
  color: #FFFFFF;
}

.cart__total {
  font-weight: 600;
}

.header__group--auth {
  position: relative;
}

.header__group--auth::before {
  content: '';
  width: 1px;
  height: 32px;
  left: 0px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #8C8C8C;
}

.loupe {
  position: fixed;
  right: 28px;
  top: 16px;
  z-index: 20;
  width: 56px;
  height: 56px;
  border-radius: 100%;
  border: 1px solid #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #00aeef;
  box-shadow: 0px 4px 4px 0px #00000040;
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.loupe svg {
  margin-top: -4px;
}

.loupe .loupe__text {
  font-size: 9px;
  line-height: 11px;
  color: #FFFFFF;
}

.loupe--active {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.loupe > * {
  pointer-events: none;
}

.header_new .header__container {
  flex-wrap: nowrap;
}

.header_new .header__top {
  padding: 16px 0;
  background-color: #F7F7F7;
}

.header_new .header__top .header__item:not(:last-of-type) {
  margin-right: 40px;
}

.header_new .header__top .header__link {
  font-size: 18px;
  line-height: 28px;
  color: #141414;
  font-weight: 400;
}

.header_new .header__top .header__block .header__key {
  font-size: 16px;
  line-height: 24px;
}

.header_new .header__top .header__block .header__value,
.header_new .header__top .shop-regions-button .shop-regions__link {
  font-size: 18px;
  line-height: 28px;
}

.header_new .header__block--address {
  display: none;
}

.header_new .header__left {
  gap: 24px;
}

.header_new .header__additional {
  display: flex;
  align-items: center;
}

.header_new .additional__btn {
  display: flex;
  cursor: pointer;
}

.header_new .additional__btn:hover + .additional__menu {
  opacity: 1;
  visibility: visible;
}

.header_new .additional__menu {
  position: absolute;
  width: 300px;
  box-shadow: 0px 4px 12px 0px #00000040;
  right: 0;
  top: 100%;
  display: flex;
  flex-direction: column;
  background-color: #FFF;
  border-radius: 8px;
  padding: 16px;
  z-index: 22;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s, visibility .3s;
}

.header_new .additional__menu .header__block--city {
  display: none;
}

.header_new .additional__menu .header__block--address {
  display: flex;
}

.header_new .header__middle .header__right {
  width: 100%;
  margin-left: 24px;
}

.header_new .header__middle #search {
  margin-right: 24px;
}

.header_new .header__middle .search {
  max-width: none;
  margin-right: 0;
  border-radius: 8px;
}

.header_new .header__middle .search .search__input {
  width: 100%;
  padding: 12px 16px;
  font-size: 18px;
  line-height: 28px;
  height: 52px;
}

.header_new .header__middle .search .search__input::-moz-placeholder {
  font-size: 18px;
  line-height: 28px;
}

.header_new .header__middle .search .search__input::placeholder {
  font-size: 18px;
  line-height: 28px;
}

.header_new .header__middle .search .search__input:focus {
  border-color: var(--primary2-color);
}

.header_new .header__middle .search .search__icon {
  left: auto;
  right: 0;
  background-color: #1D7F88;
  border-radius: 0 8px 8px 0;
}

.header_new .header__logobox {
  height: 64px;
  width: 165px;
}

.header_new .header__middle .header__list .header__item:hover:not(.header__item--menu) {
  border-color: transparent;
}

.header_new .header__catalog:hover .catalog__btn {
  color: #FFF;
  background-color: var(--primary3-color);
  transition: background-color .3s ease-in-out;
}

.header_new .header__catalog:hover .catalog__icon span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

.header_new .header__catalog:hover .catalog__icon span:nth-child(2) {
  opacity: 0;
}

.header_new .header__catalog:hover .catalog__icon span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

.header_new .catalog__btn {
  font-size: 18px;
  line-height: 28px;
  padding: 12px 16px;
  background-color: #1D7F88;
  border-radius: 8px;
  color: #FFF;
  overflow: hidden;
  position: relative;
}

.header_new .catalog__btn::after {
  content: '';
  position: absolute;
  top: -50%;
  bottom: -50%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.6) 100%);
  width: 45px;
  transform: skewX(-22deg);
  left: -65%;
  -webkit-animation-name: blick;
          animation-name: blick;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

@keyframes blink {
  60% {
    left: 100%;
  }
  100% {
    left: 130%;
  }
}

.header_new .catalog__icon {
  display: flex;
  flex-direction: column;
  width: 18px;
  position: relative;
  margin-right: 8px;
  gap: 5px;
}

.header_new .catalog__icon span {
  width: 100%;
  background-color: #FFF;
  height: 1px;
  position: relative;
  display: block;
  transition: transform .3s, opacity .3s;
}

.header_new .header__middle .header__btn:not(:last-of-type) {
  margin-right: 16px;
}

.header_new .header__btn {
  display: flex;
  flex-direction: column;
}

.header_new .header__btn--text {
  font-size: 12px;
  line-height: 18px;
}

.header_new .header__btn:has(.header__icon):hover {
  border-color: transparent;
}

.header_new .header__group:not(:last-of-type) {
  padding-right: 24px;
}

.header_new .header__group:last-of-type {
  padding-left: 24px;
  flex-shrink: 0;
}

.header_new .header__bottom {
  background-color: #fff;
  border-bottom: 1px solid #D9D9D9;
}

.header_new .header__bottom .header__left {
  width: 100%;
}

.header_new .header__bottom .menu-categories .menu__item {
  opacity: 0.6;
}

.header_new .header__bottom .menu-categories .menu__item:hover {
  opacity: 1;
  color: #1D7F88;
}

.header_new .header__bottom .menu__link {
  font-size: 18px;
  line-height: 28px;
  color: #141414;
}

.header_new .header__top .header__item:hover .header__link {
  color: #1D7F88;
}

.header_new .header__right .header__additional:hover .additional__menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}

.header_new .header__right .additional__menu {
  transform: translateY(10px);
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}

.header_new .additional__menu::before {
  content: '';
  position: absolute;
  left: auto;
  right: 10px;
  top: -10px;
  z-index: 2;
  border: 5px solid transparent;
}

.header_new .additional__menu:hover {
  opacity: 1;
  visibility: visible;
}

.header_new .additional__item:last-child {
  margin-bottom: 0;
}

.header_new .additional__key {
  font-size: 14px;
  line-height: 21px;
  font-weight: 600;
  margin-bottom: 8px;
}

.header_new .additional__value {
  font-size: 14px;
  line-height: 21px;
  color: #8C8C8C;
}

.header_new .additional__value--social {
  display: flex;
  gap: 16px;
}

.header_new .additional__value:hover a {
  color: var(--primary2-color);
}

.header_new .additional__divider {
  margin: 8px 0;
  height: 1px;
  width: 100%;
  background-color: #8C8C8C;
  opacity: 0.4;
}

.header_new .fadeup-enter-active,
.header_new .fadeup-leave-active {
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.header_new .fadeup-enter-from,
.header_new .fadeup-leave-to {
  opacity: 0;
  transform: translateY(10px);
}

.header__bonuses {
  display: flex;
  padding: 8px 16px;
  background-color: var(--primary2-color);
  color: #fff;
  border-radius: 8px;
  font-size: 18px;
  line-height: 28px;
  margin-right: 16px;
}

.container {
  max-width: 1550px;
  padding: 0 24px;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
}

.container__left {
  width: 55%;
  position: relative;
}

.container__right {
  width: 45%;
}

.container__sm {
  max-width: 1328px;
  width: 100%;
  padding: 0 24px;
}

.menu {
  position: absolute;
  padding-top: 20px;
  width: calc(100% - 80px);
  height: 100%;
  top: 100%;
  left: 40px;
  z-index: 100;
  visibility: visible;
  opacity: 1;
}

.menu-catalog {
  position: absolute;
  padding-top: 20px;
  width: calc(100% - 80px);
  max-width: 1240px;
  height: 100%;
  top: auto;
  z-index: 100;
  visibility: visible;
  opacity: 1;
}

.menu-catalog .menu__list {
  border: 2px solid var(--primary-container);
  border-radius: 8px;
  box-shadow: 0px 0px 24px 0px #00000040;
}

.menu-catalog .menu__column {
  background-color: #EAE6E04D;
  padding: 16px 16px 147px;
}

.menu-catalog .menu__item {
  padding: 8px;
  border: 1px solid transparent;
  border-radius: 8px;
  margin: 8px 0px;
  transition: .3s;
  position: relative;
}

.menu-catalog .menu__item:hover .menu__title {
  color: #404040;
}

.menu-catalog .menu__item--new::after {
  content: '';
  background-image: url("https://slonpp.com/wa-data/public/site/img/new.webp");
  position: absolute;
  width: 32px;
  height: 32px;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
}

.menu-catalog .menu__item--active {
  border-color: var(--primary-color);
}

.menu-catalog .menu__item--active .menu__title {
  color: #404040;
}

.menu-catalog .menu__item--active .menu__icon {
  transform: rotateZ(0deg) scale(1);
}

.menu-catalog .menu__title {
  color: #404040;
}

.menu-catalog .menu__icon {
  fill: rgba(64, 64, 64, 0.3);
  margin-left: 8px;
  transform: rotateZ(0deg);
  transition: .3s;
}

.menu-catalog .menu__top {
  position: relative;
  color: #FFFFFF;
  display: flex;
}

.menu-catalog .menu__top .menu__imagebox {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
}

.menu-catalog .menu__top .menu__imagebox .menu__img {
  width: 100%;
  border-radius: 8px;
}

.menu-catalog .menu__top .menu__banner {
  margin: 16px;
  position: relative;
}

.menu-catalog .menu__top .menu__header {
  z-index: 1;
  position: relative;
  padding: 24px 0px 8px 24px;
}

.menu-catalog .menu__top .menu__description {
  z-index: 1;
  position: relative;
  padding: 0px 0px 0px 24px;
}

.menu-catelog-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: -1;
  display: none;
}

.menu-catelog-overlay.show {
  display: block;
}

.menu-categories {
  position: relative;
  display: flex;
}

.menu-categories .menu__list {
  flex-direction: column;
  display: flex;
  background: transparent;
  box-shadow: none;
}

.menu-categories .menu__column {
  display: flex;
  gap: 24px;
}

.menu-categories .menu__dropdown {
  position: absolute;
  padding: 24px;
  top: calc(100% + 7px);
  left: 0;
  width: 100%;
  z-index: 100;
  visibility: visible;
  opacity: 1;
  background-color: var(--background-color);
  border-radius: 8px;
  box-shadow: 0px 0px 24px 0px #00000040;
}

.menu-categories .menu__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
}

.menu-categories .menu__block {
  width: 224px;
  overflow: visible;
}

.menu-categories .menu__category {
  display: flex;
  gap: 16px;
}

.menu-categories .menu__imagebox {
  width: 60px;
  height: 60px;
  min-width: 60px;
  transition: opacity .3s;
}

.menu-categories .menu__imagebox svg {
  width: 100%;
  height: 100%;
}

.menu-categories .menu__imagebox img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  opacity: 1;
}

.menu-categories .menu__text {
  display: flex;
  flex-direction: column;
}

.menu-categories .menu__count {
  opacity: .7;
  color: var(--on-background-color);
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
}

.menu-categories .menu__item {
  position: relative;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: .3s;
  opacity: 0.5;
}

.menu-categories .menu__item--active {
  opacity: 1;
  transition: var(--transitions);
}

.menu-categories-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: -1;
  display: none;
}

.menu-categories-overlay.show {
  display: block;
}

.menu--active {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.menu__list {
  background-color: #FFFFFF;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
  display: flex;
  overflow: hidden;
}

.menu__column {
  min-width: 280px;
}

.menu__body {
  flex: 1;
  position: relative;
}

.menu__bottom {
  -moz-columns: 4;
       columns: 4;
  margin-top: 0px;
  margin-bottom: 16px;
  margin-left: -10px;
}

.menu__header {
  padding: 24px;
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  top: 0;
  left: 0;
  transition: background-color .3s, color .3s;
}

.menu__block {
  position: relative;
  -moz-column-break-inside: avoid;
       break-inside: avoid-column;
  page-break-inside: avoid;
  overflow: hidden;
  font-weight: 600;
}

.menu__item {
  position: relative;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: .3s;
}

.menu-categories .menu__item:first-of-type {
  padding-left: 0;
}

.menu__item--active {
  transition: var(--transitions);
}

.menu__subitem {
  font-weight: 400;
}

.menu__icon {
  fill: rgba(64, 64, 64, 0.3);
  margin-left: 8px;
  transform: rotateZ(90deg) scale(1.5);
  transition: .3s;
}

.menu__item--active .menu__icon {
  transition: var(--transitions);
  transform: rotateZ(-90deg) scale(1.5);
}

.menu__item--active .menu__title {
  color: var(--hover-link);
  transition: var(--transitions);
}

.menu__item:hover {
  transition: var(--transitions);
}

.menu__item:hover .menu__icon {
  transition: var(--transitions);
}

.menu__item:hover .menu__title {
  color: var(--hover-link);
  transition: var(--transitions);
}

.menu__title {
  font-size: 18px;
  line-height: 24px;
}

.menu__category {
  position: relative;
  padding: 8px 24px;
  font-size: 12px;
  line-height: 16px;
  transition: var(--transitions);
}

.menu__category--orange {
  color: var(--primary2-color);
}

.banner {
  position: relative;
  padding: 16px;
  width: 100%;
  overflow: hidden;
}

.banner--big {
  height: 132px;
}

.banner--small {
  height: 165px;
  width: calc(100% - 48px);
  margin: 0 24px;
}

.banner--title {
  margin-bottom: 8px;
}

.banner__name {
  position: relative;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  z-index: 5;
  transition: var(--transitions);
}

.banner:hover .banner__name {
  color: var(--hover-link);
}

.banner__img {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
  visibility: visible;
}

.menu__banner {
  height: 124px;
  width: 100%;
  opacity: 1;
  visibility: visible;
  position: relative;
}

.menu__banner-link {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 5;
}

.banner__background {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.3);
  z-index: 5;
}

.banner__name {
  font-weight: 600;
  color: #404040;
  z-index: 10;
  transition: var(--transitions);
}

.banner__name--white {
  color: #FFFFFF;
}

.menu__category--title {
  font-weight: 600;
  margin-bottom: 8px;
}

.menu__category:hover {
  color: var(--primary2-color);
  transition: color .3s;
}

.menu__category:hover .menu__imagebox {
  opacity: 1;
}

.menu__category:hover .menu__name {
  color: var(--hover-link);
  transition: var(--transitions);
}

.menu__subcategory {
  padding: 8px 24px;
  font-size: 16px;
  line-height: 24px;
  transition: var(--transitions);
}

.menu__subcategory:last-of-type {
  margin-bottom: 16px;
}

.menu__subcategory:hover {
  background-color: #F7F7F7;
  color: var(--hover-link);
  transition: var(--transitions);
}

.menu__link {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  cursor: pointer;
}

.stocks {
  position: relative;
}

.stocks--big {
  display: none;
}

.stock__wrapper {
  display: none;
  flex-wrap: wrap;
}

.stock__wrapper.stock__active {
  display: flex;
}

.stock__item {
  display: flex;
  flex-direction: column;
  margin-bottom: 16px;
  margin-right: 48px;
}

.stock__item span {
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  display: flex;
  align-items: center;
}

.stock__item span::before {
  content: '';
  display: block;
  margin: 0 8px 0 0;
  width: 10px;
  height: 10px;
  position: relative;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.stock__item .text-orange {
  color: #FF8F0C;
}

.stock__item .text-orange::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2712%27 height=%2711%27 viewBox=%270 0 12 11%27 fill=%27none%27%3E%3Cscript xmlns=%27%27/%3E%3Cpath d=%27M0 9.92192C0.1764 9.64933 0.3596 9.38016 0.528 9.10301C2.224 6.31675 3.918 3.52936 5.6112 0.740823C5.698 0.598074 5.7916 0.465196 5.9828 0.462918C6.1836 0.46064 6.2796 0.598833 6.37 0.748036C8.2092 3.77651 10.0508 6.80384 11.8932 9.8308C11.9216 9.87788 11.9644 9.91698 12.0004 9.95988C12.0004 10.0612 12.0004 10.1626 12.0004 10.2636C11.8496 10.4318 11.6548 10.4629 11.4308 10.4625C7.798 10.4584 4.1652 10.4584 0.5328 10.4622C0.3312 10.4625 0.1524 10.4314 0.0004 10.3016C0 10.1751 0 10.0487 0 9.92192Z%27 fill=%27%23FF8F0C%27/%3E%3Cscript xmlns=%27%27/%3E%3C/svg%3E");
}

.stock__item .text-green {
  color: #079D16;
}

.stock__item .text-green::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2710%27 height=%2711%27 viewBox=%270 0 10 11%27 fill=%27none%27%3E%3Cscript xmlns=%27%27/%3E%3Cg clip-path=%27url%28%23clip0_3745_10581%29%27%3E%3Cpath d=%27M5.33496 10.4648C5.11069 10.4648 4.88642 10.4648 4.66215 10.4648C4.50437 10.4422 4.34611 10.4219 4.18905 10.3962C2.16221 10.0626 0.560547 8.54483 0.118758 6.53428C0.0657625 6.29341 0.038783 6.04699 0 5.80299C0 5.57874 0 5.35449 0 5.13024C0.0226435 4.97271 0.0421555 4.81446 0.0681714 4.65741C0.524414 1.89847 3.14769 0.0461758 5.88996 0.546465C8.68258 1.05591 10.5232 3.7922 9.86679 6.55331C9.37128 8.63708 8.01845 9.90575 5.92513 10.3742C5.73146 10.4178 5.53176 10.4352 5.33496 10.4648Z%27 fill=%27%23079D16%27/%3E%3Cpath d=%27M4.61245 6.45419C5.14915 5.91946 5.67693 5.39412 6.204 4.8683C6.47042 4.60262 6.7354 4.33525 7.00206 4.06957C7.18249 3.88988 7.41567 3.87784 7.57682 4.03777C7.73821 4.19795 7.7281 4.43256 7.54839 4.61249C6.67132 5.49047 5.79376 6.3682 4.91548 7.24497C4.7235 7.43646 4.50501 7.4367 4.31447 7.24666C3.81848 6.75191 3.32297 6.25644 2.82819 5.76048C2.65451 5.58633 2.64463 5.35389 2.80097 5.19444C2.96019 5.03185 3.19699 5.04076 3.37573 5.21925C3.75826 5.60103 4.13934 5.98425 4.52115 6.36676C4.55126 6.39711 4.58282 6.42577 4.61245 6.45419Z%27 fill=%27white%27/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%27clip0_3745_10581%27%3E%3Crect width=%2710%27 height=%2710%27 fill=%27white%27 transform=%27translate%280 0.462891%29%27/%3E%3C/clipPath%3E%3C/defs%3E%3Cscript xmlns=%27%27/%3E%3C/svg%3E");
}

.stock__item .text-red {
  color: #FF3D12;
}

.stock__item .text-red::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2710%27 height=%2711%27 viewBox=%270 0 10 11%27 fill=%27none%27%3E%3Cscript xmlns=%27%27/%3E%3Cg clip-path=%27url%28%23clip0_3745_15102%29%27%3E%3Cpath d=%27M5.35563 10.4629C5.12229 10.4629 4.88895 10.4629 4.6556 10.4629C4.6139 10.4562 4.5723 10.4469 4.53037 10.4431C4.01942 10.3969 3.5276 10.2724 3.05658 10.0708C2.20496 9.70619 1.50382 9.14947 0.958948 8.39995C0.434763 7.67902 0.126347 6.87376 0.0323653 5.98695C0.0212432 5.88237 0.0107884 5.77779 0 5.67321C0 5.53248 0 5.39163 0 5.25089C0.00478251 5.22196 0.0123455 5.19315 0.0141251 5.164C0.0470465 4.59838 0.173394 4.05413 0.393389 3.53245C1.121 1.80712 2.79109 0.540931 4.84635 0.466168C5.39077 0.446364 5.92664 0.516232 6.44715 0.678107C7.65045 1.05259 8.58883 1.77619 9.25838 2.84345C9.69915 3.54603 9.93994 4.3168 9.99277 5.14275C10.0096 5.40587 9.99422 5.6721 9.97798 5.936C9.95618 6.29234 9.87821 6.63957 9.76899 6.97923C9.48694 7.85658 9.00157 8.60299 8.31044 9.21188C7.531 9.89877 6.62355 10.3055 5.5912 10.4308C5.51256 10.4404 5.43415 10.4521 5.35563 10.4629Z%27 fill=%27%23FF3D12%27/%3E%3Cpath d=%27M5.00454 6.06122C4.98563 6.07869 4.96917 6.09282 4.95382 6.10817C4.46133 6.60047 3.96896 7.09289 3.47658 7.58519C3.37837 7.68342 3.31075 7.68376 3.21254 7.58574C3.1011 7.47449 2.98988 7.36312 2.87877 7.25165C2.78846 7.16097 2.78823 7.0891 2.87799 6.99932C3.37281 6.50413 3.86719 6.00849 4.36357 5.51485C4.4045 5.47413 4.40216 5.45377 4.3629 5.41461C3.86919 4.92353 3.37726 4.43068 2.88489 3.93826C2.78623 3.83958 2.78579 3.77172 2.88344 3.67392C2.996 3.56122 3.10844 3.44841 3.22155 3.33627C3.30675 3.25182 3.38193 3.25171 3.46624 3.33604C3.96017 3.82957 4.45377 4.32332 4.94748 4.81695C5.00343 4.8728 5.00343 4.8728 5.05737 4.81884C5.54852 4.32788 6.03967 3.8368 6.53082 3.34583C6.6287 3.24804 6.69677 3.24793 6.7952 3.34594C6.90809 3.45831 7.02098 3.57068 7.1332 3.6836C7.21717 3.76816 7.21684 3.84392 7.13231 3.92847C6.63615 4.42489 6.14022 4.92164 5.64261 5.41672C5.60524 5.45399 5.60313 5.47402 5.64172 5.5124C6.13521 6.0037 6.62703 6.49667 7.11918 6.98931C7.22218 7.09244 7.22206 7.15797 7.11863 7.26144C7.0073 7.3728 6.89619 7.48428 6.78474 7.59542C6.7001 7.67975 6.62559 7.67975 6.54072 7.59487C6.04557 7.10001 5.55063 6.60492 5.05559 6.10995C5.04013 6.0946 5.024 6.0798 5.00454 6.06122Z%27 fill=%27white%27/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%27clip0_3745_15102%27%3E%3Crect width=%2710%27 height=%2710%27 fill=%27white%27 transform=%27translate%280 0.462891%29%27/%3E%3C/clipPath%3E%3C/defs%3E%3Cscript xmlns=%27%27/%3E%3C/svg%3E");
}

.stock__item .text-blue {
  color: #0356D2;
}

.stock__item .text-blue::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2710%27 height=%2711%27 viewBox=%270 0 10 11%27 fill=%27none%27%3E%3Cscript xmlns=%27%27/%3E%3Cpath d=%27M5.12703 10.4629C5.0372 10.4629 4.94737 10.4629 4.85766 10.4629C4.83467 10.4597 4.81169 10.4547 4.7887 10.4537C4.18605 10.4309 3.60673 10.3015 3.05181 10.0663C0.880303 9.14644 -0.353151 6.84573 0.0894293 4.52943C0.323267 3.3057 0.931433 2.29752 1.91405 1.53457C3.16063 0.566716 4.57328 0.25668 6.11292 0.595316C8.23001 1.0609 9.80707 2.89345 9.97852 5.05538C9.98556 5.14434 9.99283 5.23331 9.99998 5.32228C9.99998 5.41593 9.99998 5.50959 9.99998 5.60336C9.9967 5.62997 9.99271 5.65658 9.99013 5.68342C9.97289 5.86381 9.96503 6.04561 9.93736 6.22437C9.80531 7.07735 9.47953 7.85062 8.94232 8.5266C8.03593 9.667 6.85396 10.3075 5.4005 10.4413C5.30939 10.4496 5.21815 10.4557 5.12703 10.4629ZM7.49637 6.92262C7.47584 6.91008 7.45954 6.89965 7.44301 6.8898C6.73188 6.46794 6.02098 6.04585 5.30915 5.62528C5.26412 5.59867 5.24547 5.57054 5.24571 5.51603C5.2477 4.69248 5.24711 3.86904 5.24711 3.04548C5.24711 3.02074 5.24711 2.99613 5.24711 2.96882C4.99475 2.96882 4.74977 2.96882 4.4974 2.96882C4.4974 2.99672 4.4974 3.02145 4.4974 3.0463C4.4974 3.99469 4.49799 4.94308 4.496 5.89148C4.49588 5.94622 4.51499 5.97388 4.55979 6.00072C5.39675 6.50088 6.23277 7.00268 7.06915 7.50401C7.08569 7.51386 7.10269 7.52288 7.12333 7.53449C7.24799 7.32983 7.37147 7.1274 7.49637 6.92262Z%27 fill=%27%230356D2%27/%3E%3Cpath fill-rule=%27evenodd%27 clip-rule=%27evenodd%27 d=%27M4.30859 3.17871C4.30859 2.90257 4.53245 2.67871 4.80859 2.67871C5.08474 2.67871 5.30859 2.90257 5.30859 3.17871V5.44577L7.36994 6.67574C7.60353 6.81511 7.68318 7.11543 7.54938 7.35225C7.41141 7.59646 7.0998 7.67978 6.85836 7.53702L4.30859 6.02935L4.30859 3.17871Z%27 fill=%27white%27/%3E%3Cscript xmlns=%27%27/%3E%3C/svg%3E");
}

.stock__item .text-gray {
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
}

.stock__item .text-gray::before {
  display: none;
}

.menu-top {
  position: absolute;
  top: calc(100% - 56px);
  left: 0;
  padding-top: 12px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  z-index: 10;
  transition: opacity .3s, visibility .3s, transform .3s;
}

.menu-top--right {
  right: auto;
  left: 0;
}

.menu-top__list {
  margin: 0;
  padding: 56px 16px 16px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background: white;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  list-style-type: none;
  border-radius: 8px;
}

.menu-top__item {
  text-decoration: none;
}

.menu-top__item:not(:last-of-type) {
  margin-bottom: 12px;
}

.menu-top__link {
  position: relative;
  color: var(--on-surface-variant);
  font-weight: 400;
  text-decoration: none;
  cursor: pointer;
  transition: .3s;
  white-space: nowrap;
  text-align: left;
  font-size: clamp(14px, 1vw, 16px);
  line-height: clamp(21px, 1.5vw, 24px);
}

.menu-top__item:hover .menu-top__link {
  color: var(--primary2-color);
  transition: .3s;
}

.menu-top__link > * {
  pointer-events: none;
}

.menu-top__icon {
  color: var(--color-alto);
  transition: var(--transition-color);
}

.auth .menu-top--right {
  right: 0;
  left: auto;
  top: 100%;
}

.auth .menu-top__list {
  padding: 16px;
}

.auth.header__item--menu:hover .auth__arrow {
  transform: rotate(-180deg);
}

.auth .menu-top__link {
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
}

.search {
  position: relative;
  height: 100%;
  width: 100%;
  max-width: 670px;
  margin-right: clamp(20px, 1.5vw, 40px);
}

.search--active {
  z-index: auto;
}

.search__input {
  height: 100%;
  width: 100%;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  padding: 8px 48px;
  background: var(--on-primary-color);
  transition: var(--transitions);
  border-radius: 8px;
  width: clamp(245px, 28vw, 520px);
  border: 2px solid var(--primary2-color);
}

.search__input:focus {
  border-color: var(--primary2-color);
}

.search__input::-moz-placeholder {
  color: #888;
  -moz-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.search__input::placeholder {
  color: #888;
  transition: opacity 0.3s ease;
}

.search__input::-moz-placeholder {
  color: var(--on-background-color);
  font-size: clamp(14px, 1vw, 16px);
  line-height: clamp(21px, 1.5vw, 24px);
  font-weight: 400;
  font-family: var(--font-family);
  opacity: 0.5;
}

.search__input::placeholder {
  color: var(--on-background-color);
  font-size: clamp(14px, 1vw, 16px);
  line-height: clamp(21px, 1.5vw, 24px);
  font-weight: 400;
  font-family: var(--font-family);
  opacity: 0.5;
}

.search--active .search__input {
  background: #F7F7F7;
  border-radius: 8px 8px 0 0;
}

.search__input:focus-visible {
  background: #F7F7F7;
}

.search--active .search__icon {
  color: var(--hover-link);
}

.search--active .search__zoom {
  opacity: 1;
  visibility: visible;
}

.search__icon {
  position: absolute;
  top: 50%;
  left: 16px;
  bottom: 0;
  color: #8C8C8C;
  transform: translateY(-50%);
  transition: var(--transitions);
}

.search__zoom {
  position: absolute;
  top: 50%;
  right: 8px;
  padding: 6px 12px;
  border-radius: 32px;
  font-size: 14px;
  line-height: 20px;
  color: #FFFFFF;
  background: #272727;
  opacity: 0;
  transform: translateY(-50%);
  transition: var(--transitions);
  cursor: pointer;
  visibility: hidden;
  display: none;
}

.search__zoom:hover {
  background: var(--primary2-color);
  transition: background 0.3s ease;
}

.search__card {
  width: 100%;
  position: absolute;
  z-index: 2;
  left: 0;
  top: 100%;
  background: white;
  box-shadow: 0px 4px 12px 0px #00000040;
  border-radius: 0 0 8px 8px;
}

.search__item {
  display: flex;
  align-items: center;
  padding: 16px 0;
  margin: 0 16px;
  position: relative;
}

.search__link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}

.search__imgbox {
  position: relative;
  width: 72px;
  height: 72px;
  margin-right: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.search__img {
  position: relative;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  opacity: 1;
  z-index: 5;
}

.search__empty {
  position: relative;
  background: #FFFFFF;
  z-index: 5;
}

.search__content {
  flex: 1;
}

.search__name {
  font-size: 16px;
  line-height: 24px;
  overflow: hidden;
  transition: var(--transitions);
}

.search__name:hover {
  color: var(--hover-link);
}

.search__prices {
  display: flex;
  align-items: center;
  margin-top: 8px;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}

.search__price {
  margin-right: 8px;
}

.search__oldprice {
  -webkit-text-decoration-line: line-through;
          text-decoration-line: line-through;
  color: #8C8C8C;
}

.search__text {
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  color: var(--primary2-color);
  cursor: pointer;
  transition: var(--transitions);
  display: flex;
  align-items: center;
  gap: 8px;
}

.search__count {
  font-size: 12px;
  line-height: 16px;
}

.search__bottom {
  padding: 16px 0;
  margin: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #D9D9D9;
}

.search__overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: -1;
  display: none;
  cursor: pointer;
}

.search--active .search__overlay {
  display: block;
}

.notification {
  position: fixed;
  top: 48px;
  right: 48px;
  min-width: 320px;
  z-index: 15;
}

.notification__item {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 24px;
  height: auto;
  min-height: 60px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: calc(100vw - 92px);
  background: var(--on-primary-color);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
  border-radius: 8px;
  -webkit-animation: slide-in 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
          animation: slide-in 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

@-webkit-keyframes slide-out {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(100%);
  }
}

@keyframes slide-out {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(100%);
  }
}

@-webkit-keyframes slide-in {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

@keyframes slide-in {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

.notification__header {
  font-size: 16px;
  color: var(--black-color);
}

.notification__link {
  font-size: 16px;
  color: var(--primary2-color);
}

.price-badge {
  display: flex;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: 100%;
  color: #fff;
  overflow: hidden;
  width: 100%;
  justify-content: space-between;
}

.price-badge svg {
  color: #FF2E00;
  position: absolute;
  left: 0;
  top: 0;
}

.price-badge__percent {
  height: 24px;
  display: flex;
  position: relative;
  width: 62px;
}

.price-badge__number {
  padding: 1px 0px;
  font-size: 12px;
  line-height: 18px;
  color: #141414;
}

.price-badge__number span {
  color: #FF2E00;
  opacity: 0.8;
  font-weight: 600;
  margin-right: 4px;
}

.price-badge__text {
  color: #fff;
  position: absolute;
  right: 12px;
  top: 4px;
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
}

.product .price-badge {
  width: auto;
}

.product .price-badge span {
  background-color: #FF2E00;
  margin: 0 -1px;
  padding: 4px 0;
  font-size: 18px;
  line-height: 28px;
  height: 100%;
}

.product .price-badge svg {
  position: relative;
}

.prices {
  position: relative;
}

.prices__group {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.prices__price {
  font-weight: 600;
  margin-right: 16px;
}

.prices__price--big {
  font-size: 32px;
  line-height: 36px;
}

.prices__price--middle {
  font-size: 24px;
  line-height: 32px;
}

.prices__price--small {
  font-size: 12px;
  line-height: 16px;
}

.prices__block {
  display: flex;
  align-items: center;
  height: 24px;
  margin-bottom: 8px;
}

.prices__block--big {
  margin-bottom: 12px;
}

.prices__old {
  font-weight: 400;
  color: #141414;
  text-decoration: line-through;
}

.prices__old--big {
  font-size: 16px;
  line-height: 32px;
}

.prices__old--middle {
  font-size: 12px;
  line-height: 16px;
}

.prices__price--red {
  color: #FF1900;
}

.prices__old--small {
  font-size: 12px;
  line-height: 16px;
}

.prices__pretext {
  margin-right: 8px;
  font-size: 16px;
  line-height: 24px;
}

.price-text {
  font-size: 18px;
  line-height: 28px;
  display: flex;
  gap: 4px;
}

.price-text__number {
  font-size: 20px;
  line-height: 32px;
  text-decoration: line-through;
}

.select-box {
  position: relative;
  width: 100%;
  display: none;
}

.select-box--mt {
  margin-top: 10px;
}

.select-box--visible {
  display: block;
}

.select-box--active {
  z-index: 30;
}

.select-box__hidden {
  position: absolute;
  pointer-events: none;
  opacity: 0;
  max-width: 100%;
  z-index: -1;
}

.select-box__label {
  position: relative;
}

.select-box__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 10px;
  height: 100%;
  width: 100%;
  border: 0.69px solid rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  transition: background-color .3s;
  cursor: pointer;
}

.select-box__content > * {
  pointer-events: none;
}

.select-box__header {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.select-box__arrow {
  display: flex;
  align-items: center;
  transition: .3s;
}

.select-box--active .select-box__arrow {
  transform: rotate(-180deg);
  transition: .3s;
}

.select-box__dropdown {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: 100%;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  opacity: 0;
  visibility: hidden;
  max-height: 246px;
  overflow: auto;
  scrollbar-width: 0px;
}

.select-box__dropdown::-webkit-scrollbar {
  display: none;
}

.select-box--active .select-box__dropdown {
  opacity: 1;
  visibility: visible;
  z-index: 5;
}

.select-box__item {
  padding: 8px 10px;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  transition: color;
  cursor: pointer;
}

.select-box__item:hover {
  background-color: #EAE6E0;
}

.select-box__item:not(:last-of-type) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.select-box__item--active {
  position: relative;
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20x%3D%220.5%22%20y%3D%220.5%22%20width%3D%2215%22%20height%3D%2215%22%20rx%3D%227.5%22%20stroke%3D%22%23FF6B00%22%2F%3E%3Cpath%20d%3D%22M12.125%205.62598L7.3767%2010.3732L4.49494%207.49145%22%20stroke%3D%22%23FF6B00%22%2F%3E%3C%2Fsvg%3E");
  background-position: right 12px top 12px;
  background-repeat: no-repeat;
}

.select-box__item--disabled {
  color: #B7B7B7;
  background: #F7F7F7;
  pointer-events: none;
}

.sidebar-block {
  width: 360px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.sidebar__banners {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-left: 40px;
}

.sidebar__banner {
  position: relative;
}

.sidebar__banner a {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.sidebar__banner img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.sidebar {
  position: relative;
  width: 360px;
  background: white;
  padding-bottom: 28px;
}

.sidebar--opposite {
  order: 1;
}

.sidebar--empty {
  width: 0;
}

.sidebar--empty .sidebar__reset {
  display: none;
}

.sidebar--right {
  position: absolute;
  right: 0;
  top: 0;
}

.sidebar--slidebar {
  width: 456px;
}

.sidebar__col {
  position: relative;
  width: 360px;
  margin: 0 20px;
}

.sidebar__col:nth-child(2) {
  margin-left: 0;
}

.sidebar__col:nth-child(4) {
  margin-right: 0;
}

.sidebar__line {
  position: absolute;
  right: -20px;
  top: 40px;
  width: 1px;
  height: calc(100% - 80px);
  background: #D9D9D9;
}

.sidebar__reset {
  padding: 0 40px;
  margin-top: 40px;
  cursor: pointer;
}

.sidebar__button {
  position: relative;
  height: 42px;
}

.sidebar__button > * {
  pointer-events: none;
}

.sidebar__button:hover .sidebar__text {
  opacity: 1;
  transform: translateX(-60px);
  transition: .2s ease-in-out;
}

.sidebar__button:hover .sidebar__circle {
  transform: translateX(118px);
  transition: .2s ease-in-out;
}

.sidebar__text {
  font-weight: 600;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: 24px;
  opacity: 0;
  transition: .2s ease-in-out;
}

.sidebar__circle {
  width: 42px;
  height: 42px;
  background: #272727;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  transition: .2s ease-in-out;
}

.sidebar__clear {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.sidebar__clear > * {
  pointer-events: none;
}

.sidebar__text1 {
  font-weight: 600;
  margin-right: 8px;
}

.sidebar__circle1 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  background: #272727;
  border-radius: 100%;
}

.interm__toggle {
  display: none;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 21px;
  padding: 16px 24px;
  width: 100%;
  cursor: pointer;
  position: relative;
}

.interm__toggle::after {
  content: '';
  position: absolute;
  width: calc(100% - 30px);
  height: 1px;
  background: var(--primary-container);
  bottom: 0;
}

.interm__toggle .sideblock__icon {
  transform: rotate(0deg);
}

.interm__toggle.active .sideblock__icon {
  transform: rotate(180deg);
}

.slidebar {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  overflow: scroll;
  z-index: 10;
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.slidebar--active {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.slidebar__footer {
  padding: 0 40px;
  margin-top: 40px;
}

.modalbar {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  overflow: scroll;
  z-index: 10;
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.modalbar--active {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.modalbar__content {
  width: 1192px;
  margin: 80px auto;
  padding: 24px 16px;
  display: flex;
  flex-wrap: wrap;
}

.modalbar__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 600;
  margin-bottom: 8px;
  width: 100%;
  padding: 0 40px;
}

.modalbar__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 8px;
  width: 100%;
  padding: 24px 40px;
}

.modalbar__close {
  cursor: pointer;
}

.modalbar__close > * {
  pointer-events: none;
}

.modalbar__reset {
  width: 260px;
  margin: 0;
  padding: 0;
}

.butn {
  display: block;
  position: relative;
  padding: 12px 24px 12px 16px;
  border-radius: 8px;
  text-decoration: none;
  cursor: pointer;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  overflow: hidden;
  color: #FFF;
  background: #1D7F88;
  transition: all .3s ease-Out;
}

.butn--bordered {
  border: 2px solid #1D7F88;
  background: transparent;
  color: #1D7F88;
  padding: 10px 22px;
}

.butn > * {
  pointer-events: none;
}

.butn--absolute {
  position: absolute;
  left: 0;
  top: 0;
}

.butn--orange {
  background: #FF6B00;
  border: 2px solid #FF6B00;
  color: white;
  transition: all .5s ease-Out;
}

.butn--orange:hover {
  border-color: #FF8933;
  transition: all .5s ease-Out;
}

.butn--big {
  padding: 14px 32px;
  font-size: 16px;
  line-height: 24px;
}

.butn--full {
  width: 100%;
}

.butn--hidden {
  visibility: hidden;
  opacity: 0;
}

.butn--active {
  visibility: visible;
  opacity: 1;
}

.product-thumb__buttons:has(.pnotice__buttonView) .butn--hidden {
  opacity: 0;
  visibility: hidden;
}

.butn--gray {
  border: 2px solid #A1A1A1;
  color: #A1A1A1;
}

.butn--disabled {
  color: #FFF;
  pointer-events: none;
}

.butn--thin {
  border-width: 1px;
  font-size: 14px !important;
  line-height: 24px !important;
}

.butn:hover .butn__circle {
  width: 200%;
  height: 500%;
  opacity: 1;
  top: -200%;
  left: -50%;
}

.butn:hover {
  background-color: var(--primary3-color);
  color: white;
  transition: all .3s ease-Out;
}

.butn--bordered:hover {
  background-color: var(--primary3-color);
  border-color: var(--primary3-color);
  color: white;
  transition: all .3s ease-Out;
}

.butn__circle {
  display: none;
  width: 0%;
  height: 0%;
  opacity: 0;
  border-radius: 48px;
  background: #141414;
  position: absolute;
  transition: all .5s ease-Out;
  top: 50%;
  left: 50%;
}

.butn__circle--orange {
  background: #FF8933;
}

.butn__text {
  position: relative;
  z-index: 2;
  text-align: center;
  white-space: nowrap;
}

.butn--buy .butn__text,
.butn--article .butn__text,
.button-main--buy .butn__text {
  display: flex;
  align-items: center;
  gap: 8px;
}

.butn-round {
  width: 40px;
  height: 40px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #D9D9D9;
  cursor: pointer;
}

.butn-round > * {
  pointer-events: none;
}

.buttons {
  position: relative;
  display: flex;
}

.buttons__button {
  position: relative;
  color: #C6C6C6;
  transition: .3s;
  cursor: pointer;
  z-index: 2;
}

.buttons__button:not(:last-of-type) {
  margin-right: 4px;
}

.buttons__button.buttons__button--active {
  fill: var(--primary2-color);
  color: var(--primary2-color);
}

.buttons__button--compare:hover {
  color: var(--primary2-color);
}

.buttons__button--favorite:hover {
  color: var(--primary2-color);
}

.buttons__button--share:hover ~ .share {
  visibility: visible;
  opacity: 1;
  transform: translateY(-18px);
  transition: .3s ease-in-out;
}

.buttons__button--share path {
  transition: .3s;
}

.buttons__button--share:hover path:first-child {
  stroke: var(--primary2-color);
  transition: .3s;
}

.buttons__button--share:hover path:last-child {
  fill: var(--primary2-color);
  transition: .3s;
}

.buttons__button > * {
  pointer-events: none;
}

.sidecats {
  position: relative;
}

.sidecats__item {
  display: flex;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 8px;
  transition: .3s;
}

.sidecats__item:hover {
  color: var(--primary2-color);
  transition: .3s;
}

.sidecats__item:hover .sidecats__icon {
  fill: var(--primary2-color);
  transition: .3s;
}

.sidecats__item:last-child {
  margin-bottom: 0;
}

.sidecats__item--curr {
  color: var(--primary2-color);
  margin-left: 24px;
}

.sidecats__item--sub {
  margin-left: 40px;
}

.sidecats__icon {
  margin-right: 8px;
  transition: .3s;
}

.block {
  position: relative;
  width: 100%;
}

.block:hover .block-action {
  opacity: 1;
  visibility: visible;
}

.block--flexnr {
  display: flex;
}

.block--flex {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}

.block--categories {
  border-left: 1px solid #DDDDDD;
  border-top: 1px solid #DDDDDD;
}

.block--flex1 {
  flex: 1;
}

.block--flexwrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.block--absolute {
  position: absolute;
  top: 0;
  left: 0;
}

.block--marginUp54 {
  margin-top: 54px;
}

.block--marginDown54 {
  margin-bottom: 54px;
}

.block__content {
  position: relative;
  max-width: 1600px;
  padding: 0 24px;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}

.block__content:has(.swiper-thumbs) {
  padding: 0;
}

.block__content--noPadding {
  padding: 0;
}

.block__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1328px;
  margin: 80px auto 40px;
  width: 100%;
}

.block__header--full {
  width: 100%;
}

.block__header--padded {
  padding-right: 40px;
}

.block__header--dark {
  background: #976534;
  color: white;
  padding-right: 40px;
}

.block__header--nobkg {
  background: none;
}

.block__title {
  font-size: 40px;
  font-weight: 600;
  line-height: 44px;
}

.block__title--full {
  width: 100%;
}

.block__title--nobackground {
  background-color: unset;
}

.block__grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  border: 1px solid #DDDDDD;
  grid-gap: 1px;
  background-color: #DDDDDD;
}

.block__link {
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  font-size: 20px;
  transition: .3s;
}

.block__link:hover {
  color: #976534;
  transition: .3s;
}

.block__ico {
  margin-right: 12px;
}

.block__flex {
  display: flex;
  justify-content: space-between;
}

.block__none {
  padding: 0 40px;
  margin-bottom: 40px;
}

.breadcrumbs {
  display: flex;
  align-items: center;
  overflow-x: scroll;
  scrollbar-width: none;
  max-width: 1550px;
  margin: 0 auto;
  width: 100%;
}

.breadcrumbs::-webkit-scrollbar {
  display: none;
}

.breadcrumbs--nopading {
  padding-left: 0;
  padding-right: 0;
}

.breadcumbs__wrapper {
  display: flex;
  align-items: center;
  max-width: -webkit-max-content;
  max-width: -moz-max-content;
  max-width: max-content;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  padding: 6px 16px;
  background-color: var(--primary-container);
  border-radius: 8px;
  margin: 24px 16px;
}

.breadcrumbs__item {
  margin-right: 8px;
  display: flex;
  align-items: center;
  position: relative;
  z-index: 5;
  min-width: -webkit-max-content;
  min-width: -moz-max-content;
  min-width: max-content;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}

.breadcrumbs__link {
  display: flex;
  font-size: 16px;
  line-height: 24px;
  color: #8C8C8C;
  text-decoration: none;
  margin-left: 8px;
  font-weight: 400;
  transition: .3s;
  color: var(--primary3-color);
  opacity: .6;
}

.breadcrumbs__link--first {
  margin-left: 0;
}

.breadcrumbs__link:hover {
  opacity: 1;
  transition: .3s;
}

.breadcrumbs__link--active {
  opacity: 1;
}

.breadcrumbs__back {
  margin-left: auto;
  display: flex;
  align-items: center;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: var(--primary3-color);
  cursor: pointer;
  display: none;
}

.breadcrumbs__back > * {
  pointer-events: none;
}

.title {
  padding: 16px 0;
  display: flex;
  align-items: flex-end;
  width: 100%;
}

.title--search {
  display: flex;
  align-items: flex-end;
}

.title-nopadding {
  padding: 0;
}

.title__title {
  font-weight: 600;
  font-size: 32px;
  line-height: 40px;
  margin: 0;
}

.title__title--search {
  display: flex;
  align-items: flex-end;
}

.title__count {
  display: flex;
  align-items: center;
  margin: 0 0 5px 17px;
  font-size: 12px;
  line-height: 16px;
  color: #8C8C8C;
}

.title__right {
  display: flex;
  margin-left: auto;
}

.subcats {
  width: 100%;
  margin: 40px 40px 24px 40px;
}

.subcats__content {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.subcats__content--show .subcats__item--hidden {
  display: flex;
}

.subcats__item {
  padding: 8px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  background: white;
  border: 1px solid #00000033;
  border-radius: 8px;
  transition: .3s;
}

.subcats__item--4 {
  width: calc(100%/4);
}

.subcats__item--hidden {
  display: none;
}

.subcats__item:nth-child(1) {
  border-top: 1px solid #D9D9D9;
}

.subcats__item:nth-child(2) {
  border-top: 1px solid #D9D9D9;
}

.subcats__item:nth-child(3) {
  border-top: 1px solid #D9D9D9;
}

.subcats__item:hover {
  background: var(--primary-container);
  transition: .3s;
  border-color: var(--primary2-color);
}

.subcats__item:hover .subcats__title {
  color: var(--primary2-color);
  transition: .3s;
}

.subcats__title {
  padding-right: 16px;
  font-weight: 400;
  font-size: 16px;
}

.subcats__count {
  font-size: 12px;
  line-height: 12px;
  color: var(--black2-color);
}

.subcats__link {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.subcats__more {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 16px 0 0 auto;
}

.subcats__more .button-word__text,
.subcats__more .button-word__icon {
  color: var(--primary-color);
}

.category {
  width: 100%;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  margin-bottom: 80px;
  max-width: 1550px;
  padding: 0 24px;
  margin: 0 auto;
}

.category__title {
  padding: 16px 40px;
  max-width: 1600px;
  margin: auto;
}

.category__content {
  padding: 0;
  position: relative;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  transition: .5;
}

.category__content--loading {
  opacity: .5;
  transition: .5;
}

.category__loader {
  top: 180px;
  left: 0;
  right: 0;
  z-index: 1;
}

.subfilter {
  display: flex;
  flex-wrap: wrap;
  padding: 0 40px;
}

.subfilter__button {
  background: #EFEFEF;
  font-weight: 600;
  font-size: 12px;
  line-height: 16px;
  padding: 8px 24px 8px 16px;
  display: flex;
  align-items: center;
  margin-right: 24px;
  cursor: pointer;
}

.subfilter__button > * {
  pointer-events: none;
}

.subfilter__icon {
  margin-right: 8px;
}

.subfilter__item {
  position: relative;
  display: flex;
  align-items: center;
  font-size: 12px;
  line-height: 16px;
  border-bottom: 1px solid #D9D9D9;
  margin-right: 24px;
  height: 41px;
  cursor: pointer;
}

.subfilter__item:hover .subfilter__dropdown {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.subfilter__svg {
  margin-left: 8px;
}

.subfilter__svg--opposite {
  transform: rotate(180deg);
}

.subfilter__dropdown {
  position: absolute;
  left: -16px;
  top: 0;
  z-index: 3;
  padding: 0 16px 16px 16px;
  background: white;
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25);
  min-width: calc(100% + 32px);
  visibility: hidden;
  opacity: 0;
  cursor: default;
  transition: .3s;
}

.subfilter__dropdown--range {
  padding-bottom: 24px;
}

.subfilter__title {
  display: flex;
  align-items: center;
  font-size: 12px;
  line-height: 16px;
  height: 41px;
  border-bottom: 1px solid #D9D9D9;
  margin-bottom: 8px;
  cursor: pointer;
}

.sort {
  position: relative;
  display: flex;
  align-items: center;
  z-index: 3;
}

.sort__box {
  position: relative;
}

.sort__dropdown {
  position: absolute;
  padding: 5px 16px 16px 16px;
  border-radius: 8px;
  left: -16px;
  top: 5px;
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25);
  visibility: hidden;
  opacity: 0;
  background: white;
  transition: .2s;
}

.sort__dropdown--active {
  transform: translateY(-10px);
  visibility: visible;
  opacity: 1;
  transition: .2s;
}

.sort__selected {
  display: flex;
  align-items: center;
  font-size: 16px;
  line-height: 32px;
  position: relative;
  cursor: pointer;
}

.sort__header {
  display: flex;
  align-items: center;
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  padding: 3px 0;
  position: relative;
  cursor: pointer;
  white-space: nowrap;
}

.sort__header--inner {
  margin-bottom: 16px;
}

.sort__header > * {
  pointer-events: none;
}

.sort__item {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-items: center;
  font-size: 12px;
  line-height: 16px;
  position: relative;
  cursor: pointer;
  margin-bottom: 12px;
  white-space: nowrap;
}

.sort__item:last-of-type {
  margin-bottom: 0;
}

.sort__item > * {
  pointer-events: none;
}

.sort__item a {
  transition: .3s;
}

.sort__item:hover a {
  color: var(--grey2-color);
  opacity: 1;
  transition: .3s;
}

.sort__item--active a {
  opacity: 1;
  font-weight: 600;
  color: var(--primary2-color);
  transition: .3s;
}

.sort__item--active {
  pointer-events: none;
}

.sort__arrow {
  margin-left: 8px;
  transform: rotate(0deg);
  transition: .3s;
}

.sort__arrow--active {
  transform: rotate(180deg);
  transition: .3s;
}

.sort__item--active .sort__icon {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.sort__icon {
  visibility: hidden;
  opacity: 0;
  margin-left: 8px;
  transition: .3s;
}

.sort__icon-mobile {
  width: 24px;
  height: 24px;
  margin-right: 8px;
}

.view {
  display: flex;
  align-items: center;
  margin-left: auto;
}

.view__item {
  cursor: pointer;
  margin-right: 24px;
  transition: .3s;
}

.view__item:last-of-type {
  margin-right: 0;
}

.view__item > * {
  pointer-events: none;
}

.view__item:hover {
  fill: #976534;
  transition: .3s;
}

.view__item--active {
  fill: #976534;
  pointer-events: none;
  transition: .3s;
}

.indicate {
  width: 100%;
  display: flex;
  align-items: flex-start;
  padding: 0px 40px 0px 40px;
}

.indicate__content {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 24px 40px 16px 0px;
  flex: 1;
}

.indicate__item {
  margin: 0 16px 0 0;
}

.indicate__item > * {
  pointer-events: none;
}

.indicate__reset {
  padding: 24px 0 16px;
}

.indicate__reset .button-word__text,
.indicate__reset .button-word__icon {
  color: var(--black-color);
}

.checkbox {
  position: relative;
  display: flex;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  white-space: nowrap;
}

.checkbox__item {
  position: relative;
  display: flex;
}

.checkbox__input {
  position: absolute;
  margin: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.checkbox__checkbox {
  width: 20px;
  height: 20px;
  background: var(--surface-variant);
  margin-right: 8px;
  border-radius: 4px;
}

.checkbox__icon {
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.checkbox__input:checked ~ .checkbox__checkbox .checkbox__icon {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.checkbox__color {
  width: 20px;
  height: 20px;
  border-radius: 100%;
  border: 1px solid rgba(64, 64, 4, 0.1);
  margin-right: 8px;
}

.radio {
  position: relative;
  display: flex;
  align-items: center;
}

.radio__input {
  position: absolute;
  margin: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.radio__radio {
  width: 20px;
  height: 20px;
  border-radius: 100%;
  background: #EFEFEF;
  margin-right: 8px;
}

.radio__icon {
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.radio__input:checked ~ .radio__radio .radio__icon {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.range {
  width: 100%;
  position: relative;
}

.range__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.range__item {
  width: 120px;
  height: 40px;
  padding: 12px 16px;
  font-size: 12px;
  line-height: 16px;
  border: 1px solid #D9D9D9;
}

.range__item::-moz-placeholder {
  opacity: 0.5;
}

.range__item::placeholder {
  opacity: 0.5;
}

.range__item:last-of-type {
  margin-right: 0;
}

.range__separator {
  fill: #202124;
  opacity: 0.3;
}

.range__slider {
  margin: 40px 0 0 0;
  display: none;
}

.rating {
  color: #8C8C8C;
  display: flex;
  align-items: center;
  height: 24px;
}

.rating__rating {
  display: flex;
  align-items: center;
}

.rating__star {
  margin-right: 4px;
}

.rating__line {
  margin: 0 18px;
}

.rating__reviews {
  color: #8C8C8C;
  transition: .3s;
}

.rating__reviews:hover {
  color: #976534;
  transition: .3s;
}

/* critical:ens */

.about {
  padding: 0 40px;
}

.about--top {
  margin: 8px 0 56px 0;
}

.about--bottom {
  margin: 80px 0;
}

.about--double {
  -moz-columns: 2;
       columns: 2;
  -moz-column-gap: 45px;
       column-gap: 45px;
}

.about p:first-of-type {
  margin-top: 0;
}

.about h2 {
  font-size: 20px;
  font-weight: 600;
  line-height: 32px;
  margin-bottom: 16px;
}

.about a {
  color: #976534;
  display: inline;
  border-bottom: 1px solid transparent;
  transition: .3s;
}

.about a:hover {
  color: #976534;
  border-color: #976534;
  transition: .3s;
}

.about ol, .about ul {
  padding-left: 46px;
}

.about ol li {
  margin-bottom: 8px;
}

.about ul li {
  list-style: none;
  position: relative;
  margin-bottom: 8px;
}

.about ul li::after {
  content: '';
  position: absolute;
  width: 16px;
  height: 1px;
  background: #404040;
  left: -24px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.about ol li:last-of-type, .about ul li:last-of-type {
  margin-bottom: 0;
}

.about blockquote {
  padding: 16px 28px;
  margin: 0;
  background: #F7F7F7;
  font-size: 16px;
  line-height: 30px;
}

.about img {
  opacity: 1 !important;
}

.noprods {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  background: #FAFAFA;
  padding: 24px 0 56px 0;
  margin: 40px 0;
}

.noprods__title {
  font-weight: 600;
  font-size: 24px;
  line-height: 32px;
  margin-bottom: 24px;
  text-align: center;
}

.noprods__subtitle {
  font-size: 16px;
  line-height: 16px;
  white-space: nowrap;
  text-align: center;
}

.noprods__reset {
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  color: #976534;
  font-weight: 600;
  cursor: pointer;
}

.noprods__reset:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 1px;
  left: 0;
  bottom: -8px;
  background: #976534;
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.noprods__reset:hover:after {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.swiper {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
  width: 100%;
}

.swiper-no-flexbox .swiper-slide {
  float: left;
}

.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}

.swiper-android .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}

.swiper-multirow > .swiper-wrapper {
  flex-wrap: wrap;
}

.swiper-free-mode > .swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}

.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}

.swiper-slide-invisible-blank {
  visibility: hidden;
}

/* Auto Height */

.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}

.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}

/* 3D Effects */

.swiper-3d {
  perspective: 1200px;
}

.swiper-3d .swiper-wrapper,
.swiper-3d .swiper-slide,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}

.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}

.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

/* IE10 Windows Phone 8 Fixes */

.swiper-wp8-horizontal,
.swiper-wp8-horizontal > .swiper-wrapper {
  touch-action: pan-y;
}

.swiper-wp8-vertical,
.swiper-wp8-vertical > .swiper-wrapper {
  touch-action: pan-x;
}

.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: 50%;
  width: 27px;
  height: 44px;
  margin-top: -22px;
  z-index: 10;
  cursor: pointer;
  background-size: 27px 44px;
  background-position: center;
  background-repeat: no-repeat;
}

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}

.swiper-button-prev,
.swiper-rtl .swiper-button-next {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2027%2044%27%3E%3Cpath%20d%3D%27M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z%27%20fill%3D%27%23007aff%27%2F%3E%3C%2Fsvg%3E");
  left: 10px;
  right: auto;
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2027%2044%27%3E%3Cpath%20d%3D%27M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z%27%20fill%3D%27%23007aff%27%2F%3E%3C%2Fsvg%3E");
  right: 10px;
  left: auto;
}

.swiper-button-prev.swiper-button-white,
.swiper-rtl .swiper-button-next.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2027%2044%27%3E%3Cpath%20d%3D%27M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z%27%20fill%3D%27%23ffffff%27%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next.swiper-button-white,
.swiper-rtl .swiper-button-prev.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2027%2044%27%3E%3Cpath%20d%3D%27M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z%27%20fill%3D%27%23ffffff%27%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-prev.swiper-button-black,
.swiper-rtl .swiper-button-next.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2027%2044%27%3E%3Cpath%20d%3D%27M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z%27%20fill%3D%27%23000000%27%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next.swiper-button-black,
.swiper-rtl .swiper-button-prev.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2027%2044%27%3E%3Cpath%20d%3D%27M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z%27%20fill%3D%27%23000000%27%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-lock {
  display: none;
}

.swiper-pagination {
  text-align: center;
  transition: 300ms opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
}

.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}

/* Common Styles */

.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal > .swiper-pagination-bullets {
  bottom: 10px;
  left: 0;
  width: 100%;
}

/* Bullets */

.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}

.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 100%;
  background: #000;
  opacity: 0.2;
}

button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}

.swiper-pagination-bullet-active {
  opacity: 1;
  background: #007aff;
}

.swiper-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  transform: translate3d(0px, -50%, 0);
}

.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px 0;
  display: block;
}

.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}

.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  transition: 200ms transform, 200ms top;
}

.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}

.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}

.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform, 200ms left;
}

.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform, 200ms right;
}

/* Progress */

.swiper-pagination-progressbar {
  height: 4px;
  border-radius: 2px;
  background-color: #d6d7d6;
  flex: 1;
  overflow: hidden;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: #2E312C;
  border-radius: 2px;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}

.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}

.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}

.swiper-vertical > .swiper-pagination-progressbar,
.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}

.swiper-pagination-white .swiper-pagination-bullet-active {
  background: #ffffff;
}

.swiper-pagination-progressbar.swiper-pagination-white {
  background: rgba(255, 255, 255, 0.25);
}

.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill {
  background: #ffffff;
}

.swiper-pagination-black .swiper-pagination-bullet-active {
  background: #000000;
}

.swiper-pagination-progressbar.swiper-pagination-black {
  background: rgba(0, 0, 0, 0.25);
}

.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill {
  background: #000000;
}

.swiper-pagination-lock {
  display: none;
}

/* Scrollbar */

.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}

.swiper-horizontal > .swiper-scrollbar {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 50;
  height: 5px;
  width: 98%;
}

.swiper-vertical > .swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 50;
  width: 5px;
  height: 98%;
}

.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}

.swiper-scrollbar-cursor-drag {
  cursor: move;
}

.swiper-scrollbar-lock {
  display: none;
}

.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

.swiper-slide-zoomed {
  cursor: move;
}

/* Preloader */

.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  animation: swiper-preloader-spin 1s steps(12, end) infinite;
}

.swiper-lazy-preloader:after {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D%270%200%20120%20120%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20xmlns%3Axlink%3D%27http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%27%3E%3Cdefs%3E%3Cline%20id%3D%27l%27%20x1%3D%2760%27%20x2%3D%2760%27%20y1%3D%277%27%20y2%3D%2727%27%20stroke%3D%27%236c6c6c%27%20stroke-width%3D%2711%27%20stroke-linecap%3D%27round%27%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%20transform%3D%27rotate%2830%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%20transform%3D%27rotate%2860%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%20transform%3D%27rotate%2890%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%20transform%3D%27rotate%28120%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%20transform%3D%27rotate%28150%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.37%27%20transform%3D%27rotate%28180%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.46%27%20transform%3D%27rotate%28210%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.56%27%20transform%3D%27rotate%28240%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.66%27%20transform%3D%27rotate%28270%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.75%27%20transform%3D%27rotate%28300%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.85%27%20transform%3D%27rotate%28330%2060%2C60%29%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-position: 50%;
  background-size: 100%;
  background-repeat: no-repeat;
}

.swiper-lazy-preloader-white:after {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D%270%200%20120%20120%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20xmlns%3Axlink%3D%27http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%27%3E%3Cdefs%3E%3Cline%20id%3D%27l%27%20x1%3D%2760%27%20x2%3D%2760%27%20y1%3D%277%27%20y2%3D%2727%27%20stroke%3D%27%23fff%27%20stroke-width%3D%2711%27%20stroke-linecap%3D%27round%27%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%20transform%3D%27rotate%2830%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%20transform%3D%27rotate%2860%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%20transform%3D%27rotate%2890%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%20transform%3D%27rotate%28120%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.27%27%20transform%3D%27rotate%28150%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.37%27%20transform%3D%27rotate%28180%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.46%27%20transform%3D%27rotate%28210%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.56%27%20transform%3D%27rotate%28240%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.66%27%20transform%3D%27rotate%28270%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.75%27%20transform%3D%27rotate%28300%2060%2C60%29%27%2F%3E%3Cuse%20xlink%3Ahref%3D%27%23l%27%20opacity%3D%27.85%27%20transform%3D%27rotate%28330%2060%2C60%29%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}

@-webkit-keyframes swiper-preloader-spin {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes swiper-preloader-spin {
  100% {
    transform: rotate(360deg);
  }
}

/* a11y */

.swiper .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}

.swiper-fade.swiper-free-mode .swiper-slide {
  transition-timing-function: ease-out;
}

.swiper-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
}

.swiper-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-fade .swiper-slide-active,
.swiper-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-cube {
  overflow: visible;
}

.swiper-cube .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}

.swiper-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-cube.swiper-rtl .swiper-slide {
  transform-origin: 100% 0;
}

.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-next,
.swiper-cube .swiper-slide-prev,
.swiper-cube .swiper-slide-next + .swiper-slide {
  pointer-events: auto;
  visibility: visible;
}

.swiper-cube .swiper-slide-shadow-top,
.swiper-cube .swiper-slide-shadow-bottom,
.swiper-cube .swiper-slide-shadow-left,
.swiper-cube .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.swiper-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
  filter: blur(50px);
  z-index: 0;
}

.swiper-flip {
  overflow: visible;
}

.swiper-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}

.swiper-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-flip .swiper-slide-active,
.swiper-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-flip .swiper-slide-shadow-top,
.swiper-flip .swiper-slide-shadow-bottom,
.swiper-flip .swiper-slide-shadow-left,
.swiper-flip .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.swiper-coverflow .swiper-wrapper {
  /* Windows 8 IE 10 fix */
  -ms-perspective: 1200px;
}

.swiper-thumbs {
  margin-left: 24px;
}

.swiper-thumbs .swiper-wrapper {
  list-style: none;
}

.button {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  padding: 16px 32px;
  border-radius: 8px;
  text-decoration: none;
  text-align: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  cursor: pointer;
  display: inline-block;
  border: 2px solid var(--primary2-color);
  background-color: #FFF;
}

/* Third Button */

.button__main {
  display: inline-flex;
  margin: 0;
  color: var(--primary2-color);
  background-color: #fff;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.button__link {
  color: #FFF;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  white-space: nowrap;
}

.button__main {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.button__main .button__link {
  position: relative;
  transition: all .45s ease-Out;
}

.button__circle {
  display: none;
  width: 0%;
  height: 0%;
  opacity: 0;
  border-radius: 50%;
  background: #141414;
  position: absolute;
  transition: all .5s ease-Out;
  top: 50%;
  left: 50%;
}

.button__main:hover .button__circle {
  width: 200%;
  height: 500%;
  opacity: 1;
  top: -200%;
  left: -50%;
}

.button__main:hover {
  background-color: var(--primary3-color);
  border-color: var(--primary3-color);
  transition: .7s ease-Out;
}

.button__main:hover .button__link {
  color: #FFF;
}

.button:disabled {
  opacity: .4;
  pointer-events: none;
  transition: .3s;
}

.button > * {
  pointer-events: none;
}

.button--half {
  width: 50%;
}

.button--word {
  color: #976534;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  padding: 0;
  transition: .3s;
}

.button--word::before {
  content: "";
  width: 0;
  height: 1px;
  position: absolute;
  bottom: 0;
  right: 0;
  background: #976534;
  transition: .3s;
}

.button--word:hover:before {
  width: 100%;
  left: 0;
  background: #976534;
}

.button--word:hover {
  color: #976534;
  transition: .3s;
}

.button--orange {
  background: #F0DBC5;
  transition: .3s;
}

.button--orange:hover {
  background: #D2BDA6;
  transition: .3s;
}

.button--white {
  background-color: white;
  border: 1px var(--black3-color) solid;
}

.button--white::after {
  background: #FAFAFA;
  transition: .3s;
}

.button--transparent {
  background: transparent;
  border: none;
  transition: .3s;
}

.button--transparent:hover {
  opacity: .5;
  transition: .3s;
}

.button--gray {
  background: #FAFAFA;
  transition: .3s;
}

.button--gray:hover {
  background: #404040;
  color: white;
  transition: .3s;
}

.button--full {
  width: 100%;
}

.button--small {
  font-size: 16px;
  line-height: 24px;
  padding: 8px 0;
}

.button--240 {
  width: 240px;
}

.button--active .button__cart {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.button__text {
  position: relative;
  z-index: 2;
  text-align: center;
  white-space: nowrap;
}

.button__cart {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #D2BDA6;
  color: #404040;
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.button-quad {
  width: 80px;
  height: 80px;
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.button-quad--small {
  width: 64px;
  height: 64px;
}

.button-quad--search {
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.button-quad--visible {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.button-quad--gray {
  background: #FAFAFA;
  transition: .3s;
}

.button-quad--gray:hover {
  background: #976534;
  transition: .3s;
}

.button-quad--white {
  background: white;
  transition: .3s;
}

.button-quad--white:hover {
  background: #FAFAFA;
  transition: .3s;
}

.button-quad--gray:hover .button-quad__svg {
  fill: white;
  transition: .3s;
}

.button-quad--brown {
  background: #F0DBC5;
  transition: .3s;
}

.button-quad--brown:hover {
  background: #D2BDA6;
  transition: .3s;
}

.button-quad--plain {
  background: rgba(255, 255, 255, 0.1);
}

.button-quad--plain .button-quad__svg path:first-child {
  fill: white;
  transition: .3s;
}

.button-quad--plain:after {
  background: #FAFAFA;
}

.button-quad--plain:hover .button-quad__svg path:first-child {
  fill: black;
  transition: .3s;
}

.button-quad--grid {
  background: white;
  transition: .3s;
}

.button-quad--grid:hover {
  background: #F9F7F4;
  transition: .3s;
}

.button-quad--grid:hover .button-quad__svg {
  fill: #976534;
  transition: .3s;
}

.button-quad--gridactive {
  background: #976534;
  pointer-events: none;
}

.button-quad--gridactive .button-quad__svg {
  fill: white;
}

.button-quad--active:after {
  height: 100%;
}

.button-quad--active .button-quad__svg {
  fill: white;
}

.button-quad__svg {
  position: relative;
  z-index: 2;
  transition: .3s;
}

.button-main {
  font-weight: 600;
  font-size: 18px;
  line-height: 28px;
  color: white;
  padding: 12px 35px;
  background: #976534;
  cursor: pointer;
}

.button-main--full {
  width: 100%;
}

.button-main--buy {
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: visible;
  opacity: 1;
}

.button-main--href {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  visibility: visible;
  opacity: 1;
}

.button-main--buy > * {
  pointer-events: none;
}

.button-main--hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

.button-main--disabled {
  pointer-events: none;
  background: #D9D9D9;
  color: #8C8C8C;
}

.button-main--disabled .button-main__icon {
  fill: #8C8C8C;
}

.button-main__icon {
  margin-right: 8px;
}

.button-group {
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  opacity: 0;
  visibility: hidden;
}

.button-group--active {
  visibility: visible;
  opacity: 1;
}

.button-cart {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-right: 8px;
  width: 100%;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  background-color: #FF8F0C;
  color: #FFFFFF;
  transition: background-color .3s ease-in-out;
}

.button-cart:hover {
  background-color: #CC5905;
}

.button-cart__subtext {
  font-weight: 400;
}

.button-diff {
  width: 40px;
  height: 40px;
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity .3s, width .3s;
}

.button-diff.swiper-button-disabled {
  opacity: 0.4;
  cursor: not-allowed;
  width: 25px;
}

.button-diff.thumb-swiper-prev {
  margin-right: 24px;
}

.button-diff.thumb-swiper-prev .button-diff__svg {
  transform: rotateZ(180deg);
}

.button-diff:not(.swiper-button-disabled):hover {
  color: #FF6B00;
  transition: .3s ease-in-out;
}

.button-circle {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 100%;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.button-circle.swiper-button-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.button-circle__svg {
  width: 100%;
  height: 100%;
  transition: .3s;
}

.button-label {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  font-size: 14px;
  line-height: 16px;
  white-space: nowrap;
  cursor: pointer;
}

.button-label--bage {
  background: #F0DBC5;
  transition: .3s;
}

.button-label--bage:hover {
  background: #D2BDA7;
  transition: .3s;
}

.button-label--bordered {
  border: 1px solid #976534;
  transition: .3s;
}

.button-label--bordered:hover {
  background: #976534;
  color: white;
  transition: .3s;
}

.button-label .ruble {
  margin-left: 4px;
}

.button-label__separator {
  margin: 0 8px;
}

.button-product {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16px 0;
  width: 100%;
  font-size: 20px;
  line-height: 32px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  overflow: hidden;
  z-index: 1;
}

.button-product:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: translateY(-100%);
  transition: .3s;
  z-index: -1;
}

.button-product:not(:disabled):hover::after {
  transition: .3s;
  transform: translateY(0);
  background: #D89C61;
}

.button-product:disabled {
  cursor: auto;
  background: rgba(217, 217, 217, 0.4);
  color: rgba(140, 140, 140, 0.4);
}

.button-product--bage {
  background: #976534;
  color: white;
  transition: .3s;
}

.button-product--blank {
  background: white;
  color: #976534;
  transition: .3s;
}

.button-product__icon {
  margin-right: 8px;
}

.product-thumb {
  width: calc(100%/4 - 24px);
  position: relative;
  margin: 0 24px 24px 0;
  padding: 0px;
  border: 1px solid transparent;
  transition: border-color 0.3s ease-in-out;
  border-radius: 16px;
  height: unset;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.product-thumb:hover {
  border-color: rgba(0, 0, 0, 0.2);
}

.product-thumb:hover .product-thumb__compare {
  opacity: 1;
}

.product-thumb:hover .product-thumb__elements {
  opacity: 1;
  visibility: visible;
}

.product-thumb--2 {
  width: calc(100%/2 - 40px);
}

.product-thumb--3 {
  width: calc(100%/3 - 40px);
}

.product-thumb--4 {
  width: calc(100%/4 - 24px);
}

.product-thumb--5 {
  width: calc(100%/5 - 24px);
}

.product-thumb__link {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 2;
}

.product-thumb__label {
  text-transform: uppercase;
  font-weight: bold;
  color: #909090;
  margin-bottom: 8px;
  min-height: 18px;
  font-size: 12px !important;
  line-height: 18px;
}

.product-thumb__swiper {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.product-thumb__pagination {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  z-index: 1;
}

.product-thumb__pagination .swiper-pagination-bullet {
  flex: 1;
  height: 100%;
  border-radius: unset;
  margin: unset !important;
  background: none;
}

.product-thumb__pagination .swiper-pagination-bullet-active {
  pointer-events: none;
}

.product-thumb__subpagination {
  width: 100%;
  display: flex;
  align-items: center;
  z-index: 1;
  position: absolute;
  left: 0;
  bottom: -10px;
}

.product-thumb__subbullet {
  height: 2px;
  border-radius: unset;
  background: #D9D9D9;
  flex: 1;
  margin: 0;
  transition: .3s;
}

.product-thumb__subbullet--active {
  background: #272727;
  transition: .3s;
}

.product-thumb__rating {
  margin-bottom: 16px;
}

.product-thumb__imgbox {
  position: relative;
  width: 100%;
  height: 230px;
}

.product-thumb__subbox {
  position: relative;
  width: 100% !important;
  height: 100%;
  transition: unset !important;
}

.product-thumb__img {
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  border: 0;
  vertical-align: middle;
  max-width: 100%;
  max-height: 100%;
}

.product-thumb__compare {
  position: absolute;
  top: 16px;
  right: 16px;
  margin: unset;
  opacity: 0;
  transition: opacity .3s ease-in-out;
}

.product-thumb__compare .buttons {
  flex-direction: column;
  gap: 6px;
}

.product-thumb__cover {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-thumb__cover svg {
  width: 80px;
  height: 80px;
}

.product-thumb__imgbox:has(.loaded) .product-thumb__loader {
  opacity: 0;
}

.product-thumb__loader {
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
}

.product-thumb__play {
  position: absolute;
  left: 0;
  top: 0;
  width: 54px;
  z-index: 1;
}

.product-thumb__badges {
  position: absolute;
  top: 16px;
  left: 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.product-thumb__badges .product-thumb__badge {
  position: relative;
  display: block;
  top: 0;
  left: 0;
  height: 24px;
}

.product-thumb__badge {
  position: absolute;
  top: 15px;
  left: 16px;
  z-index: 1;
  display: flex;
}

.product-thumb__badge span {
  position: absolute;
  top: 4px;
  color: #FFFFFF;
  font-size: 9px;
  line-height: 16px;
  font-weight: 600;
  text-transform: uppercase;
}

.product-thumb__badge .custom-badge-text .badge {
  position: absolute;
  left: -17px;
  top: -4px;
}

.product-thumb__badge svg {
  position: absolute;
}

.product-thumb__badge--orange {
  color: #F0962B;
  stroke: #F0962B;
}

.product-thumb__badge--orange span {
  left: 19px;
}

.product-thumb__badge--orange svg {
  color: #F0962B;
}

.product-thumb__badge--purple {
  color: #6612BA;
  stroke: #6612BA;
}

.product-thumb__badge--purple span {
  left: 16px;
}

.product-thumb__badge--purple svg {
  color: #6612BA;
}

.product-thumb__badge--green {
  color: #3EBA12;
  stroke: #3EBA12;
}

.product-thumb__badge--green span {
  left: 16px;
}

.product-thumb__badge--green svg {
  color: #3EBA12;
}

.product-thumb__badge--pink {
  color: #E01677;
  stroke: #E01677;
}

.product-thumb__badge--pink span {
  left: 17px;
}

.product-thumb__badge--pink svg {
  color: #E01677;
}

.product-thumb__header {
  color: var(--on-background-color);
  padding: 16px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.product-thumb__title {
  font-weight: 400;
  height: 48px;
  overflow: hidden;
  margin-top: auto;
  transition: .3s;
}

.product-thumb__description {
  font-size: 12px;
  line-height: 16px;
  height: 32px;
  overflow: hidden;
  color: #8C8C8C;
  margin-bottom: 16px;
}

.product-thumb__feature {
  padding-bottom: 16px;
  margin-bottom: 16px;
  border-bottom: 1px solid #D9D9D9;
}

.product-thumb__feature:first-of-type {
  padding-top: 16px;
  border-top: 1px solid #D9D9D9;
}

.product-thumb__elements {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 16px;
  background: #F4F2EF;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease-in-out;
  height: 32px;
}

.product-thumb__element {
  display: flex;
  align-items: center;
}

.product-thumb__key {
  font-size: 9px;
  font-weight: 600;
  line-height: 16px;
  margin-right: 4px;
  color: #141414;
}

.product-thumb__key--main {
  display: block !important;
}

.product-thumb__subkey {
  display: none;
  font-size: 9px;
  font-weight: 600;
  line-height: 16px;
  margin-right: 4px;
  color: #141414;
}

.product-thumb__value {
  font-size: 9px;
  font-weight: 400;
  line-height: 16px;
}

.product-thumb__value--flex {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  overflow: visible;
  margin-bottom: -8px;
}

.product-thumb__color {
  position: relative;
  width: 24px;
  height: 24px;
  border: 1px solid #D9D9D9;
  border-radius: 100%;
  margin: 0 8px 8px 0;
}

.product-thumb__tooltip {
  position: absolute;
  top: -30px;
  left: 50%;
  transform: translate(-50%, 0);
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.product-thumb__color:hover .product-thumb__tooltip {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.product-thumb__prices {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.product-thumb__buttons {
  position: relative;
  z-index: 2;
  margin: 16px 0;
}

.product-thumb__buttons--unavailable .button-group {
  opacity: 0;
  visibility: hidden;
}

.product-thumb__buttons--unavailable .button__main {
  opacity: .4;
  visibility: visible;
  pointer-events: none;
}

.product-thumb__buttons .add-to-cart {
  padding: 8px 16px;
  background-color: var(--on-background-color);
  color: #FFFFFF;
  border-radius: 48px;
  font-weight: 600;
  font-size: 18px;
  line-height: 28px;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.product-thumb__buttons .add-to-cart.cart-added {
  padding: 4px 16px;
  background-color: var(--orange-color);
  color: var(--on-primary-color);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.product-thumb__buttons .add-to-cart.cart-added span {
  font-size: 12px;
  line-height: 28px;
  font-weight: 400;
  margin-top: -12px;
}

.product-thumb__buttons .counter {
  opacity: 0;
  visibility: hidden;
  position: absolute;
}

.category__content .product-thumb__buttons {
  margin-bottom: 16px;
}

.product-thumb__buttons .button-group {
  left: 16px;
}

.product-thumb__reviews {
  display: flex;
  align-items: center;
  margin-top: 8px;
  gap: 16px;
}

.product-thumb__stars {
  display: flex;
}

.product-thumb__comment {
  display: flex;
  align-items: center;
  gap: 8px;
}

.tooltip {
  position: relative;
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  padding: 4px 8px;
  background: white;
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  white-space: nowrap;
}

.tooltip__tip {
  position: absolute;
  right: 0;
  left: 0;
  bottom: -6px;
  margin: auto;
}

.advantages {
  position: relative;
}

.advantages:hover .block-action {
  opacity: 1;
  visibility: visible;
}

.advantages__container {
  margin: 0 auto;
  max-width: 1440px;
}

.advantages__list {
  display: grid;
  grid-template-columns: var(--advantages-count);
  grid-template-rows: 1fr;
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.advantages__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px;
  text-align: var(--advantages-align);
}

.advantages__item--row {
  flex-direction: row;
  justify-content: flex-start;
}

.advantages__item:nth-child(2n) {
  background: rgba(234, 203, 172, 0.1);
}

.advantages__imagebox {
  margin-bottom: 65px;
  flex-shrink: 0;
  height: 80px;
  width: 80px;
}

.advantages__imagebox--row {
  margin-bottom: 0;
  margin-right: 24px;
}

.advantages__img {
  display: block !important;
  width: 100%;
  height: 100%;
}

.advantages__body {
  margin: 0;
  font-size: 18px;
  line-height: 32px;
}

.panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 64px;
  background: white;
  z-index: 25;
}

.panel__item {
  position: relative;
  width: 25%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px 8px;
}

.panel__item > * {
  pointer-events: none;
}

.panel__icon {
  color: #404040;
}

.panel__item--active .panel__icon {
  color: #D35F2D;
  transition: .3s;
}

.panel__item--active .panel__title {
  color: #D35F2D;
  transition: .3s;
}

.panel__icon {
  margin-bottom: 4px;
  transition: .3s;
}

.panel__title {
  font-size: 12px;
  line-height: 12px;
  transition: .3s;
}

.mobile-menu__wrapper {
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 20;
  min-width: 360px;
}

.mobile-menu__list {
  height: 60px;
  display: flex;
  align-items: center;
  background-color: var(--primary-container);
}

.mobile-menu__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  align-items: center;
  padding: 10px 0;
  position: relative;
  cursor: pointer;
}

.mobile-menu__link {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
}

.mobile-menu__icon {
  width: 24px;
  height: 24px;
}

.mobile-menu__icon svg {
  width: 100%;
  height: 100%;
}

.mobile-menu__icon--cart {
  display: flex;
  width: 68px;
  height: 68px;
  background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
  color: #fff;
  border-radius: 50%;
  position: absolute;
  border: 8px solid var(--primary-container);
  bottom: 0;
}

.mobile-menu__icon--cart svg {
  transform: scale(2.2);
  width: 16px;
  height: 16px;
  margin: auto;
}

.mobile-menu__title {
  font-size: 12px;
  line-height: 12px;
}

.cart-menu__btn {
  min-width: 76px;
  height: 60px;
}

.mobile-overlay {
  background: #00000080;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 8;
}

.mobile-content {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding-top: 45px;
  z-index: 9;
  min-width: 360px;
  max-height: 90vh;
}

.mobile-content__wrapper {
  padding: 0 24px;
  background-color: #fff;
  border-radius: 24px 24px 0 0;
  max-height: 90vh;
  overflow-y: auto;
  padding-bottom: 45px;
  scrollbar-width: none;
}

.mobile-content__wrapper::-webkit-scrollbar {
  display: none;
}

.mobile-content__close {
  position: absolute;
  width: 48px;
  height: 48px;
  box-shadow: 0px 0px 24px 0px #00000040;
  border-radius: 50%;
  right: 16px;
  top: 29px;
  z-index: 10;
  cursor: pointer;
}

.mobile-content__close svg {
  width: 100%;
  height: 100%;
}

.mobile-content__back {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.mobile-content__back svg {
  width: 11px;
  height: 9px;
}

.mobile-content__close-big {
  cursor: pointer;
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin: 0px auto 0;
}

.mobile-content__close-big svg {
  width: 100%;
  height: 100%;
}

.mobile-content__header {
  width: 100%;
  padding: 16px 0;
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}

.mobile-content__search {
  width: 100%;
  position: relative;
  margin-bottom: 24px;
}

.mobile-content__input {
  width: 100%;
  padding: 8px 16px 8px 48px;
  border: 2px solid #EAE6E0;
  border-radius: 8px;
}

.mobile-content__label {
  font-size: 12px;
  line-height: 16px;
  color: #141414;
  opacity: 80%;
  width: 100%;
}

.mobile-content__footer {
  padding: 40px 0 40px;
}

.mobile-content__logo {
  height: 29px;
}

.mobile-content__logo img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.mobile-content__logo svg {
  width: 100%;
  height: 100%;
}

.mobile-content__item {
  padding: 16px 0;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  cursor: pointer;
}

.mobile-content__item--accent {
  padding-bottom: 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid #D9D9D9;
}

.mobile-content__item--accent .mobile-content__title {
  color: var(--primary2-color);
}

.mobile-content__item--new::after {
  content: '';
  background-image: url("https://slonpp.com/wa-data/public/site/img/new.webp");
  position: absolute;
  width: 24px;
  height: 24px;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
}

.mobile-content__row {
  display: flex;
}

.mobile-content__icon {
  width: 50px;
  height: 50px;
  margin-right: 15px;
  position: relative;
}

.mobile-content__icon svg {
  width: 100%;
  height: 100%;
}

.mobile-content__link {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.mobile-content__title {
  font-size: 14px;
  line-height: 21px;
  color: #404040;
  font-weight: 600;
  display: flex;
  gap: 8px;
  width: 100%;
  align-items: center;
}

.mobile-content__title .mobile-content__sublink {
  color: var(--primary2-color);
  font-weight: 400;
  margin-left: auto;
  text-align: right;
}

.mobile-content__title--margin {
  margin-top: 16px;
}

.mobile-content__arrow {
  width: 24px;
  height: 24px;
  margin-left: auto;
}

.mobile-content__arrow svg {
  width: 100%;
  height: 100%;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions-window__wrapper {
  width: 100%;
  padding: 40px 24px !important;
  padding-top: 64px !important;
  background-color: #fff;
  border-radius: 24px 24px 0 0;
  max-height: 75vh;
  margin-bottom: 0;
  overflow-y: visible;
  scrollbar-width: none;
  bottom: 0;
  display: flex;
  flex-direction: column;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions-window__sub-header {
  display: none;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions__button-close {
  content: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 48 49%27 fill=%27none%27%3E%3Crect y=%270.728516%27 width=%2748%27 height=%2748%27 rx=%2724%27 fill=%27white%27%3E%3C/rect%3E%3Cpath d=%27M18 18.7285L30 30.7285%27 stroke=%27black%27%3E%3C/path%3E%3Cpath d=%27M30 18.7285L18 30.7285%27 stroke=%27black%27%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
  width: 48px;
  height: 48px;
  box-shadow: 0px 0px 24px 0px #00000040;
  border-radius: 50%;
  right: 16px;
  top: -16px;
  z-index: 101;
  cursor: pointer;
  padding: 0px;
  background: #fff;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions__link {
  font-family: Montserrat;
  font-weight: 600;
  color: #404040;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions-window__wrapper .mobile-content__footer {
  margin-top: auto;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions-window__region {
  margin-bottom: 16px;
}

.empty {
  position: relative;
}

.empty__container {
  position: relative;
  width: 100%;
  margin: 0 auto;
  max-width: 1600px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 24px 80px;
}

.empty__container .title {
  gap: 16px;
  padding: 16px 24px;
}

.empty__box {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: 250px;
  width: 444px;
  margin-top: 40px;
  margin-bottom: 48px;
}

.empty__box svg {
  width: 444px;
  height: 211px;
}

.empty__count {
  content: '';
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 0;
  right: 0;
  height: 20px;
  width: 20px;
  font-size: 12px;
  font-weight: 600;
  background: #F0DBC5;
  border-radius: 100%;
}

.empty__title {
  margin-bottom: 20px;
  max-width: 413px;
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
  text-align: center;
}

.empty__description {
  text-align: center;
}

.empty__description .button {
  padding: 8px 40px;
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
}

.dash {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 24px 40px 0 40px;
}

.noUi-target {
  border: none !important;
  height: 2px !important;
  padding: 0 9px !important;
}

.noUi-connect {
  background: var(--outline-variant) !important;
}

.noUi-connects {
  height: 2px !important;
}

.noUi-handle {
  border: none !important;
  border-radius: 100% !important;
  width: 18px !important;
  height: 18px !important;
  background: var(--on-surface-variant) !important;
  top: 1px !important;
  bottom: 0 !important;
  right: -9px !important;
  margin: auto !important;
  box-shadow: unset !important;
  cursor: pointer !important;
  transition: .3s !important;
}

.noUi-handle::before {
  content: none !important;
}

.noUi-handle::after {
  top: 2px !important;
  left: 2px !important;
  width: 14px !important;
  height: 14px !important;
  border-radius: 100% !important;
  background: var(--on-primary-color) !important;
}

.filter-open {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 21px;
  padding: 16px;
  width: 100%;
  cursor: pointer;
  position: relative;
}

.filter-open__icon {
  width: 24px;
  height: 24px;
}

.filter-open--float {
  position: fixed;
  padding: 16px;
  border: 1px solid #FFFFFF;
  border-radius: 50%;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background: var(--primary-container);
  box-shadow: 0px 2px 8px 0px #0000001A;
  left: 50%;
  transform: translateX(-50%);
  bottom: 135px;
  z-index: -1;
  opacity: 0;
  transition: opacity .3s ease-in-out;
}

.filter-open--float.show {
  opacity: 1;
  z-index: 7;
}

.filter-open--float::after {
  display: none;
}

.filter-open::after {
  content: '';
  position: absolute;
  width: calc(100% - 30px);
  height: 1px;
  background: var(--primary-container);
  bottom: 0;
}

.category__banner {
  position: relative;
  width: 100%;
  padding: 8px;
}

.category__banner a {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.category__banner img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.menu {
  position: absolute;
  padding-top: 20px;
  width: calc(100% - 80px);
  height: 100%;
  top: 100%;
  left: 40px;
  z-index: 100;
  visibility: visible;
  opacity: 1;
}

.menu-catalog {
  position: absolute;
  padding-top: 20px;
  width: calc(100% - 80px);
  max-width: 1240px;
  height: 100%;
  top: auto;
  z-index: 100;
  visibility: visible;
  opacity: 1;
}

.menu-catalog .menu__list {
  border: 2px solid var(--primary-container);
  border-radius: 8px;
  box-shadow: 0px 0px 24px 0px #00000040;
}

.menu-catalog .menu__column {
  background-color: #EAE6E04D;
  padding: 16px 16px 147px;
}

.menu-catalog .menu__item {
  padding: 8px;
  border: 1px solid transparent;
  border-radius: 8px;
  margin: 8px 0px;
  transition: .3s;
  position: relative;
}

.menu-catalog .menu__item:hover .menu__title {
  color: #404040;
}

.menu-catalog .menu__item--new::after {
  content: '';
  background-image: url("https://slonpp.com/wa-data/public/site/img/new.webp");
  position: absolute;
  width: 32px;
  height: 32px;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
}

.menu-catalog .menu__item--active {
  border-color: var(--primary-color);
}

.menu-catalog .menu__item--active .menu__title {
  color: #404040;
}

.menu-catalog .menu__item--active .menu__icon {
  transform: rotateZ(0deg) scale(1);
}

.menu-catalog .menu__title {
  color: #404040;
}

.menu-catalog .menu__icon {
  fill: rgba(64, 64, 64, 0.3);
  margin-left: 8px;
  transform: rotateZ(0deg);
  transition: .3s;
}

.menu-catalog .menu__top {
  position: relative;
  color: #FFFFFF;
  display: flex;
}

.menu-catalog .menu__top .menu__imagebox {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
}

.menu-catalog .menu__top .menu__imagebox .menu__img {
  width: 100%;
  border-radius: 8px;
}

.menu-catalog .menu__top .menu__banner {
  margin: 16px;
  position: relative;
}

.menu-catalog .menu__top .menu__header {
  z-index: 1;
  position: relative;
  padding: 24px 0px 8px 24px;
}

.menu-catalog .menu__top .menu__description {
  z-index: 1;
  position: relative;
  padding: 0px 0px 0px 24px;
}

.menu-catelog-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: -1;
  display: none;
}

.menu-catelog-overlay.show {
  display: block;
}

.menu-categories {
  position: relative;
  display: flex;
}

.menu-categories .menu__list {
  flex-direction: column;
  display: flex;
  background: transparent;
  box-shadow: none;
}

.menu-categories .menu__column {
  display: flex;
  gap: 24px;
}

.menu-categories .menu__dropdown {
  position: absolute;
  padding: 24px;
  top: calc(100% + 7px);
  left: 0;
  width: 100%;
  z-index: 100;
  visibility: visible;
  opacity: 1;
  background-color: var(--background-color);
  border-radius: 8px;
  box-shadow: 0px 0px 24px 0px #00000040;
}

.menu-categories .menu__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
}

.menu-categories .menu__block {
  width: 224px;
  overflow: visible;
}

.menu-categories .menu__category {
  display: flex;
  gap: 16px;
}

.menu-categories .menu__imagebox {
  width: 60px;
  height: 60px;
  min-width: 60px;
  transition: opacity .3s;
}

.menu-categories .menu__imagebox svg {
  width: 100%;
  height: 100%;
}

.menu-categories .menu__imagebox img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  opacity: 1;
}

.menu-categories .menu__text {
  display: flex;
  flex-direction: column;
}

.menu-categories .menu__count {
  opacity: .7;
  color: var(--on-background-color);
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
}

.menu-categories .menu__item {
  position: relative;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: .3s;
  opacity: 0.5;
}

.menu-categories .menu__item--active {
  opacity: 1;
  transition: var(--transitions);
}

.menu-categories-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: -1;
  display: none;
}

.menu-categories-overlay.show {
  display: block;
}

.menu--active {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.menu__list {
  background-color: #FFFFFF;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
  display: flex;
  overflow: hidden;
}

.menu__column {
  min-width: 280px;
}

.menu__body {
  flex: 1;
  position: relative;
}

.menu__bottom {
  -moz-columns: 4;
       columns: 4;
  margin-top: 0px;
  margin-bottom: 16px;
  margin-left: -10px;
}

.menu__header {
  padding: 24px;
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  top: 0;
  left: 0;
  transition: background-color .3s, color .3s;
}

.menu__block {
  position: relative;
  -moz-column-break-inside: avoid;
       break-inside: avoid-column;
  page-break-inside: avoid;
  overflow: hidden;
  font-weight: 600;
}

.menu__item {
  position: relative;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: .3s;
}

.menu-categories .menu__item:first-of-type {
  padding-left: 0;
}

.menu__item--active {
  transition: var(--transitions);
}

.menu__subitem {
  font-weight: 400;
}

.menu__icon {
  fill: rgba(64, 64, 64, 0.3);
  margin-left: 8px;
  transform: rotateZ(90deg) scale(1.5);
  transition: .3s;
}

.menu__item--active .menu__icon {
  transition: var(--transitions);
  transform: rotateZ(-90deg) scale(1.5);
}

.menu__item--active .menu__title {
  color: var(--hover-link);
  transition: var(--transitions);
}

.menu__item:hover {
  transition: var(--transitions);
}

.menu__item:hover .menu__icon {
  transition: var(--transitions);
}

.menu__item:hover .menu__title {
  color: var(--hover-link);
  transition: var(--transitions);
}

.menu__title {
  font-size: 18px;
  line-height: 24px;
}

.menu__category {
  position: relative;
  padding: 8px 24px;
  font-size: 12px;
  line-height: 16px;
  transition: var(--transitions);
}

.menu__category--orange {
  color: var(--primary2-color);
}

.banner {
  position: relative;
  padding: 16px;
  width: 100%;
  overflow: hidden;
}

.banner--big {
  height: 132px;
}

.banner--small {
  height: 165px;
  width: calc(100% - 48px);
  margin: 0 24px;
}

.banner--title {
  margin-bottom: 8px;
}

.banner__name {
  position: relative;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  z-index: 5;
  transition: var(--transitions);
}

.banner:hover .banner__name {
  color: var(--hover-link);
}

.banner__img {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
  visibility: visible;
}

.menu__banner {
  height: 124px;
  width: 100%;
  opacity: 1;
  visibility: visible;
  position: relative;
}

.menu__banner-link {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 5;
}

.banner__background {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.3);
  z-index: 5;
}

.banner__name {
  font-weight: 600;
  color: #404040;
  z-index: 10;
  transition: var(--transitions);
}

.banner__name--white {
  color: #FFFFFF;
}

.menu__category--title {
  font-weight: 600;
  margin-bottom: 8px;
}

.menu__category:hover {
  color: var(--primary2-color);
  transition: color .3s;
}

.menu__category:hover .menu__imagebox {
  opacity: 1;
}

.menu__category:hover .menu__name {
  color: var(--hover-link);
  transition: var(--transitions);
}

.menu__subcategory {
  padding: 8px 24px;
  font-size: 16px;
  line-height: 24px;
  transition: var(--transitions);
}

.menu__subcategory:last-of-type {
  margin-bottom: 16px;
}

.menu__subcategory:hover {
  background-color: #F7F7F7;
  color: var(--hover-link);
  transition: var(--transitions);
}

.menu__link {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  cursor: pointer;
}

.search {
  position: relative;
  height: 100%;
  width: 100%;
  max-width: 670px;
  margin-right: clamp(20px, 1.5vw, 40px);
}

.search--active {
  z-index: auto;
}

.search__input {
  height: 100%;
  width: 100%;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  padding: 8px 48px;
  background: var(--on-primary-color);
  transition: var(--transitions);
  border-radius: 8px;
  width: clamp(245px, 28vw, 520px);
  border: 2px solid var(--primary2-color);
}

.search__input:focus {
  border-color: var(--primary2-color);
}

.search__input::-moz-placeholder {
  color: #888;
  -moz-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.search__input::placeholder {
  color: #888;
  transition: opacity 0.3s ease;
}

.search__input::-moz-placeholder {
  color: var(--on-background-color);
  font-size: clamp(14px, 1vw, 16px);
  line-height: clamp(21px, 1.5vw, 24px);
  font-weight: 400;
  font-family: var(--font-family);
  opacity: 0.5;
}

.search__input::placeholder {
  color: var(--on-background-color);
  font-size: clamp(14px, 1vw, 16px);
  line-height: clamp(21px, 1.5vw, 24px);
  font-weight: 400;
  font-family: var(--font-family);
  opacity: 0.5;
}

.search--active .search__input {
  background: #F7F7F7;
  border-radius: 8px 8px 0 0;
}

.search__input:focus-visible {
  background: #F7F7F7;
}

.search--active .search__icon {
  color: var(--hover-link);
}

.search--active .search__zoom {
  opacity: 1;
  visibility: visible;
}

.search__icon {
  position: absolute;
  top: 50%;
  left: 16px;
  bottom: 0;
  color: #8C8C8C;
  transform: translateY(-50%);
  transition: var(--transitions);
}

.search__zoom {
  position: absolute;
  top: 50%;
  right: 8px;
  padding: 6px 12px;
  border-radius: 32px;
  font-size: 14px;
  line-height: 20px;
  color: #FFFFFF;
  background: #272727;
  opacity: 0;
  transform: translateY(-50%);
  transition: var(--transitions);
  cursor: pointer;
  visibility: hidden;
  display: none;
}

.search__zoom:hover {
  background: var(--primary2-color);
  transition: background 0.3s ease;
}

.search__card {
  width: 100%;
  position: absolute;
  z-index: 2;
  left: 0;
  top: 100%;
  background: white;
  box-shadow: 0px 4px 12px 0px #00000040;
  border-radius: 0 0 8px 8px;
}

.search__item {
  display: flex;
  align-items: center;
  padding: 16px 0;
  margin: 0 16px;
  position: relative;
}

.search__link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}

.search__imgbox {
  position: relative;
  width: 72px;
  height: 72px;
  margin-right: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.search__img {
  position: relative;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  opacity: 1;
  z-index: 5;
}

.search__empty {
  position: relative;
  background: #FFFFFF;
  z-index: 5;
}

.search__content {
  flex: 1;
}

.search__name {
  font-size: 16px;
  line-height: 24px;
  overflow: hidden;
  transition: var(--transitions);
}

.search__name:hover {
  color: var(--hover-link);
}

.search__prices {
  display: flex;
  align-items: center;
  margin-top: 8px;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}

.search__price {
  margin-right: 8px;
}

.search__oldprice {
  -webkit-text-decoration-line: line-through;
          text-decoration-line: line-through;
  color: #8C8C8C;
}

.search__text {
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  color: var(--primary2-color);
  cursor: pointer;
  transition: var(--transitions);
  display: flex;
  align-items: center;
  gap: 8px;
}

.search__count {
  font-size: 12px;
  line-height: 16px;
}

.search__bottom {
  padding: 16px 0;
  margin: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #D9D9D9;
}

.search__overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: -1;
  display: none;
  cursor: pointer;
}

.search--active .search__overlay {
  display: block;
}

.search {
  position: relative;
  height: 100%;
  width: 100%;
  max-width: 670px;
  margin-right: clamp(20px, 1.5vw, 40px);
}

.search--active {
  z-index: auto;
}

.search__input {
  height: 100%;
  width: 100%;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  padding: 8px 48px;
  background: var(--on-primary-color);
  transition: var(--transitions);
  border-radius: 8px;
  width: clamp(245px, 28vw, 520px);
  border: 2px solid var(--primary2-color);
}

.search__input:focus {
  border-color: var(--primary2-color);
}

.search__input::-moz-placeholder {
  color: #888;
  -moz-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.search__input::placeholder {
  color: #888;
  transition: opacity 0.3s ease;
}

.search__input::-moz-placeholder {
  color: var(--on-background-color);
  font-size: clamp(14px, 1vw, 16px);
  line-height: clamp(21px, 1.5vw, 24px);
  font-weight: 400;
  font-family: var(--font-family);
  opacity: 0.5;
}

.search__input::placeholder {
  color: var(--on-background-color);
  font-size: clamp(14px, 1vw, 16px);
  line-height: clamp(21px, 1.5vw, 24px);
  font-weight: 400;
  font-family: var(--font-family);
  opacity: 0.5;
}

.search--active .search__input {
  background: #F7F7F7;
  border-radius: 8px 8px 0 0;
}

.search__input:focus-visible {
  background: #F7F7F7;
}

.search--active .search__icon {
  color: var(--hover-link);
}

.search--active .search__zoom {
  opacity: 1;
  visibility: visible;
}

.search__icon {
  position: absolute;
  top: 50%;
  left: 16px;
  bottom: 0;
  color: #8C8C8C;
  transform: translateY(-50%);
  transition: var(--transitions);
}

.search__zoom {
  position: absolute;
  top: 50%;
  right: 8px;
  padding: 6px 12px;
  border-radius: 32px;
  font-size: 14px;
  line-height: 20px;
  color: #FFFFFF;
  background: #272727;
  opacity: 0;
  transform: translateY(-50%);
  transition: var(--transitions);
  cursor: pointer;
  visibility: hidden;
  display: none;
}

.search__zoom:hover {
  background: var(--primary2-color);
  transition: background 0.3s ease;
}

.search__card {
  width: 100%;
  position: absolute;
  z-index: 2;
  left: 0;
  top: 100%;
  background: white;
  box-shadow: 0px 4px 12px 0px #00000040;
  border-radius: 0 0 8px 8px;
}

.search__item {
  display: flex;
  align-items: center;
  padding: 16px 0;
  margin: 0 16px;
  position: relative;
}

.search__link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}

.search__imgbox {
  position: relative;
  width: 72px;
  height: 72px;
  margin-right: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.search__img {
  position: relative;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  opacity: 1;
  z-index: 5;
}

.search__empty {
  position: relative;
  background: #FFFFFF;
  z-index: 5;
}

.search__content {
  flex: 1;
}

.search__name {
  font-size: 16px;
  line-height: 24px;
  overflow: hidden;
  transition: var(--transitions);
}

.search__name:hover {
  color: var(--hover-link);
}

.search__prices {
  display: flex;
  align-items: center;
  margin-top: 8px;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}

.search__price {
  margin-right: 8px;
}

.search__oldprice {
  -webkit-text-decoration-line: line-through;
          text-decoration-line: line-through;
  color: #8C8C8C;
}

.search__text {
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  color: var(--primary2-color);
  cursor: pointer;
  transition: var(--transitions);
  display: flex;
  align-items: center;
  gap: 8px;
}

.search__count {
  font-size: 12px;
  line-height: 16px;
}

.search__bottom {
  padding: 16px 0;
  margin: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #D9D9D9;
}

.search__overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: -1;
  display: none;
  cursor: pointer;
}

.search--active .search__overlay {
  display: block;
}

.login,
.signup {
  background-color: var(--surface-variant);
  min-height: 100vh;
  padding: 71px 0;
}

.login__logo,
.signup__logo {
  margin-bottom: 41px;
}

.login__container,
.signup__container {
  width: 407px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 16px;
  padding: 40px 16px;
  background: var(--on-primary-color);
  box-shadow: 0px 4px 76px 0px #5F524033;
}

.wa-login-form-wrapper,
.wa-signup-form-wrapper,
.wa-forgotpassword-form-wrapper {
  width: 100%;
}

.wa-login-form-wrapper .js-wa-form-item,
.wa-signup-form-wrapper > form,
.wa-forgotpassword-form-wrapper > form {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 16px;
}

.wa-login-form-wrapper .wa-login-form-fields,
.wa-forgotpassword-form-wrapper .wa-forgotpassword-form-fields,
.wa-signup-form-wrapper .wa-signup-form-fields {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.wa-login-form-wrapper .wa-field,
.wa-signup-form-wrapper .wa-field,
.wa-forgotpassword-form-wrapper .wa-field {
  position: relative;
  background: var(--on-primary-color);
  margin: 0;
}

.wa-login-form-wrapper .wa-field .wa-name,
.wa-signup-form-wrapper .wa-field .wa-name {
  position: absolute;
  bottom: 16px;
  left: 16px;
  display: block;
  transition: transform 0.3s ease-out;
  transform-origin: left;
  cursor: default;
  font-size: 16px;
  line-height: 24px;
  color: #BBB;
  margin: 0;
}

.focus {
  transform: translate(0, -16px) scale(0.75);
  color: var(--grey-color);
  font-weight: 600;
}

.wa-value,
.wa-value p {
  width: 100%;
  border: 0;
  outline: 0;
  color: var(--black2-color);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  background-color: transparent;
  display: flex;
  flex-direction: column-reverse;
}

.wa-login-form-wrapper input[type="text"]::-moz-placeholder, .wa-forgotpassword-form-wrapper input[type="text"]::-moz-placeholder, .wa-signup-form-wrapper input[type="text"]::-moz-placeholder, .wa-login-form-wrapper input[type="email"]::-moz-placeholder, .wa-signup-form-wrapper input[type="email"]::-moz-placeholder, .wa-login-form-wrapper input[type="password"]::-moz-placeholder, .wa-signup-form-wrapper input[type="password"]::-moz-placeholder {
  color: transparent;
}

.wa-login-form-wrapper input[type="text"]::placeholder,
.wa-forgotpassword-form-wrapper input[type="text"]::placeholder,
.wa-signup-form-wrapper input[type="text"]::placeholder,
.wa-login-form-wrapper input[type="email"]::placeholder,
.wa-signup-form-wrapper input[type="email"]::placeholder,
.wa-login-form-wrapper input[type="password"]::placeholder,
.wa-signup-form-wrapper input[type="password"]::placeholder {
  color: transparent;
}

.wa-login-form-wrapper input[type="text"],
.wa-forgotpassword-form-wrapper input[type="text"],
.wa-signup-form-wrapper input[type="text"],
.wa-login-form-wrapper input[type="email"],
.wa-signup-form-wrapper input[type="email"],
.wa-login-form-wrapper input[type="password"],
.wa-signup-form-wrapper input[type="password"] {
  color: var(--black2-color);
  border: 2px solid var(--outline-color);
  border-radius: 8px;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  height: 56px;
  padding: 16px;
  margin: 0;
  line-height: 24px;
  width: 100%;
  z-index: 2;
  position: relative;
  background-color: transparent;
  transition: border-color .3s ease-in-out;
}

.wa-login-form-wrapper input[type="text"]:focus,
.wa-signup-form-wrapper input[type="text"]:focus,
.wa-forgotpassword-form-wrapper input[type="text"]:focus,
.wa-login-form-wrapper input[type="email"]:focus .wa-field-login,
.wa-signup-form-wrapper input[type="email"]:focus .wa-field-login,
.wa-login-form-wrapper input[type="password"]:focus .wa-field-password,
.wa-signup-form-wrapper input[type="password"]:focus .wa-field-password {
  border: 2px solid var(--primary2-color);
  transition: border-color .3s ease-in-out;
}

.login__text,
.signup__text {
  text-align: center;
  padding: 0 16px 24px;
}

.wa-login-form-wrapper .wa-login-form-title,
.wa-signup-form-wrapper .wa-signup-form-title,
.wa-forgotpassword-form-wrapper .wa-login-form-title {
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  margin: 0 0 24px;
  order: -1;
}

.wa-login-form-wrapper .wa-error-msg,
.wa-signup-form-wrapper .wa-error-msg {
  margin: 0;
  color: red;
  padding: 0 16px 8px;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  text-align: center;
}

.wa-login-form-wrapper .wa-login-form-actions,
.wa-signup-form-wrapper .wa-signup-form-actions {
  margin-top: 24px;
  width: 100%;
}

.wa-buttons-wrapper {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}

.wa-login-form-wrapper .wa-login-form-actions .wa-login-forgotpassword-url,
.wa-signup-form-wrapper .wa-signup-form-actions .wa-signup-forgotpassword-url {
  order: 0;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  color: var(--blue-color);
  margin-right: 111px;
}

.wa-login-form-wrapper .wa-login-form-actions .wa-login-forgotpassword-url:hover,
.wa-signup-form-wrapper .wa-signup-form-actions .wa-signup-forgotpassword-url:hover {
  transition: color .3s ease-in-out;
  color: #46566E;
}

.wa-login-form-wrapper .wa-login-form-actions .wa-signup-url,
.wa-signup-form-wrapper .wa-signup-form-actions .wa-login-url,
.wa-forgotpassword-form-wrapper .wa-forgotpassword-form-actions .wa-login-url {
  order: 1;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  margin: 0;
}

.wa-login-form-wrapper .wa-login-form-actions .wa-signup-url a,
.wa-signup-form-wrapper .wa-signup-form-actions .wa-login-url a,
.wa-forgotpassword-form-wrapper .wa-forgotpassword-form-actions .wa-login-url a {
  color: var(--primary2-color);
}

.wa-login-form-wrapper .wa-login-form-actions .wa-signup-url a:hover,
.wa-signup-form-wrapper .wa-signup-form-actions .wa-login-url a:hover,
.wa-forgotpassword-form-wrapper .wa-forgotpassword-form-actions .wa-login-url a:hover {
  transition: color .3s ease-in-out;
  color: #994000;
}

.wa-login-form-wrapper .wa-login-form-actions .wa-login-submit,
.wa-signup-form-wrapper .wa-signup-form-actions input[type="submit"],
.wa-forgotpassword-form-wrapper input[type="submit"] {
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
  color: var(--primary2-color);
  background-color: transparent;
  border-radius: 32px;
  max-width: 100%;
}

.wa-signup-form-wrapper .wa-signup-form-actions .button__main:hover input[type="submit"] {
  color: #fff;
}

.wa-login-form-actions .button,
.wa-signup-form-actions .button,
.wa-forgotpassword-form-wrapper .button {
  height: 44px;
  width: 100%;
  margin: 24px 0 20px 0;
}

.wa-signup-form-wrapper .wa-field .wa-value p input {
  margin: 0;
}

* {
  outline: none;
  box-sizing: border-box;
}

html {
  color: var(--on-background-color);
  background-color: var(--background-color);
  font-size: 16px;
  line-height: 24px;
  font-family: Montserrat;
  scroll-behavior: smooth;
}

html.lock {
  overflow: hidden;
}

body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  -ms-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

main {
  flex: auto;
  overflow: hidden;
  min-width: 360px;
}

p:not(:last-of-type) {
  margin-bottom: 24px;
}

img {
  opacity: 0;
  display: block;
}

img:not(.initial) {
  transition: opacity .6s;
}

img.initial,
img.loaded,
img.error {
  opacity: 1;
}

img:not([src]):not([srcset]) {
  visibility: hidden;
}

figure img {
  opacity: 1;
  visibility: visible;
}

button {
  background-color: unset;
  padding: unset;
  border: none;
  outline: none;
  font-family: Montserrat;
}

input {
  border: none;
  padding: unset;
  outline: none;
  font-family: Montserrat;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

.h1 {
  color: #272727;
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  margin: 0;
}

a {
  display: block;
  text-decoration: none;
  color: #272727;
}

button {
  display: block;
  color: #272727;
}

input {
  color: #272727;
}

ul {
  margin: 0;
  padding-left: 20px;
}

footer ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

li {
  margin-bottom: 4px;
}

li::marker {
  color: var(--primary-color);
}

p {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: var(--on-background-color);
  opacity: .8;
}

h2 {
  margin: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 40px;
  font-weight: 600;
  line-height: 44px;
  color: var(--on-background-color);
}

h3 {
  margin: 0;
}

.invisible {
  display: none !important;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity .3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
  transition: opacity .3s;
}

#search {
  flex: 1;
}

.lock {
  overflow: hidden;
}

.absolute {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
}

[v-cloak] {
  display: none;
}

:root {
  --primary-color: #C6BDB0;
  --on-primary-color: #FFFFFF;
  --primary-container: #F7F7F7;
  --on-primary-container: #7B7162;
  --primary2-color: #1D7F88;
  --on-primary2-color: #FFFFFF;
  --primary3-color: #5DB4BD;
  --on-primary3-color: #FFFFFF;
  --background-color: #FFFFFF;
  --on-background-color: #141414;
  --surface-variant: #F7F7F7;
  --on-surface-variant: #8C8C8C;
  --outline-color: #D9D9D9;
  --outline-variant: #EFEFEF;
  --red-color: #FF2E00;
  --green-color: #3EBA12;
  --grey-color: #BBBBBB;
  --black-color: #000000;
  --black2-color: #272727;
  --black3-color: #00000020;
  --black4-color: #00000040;
  --black5-color: #04040480;
  --grey2-color: #8C7654;
  --grey3-color: #828282;
  --brown-color: #5F5240;
  --orange-color: #FF5C00;
  --green2-color: #18AD00;
  --grey4-color: #F4F3F2;
  --grey5-color: #404040;
  --blue-color: #7590B7;
  --grey6-color: #F7F5F3;
}

.background {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  z-index: 5;
  transition: var(--transitions);
}

.background--active {
  opacity: 1;
  visibility: visible;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.5s ease;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}

.slide-leave-active, .slide-enter-active {
  transition: transform .5s ease;
}

.slide-enter, .slide-leave-to {
  transform: translateY(100%);
}

.butn {
  display: block;
  position: relative;
  padding: 12px 24px 12px 16px;
  border-radius: 8px;
  text-decoration: none;
  cursor: pointer;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  overflow: hidden;
  color: #FFF;
  background: #1D7F88;
  transition: all .3s ease-Out;
}

.butn--bordered {
  border: 2px solid #1D7F88;
  background: transparent;
  color: #1D7F88;
  padding: 10px 22px;
}

.butn > * {
  pointer-events: none;
}

.butn--absolute {
  position: absolute;
  left: 0;
  top: 0;
}

.butn--orange {
  background: #FF6B00;
  border: 2px solid #FF6B00;
  color: white;
  transition: all .5s ease-Out;
}

.butn--orange:hover {
  border-color: #FF8933;
  transition: all .5s ease-Out;
}

.butn--big {
  padding: 14px 32px;
  font-size: 16px;
  line-height: 24px;
}

.butn--full {
  width: 100%;
}

.butn--hidden {
  visibility: hidden;
  opacity: 0;
}

.butn--active {
  visibility: visible;
  opacity: 1;
}

.product-thumb__buttons:has(.pnotice__buttonView) .butn--hidden {
  opacity: 0;
  visibility: hidden;
}

.butn--gray {
  border: 2px solid #A1A1A1;
  color: #A1A1A1;
}

.butn--disabled {
  color: #FFF;
  pointer-events: none;
}

.butn--thin {
  border-width: 1px;
  font-size: 14px !important;
  line-height: 24px !important;
}

.butn:hover .butn__circle {
  width: 200%;
  height: 500%;
  opacity: 1;
  top: -200%;
  left: -50%;
}

.butn:hover {
  background-color: var(--primary3-color);
  color: white;
  transition: all .3s ease-Out;
}

.butn--bordered:hover {
  background-color: var(--primary3-color);
  border-color: var(--primary3-color);
  color: white;
  transition: all .3s ease-Out;
}

.butn__circle {
  display: none;
  width: 0%;
  height: 0%;
  opacity: 0;
  border-radius: 48px;
  background: #141414;
  position: absolute;
  transition: all .5s ease-Out;
  top: 50%;
  left: 50%;
}

.butn__circle--orange {
  background: #FF8933;
}

.butn__text {
  position: relative;
  z-index: 2;
  text-align: center;
  white-space: nowrap;
}

.butn--buy .butn__text,
.butn--article .butn__text,
.button-main--buy .butn__text {
  display: flex;
  align-items: center;
  gap: 8px;
}

.butn-round {
  width: 40px;
  height: 40px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #D9D9D9;
  cursor: pointer;
}

.butn-round > * {
  pointer-events: none;
}

.block {
  position: relative;
  width: 100%;
}

.block:hover .block-action {
  opacity: 1;
  visibility: visible;
}

.block--flexnr {
  display: flex;
}

.block--flex {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}

.block--categories {
  border-left: 1px solid #DDDDDD;
  border-top: 1px solid #DDDDDD;
}

.block--flex1 {
  flex: 1;
}

.block--flexwrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.block--absolute {
  position: absolute;
  top: 0;
  left: 0;
}

.block--marginUp54 {
  margin-top: 54px;
}

.block--marginDown54 {
  margin-bottom: 54px;
}

.block__content {
  position: relative;
  max-width: 1600px;
  padding: 0 24px;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}

.block__content:has(.swiper-thumbs) {
  padding: 0;
}

.block__content--noPadding {
  padding: 0;
}

.block__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1328px;
  margin: 80px auto 40px;
  width: 100%;
}

.block__header--full {
  width: 100%;
}

.block__header--padded {
  padding-right: 40px;
}

.block__header--dark {
  background: #976534;
  color: white;
  padding-right: 40px;
}

.block__header--nobkg {
  background: none;
}

.block__title {
  font-size: 40px;
  font-weight: 600;
  line-height: 44px;
}

.block__title--full {
  width: 100%;
}

.block__title--nobackground {
  background-color: unset;
}

.block__grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  border: 1px solid #DDDDDD;
  grid-gap: 1px;
  background-color: #DDDDDD;
}

.block__link {
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  font-size: 20px;
  transition: .3s;
}

.block__link:hover {
  color: #976534;
  transition: .3s;
}

.block__ico {
  margin-right: 12px;
}

.block__flex {
  display: flex;
  justify-content: space-between;
}

.block__none {
  padding: 0 40px;
  margin-bottom: 40px;
}

.button-product {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16px 0;
  width: 100%;
  font-size: 20px;
  line-height: 32px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  overflow: hidden;
  z-index: 1;
}

.button-product:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: translateY(-100%);
  transition: .3s;
  z-index: -1;
}

.button-product:not(:disabled):hover::after {
  transition: .3s;
  transform: translateY(0);
  background: #D89C61;
}

.button-product:disabled {
  cursor: auto;
  background: rgba(217, 217, 217, 0.4);
  color: rgba(140, 140, 140, 0.4);
}

.button-product--bage {
  background: #976534;
  color: white;
  transition: .3s;
}

.button-product--blank {
  background: white;
  color: #976534;
  transition: .3s;
}

.button-product__icon {
  margin-right: 8px;
}

.button {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  padding: 16px 32px;
  border-radius: 8px;
  text-decoration: none;
  text-align: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  cursor: pointer;
  display: inline-block;
  border: 2px solid var(--primary2-color);
  background-color: #FFF;
}

/* Third Button */

.button__main {
  display: inline-flex;
  margin: 0;
  color: var(--primary2-color);
  background-color: #fff;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.button__link {
  color: #FFF;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  white-space: nowrap;
}

.button__main {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.button__main .button__link {
  position: relative;
  transition: all .45s ease-Out;
}

.button__circle {
  display: none;
  width: 0%;
  height: 0%;
  opacity: 0;
  border-radius: 50%;
  background: #141414;
  position: absolute;
  transition: all .5s ease-Out;
  top: 50%;
  left: 50%;
}

.button__main:hover .button__circle {
  width: 200%;
  height: 500%;
  opacity: 1;
  top: -200%;
  left: -50%;
}

.button__main:hover {
  background-color: var(--primary3-color);
  border-color: var(--primary3-color);
  transition: .7s ease-Out;
}

.button__main:hover .button__link {
  color: #FFF;
}

.button:disabled {
  opacity: .4;
  pointer-events: none;
  transition: .3s;
}

.button > * {
  pointer-events: none;
}

.button--half {
  width: 50%;
}

.button--word {
  color: #976534;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  padding: 0;
  transition: .3s;
}

.button--word::before {
  content: "";
  width: 0;
  height: 1px;
  position: absolute;
  bottom: 0;
  right: 0;
  background: #976534;
  transition: .3s;
}

.button--word:hover:before {
  width: 100%;
  left: 0;
  background: #976534;
}

.button--word:hover {
  color: #976534;
  transition: .3s;
}

.button--orange {
  background: #F0DBC5;
  transition: .3s;
}

.button--orange:hover {
  background: #D2BDA6;
  transition: .3s;
}

.button--white {
  background-color: white;
  border: 1px var(--black3-color) solid;
}

.button--white::after {
  background: #FAFAFA;
  transition: .3s;
}

.button--transparent {
  background: transparent;
  border: none;
  transition: .3s;
}

.button--transparent:hover {
  opacity: .5;
  transition: .3s;
}

.button--gray {
  background: #FAFAFA;
  transition: .3s;
}

.button--gray:hover {
  background: #404040;
  color: white;
  transition: .3s;
}

.button--full {
  width: 100%;
}

.button--small {
  font-size: 16px;
  line-height: 24px;
  padding: 8px 0;
}

.button--240 {
  width: 240px;
}

.button--active .button__cart {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.button__text {
  position: relative;
  z-index: 2;
  text-align: center;
  white-space: nowrap;
}

.button__cart {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #D2BDA6;
  color: #404040;
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.searchcard {
  position: absolute;
  top: 80px;
  left: 0;
  width: 100%;
  padding: 40px;
  z-index: 110;
  background-color: white;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
}

.searchcard__block {
  margin-bottom: 40px;
}

.searchcard__title {
  font-size: 20px;
  line-height: 34px;
  margin-bottom: 16px;
}

.searchcard__item {
  opacity: 0.5;
  margin-bottom: 16px;
  transition: .3s;
}

.searchcard__item:hover {
  color: #976534;
  opacity: 1;
  transition: .3s;
}

.searchcard__item--flex {
  display: flex;
  justify-content: space-between;
}

.button-quad {
  width: 80px;
  height: 80px;
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.button-quad--small {
  width: 64px;
  height: 64px;
}

.button-quad--search {
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.button-quad--visible {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.button-quad--gray {
  background: #FAFAFA;
  transition: .3s;
}

.button-quad--gray:hover {
  background: #976534;
  transition: .3s;
}

.button-quad--white {
  background: white;
  transition: .3s;
}

.button-quad--white:hover {
  background: #FAFAFA;
  transition: .3s;
}

.button-quad--gray:hover .button-quad__svg {
  fill: white;
  transition: .3s;
}

.button-quad--brown {
  background: #F0DBC5;
  transition: .3s;
}

.button-quad--brown:hover {
  background: #D2BDA6;
  transition: .3s;
}

.button-quad--plain {
  background: rgba(255, 255, 255, 0.1);
}

.button-quad--plain .button-quad__svg path:first-child {
  fill: white;
  transition: .3s;
}

.button-quad--plain:after {
  background: #FAFAFA;
}

.button-quad--plain:hover .button-quad__svg path:first-child {
  fill: black;
  transition: .3s;
}

.button-quad--grid {
  background: white;
  transition: .3s;
}

.button-quad--grid:hover {
  background: #F9F7F4;
  transition: .3s;
}

.button-quad--grid:hover .button-quad__svg {
  fill: #976534;
  transition: .3s;
}

.button-quad--gridactive {
  background: #976534;
  pointer-events: none;
}

.button-quad--gridactive .button-quad__svg {
  fill: white;
}

.button-quad--active:after {
  height: 100%;
}

.button-quad--active .button-quad__svg {
  fill: white;
}

.button-quad__svg {
  position: relative;
  z-index: 2;
  transition: .3s;
}

.mobile-menu__wrapper {
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 20;
  min-width: 360px;
}

.mobile-menu__list {
  height: 60px;
  display: flex;
  align-items: center;
  background-color: var(--primary-container);
}

.mobile-menu__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  align-items: center;
  padding: 10px 0;
  position: relative;
  cursor: pointer;
}

.mobile-menu__link {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
}

.mobile-menu__icon {
  width: 24px;
  height: 24px;
}

.mobile-menu__icon svg {
  width: 100%;
  height: 100%;
}

.mobile-menu__icon--cart {
  display: flex;
  width: 68px;
  height: 68px;
  background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
  color: #fff;
  border-radius: 50%;
  position: absolute;
  border: 8px solid var(--primary-container);
  bottom: 0;
}

.mobile-menu__icon--cart svg {
  transform: scale(2.2);
  width: 16px;
  height: 16px;
  margin: auto;
}

.mobile-menu__title {
  font-size: 12px;
  line-height: 12px;
}

.cart-menu__btn {
  min-width: 76px;
  height: 60px;
}

.mobile-overlay {
  background: #00000080;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 8;
}

.mobile-content {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding-top: 45px;
  z-index: 9;
  min-width: 360px;
  max-height: 90vh;
}

.mobile-content__wrapper {
  padding: 0 24px;
  background-color: #fff;
  border-radius: 24px 24px 0 0;
  max-height: 90vh;
  overflow-y: auto;
  padding-bottom: 45px;
  scrollbar-width: none;
}

.mobile-content__wrapper::-webkit-scrollbar {
  display: none;
}

.mobile-content__close {
  position: absolute;
  width: 48px;
  height: 48px;
  box-shadow: 0px 0px 24px 0px #00000040;
  border-radius: 50%;
  right: 16px;
  top: 29px;
  z-index: 10;
  cursor: pointer;
}

.mobile-content__close svg {
  width: 100%;
  height: 100%;
}

.mobile-content__back {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.mobile-content__back svg {
  width: 11px;
  height: 9px;
}

.mobile-content__close-big {
  cursor: pointer;
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin: 0px auto 0;
}

.mobile-content__close-big svg {
  width: 100%;
  height: 100%;
}

.mobile-content__header {
  width: 100%;
  padding: 16px 0;
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}

.mobile-content__search {
  width: 100%;
  position: relative;
  margin-bottom: 24px;
}

.mobile-content__input {
  width: 100%;
  padding: 8px 16px 8px 48px;
  border: 2px solid #EAE6E0;
  border-radius: 8px;
}

.mobile-content__label {
  font-size: 12px;
  line-height: 16px;
  color: #141414;
  opacity: 80%;
  width: 100%;
}

.mobile-content__footer {
  padding: 40px 0 40px;
}

.mobile-content__logo {
  height: 29px;
}

.mobile-content__logo img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.mobile-content__logo svg {
  width: 100%;
  height: 100%;
}

.mobile-content__item {
  padding: 16px 0;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  cursor: pointer;
}

.mobile-content__item--accent {
  padding-bottom: 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid #D9D9D9;
}

.mobile-content__item--accent .mobile-content__title {
  color: var(--primary2-color);
}

.mobile-content__item--new::after {
  content: '';
  background-image: url("https://slonpp.com/wa-data/public/site/img/new.webp");
  position: absolute;
  width: 24px;
  height: 24px;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
}

.mobile-content__row {
  display: flex;
}

.mobile-content__icon {
  width: 50px;
  height: 50px;
  margin-right: 15px;
  position: relative;
}

.mobile-content__icon svg {
  width: 100%;
  height: 100%;
}

.mobile-content__link {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.mobile-content__title {
  font-size: 14px;
  line-height: 21px;
  color: #404040;
  font-weight: 600;
  display: flex;
  gap: 8px;
  width: 100%;
  align-items: center;
}

.mobile-content__title .mobile-content__sublink {
  color: var(--primary2-color);
  font-weight: 400;
  margin-left: auto;
  text-align: right;
}

.mobile-content__title--margin {
  margin-top: 16px;
}

.mobile-content__arrow {
  width: 24px;
  height: 24px;
  margin-left: auto;
}

.mobile-content__arrow svg {
  width: 100%;
  height: 100%;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions-window__wrapper {
  width: 100%;
  padding: 40px 24px !important;
  padding-top: 64px !important;
  background-color: #fff;
  border-radius: 24px 24px 0 0;
  max-height: 75vh;
  margin-bottom: 0;
  overflow-y: visible;
  scrollbar-width: none;
  bottom: 0;
  display: flex;
  flex-direction: column;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions-window__sub-header {
  display: none;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions__button-close {
  content: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 48 49%27 fill=%27none%27%3E%3Crect y=%270.728516%27 width=%2748%27 height=%2748%27 rx=%2724%27 fill=%27white%27%3E%3C/rect%3E%3Cpath d=%27M18 18.7285L30 30.7285%27 stroke=%27black%27%3E%3C/path%3E%3Cpath d=%27M30 18.7285L18 30.7285%27 stroke=%27black%27%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
  width: 48px;
  height: 48px;
  box-shadow: 0px 0px 24px 0px #00000040;
  border-radius: 50%;
  right: 16px;
  top: -16px;
  z-index: 101;
  cursor: pointer;
  padding: 0px;
  background: #fff;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions__link {
  font-family: Montserrat;
  font-weight: 600;
  color: #404040;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions-window__wrapper .mobile-content__footer {
  margin-top: auto;
}

.shop-regions__window .shop-regions-window_mobile .shop-regions-window__region {
  margin-bottom: 16px;
}

.button {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  padding: 16px 32px;
  border-radius: 8px;
  text-decoration: none;
  text-align: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  cursor: pointer;
  display: inline-block;
  border: 2px solid var(--primary2-color);
  background-color: #FFF;
}

/* Third Button */

.button__main {
  display: inline-flex;
  margin: 0;
  color: var(--primary2-color);
  background-color: #fff;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.button__link {
  color: #FFF;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  white-space: nowrap;
}

.button__main {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.button__main .button__link {
  position: relative;
  transition: all .45s ease-Out;
}

.button__circle {
  display: none;
  width: 0%;
  height: 0%;
  opacity: 0;
  border-radius: 50%;
  background: #141414;
  position: absolute;
  transition: all .5s ease-Out;
  top: 50%;
  left: 50%;
}

.button__main:hover .button__circle {
  width: 200%;
  height: 500%;
  opacity: 1;
  top: -200%;
  left: -50%;
}

.button__main:hover {
  background-color: var(--primary3-color);
  border-color: var(--primary3-color);
  transition: .7s ease-Out;
}

.button__main:hover .button__link {
  color: #FFF;
}

.button:disabled {
  opacity: .4;
  pointer-events: none;
  transition: .3s;
}

.button > * {
  pointer-events: none;
}

.button--half {
  width: 50%;
}

.button--word {
  color: #976534;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  padding: 0;
  transition: .3s;
}

.button--word::before {
  content: "";
  width: 0;
  height: 1px;
  position: absolute;
  bottom: 0;
  right: 0;
  background: #976534;
  transition: .3s;
}

.button--word:hover:before {
  width: 100%;
  left: 0;
  background: #976534;
}

.button--word:hover {
  color: #976534;
  transition: .3s;
}

.button--orange {
  background: #F0DBC5;
  transition: .3s;
}

.button--orange:hover {
  background: #D2BDA6;
  transition: .3s;
}

.button--white {
  background-color: white;
  border: 1px var(--black3-color) solid;
}

.button--white::after {
  background: #FAFAFA;
  transition: .3s;
}

.button--transparent {
  background: transparent;
  border: none;
  transition: .3s;
}

.button--transparent:hover {
  opacity: .5;
  transition: .3s;
}

.button--gray {
  background: #FAFAFA;
  transition: .3s;
}

.button--gray:hover {
  background: #404040;
  color: white;
  transition: .3s;
}

.button--full {
  width: 100%;
}

.button--small {
  font-size: 16px;
  line-height: 24px;
  padding: 8px 0;
}

.button--240 {
  width: 240px;
}

.button--active .button__cart {
  visibility: visible;
  opacity: 1;
  transition: .3s;
}

.button__text {
  position: relative;
  z-index: 2;
  text-align: center;
  white-space: nowrap;
}

.button__cart {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #D2BDA6;
  color: #404040;
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}

.wa-signup-form-actions {
  display: flex;
  flex-direction: column-reverse;
}

.wa-login-url {
  display: flex;
  justify-content: flex-start;
  gap: 8px;
}

.wa-signup-form-wrapper .wa-field .wa-value label {
  display: flex;
  align-items: flex-start;
}

.wa-field-terms-accepted label {
  align-items: center;
  margin-top: 16px;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  color: var(--black5-color);
}

.wa-field-terms-accepted a {
  color: var(--black5-color);
}

.wa-field-terms-accepted input {
  position: absolute;
  z-index: -1;
  opacity: 0;
}

.wa-field-terms-accepted label {
  display: inline-flex;
  align-items: center;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  letter-spacing: 0.02em;
}

.signup__custom {
  content: '';
  display: inline-block;
  cursor: pointer;
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  flex-grow: 0;
  opacity: .3;
  border: 1px solid #141414;
  border-radius: 2px;
  margin: 3px 8px 2px 2px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 50% 50%;
  transition: .3s ease-in-out;
}

.signup__custom:hover {
  border-color: #25AB1A;
  transition: .3s ease-in-out;
  opacity: 1;
}

.checked {
  content: url("data:image/svg+xml,%3Csvg width=%278%27 height=%276%27 viewBox=%270 0 8 6%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M1.00781 2.78116L2.9043 4.6777L6.98678 0.595215%27 stroke=%27%2325AB1A%27/%3E%3C/svg%3E%0A");
  border-color: #25AB1A;
  opacity: 1;
  padding: 2px 1px 1px 1px;
}

.wa-info-msg {
  text-align: center;
  padding: 0 16px;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
}

.wa-signup-form-wrapper .wa-field-terms-accepted a {
  display: inline;
  color: var(--primary2-color);
  opacity: 1;
  transition: color .3s ease-in-out;
  display: contents;
}

.wa-signup-form-wrapper .wa-field-terms-accepted a:hover {
  transition: color .3s ease-in-out;
  color: #994000;
}

@media (max-width: 768px) {
  .notification {
    top: auto;
    right: auto;
    bottom: 76px;
    left: 50%;
    min-width: calc(100% - 80px);
    transform: translateX(-50%);
  }
  .notification__item {
    position: absolute;
    top: auto;
    left: 0;
    bottom: 0;
    width: 100%;
  }
  @-webkit-keyframes slide-out {
    from {
      transform: translateY(0);
    }
    to {
      transform: translateY(100%);
    }
  }
  @keyframes slide-out {
    from {
      transform: translateY(0);
    }
    to {
      transform: translateY(100%);
    }
  }
  @-webkit-keyframes slide-in {
    from {
      transform: translateY(100%);
    }
    to {
      transform: translateY(0);
    }
  }
  @keyframes slide-in {
    from {
      transform: translateY(100%);
    }
    to {
      transform: translateY(0);
    }
  }
  .empty__container .title {
    font-size: 24px;
    line-height: 32px;
    flex-direction: column;
    align-items: flex-start;
  }
  .empty__container .title__count {
    margin: 0 !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    color: var(--on-background-color);
  }
  .empty__title {
    font-size: 14px;
    line-height: 21px;
  }
  .empty__box {
    margin-bottom: 40px;
  }
  .empty__box svg {
    width: 328px;
    height: 159px;
  }
  .empty__description .button {
    padding: 12px 24px;
    font-size: 14px;
    line-height: 21px;
  }
  .footer {
    background-color: var(--surface-variant);
  }
}

@media (max-width: 1024px) {
  .header {
    min-width: 360px;
    min-width: 360px;
  }
  .menu {
    display: none;
    display: none;
  }
}

@media (max-width: 1200px) {
  .empty__container .title {
    font-size: 32px;
    line-height: 40px;
    flex-direction: row;
  }
}

@media (max-width: 1350px) {
  .header__name {
    display: none;
  }
  .header__right {
    display: flex;
    justify-content: space-between;
  }
  .header__group:not(:last-of-type) {
    padding-right: 16px;
  }
  .header__middle .header__groupblock:not(:last-of-type) {
    margin-right: 20px;
  }
  .header__name {
    display: none;
  }
  .header__right {
    display: flex;
    justify-content: space-between;
  }
  .header__group:not(:last-of-type) {
    padding-right: 16px;
  }
  .header__middle .header__groupblock:not(:last-of-type) {
    margin-right: 20px;
  }
  .sidebar {
    width: 300px;
  }
}

@media (max-width: 390px) {
  .notification {
    min-width: calc(100% - 48px);
  }
}

@media (max-width: 620px) {
  .login,
  .signup {
    padding: 16px 16px;
    min-width: 320px;
  }
  .wa-signup-form-wrapper > form,
  .wa-forgotpassword-form-wrapper > form {
    padding: 0;
  }
  .login__container,
  .signup__container {
    width: 100%;
  }
  .wa-login-form-wrapper,
  .wa-signup-form-wrapper,
  .wa-forgotpassword-form-wrapper {
    width: 100%;
  }
  .wa-login-form-wrapper .wa-login-form-fields,
  .wa-signup-form-wrapper .wa-signup-form-fields,
  .wa-forgotpassword-form-wrapper .wa-forgotpassword-form-fields {
    gap: 8px;
  }
  .wa-login-form-wrapper .js-wa-form-item {
    padding: 0;
  }
  .focus {
    transform: translate(0, -16px) scale(0.55);
    color: var(--grey-color);
    font-weight: 600;
    line-height: 16px;
  }
  .wa-value {
    font-size: 14px;
    line-height: 21px;
  }
  .wa-login-form-wrapper input[type="text"],
  .wa-signup-form-wrapper input[type="text"],
  .wa-forgotpassword-form-wrapper input[type="text"],
  .wa-login-form-wrapper input[type="email"],
  .wa-signup-form-wrapper input[type="email"],
  .wa-login-form-wrapper input[type="password"],
  .wa-signup-form-wrapper input[type="password"] {
    border: 1px solid var(--outline-color);
    font-size: 14px;
    line-height: 21px;
  }
  .wa-login-form-wrapper input[type="text"]:focus,
  .wa-signup-form-wrapper input[type="text"]:focus,
  .wa-forgotpassword-form-wrapper input[type="text"]:focus,
  .wa-login-form-wrapper input[type="email"]:focus .wa-field-login,
  .wa-signup-form-wrapper input[type="email"]:focus,
  .wa-login-form-wrapper input[type="password"]:focus .wa-field-password,
  .wa-signup-form-wrapper input[type="password"]:focus .wa-field-password {
    border: 1px solid var(--primary2-color);
  }
  .wa-login-form-wrapper .wa-login-form-actions {
    margin-top: 8px;
  }
  .wa-login-form-wrapper .wa-login-form-actions .wa-login-forgotpassword-url {
    margin-right: 24px;
  }
  .wa-signup-form-wrapper .wa-login-url {
    justify-content: space-between;
  }
}