*,
::after,
::before,
a,
button,
input,
select {
    box-sizing: border-box
}

.image-preloader-wrapper {
    display: inline-grid;
}

.image-preloader-wrapper img,
.image-preloader {
    grid-area: 1 / 1;
}

.image-preloader {
    justify-self: center;
    align-self: center;
    width: 32px;
    height: 32px;
    border: 4px solid rgba(0, 0, 0, 0.25);
    border-top-color: green;
    border-radius: 50%;
    animation: preloader-spin 0.8s linear infinite;
}

@keyframes preloader-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.product_card__img_container .image-preloader-wrapper,
.furniture_in_life .image-preloader-wrapper,
.ideas .image-preloader-wrapper,
.section_card .image-preloader-wrapper,
.services_uslada .image-preloader-wrapper,
.interiors__container .image-preloader-wrapper {
    width: 100%;
    height: 100%;
}

#scrollTop.active,
.chevron_down,
.footer_item,
body {
    display: flex
}

.chevron_down,
.edit_img_container,
.subheader,
[data-product-pin],
body,
main {
    position: relative
}

.subheader_menu,
body,
html {
    overflow-x: hidden
}

.footer_item__title,
.ideas__container div>h3,
.index__title,
.subcatalog_title h2,
.timer>p,
.timer__container h2 {
    text-transform: uppercase
}

:root {
    --color-green: #12794e;
    --color-green-light: #2a8b48;
    --color-green-alpha: #619473;
    --color-salad: #dae7de;
    --color-red: #b93335;
    --color-red-light: #dd888a;
    --color-red-lighten: #ffd1d2;
    --color-yellow: #f3bb3d;
    --color-yellow-light: #f9de9f;
    --color-dark-blue: #373f4f;
    --color-icon-border: #454b54;
    --color-white: white;
    --color-black: black;
    --color-black-light: #0000006b;
    --color-grey: #f1f1f1;
    --color-border: lightgrey;
    --color-dark-grey: #dfdfdf;
    --color-blue: #3578bd;
    --c-lightness: 52.71%;
    --c-red: oklch(52.71% 0.168 23.85)
}

* {
    margin: 0;
    padding: 0;
    outline: 0
}

a,
button,
input,
select {
    all: initial
}

li {
    list-style-type: none
}

a,
button {
    cursor: pointer
}

html * {
    font-family: "Open Sans", "Dejavu Sans", Arial, Verdana, sans-serif
}

body {
    flex-direction: column;
    min-height: 100vh
}

.wrapper {
    padding: 0 3vw
}

.chevron_down {
    --chevron-color: var(--color-black);
    align-items: center;
    cursor: pointer;
    transition: .1s ease-in-out
}

.chevron_down::after,
.chevron_down::before {
    order: 2;
    min-width: .5em;
    height: 1px;
    background-color: var(--chevron-color);
    transition: .1s ease-in-out;
    content: ""
}

.chevron_down::before {
    margin-left: 10px;
    transform: translateX(2px) rotate(45deg)
}

.chevron_down::after {
    transform: rotate(-45deg)
}

#popup,
#scrollTop,
.footer_item__title .chevron_down,
.footer_item__title.product,
.popup {
    display: none
}

#popup.active,
.popup.active {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    display: flex;
    width: 100%;
    height: 100%;
    background: #000000e6;
    padding: 50px 0px;
}

.subheader {
    z-index: 99;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
    height: 60px;
    padding: 0 20px;
    background: var(--color-grey);
    box-shadow: 0 -3px 0 var(--color-dark-grey) inset
}

.subheader * {
    font-size: .85rem
}

.navigation_top__menu .navigation_top__menu_hide,
.subheader_menu__item.hide {
    opacity: 0
}
.subheader_city-choice .icon {
    width: 23px;
    height: 23px
}
.subheader_city-choice {
    display: flex;
    gap: 2px;
    align-items: center;
    white-space: nowrap;
    cursor: pointer
}

.subheader_menu {
    display: flex;
    gap: 20px;
    align-items: center;
    height: 100%;
    margin-right: auto;
    transition: .1s
}

.subheader_menu__item {
    height: 100%;
    opacity: 1
}

.subheader_menu__hover {
    position: absolute;
    top: calc(100% + 5px);
    display: none;
    flex-direction: column;
    gap: 5px;
    padding: 15px;
    background: var(--color-grey);
    border: 2px solid var(--color-border);
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgb(14 30 37 / 12%), 0 2px 16px 0 rgb(14 30 37 / 32%)
}

[name=subheaderMenu] {
    display: flex;
    gap: 10px;
    align-items: center;
    width: auto;
    padding: .5em 1em;
    color: #fff;
    background-image: linear-gradient(109.6deg, #e64e41, #b93335 41%, #e64e41 120%);
    background-size: 200%;
    border-radius: 8px;
    transition: .2s
}

.subheader_contacts {
    z-index: +1;
    display: flex;
    gap: 20px;
    align-items: center;
    width: auto;
    height: 100%;
    white-space: nowrap;
    background: var(--color-grey);
    box-shadow: 0 -3px 0 var(--color-dark-grey) inset;
    transition: .2s
}

.search__container::after,
.search_container__submit {
    background-image: radial-gradient(circle farthest-corner at 10% 20%, rgb(14 174 87 / 100%) 0, rgb(12 116 117 / 100%) 90%)
}

.subheader_contacts__item {
    display: flex;
    flex-direction: column;
    align-items: flex-end
}

.subheader_contacts__link {
    font-weight: 700;
    cursor: pointer
}

.search__container {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 47px;
    margin-left: auto;
    background-color: var(--color-white);
    border-radius: 100px
}

.search__container::after {
    position: absolute;
    left: -2px;
    z-index: -1;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    border-radius: 100px;
    content: ""
}

.search__container .icon {
    width: 40px;
    height: 40px;
    padding: 7px;
    fill: var(--color-white)
}

.search__container label {
    width: 100%;
    height: 100%;
    padding-left: 20px
}

.header_logo .icon,
.search__container input,
.services__item a,
[name=subscriptionEmail] {
    width: 100%;
    height: 100%
}

.search_container__submit {
    min-width: 40px;
    height: 40px;
    margin: 6px;
    border-radius: 50%
}

#scrollTop,
.header__search_data,
.navigation_top__call_form,
.navigation_top__dropdown {
    background: var(--color-white)
}

.header__search_data {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    display: none;
    width: 100%;
    max-width: 500px;
    max-height: 300px;
    padding: 20px;
    border: 2px solid var(--color-border);
    border-radius: 10px
}

.header__search_data.active,
.header__search_data:hover,
.rooms_list__sliders_container,
[data-footer=main] {
    display: flex;
    flex-direction: column;
    gap: 20px
}

.header__search_data_item {
    display: flex;
    gap: 10px
}

.header__search_data_item .icon {
    width: 20px;
    height: 20px;
    padding: 0;
    fill: var(--color-black)
}

.add_to_wishlist .icon_heart,
.small_cart .icon {
    fill: var(--color-white);
    pointer-events: none
}

.header__search_data_button {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    margin: 20px auto auto;
    padding: 0 1em;
    border: 2px solid var(--color-border);
    border-radius: 100px
}

.navigation_top__call_form {
    position: absolute;
    top: calc(100% + 5px);
    right: 5px;
    z-index: 1;
    display: grid;
    grid-gap: 10px;
    gap: 10px;
    min-width: 250px;
    padding: 20px;
    border: 2px solid var(--color-border);
    border-radius: 10px;
    transform: translateX(calc(100% + 25px));
    transition: .1s ease-in
}

.navigation_top__call_form button {
    width: 100%;
    height: 40px;
    margin-top: 20px;
    color: var(--color-white);
    text-align: center;
    background-image: linear-gradient(90deg, #0eae57 0, #0c7475 41%, #0eae57 120%);
    background-size: 200% auto;
    border-radius: 8px;
    transition: .2s
}

.navigation_top__call::after {
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 10;
    width: 100%;
    height: 5px;
    content: ""
}

.navigation_top__dropdown {
    position: absolute;
    top: 50px;
    left: 0;
    z-index: -1;
    width: 100%;
    padding: 10px 20px;
    box-shadow: rgb(0 0 0 / 20%) 0 60px 40px -7px;
    transform: translateY(-100%);
    opacity: 0;
    transition: .1s ease-in
}

.subfooter_app,
.timer,
.timer span,
.timer span strong {
    position: relative
}

#scrollTop,
.edit_img_container .edit_img span,
.product_color__prompt,
.review_index__avatar,
.review_index__img {
    box-shadow: 0 2px 4px 0 rgb(14 30 37 / 12%), 0 2px 16px 0 rgb(14 30 37 / 32%)
}

#scrollTop {
    --color: var(--color-black);
    position: fixed;
    right: 20px;
    bottom: 100px;
    z-index: 50;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding-top: 6px;
    border-radius: 50%
}

#footer,
.subfooter {
    background: var(--color-grey)
}

#scrollTop::after {
    display: block;
    width: 14px;
    height: 14px;
    border: 2px solid var(--color);
    border-right: none;
    border-bottom: none;
    transform: rotate(45deg);
    content: ""
}

#footer {
    margin-top: auto
}

.footer_navigation {
    display: flex;
    gap: clamp(10px, 1.2vw, 20px);
    justify-content: space-evenly;
    padding-top: 30px;
    padding-bottom: 30px;
    border-bottom: 2px solid var(--color-dark-grey)
}

.footer_menu {
    width: clamp(200px, 20vw, 230px)
}

.footer_item {
    flex-direction: column;
    gap: clamp(.5em, 2vw, 1em);
    margin-top: clamp(.5em, 2vw, 1em)
}

.subfooter,
.timer__container {
    align-items: center;
    display: flex;
    position: relative
}

.footer_item li {
    min-height: 22px
}

.footer_item__title {
    font-size: clamp(1em, 2vw, 1.1em)
}

