* {
  margin: 0;
}

body {
  flex-direction: column;
  display: flex;
  font-family: "SF Pro Display";
}

html,
body {
  height: 100%;
}

a {
  text-decoration: none;
  cursor: pointer;
  color: inherit;
}

button {
  cursor: pointer;
  outline: none;
  border: none;
}

p,
span,
h1,
h2 {
  cursor: default;
}

input,
select {
  border: 0;
  outline: none;
}

input[type=checkbox] {
  width: 24px;
  height: 24px;
  accent-color: #0A96DC;
}

ul,
ol {
  margin: 0;
  padding-left: 24px;
}

li {
  margin: 0;
  padding: 0;
}

.no-scroll {
  overflow: hidden;
}

.hide-on-monitor {
  display: none;
}

.show-on-monitor {
  display: block;
}

.content,
.page {
  display: flex;
  width: 95%;
  max-width: 1720px;
  margin: 0 auto;
}

.page {
  flex-direction: column;
  margin-top: 125px;
}

.page--pagination-support {
  position: relative;
  margin-bottom: 90px;
}

.page--big-margin {
  margin-top: 165px;
}

.page__holder {
  margin: 180px auto 234px auto;
  font-size: 36px;
  line-height: 43px;
  font-weight: 400;
  text-align: center;
}
.page__holder a {
  color: #0067D8;
  transition: 0.3s;
}
.page__holder a:hover {
  text-decoration: underline;
}
.page__holder a:active {
  transition: 0.05s;
  filter: brightness(0.6);
}

.page__pathline {
  margin-top: 40px;
}

.page--wide {
  max-width: 1760px;
}

.page__title {
  margin-top: 40px;
  font-size: 48px;
  line-height: 57px;
  font-weight: 400;
}

.page__title--bottom-indent {
  margin-bottom: 20px;
}

.content--centered-items {
  align-items: center;
}

.content--vertical {
  flex-direction: row;
}

.hide {
  display: none !important;
}

.flex {
  display: flex;
}

.self-end {
  align-self: end;
}

.width-fit {
  max-width: 1512px;
}

.dots {
  display: flex;
  gap: 6.5px;
}

.dots--wide-gap {
  gap: 12px;
}

.dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #B9B9B9;
  transition: 0.3s;
}

.dot--active {
  background: #0A96DC;
}

.dot--bold {
  width: 16px;
  height: 16px;
  box-sizing: border-box;
  border: 2px solid #0A96DC;
  background: #040404;
}

.dot--bold.dot--active {
  border: 2px solid #040404;
  background: #0A96DC;
}

.section {
  display: flex;
  flex-direction: column;
}

.section--row {
  flex-direction: row;
}

.button {
  display: flex;
  background: #0A96DC;
  color: #FFFFFF;
  transition: 0.35s;
  border-radius: 10px;
  border: 1px solid #0A96DC;
  font-weight: 500;
  padding: 16px 32px;
  align-items: center;
  gap: 10px;
}
.button:hover {
  background: #FFFFFF;
  color: #834F1D;
  border: 1px solid #834F1D;
}
.button:active {
  transition: 0.05s;
  color: #0A96DC;
  border: 1px solid #0A96DC;
}

.button--disabled {
  pointer-events: none;
  filter: grayscale(1);
}

.button--box {
  padding: 6px;
}

.button--wide {
  padding: 13.5px 45px;
}

.button--wide-fat {
  padding: 15px 45px;
}

.button--rect {
  padding: 8px 32px;
}

.button--narrow {
  padding: 6px 46px;
}

.button--alternative-hover:hover {
  background: #0067D8;
  color: #FFFFFF;
  border: 1px solid #0A96DC;
}
.button--alternative-hover:active {
  filter: brightness(0.85);
}

.button--no-active {
  border: 1px solid #0A96DC;
  background: #FFFFFF;
  color: #834F1D;
}
.button--no-active:hover {
  border: 1px solid currentColor;
  color: #0A96DC;
}
.button--no-active:active {
  color: #0067D8;
}

.button-round {
  width: 42px;
  height: 42px;
  box-sizing: border-box;
  padding: 6px;
  border: 1px solid currentColor;
  transition: 0.4s;
  border-radius: 50%;
  color: #834F1D;
}
.button-round svg {
  width: 100%;
  height: 100%;
}
.button-round:hover {
  color: #0A96DC;
}
.button-round:active {
  transition: 0.05s;
  color: #0067D8;
}

.button-round--forced-width42 {
  min-width: 42px;
}

.button-round--forced-width {
  min-width: 50px;
}

.button-round--switch {
  padding: 15px;
  border: 1px solid #0A96DC;
  width: 50px;
  height: 50px;
  background: #0A96DC;
  color: #FFFFFF;
}
.button-round--switch:hover {
  border: 1px solid #834F1D;
  color: #834F1D;
  background: #FFFFFF;
}

.button-active.button-round {
  color: #0067D8 !important;
}

.button-round .button__popup {
  margin-left: -6px;
}

.haze-button {
  background: linear-gradient(180deg, rgba(217, 217, 217, 0.04) 0%, rgba(217, 217, 217, 0.02) 100%);
  /* Matt | class */
  box-shadow: inset 0px 0px 50px rgba(255, 255, 255, 0.15), inset 0px -2px 2px rgba(0, 0, 0, 0.25), inset 0px 2px 2px rgba(255, 255, 255, 0.25);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  padding: 32px 2px;
  color: #0A96DC;
  transition: 0.2s;
}
.haze-button:hover {
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
}
.haze-button:active {
  transition: 0.05s;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}

.haze-button--pin-left {
  position: absolute;
  left: 0;
}

.haze-button--pin-right {
  position: absolute;
  right: 0;
}

.haze-button--horizontal {
  padding: 2px 32px;
}

.searchbar {
  display: flex;
  align-items: center;
  margin: 0 auto;
  width: 90%;
  height: 42px;
  max-width: 602px;
  color: #B9B9B9;
}

.searchbar--wide {
  width: 100%;
  height: 50px;
  max-width: unset;
}

.searchbar__input-container {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  transition: 0.3s;
  align-items: center;
  border-radius: 100px;
  border: 1px solid #834F1D;
  height: 100%;
}
.searchbar__input-container img,
.searchbar__input-container svg {
  margin-left: 20px;
}
.searchbar__input-container:hover {
  border: 1px solid #0A96DC;
  color: #0A96DC;
}

.searchbar__input {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  color: #000000;
  background: transparent;
  margin-left: 31px;
  width: 85%;
  transition: 0.3s;
}

