@charset "UTF-8";
html, body {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 10px;
  background: #FFFFFF;
  color: #000000;
  scroll-behavior: smooth;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
@media only screen and (max-width: 1600px) {
  html, body {
    font-size: 8.2px;
  }
}

*, *:before, *:after {
  box-sizing: inherit;
}

h1 {
  font-size: 6.4rem;
  line-height: 7.6rem;
  font-weight: 700;
  margin: 0;
}
@media only screen and (max-width: 1600px) {
  h1 {
    font-size: 5.6rem;
    line-height: 6.8rem;
  }
}
@media only screen and (max-width: 768px) {
  h1 {
    font-size: 4.4rem;
    line-height: 5.2rem;
  }
}
@media only screen and (max-width: 576px) {
  h1 {
    font-size: 3.5rem;
    line-height: 4rem;
  }
}
h1 {
  color: #475531;
}

h2 {
  font-size: 4.8rem;
  line-height: 5.8rem;
}
@media only screen and (max-width: 768px) {
  h2 {
    font-size: 3.2rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 576px) {
  h2 {
    font-size: 2.7rem;
    line-height: 3.8rem;
  }
}
h2 {
  font-weight: 600;
  color: #000000;
  margin: 0;
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  h2 {
    margin-bottom: 3rem;
  }
}
h2 span {
  display: inline-block;
  position: relative;
}
h2 span::before {
  width: 100%;
  position: absolute;
  height: 1px;
  background: #4EA915;
  display: block;
  bottom: -1rem;
  content: "";
}
@media only screen and (max-width: 576px) {
  h2 span::before {
    bottom: 0;
  }
}

h3 {
  font-weight: 600;
  margin: 0 0 2rem;
  font-size: 2rem;
  line-height: 2.4rem;
}

.text-center {
  text-align: center;
}

a {
  color: #313622;
  text-decoration-thickness: 1px;
}
a:hover {
  text-decoration: none;
}

p {
  margin: 2.5rem 0;
}

.page-wrapper {
  color: #000000;
  font-size: 1.6rem;
  line-height: 2.4rem;
  font-weight: 400;
}

.container {
  width: 100%;
  max-width: 133rem;
  padding: 0 2rem;
  margin: 0 auto;
}

.intro {
  width: 100%;
  max-width: 78rem;
  margin: 2rem 0 6rem;
}
@media only screen and (max-width: 576px) {
  .intro {
    margin-bottom: 3rem;
  }
}
.intro.text-center {
  margin: 2rem auto 6rem;
}
@media only screen and (max-width: 576px) {
  .intro.text-center {
    margin-bottom: 3rem;
  }
}

.btn {
  padding: 1.8rem 4rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  background: linear-gradient(to bottom, #475531 0%, #1C2D00 100%);
  color: #FFFFFF;
  border-radius: 2.5rem;
  border: none;
  cursor: pointer;
  font-size: 2rem;
  line-height: 2.4rem;
  box-sizing: border-box;
  font-family: "Montserrat", sans-serif;
  transition: background 0.4s ease-in-out, transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
@media only screen and (max-width: 1024px) {
  .btn {
    padding: 1.5rem 3rem;
  }
}
@media only screen and (max-width: 576px) {
  .btn {
    font-size: 1.8rem;
  }
}
.btn:hover {
  background: linear-gradient(to bottom, #1C2D00 0%, #475531 100%);
  transform: scale(1.01);
}
.btn__popup {
  width: 100%;
}
.btn__white {
  background: #FFFFFF;
  color: #313622;
  font-weight: 600;
}
.btn__white:hover {
  background: rgba(255, 255, 255, 0.8);
}
.btn__card {
  padding: 1rem 2.3rem;
  border-radius: 1.5rem;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media only screen and (max-width: 576px) {
  .btn__card {
    padding: 1rem 1.4rem;
  }
}
.btn__benefits {
  margin-top: 3rem;
}
@media only screen and (max-width: 576px) {
  .btn__benefits {
    margin-top: 20rem;
  }
}
.btn__happy-homes {
  width: 100%;
  max-width: 40rem;
}
.btn__white-border {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
  border: 1px solid #475531;
  color: #313622;
  text-decoration: none;
}
.btn__white-border img {
  margin-right: 1rem;
  display: inline-block;
}
.btn__white-border:hover {
  background: rgba(214, 223, 233, 0.2);
}
.btn__footer {
  background: #AEC3A0;
  color: #313622;
}
.btn__footer:hover {
  background: rgba(174, 195, 160, 0.8);
}
.btn__map-link {
  padding: 1.8rem 0;
  border-radius: 2rem;
  text-align: center;
  text-decoration: none;
  font-size: 1.6rem;
  line-height: 2.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn__map-link img {
  margin-right: 1rem;
}
.btn__tooltip {
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding: 1.1rem 2.5rem;
  text-decoration: none;
}
.btn__card-project {
  background: #63432E;
  width: 100%;
}
.btn__card-project:hover {
  background: #281914;
}

.header {
  position: fixed;
  width: 100%;
  height: 12rem;
  top: 0;
  left: 0;
  backdrop-filter: blur(1.5rem);
  background: rgba(255, 255, 255, 0.8);
  z-index: 1000;
}
@media only screen and (max-width: 768px) {
  .header {
    height: 8rem;
  }
}
.header__container {
  max-width: 186rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}
@media only screen and (max-width: 768px) {
  .header__logo img {
    width: 55%;
  }
}
@media only screen and (max-width: 1024px) {
  .header__nav {
    display: none;
  }
}
.header__menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 3rem;
  font-size: 2rem;
  color: #313622;
}
@media only screen and (max-width: 1280px) {
  .header__menu {
    gap: 2rem;
  }
}
.header__menu-item {
  position: relative;
  padding: 1.5rem 0;
}
.header__menu-link {
  text-decoration: none;
}
.header__menu-link::after {
  content: "";
  position: absolute;
  top: 75%;
  left: 0;
  width: 0;
  height: 1px;
  background-color: #AEC3A0;
  transition: width 0.3s ease-in-out;
}
.header__menu-link:hover::after {
  width: 100%;
}
.header__menu-item--has-submenu__menu-link::after {
  display: none;
}
.header__menu-item--has-submenu::after {
  content: "";
  width: 1rem;
  height: 1rem;
  background-image: url(../img/icons/arrow_menu.svg);
  background-size: cover;
  display: inline-block;
  margin-left: 1rem;
  position: static;
}
.header__submenu {
  position: absolute;
  top: calc(100% - 0.2rem);
  left: 0;
  background-color: #FFFFFF;
  padding: 1rem 0;
  border-radius: 0 1.5rem 1.5rem 1.5rem;
  box-shadow: 0 0.4rem 0.4rem rgba(71, 85, 49, 0.25);
  width: 34rem;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all 0.3s ease;
  z-index: 1001;
  border: 1px solid #AEC3A0;
}
.header__menu-item--has-submenu:hover .header__submenu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.header__submenu-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.header__submenu-item {
  padding: 1rem 2rem;
  margin: 0;
  border-bottom: 1px solid #F5F5F5;
}
.header__submenu-item:last-child {
  border-bottom: none;
}
.header__submenu-link {
  text-decoration: none;
  display: block;
  transition: transform 0.3s ease, color 0.3s ease;
}
.header__submenu-link:hover {
  transform: translateX(0.3rem);
  color: #313622;
}
.header__phone-icon {
  width: 3.4rem;
  height: 3.4rem;
  background-image: url(../img/icons/icon-tel.svg);
  display: none;
  background-size: contain;
  background-repeat: no-repeat;
  ransition: all 0.3s ease;
}
@media only screen and (max-width: 1280px) {
  .header__phone-icon {
    display: block;
  }
}
.header__actions {
  display: flex;
  align-items: center;
  gap: 1.4rem;
}
.header__action-btn {
  cursor: pointer;
  width: 3.4rem;
  height: 3rem;
  border: none;
  background-size: contain;
  background-repeat: no-repeat;
  transition: all 0.3s ease;
  background-color: transparent;
}
.header__action-btn--search {
  background-image: url(../img/icons/icon_search-green.svg);
}
@media only screen and (max-width: 1280px) {
  .header__action-btn--search {
    background-image: url(../img/icons/icon_search-green-think.svg);
  }
}
@media only screen and (max-width: 1024px) {
  .header__action-btn--search {
    margin-right: 3rem;
  }
}
.header__action-btn--socials {
  width: 3rem;
  background-image: url(../img/icons/icon_list-social.svg);
  position: relative;
  z-index: 3;
  margin-left: 0.2rem;
}
@media only screen and (max-width: 1280px) {
  .header__action-btn--socials {
    background-image: url(../img/icons/icon_list-social-think.svg);
  }
}
.header__socials-toggle {
  position: relative;
  display: inline-block;
}
@media only screen and (max-width: 1024px) {
  .header__socials-toggle {
    display: none;
  }
}
.header__socials-list {
  position: absolute;
  z-index: 1;
  top: -1.2rem;
  left: -1.2rem;
  background-color: #FFFFFF;
  padding: 5.5rem 1.2rem 1.2rem;
  border-radius: 1.3rem;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  opacity: 0;
  visibility: hidden;
  list-style: none;
  margin: 0;
  border: 1px solid #AEC3A0;
  box-shadow: 0 0 4px 0 rgba(71, 85, 49, 0.25);
  text-align: center;
  transform: translateY(0.5rem);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.header__socials-item {
  padding-top: 1.2rem;
}
.header__phone-time {
  padding-left: 3rem;
  display: flex;
  flex-direction: column;
}
@media only screen and (max-width: 1280px) {
  .header__phone-time {
    display: none;
  }
}
.header__phone-time span {
  color: #475531;
}
.header__phone {
  font-weight: 700;
  font-size: 2.4rem;
  text-decoration: none;
}
.header__cta {
  margin-left: 3rem;
}
@media only screen and (max-width: 1280px) {
  .header__cta {
    margin-left: 0;
  }
}
@media only screen and (max-width: 1024px) {
  .header__cta {
    display: none;
  }
}

.header__socials-toggle:hover .header__socials-list {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.hero {
  margin-top: 12rem;
  height: 87.6rem;
  width: 100%;
  position: relative;
  top: 0;
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .hero {
    margin-bottom: 6rem;
  }
}
@media only screen and (max-width: 1024px) {
  .hero {
    height: 70rem;
  }
}
@media only screen and (max-width: 768px) {
  .hero {
    height: 55rem;
    margin-top: 8rem;
  }
}
.hero__slide {
  width: 100%;
  height: 100%;
  position: relative;
}
.hero__image-wrapper {
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-align: center;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.hero__image {
  height: 100%;
  width: auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.hero__content {
  width: 100%;
  max-width: 186rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  justify-content: flex-end;
  height: 100%;
  position: relative;
  z-index: 2;
  margin: 0 auto;
  padding: 0 2rem;
}
.hero__title {
  color: #FFFFFF;
  text-shadow: 0 0.4rem 0.4rem rgba(0, 0, 0, 0.5);
  position: relative;
  max-width: 99rem;
  margin-bottom: 2.2rem;
  text-transform: uppercase;
}
@media only screen and (max-width: 768px) {
  .hero__title {
    max-width: 60rem;
  }
}
@media only screen and (max-width: 576px) {
  .hero__title {
    max-width: 31rem;
  }
}
.hero__subtitle {
  width: 100%;
  max-width: 72.5rem;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(1.5rem);
  background: rgba(0, 0, 0, 0.35);
  color: #FFFFFF;
  font-size: 2rem;
  line-height: 2.4rem;
  border-radius: 2rem;
  padding: 2.4rem 4rem;
  margin-bottom: 2.2rem;
}
@media only screen and (max-width: 576px) {
  .hero__subtitle {
    max-width: 31rem;
    padding: 1rem;
    border-radius: 1rem;
  }
}
.hero__actions {
  margin-bottom: 7rem;
}
@media only screen and (max-width: 576px) {
  .hero__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
}
.hero__link {
  margin-left: 6rem;
  color: #FFFFFF;
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 600;
}
@media only screen and (max-width: 576px) {
  .hero__link {
    margin-left: 0;
    margin-top: 2rem;
  }
}
.hero__pagination {
  position: absolute;
  bottom: 4rem;
  z-index: 10;
}

.swiper-pagination-bullet {
  background: #D9D9D9;
  width: 1.3rem;
  height: 0.7rem;
  border-radius: 0.3rem;
  opacity: 1;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.5);
  transition: all 0.3s ease-in-out;
}

.swiper-pagination-bullet-active {
  background: #4EA915;
  width: 4rem;
  height: 0.7rem;
  border-radius: 0.3rem;
}

input[type=text],
input[type=tel],
input[type=email],
textarea {
  width: 100%;
  max-width: 86rem;
  color: #000000;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding: 1.1em 1.8rem;
  border-radius: 1rem;
  box-sizing: border-box;
  border: 1px solid #313622;
  font-family: "Montserrat", sans-serif;
}

input:placeholder,
textarea:placeholder {
  color: #656565;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 2.4rem;
}

label {
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-bottom: 1rem;
}

.checkbox {
  display: flex;
  align-items: flex-start;
  cursor: pointer;
  margin-bottom: 6.8rem;
}
.checkbox__label {
  margin-bottom: 1rem;
  display: flex;
}

.checkbox__input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  cursor: pointer;
}

.checkbox__text {
  margin-left: 1rem;
  display: inline-block;
}

.checkbox__label::before {
  content: "";
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  box-shadow: 0 0 0 1px #AEC3A0;
  border: 3px solid #FFFFFF;
  border-radius: 0;
  background-color: #FFFFFF;
  transition: all 0.2s ease;
  box-sizing: border-box;
  display: inline-block;
  vertical-align: top;
}

.checkbox__input:checked + .checkbox__label::before {
  background-color: #475531;
  border-color: #FFFFFF;
}

.popup__link {
  color: #4EA915;
  text-decoration-thickness: 1px;
}
button {
  font-family: "Montserrat", sans-serif;
}

/* Фикс авто-приближения экрана на iPhone при клике на поля */
@media only screen and (max-width: 768px) {
  input[type=text],
  input[type=tel],
  input[type=email],
  input[type=search],
  input[type=number],
  select,
  textarea {
    font-size: 16px !important;
  }
}
.footer {
  width: 100%;
  background: #475531;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .footer {
    padding-top: 3rem;
  }
}
.footer {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .footer {
    padding-bottom: 6rem;
  }
}
.footer__container {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
}
@media only screen and (max-width: 1024px) {
  .footer__container {
    flex-wrap: wrap;
  }
}
.footer__logo {
  color: #FFFFFF;
  font-size: 6.4rem;
  line-height: 7.6rem;
  font-weight: 700;
  margin: 0;
}
@media only screen and (max-width: 1600px) {
  .footer__logo {
    font-size: 5.6rem;
    line-height: 6.8rem;
  }
}
@media only screen and (max-width: 768px) {
  .footer__logo {
    font-size: 4.4rem;
    line-height: 5.2rem;
  }
}
@media only screen and (max-width: 576px) {
  .footer__logo {
    font-size: 3.5rem;
    line-height: 4rem;
  }
}
.footer__logo {
  text-decoration: none;
  margin-bottom: 4rem;
  display: block;
}
.footer__description {
  max-width: 30rem;
  color: #AEC3A0;
  margin-bottom: 2rem;
}
@media only screen and (max-width: 1024px) {
  .footer__description {
    max-width: inherit;
  }
}
.footer__copyright {
  color: #AEC3A0;
}
.footer__legal-link {
  color: #FBFCEE;
}
.footer__menu {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media only screen and (max-width: 768px) {
  .footer__menu {
    margin-bottom: 6rem;
  }
}
.footer__menu-item {
  width: calc(50% - 2rem);
  margin: 0;
  padding: 0;
}
.footer__menu-item a {
  color: #FBFCEE;
}
@media only screen and (max-width: 1024px) {
  .footer__col {
    width: calc(50% - 1rem);
  }
}
@media only screen and (max-width: 768px) {
  .footer__col {
    width: 100%;
  }
}
@media only screen and (max-width: 1024px) {
  .footer__col:first-child {
    width: 100%;
    margin-bottom: 7rem;
  }
}
.footer__col:last-child {
  text-align: right;
}
@media only screen and (max-width: 768px) {
  .footer__col:last-child {
    text-align: center;
  }
}
.footer__contacts {
  margin-bottom: 5rem;
  color: #AEC3A0;
}
.footer__phone {
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 600;
  color: #AEC3A0;
  display: block;
  margin-bottom: 0.2rem;
  text-decoration: none;
}
.footer__socials {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 1.4rem;
  margin-bottom: 5rem;
}
@media only screen and (max-width: 768px) {
  .footer__socials {
    justify-content: center;
  }
}

.navmob {
  display: none;
}
@media only screen and (max-width: 1024px) {
  .navmob {
    display: block;
  }
}
.navmob__toggle {
  display: none;
}
.navmob__button {
  height: 20px;
  width: 30px;
  position: absolute;
  top: 4.3rem;
  right: 2rem;
  z-index: 200;
  text-align: center;
  cursor: pointer;
}
@media only screen and (max-width: 768px) {
  .navmob__button {
    top: 2.4rem;
  }
}
.navmob a {
  color: #313622;
  text-decoration: none;
}
.navmob a:hover {
  text-decoration: underline;
}
.navmob__background {
  width: 2.3rem;
  height: 1.7rem;
  position: fixed;
  right: 1.7rem;
  top: 3rem;
  z-index: 100;
  background: #FFFFFF;
  opacity: 0;
  /* При закрытии: задержка .2s, чтобы сначала исчез текст, а затем сворачивался фон */
  transition: all 0.5s ease-in-out 0.2s;
}
.navmob__nav {
  height: 100vh;
  position: fixed;
  flex-direction: column;
  align-items: flex-end;
  top: 11rem;
  right: 0;
  z-index: 150;
  opacity: 0;
  width: 0;
  pointer-events: none;
  display: flex;
  border-top: 1px solid #D6DFE9;
  /* При закрытии: текст быстро исчезает за .2s без задержки */
  transition: all 0.2s ease-in-out;
}
@media only screen and (max-width: 768px) {
  .navmob__nav {
    top: 8rem;
  }
}
.navmob__menu {
  padding: 2.8rem 1.6rem 0;
  margin-bottom: 2rem;
  overflow-y: auto;
  height: -moz-fit-content;
  height: fit-content;
  max-height: calc(100vh - 25rem);
  scrollbar-width: none;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 45rem;
}
.navmob__menu ul {
  margin: 0 0 5rem;
  padding: 0;
  list-style: none;
}
.navmob__menu ul li {
  margin: 0 0 1rem;
  width: 100%;
}
.navmob__menu ul ul {
  margin-left: 0.5rem;
  padding-left: 1rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
  border-left: 1px solid #D9D9D9;
}
.navmob__menu ul ul li {
  margin-bottom: 0.8rem;
  border: none;
}
.navmob__menu ul ul ul {
  margin-left: 0;
  padding-left: 0;
  border: none;
}
.navmob__menu ul ul ul a {
  color: #475531;
}
.navmob__toggle:checked ~ .navmob__background {
  transform: scale(80);
  width: 100%;
  height: 100%;
  opacity: 1;
  top: 485rem;
  /* При открытии: фон разворачивается сразу за .4s без задержки */
  transition: all 0.4s ease-in-out;
}
@media only screen and (max-width: 768px) {
  .navmob__toggle:checked ~ .navmob__background {
    top: 324rem;
  }
}
.navmob__toggle:checked ~ .navmob__nav {
  width: 100%;
  opacity: 1;
  pointer-events: auto;
  /* При открытии: задержка .3s, чтобы текст появлялся после того, как раскрылся фон */
  transition: opacity 0.3s ease-in-out 0.3s, width 0.3s ease-in-out 0.3s;
}
.navmob__icon {
  position: relative;
  margin-top: 0;
  display: block;
}
.navmob__icon, .navmob__icon::before, .navmob__icon::after {
  width: 13px;
  height: 2px;
  border-radius: 0.2rem;
  display: inline-block;
  background: #475531;
}
.navmob__icon::before, .navmob__icon::after {
  content: "";
  position: absolute;
  left: 0;
  transition: all 0.2s;
}
.navmob__icon::before {
  top: -1rem;
  width: 23px;
}
.navmob__icon::after {
  top: 1rem;
  width: 20px;
}
.navmob__button:hover .navmob__icon::before {
  top: -1.3rem;
}
.navmob__button:hover .navmob__icon::after {
  top: 1.3rem;
}
.navmob__toggle:checked + .navmob__button .navmob__icon {
  background: transparent;
}
.navmob__toggle:checked + .navmob__button .navmob__icon::before {
  top: 0;
  transform: rotate(135deg);
}
.navmob__toggle:checked + .navmob__button .navmob__icon::after {
  top: 0;
  transform: rotate(-135deg);
  width: 23px;
}
.navmob__tel-time {
  width: 100%;
  max-width: 45rem;
  box-sizing: border-box;
  padding: 3rem 2rem;
  color: #475531;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.navmob__tel-time a {
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 700;
  color: #475531;
  margin-bottom: 0.6rem;
}
.navmob__soc {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  margin-bottom: 2.2rem;
}

.modals {
  position: fixed;
  top: -100%;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: block;
  background: rgba(35, 36, 38, 0.7);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.modals__active {
  opacity: 1;
  top: 0;
  visibility: visible;
  pointer-events: auto;
}

.popup {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 1;
  position: relative;
  visibility: visible;
  pointer-events: auto;
  z-index: 101;
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.popup__form {
  margin-left: 2rem;
}
@media only screen and (max-width: 1024px) {
  .popup__form {
    width: 80%;
  }
}
@media only screen and (max-width: 576px) {
  .popup__form {
    width: 60%;
  }
}
.popup__search {
  width: 100%;
  max-width: 130rem;
  top: 2.2rem;
  left: 50%;
  position: absolute;
  transform: translate(-50%, 0);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
@media only screen and (max-width: 768px) {
  .popup__search {
    top: 1rem;
  }
}
.popup__callback {
  width: 100%;
  max-width: 64rem;
  background-color: #FFFFFF;
  border-radius: 3rem;
  padding: 9rem 11rem 9rem 9rem;
  transform: translate(-50%, -50%);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
  position: absolute;
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
@media only screen and (max-width: 1024px) {
  .popup__callback {
    padding: 5rem 7rem 5rem 5rem;
  }
}
@media only screen and (max-width: 768px) {
  .popup__callback {
    margin: 0 1rem;
    left: calc(50% - 1rem);
    width: calc(100% - 2rem);
    padding: 4rem 3rem 4rem 2rem;
  }
}
.popup__close {
  background-size: contain;
  background-repeat: no-repeat;
  border: none;
  background-color: transparent;
  position: absolute;
  z-index: 10;
  cursor: pointer;
}
.popup__close:hover {
  transform: scale(1.1);
}
.popup__close-search {
  width: 4rem;
  height: 4rem;
  background-image: url(../img/icons/icon_close-white.svg);
  top: 1.6rem;
  left: 90rem;
}
@media only screen and (max-width: 1280px) {
  .popup__close-search {
    left: auto;
    right: 32.3rem;
  }
}
@media only screen and (max-width: 1024px) {
  .popup__close-search {
    right: 6rem;
  }
}
@media only screen and (max-width: 768px) {
  .popup__close-search {
    top: 1.1rem;
  }
}
.popup__close-callback {
  width: 3rem;
  height: 3rem;
  background-image: url(../img/icons/icon_close-color.svg);
  top: 3rem;
  right: 3rem;
}
.popup__search-suggestions {
  width: 100%;
  max-width: 86rem;
  padding: 0.5rem 2rem;
  border-radius: 1rem;
  background-color: #FFFFFF;
  margin-top: 1.7rem;
  max-height: 25rem;
  overflow-y: auto;
  display: none;
}
.overlay.is-active ~ .popup__search .popup__search-suggestions {
  display: block;
}
.popup__search-suggestion-item {
  width: 100%;
  border-top: 1px solid #F5F5F5;
  padding: 1rem 0;
  font-size: 1.6rem;
  line-height: 2.4rem;
  cursor: pointer;
}
.popup__search-suggestion-item:first-child {
  border-top: none;
}
.popup__title {
  font-size: 4.8rem;
  line-height: 5.8rem;
}
@media only screen and (max-width: 768px) {
  .popup__title {
    font-size: 3.2rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 576px) {
  .popup__title {
    font-size: 2.7rem;
    line-height: 3.8rem;
  }
}
.popup__title {
  color: #313622;
  margin-bottom: 1.6rem;
}
.popup__subtitle {
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-bottom: 4rem;
}
.popup__form-group {
  margin-bottom: 2.7rem;
}
.popup__video {
  width: 100%;
  max-width: 90rem;
  background-color: transparent;
  box-shadow: none;
  transform: translate(-50%, -50%);
  position: absolute;
}
@media only screen and (max-width: 768px) {
  .popup__video {
    margin: 0 1rem;
    left: calc(50% - 1rem);
    width: calc(100% - 2rem);
  }
}
.popup__video-body {
  width: 100%;
  position: relative;
  padding-top: 56.25%;
  background-color: #000000;
  border-radius: 2rem;
  overflow: hidden;
}
.popup__video-body video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.popup__close-video {
  width: 3rem;
  height: 3rem;
  background-image: url(../img/icons/icon_close-white.svg);
  top: -4rem;
  right: 0;
}

.projects {
  width: 100%;
  overflow: clip;
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .projects {
    margin-bottom: 6rem;
  }
}
@media only screen and (max-width: 768px) {
  .projects__onfirst {
    padding-top: 2rem;
  }
}
.projects__grid {
  display: grid;
  width: 100%;
  gap: 2rem;
}
@media only screen and (max-width: 680px) {
  .projects__grid {
    max-width: 50rem;
    margin: 0 auto;
  }
}
@media only screen and (max-width: 1024px) {
  .projects__full {
    display: none;
  }
}
.projects__grid-3col {
  grid-template-columns: repeat(3, 1fr);
}
@media only screen and (max-width: 1024px) {
  .projects__grid-3col {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 680px) {
  .projects__grid-3col {
    grid-template-columns: repeat(1, 1fr);
  }
}
.projects__grid-2col {
  grid-template-columns: repeat(2, 1fr);
}
@media only screen and (max-width: 680px) {
  .projects__grid-2col {
    grid-template-columns: repeat(1, 1fr);
  }
}
.projects__swiper-wrapper--on-first {
  display: none;
}
@media only screen and (max-width: 1024px) {
  .projects__swiper-wrapper--on-first {
    display: block;
  }
}

.card {
  width: 100%;
  box-shadow: inset 0 0 0 1px #475531;
  border-radius: 2rem;
}
.card__image-wrapper {
  width: 100%;
  position: relative;
}
.card__link-image {
  overflow: hidden;
  width: 100%;
  height: 34rem;
  border-radius: 2rem 2rem 2rem 0;
  display: block;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 576px) {
  .card__link-image {
    height: 27rem;
  }
}
.card__image {
  width: 100%;
  height: 34rem;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.4s ease-in-out;
}
.card__image:hover {
  transform: scale(1.03);
}
.card__category {
  position: absolute;
  z-index: 2;
  background: rgba(71, 85, 49, 0.7);
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #FFFFFF;
  padding: 0.5rem 2rem;
  border-radius: 1rem;
  top: 1.7rem;
  left: 1.7rem;
}
.card__price {
  background: #475531;
  border-radius: 2rem 0;
  padding: 0.5rem 3.3rem;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 2;
  color: #FFFFFF;
  font-weight: 500;
}
.card__content {
  padding: 2rem;
}
@media only screen and (max-width: 576px) {
  .card__content {
    padding: 1rem 1rem 1.5rem;
  }
}
.card__title {
  color: #313622;
  margin-bottom: 2rem;
}
.card__specs {
  display: grid;
  width: 100%;
  gap: 2rem;
  grid-template-columns: repeat(2, 1fr);
}
.card__spec {
  display: flex;
  gap: 1rem 1.5rem;
  align-items: center;
}
.card__spec-text span {
  display: block;
  font-size: 1.3rem;
  line-height: 1.8rem;
}
.card__btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 1.2rem;
}
.card__mortgage {
  display: flex;
  flex-direction: column;
  font-weight: 700;
}
.card__mortgage span {
  font-size: 1.3rem;
  line-height: 1.8rem;
  color: #475531;
  font-weight: normal;
}
.card__promo-nameTop {
  background: #475531;
  border-radius: 2rem 0 2rem 0;
  padding: 1.1rem 2.6rem;
  color: #FFFFFF;
  text-transform: uppercase;
  font-size: 2.6rem;
  line-height: 3.6rem;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  max-width: 80%;
}
@media only screen and (max-width: 576px) {
  .card__promo-nameTop {
    font-size: 2rem;
    line-height: 2.4rem;
  }
}
.card__promo-nameBottom {
  background: #475531;
  border-radius: 2rem 0 2rem 0;
  padding: 1.1rem 2.6rem;
  color: #FFFFFF;
  text-transform: uppercase;
  font-size: 2.6rem;
  line-height: 3.6rem;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 2;
  width: 100%;
  max-width: 80%;
}
@media only screen and (max-width: 576px) {
  .card__promo-nameBottom {
    font-size: 2rem;
    line-height: 2.4rem;
  }
}
.card__promo-icon {
  float: left;
  margin-right: 1rem;
}
.card__promo-text {
  padding: 1rem 0 1.5rem;
}

.projects-swiper,
.projects-swiper2 {
  overflow: visible;
}

.swiper-slide.card {
  width: 41.6rem;
}
@media only screen and (max-width: 576px) {
  .swiper-slide.card {
    width: 33rem;
  }
}

.card-swiper__prev,
.card-swiper__next {
  top: -9rem !important;
}
@media only screen and (max-width: 768px) {
  .card-swiper__prev,
  .card-swiper__next {
    top: -7.4rem !important;
  }
}
@media only screen and (max-width: 576px) {
  .card-swiper__prev,
  .card-swiper__next {
    top: 16rem !important;
  }
}

.card-swiper__prev {
  left: auto !important;
  right: 8.7rem !important;
}
@media only screen and (max-width: 768px) {
  .card-swiper__prev {
    right: 7rem !important;
  }
}
@media only screen and (max-width: 576px) {
  .card-swiper__prev {
    right: auto !important;
    left: 1rem !important;
  }
}

.more-line {
  text-align: center;
  padding-top: 6rem;
}

.catalog-filter {
  position: sticky;
  top: 12rem;
  width: 100%;
  background-color: #FFFFFF;
  padding: 2rem 0;
  margin-bottom: 3rem;
  transition: box-shadow 0.3s ease;
  z-index: 99;
}
@media only screen and (max-width: 768px) {
  .catalog-filter {
    top: 8rem;
  }
}
.catalog-filter__on-map {
  top: 12rem;
  background: none;
  position: fixed;
}
@media only screen and (max-width: 768px) {
  .catalog-filter__on-map {
    top: 8rem;
  }
}
.catalog-filter__container-map {
  max-width: 185rem;
  padding-left: 2rem;
  padding-right: 2rem;
  margin: 0 auto;
}
.catalog-filter.is-fixed {
  position: sticky;
  top: 9rem;
  left: 0;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
  padding: 1.5rem 0;
  animation: none;
}
.catalog-filter__form {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1.5rem;
  margin-bottom: 2rem;
  align-items: center;
  max-width: 130rem;
}
@media only screen and (max-width: 1024px) {
  .catalog-filter__form {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (max-width: 576px) {
  .catalog-filter__form {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }
}
.catalog-filter__select-wrapper {
  position: relative;
  width: 100%;
}
.catalog-filter__select-wrapper::after {
  content: "";
  background: url(../img/icons/icon-select.svg) no-repeat;
  position: absolute;
  right: 1.5rem;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  width: 1rem;
  height: 1rem;
  background-size: contain;
}
.catalog-filter__select {
  width: 100%;
  padding: 1rem 3rem 1rem 1.5rem;
  border: 1px solid #313622;
  border-radius: 1rem;
  font-family: "Montserrat", sans-serif;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #000000;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
  outline: none;
  transition: border-color 0.2s;
  background-color: #F8FAFC;
}
.catalog-filter__select:focus {
  border-color: #475531;
}
.catalog-filter__select option {
  border-radius: 0.5rem 0.5rem 0 0;
}
.catalog-filter__controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.5rem;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.catalog-filter__clear {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0;
  font-family: "Montserrat", sans-serif;
  font-size: 1.6rem;
  line-height: 2.4rem;
  transition: color 0.2s;
}
.catalog-filter__clear:hover {
  color: #475531;
}
.catalog-filter__clear-icon {
  font-size: 1.8rem;
  line-height: 1;
}
.catalog-filter__right-group {
  display: flex;
  align-items: center;
  gap: 3rem;
  flex-wrap: wrap;
}
@media only screen and (max-width: 768px) {
  .catalog-filter__right-group {
    gap: 1.5rem;
    width: 100%;
    justify-content: space-between;
  }
}
.catalog-filter__view-toggle {
  display: flex;
  gap: 1rem;
  background-color: #EEF0F3;
  border-radius: 1rem;
  padding: 0.7rem;
}
@media only screen and (max-width: 1024px) {
  .catalog-filter__view-toggle {
    display: none;
  }
}
.catalog-filter__view-btn {
  background: none;
  border: none;
  color: #313622;
  cursor: pointer;
  padding: 0.5rem 0.5rem 0.2rem;
  transition: color 0.2s;
  border-radius: 0.6rem;
}
.catalog-filter__view-btn.is-active {
  background-color: #FFFFFF;
}
.catalog-filter__limit {
  display: flex;
  align-items: center;
  gap: 1rem;
  border-radius: 1rem;
  padding: 0.7rem 2rem;
  background-color: #EEF0F3;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.catalog-filter__limit-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0 0.2rem;
  font-family: "Montserrat", sans-serif;
  transition: color 0.2s;
  border-radius: 0.6rem;
  background-color: #FFFFFF;
  width: 3.2rem;
  height: 3.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.catalog-filter__limit-btn:hover, .catalog-filter__limit-btn.is-active {
  color: #475531;
}
.catalog-filter__sorting {
  display: flex;
  gap: 2rem;
}
.catalog-filter__sorting .catalog-filter__sort-link {
  background: none;
  border: none;
  cursor: pointer;
  font-family: "Montserrat", sans-serif;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding: 0;
}
.catalog-filter__sorting .catalog-filter__sort-link:hover {
  color: #475531;
}
.catalog-filter__sorting .catalog-filter__up::after {
  content: "";
  width: 2.2rem;
  height: 2.2rem;
  display: inline-block;
  background: url(../img/icons/arrow_up.svg) no-repeat;
  background-size: contain;
}
.catalog-filter__sorting .catalog-filter__down::after {
  content: "";
  width: 2.2rem;
  height: 2.2rem;
  display: inline-block;
  background: url(../img/icons/arrow_down.svg) no-repeat;
  background-size: contain;
}

.catalog-filter.is-fixed .catalog-filter__container {
  width: 100%;
  max-width: 133rem;
  padding: 0 2rem;
  margin: 0 auto;
}

@keyframes slideDown {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}
.swiper-style__prev,
.swiper-style__next {
  width: 6.3rem;
  height: 6.3rem;
  border-radius: 1.8rem;
  background: #FFFFFF;
  border: 1px solid rgba(214, 223, 233, 0.4);
}
@media only screen and (max-width: 768px) {
  .swiper-style__prev,
  .swiper-style__next {
    width: 5rem;
    height: 5rem;
    border-radius: 1.3rem;
  }
}

.swiper-style__prev.swiper-button-disabled,
.swiper-style__next.swiper-button-disabled {
  opacity: 1;
  background: #F8FAFC;
}

.swiper-style__prev svg,
.swiper-style__next svg {
  display: none;
}

.swiper-style__prev::after,
.swiper-style__next::after {
  width: 2.5rem;
  height: 2.5rem;
  position: absolute;
  top: 1.9rem;
  left: 1.9rem;
  display: block;
  background-size: contain;
  content: "";
}
@media only screen and (max-width: 768px) {
  .swiper-style__prev::after,
  .swiper-style__next::after {
    top: 1.2rem;
    left: 1.2rem;
  }
}

.swiper-style__prev::after {
  background-image: url(../img/icons/arrow-left.svg);
}

.swiper-style__next::after {
  background-image: url(../img/icons/arrow-right.svg);
}

.benefits {
  width: 100%;
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .benefits {
    margin-bottom: 6rem;
  }
}
.benefits__line-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media only screen and (max-width: 576px) {
  .benefits__line-title {
    flex-wrap: wrap;
  }
}
.benefits__title {
  max-width: 50rem;
}
@media only screen and (max-width: 576px) {
  .benefits__title {
    margin-bottom: 1.5rem;
  }
}
.benefits__subtitle {
  text-align: right;
  position: relative;
  font-size: 2rem;
  line-height: 2.4rem;
}
@media only screen and (max-width: 576px) {
  .benefits__subtitle {
    text-align: left;
    padding: 1rem 0 2.5rem;
  }
}
@media only screen and (max-width: 576px) {
  .benefits__subtitle::before {
    content: "";
    width: 20.6rem;
    height: 1px;
    position: absolute;
    top: 0;
    left: 0;
    background: #4EA915;
    display: block;
  }
}
.benefits__subtitle-underline {
  width: 20rem;
  height: 1px;
  background: #4EA915;
  display: inline-block;
  margin-right: 1rem;
}
@media only screen and (max-width: 576px) {
  .benefits__subtitle-underline {
    display: none;
  }
}
.benefits__features {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
  align-content: stretch;
}
@media only screen and (max-width: 768px) {
  .benefits__features {
    gap: 0;
  }
}
.benefits__feature {
  border-radius: 3rem;
  background: #F8FAFC;
  padding: 3rem;
  position: relative;
}
@media only screen and (max-width: 768px) {
  .benefits__feature {
    border-radius: 0;
    margin: 0 -2rem;
  }
}
.benefits__feature p {
  margin: 0;
  position: relative;
  z-index: 2;
}
.benefits__feature h3 {
  position: relative;
  z-index: 2;
}
@media only screen and (max-width: 576px) {
  .benefits__feature h3 {
    max-width: 30rem;
  }
}
.benefits__feature-1of3 {
  width: calc(33% - 1rem);
}
@media only screen and (max-width: 768px) {
  .benefits__feature-1of3 {
    width: 100%;
  }
}
.benefits__feature-2of3 {
  width: calc(66% - 1rem);
}
@media only screen and (max-width: 768px) {
  .benefits__feature-2of3 {
    width: 100%;
  }
}
.benefits__feature-3of3 {
  width: 100%;
}
.benefits__feature-text {
  max-width: 54rem;
}
.benefits__one {
  padding-top: 6.4rem;
}
@media only screen and (max-width: 768px) {
  .benefits__one {
    padding-top: 3rem;
    width: calc(100% + 4rem);
  }
}
.benefits__two {
  padding-top: 6.4rem;
  background: linear-gradient(135deg, #F8FAFC 0%, #AEC3A0 100%);
}
@media only screen and (max-width: 768px) {
  .benefits__two {
    padding-top: 3rem;
    width: calc(100% + 4rem);
  }
}
.benefits__three {
  padding-top: 14.7rem;
  background: url(../img/content/comunication.jpg) top center;
  background-size: cover;
  color: #FFFFFF;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}
@media only screen and (max-width: 768px) {
  .benefits__three {
    padding-top: 3rem;
    width: calc(100% + 4rem);
  }
}
.benefits__three::before {
  content: "";
  background: linear-gradient(to bottom, rgba(49, 54, 34, 0) 0%, rgba(49, 54, 34, 0.8) 100%);
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  z-index: 1;
  width: 100%;
  height: 100%;
  border-radius: 3rem;
}
@media only screen and (max-width: 768px) {
  .benefits__three::before {
    border-radius: 0;
  }
}
.benefits__four {
  padding-top: 14.7rem;
}
.benefits__four::before {
  content: "";
  background: url(../img/icons/icon-guarantees-duble.svg);
  background-size: contain;
  width: 7.6rem;
  height: 7.3rem;
  position: absolute;
  top: 3.5rem;
  right: 5rem;
}
@media only screen and (max-width: 576px) {
  .benefits__four::before {
    top: 1rem;
    right: 1rem;
  }
}
@media only screen and (max-width: 768px) {
  .benefits__four {
    padding-top: 3rem;
    width: calc(100% + 4rem);
  }
}
@media only screen and (max-width: 768px) {
  .benefits__five {
    background: #FFFFFF;
    width: calc(100% + 4rem);
  }
}
.benefits__five::before {
  content: "";
  width: 58.1rem;
  height: 29.2rem;
  background: url(../img/benefits.png) no-repeat;
  background-size: cover;
  position: absolute;
  top: -3.4rem;
  right: 6.3rem;
}
@media only screen and (max-width: 1024px) {
  .benefits__five::before {
    right: -2rem;
  }
}
@media only screen and (max-width: 768px) {
  .benefits__five::before {
    width: 38.1rem;
    height: 19.3rem;
    top: 5rem;
    right: 0.5rem;
  }
}
@media only screen and (max-width: 576px) {
  .benefits__five::before {
    top: auto;
    bottom: 9rem;
  }
}

.happy-homes {
  background: #F8FAFC;
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .happy-homes {
    padding-top: 3rem;
  }
}
.happy-homes {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .happy-homes {
    padding-bottom: 6rem;
  }
}
.happy-homes {
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .happy-homes {
    margin-bottom: 6rem;
  }
}
.happy-homes__item {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
@media only screen and (max-width: 768px) {
  .happy-homes__item {
    flex-wrap: wrap;
  }
}
.happy-homes__image-wrapper {
  position: relative;
  overflow: hidden;
  border-radius: 3rem;
  width: 57%;
  margin-left: 0.1rem;
}
@media only screen and (max-width: 768px) {
  .happy-homes__image-wrapper {
    width: 100%;
    margin-bottom: 3rem;
  }
}
@media only screen and (max-width: 576px) {
  .happy-homes__image-wrapper {
    border-radius: 1rem;
  }
}
.happy-homes__image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 3rem;
}
@media only screen and (max-width: 576px) {
  .happy-homes__image {
    border-radius: 1rem;
  }
}
.happy-homes__content {
  width: 34%;
  flex-shrink: 0;
}
@media only screen and (max-width: 768px) {
  .happy-homes__content {
    width: 100%;
  }
}
.happy-homes__specs-list {
  display: grid;
  width: 100%;
  gap: 2rem;
  grid-template-columns: repeat(2, 1fr);
  padding: 5rem 0;
}
@media only screen and (max-width: 768px) {
  .happy-homes__specs-list {
    padding: 1.5rem 0;
  }
}
.happy-homes__spec {
  display: flex;
  gap: 1rem 1.5rem;
  align-items: center;
}
.happy-homes__btn {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2rem;
}

.happy__pagination {
  bottom: 3rem !important;
  text-align: left;
  margin-left: 1rem;
}
@media only screen and (max-width: 768px) {
  .happy__pagination {
    display: none;
  }
}

.happy__prev,
.happy__next {
  top: 3.3rem !important;
  background: rgba(255, 255, 255, 0.7);
}

.happy__prev {
  left: 1rem !important;
  right: auto !important;
}

.happy__next {
  left: 8.7rem !important;
  right: auto !important;
}

@media only screen and (max-width: 768px) {
  .happy-homes-swiper {
    max-width: 58rem;
  }
}

.map-on-first {
  width: 100%;
  overflow-x: hidden;
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .map-on-first {
    margin-bottom: 6rem;
  }
}
.map-on-first__container {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  position: relative;
}
@media only screen and (max-width: 768px) {
  .map-on-first__container {
    flex-wrap: wrap;
  }
}
.map-on-first__text {
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .map-on-first__text {
    margin-bottom: 3rem;
  }
}
.map-on-first__column-info {
  width: 41.6rem;
  flex-shrink: 0;
}
@media only screen and (max-width: 768px) {
  .map-on-first__column-info {
    width: 100%;
  }
}
.map-on-first__actions {
  text-align: center;
  display: inline-block;
}
@media only screen and (max-width: 768px) {
  .map-on-first__actions {
    width: 100%;
  }
}
.map-on-first__map-wrapper {
  width: calc(100% - 41.6rem - 2rem + (100vw - 100%) / 2);
  margin-right: calc((100% - 100vw) / 2);
  height: 63.5rem;
  border-radius: 3rem 0 0 3rem;
  overflow: hidden;
}
@media only screen and (max-width: 768px) {
  .map-on-first__map-wrapper {
    width: calc(100% + 4rem);
    margin: 0 -2rem;
    border-radius: 0;
    height: 45rem;
  }
}
.map-on-first__map-wrapper > ymaps {
  height: 100% !important;
}
.map-on-first__link {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2.3rem;
}
.map-on-first__link img {
  margin-right: 1.1rem;
}

.process-section {
  background: #F8FAFC;
  position: relative;
  overflow: hidden;
  padding-bottom: 18.5rem;
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .process-section {
    padding-top: 3rem;
  }
}
.process-section {
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .process-section {
    margin-bottom: 6rem;
  }
}
.process-section::after {
  width: 100%;
  height: 6.5rem;
  background: #FFFFFF;
  content: "";
  bottom: 0;
  left: 0;
  display: block;
  position: absolute;
  z-index: 1;
}
.process-section__container {
  position: relative;
  z-index: 3;
}
.process-section__steps {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 2rem;
}
@media only screen and (max-width: 1024px) {
  .process-section__steps {
    gap: 1rem;
  }
}
@media only screen and (max-width: 768px) {
  .process-section__steps {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
}
.process-section__step {
  padding: 3rem;
  box-sizing: border-box;
  background: #FFFFFF;
  border-radius: 2rem;
  width: calc(33% - 2rem);
  position: relative;
  box-shadow: 0 0 1.5rem 0 rgba(214, 223, 233, 0.4);
}
@media only screen and (max-width: 1024px) {
  .process-section__step {
    padding: 2.5rem;
    width: calc(33% - 1rem);
  }
}
@media only screen and (max-width: 768px) {
  .process-section__step {
    width: 100%;
    max-width: 50rem;
  }
}
.process-section__step-title {
  max-width: 24rem;
  min-height: 4.8rem;
  margin-bottom: 1rem;
}
@media only screen and (max-width: 1024px) {
  .process-section__step-title {
    max-width: 20rem;
  }
}
.process-section__step-text {
  max-width: 24rem;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media only screen and (max-width: 1024px) {
  .process-section__step-text {
    max-width: 16rem;
  }
}
.process-section__step-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 2.4rem;
}
@media only screen and (max-width: 1024px) {
  .process-section__step-icon {
    width: 27%;
  }
}
@media only screen and (max-width: 576px) {
  .process-section__step-icon {
    width: 25%;
  }
}
.process-section__btn {
  text-align: right;
  width: 100%;
  margin-top: 6rem;
}
@media only screen and (max-width: 576px) {
  .process-section__btn {
    margin-top: 3rem;
  }
}
@media only screen and (max-width: 768px) {
  .process-section__btn {
    text-align: center;
  }
}
.process-section__bg-decor {
  position: absolute;
  background: url(../img/bgBlueprint.png) no-repeat center right;
  background-size: cover;
  right: calc(50% - 96rem);
  bottom: 0;
  width: 116.1rem;
  height: 68rem;
  pointer-events: none;
  z-index: 2;
}
@media only screen and (max-width: 768px) {
  .process-section__bg-decor {
    width: 76.1rem;
    height: 44.4rem;
    right: 0;
  }
}

.mortgage-section {
  width: 100%;
}
.mortgage-section__container {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .mortgage-section__container {
    margin-bottom: 6rem;
  }
}
@media only screen and (max-width: 768px) {
  .mortgage-section__container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
}
.mortgage-section__first-page {
  border-bottom: 1px solid #475531;
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .mortgage-section__first-page {
    padding-bottom: 6rem;
  }
}
.mortgage-section__content {
  width: calc(50% - 2rem);
  flex-shrink: 0;
}
@media only screen and (max-width: 576px) {
  .mortgage-section__content {
    width: 100%;
  }
}
.mortgage-section__options {
  width: calc(50% - 2rem);
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 2rem;
}
@media only screen and (max-width: 768px) {
  .mortgage-section__options {
    width: 100%;
    max-width: 60rem;
  }
}
@media only screen and (max-width: 576px) {
  .mortgage-section__options {
    gap: 1rem;
  }
}
.mortgage-section__title {
  max-width: 56rem;
}
.mortgage-section__text {
  max-width: 41rem;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.mortgage-section__option {
  width: calc(50% - 2rem);
  border-radius: 2rem;
  border-left: 1px solid #475531;
  background: #F8FAFC;
  text-align: center;
  position: relative;
  min-height: 12rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-width: 576px) {
  .mortgage-section__option {
    width: calc(50% - 1rem);
    border-radius: 1rem;
  }
}
.mortgage-section__option:last-child {
  background: linear-gradient(135deg, #F8FAFC 0%, #AEC3A0 100%);
}
.mortgage-section__option-icon {
  position: absolute;
  bottom: 0.4rem;
  left: 0.6rem;
}
.mortgage-section__option-title {
  margin-bottom: 0;
  position: relative;
  z-index: 2;
  font-size: 1.7rem;
}
.mortgage-section__link {
  font-weight: 600;
  font-size: 2rem;
  line-height: 2.4rem;
  text-decoration: none;
}
@media only screen and (max-width: 1024px) {
  .mortgage-section__link {
    font-size: 1.7rem;
  }
}
.mortgage-section__link::after {
  content: "";
  width: 2rem;
  height: 2rem;
  background: url(../img/icons/arrow-link-green.svg) no-repeat;
  background-size: contain;
  display: inline-block;
  margin-left: 1rem;
  position: relative;
  top: 3px;
}

.custom-request {
  width: 100%;
  background: url(../img/bgform.jpg) no-repeat top center;
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .custom-request {
    padding-top: 3rem;
  }
}
.custom-request {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .custom-request {
    padding-bottom: 6rem;
  }
}
@media only screen and (max-width: 768px) {
  .custom-request {
    background: none;
    padding-top: 0;
    padding-bottom: 3rem;
  }
}
.custom-request__container {
  background: #FFFFFF;
  border-radius: 3rem;
  box-shadow: 0 0 1.5rem 0 rgba(49, 54, 34, 0.3);
  padding: 5.7rem 11rem;
  margin: 0 2rem;
  width: calc(100% - 4rem);
  max-width: 130rem;
  left: 50%;
  transform: translateX(-50%);
  position: relative;
}
@media only screen and (max-width: 1024px) {
  .custom-request__container {
    padding: 5rem;
    margin: 0;
  }
}
@media only screen and (max-width: 576px) {
  .custom-request__container {
    padding: 2rem;
    border-radius: 1.5rem;
  }
}
.custom-request__form {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.custom-request__form-colinfo {
  width: 100%;
  max-width: 41.5rem;
}
@media only screen and (max-width: 1024px) {
  .custom-request__form-colinfo {
    max-width: 32rem;
  }
}
@media only screen and (max-width: 768px) {
  .custom-request__form-colinfo {
    max-width: inherit;
    margin-bottom: 2.5rem;
  }
}
.custom-request__form-colform {
  width: 100%;
  max-width: 41.5rem;
}
.custom-request__form-btn {
  width: 100%;
  text-align: center;
}
.custom-request__form-group {
  margin-bottom: 3.7rem;
}
.custom-request__text {
  font-size: 1.6rem;
  line-height: 2.4rem;
}

.breadcrumbs {
  margin-top: 14.6rem;
  color: #313622;
  margin-bottom: 5rem;
}
@media only screen and (max-width: 768px) {
  .breadcrumbs {
    margin-top: 9rem;
    margin-bottom: 3rem;
  }
}
.breadcrumbs a {
  color: #313622;
}

.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.7rem;
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .pagination {
    margin-bottom: 6rem;
  }
}
.pagination {
  width: 100%;
}
@media only screen and (max-width: 576px) {
  .pagination {
    gap: 1rem;
  }
}
.pagination__list {
  display: flex;
  align-items: center;
  gap: 1rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
@media only screen and (max-width: 576px) {
  .pagination__list {
    gap: 0.5rem;
  }
}
.pagination__item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5.6rem;
  height: 5.6rem;
  border-radius: 0.5rem;
  background-color: #F8FAFC;
  color: #313622;
  font-size: 2.4rem;
  text-decoration: none;
  transition: all 0.3s ease;
  cursor: pointer;
}
@media only screen and (max-width: 576px) {
  .pagination__item {
    width: 3.5rem;
    height: 3.5rem;
    font-size: 1.4rem;
  }
}
.pagination__item:hover {
  background: #F5F5F5;
}
.pagination__item:hover:not(.pagination__dots) {
  background-color: none;
  color: #475531;
}
.pagination__item.is-active {
  background-color: #AEC3A0;
  color: #FFFFFF;
  pointer-events: none;
}
.pagination__dots {
  cursor: default;
  color: #313622;
  font-weight: normal;
  background: none;
}
.pagination__dots:hover {
  background: none;
}
.pagination__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5.6rem;
  height: 5.6rem;
  border-radius: 0.5rem;
  background-color: #F8FAFC;
  transition: all 0.3s ease;
  position: relative;
}
@media only screen and (max-width: 576px) {
  .pagination__arrow {
    width: 3.5rem;
    height: 3.5rem;
  }
}
.pagination__arrow:hover {
  background: #F5F5F5;
}
.pagination__arrow::after {
  content: "";
  transition: transform 0.3s ease;
  width: 2.5rem;
  height: 2.5rem;
  contain: "";
  left: calc(50% - 1.25rem);
  top: calc(50% - 1.25rem);
  display: block;
  position: absolute;
}
.pagination__prev::after {
  background: url(../img/icons/arrow-left.svg);
}
.pagination__next::after {
  background: url(../img/icons/arrow-right.svg);
}
.pagination__next::after:hover {
  background-color: #AEC3A0;
  color: #475531;
}
.pagination__next::after:hover.pagination__prev {
  transform: translateX(-2px);
}
.pagination__next::after:hover.pagination__next {
  transform: translateX(2px);
}

.map-section {
  width: 100%;
  overflow: hidden;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
}

.interactive-map {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
  background-color: #F8FAFC;
  top: 12rem;
}
@media only screen and (max-width: 768px) {
  .interactive-map {
    top: 8rem;
  }
}
.interactive-map__container {
  max-width: 185rem;
  height: 1px;
  position: relative;
  margin: 0 auto;
}
.interactive-map__bg {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}
@media only screen and (max-width: 768px) {
  .interactive-map__bg {
    min-height: 50rem;
  }
}

.map-marker {
  position: absolute;
  z-index: 10;
  transform: translate(-50%, -50%);
  background-repeat: no-repeat;
  background-size: contain;
}
.map-marker__brown {
  background-image: url(../img/icons/icon-map-marker-br.svg);
}
.map-marker__green {
  background-image: url(../img/icons/icon-map-marker.svg);
}
.map-marker__btn {
  width: 3.75rem;
  height: 4.3rem;
  cursor: pointer;
  position: relative;
  padding: 0;
  background-color: transparent;
  outline: none;
  border: none;
}
.map-marker__btn::after {
  content: "";
  position: absolute;
  top: -3px;
  left: -3px;
  right: -3px;
  bottom: -3px;
  border: inherit;
  animation: markerPulse 2s infinite;
  pointer-events: none;
}
.map-marker__btn:hover {
  transform: scale(1.15);
  z-index: 11;
}
.map-marker.is-active {
  z-index: 100;
}
.map-marker.is-active .tooltip {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -10px) scale(1);
}

@keyframes markerPulse {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(1.8);
    opacity: 0;
  }
}
.tooltip {
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translate(-50%, 0) scale(0.9);
  background-color: #FFFFFF;
  border-radius: 1rem;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
  padding: 1.3rem 2rem;
  width: 30rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  pointer-events: auto;
  cursor: default;
  box-sizing: border-box;
}
.tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 10px solid transparent;
  border-top-color: #FFFFFF;
}
.tooltip__close {
  position: absolute;
  top: 1rem;
  right: 1.2rem;
  background: none;
  border: none;
  font-size: 2.2rem;
  line-height: 1;
  cursor: pointer;
  color: #656565;
  transition: color 0.2s;
  background-color: #FFFFFF;
  border-radius: 0.5rem;
}
.tooltip__close:hover {
  color: #000000;
}
.tooltip--small {
  padding: 3rem 3rem 1.5rem 2rem;
}
.tooltip--small .tooltip__title {
  font-size: 1.6rem;
  font-weight: 600;
  color: #313622;
  margin: 0 0 0.4rem 0;
}
.tooltip--small .tooltip__text {
  font-size: 1.4rem;
  color: #656565;
  margin: 0;
}
.tooltip--large {
  position: absolute;
  top: 11rem;
  max-height: calc(100dvh - 26rem);
  left: 2rem;
  bottom: 4rem;
  overflow: auto;
  width: 42rem;
  max-width: calc(100vw - 4rem);
  padding: 1.5rem;
  border-radius: 2rem;
  transform: none;
  display: flex;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  z-index: 20;
  height: 80rem;
}
@media only screen and (max-width: 1024px) {
  .tooltip--large {
    top: 17rem;
    max-height: calc(100dvh - 32rem);
  }
}
@media only screen and (max-width: 576px) {
  .tooltip--large {
    top: 25rem;
    max-height: calc(100dvh - 35rem);
  }
}
.tooltip--large.is-active {
  opacity: 1;
  visibility: visible;
}
.tooltip--large::after {
  display: none;
}
.tooltip__content {
  display: flex;
  gap: 1.5rem;
  flex-direction: column;
  width: 100%;
}
.tooltip__img-wrapper {
  width: 100%;
  border-radius: 1.5rem 1.5rem 0 0;
  overflow: hidden;
  flex-shrink: 0;
}
.tooltip__img-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.tooltip__info {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-grow: 1;
  padding-top: 0.5rem;
}
.tooltip__tag {
  align-self: flex-start;
  font-size: 1.1rem;
  font-weight: 500;
  text-transform: uppercase;
  background-color: #AEC3A0;
  color: #313622;
  padding: 0.3rem 1rem;
  border-radius: 0.6rem;
  margin-bottom: 0.8rem;
}
.tooltip__title {
  color: #313622;
  margin: 0 0 0.8rem 0;
}
.tooltip__specs {
  display: grid;
  width: 100%;
  gap: 2rem;
  grid-template-columns: repeat(2, 1fr);
  margin: 5rem 0;
}
.tooltip__spec {
  display: flex;
  gap: 1rem 1.5rem;
  align-items: center;
}
.tooltip__btn {
  width: 100%;
  display: flex;
  align-items: center;
  padding-bottom: 1.5rem;
}
.tooltip__link {
  margin-left: 2.5rem;
}

@media only screen and (max-width: 576px) {
  .tooltip--large {
    width: 29rem;
  }
  .tooltip--large .tooltip__content {
    flex-direction: column;
  }
  .tooltip--large .tooltip__img-wrapper {
    width: 100%;
    height: 12rem;
  }
}
#map_filter.catalog-filter__form {
  display: grid;
}

.team-swiper,
.reviews-swiper {
  overflow: visible;
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .team-swiper,
  .reviews-swiper {
    margin-bottom: 6rem;
  }
}

.reviews-swiper .swiper-wrapper {
  align-items: stretch;
}

.employee {
  width: 30.7rem;
  position: relative;
  display: flex;
  flex-direction: column;
}
.employee img {
  border-radius: 2rem 2rem 0 0;
}
.employee__info {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  border-radius: 2rem 2rem 0 0;
  background: rgba(71, 85, 49, 0.8);
  font-style: italic;
  box-sizing: border-box;
  padding: 3rem;
  text-align: center;
  color: #FFFFFF;
  height: 38.4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transform: translateY(15px);
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}
.employee__info p {
  color: #FFFFFF !important;
}
.employee:hover .employee__info {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.employee__cont {
  background: #475531;
  border-radius: 0 0 2rem 2rem;
  box-sizing: border-box;
  padding: 1rem 2rem;
  color: #FFFFFF;
}
.employee__name {
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 500;
  margin-bottom: 0.6rem;
}
.employee__name span {
  text-transform: uppercase;
  display: block;
}

.review-slide {
  width: 40.9rem;
  position: relative;
  display: flex;
  flex-direction: column;
  box-shadow: 0 0 1.5rem 0 rgba(214, 223, 233, 0.4), inset 0px 0px 0px 1px #D9D9D9;
  border-radius: 2rem;
  height: auto !important;
}
.review-slide__prev {
  position: relative;
  cursor: pointer;
}
.review-slide__prev img {
  border-radius: 2rem;
  width: 100%;
}
.review-slide__play {
  width: 6rem;
  height: 6rem;
  border-radius: 50%;
  background: #4EA915;
  position: absolute;
  top: calc(50% - 3rem);
  left: calc(50% - 3rem);
  z-index: 2;
  transition: transform 0.3s ease;
}
.review-slide__play::after {
  content: "";
  position: absolute;
  top: calc(50% - 0.9rem);
  left: calc(50% - 0.6rem);
  width: 0;
  height: 0;
  border-top: 1rem solid transparent;
  border-bottom: 1rem solid transparent;
  border-left: 1.7rem solid #FFFFFF;
}
.review-slide__prev:hover .review-slide__play {
  transform: scale(1.1);
  transition: transform 0.3s ease;
}
.review-slide__cont {
  padding: 2rem;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.review-slide__text {
  padding-bottom: 1rem;
  flex-grow: 1;
}

.img__full {
  width: 100%;
  margin-bottom: 3rem;
  position: relative;
  border-radius: 2rem;
  overflow: hidden;
}
.img__full img {
  width: 100%;
  border-radius: 2rem;
  height: auto;
  display: block;
}

.img__caption {
  position: absolute;
  bottom: 0;
  right: 0;
  background: #475531;
  color: #FFFFFF;
  padding: 1rem 3rem;
  border-radius: 2rem 0 2rem 0;
  font-size: 1.6rem;
  line-height: 2.4rem;
  max-width: 45rem;
  text-align: left;
}
.img__caption span {
  display: block;
}

.article {
  overflow: hidden;
}
.article__text {
  width: 100%;
  max-width: 85rem;
  margin: 0 auto;
}
.article p {
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #000000;
}
.article__list {
  list-style: none;
  padding: 0;
  margin-bottom: 6rem;
}
.article__list li {
  position: relative;
  padding-left: 2.8rem;
  margin-bottom: 1rem;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #000000;
}
.article__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5rem;
  width: 1.5rem;
  height: 1.5rem;
  background: url(../img/icons/icons-color/icon-ok.svg) no-repeat;
  background-size: contain;
  display: block;
}
.article__table-wrap {
  width: 100%;
  overflow-x: auto;
  margin: 3.5rem 0;
}
.article__table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 1.5rem 1.5rem 0 0;
  overflow: hidden;
}
.article__table th, .article__table td {
  padding: 1.8rem 3rem;
  text-align: left;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media only screen and (max-width: 576px) {
  .article__table th, .article__table td {
    padding: 1.2rem 1.5rem;
  }
}
.article__table th {
  font-weight: 700;
  color: #000000;
  border-bottom: 1px solid rgba(217, 217, 217, 0.5);
  background-color: #F8FAFC;
}
.article__table tbody tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.6);
}
.article__table tbody tr:not(:last-child) td {
  border-bottom: 1px solid rgba(217, 217, 217, 0.3);
}
.article__table td {
  color: #000000;
}
.article__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .article__footer {
    margin-top: 3rem;
  }
}
.article__footer {
  padding-top: 3rem;
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .article__footer {
    margin-bottom: 6rem;
  }
}
.article__footer {
  border-top: 1px solid rgba(217, 217, 217, 0.5);
}
@media only screen and (max-width: 576px) {
  .article__footer {
    flex-direction: column;
    gap: 2rem;
    align-items: flex-start;
  }
}
.article__back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  color: #475531;
  font-weight: 500;
  font-size: 1.6rem;
  line-height: 2.4rem;
  text-decoration: none;
  transition: color 0.3s ease;
}
.article__back-link::before {
  content: "";
  font-size: 2rem;
  line-height: 1;
  width: 2.5rem;
  height: 2.5rem;
  display: inline-block;
  background: url(../img/icons/icons-color/icon-back.svg) no-repeat;
}
.article__back-link:hover {
  color: #313622;
}
.article__share-actions {
  display: flex;
  align-items: center;
  gap: 2.5rem;
}
.article__action-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  color: #656565;
  font-size: 1.6rem;
  line-height: 2.4rem;
  transition: color 0.3s ease;
}
.article__action-btn::before {
  content: "";
  display: inline-block;
  width: 2.5rem;
  height: 2.5rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.article__action-btn--share::before {
  background-image: url("../img/icons/icons-color/icon-share.svg");
}
.article__action-btn--bookmark::before {
  background-image: url("../img/icons/icons-color/icon-bookmark.svg");
}
.article__action-btn:hover {
  color: #475531;
}

blockquote {
  margin: 4rem auto;
  max-width: 89rem;
  padding: 3.3rem 8.3rem 1.4rem 5rem;
  border-left: 1px solid #475531;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  background: linear-gradient(to right, #F8FAFC 0%, #FFFFFF 100%);
  border-radius: 1.5rem 0 0 1.5rem;
}
blockquote p {
  font-style: italic;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #656565;
  margin: 0;
}
blockquote cite {
  font-style: normal;
  font-weight: 600;
  font-size: 1.3rem;
  line-height: 1.8rem;
  color: #000000;
  text-align: right;
}

.card-project__hero {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  margin-top: 6rem;
}
@media only screen and (max-width: 576px) {
  .card-project__hero {
    margin-top: 3rem;
  }
}
.card-project__hero {
  margin-bottom: 17rem;
}
@media only screen and (max-width: 1024px) {
  .card-project__hero {
    flex-direction: column;
  }
}
@media only screen and (max-width: 576px) {
  .card-project__hero {
    margin-bottom: 6rem;
  }
}
.card-project__gallery {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  width: 66%;
}
@media only screen and (max-width: 1024px) {
  .card-project__gallery {
    width: 100%;
  }
}
.card-project__info {
  width: 32%;
  padding-bottom: 16rem;
  box-sizing: border-box;
}
.card-project {
  /* Основной слайдер (2) */
}
.card-project-main {
  position: relative;
  width: 100%;
  height: 60rem;
  border-radius: 2rem;
  overflow: hidden;
}
@media only screen and (max-width: 768px) {
  .card-project-main {
    height: 46rem;
  }
}
.card-project__main-slide {
  position: relative;
  width: 100%;
  height: 100%;
}
.card-project__zoom-link {
  display: block;
  width: 100%;
  height: 100%;
}
.card-project__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.card-project {
  /* Бейдж поверх фото */
}
.card-project__badge {
  position: absolute;
  bottom: 0;
  left: 0;
  background: #475531;
  color: #FFFFFF;
  padding: 1.5rem 3rem;
  border-radius: 0 2rem 0 2rem;
  font-size: 2rem;
  line-height: 2.4rem;
  z-index: 2;
  pointer-events: none;
}
.card-project {
  /* Кнопка "Увеличить" */
}
.card-project__zoom-btn {
  position: absolute;
  bottom: 1.5rem;
  right: 1.5rem;
  width: 4rem;
  height: 4rem;
  border-radius: 1rem;
  background: url(../img/icons/icon-zoom.svg) no-repeat center center rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
  transition: background 0.2s ease, transform 0.2s ease;
}
.card-project__zoom-btn:hover {
  background-color: #FFFFFF;
  transform: scale(1.05);
}
.card-project {
  /* Нижний слайдер превью */
}
.card-project-thumbs {
  position: relative;
  width: 100%;
  height: 16rem;
}
.card-project__thumb-slide {
  height: 100%;
  border-radius: 1rem;
  overflow: hidden;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.2s ease, border-color 0.2s ease;
}
.card-project__thumb-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.card-project__thumb-slide {
  /* Активный кадр превью */
}
.card-project__thumb-slide.swiper-slide-thumb-active {
  opacity: 1;
  border-color: var(--accent-color, #2b3e2d);
}
.card-project {
  /* Стрелки слайдера превью (4) */
}
.card-project__thumbs-next, .card-project__thumbs-prev {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  color: #222;
  position: absolute;
  z-index: 10;
  opacity: 1;
  display: block;
}
.card-project__thumbs-next svg, .card-project__thumbs-prev svg {
  display: none;
}
.card-project__thumbs-next svg::after, .card-project__thumbs-prev svg::after {
  font-size: 12px;
  font-weight: bold;
}
.card-project__thumbs-prev {
  left: 8px;
  background: url(../img/icons/arrow-left.svg) no-repeat center center rgba(255, 255, 255, 0.9);
  background-size: 1rem 1rem;
}
.card-project__thumbs-next {
  right: 8px;
  background: url(../img/icons/arrow-right.svg) no-repeat center center rgba(255, 255, 255, 0.9);
  background-size: 1rem 1rem;
}
.card-project__first-img {
  width: 62%;
}
@media only screen and (max-width: 1024px) {
  .card-project__first-img {
    width: 100%;
  }
}
.card-project__first-img img {
  width: 100%;
  border-radius: 2rem;
}

.card-info {
  width: 32%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media only screen and (max-width: 1024px) {
  .card-info {
    width: 100%;
    max-width: 60rem;
    margin: 3rem auto;
  }
}
.card-info__text {
  padding-bottom: 4rem;
}
@media only screen and (max-width: 576px) {
  .card-info__text {
    padding-bottom: 2rem;
  }
}
.card-info__top-content {
  padding-bottom: 4rem;
}
@media only screen and (max-width: 576px) {
  .card-info__top-content {
    padding-bottom: 2rem;
  }
}
.card-info__price-label {
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 600;
}
.card-info__price-big {
  font-size: 4.8rem;
  line-height: 5.8rem;
}
@media only screen and (max-width: 768px) {
  .card-info__price-big {
    font-size: 3.2rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 576px) {
  .card-info__price-big {
    font-size: 2.7rem;
    line-height: 3.8rem;
  }
}
.card-info__price-big {
  color: #475531;
  font-weight: 700;
}
.card-info__price-note {
  margin-top: -0.5rem;
  font-size: 1.3rem;
  line-height: 1.8rem;
  font-style: italic;
  padding-bottom: 1.7rem;
}
.card-info__mortgage {
  border-top: 1px solid #000000;
  padding: 3.7rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.card-info__price-small {
  font-size: 2rem;
  line-height: 2.4rem;
  color: #475531;
  font-weight: 600;
}

.project-details {
  width: 100%;
  background: #F8FAFC;
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .project-details {
    padding-top: 3rem;
  }
}
.project-details {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .project-details {
    padding-bottom: 6rem;
  }
}
.project-details {
  margin-bottom: 17rem;
}
@media only screen and (max-width: 1024px) {
  .project-details {
    padding-bottom: 0;
  }
}
@media only screen and (max-width: 576px) {
  .project-details {
    padding-bottom: 0;
  }
}
.project-details__white-vertion {
  background: #FFFFFF;
  margin-bottom: 0;
}
.project-details__container {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}
@media only screen and (max-width: 1024px) {
  .project-details__container {
    flex-direction: column;
  }
}
.project-details__left {
  width: 54%;
}
@media only screen and (max-width: 1024px) {
  .project-details__left {
    width: 100%;
  }
}
.project-details__specs {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
  margin-top: 3rem;
}
@media only screen and (max-width: 576px) {
  .project-details__specs {
    max-width: 48rem;
    margin: 3rem auto 0;
  }
}
.project-details__spec {
  display: flex;
  align-items: center;
  gap: 3rem;
  background: #FFFFFF;
  border-radius: 1.5rem;
  width: calc(50% - 2rem);
  padding: 1.8rem 2rem;
  box-shadow: 0 0 1.5rem 0 rgba(214, 223, 233, 0.4);
}
@media only screen and (max-width: 1024px) {
  .project-details__spec {
    gap: 2rem;
  }
}
@media only screen and (max-width: 576px) {
  .project-details__spec {
    width: 100%;
  }
}
.project-details__right {
  background: #AEC3A0;
  margin: -14rem 0 -17rem;
  box-sizing: border-box;
  padding: 15.7rem 4rem 10rem;
  width: 41%;
  border-radius: 3rem;
}
@media only screen and (max-width: 1024px) {
  .project-details__right {
    width: calc(100% + 4rem);
    margin: 6rem -2rem 0;
    padding: 6rem 2rem 12rem;
    border-radius: 0;
  }
}
.project-details__right.padd-none {
  margin: 0;
  padding: 5rem 4rem 6rem;
}
@media only screen and (max-width: 1024px) {
  .project-details__right.padd-none {
    margin: 0 -2rem;
  }
}
.project-details__h3 {
  text-transform: uppercase;
  text-align: center;
  padding-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .project-details__h3 {
    padding-bottom: 3rem;
  }
}
.project-details__btn {
  text-align: center;
  width: 100%;
}

.tech-data {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .tech-data {
    padding-bottom: 6rem;
  }
}
.tech-data__row {
  border-bottom: 1px solid #475531;
  padding: 2rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.tech-data__label {
  text-transform: uppercase;
}
.tech-data__value {
  text-align: right;
  font-weight: 500;
}

.house-layout {
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .house-layout {
    margin-bottom: 6rem;
  }
}
.house-layout {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .house-layout {
    padding-bottom: 6rem;
  }
}
.house-layout__title {
  font-size: 4.8rem;
  line-height: 5.8rem;
}
@media only screen and (max-width: 768px) {
  .house-layout__title {
    font-size: 3.2rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 576px) {
  .house-layout__title {
    font-size: 2.7rem;
    line-height: 3.8rem;
  }
}
.house-layout__title {
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .house-layout__title {
    margin-bottom: 3rem;
  }
}
.house-layout__title {
  text-align: center;
}
.house-layout {
  /* Скрываем визуально радиокнопки */
}
.house-layout__radio {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.house-layout__nav {
  display: flex;
  justify-content: flex-end;
  gap: 1.5rem;
  margin-bottom: 4rem;
}
@media only screen and (max-width: 576px) {
  .house-layout__nav {
    justify-content: center;
  }
}
.house-layout {
  /* Лейблы оформляем как кнопки */
}
.house-layout__tab-btn {
  display: inline-block;
  padding: 1.8rem 3rem;
  border-radius: 2rem;
  cursor: pointer;
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 500;
  background-color: #AEC3A0;
  color: #000000;
  transition: all 0.3s ease;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.house-layout__tab-btn:hover {
  opacity: 0.85;
}
.house-layout {
  /* Изначально весь контент скрыт */
}
.house-layout__content {
  display: none;
}
.house-layout {
  /* ------------------------------------------------------------- */
  /* CSS Логика переключения табов через псевдокласс :checked      */
  /* ------------------------------------------------------------- */
  /* Активный стили для кнопок-лейблов */
}
.house-layout #tab-floor-1:checked ~ .house-layout__nav label[for=tab-floor-1],
.house-layout #tab-floor-2:checked ~ .house-layout__nav label[for=tab-floor-2] {
  background-color: #475531;
  color: #FFFFFF;
}
.house-layout {
  /* Отображение нужного контента в зависимости от выбранного radio */
}
.house-layout #tab-floor-1:checked ~ .house-layout__content--floor-1,
.house-layout #tab-floor-2:checked ~ .house-layout__content--floor-2 {
  display: block;
}
.house-layout {
  /* Общие стили блоков */
}
.house-layout__grid {
  display: flex;
  justify-content: space-between;
  gap: 5rem;
  align-items: center;
}
@media only screen and (max-width: 1024px) {
  .house-layout__grid {
    flex-direction: column;
    gap: 3rem;
  }
}
.house-layout__image-wrapper {
  width: calc(50% - 2rem);
  display: flex;
  justify-content: center;
  align-items: center;
}
@media only screen and (max-width: 1024px) {
  .house-layout__image-wrapper {
    width: 100%;
  }
}
.house-layout__img {
  max-width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}
.house-layout__info {
  width: 40%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 48rem;
}
@media only screen and (max-width: 1024px) {
  .house-layout__info {
    width: 100%;
    min-height: auto;
    gap: 4rem;
    max-width: 65rem;
    margin-top: 5rem;
  }
}
.house-layout__features {
  display: flex;
  flex-direction: column;
  gap: 4rem;
}
.house-layout__feature {
  display: flex;
  align-items: flex-start;
  gap: 2.5rem;
}
.house-layout__feature-icon {
  flex-shrink: 0;
  width: 4.8rem;
  height: 4.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.house-layout__feature-icon img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.house-layout__feature-title {
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 700;
  color: #000000;
  margin-bottom: 1rem;
}
.house-layout__feature-desc {
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: rgba(0, 0, 0, 0.8);
}
.house-layout__banner {
  background-color: #475531;
  color: #FFFFFF;
  padding: 2.2rem 3rem;
  border-radius: 2.5rem;
  text-align: center;
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 500;
  width: 100%;
  box-sizing: border-box;
}
.house-layout {
  /* ----------------------- */
  /* Комплектации и цены     */
  /* ----------------------- */
}

.packages {
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .packages {
    margin-bottom: 6rem;
  }
}
.packages {
  overflow: hidden;
}
.packages__title {
  font-size: 4.8rem;
  line-height: 5.8rem;
}
@media only screen and (max-width: 768px) {
  .packages__title {
    font-size: 3.2rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 576px) {
  .packages__title {
    font-size: 2.7rem;
    line-height: 3.8rem;
  }
}
.packages__title {
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .packages__title {
    margin-bottom: 3rem;
  }
}
.packages__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  align-items: start;
}
@media only screen and (max-width: 1024px) {
  .packages__grid {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    align-items: stretch;
  }
}
.packages__card {
  position: relative;
  background-color: #F8FAFC;
  border-radius: 3rem;
  padding: 4.5rem 2rem 6rem;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 100%;
}
@media (min-width: 1025px) {
  .packages__card {
    flex-shrink: 0;
    height: auto;
    transition: transform 0.3s ease, opacity 0.3s ease;
  }
  .packages__card.swiper-slide-active {
    opacity: 1;
    transform: scale(1);
    z-index: 5;
    box-shadow: 0 0 1.5rem 0 rgba(49, 54, 34, 0.3);
  }
}
.packages__card--popular {
  background-color: #EEF0F3;
  margin: -3rem 0;
  padding: 7.5rem 2rem 9rem;
}
@media only screen and (max-width: 1024px) {
  .packages__card--popular {
    margin: 0;
    padding: 4.5rem 2rem 6rem;
  }
}
.packages {
  /* Зеленый плашка "рекомендуем" над карточкой */
}
.packages__badge {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  background-color: #475531;
  color: #FFFFFF;
  padding: 0.3rem 3rem 0.6rem;
  border-radius: 0 0 1.2rem 1.2rem;
  font-size: 1.3rem;
  line-height: 1.8rem;
  text-transform: lowercase;
  letter-spacing: 0.05em;
}
.packages__header {
  margin-bottom: 2.5rem;
}
.packages__name {
  font-size: 2rem;
  line-height: 2.4rem;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 2.3rem;
  color: #475531;
  text-align: center;
}
.packages__price-block {
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .packages__price-block {
    margin-bottom: 3rem;
  }
}
.packages__price-label {
  font-size: 1.3rem;
  line-height: 1.8rem;
  color: #4EA915;
  text-transform: uppercase;
  margin-bottom: -0.3rem;
}
.packages__price {
  font-size: 4.8rem;
  line-height: 5.8rem;
}
@media only screen and (max-width: 768px) {
  .packages__price {
    font-size: 3.2rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 576px) {
  .packages__price {
    font-size: 2.7rem;
    line-height: 3.8rem;
  }
}
.packages__price {
  color: #475531;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 0.8rem;
}
.packages__mortgage {
  margin-top: 1rem;
  color: #475531;
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 500;
  margin-top: -0.3rem;
}
.packages__mortgage span {
  color: #656565;
  text-transform: uppercase;
}
.packages {
  /* Кнопка с переключателем и стрелкой */
}
.packages__toggle-btn {
  width: 100%;
  background-color: #AEC3A0;
  border: none;
  border-radius: 1.5rem;
  padding: 1.6rem 2rem;
  cursor: pointer;
  font-size: 1.6rem;
  line-height: 2.4rem;
  font-weight: 500;
  color: #000000;
  transition: background-color 0.3s ease, color 0.3s ease;
  position: relative;
  text-align: left;
}
@media only screen and (max-width: 576px) {
  .packages__toggle-btn {
    font-size: 1.45rem;
  }
}
.packages__toggle-btn:hover {
  background-color: rgb(160.6741935484, 185.1290322581, 144.3709677419);
}
.packages__toggle-btn::after {
  content: "";
  display: inline-block;
  width: 1.2rem;
  height: 0.8rem;
  background: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%3C%23000000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center center;
  transition: transform 0.4s ease;
}
.packages__toggle-arrow {
  flex-shrink: 0;
  color: #475531;
  /* В базовом состоянии (когда развернуто) смотрит ВВЕРХ */
  transform: rotate(0deg);
  transition: transform 0.3s ease;
  position: absolute;
  top: 2.5rem;
  right: 3rem;
}
.packages:not(.is-expanded) .packages__toggle-arrow {
  transform: rotate(180deg);
}
.packages {
  /* Строки таблицы характеристик */
}
.packages__list-inner {
  display: flex;
  flex-direction: column;
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .packages__list-inner {
    margin-bottom: 3rem;
  }
}
.packages__row {
  padding: 1rem 0;
  border-bottom: 1px solid #D6DFE9;
  display: flex;
  justify-content: space-between;
  font-size: 1.3rem;
  line-height: 1.8rem;
  gap: 1rem;
}
.packages__row:last-child {
  border: none;
}
.packages__val {
  font-weight: 500;
  text-align: right;
}
.packages {
  /* -------------------------------------------------- */
  /* Плавная анимация раскрытия с использованием CSS Grid */
  /* -------------------------------------------------- */
}
.packages__collapsible {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
}
.packages__collapsible-content {
  min-height: 0;
  overflow: hidden;
}
.packages {
  /* Состояние, когда секция развернута (управляется классом на родителе) */
}
.packages.is-expanded .packages__collapsible {
  grid-template-rows: 1fr;
}
.packages.is-expanded .packages__toggle-btn::after {
  transform: rotate(180deg);
}
.packages__footer {
  margin-top: 3.5rem;
}
.packages__select-btn {
  width: 100%;
  background-color: #313622;
  color: #FFFFFF;
  border-radius: 1.5rem;
  padding: 1.8rem;
  font-size: 1.6rem;
  line-height: 2.4rem;
  font-weight: 600;
}
.packages__select-btn:hover {
  background-color: #475531;
}
.packages {
  /* Слайдер на мобильных/планшетах */
}
.packages-swiper {
  width: 100%;
  padding-top: 3rem;
  padding-bottom: 5rem;
  box-sizing: border-box;
}
@media only screen and (max-width: 1024px) {
  .packages-swiper {
    overflow: visible;
  }
}
.packages__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  align-items: start;
}
@media only screen and (max-width: 1024px) {
  .packages__grid {
    display: flex;
    gap: 0;
  }
}
.packages__card {
  position: relative;
  background-color: #F8FAFC;
  border-radius: 3rem;
  padding: 4.5rem 2rem 6rem;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  transition: transform 0.3s ease, opacity 0.3s ease;
}
@media only screen and (max-width: 1024px) {
  .packages__card {
    width: 340px;
    max-width: 80vw;
    height: auto;
    opacity: 0.5;
    transform: scale(0.9);
    z-index: 1;
    /* Активный (центральный) слайдер выходит на передний план */
  }
  .packages__card.swiper-slide-active {
    opacity: 1;
    transform: scale(1);
    z-index: 5;
    box-shadow: 0 0 1.5rem 0 rgba(49, 54, 34, 0.3);
  }
}
@media only screen and (max-width: 576px) {
  .packages__card {
    width: 100%;
    max-width: 100%;
    transform: none;
  }
}
.packages__card--popular {
  background-color: #EEF0F3;
  margin: -3rem 0;
  padding: 7.5rem 2rem 9rem;
}
@media only screen and (max-width: 1024px) {
  .packages__card--popular {
    margin: 0;
    padding: 4.5rem 2rem 6rem;
  }
}
.packages {
  /* Точки пагинации для слайдера */
}
.packages__pagination {
  pointer-events: none;
  display: none;
}
@media only screen and (max-width: 1024px) {
  .packages__pagination {
    display: flex;
    justify-content: center;
    gap: 0.8rem;
    position: relative;
    margin-top: 2.5rem;
    bottom: 0 !important;
  }
  .packages__pagination .swiper-pagination-bullet {
    width: 1rem;
    height: 1rem;
    background: #AEC3A0;
    opacity: 0.6;
    cursor: pointer;
    transition: all 0.3s ease;
    pointer-events: auto;
  }
  .packages__pagination .swiper-pagination-bullet-active {
    background: #475531;
    opacity: 1;
    transform: scale(1.2);
  }
}

/* ----------------------- */
/* Полный цикл работ      */
/* ----------------------- */
.work-cycle {
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .work-cycle {
    margin-bottom: 6rem;
  }
}
.work-cycle {
  background: #F8FAFC;
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .work-cycle {
    padding-top: 3rem;
  }
}
.work-cycle {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .work-cycle {
    padding-bottom: 6rem;
  }
}
.work-cycle__title {
  font-size: 4.8rem;
  line-height: 5.8rem;
}
@media only screen and (max-width: 768px) {
  .work-cycle__title {
    font-size: 3.2rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 576px) {
  .work-cycle__title {
    font-size: 2.7rem;
    line-height: 3.8rem;
  }
}
.work-cycle__title {
  margin-bottom: 3rem;
}
.work-cycle__subtitle {
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .work-cycle__subtitle {
    margin-bottom: 3rem;
  }
}
.work-cycle__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  align-items: stretch;
}
@media only screen and (max-width: 1024px) {
  .work-cycle__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 680px) {
  .work-cycle__grid {
    grid-template-columns: 1fr;
  }
}
.work-cycle {
  /* Карточка */
}
.work-cycle__card {
  background-color: #FFFFFF;
  border-radius: 2rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 0 1.5rem 0 rgba(214, 223, 233, 0.4);
  transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.35s cubic-bezier(0.25, 1, 0.5, 1);
  /* Легкая анимация подъема при наведении */
}
.work-cycle__card:hover {
  transform: translateY(-0.5rem);
}
.work-cycle__card:hover .work-cycle__img {
  transform: scale(1.05);
}
.work-cycle {
  /* Оболочка изображения для эффекта Zoom */
}
.work-cycle__image-wrapper {
  width: 100%;
  overflow: hidden;
  position: relative;
}
.work-cycle__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.5s ease;
}
.work-cycle {
  /* Контентная часть */
}
.work-cycle__content {
  padding: 3rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  flex-grow: 1;
}
@media only screen and (max-width: 1280px) {
  .work-cycle__content {
    padding: 2rem;
  }
}
.work-cycle__card-title {
  font-weight: 600;
  color: #4EA915;
  margin-bottom: 0.5rem;
}
.work-cycle__text {
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding: 1.5rem 0;
  margin: 0;
}
.work-cycle__text strong {
  color: #475531;
  font-weight: 700;
}
.work-cycle {
  /* Маркированный список для 4 и 5 карточек */
}
.work-cycle__list {
  margin: 0.8rem 0 0 0;
  padding-left: 1.8rem;
  list-style-type: disc;
}
.work-cycle__list li {
  margin-bottom: 0.5rem;
}
.work-cycle__list li:last-child {
  margin-bottom: 0;
}

/* ==========================================
 * Блок табулятора (Галерея / Видео-отзыв)
 * ========================================== */
.object-tabs {
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .object-tabs {
    margin-bottom: 6rem;
  }
}
.object-tabs {
  background: #F8FAFC;
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .object-tabs {
    padding-top: 3rem;
  }
}
.object-tabs {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .object-tabs {
    padding-bottom: 6rem;
  }
}
.object-tabs__radio {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.object-tabs__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .object-tabs__nav {
    margin-bottom: 3rem;
  }
}
.object-tabs__tab-btn {
  display: inline-block;
  padding: 1.8rem 3rem;
  border-radius: 2rem;
  cursor: pointer;
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 500;
  background-color: #AEC3A0;
  color: #000000;
  transition: all 0.3s ease;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.object-tabs__tab-btn:hover {
  opacity: 0.9;
}
.object-tabs {
  /* Переключение вкладок без JS */
}
.object-tabs__content {
  display: none;
}
.object-tabs #tab-gallery:checked ~ .object-tabs__nav label[for=tab-gallery],
.object-tabs #tab-video:checked ~ .object-tabs__nav label[for=tab-video],
.object-tabs #tab-fasad:checked ~ .object-tabs__nav label[for=tab-fasad],
.object-tabs #tab-razrez:checked ~ .object-tabs__nav label[for=tab-razrez] {
  background-color: #475531;
  color: #FFFFFF;
}
.object-tabs #tab-gallery:checked ~ .object-tabs__content--gallery,
.object-tabs #tab-video:checked ~ .object-tabs__content--video,
.object-tabs #tab-fasad:checked ~ .object-tabs__content--fasad,
.object-tabs #tab-razrez:checked ~ .object-tabs__content--razrez {
  display: block;
}

/* Слайдер галереи */
.gallery-slider {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding: 0 8.333%;
}
@media only screen and (max-width: 768px) {
  .gallery-slider {
    padding: 0 5rem;
  }
}
@media only screen and (max-width: 576px) {
  .gallery-slider {
    padding: 0;
  }
}
.gallery-slider__main {
  position: relative;
  width: 100%;
  height: 55rem;
  border-radius: 2rem;
  overflow: hidden;
}
@media only screen and (max-width: 768px) {
  .gallery-slider__main {
    height: 38rem;
  }
}
@media only screen and (max-width: 576px) {
  .gallery-slider__main {
    height: 28rem;
  }
}
.gallery-slider__main-slide {
  width: 100%;
  height: 100%;
}
.gallery-slider__main-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.gallery-slider {
  /* Превью */
}
.gallery-slider__thumbs {
  position: relative;
  width: 100%;
  height: 18.7rem;
}
@media only screen and (max-width: 576px) {
  .gallery-slider__thumbs {
    height: 13rem;
  }
}
.gallery-slider__thumb-slide {
  height: 100%;
  border-radius: 1.5rem;
  overflow: hidden;
  cursor: pointer;
  opacity: 0.5;
  width: 30.7rem;
  transition: opacity 0.3s ease, border-color 0.3s ease;
}
.gallery-slider__thumb-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.gallery-slider__thumb-slide.swiper-slide-thumb-active {
  opacity: 1;
}
.gallery-slider {
  /* Стрелки */
}
.gallery-slider__prev, .gallery-slider__next {
  position: absolute;
  top: 27.5rem !important;
  transform: translateY(-50%) !important;
  width: 6.4rem;
  height: 6.4rem;
  border-radius: 1.5rem;
  background-color: #475531;
  color: #000000;
  z-index: 10;
  transition: background-color 0.2s ease;
}
.gallery-slider__prev:hover, .gallery-slider__next:hover {
  background-color: #313622;
}
.gallery-slider__prev::after, .gallery-slider__next::after {
  font-size: 1.8rem;
  font-weight: bold;
}
.gallery-slider__prev svg, .gallery-slider__next svg {
  display: none;
}
.gallery-slider__prev {
  background-image: url(../img/icons/arrow-left-white.svg);
  background-repeat: no-repeat;
  background-size: 2.5rem;
  background-position: center center;
}
.gallery-slider__next {
  background-image: url(../img/icons/arrow-right-white.svg);
  background-repeat: no-repeat;
  background-size: 2.5rem;
  background-position: center center;
}
@media only screen and (max-width: 576px) {
  .gallery-slider__prev, .gallery-slider__next {
    display: none;
  }
}

/* Контейнер видео */
.video-container {
  width: 100%;
  max-height: 60rem;
  border-radius: 2rem;
  overflow: hidden;
  background-color: #000000;
  display: flex;
  justify-content: center;
  align-items: center;
}
.video-container video {
  width: 100%;
  height: auto;
  max-height: 60rem;
  display: block;
  -o-object-fit: contain;
     object-fit: contain;
}

/* ==========================================*/
/* Блок: Этапы строительства                 */
/* ==========================================*/
.construction-steps {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .construction-steps {
    padding-bottom: 6rem;
  }
}
.construction-steps {
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .construction-steps {
    padding-top: 3rem;
  }
}
.construction-steps {
  background: #F8FAFC;
}
.construction-steps__title {
  font-size: 4.8rem;
  line-height: 5.8rem;
}
@media only screen and (max-width: 768px) {
  .construction-steps__title {
    font-size: 3.2rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 576px) {
  .construction-steps__title {
    font-size: 2.7rem;
    line-height: 3.8rem;
  }
}
.construction-steps__title {
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .construction-steps__title {
    margin-bottom: 3rem;
  }
}
.construction-steps__title {
  text-align: center;
}
.construction-steps__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
  align-items: stretch;
}
@media only screen and (max-width: 1024px) {
  .construction-steps__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 576px) {
  .construction-steps__grid {
    grid-template-columns: 1fr;
  }
}
.construction-steps__card {
  background-color: #F8FAFC;
  border-radius: 2rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  box-shadow: 0 0 1.5rem 0 rgba(214, 223, 233, 0.4);
  transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.35s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.4s ease;
  /* Легкая анимация при наведении */
}
.construction-steps__card:hover {
  transform: translateY(-0.6rem);
  box-shadow: 0 0 1.5rem 0 rgba(49, 54, 34, 0.3);
}
.construction-steps__card:hover .construction-steps__img-wrap img {
  transform: scale(1.06);
}
.construction-steps__card.is-hidden {
  display: none;
}
.construction-steps__img-wrap {
  width: 100%;
  height: 22rem;
  overflow: hidden;
  position: relative;
}
.construction-steps__img-wrap img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.5s ease;
}
.construction-steps__desc {
  padding: 2rem;
  font-size: 1.6rem;
  line-height: 2.4rem;
  font-size: 1.5rem;
  line-height: 2.1rem;
  color: #000000;
  flex-grow: 1;
}
.construction-steps__action {
  margin-top: 5rem;
  text-align: center;
}
.construction-steps__btn {
  background-color: #313622;
  color: #FFFFFF;
  padding: 1.8rem 4rem;
  border-radius: 1.5rem;
  transition: background-color 0.3s ease;
}
.construction-steps__btn:hover {
  background-color: #475531;
}

.building-views {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  align-items: stretch;
  text-align: center;
}
@media only screen and (max-width: 576px) {
  .building-views {
    grid-template-columns: repeat(1, 1fr);
  }
}
.building-views__item {
  height: 35rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
  border-radius: 1.5rem;
  box-shadow: 0 0 1.5rem 0 rgba(214, 223, 233, 0.4);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  overflow: hidden;
}
.building-views__item:hover {
  transform: translateY(0.3rem);
  box-shadow: 0 0 1.5rem 0 rgba(49, 54, 34, 0.3);
}
.building-views__item img {
  max-width: 90%;
  max-height: 90%;
  -o-object-fit: contain;
     object-fit: contain;
}

.services {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .services {
    padding-bottom: 6rem;
  }
}
.services__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .services__grid {
    margin-bottom: 3rem;
  }
}
@media only screen and (max-width: 768px) {
  .services__grid {
    grid-template-columns: 1fr;
  }
}
.services__card {
  border-radius: 3rem;
  padding: 6.4rem 6rem 5.4rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
@media only screen and (max-width: 768px) {
  .services__card {
    border-radius: 2rem;
    padding: 4.4rem 3rem 2.4rem;
  }
}
@media only screen and (max-width: 576px) {
  .services__card {
    padding: 3.5rem 2rem;
  }
}
.services__card--first-box {
  background: url(../img/meeting-with-the-architect.jpg) no-repeat top center;
  background-size: cover;
}
.services__card--full {
  background: url(../img/construction-and-delivery.jpg) no-repeat top center;
  grid-column: 1/-1;
  background-size: cover;
}
.services__card--light {
  background-color: #F8FAFC;
}
.services__card--light-gradient {
  background: linear-gradient(to right, #F8FAFC 0%, rgb(227, 229, 225) 100%);
}
.services__card--bg-img {
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
}
.services__card--bg-img::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.2) 60%, rgba(0, 0, 0, 0) 100%);
  z-index: 1;
}
.services__card--bg-img .services__card-content {
  position: relative;
  z-index: 2;
  max-width: 32rem;
}
.services__card--bg-img .services__card-title {
  color: #ffffff;
}
.services__card--bg-img .services__card-text {
  color: rgba(255, 255, 255, 0.85);
}
.services__card-text {
  width: 100%;
  max-width: 36rem;
}
.services__card-title {
  width: 100%;
  max-width: 36rem;
}
.services__card-title {
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1.2rem;
}
.services__card-text {
  font-size: 1.5rem;
  line-height: 1.45;
}
.services__cta {
  text-align: center;
  margin: 0 auto;
  font-size: 1.6rem;
  line-height: 2.4rem;
}

.services-mortgage {
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .services-mortgage {
    padding-bottom: 6rem;
  }
}
.services-mortgage {
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .services-mortgage {
    padding-top: 3rem;
  }
}
.services-mortgage {
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .services-mortgage {
    margin-bottom: 6rem;
  }
}
.services-mortgage {
  background: #F8FAFC;
}
.services-mortgage__wrapper {
  display: flex;
  justify-content: space-between;
  gap: 4rem;
  align-items: stretch;
}
@media only screen and (max-width: 1024px) {
  .services-mortgage__wrapper {
    flex-direction: column;
    gap: 3rem;
  }
}
.services-mortgage__info {
  width: calc(50% - 2rem);
}
@media only screen and (max-width: 1024px) {
  .services-mortgage__info {
    width: 100%;
    padding-bottom: 12rem;
  }
}
@media only screen and (max-width: 1024px) and (max-width: 576px) {
  .services-mortgage__info {
    padding-bottom: 6rem;
  }
}
.services-mortgage__info a {
  text-decoration: none;
}
.services-mortgage__grid {
  width: 41%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
}
@media only screen and (max-width: 1024px) {
  .services-mortgage__grid {
    width: 100%;
  }
}
@media only screen and (max-width: 576px) {
  .services-mortgage__grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}
.services-mortgage__card {
  background-color: #FFFFFF;
  border-radius: 1rem;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  border: 1px solid transparent;
  box-shadow: 0 0 1.5rem 0 rgba(214, 223, 233, 0.4);
  font-size: 1.6rem;
  line-height: 2.4rem;
  text-align: center;
  transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.35s ease, border-color 0.35s ease;
}
.services-mortgage__card:hover {
  transform: translateY(-0.3rem);
  box-shadow: 0 1rem 2.5rem rgba(49, 54, 34, 0.05);
  border-color: rgba(174, 195, 160, 0.3);
}
@media only screen and (max-width: 768px) {
  .services-mortgage__card {
    padding: 2.5rem 2rem;
  }
}
.services-mortgage__card-title {
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 700;
  color: #475531;
  margin-bottom: 0;
}

.services-design {
  width: 100%;
  padding-bottom: 22rem;
  overflow: hidden;
  position: relative;
}
@media only screen and (max-width: 1280px) {
  .services-design {
    padding-bottom: 25rem;
  }
}
@media only screen and (max-width: 768px) {
  .services-design {
    max-width: 50rem;
    margin: 0 auto;
    padding-bottom: 6rem;
  }
}
.services-design::after {
  content: "";
  bottom: 0;
  right: -15%;
  width: 83rem;
  height: 48.5rem;
  background: url(../img/bgBlueprint.png) no-repeat;
  background-size: cover;
  position: absolute;
  z-index: 2;
  display: block;
}
@media only screen and (max-width: 768px) {
  .services-design::after {
    display: none;
  }
}
.services-design::before {
  width: 100%;
  height: 11.7rem;
  bottom: 0;
  left: 0;
  content: "";
  position: absolute;
  display: block;
  background: #F8FAFC;
  z-index: 1;
}
@media only screen and (max-width: 768px) {
  .services-design::before {
    display: none;
  }
}
.services-design__form {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  position: relative;
  z-index: 3;
}
@media only screen and (max-width: 768px) {
  .services-design__form {
    flex-wrap: wrap;
  }
}
.services-design__form-colinfo {
  width: 55%;
}
@media only screen and (max-width: 768px) {
  .services-design__form-colinfo {
    width: 100%;
  }
}
.services-design__spec {
  display: flex;
  gap: 3.4rem;
  padding: 2.5rem 0;
}
.services-design__spec span {
  font-weight: 600;
  display: block;
}

.actions {
  width: 100%;
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .actions {
    margin-bottom: 6rem;
  }
}
.actions__list {
  margin-top: 6rem;
}
@media only screen and (max-width: 576px) {
  .actions__list {
    margin-top: 3rem;
  }
}
.actions__list {
  gap: 9rem;
  display: flex;
  flex-direction: column;
}
.actions__card {
  display: flex;
  justify-content: space-between;
}
@media only screen and (max-width: 576px) {
  .actions__card {
    flex-direction: column;
  }
}
.actions__img {
  flex-shrink: 0;
  width: 41%;
}
@media only screen and (max-width: 576px) {
  .actions__img {
    width: 100%;
  }
}
.actions__img img {
  width: 100%;
  border-radius: 3rem;
}
@media only screen and (max-width: 1024px) {
  .actions__img img {
    border-radius: 2rem;
  }
}
.actions__card-cont {
  width: 55%;
}
@media only screen and (max-width: 576px) {
  .actions__card-cont {
    width: 100%;
  }
}
.actions__title {
  margin-bottom: 3rem;
}
.actions__card-cont-text {
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-bottom: 3rem;
}

.mortgage-hero {
  width: 100%;
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .mortgage-hero {
    padding-bottom: 6rem;
  }
}
.mortgage-hero__list {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
}
.mortgage-hero__card {
  width: calc(33% - 1rem);
  background: #F8FAFC;
  box-sizing: border-box;
  border-radius: 3rem;
  text-align: center;
  padding: 4rem 2.6rem 6rem;
  transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  will-change: transform, box-shadow;
}
.mortgage-hero__card:hover {
  transform: translateY(-0.6rem);
  box-shadow: 0 1.2rem 3rem rgba(0, 0, 0, 0.08);
}
.mortgage-hero__card:hover .mortgage-hero__img {
  transform: scale(1.05);
}
@media only screen and (max-width: 1024px) {
  .mortgage-hero__card {
    width: calc(50% - 1rem);
  }
}
@media only screen and (max-width: 576px) {
  .mortgage-hero__card {
    width: 100%;
  }
}
.mortgage-hero__img {
  margin-bottom: 3rem;
  transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  will-change: transform;
}
.mortgage-hero__img img {
  display: inline-block;
}
.mortgage-hero__title {
  color: #475531;
  margin-bottom: 1.5rem;
}

.special-offers {
  width: 100%;
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .special-offers {
    padding-bottom: 6rem;
  }
}
.special-offers {
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .special-offers {
    padding-top: 3rem;
  }
}
.special-offers {
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .special-offers {
    margin-bottom: 6rem;
  }
}
.special-offers {
  background: #F8FAFC;
}
.special-offers__list {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
}
@media only screen and (max-width: 1024px) {
  .special-offers__list {
    flex-direction: column;
    max-width: 60rem;
    margin: 0 auto;
  }
}
.special-offers__card {
  flex: 1;
  background-color: #FFFFFF;
  border-radius: 2rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 0 1.5rem 0 rgba(214, 223, 233, 0.4);
  will-change: transform, box-shadow;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
.special-offers__card:hover {
  transform: translateY(-0.3rem);
  box-shadow: 0 1.2rem 3rem rgba(49, 54, 34, 0.12);
}
.special-offers__card .special-offers__bg {
  transform: scale(1.05);
}
.special-offers__header {
  position: relative;
  height: 18rem;
  overflow: hidden;
  display: flex;
  align-items: flex-start;
  padding: 2.4rem;
}
.special-offers__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: 1;
  transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}
.special-offers__bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0) 100%);
}
.special-offers__title {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  padding: 1.5rem 2rem 2.8rem;
  z-index: 2;
  color: #FFFFFF;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.3;
  text-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.5);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
}
.special-offers__title span {
  font-size: 2.8rem;
}
.special-offers__body {
  padding: 1rem 2rem 6rem;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.special-offers__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  gap: 1rem;
  margin-bottom: 2rem;
  color: #313622;
  letter-spacing: -0.03em;
  text-transform: uppercase;
}
.special-offers__badge-icon {
  stroke: currentColor;
  flex-shrink: 0;
}
.special-offers__specs {
  display: flex;
  flex-direction: column;
  margin: 0 0 5rem;
}
.special-offers__spec-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding: 1rem 0;
  border-top: 1px solid #D6DFE9;
}
.special-offers__spec-item:first-child {
  border-top: none;
}
.special-offers__spec-item dd {
  margin: 0;
  font-weight: 600;
}
.special-offers__desc {
  margin: 0 0 3.2rem 0;
  min-height: 4.2rem;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.special-offers__btn {
  width: 100%;
  margin-top: auto;
  text-align: center;
  padding: 1.6rem 2rem;
  border-radius: 5rem;
  background: #475531;
  color: #FFFFFF;
  font-weight: 600;
  font-size: 1.5rem;
  border: none;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
}
.special-offers__btn:hover {
  background-color: #313622;
  box-shadow: 0 0.4rem 1.2rem rgba(71, 85, 49, 0.3);
}
.special-offers__btn:active {
  transform: translateY(0);
}

.how-work {
  width: 100%;
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .how-work {
    margin-bottom: 6rem;
  }
}
.how-work__steps {
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 3rem;
  text-align: center;
}
@media only screen and (max-width: 768px) {
  .how-work__steps {
    flex-direction: column;
    text-align: left;
    max-width: 60rem;
    margin: 0 auto;
  }
}
.how-work__steps::before {
  content: "";
  width: 80%;
  height: 1px;
  top: 5rem;
  left: 10%;
  background: #475531;
  position: absolute;
  display: block;
  z-index: 1;
  justify-content: flex-start;
  opacity: 0.6;
  transition: opacity 0.3s ease;
}
@media only screen and (max-width: 768px) {
  .how-work__steps::before {
    width: 1px;
    height: 80%;
    left: 5rem;
  }
}
.how-work__step {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-width: 768px) {
  .how-work__step {
    align-items: center;
    flex-direction: row;
    gap: 2rem;
  }
}
.how-work__step:hover .how-work__icon {
  transform: translateY(-0.6rem);
  box-shadow: 0 1rem 2.5rem rgba(71, 85, 49, 0.25);
  border-color: rgba(174, 195, 160, 0.4);
}
.how-work__step:hover .how-work__nubmer {
  transform: scale(1.15);
  background-color: #313622;
}
.how-work__step:hover .how-work__title {
  color: #475531;
}
.how-work__icon {
  width: 10rem;
  height: 10rem;
  border-radius: 50%;
  border: 4px solid #FFFFFF;
  background: #F8FAFC;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  margin-bottom: 2.5rem;
  flex-shrink: 0;
  transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.3s cubic-bezier(0.25, 1, 0.5, 1), border-color 0.3s ease;
  will-change: transform, box-shadow;
}
@media only screen and (max-width: 576px) {
  .how-work__icon {
    width: 8rem;
    height: 8rem;
  }
}
@media only screen and (max-width: 576px) {
  .how-work__icon img {
    width: 4rem;
    height: 4rem;
  }
}
.how-work__nubmer {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: #475531;
  color: #FFFFFF;
  position: absolute;
  top: 0;
  right: calc(50% - 4.8rem);
  border: 2px solid #FFFFFF;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.3s ease;
  will-change: transform;
}
@media only screen and (max-width: 768px) {
  .how-work__nubmer {
    left: 7rem;
    right: auto;
  }
}
@media only screen and (max-width: 576px) {
  .how-work__nubmer {
    left: 5.8rem;
  }
}
.how-work__title {
  margin-bottom: 0.7rem;
}

.faq {
  width: 100%;
  padding-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .faq {
    padding-bottom: 6rem;
  }
}
.faq {
  padding-top: 9rem;
}
@media only screen and (max-width: 576px) {
  .faq {
    padding-top: 3rem;
  }
}
.faq {
  margin-bottom: 12rem;
}
@media only screen and (max-width: 576px) {
  .faq {
    margin-bottom: 6rem;
  }
}
.faq {
  background: #F8FAFC;
}
.faq__container {
  max-width: 107rem;
}
.faq__accordion {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.faq__item {
  background-color: #FFFFFF;
  border-radius: 1.5rem;
  overflow: hidden;
  transition: box-shadow 0.3s ease;
  border: 1px solid rgba(214, 223, 233, 0.4);
}
.faq__item[open] .faq__icon {
  transform: rotate(180deg);
}
.faq__question {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2rem 3.5rem;
  cursor: pointer;
  font-weight: 600;
  font-size: 2rem;
  line-height: 2.4rem;
  color: #313622;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: color 0.3s ease;
}
.faq__question::-webkit-details-marker {
  display: none;
}
.faq__question:hover {
  color: #475531;
}
@media only screen and (max-width: 576px) {
  .faq__question {
    padding: 2rem 1.5rem;
    font-size: 1.7rem;
  }
}
.faq__icon {
  width: 2.2rem;
  height: 2.2rem;
  flex-shrink: 0;
  margin-left: 2rem;
  background: url(../img/icons/icons-color/arrow-faq.svg) no-repeat center center;
  background-size: contain;
  transform: rotate(0deg);
  transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.faq__answer {
  padding: 2rem 6rem;
  font-style: italic;
  font-size: 1.6rem;
  line-height: 2.4rem;
  background: rgba(214, 223, 233, 0.4);
}
@media only screen and (max-width: 576px) {
  .faq__answer {
    padding: 1rem 2rem;
  }
}

.reviews-box {
  width: 100%;
  overflow: hidden;
}

.blog {
  width: 100%;
}
.blog__filter {
  margin-bottom: 3rem;
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
}
.blog__filter-btn {
  padding: 1.8rem 3rem;
  border-radius: 2rem;
  background-color: #AEC3A0;
  color: #000000;
  font-weight: 500;
  font-size: 2rem;
  line-height: 2.4rem;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.2s ease;
}
@media only screen and (max-width: 1024px) {
  .blog__filter-btn {
    padding: 1.2rem 2rem;
    border-radius: 1rem;
  }
}
.blog__filter-btn:hover {
  opacity: 0.85;
}
.blog__filter-btn.is-active {
  background-color: #313622;
  color: #FFFFFF;
}
.blog__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  width: 100%;
  margin-bottom: 6rem;
}
@media only screen and (max-width: 576px) {
  .blog__grid {
    margin-bottom: 3rem;
  }
}
@media only screen and (max-width: 1024px) {
  .blog__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 680px) {
  .blog__grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
}

.blog-card {
  background: #FFFFFF;
  border: 1px solid rgba(214, 223, 233, 0.6);
  border-radius: 2rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  will-change: transform, box-shadow;
}
.blog-card:hover {
  transform: translateY(-0.6rem);
  box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.08);
}
.blog-card:hover .blog-card__img {
  transform: scale(1.05);
}
.blog-card:hover .blog-card__link::after {
  transform: translateX(0.4rem);
}
.blog-card__image-wrap {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.blog-card__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.5s ease;
}
.blog-card__badge {
  position: absolute;
  top: 1.7rem;
  left: 1.7rem;
  padding: 0.6rem 2rem;
  background-color: rgba(71, 85, 49, 0.7);
  color: #FFFFFF;
  border-radius: 1rem;
  z-index: 2;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.blog-card__content {
  padding: 1.2rem 2rem 3rem;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
@media only screen and (max-width: 576px) {
  .blog-card__content {
    padding: 2rem;
  }
}
.blog-card__meta {
  display: flex;
  align-items: center;
  gap: 6rem;
  margin-bottom: 2rem;
}
.blog-card__meta-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: #475531;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.blog-card__meta-item::before {
  content: "";
  display: inline-block;
  width: 2rem;
  height: 2rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.blog-card__meta-item--date::before {
  background-image: url("../img/icons/icon-calendar.svg");
}
.blog-card__meta-item--time::before {
  background-image: url("../img/icons/icon-time.svg");
}
.blog-card__title {
  font-weight: 500;
  margin-bottom: 1.5rem;
}
.blog-card__title a {
  color: #313622;
  text-decoration: none;
  transition: color 0.3s ease;
}
.blog-card__title a:hover {
  color: #475531;
  text-decoration: underline;
  text-decoration-thickness: 1px;
}
.blog-card__text {
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-bottom: 4rem;
  flex-grow: 1;
}
.blog-card__link {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: #475531;
  font-weight: 600;
  font-size: 1.6rem;
  line-height: 2.4rem;
  text-decoration: none;
  align-self: flex-start;
  transition: color 0.3s ease;
}
.blog-card__link::after {
  content: "›";
  font-size: 1.8rem;
  line-height: 1;
  transition: transform 0.3s ease;
}
.blog-card__link:hover {
  color: #313622;
}

/* ==========================================
 * * Стилизация всплывающих уведомлений AjaxForm (jGrowl)
 * * ========================================== */
#jGrowl {
  top: 2rem !important;
  right: 2rem !important;
  z-index: 99999 !important;
  font-family: "Montserrat", sans-serif !important;
}

#jGrowl .jGrowl-notification {
  border-radius: 1.5rem !important;
  padding: 2rem 2.5rem !important;
  font-size: 1.6rem !important;
  line-height: 2.4rem !important;
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.15) !important;
  border: none !important;
  background: #313622 !important;
  color: #FFFFFF !important;
  position: relative !important;
  margin-bottom: 1rem !important;
}

/* Уведомление об успешной отправке */
#jGrowl .af-message-success {
  background: linear-gradient(135deg, #475531 0%, #1C2D00 100%) !important;
  border-left: 5px solid #4EA915 !important;
}

/* Уведомление об ошибке */
#jGrowl .af-message-error {
  background: linear-gradient(135deg, #7A2222 0%, #3B0000 100%) !important;
  border-left: 5px solid #FF4D4D !important;
}

/* Кнопка закрытия (крестик) */
#jGrowl .jGrowl-close {
  color: #FFFFFF !important;
  font-size: 2rem !important;
  line-height: 1 !important;
  opacity: 0.7 !important;
  transition: opacity 0.2s ease !important;
  top: 1rem !important;
  right: 1.2rem !important;
}

#jGrowl .jGrowl-close:hover {
  opacity: 1 !important;
}

/* ==========================================
 * * Стилизация выпадающего поиска mSearch2
 * * ========================================== */
/* Контейнер выпадающего списка автокомплита */
.ui-autocomplete.ui-menu {
  position: absolute !important;
  z-index: 10000 !important;
  background: #FFFFFF !important;
  border-radius: 1.5rem !important;
  box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.25) !important;
  border: 1px solid #AEC3A0 !important;
  padding: 1rem 0 !important;
  max-height: 40rem !important;
  overflow-y: auto !important;
  box-sizing: border-box !important;
  font-family: "Montserrat", sans-serif !important;
}

/* Пункт выпадающего списка */
.ui-autocomplete .ui-menu-item {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Ссылка-обертка пункта */
.ui-autocomplete .ui-menu-item-wrapper,
.ui-autocomplete .mse2-ac-link {
  display: block !important;
  padding: 1.2rem 2rem !important;
  color: #313622 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  border-bottom: 1px solid #F5F5F5 !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
}

.ui-autocomplete .ui-menu-item:last-child .ui-menu-item-wrapper,
.ui-autocomplete .ui-menu-item:last-child .mse2-ac-link {
  border-bottom: none !important;
}

/* Эффект наведения на результат */
.ui-autocomplete .ui-menu-item-wrapper:hover,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active,
.ui-autocomplete .mse2-ac-link:hover {
  background-color: #F8FAFC !important;
  color: #475531 !important;
}

/* Оболочка элемента результата */
.mse2-ac-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.4rem !important;
}

/* Заголовок найденного объекта */
.mse2-ac-title {
  font-size: 1.8rem !important;
  font-weight: 600 !important;
  color: #313622 !important;
  line-height: 2.2rem !important;
}

.ui-menu-item-wrapper:hover .mse2-ac-title {
  color: #475531 !important;
}

/* Текст анонса / отрывок совпадения */
.mse2-ac-intro {
  font-size: 1.4rem !important;
  line-height: 2rem !important;
  color: #656565 !important;
}

/* Подсветка совпавшего слова (теги <b>) */
.mse2-ac-item b {
  color: #4EA915 !important;
  font-weight: 700 !important;
  background-color: rgba(78, 169, 21, 0.12) !important;
  padding: 0 0.3rem !important;
  border-radius: 0.3rem !important;
}

/* ==========================================*/
/* Мобильная кнопка аккордеона фильтра       */
/* ==========================================*/
.catalog-filter__mobile-toggle {
  display: none;
  width: 100%;
  padding: 1.2rem 2rem;
  background-color: #475531;
  color: #FFFFFF;
  border: none;
  border-radius: 1.5rem;
  font-family: "Montserrat", sans-serif;
  font-size: 1.6rem;
  line-height: 2.4rem;
  font-weight: 600;
  cursor: pointer;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.5rem;
  transition: background-color 0.3s ease;
}

.catalog-filter__mobile-toggle:hover {
  background-color: #313622;
}

.catalog-filter__mobile-toggle-icon {
  width: 1.2rem;
  height: 0.8rem;
  display: inline-block;
  background: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%3C%23ffffff' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center center;
  background-size: contain;
  transition: transform 0.3s ease;
}

.catalog-filter.is-open-mobile .catalog-filter__mobile-toggle-icon {
  transform: rotate(180deg);
}

@media only screen and (max-width: 768px) {
  .catalog-filter__mobile-toggle {
    display: flex;
  }
  /* Сворачиваем форму по умолчанию на мобиле */
  .catalog-filter__form {
    display: none;
  }
  .catalog-filter.is-open-mobile .catalog-filter__form {
    display: grid;
  }
  .catalog-filter__controls {
    display: none;
  }
  .catalog-filter.is-open-mobile .catalog-filter__controls {
    display: flex;
  }
}
/* ==========================================
 * * Стили страницы Контактов
 * * ========================================== */
.contacts-info {
  margin-bottom: 6rem;
}

.contacts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(28rem, 1fr));
  gap: 3rem;
  margin-bottom: 6rem;
  margin-top: 6rem;
}
@media only screen and (max-width: 576px) {
  .contacts-grid {
    margin-top: 3rem;
  }
}

.contacts-card {
  background: #F8FAFC;
  padding: 3.5rem;
  border-radius: 2rem;
  box-shadow: 0 0 1.5rem rgba(214, 223, 233, 0.4);
}

.contacts-card__title {
  color: #475531;
  margin-bottom: 1.5rem;
}

.contacts-card__phone {
  font-size: 2.4rem;
  line-height: 2.8rem;
  font-weight: 700;
  color: #313622;
  text-decoration: none;
  display: block;
  margin-bottom: 0.8rem;
}

.contacts-card__email {
  font-size: 2rem;
  line-height: 2.4rem;
  font-weight: 600;
  color: #313622;
  text-decoration: none;
  display: block;
  margin-bottom: 0.8rem;
}

.contacts-card__note {
  margin: 0;
  color: #656565;
  font-size: 1.6rem;
  line-height: 2.4rem;
}

.contacts-socials {
  display: flex;
  gap: 1.5rem;
  margin-top: 1rem;
}

.contacts-socials img {
  width: 3.6rem;
  height: 3.6rem;
}

/*========================================== */
/* Всплывающее окно согласия Cookie          */
/*========================================== */
.cookie-banner {
  position: fixed;
  bottom: 2rem;
  left: 2rem;
  max-width: 48rem;
  background: #FFFFFF;
  border-radius: 2rem;
  box-shadow: 0 1rem 4rem rgba(0, 0, 0, 0.2);
  padding: 2.5rem;
  z-index: 99999;
  border: 1px solid #AEC3A0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(3rem);
  transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1), transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.4s;
}
.cookie-banner.is-active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.cookie-banner__text {
  font-size: 1.5rem;
  line-height: 2.2rem;
  color: #313622;
  margin: 0 0 2rem 0;
}

.cookie-banner__buttons {
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
}

.cookie-banner__btn {
  padding: 1.2rem 2.5rem;
  font-size: 1.5rem;
  border-radius: 1.2rem;
  transition: background-color 0.2s ease, transform 0.15s ease;
}
.cookie-banner__btn:hover {
  transform: translateY(-2px);
}
.cookie-banner__btn:active {
  transform: translateY(0);
}

.cookie-banner__btn--decline {
  background: #EEF0F3;
  color: #313622;
}
.cookie-banner__btn--decline:hover {
  background: #D6DFE9;
}

@media only screen and (max-width: 576px) {
  .cookie-banner {
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    max-width: calc(100vw - 2rem);
    padding: 2rem;
  }
}/*# sourceMappingURL=style.css.map */