.footer_item__link {
    font-size: clamp(.9em, 2vw, 1em);
    cursor: pointer
}

.subfooter {
    gap: 20px;
    justify-content: space-evenly;
    height: auto;
    min-height: 100px;
    padding: 10px 20px
}

.subfooter_item {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    text-align: right
}

.subfooter_item span {
    font-size: .8em
}

.subfooter_social__container {
    display: flex;
    gap: 8px
}

.subfooter_social {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    column-gap: 10px;
    row-gap: 0
}

.subfooter_social__item,
.subfooter_social__item .icon {
    width: 30px;
    height: 30px
}

.subfooter_app {
    display: flex;
    gap: 10px;
    max-width: 205px
}

.subfooter_contacts {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    width: 100%;
    max-width: 754px;
    column-gap: 20px;
    row-gap: 5px
}

.spinner::after {
    width: 48px;
    height: 48px;
    border: 5px solid var(--color-grey);
    border-bottom-color: var(--color-red);
    border-radius: 50%;
    animation: 1s linear infinite rotation;
    content: ""
}

@keyframes rotation {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

.form_label,
.rooms_list,
.rooms_list__slider {
    display: flex;
    flex-direction: column
}

.input_error {
    order: 0;
    font-size: .7em;
    opacity: 0
}

.form_input {
    order: 1;
    width: 100%;
    height: 40px;
    border: 2px solid var(--color-border);
    border-radius: 8px;
    text-indent: 10px;
}

.form_input-error,
.form_input:invalid {
    border: 2px solid var(--color-red)
}

.form_input:invalid~.input_error {
    color: var(--color-red);
    opacity: 1
}

[data-currency]::after {
    margin-left: .2em;
    font-weight: 400;
    font-size: .9em;
    content: attr(data-currency)
}

input[placeholder] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.form_input:invalid {
    border: 2px solid var(--color-red)
}

.timer__container {
    gap: 20px;
    margin: 20px 0;
    padding: 10px 0;
    color: var(--color-white)
}

.timer__container::after {
    position: absolute;
    top: 0;
    left: -20px;
    z-index: -1;
    width: 100vw;
    height: 100%;
    background-image: linear-gradient(109.6deg, #b93335 11.2%, #e64e41 91.1%);
    content: ""
}

.timer__container h2 {
    padding-right: 20px;
    font-weight: 700;
    font-size: 1.5em;
    border-right: 3px solid var(--color-white)
}

.timer {
    display: flex;
    gap: 5px;
    align-items: center
}

.product_card__details,
.product_color__prompt {
    display: none;
    background: var(--color-white);
    position: absolute
}

.timer>p {
    margin-right: 40px;
    font-size: 1em
}

.timer>strong {
    font-size: 1.5em;
    line-height: 1;
    transform: translateY(-14px)
}

.timer span {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
    width: 30px;
    background: rgba(var(--color-green-alpha) / 20%);
    border-radius: 4px
}

.ribbon_line .ribbon__text,
.timer span strong {
    display: flex;
    align-items: center;
    font-size: 1.1em
}

.timer span strong {
    justify-content: center;
    width: 100%;
    height: 30px;
    padding: .4em;
    color: var(--color-black);
    background: var(--color-white);
    border-radius: 8px
}

.timer span::after {
    font-size: .8em;
    content: attr(data-date-name)
}

.ribbon_line {
    --bg: var(--color-green);
    --c-text: var(--color-white);
    --offset: 10px;
    --height: 38px;
    position: absolute;
    top: 40px;
    left: -10px;
    z-index: 1
}

.ribbon_line::before {
    position: absolute;
    top: 100%;
    left: 0;
    width: 0;
    height: 0;
    border-top: var(--offset) solid var(--bg);
    border-left: var(--offset) solid transparent;
    filter: brightness(50%);
    content: ""
}

.ribbon_line .ribbon__text {
    position: absolute;
    justify-content: space-evenly;
    padding-bottom: 3px;
    color: var(--c-text);
    line-height: 1;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.ribbon_line .ribbon__text .icon,
.small_cart .icon {
    width: 25px;
    height: 25px
}

.ribbon_line.color,
.ribbon_line.right {
    right: -10px;
    left: auto
}

.ribbon_line.color::before,
.ribbon_line.right::before {
    right: 0;
    left: auto;
    border-top: var(--offset) solid var(--bg);
    border-right: var(--offset) solid transparent;
    border-left: transparent
}

.ribbon_line.color {
    top: auto;
    bottom: 120px
}

.ribbon_line.new_middle,
.ribbon_line.sale {
    top: auto;
    bottom: 170px
}

.product_color__prompt {
    right: 0;
    bottom: calc(100% + 15px);
    padding: 5px 1em;
    white-space: nowrap;
    border: 2px solid var(--color-border);
    border-radius: 8px
}

.product_card__details {
    top: 100%;
    left: 0;
    width: 100%;
    max-width: inherit;
    padding: 0 1em;
    border-radius: 0 0 4px 4px
}

.product_card__count {
    display: flex;
    gap: 5px;
    align-items: center;
    padding-right: 10px;
    transform: translateX(100%);
    transition: .1s ease-in
}

.interiors__content a,
.small_cart {
    background-image: linear-gradient(to right, #0eae57 0, #0c7475 41%, #0eae57 120%);
    background-size: 200% auto;
    transition: .2s
}

.furniture_in_life__item_img,
.ideas_img {
    transition: .4s ease-in-out;
    object-fit: cover
}

.product_card__count button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%
}

.product_card__count button::before {
    width: 12px;
    height: 2px;
    background: var(--color-black);
    content: ""
}

.product_card__count button[name=productCardCountPlus]::after {
    position: absolute;
    width: 12px;
    height: 2px;
    background: var(--color-black);
    transform: rotate(90deg);
    content: ""
}

.product_card__submit {
    display: flex;
    overflow: hidden
}

[name=productCount] {
    width: 30px;
    height: 100%;
    text-align: center
}

.small_cart {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 4px
}

.small_cart.in-cart {
    background: gray
}

.product_card__price_bonus {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 5;
    padding: 1px 5px;
    color: var(--color-white);
    font-size: .9em;
    background: #7f5cbd;
    border-radius: 5px 5px 0;
    transform: translate(2px, 50%)
}

.product_card {
    position: relative;
    display: grid;
    grid-template-rows: auto 1fr;
    min-width: 290px;
    padding: 38px 1em 1em;
    background: var(--color-white);
    border-radius: 4px;
    box-shadow: #d3d3d3 0 0 0 2px
}

.product_card__top {
    position: absolute;
    top: 10px;
    left: 1em;
    display: flex;
    justify-content: space-between;
    width: calc(100% - 2em)
}

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

.product_card__img {
    width: 100%;
    height: 250px;
    object-fit: contain;
    border-radius: 4px
}

.furniture_in_life__item,
.shop_numbers_2__item {
    border: 2px solid var(--color-border);
    background: var(--color-grey)
}

.product_card__img_list {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    width: 100%;
    height: 100%
}

.add_to_wishlist {
    display: flex;
    align-items: center;
    margin-left: auto;
    font-size: .9em;
    cursor: pointer
}

.add_to_wishlist .icon_heart {
    width: 18px;
    height: 18px
}

.product_card__title {
    display: -webkit-box;
    width: 100%;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 10px
}

.product_card__price_container {
    display: flex;
    gap: 6px
}

.product_card__price {
    color: var(--color-dark-blue);
    font-size: 1.7em;
    line-height: .8
}

.product_card__old_price {
    color: #8f8f8f;
    -webkit-text-decoration-color: var(--color-red);
    text-decoration-color: var(--color-red);
    font-weight: normal;
    font-size: 0.9em;
    line-height: 1;
    transform: translateY(-3px);
}

#subscription p,
.index__title {
    font-weight: 500
}

.product_card__price_sale {
    position: relative;
    display: flex;
    flex-direction: column
}

.product_card__vygoda {
    position: absolute;
    bottom: -2px;
    color: var(--color-red);
    font-size: .8em;
    line-height: 1;
    white-space: nowrap
}

.rating_stars_container {
    display: flex;
    gap: 2px;
    align-items: center
}

.review_star {
    --size: 18px;
    width: var(--size);
    height: var(--size);
    fill: var(--color-dark-grey)
}

.review_star *,
.want_edit * {
    pointer-events: none
}

.review_star.active {
    fill: var(--color-yellow)
}

.shop_numbers_2 {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
    height: 100%;
    min-height: 454px;
    margin: 20px 0;
    padding: 2px
}

.shop_numbers_2 .slider {
    gap: 20px
}

.shop_numbers_2__item {
    display: grid;
    grid-template-rows: 80% 20%;
    align-items: center;
    min-width: 320px;
    height: 400px;
    padding: 20px;
    border-radius: 8px
}

.shop_numbers_2__item_img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.furniture_in_life {
    width: 100%;
    height: 100%;
    margin: 20px 0
}

.furniture_in_life__container {
    position: relative;
    display: grid;
    grid-template: 0.3fr 0.3fr 0.3fr/1.5fr 1fr;
    grid-template-areas: "big ." "big ." "big .";
    gap: 20px
}

.furniture_in_life__img_container {
    position: relative;
    width: 100%;
    min-width: 182px;
    height: 100%;
    overflow: hidden;
    border-radius: 8px
}

.furniture_in_life__item_img {
    width: 100%;
    height: 100%;
    border-radius: inherit
}

.furniture_in_life__item {
    display: flex;
    height: 100%;
    max-height: 250px;
    border-radius: 10px
}

.furniture_in_life__item:hover .furniture_in_life__item_img {
    transform: scale(1.1)
}

.furniture_in_life__item.big {
    display: flex;
    flex-direction: column;
    grid-area: big;
    min-height: 100%
}

.furniture_in_life__data {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    height: auto;
    padding: 20px
}

.interiors {
    margin: 0
}

.interiors__container {
    position: relative;
    display: grid;
    grid-template: 1fr/2.5fr 1fr;
    gap: 20px;
    width: 100%;
    height: 100%;
    max-height: 400px;
    margin-top: 20px;
    background: var(--color-grey);
    border: 2px solid var(--color-border);
    border-radius: 10px
}

.interiors__container .interiors__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    transition: .5s cubic-bezier(.42, 0, .1, 1)
}

.interiors__img_container {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 8px
}

.pin,
.pin::after,
.pin::before {
    border-radius: 50%
}

.interiors__content {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: flex-start;
    padding: 20px
}

.interiors__content a,
.pin {
    position: relative;
    display: flex;
    align-items: center
}

.interiors__content a {
    gap: .5em;
    height: 45px;
    padding: 0 20px;
    color: var(--color-white);
    font-weight: 600;
    border-radius: 100px;
    cursor: pointer
}

.pin {
    z-index: +1;
    justify-content: center;
    width: 35px;
    height: 35px;
    background: #ffffff47
}

.pin::after,
.pin::before,
.product_pin {
    position: absolute
}

.pin::before {
    width: 20.5px;
    height: 20.5px;
    background: var(--color-white);
    content: ""
}

.pin::after {
    width: 10.5px;
    height: 10.5px;
    background: #a5a5a5;
    content: ""
}

.product_pin__container {
    position: absolute;
    z-index: 3;
    display: none;
    grid-template-areas: "name name" ". .";
    gap: 10px;
    align-items: center;
    min-width: 230px;
    padding: 10px;
    background: var(--color-white);
    border-radius: 8px;
    box-shadow: rgb(0 0 0 / 56%) 0 22px 70px 4px
}

.product_pin__container.rb {
    top: 100%;
    left: 100%;
    transform: translateX(-50%)
}

.product_pin__container.rt {
    bottom: 100%;
    left: 100%
}

.product_pin__container.lb {
    top: 100%;
    right: 100%
}

.product_pin__container.lt {
    right: 100%;
    bottom: 100%;
    transform: translateX(50%)
}

.ideas {
    margin: 20px 0
}

.ideas__container {
    position: relative;
    display: grid;
    grid-template: 0.5fr 0.5fr 1fr/1fr 1fr 1fr;
    grid-template-areas: ". big big" ". big big";
    gap: 20px;
    min-height: 380px;
    max-height: 880px;
    margin: 20px 0
}

.ideas__container div {
    position: relative;
    width: 100%;
    max-height: 400px
}

.ideas__container div>h3 {
    position: absolute;
    z-index: +1;
    padding: .1em .5em;
    font-size: clamp(.9em, 2vw, 2em);
    background: var(--color-white)
}

.ideas__container div>a {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.ideas__container>div:nth-child(3) {
    grid-area: big;
    max-height: 420px
}

.ideas__container>div:nth-child(3)>a {
    min-height: 380px
}

.ideas_img {
    position: absolute;
    width: 100%;
    height: 100%
}

.news_item__img,
.services__item_img {
    transition: .5s cubic-bezier(.42, 0, .1, 1)
}

.services_uslada {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin: 20px 0
}

.news__container,
.news_uslada,
.services_uslada__container {
    flex-direction: column;
    display: flex
}

.services_uslada__container {
    position: relative;
    gap: 20px;
    width: 100%;
    height: 100%;
    min-height: 414px;
    padding: 2px;
    overflow: visible
}

.news__container,
.products_list,
.rooms_list__room {
    min-height: 380px;
    gap: 20px
}

.services_uslada__container .slider {
    gap: 20px
}

.services__item_img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.news_item__container,
.news_item__img {
    width: 100%;
    height: auto;
    aspect-ratio: 1/1
}

.news_uslada {
    width: 100%
}

.news__container {
    position: relative;
    width: 100%;
    padding: 20px 0;
    overflow: visible
}

.rooms_list__room,
.uslada {
    flex-direction: column;
    position: relative
}

.news__container .slider {
    gap: 20px
}

.news_item {
    min-width: clamp(300px, 30vw, 400px)
}

.news_item__container {
    position: relative;
    display: flex;
    overflow: hidden;
    border: 2px solid var(--color-border);
    border-radius: 10px;
    cursor: pointer
}

.news_item__date {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: +1;
    padding: 8px;
    color: var(--color-white);
    background-image: linear-gradient(to right, #0eae57 0, #0c7475 41%, #0eae57 120%);
    background-size: 200% auto;
    border-radius: 0 4px
}

.news_item__img {
    position: absolute;
    z-index: -1;
    object-fit: cover;
    border-radius: 8px
}

.news_item__description {
    margin-top: 10px;
    font-size: clamp(1em, 2vw, 1.1em)
}

.uslada {
    display: flex;
    width: 100%;
    height: 464px;
    margin: 40px 0
}

.products_like,
.products_list {
    display: grid;
    width: 100%
}

.rooms_list__room,
.slider {
    display: flex;
    width: 100%
}

.products_list {
    position: relative;
    grid-template-rows: auto;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    justify-content: space-between;
    padding: 20px 0;
}

.slider {
    -webkit-user-select: none;
    -moz-user-select: -moz-none;
    -ms-user-select: none;
    user-select: none;
    touch-action: pan-y
}

.slider.products {
    z-index: 5
}

.slider-item {
    z-index: 2;
    flex: 1;
    transform: translate3d(var(--transform), 0, 0);
    will-change: transform
}

.rooms_list__room.flash,
.rooms_list__room.hover {
    z-index: 6
}

.rooms_list {
    margin: 0 20px
}

.index__title {
    margin-top: 5px;
    font-size: clamp(1em, 5vw, 1.5em);
    line-height: 1
}

.rooms_list__slider {
    position: static;
    gap: 20px;
    align-items: center;
    width: 100%;
    min-height: inherit;
    overflow: visible
}

.rooms_list__slider .slider {
    gap: 25px
}

.rooms_list__slider .slider-item {
    max-width: 290px
}

.slider_buttons {
    margin-left: auto
}

.section_card {
    position: relative;
    display: grid;
    grid-template-rows: 1fr auto;
    gap: 15px;
    width: 100%;
    min-width: 290px;
    height: 100%;
    min-height: 380px;
    max-height: 440px;
    padding: 1em;
    border: 2px solid var(--color-border);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgb(0 0 0 / 15%)
}

.left_catalog_card {
    min-width: min-content;
    min-height: min-content;
    height: 325px;
    background-color: white;
}

.left_catalog_product {
    height: 325px !important;
}

.left_catalog_product img {
    height: 200px;
}

#subscription,
.subscription__container {
    gap: clamp(10px, 2.6vw, 20px);
    display: flex
}

.section_card>a {
    position: relative;
    width: 100%;
    height: 100%;
    max-height: 307px;
    overflow: hidden;
    border-radius: 8px
}

.section_card>a::before {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: +1;
    display: block;
    width: 100%;
    height: 100%;
    opacity: .5;
    content: ""
}

.section_card>a span {
    position: absolute;
    bottom: 10px;
    left: 10px;
    z-index: +1;
    color: var(--color-white);
    text-shadow: 0 0px 10px gray;
}

.section_card img {
    width: 100%;
    height: 100%;
    max-height: 370px;
    object-fit: cover;
    transition: .4s ease-in-out
}

.section_card__details {
  height: 100%;
}

#subscription {
    position: relative;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 150px;
    padding: 0 20px;
    font-size: clamp(.9em, 3vw, 1em);
    background: var(--color-grey);
    border-top: 2px solid var(--color-dark-grey)
}

.subscription__container {
    flex-wrap: wrap;
    justify-content: center;
    width: 100%
}

.subscription__container .icon {
    width: 23px;
    height: 23px
}

.subscription__container label {
    display: flex;
    gap: 10px;
    align-items: center;
    width: clamp(200px, 50vw, 400px);
    height: clamp(35px, 8vw, 40px);
    padding: 0 10px;
    background-color: var(--color-white);
    border: 1px solid var(--color-black);
    border-radius: 4px;
    box-shadow: 0 0 0 1px rgb(0 0 0 / 5%), inset 0 0 0 1px #d1d5db
}

.button_default {
    height: clamp(35px, 8vw, 40px);
    padding: 0 2em;
    color: var(--color-white);
    background-image: linear-gradient(109.6deg, #e64e41 0, #b93335 41%, #e64e41 120%);
    background-size: 200%;
    border-radius: 4px;
    cursor: pointer;
    transition: .2s
}

[data-footer=main] .footer_item {
    margin-top: 1px
}

.subheader_city-visible-660 {
    display: none;
}

#cityChoice,
#header,
.dropdown_body,
.header__login_greeting,
.login_popup {
    background: var(--color-white)
}
.navigation_top__call:hover .navigation_top__call_form,
.navigation_top__call_form:hover {
    box-shadow: 0 60px 40px -7px rgb(0 0 0 / 20%);
    transform: translateX(5px)
}
@media (min-width:785px) {
    .navigation_top__rassrochka.active,
    .navigation_top__rassrochka:hover,
    .navigation_top__sale.active,
    .navigation_top__sale:hover,
    .navigation_top__stock.active,
    .navigation_top__stock:hover,
    .subheader_menu__link.active,
    .subheader_menu__link:hover {
        box-shadow: 0 -3px 0 var(--color-green) inset
    }

    .navigation,
    .navigation_submenu {
        scrollbar-width: none;
        overscroll-behavior: contain;
        overflow-y: auto
    }

    .chevron-right,
    .subheader_city-choice * {
        pointer-events: none
    }

    .city-choice__city:hover,
    .footer_item__link:hover,
    .header__search_data_item:hover,
    .navigation_submenu__item:hover,
    .product_card__sale:hover,
    .product_card__title:hover,
    .subheader_city-choice:hover {
        text-decoration: underline
    }

    .subheader_menu__link {
        display: flex;
        align-items: center;
        height: 100%;
        white-space: nowrap;
        cursor: pointer
    }

    @media screen and (min-width:1200px) {
        [name=subheaderMenu] {
            display: none
        }
    }

    .header__search_data::before {
        position: absolute;
        bottom: 100%;
        left: 0;
        width: 100%;
        height: 12px;
        content: ""
    }

    .header__user_actions .icon,
    .user_actions__cart .icon {
        width: 28px;
        height: 28px
    }

    .header__cart,
    .header__login,
    .header__search {
        position: relative
    }

    .header__search_data_button:hover {
        color: var(--color-white);
        background: var(--color-green-alpha)
    }

    #header {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 98;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        width: 100%;
        padding: 20px;
        column-gap: 20px
    }

    .header_logo {
        display: flex;
        align-items: center;
        min-width: 170px;
        height: 64px
    }

    .header__user_actions {
        display: flex;
        gap: 20px;
        align-items: flex-start;
        height: 49px;
        margin-left: 10px
    }

    .user_actions__item {
        display: flex;
        flex-direction: column;
        gap: 7px;
        align-items: center;
        height: 100%;
        line-height: 1
    }

    .user_actions__login {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: 100%
    }

    .user_actions__login .icon {
        padding-top: 2px
    }

    .user_actions__cart::after,
    .user_actions__item-wishlist::after {
        top: -5px;
        padding: 2.5px .5em;
        font-size: .7em;
        background: var(--color-red);
        border-radius: 10px;
        transition: .1s;
        color: var(--color-white);
        opacity: 0
    }

    .user_actions__cart,
    .user_actions__item-wishlist {
        position: relative;
        display: flex;
        align-items: center;
        height: 100%
    }

    .header__login_greeting::after,
    .header__login_greeting::before {
        bottom: 100%;
        width: 0;
        height: 0;
        transform: translateX(-50%);
        position: absolute;
        left: 50%
    }

    .user_actions__cart::after {
        position: absolute;
        right: -6px;
        visibility: hidden;
        content: attr(data-cart-count)
    }

    .user_actions__item-wishlist .icon {
        fill: var(--color-white)
    }

    .user_actions__item-wishlist::after {
        position: absolute;
        right: 0;
        content: attr(data-count-wishlist)
    }

    .header__login_greeting {
        position: absolute;
        left: 50%;
        display: none;
        gap: 20px;
        width: 250px;
        padding: 20px;
        border: 2px solid var(--color-border);
        border-radius: 10px;
        box-shadow: 0 2px 4px 0 rgb(14 30 37 / 12%), 0 2px 16px 0 rgb(14 30 37 / 32%);
        transform: translate(-50%, 20px)
    }

    #forget [type=submit],
    #register [type=submit],
    #signIn [type=submit],
    .login_button,
    .nav-btn.select {
        background-image: linear-gradient(to right, #0eae57 0, #0c7475 41%, #0eae57 120%)
    }

    .header__login_greeting::before {
        border-right: 16px solid transparent;
        border-bottom: 12px solid var(--color-border);
        border-left: 16px solid transparent;
        content: ""
    }

    .header__login_greeting::after {
        border-right: 12px solid transparent;
        border-bottom: 10px solid var(--color-white);
        border-left: 12px solid transparent;
        content: ""
    }

    .login_button {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 45px;
        padding: 5px 30px;
        color: var(--color-white);
        white-space: nowrap;
        background-size: 200% auto;
        border-radius: 100px;
        cursor: pointer;
        transition: .2s
    }

    .navigation_top,
    .navigation_top__menu {
        background: var(--color-white);
        display: flex
    }

    .button_default:hover,
    .login_button:hover,
    .nav-btn.select:hover {
        background-position: right center
    }

    .header__login::after {
        position: absolute;
        top: 100%;
        width: 100%;
        height: 10px;
        content: ""
    }

    .header__login:hover .header__login_greeting {
        display: grid
    }

    .navigation_top {
        position: -webkit-sticky;
        position: sticky;
        top: 104px;
        z-index: 10;
        gap: 20px;
        width: 100%;
        height: 50px;
        padding: 0 20px;
        box-shadow: 0 3px 12px rgb(0 0 0 / 9%)
    }

    .navigation_top__menu {
        position: relative;
        align-items: center;
        height: 100%
    }

    .navigation_top__new {
        display: flex;
        gap: 8px;
        align-items: center;
        height: 40px;
        margin-right: 20px;
        padding: 0 10px;
        color: var(--color-green);
        background-image: linear-gradient(to right, rgb(14 174 87 / 20%) 0, rgb(12 116 117 / 10%) 41%, rgb(14 174 87 / 20%) 120%);
        background-size: 200% auto;
        border-radius: 10px
    }

    .navigation_root_container {
        position: absolute;
        top: calc(100%);
        left: 0;
        opacity: 0;
        transition: opacity .2s;
        width: 100%;
        background-color: #fff
    }

    .navigation_container {
        position: relative;
        display: flex
    }

    .nav-group {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        background: #d6d6d6;
        border-radius: 100px;
        padding: 4px
    }

    .nav-btn,
    .navigation_menu__top {
        align-items: center;
        display: flex
    }

    .nav-btn {
        position: relative;
        gap: .5em;
        height: 40px;
        padding: 0 20px;
        color: #888;
        font-weight: 600;
        font-size: 15px;
        background: 0 0/200% auto;
        border: none;
        border-radius: 100px;
        cursor: pointer;
        transition: .2s
    }

    .navigation_top__sale,
    .navigation_top__stock {
        color: var(--color-red)
    }

    .nav-btn.select {
        color: #fff;
        background-size: 200% auto
    }

    .icon-wrap {
        position: relative;
        width: 18px;
        height: 18px;
        flex-shrink: 0
    }

    .icon-wrap svg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        transition: opacity .2s
    }

    .icon-cross,
    .nav-btn.active .icon-burger {
        opacity: 0
    }

    .nav-btn.active .icon-cross,
    .navigation_root_container.active {
        opacity: 1
    }

    .navigation_menu__top {
        gap: 12px;
        width: 370px;
        min-height: 50px;
        padding: 0 30px 0 12px;
        background: var(--color-white)
    }

    #mobileMenu,
    .navigation_menu__top.hide {
        display: none
    }

    .navigation_top__link {
        padding-right: 20px;
        white-space: nowrap;
        cursor: pointer
    }

    .navigation_top__sale {
        display: flex;
        gap: .5em;
        align-items: center;
        height: 100%;
        margin: 0 10px 0 0;
        opacity: 1
    }

    .navigation_top__rassrochka,
    .navigation_top__stock {
        gap: .5em;
        align-items: center;
        margin: 0 10px;
        height: 100%;
        display: flex;
        opacity: 1
    }

    .navigation_top__sale .icon {
        width: 28px;
        height: 28px
    }

    .navigation_top__rassrochka .icon,
    .navigation_top__stock .icon {
        width: 25px;
        height: 25px
    }

    .navigation_top__call {
        position: absolute;
        right: 20px;
        z-index: +1;
        height: 100%;
        margin-left: auto;
        background: var(--color-white)
    }

    [name=freeCall] {
        display: flex;
        gap: 5px;
        align-items: center;
        height: 100%;
        margin-left: auto;
        font-size: .9em;
        white-space: nowrap
    }

    [name=freeCall] .icon {
        width: 40px;
        height: 40px
    }

    .navigation_submenu {
        width: 100%;
        height: 100%;
        padding: 5px 0;
        background: var(--color-grey)
    }

    .navigation,
    .navigation_menu {
        height: auto;
        background: var(--color-white)
    }

    #register.active,
    #signIn.active,
    .navigation_submenu.active,
    .navigation_submenu:hover,
    .product_card__submit:hover .product_card__count {
        transform: translateX(0)
    }

    .navigation_submenu__item {
        display: flex;
        align-items: center;
        padding: 5px 20px
    }

    .button,
    .login_popup__menu_item,
    .navigation_menu__item,
    .spinner {
        display: flex;
        align-items: center
    }

    .button,
    .spinner {
        justify-content: center
    }

    .chevron-right {
        position: relative;
        display: flex;
        margin-left: auto;
        --color: var(--color-black);
        --size: 0.5em
    }

    .chevron-right::after {
        position: absolute;
        top: 50%;
        left: 50%;
        display: inline-block;
        width: var(--size);
        height: var(--size);
        border-right: 1px solid var(--color);
        border-bottom: 1px solid var(--color);
        transform: translate(-80%, -50%) rotate(-45deg);
        content: ""
    }

    .ideas_img:hover,
    .interiors__container:hover .interiors__img,
    .news_item__container:hover img,
    .services__item:hover .services__item_img {
        transform: scale(1.05)
    }

    .navigation {
        z-index: 8;
        border-bottom: 10px solid #fff
    }

    .navigation_menu__item {
        gap: 12px;
        height: 50px;
        padding: 0 12px;
        cursor: pointer
    }

    .navigation_menu__item .icon {
        width: 21px;
        height: 21px;
        fill: var(--color-icon-border)
    }

    .navigation_menu__item.active {
        background-color: var(--color-grey);
        font-weight: 700;
        color: var(--color-red);
    }

    .navigation_menu__item.active .icon {
        fill: var(--color-red);
    }

    .spinner {
        position: absolute;
        top: 0;
        width: 100%;
        height: 100%;
        min-height: inherit
    }

    .button {
        height: 50px;
        padding: 0 20px;
        color: var(--color-white);
        font-size: 1.2em;
        background-image: linear-gradient(90deg, #0eae57 0, #0c7475 41%, #0eae57 120%);
        background-size: 200% auto;
        border-radius: 8px;
        transition: .2s
    }

    .button:hover {
        background-position: 100%
    }

    .login_popup {
        position: relative;
        min-width: 350px;
        margin: auto;
        border: 2px solid var(--color-border);
        border-radius: 8px;
        box-shadow: rgb(0 0 0 / 56%) 0 22px 70px 4px
    }

    .login_popup [name=closePopup] {
        top: -20px;
        right: -20px;
        width: 20px;
        height: 20px;
        background: var(--color-white);
        border: 1px solid var(--color-black);
        border-radius: 50%
    }

    .login_popup [name=closePopup]::after,
    .login_popup [name=closePopup]::before {
        width: 80%
    }

    .login_popup__menu {
        display: flex;
        height: 45px
    }

    .login_popup__menu_item {
        justify-content: center;
        width: 100%;
        height: 100%
    }

    .login_popup__menu_item:first-child {
        border-radius: 7px 0 0
    }

    .login_popup__menu_item:nth-child(2) {
        border-radius: 0 7px 0 0
    }

    .login_popup__menu_item:hover {
        background: var(--color-grey);
        cursor: pointer
    }

    .login_popup__menu_item.active {
        color: var(--color-white);
        background-image: linear-gradient(109.6deg, #e64e41 11.2%, #b93335 91.1%);
        cursor: pointer
    }

    .login_container {
        position: relative;
        height: auto;
        overflow: hidden
    }

    #forget,
    #register,
    #signIn {
        position: absolute;
        display: grid;
        gap: 10px;
        max-width: 346px;
        padding: 20px;
        transition: .2s
    }

    #forget.active,
    #register.active,
    #signIn.active {
        position: static
    }

    #forget [type=submit],
    #register [type=submit],
    #signIn [type=submit] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 45px;
        margin-top: 20px;
        color: var(--color-white);
        background-size: 200% auto;
        border-radius: 8px;
        transition: .2s
    }

    #signIn {
        transform: translateX(-350px)
    }

    #register {
        transform: translateX(350px)
    }

    [name=goForget] {
        font-size: .9em;
        text-align: center
    }

    .ribbon_line {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 170px;
        height: 35px;
        color: var(--c-text);
        text-shadow: 0 1px 1px rgb(0 0 0 / 20%);
        background-color: var(--bg);
        border-radius: 4px 4px 4px 0;
        box-shadow: rgb(0 0 0 / 40%) 0 2px 4px, rgb(0 0 0 / 30%) 0 7px 13px -3px, rgb(0 0 0 / 20%) 0 -3px 0 inset;
        content: attr(data-ribbon-text)
    }

    .ribbon_line.color,
    .ribbon_line.right::after {
        border-radius: 4px 4px 0
    }

    .ribbon_line.color {
        width: 40px
    }

    .ribbon_line.color:hover .product_color__prompt {
        display: block
    }
    
    ,
    
    .product_color__prompt::after {
        position: absolute;
        top: 100%;
        right: 2px;
        width: 0;
        height: 0;
        border-top: 10px solid var(--color-white);
        border-right: 10px solid transparent;
        border-left: 10px solid transparent;
        content: ""
    }

    .product_color__prompt::before {
        position: absolute;
        top: 100%;
        right: -2px;
        width: 0;
        height: 0;
        border-top: 14px solid var(--color-border);
        border-right: 14px solid transparent;
        border-left: 14px solid transparent;
        content: ""
    }

    .product_card__order {
        display: grid;
        gap: 3px
    }

    .product_card__delivery {
        display: flex;
        gap: 3px;
        align-items: center;
        font-size: .8em
    }

    .product_card__delivery .icon {
        width: 18px;
        height: 18px
    }

    .product_card__profile {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        padding: 10px 0
    }

    .product_card__profile span {
        display: grid;
        font-size: .9em
    }

    .product_card__profile span::after {
        margin-top: 6px;
        font-size: 1.1em
    }

    .product_card__profile [data-product-width]::after {
        content: attr(data-product-width)
    }

    .product_card__profile [data-product-depth] {
        justify-items: center
    }

    .product_card__profile [data-product-depth]::after {
        content: attr(data-product-depth)
    }

    .product_card__profile [data-product-height]::after {
        content: attr(data-product-height)
    }

    .product_card.active,
    .product_card:hover {
        border-radius: 4px 4px 0 0;
        box-shadow: rgba(var(--color-green-alpha) / 30%) 0 0 0 3px;
        box-shadow: var(--color-green) 0 0 0 2px
    }

    .product_card:hover .product_card__details {
        z-index: 5;
        display: block;
        box-shadow: 2px 2px 0 var(--color-green), -2px 2px 0 var(--color-green)
    }

    [data-product-optional-image] {
        position: relative;
        width: 100%;
        visibility: hidden;
        cursor: pointer;
        opacity: 0
    }

    [data-product-optional-image]::after {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 3px;
        background: grey;
        content: ""
    }

    [data-product-optional-image]:hover::after {
        height: 4px;
        background: #000
    }

    .product_card__img_list:hover [data-product-optional-image] {
        visibility: visible;
        opacity: 1
    }

    .product_card__sale {
        display: inline-block;
        width: 100%;
        margin: 2em 0 1em;
        color: var(--color-green);
        text-align: center;
        cursor: pointer
    }

    .product_card__cart {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        margin-top: 1em
    }

    .services__item {
        display: grid;
        grid-template-rows: 195px 1fr auto;
        gap: 20px;
        align-items: center;
        width: 100%;
        min-width: 350px;
        height: 100%;
        min-height: 360px;
        padding: 20px;
        background: var(--color-grey);
        border: 2px solid var(--color-border);
        border-radius: 10px
    }

    .news_item__container:hover,
    .section_card:hover {
        border: 2px solid var(--color-green)
    }

    .section_card:hover img {
        transform: scale(1.1)
    }
}