.searchbar__button {
  margin-left: 34px;
}

.searchbar__input::-moz-placeholder {
  color: #B9B9B9;
}

.searchbar__input::placeholder {
  color: #B9B9B9;
}

.searchbar-relations {
  background: #FFFFFF;
  top: 72px;
  position: absolute;
  left: 0;
  right: 0;
}
.searchbar-relations .tabs--scroll {
  padding-bottom: 0 !important;
}
.searchbar-relations .tabs__tab {
  margin: 12px 0;
}

.tabs {
  display: flex;
  flex-direction: row;
  gap: 16px;
}

.tabs--scroll {
  align-items: start;
  overflow: auto;
  padding-bottom: 9px;
  scrollbar-color: #834F1D transparent;
}
.tabs--scroll::-webkit-scrollbar {
  height: 12px;
  border-top: 3.5px solid #FFFFFF;
  border-bottom: 3.5px solid #FFFFFF;
  background: #B9B9B9;
  border-radius: 5px;
}
.tabs--scroll::-webkit-scrollbar:hover {
  height: 12px;
  border-top: 3.5px solid #FFFFFF;
  border-bottom: 3.5px solid #FFFFFF;
}
.tabs--scroll::-webkit-scrollbar-thumb {
  background: #834F1D;
  border-top: 3.5px solid #FFFFFF;
  border-bottom: 3.5px solid #FFFFFF;
  border-radius: 5px;
  cursor: pointer;
}
.tabs--scroll::-webkit-scrollbar-thumb:hover {
  background: #0A96DC;
  border-radius: 6px;
  border-top: none;
  border-bottom: none;
}

.tabs__tab {
  border: 1px solid #0A96DC;
  background: #FFFFFF;
  color: #834F1D;
  white-space: nowrap;
}
.tabs__tab:hover {
  border: 1px solid #0A96DC;
  color: #834F1D;
  background: #0A96DC;
}
.tabs__tab:active {
  background: #0067D8 !important;
}

.tabs__tab--active {
  font-weight: 800;
  background: #0A96DC;
  color: #FFFFFF;
}
.tabs__tab--active:hover {
  background: #0A96DC;
  color: #FFFFFF;
  border: 1px solid #0A96DC;
}

.tabs__tab--toggled {
  font-weight: 800;
  background: #0A96DC;
  color: #FFFFFF;
}
.tabs__tab--toggled:hover {
  background: #0067D8;
  color: #FFFFFF;
  border: 1px solid #0A96DC;
}

.pathline {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  color: #5A5A5A;
  display: flex;
  gap: 13px;
  align-items: center;
}
.pathline a {
  padding: 0 8px;
  transition: 0.3s;
}
.pathline a:hover {
  color: #0A96DC;
}
.pathline a:active {
  color: #0067D8;
}
.pathline svg {
  min-width: 5px;
}

.logo {
  height: 42px;
  color: #064624;
}

.cart-open-counter {
  position: relative;
}
.cart-open-counter::after {
  content: attr(data-count);
  background: #F54949;
  padding: 2px 5px;
  color: #FFF;
  border-radius: 10px;
  right: 2px;
  position: absolute;
  top: 2px;
  line-height: 12px;
  font-size: 12px;
}

.mall-pagination {
  position: absolute;
  bottom: -90px;
  left: 50%;
  transform: translateX(-50%);
}
.mall-pagination li {
  display: flex;
  min-width: 30px;
  justify-content: center;
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  color: #834F1D;
}
.mall-pagination nav ul li:nth-last-child(1),
.mall-pagination li:nth-child(1) {
  background: #0A96DC;
  color: #FFFFFF;
  transition: 0.35s;
  border-radius: 10px;
  border: 1px solid #0A96DC;
  align-items: center;
  justify-content: center;
}
.mall-pagination nav ul li:nth-last-child(1):hover,
.mall-pagination li:nth-child(1):hover {
  background: #FFFFFF;
  color: #834F1D;
  border: 1px solid #834F1D;
}
.mall-pagination nav ul li:nth-last-child(1):active,
.mall-pagination li:nth-child(1):active {
  transition: 0.05s;
  color: #0A96DC;
  border: 1px solid #0A96DC;
}
.mall-pagination nav ul li:nth-last-child(1) a,
.mall-pagination nav ul li:nth-last-child(1) span,
.mall-pagination li:nth-child(1) a,
.mall-pagination li:nth-child(1) span {
  padding: 8px 18px;
}
.mall-pagination li.active {
  color: #0A96DC;
  font-size: 36px;
  margin-bottom: 7px;
}
.mall-pagination li.active span {
  text-decoration: underline;
}

.pagination {
  display: flex;
  padding: 0;
  list-style: none;
  gap: 14px;
  align-items: end;
}

.ss-result {
  margin-bottom: 15px;
  border: 1px solid #b9b9b9;
  border-radius: 10px;
  padding: 14px 22px;
  display: flex;
  gap: 20px;
}

.ss-result mark {
  background: #0A96DC;
  color: #FFFFFF;
}

.ss-result__image {
  border-radius: 10px;
}

.ss-result__title {
  font-weight: bold;
  display: flex;
}

.ss-result__badge {
  font-size: 13px;
  padding: 4px 8px;
  border-radius: 4px;
  margin: 0 0 auto auto;
  background: #0A96DC;
  color: #FFFFFF;
}

.ss-result__content {
  display: flex;
  width: 100%;
  flex-direction: column;
  justify-content: space-around;
}

.header {
  position: fixed;
  z-index: 100;
  height: 72px;
  width: 100%;
  margin-top: 50px;
  display: flex;
  background: #FFFFFF;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  transition: 0.55s;
}
.header:before {
  display: block;
  width: 100%;
  height: 50px;
  position: absolute;
  left: 0;
  margin-top: -50px;
  content: "";
  background: #0A96DC;
}

.header--static {
  box-shadow: none;
}
.header--static.is-hidden {
  margin-top: 50px !important;
}

.header.is-hidden {
  margin-top: 0;
}

.header__navigation {
  gap: 30px;
  display: flex;
  flex-direction: row;
}

.button__popup {
  content: attr(data-content);
  cursor: pointer;
  display: none;
  position: absolute;
  margin-top: 25px;
  padding: 16px 45px;
  border: 1px solid #0A96DC;
  border-radius: 10px;
  background: #FFFFFF;
  color: #834F1D;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  font-weight: 500;
  white-space: nowrap;
}

.show-popup {
  position: relative;
}
.show-popup .button__popup {
  display: block;
}
.show-popup.button-round {
  color: #0067D8 !important;
}

