@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap');

:root {
   --falily-nunito: "Nunito", sans-serif;
   --family-cormorant: "Cormorant Garamond", serif;

   --h1: clamp(27px, 3vw, 45px);
   --h2: clamp(24px, 3.2vw, 40px);
   --h3: clamp(22px, 2.8vw, 36px);
   --h4: clamp(25px, 2.4vw, 32px);
   --h5: clamp(23px, 2.2vw, 30px);
   --h6: clamp(21px, 2vw, 28px);

   --fs-14: clamp(15px, 1vw, 14px);
   --fs-16: clamp(15px, 1.2vw, 16px);
   --fs-18: clamp(15px, 1.4vw, 18px);
   --fs-20: clamp(16px, 1.6vw, 20px);
   --fs-22: clamp(17px, 1.8vw, 22px);
   --fs-24: clamp(18px, 2vw, 24px);

   --black-color: #323232;
   --gray-color: #7A7A7A;
   --white-color: #ffffff;
   --orange-color: #EA9629;
   --turquoise-color: #228A8A;

   --turquoise-gardient: linear-gradient(90deg, #228A8A 0%, #13C8C8 100%);

   --border-radius: 5px;
   --transition: 0.25s ease;
   --shadow: 0 18px 45px rgba(50, 50, 50, 0.14);
}

* {
   box-sizing: border-box;
}

html {
   scroll-behavior: smooth;
}

body {
   margin: 0;
   font-family: var(--falily-nunito);
   font-size: var(--fs-18);
   line-height: 1.5;
   color: var(--black-color);
   background: #F8F8F8;
   overflow-x: hidden;
}

body.is-lock {
   overflow: hidden;
}

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

button,
input,
textarea {
   font: inherit;
}

button {
   cursor: pointer;
}

.container {
   width: 100%;
   max-width: 1440px;
   margin: 0 auto;
   padding: 0 20px;
}

h2 {
   margin: 0;
   font-family: var(--family-cormorant);
   font-size: var(--h2);
   line-height: 1.3;
   font-weight: 600;
   text-transform: uppercase;
   color: var(--black-color);
}

.section-header {
   display: grid;
   grid-template-columns: minmax(0, 860px) minmax(320px, 460px);
   justify-content: space-between;
   gap: 40px;
   margin-bottom: clamp(38px, 5vw, 62px);
   align-items: end;
}

.section-header__text {
   margin: 0;
   color: var(--black-color);
   font-size: var(--fs-18);
   line-height: 1.65;
}

.mt-120 {
   margin-top: 120px;
}

/* HEADER */

.header {
   position: relative;
   z-index: 100;
   background: var(--white-color);
   box-shadow: 0 8px 25px rgba(50, 50, 50, 0.06);
}

.header__top {
   border-bottom: 1px solid rgba(50, 50, 50, 0.08);
}

.header__top-container {
   display: grid;
   grid-template-columns: 1fr auto 1fr;
   align-items: center;
   min-height: 48px;
   gap: 20px;
}

.header__contacts,
.header__right,
.header__messengers,
.header__buttons,
.header__main-container,
.header__mobile {
   display: flex;
   align-items: center;
}

.header__contacts {
   gap: 24px;
   min-width: 0;
}

.header__contact {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   color: var(--gray-color);
   font-size: var(--fs-14);
   transition: color var(--transition);
}

.header__contact:hover {
   color: var(--turquoise-color);
}

.header__contact-icon {
   display: inline-flex;
   color: var(--orange-color);
}

.header__dropdown-wrapper {
   position: relative;
}

.header__phone,
.header__language,
.header__mobile-language {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   border: 0;
   background: transparent;
   color: var(--black-color);
   font-size: var(--fs-14);
   padding: 6px 0;
}

.header__flag-img,
.dropdown__flag,
.mobile-menu__flag {
   display: block;
   width: 22px;
   height: 22px;
   object-fit: cover;
   flex: 0 0 auto;
}

.header__arrow {
   width: 7px;
   height: 7px;
   border-right: 1.5px solid currentColor;
   border-bottom: 1.5px solid currentColor;
   transform: rotate(45deg) translateY(-2px);
   transition: transform var(--transition);
}

.header__dropdown-wrapper.is-active .header__arrow {
   transform: rotate(225deg) translateY(-1px);
}

.header__messengers {
   justify-content: center;
   gap: 10px;
}

.header__messenger {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 34px;
   height: 34px;
   color: var(--turquoise-color);
   border: 1px solid rgba(34, 138, 138, 0.22);
   border-radius: 50%;
   transition: color var(--transition), background var(--transition), border-color var(--transition);
}

.header__messenger svg {
   display: block;
   max-width: 18px;
   height: auto;
   flex-shrink: 0;
}

.header__messenger:hover {
   color: var(--white-color);
   background: var(--turquoise-color);
   border-color: var(--turquoise-color);
}

.header__right {
   justify-content: flex-end;
   gap: 24px;
}

.header__callback {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-height: 36px;
   padding: 7px 18px;
   border: 0;
   border-radius: var(--border-radius);
   background: var(--orange-color);
   color: var(--white-color);
   font-size: var(--fs-14);
   font-weight: 500;
   transition: transform var(--transition), box-shadow var(--transition), background var(--transition);
}

.header__callback:hover {
   transform: translateY(-1px);
   box-shadow: 0 10px 22px rgba(234, 150, 41, 0.28);
}

.header__main {
   position: relative;
   background: var(--white-color);
}

.header__main-container {
   min-height: 78px;
   gap: 34px;
}

.header__logo {
   flex: 0 0 auto;
}

.logo {
   display: inline-flex;
   align-items: center;
   flex: 0 0 auto;
}

.logo img {
   display: block;
   width: auto;
   max-width: 205px;
   height: auto;
}

.header__nav {
   flex: 1 1 auto;
}

.nav {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: clamp(14px, 2vw, 34px);
}

.nav__item {
   position: relative;
}

.nav__item--catalog {
   position: static;
}

.nav__link,
.nav__catalog {
   display: inline-flex;
   align-items: center;
   gap: 9px;
   border: 0;
   background: transparent;
   color: var(--black-color);
   font-size: var(--fs-16);
   font-weight: 600;
   white-space: nowrap;
   transition: color var(--transition);
}

.nav__link:hover,
.nav__catalog:hover {
   color: var(--turquoise-color);
}

.nav__link--button {
   padding: 0;
}

.nav__catalog {
   min-height: 42px;
   padding: 0 18px;
   border-radius: var(--border-radius);
   color: var(--white-color);
   background: var(--orange-color);
}

.nav__catalog:hover {
   color: var(--white-color);
}

.nav__catalog-icon {
   position: relative;
   display: inline-block;
   width: 18px;
   height: 12px;
}

.nav__catalog-icon,
.nav__catalog-icon::before,
.nav__catalog-icon::after {
   border-top: 2px solid currentColor;
}

.nav__catalog-icon::before,
.nav__catalog-icon::after {
   content: "";
   position: absolute;
   left: 0;
   width: 18px;
}

.nav__catalog-icon::before {
   top: 4px;
}

.nav__catalog-icon::after {
   top: 10px;
}

.header__buttons {
   gap: 12px;
   flex: 0 0 auto;
}

.header__icon-button {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 44px;
   height: 44px;
   border: 1px solid rgba(50, 50, 50, 0.12);
   border-radius: 50%;
   background: var(--white-color);
   color: var(--black-color);
   transition: color var(--transition), border-color var(--transition), background var(--transition);
}

.header__icon-button:hover {
   color: var(--white-color);
   background: var(--turquoise-color);
   border-color: var(--turquoise-color);
}

.dropdown {
   position: absolute;
   top: calc(100% + 12px);
   left: 0;
   min-width: 220px;
   padding: 8px;
   border-radius: calc(var(--border-radius) * 2);
   background: var(--white-color);
   box-shadow: var(--shadow);
   opacity: 0;
   visibility: hidden;
   transform: translateY(8px);
   transition: opacity var(--transition), visibility var(--transition), transform var(--transition);
   z-index: 20;
}

.dropdown--right {
   right: 0;
   left: auto;
   min-width: 110px;
}

.header__dropdown-wrapper.is-active>.dropdown,
.nav__item.is-active>.dropdown {
   opacity: 1;
   visibility: visible;
   transform: translateY(0);
}

.dropdown__link {
   display: flex;
   align-items: center;
   gap: 10px;
   min-height: 38px;
   padding: 8px 12px;
   border-radius: var(--border-radius);
   color: var(--black-color);
   font-size: var(--fs-14);
   transition: background var(--transition), color var(--transition);
}

.dropdown__link:hover {
   color: var(--turquoise-color);
   background: rgba(34, 138, 138, 0.08);
}

.dropdown--catalog {
   top: 100%;
   left: 0;
   right: 0;
   width: 100%;
   min-width: 100%;
   padding: 24px 0 26px;
   border-radius: 0;
   box-shadow: 0 18px 35px rgba(50, 50, 50, 0.08);
   border-top: 1px solid rgba(50, 50, 50, 0.08);
}

.dropdown--catalog::before {
   content: "";
   display: block;
   width: 100%;
   max-width: 1440px;
   height: 1px;
   margin: -24px auto 22px;
   background: transparent;
}

.dropdown__catalog-grid {
   width: 100%;
   max-width: 1440px;
   margin: 0 auto;
   padding: 0 20px;
   display: grid;
   grid-template-columns: 1fr 1fr 1fr 1fr;
   gap: clamp(28px, 5vw, 86px);
}

.dropdown__catalog-column {
   min-width: 0;
}

.dropdown__catalog-title {
   margin: 0 0 13px;
   color: var(--black-color);
   font-size: var(--fs-16);
   font-weight: 800;
   line-height: 1.25;
}

.dropdown__catalog-link {
   display: block;
   width: fit-content;
   max-width: 100%;
   margin-top: 8px;
   color: #555555;
   font-size: var(--fs-14);
   line-height: 1.35;
   transition: color var(--transition), transform var(--transition);
}

.dropdown__catalog-link:hover {
   color: var(--turquoise-color);
   transform: translateX(3px);
}

.header__mobile {
   display: none;
   width: 100%;
   justify-content: space-between;
   gap: 10px;
}

.header__mobile-logo img {
   max-width: 150px;
}

.header__mobile-phone {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-height: 34px;
   padding: 5px 9px;
   border-radius: var(--border-radius);
   color: var(--turquoise-color);
   font-size: 13px;
   font-weight: 800;
   background: rgba(34, 138, 138, 0.08);
   white-space: nowrap;
}

.header__mobile-language {
   gap: 5px;
   padding: 5px 0;
   font-size: 13px;
   font-weight: 700;
}

.header__mobile-language .header__flag-img {
   width: 20px;
   height: 20px;
}

.header__burger {
   position: relative;
   display: inline-flex;
   flex-direction: column;
   justify-content: center;
   gap: 5px;
   width: 40px;
   height: 40px;
   padding: 0;
   border: 0;
   background: transparent;
}

.header__burger span {
   display: block;
   width: 26px;
   height: 2px;
   margin-left: auto;
   border-radius: 10px;
   background: var(--black-color);
}

/* MODAL */

.modal {
   position: fixed;
   inset: 0;
   z-index: 900;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 20px;
   opacity: 0;
   visibility: hidden;
   transition: opacity var(--transition), visibility var(--transition);
}

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

.modal__overlay {
   position: absolute;
   inset: 0;
   background: rgba(20, 20, 20, 0.58);
   backdrop-filter: blur(5px);
}

.modal__window {
   position: relative;
   z-index: 1;
   width: min(100%, 560px);
   max-height: calc(100vh - 40px);
   overflow-y: auto;
   padding: clamp(26px, 4vw, 42px);
   border-radius: 18px;
   background: var(--white-color);
   box-shadow: var(--shadow);
   transform: translateY(18px) scale(0.98);
   transition: transform var(--transition);
}

.modal.is-active .modal__window {
   transform: translateY(0) scale(1);
}

.modal__window--search {
   width: min(100%, 720px);
}

.modal__close,
.mobile-menu__close {
   position: absolute;
   top: 18px;
   right: 18px;
   width: 36px;
   height: 36px;
   border: 0;
   border-radius: 50%;
   background: rgba(50, 50, 50, 0.06);
}

.modal__close::before,
.modal__close::after,
.mobile-menu__close::before,
.mobile-menu__close::after {
   content: "";
   position: absolute;
   top: 17px;
   left: 9px;
   width: 18px;
   height: 2px;
   border-radius: 10px;
   background: var(--black-color);
}

.modal__close::before,
.mobile-menu__close::before {
   transform: rotate(45deg);
}

.modal__close::after,
.mobile-menu__close::after {
   transform: rotate(-45deg);
}

.modal__label {
   margin: 0 0 8px;
   color: var(--orange-color);
   font-size: var(--fs-14);
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: 0.08em;
}

.modal__title {
   margin: 0;
   font-family: var(--family-cormorant);
   font-size: var(--h3);
   line-height: 1.1;
   color: var(--black-color);
}

.modal__text {
   max-width: 460px;
   margin: 12px 0 0;
   color: var(--gray-color);
   font-size: var(--fs-16);
}

/* SEARCH */

.search-form,
.callback-form {
   display: grid;
   gap: 16px;
   margin-top: 28px;
}

.search-form__label,
.callback-form__label {
   color: var(--black-color);
   font-size: var(--fs-14);
   font-weight: 700;
}

.search-form__row {
   display: grid;
   grid-template-columns: 1fr auto;
   gap: 10px;
}

.search-form__input,
.callback-form__input,
.callback-form__textarea {
   width: 100%;
   min-height: 50px;
   padding: 0 16px;
   border: 1px solid rgba(50, 50, 50, 0.14);
   border-radius: var(--border-radius);
   background: #FAFAFA;
   color: var(--black-color);
   outline: none;
   transition: border-color var(--transition), background var(--transition), box-shadow var(--transition);
}

.callback-form__textarea {
   min-height: 110px;
   padding-top: 14px;
   resize: vertical;
}

.search-form__input:focus,
.callback-form__input:focus,
.callback-form__textarea:focus {
   border-color: var(--turquoise-color);
   background: var(--white-color);
   box-shadow: 0 0 0 3px rgba(34, 138, 138, 0.12);
}

.search-form__button,
.callback-form__button,
.mobile-menu__button {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-height: 50px;
   padding: 0 24px;
   border: 0;
   border-radius: var(--border-radius);
   background: var(--turquoise-gardient);
   color: var(--white-color);
   font-weight: 800;
   transition: transform var(--transition), box-shadow var(--transition);
}

.search-form__button:hover,
.callback-form__button:hover,
.mobile-menu__button:hover {
   transform: translateY(-1px);
   box-shadow: 0 12px 26px rgba(34, 138, 138, 0.25);
}

.search-form__result {
   max-height: min(430px, 52vh);
   overflow-y: auto;
   border: 1px solid rgba(50, 50, 50, 0.10);
   border-radius: 14px;
   background: var(--white-color);
   box-shadow: 0 18px 44px rgba(31, 47, 51, 0.12);
   scrollbar-width: thin;
   scrollbar-color: rgba(34, 138, 138, 0.35) transparent;
}

.search-form__result[hidden] {
   display: none;
}

.search-form__message {
   margin: 0;
   padding: 16px;
   color: var(--gray-color);
   font-size: var(--fs-14);
}

.search-form__message.is-loading::before {
   content: "";
   display: inline-block;
   width: 14px;
   height: 14px;
   margin-right: 8px;
   border: 2px solid rgba(34, 138, 138, 0.22);
   border-top-color: var(--turquoise-color);
   border-radius: 50%;
   vertical-align: -2px;
   animation: search-result-spin 0.7s linear infinite;
}

.search-form__message.is-error {
   color: #B64B4B;
}

.search-form__suggestions {
   display: grid;
}

.search-result-card {
   display: grid;
   grid-template-columns: 64px minmax(0, 1fr) auto;
   gap: 12px;
   align-items: center;
   min-height: 78px;
   padding: 9px 12px;
   border-bottom: 1px solid rgba(50, 50, 50, 0.08);
   color: var(--black-color);
   text-decoration: none;
   transition: background var(--transition), color var(--transition);
}

.search-result-card:hover,
.search-result-card.is-active {
   background: rgba(34, 138, 138, 0.09);
}

.search-result-card__image {
   width: 64px;
   height: 58px;
   overflow: hidden;
   border-radius: 9px;
   background: #EEF2F2;
}

.search-result-card__image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.search-result-card__content {
   display: grid;
   min-width: 0;
   gap: 3px;
}

.search-result-card__category {
   color: var(--turquoise-color);
   font-size: 11px;
   font-weight: 700;
   letter-spacing: 0.04em;
   text-transform: uppercase;
}

.search-result-card__title {
   overflow: hidden;
   color: var(--black-color);
   font-size: 15px;
   font-weight: 600;
   line-height: 1.25;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.search-result-card__meta {
   overflow: hidden;
   color: var(--gray-color);
   font-size: 12px;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.search-result-card__price {
   color: var(--turquoise-color);
   font-size: 13px;
   font-weight: 700;
   white-space: nowrap;
}

.search-form__all-results {
   display: flex;
   align-items: center;
   justify-content: center;
   min-height: 48px;
   padding: 10px 16px;
   color: var(--turquoise-color);
   font-size: var(--fs-14);
   font-weight: 700;
   text-align: center;
   text-decoration: none;
   transition: background var(--transition), color var(--transition);
}

.search-form__all-results:hover,
.search-form__all-results.is-active {
   background: var(--turquoise-color);
   color: var(--white-color);
}

@keyframes search-result-spin {
   to { transform: rotate(360deg); }
}

.callback-form__field {
   display: grid;
   gap: 7px;
}

.callback-form__policy {
   margin: -2px 0 0;
   color: var(--gray-color);
   font-size: 12px;
}

/* MOBILE MENU */

.mobile-menu {
   position: fixed;
   inset: 0;
   z-index: 800;
   background: rgba(20, 20, 20, 0.58);
   opacity: 0;
   visibility: hidden;
   transition: opacity var(--transition), visibility var(--transition);
}

.mobile-menu.is-active {
   opacity: 1;
   visibility: visible;
}

.mobile-menu__panel {
   width: min(100%, 460px);
   height: 100%;
   margin-left: auto;
   padding: 22px 18px 28px;
   background: var(--white-color);
   transform: translateX(100%);
   transition: transform var(--transition);
   overflow-y: auto;
}

.mobile-menu.is-active .mobile-menu__panel {
   transform: translateX(0);
}

.mobile-menu__top {
   position: relative;
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.mobile-menu__logo img {
   display: block;
   max-width: 170px;
   height: auto;
}

.mobile-menu__close {
   position: relative;
   top: auto;
   right: auto;
   flex: 0 0 auto;
}

.mobile-menu__tabs {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 8px;
   margin-top: 28px;
   padding: 5px;
   border-radius: calc(var(--border-radius) * 2);
   background: #F4F4F4;
}

.mobile-menu__tab {
   min-height: 42px;
   border: 0;
   border-radius: var(--border-radius);
   background: transparent;
   color: var(--gray-color);
   font-size: var(--fs-14);
   font-weight: 800;
}

.mobile-menu__tab.is-active {
   background: var(--white-color);
   color: var(--turquoise-color);
   box-shadow: 0 8px 18px rgba(50, 50, 50, 0.08);
}

.mobile-menu__content {
   margin-top: 22px;
}

.mobile-menu__section {
   display: none;
}

.mobile-menu__section.is-active {
   display: grid;
   gap: 10px;
}

.mobile-menu__link,
.mobile-menu__contact {
   display: flex;
   align-items: center;
   gap: 10px;
   min-height: 50px;
   padding: 12px 14px;
   border-radius: var(--border-radius);
   background: #F8F8F8;
   color: var(--black-color);
   font-size: var(--fs-16);
   font-weight: 700;
}

.mobile-menu__link:hover,
.mobile-menu__contact:hover {
   color: var(--turquoise-color);
}

.mobile-menu__button {
   width: 100%;
   margin-top: 12px;
}

.mobile-menu__socials {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 10px;
   margin-top: 12px;
}

.mobile-menu__social {
   display: flex;
   align-items: center;
   justify-content: center;
   min-height: 46px;
   border-radius: var(--border-radius);
   color: var(--white-color);
   background: var(--turquoise-color);
   font-weight: 800;
}

/* MOBILE CATALOG */

.mobile-menu__catalog {
   display: grid;
   gap: 18px;
}

.mobile-menu__catalog-group {
   padding: 16px;
   border-radius: calc(var(--border-radius) * 2);
   background: #F8F8F8;
}

.mobile-menu__catalog-title {
   margin: 0 0 10px;
   color: var(--black-color);
   font-size: var(--fs-16);
   font-weight: 800;
}

.mobile-menu__catalog-link {
   display: block;
   padding: 7px 0;
   color: #555555;
   font-size: var(--fs-14);
   line-height: 1.35;
   transition: color var(--transition), transform var(--transition);
}

.mobile-menu__catalog-link:hover {
   color: var(--turquoise-color);
   transform: translateX(3px);
}

/* FILTER */

.catalog-filter__container {
   position: relative;
}

.catalog-filter__form {
   position: relative;
}

.catalog-filter__tabs {
   display: flex;
   align-items: flex-end;
}

.catalog-filter__tab {
   min-height: 50px;
   padding: 0 20px;
   border: 0;
   border-radius: var(--border-radius) var(--border-radius) 0 0;
   background: #F1F1F1;
   color: var(--black-color);
   font-size: var(--fs-18);
   font-weight: 500;
   transition: background var(--transition), color var(--transition);
}

.catalog-filter__tab.is-active {
   background: var(--turquoise-color);
   color: var(--white-color);
}

.catalog-filter__tab:hover:not(.is-active) {
   background: #E8E8E8;
}

.catalog-filter__body {
   padding: 28px 22px 22px;
   background: var(--white-color);
   box-shadow: 0 14px 34px rgba(50, 50, 50, 0.06);
}

.catalog-filter__grid {
   display: grid;
   grid-template-columns: minmax(190px, 1.1fr) minmax(190px, 1.1fr) minmax(190px, 1.1fr) minmax(230px, 0.9fr);
   gap: 20px;
   align-items: end;
}

.catalog-filter__grid--more {
   padding-top: 22px;
}

.catalog-filter__field {
   display: grid;
   gap: 10px;
   min-width: 0;
}

.catalog-filter__label {
   color: var(--black-color);
   font-size: var(--fs-16);
   font-weight: 600;
   line-height: 1.25;
}

.catalog-filter__select,
.catalog-filter__input {
   width: 100%;
   height: 50px;
   border: 1px solid rgba(50, 50, 50, 0.18);
   border-radius: var(--border-radius);
   background-color: #F7F7F7;
   color: var(--black-color);
   font-size: var(--fs-14);
   outline: none;
   transition: border-color var(--transition), background var(--transition), box-shadow var(--transition);
}

.catalog-filter__select {
   padding: 0 42px 0 12px;
   appearance: none;
   background-image:
      linear-gradient(45deg, transparent 50%, #8A8A8A 50%),
      linear-gradient(135deg, #8A8A8A 50%, transparent 50%);
   background-position:
      calc(100% - 17px) 21px,
      calc(100% - 12px) 21px;
   background-size:
      5px 5px,
      5px 5px;
   background-repeat: no-repeat;
}

.catalog-filter__input {
   padding: 0 12px;
}

.catalog-filter__select:focus,
.catalog-filter__input:focus {
   border-color: var(--turquoise-color);
   background-color: var(--white-color);
   box-shadow: 0 0 0 3px rgba(34, 138, 138, 0.12);
}

.catalog-filter__price {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 10px;
}

.catalog-filter__more[hidden] {
   display: none;
}

.catalog-filter__bottom {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 24px;
   margin-top: 28px;
}

.catalog-filter__more-button,
.catalog-filter__clear {
   display: inline-flex;
   align-items: center;
   gap: 9px;
   min-height: 42px;
   padding: 0;
   border: 0;
   background: transparent;
   color: var(--gray-color);
   font-size: var(--fs-16);
   font-weight: 500;
   transition: color var(--transition);
}

.catalog-filter__more-button:hover,
.catalog-filter__clear:hover {
   color: var(--turquoise-color);
}

.catalog-filter__more-icon {
   position: relative;
   width: 16px;
   height: 16px;
   flex: 0 0 auto;
}

.catalog-filter__more-icon::before,
.catalog-filter__more-icon::after {
   content: "";
   position: absolute;
   background: currentColor;
   border-radius: 10px;
}

.catalog-filter__more-icon::before {
   left: 0;
   top: 7px;
   width: 16px;
   height: 1.5px;
}

.catalog-filter__more-icon::after {
   left: 7px;
   top: 0;
   width: 1.5px;
   height: 16px;
   transition: transform var(--transition);
}

.catalog-filter__more-button.is-active .catalog-filter__more-icon::after {
   transform: rotate(90deg);
}

.catalog-filter__actions {
   display: flex;
   align-items: center;
   gap: 28px;
}

.catalog-filter__clear-icon,
.catalog-filter__submit-icon {
   display: inline-flex;
   flex: 0 0 auto;
}

.catalog-filter__submit {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   min-height: 50px;
   padding: 0 24px;
   border: 0;
   border-radius: var(--border-radius);
   background: var(--black-color);
   color: var(--white-color);
   font-size: var(--fs-16);
   font-weight: 600;
   transition: background var(--transition), transform var(--transition), box-shadow var(--transition);
}

.catalog-filter__submit:hover {
   background: var(--turquoise-color);
   transform: translateY(-1px);
   box-shadow: 0 12px 26px rgba(34, 138, 138, 0.25);
}

.catalog-filter__form[hidden],
.catalog-filter__more[hidden] {
   display: none;
}

.catalog-filter__field.is-hidden {
   display: none;
}

/* FOUNDER MESSAGE */

.founder-message {
   background: #F8F8F8;
   overflow: visible;
}

.founder-message .container {
   overflow: visible;
}

.founder-message__inner {
   position: relative;
   min-height: 520px;
   padding: clamp(54px, 6vw, 76px) calc(410px + clamp(48px, 6vw, 86px)) clamp(46px, 5vw, 64px) clamp(28px, 4vw, 54px);
   background: var(--white-color);
   overflow: visible;
}

.founder-message__content {
   max-width: 760px;
}

.founder-message__text {
   max-width: 760px;
   margin-top: clamp(34px, 4vw, 56px);
   color: var(--black-color);
   font-size: var(--fs-16);
   line-height: 1.6;
}

.founder-message__text p {
   margin: 0;
}

.founder-message__text p+p {
   margin-top: 12px;
}

.founder-message__signature {
   margin: clamp(34px, 4vw, 54px) 0 0;
   color: var(--black-color);
   font-size: var(--fs-16);
   line-height: 1.4;
}

.founder-message__signature span {
   font-style: italic;
}

/* КАРТИНКА: выступает сверху, снизу ровно */
.founder-message__image-wrap {
   position: absolute;
   right: clamp(28px, 4vw, 54px);
   top: -42px;
   bottom: 0;
   width: 410px;
   overflow: hidden;
}

.founder-message__image {
   display: block;
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center top;
}

/* CONSULTATION */

.consultation {
   background: #F8F8F8;
}

.consultation__inner {
   padding: clamp(20px, 3vw, 40px) clamp(20px, 3vw, 40px);
   background: var(--white-color);
   overflow: hidden;
}

.consultation__title {
   max-width: 760px;
}

.consultation__body {
   display: grid;
   grid-template-columns: minmax(320px, 0.42fr) minmax(420px, 0.58fr);
   gap: clamp(46px, 7vw, 110px);
   align-items: center;
   margin-top: clamp(34px, 5vw, 58px);
}

.consultation__media {
   min-width: 0;
}

.consultation__image-wrap {
   position: relative;
   max-width: 520px;
}

.consultation__image-wrap::before {
   content: "";
   position: absolute;
   left: 6%;
   top: 12%;
   width: 78%;
   height: 78%;
   border-radius: 50%;
   background: rgba(19, 200, 200, 0.16);
   filter: blur(34px);
   z-index: 0;
}

.consultation__image {
   position: relative;
   z-index: 1;
   display: block;
   width: 100%;
   height: auto;
}

.consultation__content {
   min-width: 0;
}

.consultation__text {
   max-width: 760px;
   margin: 0;
   color: var(--black-color);
   font-size: var(--fs-18);
   line-height: 1.55;
}

.consultation__form {
   display: grid;
   gap: 22px;
   max-width: 780px;
   margin-top: clamp(38px, 5vw, 64px);
}

.consultation__field {
   display: grid;
   gap: 4px;
}

.consultation__label {
   color: var(--gray-color);
   font-size: var(--fs-16);
   line-height: 1.3;
}

.consultation__input {
   width: 100%;
   height: 44px;
   padding: 0;
   border: 0;
   border-bottom: 1px solid rgba(50, 50, 50, 0.34);
   border-radius: 0;
   background: transparent;
   color: var(--black-color);
   font-size: var(--fs-18);
   outline: none;
   transition: border-color var(--transition), box-shadow var(--transition);
}

.consultation__input:focus {
   border-color: var(--turquoise-color);
   box-shadow: 0 6px 0 -5px rgba(34, 138, 138, 0.45);
}

.consultation__button {
   justify-self: start;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-height: 58px;
   margin-top: 4px;
   padding: 0 34px;
   border: 0;
   border-radius: var(--border-radius);
   background: var(--turquoise-gardient);
   color: var(--white-color);
   font-size: var(--fs-18);
   font-weight: 400;
   line-height: 1;
   transition:
      transform var(--transition),
      box-shadow var(--transition);
}

.consultation__button:hover {
   transform: translateY(-2px);
   box-shadow: 0 16px 30px rgba(34, 138, 138, 0.25);
}

.consultation__policy {
   display: grid;
   grid-template-columns: 18px minmax(0, 1fr);
   gap: 12px;
   align-items: start;
   max-width: 720px;
   cursor: pointer;
}

.consultation__checkbox {
   position: absolute;
   opacity: 0;
   pointer-events: none;
}

.consultation__checkbox-view {
   position: relative;
   display: block;
   width: 18px;
   height: 18px;
   margin-top: 2px;
   border: 1px solid rgba(50, 50, 50, 0.22);
   background: var(--white-color);
   transition:
      background var(--transition),
      border-color var(--transition);
}

.consultation__checkbox-view::after {
   content: "";
   position: absolute;
   left: 5px;
   top: 2px;
   width: 5px;
   height: 9px;
   border-right: 2px solid var(--white-color);
   border-bottom: 2px solid var(--white-color);
   opacity: 0;
   transform: rotate(45deg);
}

.consultation__checkbox:checked+.consultation__checkbox-view {
   border-color: var(--turquoise-color);
   background: var(--turquoise-color);
}

.consultation__checkbox:checked+.consultation__checkbox-view::after {
   opacity: 1;
}

.consultation__policy-text {
   color: var(--gray-color);
   font-size: var(--fs-14);
   line-height: 1.45;
}

/* FAQ */

.faq__list {
   display: grid;
   gap: 0;
}

.faq__item {
   border-bottom: 1px solid rgba(50, 50, 50, 0.22);
}

.faq__item:first-child {
   border-top: 0;
}

.faq__question {
   display: grid;
   grid-template-columns: minmax(0, 1fr) 48px;
   align-items: center;
   gap: 24px;
   width: 100%;
   min-height: 74px;
   padding: 18px 0;
   border: 0;
   background: transparent;
   color: var(--black-color);
   text-align: left;
   cursor: pointer;
}

.faq__question span:first-child {
   font-size: var(--fs-20);
   font-weight: 700;
   line-height: 1.35;
}

.faq__icon {
   position: relative;
   justify-self: end;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 46px;
   height: 46px;
   border-radius: 50%;
   background: var(--turquoise-gardient);
   color: var(--white-color);
   flex: 0 0 auto;
   transition:
      transform var(--transition),
      background var(--transition),
      box-shadow var(--transition);
}

.faq__icon::before,
.faq__icon::after {
   content: "";
   position: absolute;
   width: 15px;
   height: 2px;
   border-radius: 10px;
   background: currentColor;
   transition: transform var(--transition), opacity var(--transition);
}

.faq__icon::after {
   transform: rotate(90deg);
}

.faq__question:hover .faq__icon {
   box-shadow: 0 10px 22px rgba(34, 138, 138, 0.24);
}

.faq__item.is-active .faq__icon {
   transform: rotate(180deg);
}

.faq__item.is-active .faq__icon::after {
   opacity: 0;
   transform: rotate(90deg) scaleX(0);
}

.faq__answer {
   max-height: 0;
   overflow: hidden;
   opacity: 0;
   transition:
      max-height 0.36s ease,
      opacity 0.25s ease;
}

.faq__item.is-active .faq__answer {
   opacity: 1;
}

.faq__answer-inner {
   max-width: 820px;
   padding: 0 72px 24px 0;
}

.faq__answer-inner p {
   margin: 0;
   color: var(--gray-color);
   font-size: var(--fs-16);
   line-height: 1.65;
}

/* BREADCRUMBS */

.breadcrumbs-section {
   padding: clamp(24px, 3vw, 42px) 0;
   background: #F8F8F8;
}

.breadcrumbs {
   width: 100%;
}

.breadcrumbs__list {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 8px;
   margin: 0;
   padding: 0;
   list-style: none;
}

.breadcrumbs__item {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   color: var(--gray-color);
   font-size: var(--fs-14);
   font-weight: 600;
   line-height: 1.25;
}

.breadcrumbs__item:not(:last-child)::after {
   content: "/";
   color: var(--gray-color);
   font-weight: 500;
}

.breadcrumbs__link {
   color: var(--black-color);
   transition: color var(--transition);
}

.breadcrumbs__link:hover {
   color: var(--turquoise-color);
}

.breadcrumbs__current {
   color: var(--gray-color);
}

/* FOOTER */

.footer {
   padding: clamp(46px, 6vw, 78px) 0 26px;
   background: var(--white-color);
   border-top: 1px solid rgba(50, 50, 50, 0.08);
}

.footer__main {
   display: grid;
   grid-template-columns: minmax(260px, 1.25fr) minmax(150px, 0.7fr) minmax(260px, 0.95fr) minmax(230px, 0.75fr);
   gap: clamp(34px, 6vw, 86px);
   align-items: start;
}

.footer__brand {
   min-width: 0;
}

.footer__logo {
   display: inline-flex;
   align-items: center;
   width: fit-content;
}

.footer__logo img {
   display: block;
   width: 100%;
   max-width: 330px;
   height: auto;
}

.footer__description {
   max-width: 330px;
   margin: 12px 0 0;
   color: var(--black-color);
   font-family: var(--family-cormorant);
   font-size: var(--fs-18);
   line-height: 1.35;
   font-weight: 600;
}

.footer__socials {
   display: flex;
   align-items: center;
   gap: 12px;
   margin-top: 42px;
}

.footer__social {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 54px;
   height: 54px;
   border: 1px solid rgba(34, 138, 138, 0.24);
   border-radius: 50%;
   background: rgba(34, 138, 138, 0.05);
   transition:
      background var(--transition),
      border-color var(--transition),
      transform var(--transition),
      box-shadow var(--transition);
}

.footer__social img {
   display: block;
   width: 22px;
   height: 22px;
   object-fit: contain;
}

.footer__social:hover {
   background: var(--turquoise-color);
   border-color: var(--turquoise-color);
   transform: translateY(-2px);
   box-shadow: 0 12px 24px rgba(34, 138, 138, 0.22);
}

.footer__social:hover img {
   filter: brightness(0) invert(1);
}

.footer__nav,
.footer__services {
   display: grid;
   gap: 17px;
}

.footer__nav-link {
   width: fit-content;
   font-family: var(--family-cormorant);
   font-size: var(--fs-20);
   line-height: 1.15;
   text-transform: uppercase;
   color: var(--black-color);
   transition: color var(--transition), transform var(--transition);
   font-weight: 600;
}

.footer__service-link {
   width: fit-content;
   color: var(--black-color);
   font-family: var(--family-cormorant);
   font-size: var(--fs-20);
   line-height: 1.25;
   transition: color var(--transition), transform var(--transition);
   font-weight: 600;
}

.footer__nav-link:hover,
.footer__service-link:hover {
   color: var(--turquoise-color);
   transform: translateX(3px);
}

.footer__contacts {
   display: grid;
   gap: 28px;
}

.footer__contacts-title {
   margin: 0;
   font-family: var(--family-cormorant);
   font-size: var(--fs-20);
   line-height: 1.2;
   color: var(--black-color);
}

.footer__contact-group {
   display: grid;
   gap: 10px;
}

.footer__contact-label {
   margin: 0;
   color: var(--gray-color);
   font-family: var(--family-cormorant);
   font-size: var(--fs-18);
   line-height: 1.2;
   font-weight: 600;
}

.footer__dropdown-wrapper {
   position: relative;
   width: fit-content;
}

.footer__phone,
.footer__email {
   display: inline-flex;
   align-items: center;
   gap: 9px;
   border: 0;
   background: transparent;
   color: var(--black-color);
   font-size: var(--fs-16);
   line-height: 1;
}

.footer__phone {
   padding: 0;
}

.footer__email img,
.footer__flag {
   display: block;
   width: 20px;
   height: 20px;
   object-fit: contain;
   flex: 0 0 auto;
}

.footer__email {
   transition: color var(--transition);
}

.footer__email:hover {
   color: var(--turquoise-color);
}

.footer__arrow {
   width: 7px;
   height: 7px;
   border-right: 1.5px solid currentColor;
   border-bottom: 1.5px solid currentColor;
   transform: rotate(45deg) translateY(-2px);
   transition: transform var(--transition);
}

.footer__dropdown-wrapper.is-active .footer__arrow {
   transform: rotate(225deg) translateY(-1px);
}

.footer__dropdown {
   position: absolute;
   left: 0;
   top: calc(100% + 12px);
   z-index: 20;
   min-width: 230px;
   padding: 8px;
   border-radius: calc(var(--border-radius) * 2);
   background: var(--white-color);
   box-shadow: var(--shadow);
   opacity: 0;
   visibility: hidden;
   transform: translateY(8px);
   transition:
      opacity var(--transition),
      visibility var(--transition),
      transform var(--transition);
}

.footer__dropdown-wrapper.is-active .footer__dropdown {
   opacity: 1;
   visibility: visible;
   transform: translateY(0);
}

.footer__dropdown-link {
   display: flex;
   align-items: center;
   gap: 10px;
   min-height: 38px;
   padding: 8px 10px;
   border-radius: var(--border-radius);
   color: var(--black-color);
   font-size: var(--fs-14);
   transition:
      background var(--transition),
      color var(--transition);
}

.footer__dropdown-link:hover {
   color: var(--turquoise-color);
   background: rgba(34, 138, 138, 0.08);
}

.footer__bottom {
   display: grid;
   grid-template-columns: 1fr auto 1fr;
   gap: 28px;
   align-items: center;
   margin-top: clamp(42px, 5vw, 62px);
   padding-top: 20px;
   border-top: 1px solid rgba(50, 50, 50, 0.18);
}

.footer__copy {
   margin: 0;
   color: var(--gray-color);
   font-size: var(--fs-14);
   line-height: 1.3;
   text-transform: uppercase;
}

.footer__docs {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: clamp(22px, 4vw, 42px);
}

.footer__docs a,
.footer__developer {
   color: var(--gray-color);
   font-size: var(--fs-14);
   line-height: 1.3;
   transition: color var(--transition);
}

.footer__docs a:hover,
.footer__developer:hover {
   color: var(--turquoise-color);
}

.footer__developer {
   justify-self: end;
   padding: 0;
   border: 0;
   background: transparent;
}

/* DEVELOPER MODAL */

.developer-modal {
   position: fixed;
   inset: 0;
   z-index: 800;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 20px;
   opacity: 0;
   visibility: hidden;
   transition:
      opacity var(--transition),
      visibility var(--transition);
}

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

.developer-modal__overlay {
   position: absolute;
   inset: 0;
   background: rgba(20, 20, 20, 0.58);
   backdrop-filter: blur(5px);
}

.developer-modal__window {
   position: relative;
   z-index: 1;
   width: min(100%, 560px);
   max-height: calc(100vh - 40px);
   overflow-y: auto;
   padding: clamp(28px, 4vw, 44px);
   border-radius: 18px;
   background: var(--white-color);
   box-shadow: var(--shadow);
   transform: translateY(18px) scale(0.98);
   transition: transform var(--transition);
}

.developer-modal.is-active .developer-modal__window {
   transform: translateY(0) scale(1);
}

.developer-modal__close {
   position: absolute;
   top: 18px;
   right: 18px;
   width: 36px;
   height: 36px;
   border: 0;
   border-radius: 50%;
   background: rgba(50, 50, 50, 0.06);
}

.developer-modal__close::before,
.developer-modal__close::after {
   content: "";
   position: absolute;
   top: 17px;
   left: 9px;
   width: 18px;
   height: 2px;
   border-radius: 10px;
   background: var(--black-color);
}

.developer-modal__close::before {
   transform: rotate(45deg);
}

.developer-modal__close::after {
   transform: rotate(-45deg);
}

.developer-modal__label {
   margin: 0 0 10px;
   color: var(--orange-color);
   font-size: var(--fs-14);
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: 0.08em;
}

.developer-modal__title {
   max-width: 440px;
   margin: 0;
   font-family: var(--family-cormorant);
   font-size: var(--h4);
   line-height: 1.12;
   font-weight: 500;
   color: var(--black-color);
}

.developer-modal__text {
   max-width: 470px;
   margin: 16px 0 0;
   color: var(--gray-color);
   font-size: var(--fs-16);
   line-height: 1.55;
}

.developer-modal__info {
   display: grid;
   gap: 12px;
   margin-top: 28px;
   padding: 18px;
   border-radius: calc(var(--border-radius) * 2);
   background: #F8F8F8;
}

.developer-modal__row {
   display: grid;
   grid-template-columns: 120px minmax(0, 1fr);
   gap: 14px;
   align-items: start;
}

.developer-modal__row span {
   color: var(--gray-color);
   font-size: var(--fs-14);
}

.developer-modal__row strong,
.developer-modal__row a {
   color: var(--black-color);
   font-size: var(--fs-14);
   font-weight: 700;
   line-height: 1.35;
}

.developer-modal__row a {
   transition: color var(--transition);
}

.developer-modal__row a:hover {
   color: var(--turquoise-color);
}

.developer-modal__button {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-height: 50px;
   margin-top: 24px;
   padding: 0 24px;
   border-radius: var(--border-radius);
   background: var(--turquoise-gardient);
   color: var(--white-color);
   font-size: var(--fs-16);
   font-weight: 700;
   transition:
      transform var(--transition),
      box-shadow var(--transition);
}

.developer-modal__button:hover {
   transform: translateY(-1px);
   box-shadow: 0 12px 26px rgba(34, 138, 138, 0.25);
}

/* OBJECTS BLOCK */

.objects-block {
   width: 100%;
   margin-top: 40px;
}

.objects-block__grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 34px 28px;
}

.objects-block__bottom {
   display: flex;
   justify-content: center;
   margin-top: clamp(34px, 4vw, 54px);
}

.objects-block__button {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   min-height: 50px;
   padding: 0 26px;
   border-radius: var(--border-radius);
   background: var(--black-color);
   color: var(--white-color);
   font-size: var(--fs-16);
   font-weight: 400;
   transition:
      background var(--transition),
      transform var(--transition),
      box-shadow var(--transition);
}

.objects-block__button img {
   display: block;
   width: 18px;
   height: 18px;
   object-fit: contain;
   flex: 0 0 auto;
}

.objects-block__button:hover {
   background: var(--turquoise-color);
   transform: translateY(-1px);
   box-shadow: 0 12px 26px rgba(34, 138, 138, 0.25);
}

/* Adaptive */

@media (max-width: 1180px) {
   .header__main-container {
      gap: 22px;
   }

   .nav {
      gap: 16px;
   }

   .nav__link,
   .nav__catalog {
      font-size: var(--fs-14);
   }

   .dropdown__catalog-grid {
      gap: 28px;
   }

   .catalog-filter__grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
   }

   .catalog-filter__grid--more {
      padding-top: 20px;
   }

   .catalog-filter__body {
      padding: 26px 20px 22px;
   }

   .catalog-filter__actions {
      gap: 22px;
   }

   .founder-message__inner {
      min-height: 500px;
      padding-right: calc(360px + 44px);
   }

   .founder-message__image-wrap {
      top: -34px;
      width: 360px;
   }

   .consultation__inner {
      padding: 46px 36px;
   }

   .consultation__body {
      grid-template-columns: minmax(300px, 0.44fr) minmax(380px, 0.56fr);
      gap: 50px;
   }

   .consultation__text {
      font-size: var(--fs-16);
   }

   .footer__main {
      grid-template-columns: 1.2fr 0.7fr 0.9fr;
   }

   .footer__contacts {
      grid-column: 1 / -1;
      grid-template-columns: auto auto auto;
      align-items: start;
      gap: 34px;
   }

   .footer__contacts-title {
      grid-column: 1 / -1;
   }

   .objects-block__grid {
      gap: 26px 22px;
   }
}

@media (max-width: 1024px) {

   .header__top,
   .header__logo,
   .header__nav,
   .header__buttons {
      display: none;
   }

   .header__main-container {
      min-height: 66px;
   }

   .header__mobile {
      display: flex;
   }

   .container {
      padding: 0 16px;
   }
}

@media (max-width: 900px) {
   .catalog-filter__tabs {
      width: 100%;
   }

   .catalog-filter__tab {
      flex: 1 1 50%;
      justify-content: center;
      min-height: 48px;
      padding: 0 16px;
      font-size: var(--fs-16);
   }

   .catalog-filter__body {
      padding: 24px 18px 20px;
   }

   .catalog-filter__grid {
      grid-template-columns: 1fr 1fr;
      gap: 18px;
   }

   .catalog-filter__bottom {
      align-items: flex-start;
      flex-direction: column;
      gap: 18px;
   }

   .catalog-filter__actions {
      width: 100%;
      justify-content: space-between;
   }

   .catalog-filter__submit {
      min-width: 220px;
   }

   .section-header {
      display: flex;
      justify-content: flex-start;
      gap: 10px;
      margin-bottom: 30px;
      align-items: flex-start;
      flex-direction: column;
   }

   .section-header__text {
      max-width: 600px;
      width: 100%;
   }

   .mt-120 {
      margin-top: 80px;
   }

   .founder-message__inner {
      display: flex;
      flex-direction: column;
      min-height: 0;
      padding: 40px 28px 0;
   }

   .founder-message__content {
      max-width: 100%;
      padding-bottom: 36px;
   }

   .founder-message__image-wrap {
      position: relative;
      right: auto;
      top: auto;
      bottom: auto;
      width: min(100%, 440px);
      height: 500px;
      margin-top: 0;
      margin-left: auto;
      overflow: hidden;
   }

   .founder-message__image {
      height: 100%;
   }

   .consultation__body {
      grid-template-columns: 1fr;
      gap: 34px;
   }

   .consultation__image-wrap {
      width: min(100%, 420px);
      margin: 0 auto;
   }

   .consultation__form,
   .consultation__text {
      max-width: 100%;
   }

   .faq__question {
      grid-template-columns: minmax(0, 1fr) 42px;
      min-height: 68px;
      gap: 18px;
   }

   .faq__question span:first-child {
      font-size: var(--fs-18);
   }

   .faq__icon {
      width: 42px;
      height: 42px;
   }

   .faq__answer-inner {
      padding-right: 60px;
   }

   .footer__main {
      grid-template-columns: 1fr 1fr;
      gap: 38px;
   }

   .footer__brand {
      grid-column: 1 / -1;
   }

   .footer__logo img {
      max-width: 290px;
   }

   .footer__socials {
      margin-top: 28px;
   }

   .footer__contacts {
      grid-column: auto;
      grid-template-columns: 1fr;
   }

   .footer__bottom {
      grid-template-columns: 1fr;
      gap: 16px;
      text-align: center;
   }

   .footer__developer {
      justify-self: center;
   }

   .footer__docs {
      flex-wrap: wrap;
      gap: 14px 24px;
   }

   .objects-block__grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
   }
}

@media (max-width: 768px) {
   .catalog-filter__body {
      padding: 22px 16px 18px;
   }

   .catalog-filter__grid {
      grid-template-columns: 1fr;
      gap: 16px;
   }

   .catalog-filter__grid--more {
      padding-top: 18px;
   }

   .catalog-filter__field {
      gap: 8px;
   }

   .catalog-filter__select,
   .catalog-filter__input {
      height: 48px;
   }

   .catalog-filter__bottom {
      margin-top: 22px;
   }

   .catalog-filter__more-button {
      justify-content: center;
      width: 100%;
      min-height: 48px;
      padding: 0 16px;
      border: 1px solid rgba(50, 50, 50, 0.12);
      border-radius: var(--border-radius);
      background: #F8F8F8;
   }

   .catalog-filter__actions {
      flex-direction: column;
      align-items: stretch;
      gap: 12px;
   }

   .catalog-filter__submit,
   .catalog-filter__clear {
      width: 100%;
   }

   .catalog-filter__submit {
      order: 1;
      min-width: 0;
      min-height: 50px;
   }

   .catalog-filter__clear {
      order: 2;
      justify-content: center;
      min-height: 46px;
      padding: 0 16px;
      border: 1px solid rgba(50, 50, 50, 0.12);
      border-radius: var(--border-radius);
   }

   h2 br {
      display: none;
   }
}

@media (max-width: 640px) {
   .container {
      padding: 0 14px;
   }

   .header__mobile-logo img {
      max-width: 135px;
   }

   .header__mobile-phone {
      font-size: 12px;
      padding: 5px 7px;
   }

   .header__mobile-language span:last-child {
      display: none;
   }

   .header__dropdown-wrapper--mobile-lang .dropdown {
      right: -6px;
   }

   .modal {
      padding: 14px;
      align-items: center;
      justify-content: center;
   }

   .modal__window {
      width: 100%;
      max-width: 420px;
      max-height: calc(100vh - 28px);
      padding: 26px 18px;
      border-radius: 18px;
   }

   .search-form__row {
      grid-template-columns: 1fr;
   }

   .search-form__result {
      max-height: min(360px, 46vh);
   }

   .search-result-card {
      grid-template-columns: 54px minmax(0, 1fr);
      min-height: 70px;
      padding: 8px 10px;
   }

   .search-result-card__image {
      width: 54px;
      height: 52px;
   }

   .search-result-card__price {
      display: none;
   }

   .mobile-menu__panel {
      width: 100%;
   }

   .mobile-menu__logo img {
      max-width: 145px;
   }

   .catalog-filter__tabs {
      align-items: stretch;
   }

   .catalog-filter__tab {
      min-height: 46px;
      font-size: var(--fs-16);
   }

   .catalog-filter__body {
      padding: 20px 14px 18px;
   }

   .catalog-filter__price {
      grid-template-columns: 1fr 1fr;
      gap: 8px;
   }

   .catalog-filter__label {
      font-size: var(--fs-14);
   }

   .catalog-filter__select,
   .catalog-filter__input {
      height: 46px;
      font-size: var(--fs-14);
   }

   .catalog-filter__select {
      padding-right: 36px;
      background-position:
         calc(100% - 16px) 19px,
         calc(100% - 11px) 19px;
   }

   .founder-message__inner {
      padding: 30px 18px 0;
   }

   .founder-message__text {
      margin-top: 28px;
      font-size: var(--fs-14);
      line-height: 1.55;
   }

   .founder-message__signature {
      margin-top: 28px;
      font-size: var(--fs-14);
   }

   .founder-message__image-wrap {
      width: 100%;
      height: 420px;
   }

   .consultation__inner {
      padding: 30px 18px;
   }

   .consultation__body {
      margin-top: 28px;
      gap: 30px;
   }

   .consultation__image-wrap {
      width: min(100%, 360px);
   }

   .consultation__form {
      gap: 18px;
      margin-top: 30px;
   }

   .consultation__input {
      height: 42px;
      font-size: var(--fs-16);
   }

   .consultation__button {
      width: 100%;
      min-height: 52px;
      padding: 0 22px;
      font-size: var(--fs-16);
   }

   .consultation__policy {
      gap: 10px;
   }

   .consultation__policy-text {
      font-size: 12px;
   }

   .faq__question {
      grid-template-columns: minmax(0, 1fr) 38px;
      min-height: 62px;
      gap: 14px;
      padding: 15px 0;
   }

   .faq__question span:first-child {
      font-size: var(--fs-16);
      line-height: 1.4;
   }

   .faq__icon {
      width: 38px;
      height: 38px;
   }

   .faq__icon::before,
   .faq__icon::after {
      width: 13px;
   }

   .faq__answer-inner {
      padding: 0 52px 20px 0;
   }

   .faq__answer-inner p {
      font-size: var(--fs-14);
      line-height: 1.55;
   }

   .breadcrumbs-section {
      padding: 22px 0;
   }

   .breadcrumbs {
      overflow-x: auto;
      overflow-y: hidden;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
   }

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

   .breadcrumbs__list {
      flex-wrap: nowrap;
      gap: 6px;
      min-width: max-content;
   }

   .breadcrumbs__item {
      flex: 0 0 auto;
      font-size: var(--fs-16);
      gap: 6px;
      white-space: nowrap;
   }

   .breadcrumbs__link,
   .breadcrumbs__current {
      white-space: nowrap;
   }

   .breadcrumbs {
      position: relative;
      mask-image: linear-gradient(90deg,
            #000 0%,
            #000 calc(100% - 34px),
            transparent 100%);
   }

   .footer {
      padding-top: 38px;
   }

   .footer__main {
      display: flex;
      gap: 34px;
      flex-direction: column;
      align-content: center;
      justify-content: center;
      align-items: center;
      text-align: center;
   }

   .footer__socials {
      justify-content: center;
   }

   .footer__logo img {
      max-width: 240px;
   }

   .footer__description {
      margin-top: 18px;
      font-size: var(--fs-16);
   }

   .footer__socials {
      gap: 10px;
   }

   .footer__social {
      width: 48px;
      height: 48px;
   }

   .footer__nav,
   .footer__services {
      gap: 13px;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
   }

   .footer__contacts {
      gap: 22px;
   }

   .footer__bottom {
      margin-top: 36px;
   }

   .footer__dropdown {
      min-width: 220px;
   }

   .objects-block__grid {
      grid-template-columns: 1fr;
      gap: 22px;
   }

   .objects-block__button {
      width: 100%;
   }

}

@media (max-width: 480px) {
   .catalog-filter__tab {
      min-height: 44px;
      padding: 0 12px;
   }

   .catalog-filter__body {
      padding: 18px 14px 16px;
   }

   .catalog-filter__grid {
      gap: 14px;
   }

   .catalog-filter__price {
      grid-template-columns: 1fr;
   }

   .catalog-filter__more-button,
   .catalog-filter__clear,
   .catalog-filter__submit {
      min-height: 48px;
   }

   .catalog-filter__more-button,
   .catalog-filter__clear {
      font-size: var(--fs-14);
   }

   .catalog-filter__submit {
      padding: 0 18px;
      font-size: var(--fs-14);
   }

   .founder-message__inner {
      padding: 26px 14px 0;
   }

   .founder-message__image-wrap {
      height: 360px;
   }

   .consultation__inner {
      padding: 26px 14px;
   }

   .consultation__image-wrap {
      width: 100%;
   }

   .faq__question {
      grid-template-columns: minmax(0, 1fr) 34px;
   }

   .faq__icon {
      width: 34px;
      height: 34px;
   }

   .faq__answer-inner {
      padding-right: 0;
   }
}


.favorite-heart { display:inline-grid; place-items:center; width:20px; height:20px; flex:0 0 20px; color:currentColor; }
.favorite-heart__icon { display:block; width:100%; height:100%; overflow:visible; }
.favorite-heart__shape { fill:transparent; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; transform-origin:center; transition:fill .2s ease, stroke .2s ease, transform .2s ease; }
.js-favorite-toggle:hover .favorite-heart__shape { transform:scale(1.06); }
.js-favorite-toggle.is-active .favorite-heart__shape,
[data-favorites-link].has-favorites .favorite-heart__shape { fill:currentColor; stroke:currentColor; }

.header__icon-button[href="/favorites"] { position:relative; }
.header__icon-button[data-favorites-link] .favorite-heart { width:22px; height:22px; flex-basis:22px; }
.header__icon-button[data-favorites-link].has-favorites { color:var(--orange-color); }
.header__favorites-count { position:absolute; top:-5px; right:-5px; min-width:20px; height:20px; padding:0 5px; border:2px solid var(--white-color); border-radius:999px; background:var(--orange-color); color:var(--white-color); font-size:11px; font-weight:700; line-height:16px; text-align:center; }
.header__favorites-count[hidden] { display:none !important; }