.dropdown_body {
    position: absolute;
    top: calc(100% + var(--offset));
    right: 0;
    z-index: + 1;
    flex-direction: column;
    min-width: 100%;
    padding: 10px 0;
    border: 1px solid var(--color-black);
    border-radius: 4px;
    box-shadow: 0 0 0 1px rgb(0 0 0 / 5%), inset 0 0 0 1px #d1d5db;
    box-shadow: 0 0 0 1px rgb(0 0 0/5%), inset 0 0 0 1px #d1d5db;
    visibility:hidden
}

.dropdown, .dropdown_body {
    display: flex;
    white-space:nowrap
}

.dropdown {
    --offset: 5px;
    position: relative;
    align-items:center
}

.dropdown:hover::after {
    position: absolute;
    top: 100%;
    width: 100%;
    height: var(--offset);
    content: ""
}

.dropdown:hover > .dropdown_body {
    visibility:visible
}

.dropdown_item {
    padding: 0 1em;
    border-radius: 4px;
    cursor:pointer
}

.dropdown_item:hover {
    background:var(--color-grey)
}

.chevron_down:hover::before {
    transform:translateX(2px) rotate(-45deg)
}

.chevron_down:hover::after {
    transform:rotate(45deg)
}

[name=closePopup] {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 99;
    width: 17px;
    height: 17px;
    cursor:pointer
}