.menu-dynamic-icon {
  height: 100%;
  transform: rotate(0deg);
  transition: 0.5s ease-in-out;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.menu-dynamic-icon span {
  cursor: unset;
  height: 1px;
  width: 17px;
  background: currentColor;
  opacity: 1;
  transform: rotate(0deg);
  transition: 0.25s ease-in-out;
  transform-origin: left;
}
.menu-dynamic-icon.open span:nth-child(1) {
  transform: rotate(45deg);
}
.menu-dynamic-icon.open span:nth-child(2) {
  width: 0%;
  opacity: 0;
}
.menu-dynamic-icon.open span:nth-child(3) {
  transform: rotate(-45deg);
}
.menu-dynamic-icon.open span {
  margin-left: 4px;
}

.popup-search {
  display: none;
  background: #FFFFFF;
  margin-top: 72px;
  position: fixed;
  width: 100%;
}

.popup-search__searchbar {
  margin: 8px 0;
}

.popup-search__tabs {
  margin-top: 15px;
  width: 100%;
}

.popup-search__tabs--animation a:nth-child(1) {
  animation-delay: 0.1388888889s;
}
.popup-search__tabs--animation a:nth-child(2) {
  animation-delay: 0.2777777778s;
}
.popup-search__tabs--animation a:nth-child(3) {
  animation-delay: 0.4166666667s;
}
.popup-search__tabs--animation a:nth-child(4) {
  animation-delay: 0.5555555556s;
}
.popup-search__tabs--animation a:nth-child(5) {
  animation-delay: 0.6944444444s;
}
.popup-search__tabs--animation a:nth-child(6) {
  animation-delay: 0.8333333333s;
}
.popup-search__tabs--animation a:nth-child(7) {
  animation-delay: 0.9722222222s;
}
.popup-search__tabs--animation a:nth-child(8) {
  animation-delay: 1.1111111111s;
}

.tabs__autocomplete-tab {
  animation: blink-tabs 1.25s;
  gap: 0;
  white-space: pre;
}
.tabs__autocomplete-tab mark {
  background: #0A96DC;
  color: #FFFFFF;
}

.popup-search__content {
  flex-direction: column;
}

@keyframes blink-tabs {
  0% {
    background: #FFFFFF;
    color: #834F1D;
    pointer-events: none;
  }
  30% {
    background: #0A96DC;
    color: #FFFFFF;
  }
  99% {
    background: #FFFFFF;
    color: #834F1D;
    pointer-events: none;
  }
  100% {
    pointer-events: all;
  }
}
.footer {
  flex: 1 1 auto;
  background: #131415;
  width: 100%;
  margin-top: 40px;
  padding: 40px 0;
}

.footer__content {
  flex-direction: column;
  gap: 40px;
}

.footer__section {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.footer__searchbar {
  margin-left: 264px !important;
}
.footer__searchbar .searchbar__input {
  color: #FFFFFF;
}

.footer__categories {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  padding-left: 8px;
}

.footer__category {
  display: block;
  transition: 0.3s;
  padding: 7px 0;
  color: #5A5A5A;
}
.footer__category:hover {
  color: #0A96DC;
}
.footer__category:active {
  color: #0067D8;
}

.footer__about {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  line-height: 23px;
  color: #FFFFFF;
  flex-direction: column;
  max-width: 650px;
}

.single-info-container {
  display: flex;
  flex-direction: column;
  gap: 26px;
  max-width: 315px;
}

.single-info {
  gap: 16px;
  display: flex;
  flex-direction: column;
  color: #FFFFFF;
}
.single-info span {
  cursor: text;
}
.single-info img,
.single-info svg {
  height: 35px;
}
.single-info a {
  text-decoration: underline;
  transition: 0.2s;
}
.single-info a:hover {
  color: #0A96DC;
}
.single-info a:active {
  color: #0067D8;
}

.single-info__section {
  display: flex;
  align-items: center;
  gap: 8px;
}

.single-info__title {
  color: #B9B9B9;
}

#calendarOverlay {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  padding: 10px;
  border-radius: 13px;
  border: 1px solid #B9B9B9;
  z-index: 60;
}
#calendarOverlay table {
  width: 100%;
}
#calendarOverlay th,
#calendarOverlay td {
  padding: 11px 12px;
  text-align: center;
  cursor: default;
}
#calendarOverlay td.today {
  border-radius: 36px;
  background: #0A96DC;
  color: #FFFFFF !important;
}
#calendarOverlay td.disabled {
  color: #5A5A5A;
}
#calendarOverlay td.selectable {
  cursor: pointer;
}
#calendarOverlay th {
  color: #B9B9B9;
  font-size: 13px;
  line-height: 18px;
  text-transform: uppercase;
}
#calendarOverlay h2 {
  margin: 0;
  font-size: 20px;
  line-height: 24px;
  font-weight: 600;
}

.calendar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 5px;
}

.calendar-header__buttons {
  display: flex;
  gap: 30px;
}
.calendar-header__buttons button {
  background: none;
  border: none;
  font-size: 16px;
  cursor: pointer;
}

.homepage__banner {
  margin-top: 40px;
}

.homepage__products-gallery {
  margin-top: 32px;
}

.homepage__categories-promo {
  margin-top: 36px;
}

.banner {
  min-height: 392px;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  color: #FFFFFF;
  transition: opacity 1s ease;
  z-index: 1;
  overflow: hidden;
  border-radius: 12px;
  background: #040404;
}

.banner__inner {
  width: 100%;
  position: relative;
}
.banner__inner::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  content: "";
  display: block;
  z-index: 3;
  background: linear-gradient(96.9deg, #000000 30.06%, rgba(0, 0, 0, 0) 57.81%);
  transition: 0.65s ease;
}

.banner__background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: 2;
  transition: 0.65s ease;
}

.banner__content {
  transition: 0.65s ease;
  position: relative;
  z-index: 4;
}

.banner__title {
  font-size: 48px;
  line-height: 57px;
  font-weight: 400;
  margin: 12px 0 0 40px;
}

.banner__list {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  margin: 8px 0 10px 40px;
}

.banner__catalog-button {
  margin-bottom: 66px;
}

.banner__overlay-arrow-nav {
  position: absolute;
  display: flex;
  gap: 20px;
  bottom: 100px;
  right: 60px;
  z-index: 8;
}

.banner__overlay-center {
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);
  position: absolute;
  align-items: center;
  z-index: 4;
}

