/*---------------------------------------------------
    LESS Elements 0.9
  ---------------------------------------------------
    A set of useful LESS mixins
    More info at: http://lesselements.com
  ---------------------------------------------------*/
.rich[contenteditable="true"] {
  -webkit-user-modify: read-only;
  -moz-user-modify: read-only;
  user-modify: read-only;
}
.menu-popover-trigger .close-icon {
  display: none;
}
.menu-popover-trigger.active .close-icon {
  display: block;
}
.menu-popover-trigger.active .burger-icon {
  display: none;
}
@media (min-width: 1024px) {
  .header__info-navigation-wrapper .button.large.icon-only.menu-popover-trigger {
    padding: 12px;
    gap: 12px;
    border-radius: 12px;
  }
}
@media (min-width: 1440px) {
  .header__info-navigation-wrapper .button.large.icon-only.menu-popover-trigger {
    padding: 12px 16px;
    border-radius: 8px;
  }
}
.header-menu-popover {
  z-index: 800;
}
.header-menu-popover.loading {
  display: none;
}
@media (min-width: 1024px) {
  .header-menu-popover .grid {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .header-menu-popover .grid .item {
    width: calc(25% - 16px);
  }
  .header-menu-popover .grid .item:nth-child(9),
  .header-menu-popover .grid .item:nth-child(10),
  .header-menu-popover .grid .item:nth-child(11) {
    width: calc(33.3% - 16px);
  }
}
.header-menu-popover .grid .item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-color: white;
  border-radius: 16px;
  padding: 24px;
  color: #0D0D0D;
  box-sizing: border-box;
  transition: .2s ease;
}
.header-menu-popover .grid .item:hover {
  background-color: #EAEEF9;
  color: #122E53;
}
.header-menu-popover .grid .item .item-title {
  flex: 1;
  margin: 0;
  font-weight: 500;
}
.header-menu-popover .grid .item svg {
  width: 32px;
  height: 32px;
  color: #122E53;
}
.header-menu-popover .grid .item.item-icon-right svg {
  margin-left: auto;
}
.header-menu-popover .grid .item:first-child {
  grid-area: 1 / 1 / 2 / 2;
}
.header-menu-popover .grid .item:nth-child(2) {
  grid-area: 1 / 2 / 2 / 4;
}
.header-menu-popover .grid .item:nth-child(3) {
  grid-area: 1 / 4 / 2 / 5;
}
.header-menu-popover .grid .item:nth-child(4) {
  grid-area: 2 / 1 / 3 / 2;
}
.header-menu-popover .grid .item:nth-child(5) {
  grid-area: 2 / 2 / 3 / 4;
}
.header-menu-popover .grid .item:nth-child(6) {
  grid-area: 2 / 4 / 3 / 5;
}
.header-menu-popover .grid .item:nth-child(7) {
  grid-area: 3 / 1 / 4 / 2;
}
.header-menu-popover .grid .item:nth-child(8) {
  grid-area: 3 / 2 / 4 / 4;
}
.header-menu-popover .grid .item:nth-child(9) {
  grid-area: 3 / 4 / 4 / 5;
}
.header-menu-popover .grid .item:nth-child(10) {
  grid-area: 4 / 1 / 5 / 3;
}
.header-menu-popover .grid .item:nth-child(11) {
  grid-area: 4 / 3 / 5 / 5;
}
.header-menu-popover .grid .item:nth-child(12) {
  grid-area: 5 / 1 / 8 / 5;
}
.header-menu-popover .modal-wrapper {
  overflow-y: auto;
  padding-top: 16px;
  padding-bottom: 16px;
}
@media (min-width: 1440px) {
  .header-menu-popover .modal-wrapper {
    display: grid;
    grid-template-columns: 64.17vw 1fr;
    grid-template-rows: 1fr;
    gap: 16px;
  }
}
@media (min-width: 1600px) {
  .header-menu-popover .modal-wrapper {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
}
.header-menu-popover .modal-wrapper .grid {
  display: grid;
  grid-template-columns: 2.15fr 1fr 1fr 2.15fr;
  gap: 16px;
  grid-template-rows: repeat(4, 124px);
  padding-bottom: 20px;
}
@media (min-width: 1024px) {
  .header-menu-popover .modal-wrapper .grid {
    align-content: flex-start;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px 20px;
    padding-bottom: 17px;
  }
  .header-menu-popover .modal-wrapper .grid .item {
    width: calc((100% - (20px * 3)) / 4);
  }
  .header-menu-popover .modal-wrapper .grid .item:not(.grohe-background) {
    max-height: 148px;
    height: 148px;
  }
  .header-menu-popover .modal-wrapper .grid .item:nth-child(9),
  .header-menu-popover .modal-wrapper .grid .item:nth-child(10),
  .header-menu-popover .modal-wrapper .grid .item:nth-child(11) {
    width: calc((100% - (20px * 2)) / 3);
  }
}
@media (min-width: 1440px) {
  .header-menu-popover .modal-wrapper .grid {
    gap: 16px;
    padding-bottom: 0;
  }
  .header-menu-popover .modal-wrapper .grid .item {
    width: calc((100% - (16px * 3)) / 4);
  }
  .header-menu-popover .modal-wrapper .grid .item:nth-child(9),
  .header-menu-popover .modal-wrapper .grid .item:nth-child(10),
  .header-menu-popover .modal-wrapper .grid .item:nth-child(11) {
    width: calc((100% - (16px * 2)) / 3);
  }
}
@media (min-width: 1600px) {
  .header-menu-popover .modal-wrapper .grid {
    margin-right: unset;
    gap: 24px;
  }
  .header-menu-popover .modal-wrapper .grid .item {
    width: calc((100% - (24px * 3)) / 4);
  }
  .header-menu-popover .modal-wrapper .grid .item:nth-child(9),
  .header-menu-popover .modal-wrapper .grid .item:nth-child(10),
  .header-menu-popover .modal-wrapper .grid .item:nth-child(11) {
    width: calc((100% - (24px * 2)) / 3);
  }
}
.header-menu-popover .modal-wrapper .grid .item svg.about-us-icon {
  width: 84px;
}
.header-menu-popover .addresses-title {
  font-size: 1.125rem;
  letter-spacing: -0.03em;
  line-height: 1.444em;
  font-weight: 500;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .header-menu-popover .addresses-title {
    font-size: 1.375rem;
  }
}
@media (min-width: 1024px) {
  .header-menu-popover .addresses-title {
    font-size: 1.5rem;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .header-menu-popover .addresses-title {
    line-height: 1.273em;
  }
}
@media (min-width: 1024px) {
  .header-menu-popover .addresses-title {
    line-height: 1.25em;
  }
}
.header-menu-popover .item.grohe-background {
  background: linear-gradient(270deg, #1D1F2A 0%, #1D457A 100%);
  border-radius: 20px;
  color: white;
}
.header-menu-popover .item.grohe-background svg {
  color: inherit;
}
.header-menu-popover .item.grohe-background:hover {
  color: var(--gray-color-100);
}
@media (min-width: 1024px) {
  .header-menu-popover .item.grohe-background {
    height: 168px;
  }
}
.header-menu-popover .item .item-title {
  max-height: 20px;
}
.header-menu-popover .item.with-map {
  display: flex;
  flex-direction: row;
  background-color: white;
  border-radius: 20px;
  padding: 0;
  gap: 0;
  overflow: hidden;
}
@media (min-width: 1440px) {
  .header-menu-popover .item.with-map {
    flex-direction: column;
    width: calc(100vw - 64.17vw - 16px - 48px);
  }
}
@media (min-width: 1600px) {
  .header-menu-popover .item.with-map {
    flex-direction: row;
    width: 100%;
    flex-grow: 1;
  }
}
.header-menu-popover .item.with-map p {
  margin: 0;
}
.header-menu-popover .item.with-map svg {
  width: 24px;
  height: 24px;
}
.header-menu-popover .item.with-map .map-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (min-width: 1440px) {
  .header-menu-popover .item.with-map .map-image {
    height: 100px;
  }
}
@media (min-width: 1600px) {
  .header-menu-popover .item.with-map .map-image {
    height: 100%;
  }
}
.header-menu-popover .item .content {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: 16px;
  padding: 16px;
}
@media (min-width: 1024px) {
  .header-menu-popover .item .content {
    width: calc(100% - 46.4%);
    flex-grow: unset;
    padding: 24px;
    gap: 25px;
  }
}
@media (min-width: 1440px) {
  .header-menu-popover .item .content {
    width: 100%;
  }
}
@media (min-width: 1600px) {
  .header-menu-popover .item .content {
    width: 51%;
    padding: 24px;
    margin-top: 3px;
  }
}
.header-menu-popover .item .addresses {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1;
}
@media (min-width: 1440px) {
  .header-menu-popover .item .addresses {
    gap: 12px;
  }
}
@media (min-width: 1900px) {
  .header-menu-popover .item .addresses {
    gap: 16px;
  }
}
.header-menu-popover .item .addresses .address {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.header-menu-popover .item .addresses .address a {
  color: #36393E;
}
.header-menu-popover .item .addresses-route {
  height: 48px;
}
.header-menu-popover .item .addresses-route:hover .addresses-route__btn-text {
  color: var(--on-base-color);
}
.header-menu-popover .item .addresses-route__btn-text {
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.02em;
  color: #122E53;
}
.header-menu-popover .item .contacts {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 10px;
}
@media (min-width: 1024px) {
  .header-menu-popover .item .contacts {
    margin-bottom: 0;
  }
}
@media (min-width: 1440px) {
  .header-menu-popover .item .contacts {
    gap: 8px;
  }
}
.header-menu-popover .item .contacts .contacts-title {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.25em;
  letter-spacing: -0.02em;
  color: #0D0D0D;
}
.header-menu-popover .item .contacts .socials {
  display: flex;
  gap: 10px;
}
@media (min-width: 1440px) {
  .header-menu-popover .item .contacts .socials {
    gap: 8px;
  }
}
.header-menu-popover .item .contacts .socials-wrapper {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
@media (min-width: 1440px) {
  .header-menu-popover .item .contacts .socials-wrapper {
    gap: 8px;
  }
}
@media (min-width: 1900px) {
  .header-menu-popover .item .contacts .socials-wrapper {
    flex-direction: column;
    gap: 10px;
  }
}
.header-menu-popover .item .contacts .socials__item {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.header-menu-popover .item .contacts .phone-wrapper:not(.js-moscow-phone) .phone-moscow {
  display: none;
}
.header-menu-popover .item .contacts .phone-wrapper:not(.js-moscow-phone) .phone-region {
  display: block;
}
.header-menu-popover .item .contacts .phone-wrapper.js-moscow-phone .phone-moscow {
  display: block;
}
.header-menu-popover .item .contacts .phone-wrapper.js-moscow-phone .phone-region {
  display: none;
}
.header-menu-popover .item .contacts .phone {
  font-size: 1.25rem;
  line-height: 1.2em;
  letter-spacing: -0.02em;
  color: #0D0D0D;
}
.header-menu-popover .widget-map {
  width: 42.57%;
}
@media (min-width: 1024px) {
  .header-menu-popover .widget-map {
    width: 46.4%;
    flex: 1;
  }
}
@media (min-width: 1440px) {
  .header-menu-popover .widget-map {
    width: 100%;
    height: 159px;
  }
}
@media (min-width: 1600px) {
  .header-menu-popover .widget-map {
    height: 514px;
    width: 49%;
  }
}