.user_actions__item, .user_actions__login {
    width: auto;
    font-size: .9em;
    cursor:pointer
}

[name=closePopup]::after, [name=closePopup]::before {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--color-black);
    opacity: .7;
    content: ""
}

[name=closePopup]::before {
    transform:translate(-50%, -50%) rotate(45deg)
}

[name=closePopup]::after {
    transform:translate(-50%, -50%) rotate(135deg)
}

[name=closePopup]:hover::after, [name=closePopup]:hover::before {
    background-color:var(--color-red)
}

[name=closePopup]:hover::before {
    transform:translate(-50%, -50%) rotate(45deg) scale(1.25)
}

[name=closePopup]:hover::after {
    transform:translate(-50%, -50%) rotate(135deg) scale(1.25)
}


.mobile_menu__item.catalog.active .burger_icon::before,
[name=subheaderMenu].active>.burger_icon::before {
    transform: translateY(5px) rotate(45deg)
}

.mobile_menu__item.catalog.active .burger_icon::after,
[name=subheaderMenu].active>.burger_icon::after {
    transform: translateY(-5px) rotate(-45deg)
}

.burger_icon,
[name=subheaderMenu].active~.subheader_menu__hover {
    display: flex
}

.burger_icon {
    --bg: var(--color-black);
    position: relative;
    flex-direction: column;
    min-width: 23px;
    height: 2px;
    background: var(--bg)
}