@keyframes bannerSlideLeft {
  from {
    opacity: 1;
    transform: translateX(0%);
  }
  to {
    opacity: 0;
    transform: translateX(-100%);
  }
}
@keyframes bannerSlideRight {
  from {
    opacity: 1;
    transform: translateX(0%);
  }
  to {
    opacity: 0;
    transform: translateX(1200px);
  }
}
.products-gallery {
  display: flex;
  flex-direction: column;
}

.products-gallery__dots {
  margin: 28px auto 0;
}

.products-gallery__tabs {
  margin: 0 103px;
}

.products-carousel {
  display: flex;
  gap: 53px;
  align-items: center;
  width: 100%;
}

.products-gallery__products-carousel {
  margin-top: 24px;
}

.products-carousel__inner {
  overflow: hidden;
  display: flex;
  gap: 53px;
}
.products-carousel__inner .product-card {
  min-width: 309px;
}

.categories-promo {
  background: linear-gradient(264.53deg, #1C1C1B 0%, #444443 100%);
  max-width: 1720px;
  width: 100%;
  min-height: 657px;
  position: relative;
  overflow: hidden;
}
.categories-promo::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  top: 50%;
  transform: translateY(-50%);
  height: 737px;
  content: "";
  display: block;
  z-index: 3;
  background: url("https://toolset.by/themes/toolset/assets/images/ui/banner__categories-overlay-all.png") right top/auto 100% no-repeat;
}

.categories-promo__overlay {
  position: absolute;
}

.categories-promo__overlay--top {
  top: 0;
  right: 30px;
  height: 20px;
}

.categories-promo__overlay--bottom {
  bottom: 0;
  left: 30px;
  height: 20px;
}

.categories-promo__overlay--gears {
  top: 90px;
  right: 47px;
  height: 480px;
  z-index: 1;
}

.categories-promo__photo {
  position: absolute;
  width: 400px;
  height: 573px;
}

.categories-promo__photo--mask1 {
  top: 50%;
  transform: translateY(-50%);
  right: 1160px;
}

.categories-promo__photo--mask2 {
  top: 50%;
  transform: translateY(-50%);
  right: 702px;
}

.categories-promo__categories {
  z-index: 4;
  position: relative;
  max-width: 376px;
  width: 100%;
  gap: 14px;
  display: flex;
  flex-direction: column;
  margin: 200px 30px 100px auto;
}

.category-spoiler__header {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  color: #0A96DC;
  display: flex;
  justify-content: space-between;
}
.category-spoiler__header p {
  cursor: pointer;
}
.category-spoiler__header svg {
  transition: 0.3s;
  transform: rotate(0.5turn);
}

.category-spoiler__header--open svg {
  transform: rotate(0) !important;
}

.category-spoiler__content {
  display: none;
  color: #5A5A5A;
  flex-direction: column;
}
.category-spoiler__content a {
  margin-bottom: 6px;
  display: block;
  transition: 0.35s;
}
.category-spoiler__content a:hover {
  color: #0A96DC;
}
.category-spoiler__content a:active {
  transition: 0.05s;
  color: #0067D8;
}

.menu-back {
  height: 100%;
  width: 100%;
  background: #FFFFFF;
  position: fixed;
  z-index: 98;
  display: none;
}

.menu {
  position: absolute;
  background: #FFFFFF;
  z-index: 99;
  left: 50%;
  transform: translateX(-50%);
  padding-top: 162px;
}
.menu ul {
  list-style: none;
  padding-left: 0;
  width: 100.1%;
}
.menu:target li {
  animation: show-menu__items 0.7s forwards;
}

.menu--scroll {
  overflow: auto;
  overflow-x: hidden;
  height: 70vh;
}

.menu__item {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
}
.menu__item a {
  color: #000000;
  display: flex;
  align-items: center;
  transition: 0.4s;
  padding: 15px 0;
}
.menu__item a:hover {
  color: #0A96DC;
  transform: translateX(12px);
}
.menu__item a:hover .menu__item-expand-icon {
  transform: translateX(-24px);
}
.menu__item a:active {
  color: #0067D8;
}
.menu__item img,
.menu__item svg {
  margin-right: 16px;
}

.menu__item-expand-icon {
  margin-right: 0 !important;
  margin-left: auto;
  transition: 0.4s;
}

.menu__item--focused {
  background: #0A96DC;
}
.menu__item--focused a:hover {
  color: #FFFFFF;
}

.submenu {
  display: none;
  height: 100%;
  top: 0;
}
.submenu li {
  opacity: 0;
}
.submenu:target {
  display: block;
  animation: show-submenu 0.35s forwards;
}
.submenu:target li {
  animation: show-submenu__items 0.7s forwards;
}
.submenu li:nth-child(1) {
  animation-delay: 0.1111111111s;
}
.submenu li:nth-child(2) {
  animation-delay: 0.2222222222s;
}
.submenu li:nth-child(3) {
  animation-delay: 0.3333333333s;
}
.submenu li:nth-child(4) {
  animation-delay: 0.4444444444s;
}
.submenu li:nth-child(5) {
  animation-delay: 0.5555555556s;
}
.submenu li:nth-child(6) {
  animation-delay: 0.6666666667s;
}
.submenu li:nth-child(7) {
  animation-delay: 0.7777777778s;
}
.submenu li:nth-child(8) {
  animation-delay: 0.8888888889s;
}
.submenu li:nth-child(9) {
  animation-delay: 1s;
}
.submenu li:nth-child(10) {
  animation-delay: 1.1111111111s;
}
.submenu li:nth-child(11) {
  animation-delay: 1.2222222222s;
}
.submenu li:nth-child(12) {
  animation-delay: 1.3333333333s;
}
.submenu li:nth-child(13) {
  animation-delay: 1.4444444444s;
}
.submenu li:nth-child(14) {
  animation-delay: 1.5555555556s;
}
.submenu li:nth-child(15) {
  animation-delay: 1.6666666667s;
}
.submenu li:nth-child(16) {
  animation-delay: 1.7777777778s;
}
.submenu li:nth-child(17) {
  animation-delay: 1.8888888889s;
}
.submenu li:nth-child(18) {
  animation-delay: 2s;
}
.submenu li:nth-child(19) {
  animation-delay: 2.1111111111s;
}
.submenu li:nth-child(20) {
  animation-delay: 2.2222222222s;
}
.submenu li:nth-child(21) {
  animation-delay: 2.3333333333s;
}
.submenu li:nth-child(22) {
  animation-delay: 2.4444444444s;
}
.submenu li:nth-child(23) {
  animation-delay: 2.5555555556s;
}
.submenu li:nth-child(24) {
  animation-delay: 2.6666666667s;
}
.submenu li:nth-child(25) {
  animation-delay: 2.7777777778s;
}
.submenu li:nth-child(26) {
  animation-delay: 2.8888888889s;
}
.submenu li:nth-child(27) {
  animation-delay: 3s;
}
.submenu li:nth-child(28) {
  animation-delay: 3.1111111111s;
}
.submenu li:nth-child(29) {
  animation-delay: 3.2222222222s;
}
.submenu li:nth-child(30) {
  animation-delay: 3.3333333333s;
}