.burger_icon::after,
.burger_icon::before {
    position: absolute;
    min-width: 23px;
    height: 2px;
    background: var(--bg);
    transition: .2s;
    content: ""
}

.burger_icon::before {
    top: -6px
}

.burger_icon::after {
    bottom: -6px
}

.subheader_menu__hover_item.hide {
    display: none
}

.subheader_menu__hover::before {
    position: absolute;
    bottom: 100%;
    height: 20px;
    content: "";
    width: 100%;
    left: 0
}

.subheader_menu__hover_item {
    display: flex;
    padding: 5px 10px;
    border-radius: 8px
}

[name=subheaderMenu] .burger_icon,
[name=subheaderMenu] .burger_icon::after,
[name=subheaderMenu] .burger_icon::before {
    background: #fff
}

[name=subheaderMenu].active {
    background-position: 100%
}

[name=subheaderMenu].active>.burger_icon {
    height: 0
}

@media (max-width:784.98px) {

    #header,
    #mobileMenu {
        height: 50px;
        padding: 0 20px
    }

    .hide-mobile {
        display: none
    }

    #header,
    #mobileCatalog,
    #mobileMenu,
    .navigation_top__call {
        background: var(--color-white)
    }

    #scrollTop,
    .catalog_container,
    .header__search::after,
    .header__user_actions,
    .navigation_top,
    .subheader_city-choice {
        display: none
    }

    .header__search_data::before {
        position: absolute;
        bottom: 100%;
        height: 20px;
        content: "";
        width: 100%;
        left: 0
    }

    .header__search {
        position: static;
        height: 40px;
        border: 2px solid var(--color-green)
    }

    .mobile_menu__item.cart::after,
    .mobile_menu__item.wishlist::after {
        top: 2px;
        right: 0;
        padding: 2.5px .5em;
        color: var(--color-white);
        font-size: .7em;
        background: var(--color-red);
        border-radius: 10px;
        opacity: 0;
        transition: .1s
    }

    .mobile_menu__item.cart,
    .mobile_menu__item.wishlist,
    .navigation_top__call,
    .subheader,
    .subheader_contacts {
        position: relative
    }
        
    .subheader {
        grid-template-columns: 1fr auto;
        height: 40px;
        box-shadow: none
    }

    .subheader * {
        font-size: .8rem;
        line-height: 1.2
    }

    .subheader_contacts {
        gap: 10px;
        box-shadow: none
    }

    .subheader_menu {
        min-width: 86px
    }

    .subheader_menu__hover {
        padding: 5px
    }

    #header {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 10;
        display: flex;
        gap: 20px;
        align-items: center;
        width: 100%;
        box-shadow: 0 4px 15px rgb(0 0 0/12%)
    }

    .header_logo {
        display: flex;
        align-items: center;
        max-width: 115px;
        height: 45px
    }

    .search_container__submit {
        min-width: 30px;
        height: 30px
    }

    .search_container__submit .icon {
        width: 30px;
        height: 30px
    }

    .navigation_top__call {
        z-index: +1;
        height: 100%;
        margin-left: auto;
        font-size: .9em
    }

    [name=freeCall] {
        display: flex;
        align-items: center;
        height: 100%;
        margin-left: auto;
        font-size: .95em;
        line-height: 1.2;
        white-space: nowrap
    }

    [name=freeCall] .icon {
        width: 33px;
        height: 33px
    }

    [name=freeCall].active~.navigation_top__call_form {
        box-shadow: 0 60px 40px -7px rgb(0 0 0 / 20%);
        transform: translateX(5px)
    }

    @media screen and (max-width:890px) {
        .footer_navigation {
            display: grid;
            grid-template: repeat(2, 1fr)/repeat(2, 1fr);
            gap: 10px;
            justify-items: center
        }

        .footer_item {
            gap: 5px
        }

        .footer_menu {
            width: 100%
        }
    }

    @media screen and (max-width:728px) {
        .subfooter {
            flex-wrap: wrap;
            gap: 0
        }

        .subfooter_contacts {
            justify-content: center
        }

        .subfooter_item {
            align-items: center;
            min-width: 25%
        }
    }

    #mobileMenu {
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 99;
        display: flex;
        width: 100%;
        border-top: 2px solid var(--color-border);
        border-radius: 20px 20px 0 0;
        box-shadow: 0 -4px 15px rgb(0 0 0/12%)
    }

    #mobileCatalog {
        position: absolute;
        bottom: calc(100% + 2px);
        left: 0;
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 370px;
        height: calc(100dvh - 50px);
        overflow: auto;
        box-shadow: 5px 0 12px rgb(0 0 0 / 12%);
        transform: translateX(-100%);
        transition: .1s
    }

    #mobileCatalog::-webkit-scrollbar {
        display: none
    }

    .mobile_menu__item {
        display: flex;
        flex-wrap: wrap;
        gap: 5px;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        line-height: 1
    }

    .mobile_catalog__item,
    .ribbon_line::after,
    .spinner {
        display: flex;
        align-items: center
    }

    .mobile_menu__item .icon {
        width: 25px;
        height: 25px;
        pointer-events: none
    }

    .mobile_menu__item.cart::after {
        position: absolute;
        visibility: hidden;
        content: attr(data-cart-count)
    }

    .mobile_menu__item.wishlist .icon {
        fill: var(--color-white)
    }

    .mobile_menu__item.wishlist::after {
        position: absolute;
        content: attr(data-count-wishlist)
    }

    .mobile_menu__item.catalog {
        position: relative;
        cursor: pointer
    }

    .mobile_menu__item.catalog .burger_icon {
        pointer-events: none
    }

    .mobile_menu__item.catalog.active .burger_icon {
        height: 0;
        pointer-events: none
    }

    .mobile_menu__item.catalog.active~#mobileCatalog {
        transform: translateX(0)
    }

    .mobile_menu__item.catalog::before {
        position: absolute;
        top: -2px;
        left: 0;
        width: 100%;
        height: 2px;
        content: ""
    }

    .mobile_catalog__item {
        gap: 10px;
        min-height: 40px;
        padding: 0 12px;
        cursor: pointer
    }

    .mobile_catalog__item.new {
        color: var(--color-green);
        font-weight: 700;
        background-image: linear-gradient(to right, rgb(14 174 87 / 20%) 0, rgb(12 116 117 / 10%) 41%, rgb(14 174 87 / 20%) 120%);
        background-size: 200% auto
    }

    .mobile_catalog__item.new .icon {
        fill: var(--color-icon-border)
    }

    .mobile_catalog__item.top {
        font-weight: 700
    }

    .mobile_catalog__item .icon {
        width: 21px;
        height: 21px
    }

    #mobileCatalogList {
        display: flex;
        flex-direction: column
    }

    @media screen and (max-width:660px) {
        .subheader_city-visible-660 {
            display: flex !important;
        }
        
        .subheader,
        .subheader_menu {
            width: 100%
        }

        .subheader,
        .subheader_menu__hover_item,
        .subheader_menu__hover_item.hide {
            display: flex
        }

        #subheaderAllContacts,
        .navigation_top__call {
            margin-left: auto;
            background: var(--color-grey)
        }

        #subheaderAllContacts,
        .navigation_top__call,
        .subheader,
        .subheader_menu {
            background: var(--color-grey)
        }

        #header {
            padding: 5px
        }

        .subheader {
            z-index: 20;
            gap: 0;
            padding: 0 5px
        }

        .subheader_menu__item {
            display: none
        }

        .subheader_contacts {
            position: absolute;
            top: 100%;
            right: 160px;
            z-index: -1;
            flex-direction: column;
            align-items: flex-end;
            width: auto;
            height: auto;
            padding: 10px;
            border-radius: 0 0 8px 8px;
            box-shadow: 0 2px 4px 0 rgb(14 30 37 / 12%), 0 2px 16px 0 rgb(14 30 37 / 32%);
            transform: translateY(-110%)
        }

        #subheaderAllContacts {
            display: flex;
            align-items: center;
            height: 100%;
            padding: 0 10px
        }

        #subheaderAllContacts.active~.subheader_contacts {
            transform: translateY(0);
            z-index: 2;
        }

        .navigation_top__call {
            font-size: .8em
        }

        .navigation_top__call [name=freeCall] {
            line-height: 1
        }

        .mobile_menu__item {
            flex-direction: column;
            align-items: center;
            justify-content: flex-end;
            padding-bottom: 2px;
            font-size: clamp(.7em, 3vw, .8em)
        }

        .mobile_menu__item .burger_icon {
            transform: translateY(-9px)
        }

        .mobile_menu__item .icon {
            width: 21px;
            height: 21px
        }
    }

    .spinner {
        position: absolute;
        top: 0;
        justify-content: center;
        width: 100%;
        height: 100%;
        max-height: inherit
    }

    .subfooter_contacts {
        padding-bottom: 50px
    }

    @media screen and (max-width:710px) {
        .timer__container {
            padding: 5px 20px
        }

        .timer__container h2 {
            font-size: clamp(1em, 4vw, 1.5em)
        }

        .timer {
            gap: 8px
        }

        .timer>p {
            display: none
        }

        .timer>strong {
            font-size: 1em;
            line-height: 1;
            transform: translateY(-10px)
        }

        .timer span {
            gap: 0;
            width: 20px
        }

        .timer span strong {
            height: 20px;
            font-size: .9em;
            border-radius: 4px
        }

        .timer span::after {
            font-size: .7em;
            content: attr(data-date-name)
        }
    }

    .ribbon_line::after {
        justify-content: center;
        width: 170px;
        height: 35px;
        color: var(--c-text);
        text-shadow: 0 1px 1px rgb(0 0 0 / 20%);
        background-color: var(--bg);
        border-radius: 4px 4px 4px 0;
        box-shadow: rgb(0 0 0 / 40%) 0 2px 4px, rgb(0 0 0 / 30%) 0 7px 13px -3px, rgb(0 0 0 / 20%) 0 -3px 0 inset;
        content: attr(data-ribbon-text)
    }

    .ribbon_line.color::after,
    .ribbon_line.right::after {
        border-radius: 4px 4px 0
    }

    .ribbon_line.color::after {
        width: 40px
    }

    @media screen and (max-width:1100px) {
        .furniture_in_life__container {
            grid-template: 1fr 0.5fr/repeat(3, 1fr);
            grid-template-areas: "big big big" ". . .";
            gap: 20px
        }

        .furniture_in_life__item {
            display: grid;
            grid-template-rows: 1fr auto;
            gap: 10px
        }

        .furniture_in_life__item.big {
            min-height: 380px
        }

        .furniture_in_life__data {
            gap: 5px;
            padding: 0 10px 10px
        }
    }

    .product_pin__container::after {
        position: absolute;
        top: -35px;
        left: -35px;
        z-index: -1;
        width: calc(100% + 70px);
        height: calc(100% + 70px);
        content: ""
    }

    .product_pin__container strong {
        font-size: 1.5em
    }

    .product_pin__name {
        grid-area: name
    }

    .product_pin:hover .pin {
        cursor: pointer
    }

    .product_pin:hover .pin::after {
        background: var(--color-green)
    }

    .product_pin:hover .product_pin__container {
        display: grid
    }

    .services__item {
        gap: 20px;
        align-items: center;
        width: 100%;
        height: 100%;
        min-height: 360px;
        padding: 20px;
        background: var(--color-grey);
        border: 2px solid var(--color-border);
        border-radius: 10px;
        margin-bottom: 50px
    }

    @media screen and (max-width:768px) {

        .ideas__container div,
        .ideas__container div>a,
        .ideas__container>div:nth-child(3) {
            min-height: 200px;
            max-height: 350px
        }

        .footer_navigation,
        .interiors__container {
            display: flex;
            flex-direction: column
        }

        .footer_menu {
            display: flex;
            flex-direction: column;
            width: 100%;
            max-width: 720px;
            margin-bottom: -2px;
            padding: 10px;
            border-bottom: 1px solid var(--color-black)
        }

        .footer_menu:last-child {
            border-bottom: none
        }

        .footer_item__title {
            display: flex;
            gap: 40px;
            align-items: center;
            justify-content: space-between;
            font-weight: 600;
            font-size: 1em;
            white-space: nowrap;
            cursor: pointer
        }

        .footer_item__title .chevron_down,
        .footer_item__title.product,
        .furniture_in_life__item {
            display: flex
        }

        .footer_item {
            display: flex;
            max-height: 0;
            margin-top: 0;
            overflow: hidden;
            transition: .3s;
            will-change: max-height
        }

        .footer_menu.active .chevron_down::after {
            transform: translateX(-2px) rotate(45deg)
        }

        .footer_menu.active .chevron_down::before {
            transform: translateX(2px) rotate(-45deg)
        }

        .footer_menu.active .footer_item {
            margin-top: 10px
        }

        #scrollTop {
            bottom: 70px
        }

        .furniture_in_life__container {
            grid-template: 2fr 1fr 1fr 1fr/1fr;
            grid-template-areas: "big";
            gap: 10px
        }

        .furniture_in_life__img_container {
            min-width: 40px
        }

        .interiors__content {
            gap: 10px;
            padding-top: 0
        }

        .interiors__content h3 {
            font-size: clamp(1em, 3vw, 1.2em)
        }

        .interiors__content p {
            font-size: clamp(.9em, 2vw, 1em)
        }

        .ideas__container {
            display: flex;
            flex-direction: column;
            gap: 10px;
            height: auto;
            max-height: 100%
        }

        .ideas__container div {
            flex: 1;
            height: 100%;
            aspect-ratio: 324/200
        }

        .ideas__container div>a {
            height: 100%
        }

        .ideas__container>div:nth-child(3)>a {
            height: 100%;
            min-height: 200px;
            max-height: 350px
        }

        .ideas_img {
            position: static;
            height: auto
        }

        [data-footer=main] {
            gap: 0
        }
    }
}

.label_file,
.review_index__item,
.reviews_index,
.reviews_index__container,
.reviews_index__wrapper,
[name=openReviewsForm] {
    position: relative;
    display: flex
}

.product_card.add_to_cart {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999
}

.user_actions__item,
.user_actions__login {
    width: auto;
    font-size: .9em;
    cursor: pointer;
    display: flex;
    height: 100%
}

.user_actions__item {
    flex-direction: column;
    gap: 7px;
    align-items: center;
    line-height: 1
}

.user_actions__login {
    flex-direction: column;
    align-items: center
}

.user_actions__login .icon {
    padding-top: 2px
}

.user_actions__cart::after,
.user_actions__item-wishlist::after {
    position: absolute;
    top: -5px;
    padding: 2.5px .5em;
    color: var(--color-white);
    font-size: .7em;
    background: var(--color-red);
    border-radius: 10px;
    opacity: 0;
    transition: .1s
}

.user_actions__cart,
.user_actions__item-wishlist {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%
}

.user_actions__cart .icon {
    width: 28px;
    height: 28px
}

.user_actions__cart.active::after {
    visibility: visible;
    opacity: 1
}

.user_actions__cart::after {
    right: -6px;
    visibility: hidden;
    content: attr(data-cart-count)
}

.user_actions__item-wishlist .icon {
    fill: var(--color-white)
}