.submenu__title {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
}
.submenu__title a {
  padding: 12px 16px;
  display: flex;
  transition: 0.3s;
  color: #000000;
  border-radius: 10px;
}
.submenu__title a:hover {
  background: #0A96DC;
  color: #FFFFFF;
  transform: none;
}
.submenu__title p {
  max-width: 88%;
  word-wrap: break-word;
}

.submenu-mini {
  margin-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
}

@keyframes show-submenu {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes show-submenu__items {
  0% {
    opacity: 0;
    pointer-events: none;
  }
  40% {
    opacity: 0;
    pointer-events: none;
  }
  99% {
    pointer-events: none;
  }
  100% {
    opacity: 1;
    pointer-events: all;
  }
}
@keyframes show-menu__items {
  0% {
    opacity: 0;
    pointer-events: none;
  }
  100% {
    opacity: 1;
    pointer-events: all;
  }
}
.catalog__tabs {
  margin-top: 8px;
}

.catalog__tabs-sort {
  float: right;
}

.catalog__sorting-bar {
  margin-top: 24px;
  display: flex;
  align-items: start;
  justify-content: space-between;
}

.catalog__content {
  margin-top: 32px;
  display: flex;
  gap: 10px;
}

.catalog__positions {
  margin-left: auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  -moz-column-gap: 30px;
       column-gap: 30px;
  row-gap: 24px;
  margin-bottom: 90px;
  position: relative;
}

.product-card {
  max-width: 309px;
  height: 558px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  background: #F8F8F8;
  border-radius: 10px;
  position: relative;
}
.product-card:hover {
  background: #F6F6F6;
}
.product-card:hover .product-card__image {
  transform: scale(1.02);
}
.product-card::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  content: "";
  border: 1px solid transparent;
  border-radius: 10px;
  transition: 0.25s;
  pointer-events: none;
}
.product-card:hover::after {
  border: 1px solid #0A96DC;
}

.product-card__inner {
  height: 100%;
  width: 100%;
  display: flex;
}

.product-card__info-section {
  margin: 0 21px auto;
  max-height: 172px;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.product-card__buy-section {
  margin: 15px 21px 12px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  position: relative;
}

.product-card__image-container {
  display: flex;
  border-radius: 10px;
  max-height: 314px;
  filter: brightness(0.88);
  background: #FFFFFF;
  overflow: hidden;
}

.product-card__image {
  transition: 0.3s;
  width: 100%;
  height: 314px;
  -o-object-fit: contain;
     object-fit: contain;
}

.product-card__label {
  position: absolute;
  top: 14px;
  left: 14px;
  padding: 4px 14px;
  opacity: 0.8;
  border-radius: 10px 0px;
  background: #E52000;
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: #FFFFFF;
}

.product-card__favorite-button {
  position: absolute;
  top: 6px;
  right: 6px;
  padding: 4px;
  max-width: 38px;
  color: transparent;
  transition: transform 0.45s cubic-bezier(0.18, 0.89, 0.32, 1.28), color 0.35s;
}

.product-card__favorite-button--animate {
  transform: translateY(-7px);
  color: #E52000;
}

.product-card__name {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  word-wrap: anywhere;
}

.product-card__description {
  min-height: 0;
  transition: 0.4s opacity;
  opacity: 0;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
}

.product-card__old-price {
  position: absolute;
  bottom: calc(100% - 10px);
  text-decoration: line-through;
  color: #B9B9B9;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
}

.product-card__price {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  margin: auto 0;
}

.product-card__buy-button {
  transition: all 0.35s, padding 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55), margin-right 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.product-card__buy-button svg {
  transition: opacity 0.3s;
}
.product-card__buy-button svg:nth-child(1) {
  opacity: 1;
}
.product-card__buy-button svg:nth-child(2) {
  opacity: 0;
  position: absolute;
}

.product-card__buy-button--checked {
  padding: 6px 8px;
  border-radius: 20px;
  margin-right: 38px;
}
.product-card__buy-button--checked svg:nth-child(1) {
  opacity: 0;
}
.product-card__buy-button--checked svg:nth-child(2) {
  opacity: 1;
  position: absolute;
}
.product-card__buy-button--checked:hover {
  background: #0A96DC;
  color: #FFFFFF;
  border: 1px solid #0A96DC;
}

.product-card__buy-button--checked-compact {
  border-radius: 20px;
}
.product-card__buy-button--checked-compact svg:nth-child(1) {
  opacity: 0;
}
.product-card__buy-button--checked-compact svg:nth-child(2) {
  opacity: 1;
  position: absolute;
}
.product-card__buy-button--checked-compact:hover {
  background: #0A96DC;
  color: #FFFFFF;
  border: 1px solid #0A96DC;
}

.product-card__buy-section--selection {
  gap: 15px;
}
.product-card__buy-section--selection .product-card__old-price,
.product-card__buy-section--selection .product-card__price {
  display: none;
}
.product-card__buy-section--selection .product-card__buy-button {
  padding: 6px !important;
}

.product-card__select {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  color: #834F1D;
  border: 1px solid #B9B9B9;
  border-radius: 10px;
  width: 100%;
  background: #FFFFFF;
}

.sorter {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding-left: 8px;
}

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

.sorter__title {
  font-size: 36px;
  line-height: 43px;
  font-weight: 400;
  margin-right: 12px;
}

.sorter__subline {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  margin-right: 12px;
}

.sorter__icon {
  max-height: 24px;
  box-sizing: border-box;
}
.sorter__icon svg path {
  color: #0A96DC;
  transition: 0.3s;
}
.sorter__icon svg rect {
  color: #834F1D;
  transition: 0.3s;
}
.sorter__icon:hover svg path {
  color: #FFFFFF;
}
.sorter__icon:hover svg rect {
  color: #0A96DC;
}
.sorter__icon svg:nth-child(2) {
  display: none;
}
.sorter__icon img {
  width: 100%;
}

.sorter__alt-sort-button {
  display: none;
  margin-left: auto;
}

.mall-products-filter {
  min-width: 245px;
  width: 14%;
  gap: 20px;
  display: flex;
  flex-direction: column;
}

.mall-property-group {
  padding: 0 8px;
}
.mall-property-group[open] .mall-property-group__name img,
.mall-property-group[open] svg {
  transform: rotate(0);
}

.mall-property-group__name {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  color: #834F1D;
  padding: 3px 0;
  margin-bottom: 8px;
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: space-between;
}
.mall-property-group__name img,
.mall-property-group__name svg {
  transition: 0.3s;
  transform: rotate(0.5turn);
  flex-shrink: 0;
}

.mall-filter__option,
.js-mall-clear-filter {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  cursor: pointer;
  color: #5A5A5A;
  word-wrap: anywhere;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 9px 8px 0;
  gap: 10px;
}
.mall-filter__option input,
.js-mall-clear-filter input {
  pointer-events: none;
  flex-shrink: 0;
}

.mall-filter--set:nth-child(1) {
  display: none;
}

.mall-form-control select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: #F6F6F6;
  padding: 12px 16px;
  width: 100%;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
}