.user_actions__item-wishlist.active .icon {
    fill: var(--color-red)
}

.user_actions__item-wishlist.active::after {
    opacity: 1
}

.user_actions__item-wishlist::after {
    right: 0;
    content: attr(data-count-wishlist)
}

.text-spinner {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: .7s linear infinite text_spin
}

@keyframes text_spin {
    to {
        transform: rotate(360deg)
    }
}

.label_file,
.reviews_index {
    flex-direction: column;
    gap: 20px
}

.edit_img_container .edit_img,
.label_file input {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute
}

.label_file {
    align-items: center;
    padding: 20px;
    border: 3px dotted var(--color-green);
    border-radius: 10px;
    cursor: pointer
}

.label_file input {
    cursor: pointer;
    opacity: 0
}

.label_file img {
    width: auto;
    height: 100px;
    filter: drop-shadow(2px 4px 6px rgb(14 30 37/32%))
}

.label_file:hover img {
    transform: scale(1.02)
}

.want_edit {
    opacity: 1;
    --border: var(--color-red)
}

.want_edit:hover::before,
.want_edit[data-edit=edit]::before,
.want_edit[data-edit=true]::before {
    position: absolute;
    top: -5px;
    left: -5px;
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    border: 1px solid var(--border);
    border-radius: 0 0 5px 5px;
    box-shadow: 0 2px 4px 0 rgb(14 30 37 / 12%), 0 2px 16px 0 rgb(14 30 37 / 32%);
    content: "";
    pointer-events: none
}

.want_edit:hover::after,
.want_edit[data-edit=edit]::after,
.want_edit[data-edit=true]::after {
    color: var(--color-black);
    text-transform: none;
    background: var(--color-white);
    border: 1px solid var(--border);
    opacity: 1;
    content: attr(data-edit-text)
}

.edit_img_container [data-edit-file-image] {
    padding: 10px
}

.edit_img_container .edit_img {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff3d
}

.edit_img_container .edit_img span {
    padding: 5px .5em;
    background: var(--color-white);
    border-radius: 8px
}

.reviews_index__mobile_wrapper .slider_buttons {
    position: absolute;
    right: 20px;
    bottom: 20px;
    z-index: 4
}

.reviews_index {
    min-height: 445px;
    margin-bottom: 60px
}

.reviews_index__container {
    gap: 20px;
    height: 450px
}

.reviews_index__wrapper {
    padding: 42px 70px 0 42px;
    overflow: hidden
}

.reviews_index__wrapper .slider {
    gap: 130px
}

.reviews_index__wrapper .slider_buttons {
    position: absolute;
    right: 90px;
    bottom: 20px;
    z-index: 4
}

.review_index_add {
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: space-between;
    width: 30%;
    height: 100%;
    padding: 40px 0 0
}

[name=openReviewsForm] {
    gap: .5em;
    align-items: center;
    height: 49px;
    margin-left: auto;
    padding: 0 20px;
    color: var(--color-white);
    font-weight: 600;
    background-image: linear-gradient(to right, #0eae57 0, #0c7475 41%, #0eae57 120%);
    background-size: 200% auto;
    border-radius: 100px;
    cursor: pointer;
    transition: .2s
}

[name=openReviewsForm]:hover {
    background-position: right center
}

.review_index__item {
    flex-direction: column;
    gap: 20px;
    justify-content: space-between;
    min-width: 100%;
    padding: 40px 80px 40px 180px;
    font-size: clamp(.9em, 2vw, 1em);
    border: 10px solid var(--color-green);
    border-radius: 10px
}

.review_index__avatar,
.review_index__img {
    border-radius: 8px
}

.review_index__item .rating_stars_container {
    position: absolute;
    top: 220px;
    left: 20px
}

.review_index__item .rating_stars_container svg {
    width: 25px;
    height: 25px
}

.review_index__item blockquote {
    height: 100%;
    overflow: hidden;
    overflow-y: auto
}

.review_index__avatar {
    position: absolute;
    top: -50px;
    left: -50px;
    width: 200px;
    height: 250px;
    padding: 5px;
    object-fit: contain;
    background: var(--color-white)
}

.review_index__img {
    width: 100%;
    min-width: 400px;
    height: 100%;
    object-fit: cover
}

.review_index__img_review {
    position: absolute;
    top: 50%;
    right: 0;
    width: 145px;
    box-shadow: 0 2px 4px 0 rgb(14 30 37 / 12%), 0 2px 8px 0 rgb(14 30 37 / 32%);
    transform: translate(50%, -50%);
    cursor: pointer
}

.review_index__text {
    overflow-x: hidden;
    overflow-y: auto
}

@media screen and (max-width:1070px) {
    .review_index__item {
        max-height: 400px
    }

    .review_index__item blockquote {
        padding-right: 2px
    }

    .reviews_index__container {
        display: flex;
        flex-direction: column;
        height: auto
    }

    .review_index__img {
        display: none
    }

    .review_index_add {
        width: 100%;
        padding: 0
    }
}

@media screen and (max-width:700px) {
    .review_index__item {
        padding: 20px 80px 20px 90px
    }

    .review_index__item .rating_stars_container {
        top: -40px;
        left: 90px
    }

    .review_index__avatar {
        width: 120px;
        height: 150px
    }
}

@media screen and (max-width:550px) {
    .reviews_index__wrapper {
        padding: 0
    }

    .reviews_index__wrapper .slider_buttons {
        right: 10px;
        bottom: 10px
    }

    .review_index__item {
        align-items: center;
        max-height: 800px;
        padding: 20px;
        border: 5px solid var(--color-green)
    }

    .review_index__item .rating_stars_container {
        position: static
    }

    .review_index__avatar {
        position: static;
        width: 100%;
        max-width: 180px;
        height: auto
    }

    .review_index__img_review {
        position: static;
        transform: translate(0, 0)
    }
}

.want_edit {
    position: relative;
    height: auto;
    --border: var(--color-red)
}

.want_edit:hover::after,
.want_edit[data-edit=edit]::after,
.want_edit[data-edit=true]::after {
    position: absolute;
    top: -23px;
    left: -5px;
    margin-left: 0;
    padding: 2px 3px 2px 0;
    color: var(--color-black);
    font-weight: 400;
    font-size: .8rem;
    line-height: 1;
    white-space: nowrap;
    text-transform: none;
    background: var(--color-white);
    border: 1px solid var(--border);
    border-radius: 5px 5px 0 0;
    box-shadow: -2px 0 4px 0 rgb(14 30 37 / 12%), -2px 0 16px 0 rgb(14 30 37 / 32%);
    content: attr(data-edit-text)
}

.always_in_contact__container {
    position: relative;
    display: flex;
    gap: 20px;
    justify-content: center;
    height: 100%;
    margin: 20px 0;
    padding: 20px;
    background: var(--color-grey);
    border: 2px solid var(--color-border);
    border-radius: 10px
}

.always_in_contact__container .spinner::after {
    border: 5px solid var(--color-white);
    border-bottom-color: var(--color-red)
}

.always_in_contact__img {
    width: 60px;
    height: 60px;
    margin-bottom: 20px;
    transition: .2s
}

.always_in_contact__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 352px;
    text-align: center
}