#mall-sort-block {
  display: none;
}

.mall-property__label {
  display: none;
}

.cart__products-gallery {
  margin-top: 40px;
}

.cart__items {
  margin-top: 40px;
}

.items {
  display: flex;
  flex-direction: column;
  gap: 32px;
  border: 1px solid #B9B9B9;
  border-radius: 10px;
}
.items > article:not(:last-child)::after {
  content: "";
  position: absolute;
  width: 97.5%;
  height: 1px;
  background-color: #B9B9B9;
  bottom: -16px;
  left: 50%;
  transform: translateX(-50%);
}

.item {
  position: relative;
  padding: 14px 22px;
  display: flex;
  align-items: center;
  gap: 15px;
}

.item__preinfo {
  display: flex;
  align-items: center;
  gap: 50px;
}

.item__image {
  max-height: 112px;
  max-width: 115px;
  border-radius: 10px;
  -o-object-fit: contain;
     object-fit: contain;
}

.item__name {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}

.item__props {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 30px;
}

.item__props--pin-right {
  margin-left: auto;
}

.item__props-vertical-outer {
  gap: 24px;
  display: flex;
  flex-direction: column;
  margin-left: auto;
  flex-shrink: 0;
}

.item__prop {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.item__prop-title {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  color: #B9B9B9;
}

.item__price {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
}

.item__remove-button {
  margin: 0 22px 0 75px;
}

.item__remove-button--pin-right {
  margin: 0 0 0 auto;
}

.item__stepper {
  width: 170px;
  border: 1px solid #B9B9B9;
  border-radius: 10px;
  display: flex;
}

.item__stepper-input {
  margin: auto;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  color: #834F1D;
  min-width: 0;
  text-align: center;
  pointer-events: none;
}

.item__stepper-button {
  min-width: 42px;
  height: 42px;
  background: transparent;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  color: #834F1D;
  transition: 0.3s;
  border-radius: 10px;
}
.item__stepper-button.js-decrement {
  border-right: 1px solid #B9B9B9;
}
.item__stepper-button.js-increment {
  border-left: 1px solid #B9B9B9;
}
.item__stepper-button:hover {
  color: #FFFFFF;
  background: #0A96DC;
}
.item__stepper-button:active {
  transition: 0.06s;
  background: #0067D8;
}

.start-checkout {
  display: flex;
  align-items: center;
  justify-content: end;
  margin-top: 24px;
  background: #F6F6F6;
  padding: 16px 0;
  border-radius: 10px;
}

.start-checkout__price-container {
  display: flex;
  align-items: end;
}

.start-checkout__price-title {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  color: #B9B9B9;
  font-weight: 500;
}

.start-checkout__price {
  font-size: 36px;
  line-height: 43px;
  font-weight: 400;
  margin-left: 16px;
}

.start-checkout__button {
  margin-left: 24px;
}

.product__product-gallery {
  margin-top: 24px;
}

.product {
  margin-top: 40px;
  gap: 124px;
  display: flex;
}

.product-gallery {
  max-height: 500px;
  display: flex;
  flex-direction: row;
  gap: 10px;
}

.product-gallery__column {
  display: flex;
  position: relative;
}
.product-gallery__column img {
  width: 100px;
  height: 100px;
  -o-object-fit: contain;
     object-fit: contain;
  transition: 0.3s;
  border: 1px solid transparent;
  box-sizing: border-box;
}
.product-gallery__column .selected {
  border: 1px solid #0A96DC;
}

.product-gallery__column-images {
  overflow: hidden;
  display: flex;
  gap: 10px;
  flex-direction: column;
}

.product-gallery__preview {
  max-width: 500px;
  width: 100%;
}
.product-gallery__preview img {
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.product-gallery__scroll-button-prev {
  position: absolute;
  top: 0;
}

.product-gallery__scroll-button-next {
  position: absolute;
  bottom: 0;
}

.product-gallery__switch-button-prev {
  display: none;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.product-gallery__switch-button-next {
  display: none;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.product-details {
  color: #000000;
  display: flex;
  flex-direction: column;
  gap: 65px;
}

.product-details__name {
  font-size: 48px;
  line-height: 57px;
  font-weight: 400;
}

.product-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.product-section__name {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
}

.product-section__property {
  display: flex;
  align-items: end;
  gap: 8px;
  flex-wrap: wrap;
}
.product-section__property a {
  background: #834F1D;
  font-size: 13px;
  border-radius: 4px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  transition: 0.3s;
}
.product-section__property a:hover {
  background: #0A96DC;
}

.product-section__property--size a {
  width: 27px;
  height: 27px;
  border-radius: 50%;
  position: relative;
  margin: 7px;
  padding: 0;
}
.product-section__property--size a::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 2px solid #834F1D;
  transition: 0.3s;
  top: -6px;
  left: -6px;
  right: -6px;
  bottom: -6px;
}
.product-section__property--size a:hover:after {
  border: 2px solid #0A96DC;
}

.product-section__property--active {
  background: #E52000 !important;
}
.product-section__property--active::after {
  border: 2px solid #E52000 !important;
}
.product-section__property--active:hover {
  filter: brightness(0.85);
}

.product-section__price {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  font-weight: 500;
  display: inline;
}

.product-section__price-old {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  color: #B9B9B9;
  margin-left: 8px;
  vertical-align: top;
  text-decoration: line-through;
}

.product-section--payment-options {
  gap: 32px;
}

.product-section__payment-option {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  font-weight: 500;
  display: flex;
  align-items: end;
  gap: 12px;
}
.product-section__payment-option img,
.product-section__payment-option svg {
  height: 32px;
}

.product-section__payment-option-separator {
  width: 1px;
  background: #B9B9B9;
}

.product-section__container {
  display: flex;
  gap: 25px;
  flex-wrap: wrap;
}

.product-short-description__title {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
}

.product-short-description__text {
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
}

.product-description {
  width: 100%;
  min-height: 150px;
  margin-top: 24px;
}
.product-description img {
  max-width: 100%;
}
.product-description p img {
  max-width: 100%;
}

.checkout__checkout-sections {
  margin-top: 40px;
  max-width: 58%;
}
.checkout__checkout-sections .button {
  font-size: 16px;
}

.checkout__items {
  position: fixed;
  background: #F6F6F6;
  z-index: 50;
  max-width: 512px;
  right: 100px;
  max-height: 70vh;
  overflow: auto;
  overflow-x: hidden;
}
.checkout__items .item__remove-button {
  margin: 50px 0 0 auto;
}
.checkout__items .item__props {
  flex-basis: 70%;
  margin-left: 0 !important;
  margin-top: 25px;
}
.checkout__items .item {
  flex-wrap: wrap;
}

.checkout-floating-cart__title {
  width: 100%;
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  margin-bottom: -30px;
  padding: 24px;
}

.checkout-sections {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.checkout-section {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 16px;
  -moz-column-gap: 20px;
       column-gap: 20px;
}

.checkout-section__title {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  margin-bottom: 8px;
  grid-column: 1/-1;
}
.checkout-section__title a {
  color: #0A96DC;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  margin-left: 18px;
}

.checkout-section--grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.checkout-sections__separator {
  width: 100%;
  height: 1px;
  background: #B9B9B9;
}

.checkout-section--lock {
  color: #B9B9B9 !important;
}
.checkout-section--lock svg {
  filter: grayscale(1);
}
.checkout-section--lock a {
  pointer-events: none;
}

.checkout-field img,
.checkout-field svg {
  margin: -2px 10px -2px 0;
}

.checkout-field--no-active {
  pointer-events: none;
}
.checkout-field--no-active .checkout-field__value {
  background: #B9B9B9 !important;
}

.checkout-field--focused-text .checkout-field__value {
  color: #000000;
}

.checkout-field--full-grid {
  grid-column: 1/3;
}

.checkout-field__h3 {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
}

.checkout-field__label {
  margin-bottom: 8px;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  display: block;
}

.checkout-field__value {
  font-size: 16px;
  border: 1px solid #B9B9B9;
  color: #474747;
  border-radius: 5px;
  padding: 14px 10px;
  display: flex;
  width: 100%;
  box-sizing: border-box;
}

input.checkout-field__value {
  padding: 13px 10px;
}

.checkout-mark__label {
  margin-left: 14px;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  line-height: 23px;
  vertical-align: top;
  cursor: pointer;
}

.checkout-mark__checkmark {
  display: inline;
}

.mall-form-actions {
  display: flex;
  margin-top: 20px;
}

.checkout-loader {
  position: fixed;
  width: 100%;
  height: 100%;
  max-width: 100vw;
  max-height: 100vh;
  padding-top: 122px;
  background: #FFFFFF;
  z-index: 98;
}

.checkout-loader__state {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  gap: 30px;
  align-items: center;
}

.checkout-loader__state--pending {
  color: #B9B9B9;
}
.checkout-loader__state--pending .icon-pending {
  opacity: 1;
}

.checkout-loader__state--success {
  color: #0A96DC;
}
.checkout-loader__state--success .icon-success {
  opacity: 1;
}

.checkout-loader__state--error {
  color: #E52000;
}
.checkout-loader__state--error .icon-error {
  opacity: 1;
}

.checkout-loader__link {
  position: absolute;
  display: none;
  top: 50%;
  left: 50%;
  transform: translate(-50%, calc(-50% + 60px));
  text-align: center;
  color: #0A96DC;
  transition: 0.3s;
  text-decoration: underline;
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
}
.checkout-loader__link:hover {
  color: #0067D8;
}

.checkout-loader__icon {
  display: flex;
  color: inherit;
  position: relative;
}
.checkout-loader__icon svg {
  transition: 0.4s;
  position: absolute;
  opacity: 0;
}
.checkout-loader__icon .icon-pending {
  position: relative;
  animation: pending 1.2s linear infinite;
}

.checkout-loader__text {
  font-size: 36px;
  line-height: 43px;
  font-weight: 400;
  color: inherit;
  white-space: nowrap;
}

@keyframes pending {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(1turn);
  }
}
.only-on-pc {
  display: initial;
}

.only-on-mobile {
  display: none;
}

@media screen and (max-width: 1440px) {
  .content,
  .page {
    width: 90%;
    max-width: 1240px;
  }
  .catalog__positions {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .header__navigation {
    margin-left: auto;
  }
  .hide-on-monitor {
    display: block;
  }
  .show-on-monitor {
    display: none;
  }
  .categories-promo__photo--mask1 {
    display: none;
  }
  .checkout-floating-cart {
    max-width: 450px;
    right: 50px;
  }
}
@media screen and (max-width: 1280px) {
  .product {
    gap: 30px;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .product-gallery__preview img {
    width: 100%;
  }
  .checkout-floating-cart {
    max-width: 400px;
    right: 40px;
  }
}
@media screen and (max-width: 1024px) {
  .catalog__positions {
    grid-template-columns: 1fr 1fr;
  }
  .mall-products-filter {
    min-width: 200px;
  }
  .categories-promo__photo--mask2 {
    display: none;
  }
  .product {
    display: flex;
    gap: 124px;
    flex-direction: column;
    align-items: center;
  }
  .product-details {
    gap: 20px;
  }
  .searchbar-relations {
    display: none;
  }
  .checkout-floating-cart {
    display: none;
  }
  .checkout__checkout-sections {
    max-width: unset;
  }
  .item__remove-button {
    margin: 50px 0 0 auto;
  }
  .item__props {
    flex-basis: 70%;
    margin-left: 0 !important;
    margin-top: 50px;
  }
  .item {
    flex-wrap: wrap;
  }
  .start-checkout {
    flex-wrap: wrap;
    gap: 24px;
  }
  .favorites .item__remove-button {
    margin: 0 0 0 auto;
  }
  .favorites .item__buy {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .content,
  .page {
    width: 96%;
  }
  .banner__list {
    margin: 8px 0 150px 40px;
  }
  .banner__overlay-arrow-nav {
    bottom: 75px;
    right: 30px;
  }
  .products-carousel__inner {
    overflow: auto;
    scrollbar-color: transparent transparent;
  }
  .products-carousel__inner::-webkit-scrollbar {
    display: none;
  }
  .catalog__content {
    flex-direction: column;
    gap: 20px;
  }
  .catalog__positions {
    margin: 0 auto 90px auto;
  }
  .sorter__subline {
    margin-left: 0;
  }
  .mall-products-filter {
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
  }
}
.products-carousel .haze-button {
  display: none;
  z-index: 3;
}

@media screen and (max-width: 580px) {
  .only-on-pc {
    display: none;
  }
  .only-on-mobile {
    display: initial;
  }
  .pathline {
    overflow: auto;
    padding-bottom: 8px;
  }
  .pathline a {
    white-space: nowrap;
  }
  .homepage {
    width: 100%;
  }
  .banner {
    display: none;
  }
  .products-carousel {
    gap: 0;
  }
  .products-carousel .button-round {
    display: none;
  }
  .products-carousel .haze-button {
    display: block;
  }
  .products-carousel__inner {
    margin: 0 20px;
  }
  .products-gallery__tabs {
    margin: 0 20px;
    overflow: auto;
  }
  .product-details__name {
    font-size: 36px;
    line-height: 43px;
    font-weight: 400;
  }
  .product-gallery {
    max-height: unset;
    flex-direction: column;
    width: 100vw;
    position: relative;
    margin: 0 -16px;
  }
  .product-gallery__preview {
    max-width: unset;
    width: 100%;
  }
  .product-gallery__column {
    display: none;
  }
  .product-gallery__switch-button-next {
    display: block;
  }
  .product-gallery__switch-button-prev {
    display: block;
  }
  .footer__section {
    flex-direction: column;
    align-items: start;
    gap: 20px;
  }
  .footer__searchbar {
    margin-left: 0 !important;
    margin-right: auto !important;
  }
  .ss-result {
    flex-direction: column;
  }
  .ss-result__url {
    margin-top: 10px;
  }
}
@media screen and (max-width: 480px) {
  .menu {
    padding-top: 86px;
  }
  .menu--scroll {
    height: 80vh;
  }
  .page {
    margin-top: 86px;
  }
  .page--big-margin {
    margin-top: 298px;
  }
  .sorter {
    padding-left: 0;
    width: 100%;
  }
  .sorter__alt-sort-button {
    display: block;
  }
  .button--wide {
    padding: 12px 33px;
  }
  .page__title {
    margin-top: 0;
  }
  .header__navigation {
    margin-left: 0;
    gap: unset;
    justify-content: space-between;
    width: 100%;
  }
  .header {
    height: 65px;
    margin-top: 0;
  }
  .header::before {
    display: none;
  }
  .header .content {
    gap: 30px;
    align-items: center;
    padding: 10px 0;
    width: 92%;
  }
  .header.is-hidden {
    margin-top: 0;
  }
  .logo {
    height: 48px;
    color: #064624;
  }
  .button__popup {
    right: 10px;
  }
  .button-round {
    width: 35px;
    height: 35px;
    padding: 3px;
  }
  .button-round--forced-width42 {
    min-width: 35px;
  }
  .item__remove-button {
    width: 42px;
    height: 42px;
    min-width: 42px;
  }
  .popup-search {
    margin-top: 65px;
  }
  .searchbar__button {
    padding: 15px 20px;
    margin-left: 16px;
  }
  .mall-property-group__subcats .mall-property-group__name {
    display: none;
  }
  .catalog__positions {
    grid-template-columns: 1fr;
  }
  .catalog__sorting-bar {
    flex-direction: column;
    gap: 16px;
  }
  .catalog__tabs-sort {
    width: 100%;
  }
  .mall-products-filter {
    justify-content: center;
    display: none;
  }
  .homepage__products-gallery {
    margin-top: 0;
  }
  .items {
    padding: 36px 0;
  }
  .item__preinfo {
    display: flex;
    align-items: center;
    gap: 15px;
  }
  .item__name {
    flex-basis: 100%;
  }
  .item__props {
    flex-wrap: wrap;
  }
  .item__props-vertical-outer {
    flex-shrink: unset;
  }
  .item__prop--quantity {
    flex-basis: 100%;
  }
  .checkout-loader__state {
    gap: 0px;
    flex-direction: column;
  }
  .checkout-loader__link {
    top: 52%;
  }
}
@media screen and (max-width: 420px) {
  .categories-promo__categories {
    max-width: 320px;
  }
  .categories-promo__overlay--top {
    right: 0;
  }
  .categories-promo__overlay--bottom {
    left: 0;
  }
  .categories-promo__overlay--gears {
    right: 17px;
  }
  .category-spoiler__content a {
    font-size: 24px;
    line-height: 29px;
    font-weight: 400;
  }
  .products-carousel__inner {
    margin: 0 auto;
    width: 309px;
  }
  .sorter__title {
    font-size: 27px;
    margin-right: 9px;
  }
  .sorter__subline {
    font-size: 18px;
    margin-right: 9px;
  }
  .catalog__title {
    margin-top: 0;
  }
  .start-checkout__price-title {
    font-size: 16px;
    line-height: 19px;
    font-weight: 400;
  }
  .start-checkout__price {
    font-size: 24px;
    line-height: 29px;
    font-weight: 400;
  }
}
@media screen and (max-width: 360px) {
  .categories-promo__categories {
    margin: 200px 8px 100px auto;
  }
}
@media screen and (max-width: 350px) {
  .categories-promo__categories {
    margin: 200px 8px 100px auto;
    width: 94%;
  }
  .header .content {
    gap: 12px;
    width: 96%;
  }
  .product-card--expand {
    min-width: 250px;
  }
  .product-card {
    max-width: 250px;
  }
  .product-card__name {
    font-size: 20px;
    line-height: 20px;
  }
  .product-card__description {
    font-size: 15px;
    line-height: 17px;
  }
  .products-carousel__inner .product-card {
    min-width: 250px;
  }
  .products-carousel__inner {
    gap: 16px;
  }
  .product-gallery__tabs {
    flex-direction: column;
  }
  .page__title {
    font-size: 40px;
  }
  .checkout-loader__text {
    font-size: 24px;
    line-height: 29px;
    font-weight: 400;
  }
  .item__name {
    font-size: 16px;
    line-height: 19px;
    font-weight: 400;
  }
}