.always_in_contact__item [name=openContactForm] * {
    pointer-events: none
}

.always_in_contact__item:hover .always_in_contact__img {
    transform: scale(1.2)
}

.always_in_contact__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 125px;
    margin-bottom: 10px;
    text-align: center
}

@media screen and (max-width:768px) {
    .always_in_contact__container {
        flex-direction: column;
        gap: 5px
    }

    .always_in_contact__item {
        min-height: 0
    }

    .always_in_contact__item p {
        font-size: clamp(.9em, 2vw, 1em)
    }

    .always_in_contact__title {
        flex-direction: row;
        gap: 10px;
        height: auto;
        font-size: clamp(.9em, 2.5vw, 1.2em)
    }

    .always_in_contact__img {
        width: 40px;
        height: 40px;
        margin-bottom: 0
    }
}

.how_buy__container {
    position: relative;
    display: grid;
    grid-template: 1fr/repeat(4, 1fr);
    gap: 60px;
    max-width: 1300px;
    min-height: 275px;
    margin: auto;
    padding: 50px 0
}

.how_buy__item {
    position: relative;
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    gap: 20px;
    align-items: center;
    font-size: .9em;
    text-align: center
}

.how_buy__item:hover::before {
    position: absolute;
    top: -10px;
    left: -10px;
    z-index: -1;
    width: calc(100% + 20px);
    height: calc(100% + 20px);
    background: var(--color-grey);
    border-radius: 10px;
    content: ""
}

.how_buy__img {
    width: auto;
    height: 60px;
    pointer-events: none
}

@media screen and (max-width:1150px) {
    .how_buy__container {
        grid-template: repeat(2, 1fr)/repeat(2, 1fr);
        gap: 20px
    }
}

@media screen and (max-width:600px) {
    .how_buy__container {
        grid-template: repeat(4, 1fr)/1fr
    }

    .how_buy__img {
        height: 40px
    }
}

.virtual_tour {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    margin: 20px 0
}

.virtual_tour__container {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%
}

.virtual_tour__container .slider {
    gap: 20px
}

.virtual_tour__item {
    position: relative;
    display: flex;
    min-width: 100%;
    max-width: 1400px;
    height: 100%;
    aspect-ratio: 1400/500;
    border-radius: 8px
}

.virtual_tour__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 2px solid var(--color-border);
    border-radius: 8px
}

.virtual_tour__link {
    --size: clamp(100px, 20vw, 200px);
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    width: var(--size);
    height: var(--size);
    background: #226d398c;
    border: 2px solid var(--color-green);
    border-radius: 50%;
    box-shadow: rgb(0 0 0 / 56%) 0 22px 70px 4px;
    transform: translate(-50%, -50%);
    cursor: pointer
}

.virtual_tour__img_360 {
    width: 80%;
    height: 80%;
    margin: auto
}

.navigation_submenu__items {
    display: grid;
    justify-content: center;
    grid-template-columns: repeat(auto-fill, minmax(5rem, 15rem));
    gap: 25px;
    padding: 5px
}

.navigation_submenu__item {
    position: relative;
    display: grid;
    grid-template-rows: 1fr auto;
    padding: 1em;
    border: 2px solid var(--color-border);
    border-radius: 8px;
    background-color: #fff;
    box-shadow: 0 2px 8px rgb(0 0 0 / 15%)
}

.navigation_submenu__item img {
    width: 100%;
    height: 100%;
    max-height: 370px;
    object-fit: cover;
    border-radius: 8px;
    transition: .4s ease-in-out
}

.navigation_submenu__item a {
    overflow: hidden;
    border-radius: 8px
}

.navigation_submenu__item:hover img {
    transform: scale(1.1)
}

.navigation_submenu__item:hover {
    border: 2px solid var(--color-green)
}

.product_navigation_submenu .product_card {
    min-width: auto;
    height: 375px;
}

.product_navigation_submenu .product_card__count {
    display: none
}

.subcatalog_item {
    position: relative;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    border: 2px solid var(--color-border);
    border-radius: 8px;
    transition: .3s;
    aspect-ratio: 1/1
}

.subcatalog_item img,
.subcatalog_item .image-preloader-wrapper,
.subcatalog_item img.disable::after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 6px
}

.subcatalog_item::before {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to top, #5c5c5c 26%, #5c5c5c 27%, rgb(92 92 92 / 0%) 100%);
    opacity: .5;
    content: ""
}

.subcatalog_item img {
    object-fit: cover;
    aspect-ratio: 1/1
}

.subcatalog_item img.disable::after {
    z-index: +1;
    background: var(--color-grey);
    content: ""
}

.subcatalog_item:hover {
    border: 2px solid var(--color-green);
    box-shadow: rgb(14 30 37 / 12%) 0 2px 4px 0, rgb(14 30 37 / 32%) 0 2px 16px 0;
    transform: scale(1.02)
}

.subcatalog_title {
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px;
    color: var(--color-white)
}

.subcatalog_title h2 {
    font-size: 1.3em;
    line-height: 1
}

.subcatalog_title span {
    font-size: 1em
}

@media screen and (max-width: 500px) {
    [name=freeCall] span {
        display: none;
    }
}

#cityChoice {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    max-width: 1300px;
    height: 100%;
    max-height: 885px;
    margin: auto;
    padding: 40px 30px;
    border-radius: 1em
}

.city-choice__header {
    display: grid;
    gap: 20px;
}

.city-choice__header h2 {
    white-space: nowrap;
    text-align: center;
    text-transform: uppercase
}

.city-choice__search {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    width: 100%;
    height: 40px;
    margin-left: auto;
    padding: 0 .5px;
    background-image: radial-gradient(circle farthest-corner at 10% 20%, #0eae57 0, #0c7475 90%);
    border-radius: 100px
}

.city-choice__search .dropdown {
    height: 100%;
    padding-left: 12px;
    background: #fff;
    border-radius: 100px 0 0 100px
}

.city-choice__search .dropdown .icon {
    width: 18px;
    height: 18px;
    margin-right: 8px
}

.city-choice__search .dropdown_body {
    right: auto;
    left: 0;
    border: 1px solid var(--color-green)
}

.city-choice__search .dropdown_item {
    display: flex;
    align-items: center
}

.city-choice__search>label {
    width: 100%;
    height: 100%;
    padding: 0 40px 0 15px;
    background: var(--color-white);
    border-radius: 0 100px 100px 0
}

.city-choice__search::after,
.city-choice__search>button {
    position: absolute;
    background-image: radial-gradient(circle farthest-corner at 10% 20%, rgb(14 174 87 / 100%) 0, rgb(12 116 117 / 100%) 90%)
}

.city-choice__search input {
    width: 100%;
    height: 100%
}

.city-choice__search>button {
    right: 0;
    width: 34px;
    height: 34px;
    margin: 6px;
    border-radius: 50%
}

.city-choice__search>button .icon {
    width: 34px;
    height: 34px;
    padding: 7px;
    fill: var(--color-white)
}

.city-choice__search::after {
    left: -2px;
    z-index: -1;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    border-radius: 100px;
    content: ""
}

#activeCityName,
.city-choice__city.active {
    background: var(--color-salad)
}

.city-choice__list {
    overflow: auto;
}

@media screen and (min-width:769px) {
    .city-choice__list {
        columns: 230px;
    }
}

.city-choice__list.one_city {
    display: flex;
    columns: 1
}

.city-choice__item {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 10px;
    padding-bottom: 3px;
    padding-left: 35px
}

.city-choice__item::before {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.7em;
    line-height: 1.2;
    content: attr(data-city-letter)
}

.city-choice__city {
    display: flex;
    padding: 5px;
    line-height: 1
}

.city-choice__city:hover {
    color: var(--color-green);
    cursor: pointer
}

.city-choice__active {
    display: flex
}

#activeCityName {
    margin-left: 5px;
    padding: 0 5px;
    font-weight: 700
}

.city-choice__letter_container {
    
    display: grid;
    /* align-items: flex-end; */
    grid-template-columns: repeat(auto-fill, 35px);
    }
}

.city-choice__letter_container>span {
    margin-right: 10px;
    font-size: 1.2em;
    cursor: pointer
}

.city-choice__letter_container li {
    padding: 0 .5em;
    font-weight: 700;
    font-size: 1.3rem;
    cursor: pointer
}

.city-choice__letter_container li.active,
.city-choice__letter_container li:hover {
    color: #fff;
    background: var(--color-green-alpha)
}

.city-choice__hover {
    position: absolute;
    top: calc(100% + 10px);
    left: 130px;
    display: none;
    gap: 10px;
    align-items: center;
    padding: 10px;
    background: var(--color-white);
    border: 1px solid var(--color-green);
    border-radius: 8px
}

.ribbon_line.sale,
.ribbon_line.sale::after {
    width: 60px
}

.ribbon_line.new_middle,
.ribbon_line.new_middle::after {
    width: 100px
}
