@charset "utf-8";

/* ------------------------------- RESET ------------------------------- */

html {margin: 0; padding: 0; height: 100%;}
body, div, span, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, a, font, small, strong, b, u, i, center, label, form, fieldset,
input, button, textarea, img, p, table, tr, th, td, dl, dt, dd {
    margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; background: transparent;
}
table {border-collapse: collapse; border-spacing: 0;}
ol, ul, li {list-style: none;}
h1, h2, h3, h4, h5, h6 {font-size: 100%; font-weight: normal;}
input, button, textarea, select, optgroup, option {
    font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit;
}
input, button, textarea, select {font-size: 100%; display: block;}
input[type=text], input[type=submit], textarea{-webkit-appearance: none;}
input[type=text]::placeholder {color: #929BAD; font-size: 14px;}
input:-webkit-autofill {
    -webkit-box-shadow: inset 0 0 0 50px #fff !important; -webkit-text-fill-color: #1d1d1e !important; color: #1d1d1e !important;
}
select {outline: 0;}
:focus {outline: none;}
* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
*:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
::-moz-focus-inner {border: 0; padding: 0;}

/* ------------------------------- DEFAULT ------------------------------- */

html {-webkit-tap-highlight-color: rgba(0, 0, 0, 0); scroll-behavior: smooth; overflow-x: hidden; width: 100%;}
body {
    background: #EFF1F6; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; direction: ltr;
    color: #1A222A; display: block; min-width: 320px; font-family: 'SF Pro', sans-serif; font-weight: 400;
    font-size: 13px; width: 100%; position: relative; line-height: 1.2; overflow-x: hidden;
    -webkit-font-smoothing: subpixel-antialiased; -moz-osx-font-smoothing: auto;
}
div, label {display: block; line-height: 130%;}
img {width: 100%;}
sup {top: -0.5em; font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}

a {
    color: #5b6936; text-decoration: none; -webkit-transition: all 0.2s ease-out; -o-transition:all 0.2s ease-out;
    transition: all 0.2s ease-out; line-height: 130%;
}
a:hover {text-decoration: none;}

img {vertical-align: middle;}
.dn {display: none !important;}

.active_link {color: #5b6936; font-weight: 700;}

.fixed {position: fixed;}
.wrap {width: 100%;padding: 0 32px;margin-left: auto;margin-right: auto;max-width: 1440px;}

@media only screen and (max-width: 1000px) {
    .bayside_plan_menu.wrap {padding-top: 0 !important; margin-top: 0 !important; padding-bottom: 0 !important; margin-bottom: 0 !important;}
    #tab_1.wrap, #tab_1 > .wrap {padding-top: 0 !important; margin-top: 0 !important; padding-bottom: 0 !important; margin-bottom: 0 !important;}
}

.btn {
    white-space: nowrap; width: 288px; height: 64px; display: flex; cursor: pointer; align-items: center;
    color: #FFF; border-radius: 12px; background: #5b6936; padding: 14px 24px;
    font-size: 18px; font-weight: 500; transition: .2s;
}
.btn > div {text-align: center; width: 100%; user-select: none;}
.btn > span {text-align: center; width: 100%; user-select: none; display: block;}
.btn:hover {background: #4a5630; box-shadow: 0 4px 12px rgba(91, 105, 54, 0.3);}
.btn.disabled {background: #EFF1F6 !important; color: #555966 !important;}

/* ensure centered label for modern houses CTA */
.modern_houses_cta_btn{justify-content: center;}
.modern_houses_cta_btn > div{width: auto;}

.block_name {
    padding-left: 0; color: #9497A2; font-size: 12px; font-weight: 500; line-height: 130%; text-transform: uppercase;
}
h2 {padding-left: 0; color: #1A222A; font-size: 40px; font-weight: 700; padding-top: 10px; line-height: 120%;}

.video_play {
    height: 40px; width: 40px; position: absolute; top: calc(50% - 20px); left: calc(50% - 20px); z-index: 5;
    border-radius: 50%; background: white; opacity: 0.8; transition: opacity .2s; cursor: pointer;
}
.video_play i {font-size: 40px; line-height: 40px; margin-left: 1px;}
.video_play:hover {opacity: 1;}

@media only screen and (max-width: 1000px) {
    .block_name {padding-left: 0; font-size: 11px;}
    h2 {padding-left: 0; font-size: 24px;}
    #hero_rublevochka {padding: 0 32px;}
}

@media only screen and (max-width: 800px) {
    .btn {font-size: 16px; width: 231px; height: 56px; line-height: 56px;}
}

@media only screen and (max-width: 600px) {
    .wrap {padding: 0 12px;}
    #hero_rublevochka {padding: 0 12px;}
}

@media only screen and (max-width: 600px){
    .house_project_facts{grid-template-columns: 1fr;}
}

input {border-radius: 12px; padding: 16px 21px; color: #FFF;}

::placeholder {color: #FFF; font-size: 16px; font-weight: 400; line-height: 130%; opacity: 0.6;}

#main_sheet {display: flex; flex-direction: column; min-height: 100vh; overflow-x: hidden; width: 100%; max-width: 100%;}

/* ------------------------------- ICONS -------------------------------- */

i {
    display: inline-block; font-family: 'glyphicons', sans-serif; font-size: 18px; font-style: normal; text-rendering: auto;
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}

.icon_arrow_left:before { content: '\e800'; }
.icon_area:before { content: '\e801'; }
.icon_bank:before { content: '\e802'; }
.icon_bulb:before { content: '\e803'; }
.icon_car:before { content: '\e804'; }
.icon_chat:before { content: '\e805'; }
.icon_download:before { content: '\e806'; }
.icon_home:before { content: '\e807'; }
.icon_close:before { content: '\e808'; }
.icon_envelope:before { content: '\e809'; }
.icon_eat:before { content: '\e80a'; }
.icon_gas:before { content: '\e80b'; }
.icon_park:before { content: '\e80c'; }
.icon_kids:before { content: '\e80d'; }
.icon_location:before { content: '\e80e'; }
.icon_pause:before { content: '\e80f'; }
.icon_play:before { content: '\e810'; }
.icon_pin:before { content: '\e811'; }
.icon_telegram:before { content: '\e812'; }
.icon_support:before { content: '\e813'; }
.icon_success:before { content: '\e814'; }
.icon_walking:before { content: '\e816'; }
.icon_water:before { content: '\e817'; }
.icon_arrow_right2:before { content: '\e818'; }
.icon_play_1:before { content: '\e819'; }
.icon_tennis:before { content: '\e81a'; }
.icon_timer:before { content: '\e81b'; }
.icon_paper:before { content: '\e81c'; }
.icon_arrow_right:before { content: '\e81d'; }
.icon_bed:before { content: '\e81e'; }
.icon_parking:before { content: '\e81f'; }
.icon_phone:before { content: '\e820'; }
.icon_arrow_left2:before { content: '\e821'; }
.icon_video_volume_min:before { content: '\e822'; }
.icon_video_volume_off:before { content: '\e823'; }
.icon_video_fullscreen:before { content: '\e824'; }
.icon_video_minscreen:before { content: '\e825'; }
.icon_video_play:before { content: '\e826'; }
.icon_video_previous:before { content: '\e827'; }
.icon_video_next:before { content: '\e828'; }
.icon_video_pause:before { content: '\e829'; }
.icon_video_volume_max:before { content: '\e82a'; }
.icon_video_next_time:before { content: '\e83A'; }
.icon_video_prev_time:before { content: '\e82c'; }
.icon_location_2:before { content: '\e82d'; }
.icon_filters:before { content: '\e82e'; }
.icon_forest:before { content: '\e82f'; }
.icon_pines:before { content: '\e830'; }
.icon_lake:before { content: '\e831'; }
.icon_top:before { content: '\e832'; }
.icon_rocket:before { content: '\e833'; }
.icon_calendar:before { content: '\e83c'; }
.icon_tennis_racket:before { content: '\e834'; }
.icon_parking_1:before { content: '\e835'; }
.icon_sport:before { content: '\e836'; }
.icon_beach:before { content: '\e837'; }
.icon_workout:before { content: '\e838'; }
.icon_volleyball:before { content: '\e839'; }
.icon_pirs:before { content: '\e862'; }
.icon_o2:before { content: '\e82b'; }

/* ------------------------------- GALLERY MODAL ------------------------------- */

#gallery_modal_bayside, #gallery_modal_woodside {width: 100%; opacity: 1; pointer-events: auto; transition: all 0.35s ease-out;}

.gallery_modal_menu {height: 54px; z-index: 2000; position: fixed; top: 0; right: 0; align-items: center; padding: 0 20px;}
.gallery_modal_menu > div:first-child {
    white-space: nowrap; position: absolute; line-height: 54px; right: 63px; color: #FFF; font-size: 16px; font-weight: 500;
    display: none;
}
.gallery_modal_menu > div > i {
    padding: 10px; font-size: 14px; color: #fff; position: absolute; top: 9px; right: 14px; opacity: 0.5; cursor: pointer;
    transition: all 0.35s ease-out;
}
.gallery_modal_menu > div > i:hover {opacity: 1;}

.gallery_modal_body {height: calc(100vh - 54px); display: flex; align-items: center;}
.gallery_modal_body > div {padding-top: 80px; width: 60%; margin: 0 auto; display: flex; flex-direction: column; align-items: center;}

#gallery_modal_photo_bayside, #gallery_modal_photo_woodside,
[id^="finishing_gallery_photo_"] {
    position: relative; min-height: calc(100vh - 200px); width: 100%; display: flex; justify-content: center;
}
#gallery_modal_photo_bayside > img, #gallery_modal_photo_woodside > img,
[id^="finishing_gallery_photo_"] > img {
    position: absolute; top: 0; bottom: 0; left: auto; width: 100%; object-fit: cover; height: calc(100vh - 200px);
    border-radius: 8px; z-index: 5; opacity: 0; transition: all 0.35s ease-out; display: block;
}
#gallery_modal_photo_bayside > img.visible, #gallery_modal_photo_woodside > img.visible,
[id^="finishing_gallery_photo_"] > img.visible {opacity: 1; z-index: 10;}
#gallery_modal_photo_bayside > img.hidden, #gallery_modal_photo_woodside > img.hidden,
[id^="finishing_gallery_photo_"] > img.hidden { z-index: 1; pointer-events: none; opacity: 0;}

.gallery_modal_thumbs {padding: 28px 20px; width: 100%; display: flex; align-items: end;}
.gallery_modal_thumbs > div {display: flex; padding-bottom: 20px; overflow: auto;}
.gallery_modal_thumbs > div::-webkit-scrollbar {height: 4px;}
.gallery_modal_thumbs > div::-webkit-scrollbar-track {background: transparent;}
.gallery_modal_thumbs > div::-webkit-scrollbar-thumb {
    background: rgba(150, 150, 150, 0.85); border-radius: 10px; cursor: grab; mix-blend-mode: difference;
}
.gallery_modal_thumbs > div > div {
    position: relative; overflow: hidden; min-width: 50px; height: 50px; margin-left: 10px; border-radius: 2px;
    image-rendering: auto; cursor: pointer; transition: all 0.35s ease-out;
}
.gallery_modal_thumbs > div > div:first-child {margin-left: 0;}
.gallery_modal_thumbs > div > div:hover {border: 2px solid #5b6936;}
.gallery_modal_thumbs > div > div.active {border: 2px solid #5b6936;}
.gallery_modal_thumbs > div > div img {position: absolute; width: 100%; height: 100%; object-fit: cover;}

.gallery_modal_controls {position: absolute; transform: translate(-50%, -50%); top: calc((100vh - 172px) / 2 + 40px); left: 50%; width: 100%; display: flex; padding: 0 20px; z-index: 10;}
.gallery_modal_controls > div {display: flex; width: 50%;}
.gallery_modal_controls > div:nth-of-type(2) {justify-content: end;}
.gallery_modal_controls > div > div {border-radius: 50%; height: 42px; width: 42px; border: 1px solid #BCC0C6; opacity: 0.6; cursor: pointer; text-align: center; transition: all 0.35s ease-out;}
.gallery_modal_controls > div > div:hover {opacity: 1; background: #BCC0C6;}
.gallery_modal_controls > div > div > i {font-size: 16px; color: #FFFFFF; line-height: 40px;}
.gallery_modal_controls > div:nth-of-type(1) > div > i {padding-right: 3px;}
.gallery_modal_controls > div:nth-of-type(2) > div > i {padding-left: 3px;}

@media only screen and (max-width: 800px) {
    .gallery_modal_menu > div:first-child {font-size: 14px;}
    .gallery_modal_menu {border-bottom: 0;}
    .gallery_modal_body {padding-top: 0;}
    .gallery_modal_body > div {width: 100%; padding-top: 0;}
    #gallery_modal_photo_bayside, #gallery_modal_photo_woodside {
        display: flex; 
        min-height: calc(100vh - 300px);
        position: relative;
        align-items: center;
        justify-content: center;
    }
    #gallery_modal_photo_bayside > img, #gallery_modal_photo_woodside > img,
    [id^="finishing_gallery_photo_"] > img {
        height: calc(100vh - 260px); 
        border-radius: 0;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        object-fit: contain;
    }
    #gallery_modal_photo_bayside > img.visible, #gallery_modal_photo_woodside > img.visible,
    [id^="finishing_gallery_photo_"] > img.visible {
        opacity: 1 !important;
        z-index: 10;
        display: block !important;
    }
    #gallery_modal_photo_bayside > img.hidden, #gallery_modal_photo_woodside > img.hidden,
    [id^="finishing_gallery_photo_"] > img.hidden {
        opacity: 0 !important;
        z-index: 1;
        visibility: hidden;
        pointer-events: none;
    }
    .gallery_modal_controls {display: none;}
    .gallery_modal_thumbs {padding: 70px 20px 0 20px; width: 100%;}
}

/* ------------------------------- SLIDER ------------------------------- */

.slides {width: 100%;}
.slide {padding-right: 20px;}
.slide > div::before {
    content: ''; display: block; width: 100%; height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, #000000 100%); border-radius: 8px; z-index: -2001;
}
.slide > div {height: 400px; position: relative; border-radius: 8px; max-width: 516px; width: 516px;}
.slide_info {color: #fff; position: absolute; bottom: 32px; left: 32px; right: 32px;}
.slide_info > div:nth-child(1) {font-size: 22px; font-weight: 700; color: #FFFFFF;}
.slide_info > div:nth-child(2) {padding-top: 14px; font-size: 14px; line-height: 140%; color: #D1D4DA;}

.slides_paginator {display: table; margin-top: 16px;}
.slides_paginator_btn {display: table-cell; vertical-align: middle; width: 0;}
.slides_paginator_arrow {color: #9497A2; font-size: 24px;}
.slides_paginator_arrow.active {color: #5b6936; cursor: pointer;}

#slides_paginator_prev {margin-right: 25px;}
#slides_paginator_next {margin-left: 25px;}
#slides_paginator_progress {width: 25%; height: 2px; background: #5b6936; transition: all 0.5s ease-in-out;}

@media only screen and (max-width: 800px) {
    .slides_paginator_arrow {color: #AEB3BB; font-size: 18px;}
    .slide > div {height: 400px; width: 260px;}
    .slide_info > div:nth-child(2) {font-size: 14px; line-height: 140%; padding-top: 8px;}
    .slide_info {left: 16px; bottom: 28px;}
}

/* ------------------------------- HEADER ------------------------------- */

.mobile_header_open {overflow: hidden; z-index: 10; background: #FFF; transition: .15s ease-in-out;}

/* Убеждаемся, что родительский элемент не блокирует sticky */
#main_sheet {
    overflow-x: hidden; 
    overflow-y: visible;
    /* Важно: не должно быть overflow: hidden или auto, иначе sticky не работает */
}

#header {
    position: relative; 
    top: 14px; 
    width: 100%; 
    transition: top 0.25s ease-out, background 0.25s ease-out, box-shadow 0.25s ease-out; 
    max-width: 100vw; 
    z-index: 10;
    will-change: top, transform, box-shadow;
}
#header.sticky {
    position: fixed !important;
    top: 0 !important; 
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    transform: translateY(-1px) !important; 
    z-index: 20 !important; 
    background: #FFFFFF !important; 
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.15) !important; 
    border-radius: 0 !important;
    margin: 0 !important;
}
#header.sticky.mobile_header_open {transform: unset; box-shadow: unset;}

#header.mobile_header_open + #header_mobile {background: #FFF; visibility: visible; opacity: 1; transition: .15s ease-in-out;}

.header > div:nth-of-type(1) {display: table-cell; vertical-align: middle; min-width: 196px;}

.header_logo {min-width: 132px; width: 90%; display: flex; align-items: center;}

#header.secondary_menu_open.villages #villages_menu {
    opacity: 1 !important; max-width: 100%; max-height: 280px; overflow: hidden; visibility: visible !important; width: 100%; min-width: 0; z-index: 20;
    position: absolute; background: #FFFFFF; border-radius: 0 0 16px 16px; top: 100%; border-top: 1px solid rgba(0, 0, 0, 0.15);
}
#header.secondary_menu_open.uchastki #uchastki_menu {
    opacity: 1 !important; max-width: 100%; max-height: 280px; overflow: hidden; visibility: visible !important; width: 100%; min-width: 0; z-index: 20;
    position: absolute; background: #FFFFFF; border-radius: 0 0 16px 16px; top: 100%; border-top: 1px solid rgba(0, 0, 0, 0.15);
}
.header_menu_secondary > div {display: flex; width: 100%; flex-wrap: wrap;}
#header.secondary_menu_open .header {border-radius: 16px 16px 0 0;}
#header.secondary_menu_open .header_menu_secondary {padding: 32px 0 16px;}
#header.secondary_menu_open .header_menu_secondary a {margin-bottom: 16px; display: block; width: 150px; text-align: left; margin-right: 50px; white-space: nowrap; position: relative;}
#villages_menu > div {max-width: 400px; width: 100%;}
#uchastki_menu > div {max-width: 600px; width: 100%;}

#header + #header_mobile {
    width: 100%; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #EFF1F6;
    visibility: hidden; opacity: 0; display: none; z-index: 9; overflow-y: auto; height: 100%;
}

.header {width: 100%; height: 56px; background: #FFF; border-radius: 16px; display: table; vertical-align: center; padding: 16px 24px;}

.header_logo img {width: 181px; height: 21px; transition: none;}
.header_logo i {font-size: 0; transition: none; cursor: pointer;}
.header_menu, .header_menu_secondary {
    text-align: center; display: table-cell; vertical-align: middle; opacity: 1; visibility: visible;
}

.header_menu > div, .header_menu > a, .header_menu_secondary a {
    display: inline-block; margin-right: 32px; font-size: 14px; text-decoration: none; font-weight: 500; cursor: pointer;
    transition: .1s ease-in-out; color: #555966; user-select: none; line-height: 160%;
}

#uchastki_link, #villages_link {position: relative;}
#uchastki_link i, #villages_link i {transform: rotate(-90deg); position: relative; top: 2px; margin-left: 6px; transition: 0.35s ease-in-out;}
#header.secondary_menu_open.villages #villages_link i {transform: rotate(90deg);}
#header.secondary_menu_open.uchastki #uchastki_link i {transform: rotate(90deg);}
#uchastki_link::after, #villages_link::after {position: absolute; top: calc(100% + 16px); transition: .3s ease-in-out; z-index: 1000; opacity: 0; left: -8px; width: calc(100% + 16px); content: ""; height: 4px; background: #5b6936;}
#uchastki_link:hover::after, #villages_link:hover::after {opacity: 1;}

.header_menu > div.active, .header_menu > a.active,
.header_menu_secondary a.active {color: #5b6936;}
.header_item:hover {color: #5b6936;}

.header_menu_secondary {opacity: 0 !important; min-width: 0; max-width: 0; min-height: 0; display: flex; max-height: 0; transition: opacity .3s ease-in-out; position: absolute; top: -1000px;}

.header_phone, .header_messengers {display: table-cell; vertical-align: middle; text-align: right;}
.header_messengers {width: 80px; margin-right: 6px;}

.header_phone {width: 200px;}
.header_phone > a {display: inline-block; vertical-align: middle; margin-right: 12px;}
.header_phone > div {display: inline-block; vertical-align: middle; margin-right: 32px; font-size: 14px; font-weight: 500;}
.header_phone > div > a {color: #1A222A;}
.header_phone i {font-size: 22px; line-height: 24px;}
#villages_menu > div {display: flex;}
.header_messengers i {font-size: 18px; line-height: 24px; position: relative; top: 1px;}
.header_messengers > a:first-child {margin-right: 20px;}
.header_messengers > a {display: inline-block; vertical-align: middle;}

.header_contacts img {width: 24px; cursor: pointer;}

.burger_section {display: none;}

.menu-btn {
    cursor: pointer; height: 18px; list-style: none; margin: 0 0 0 auto; padding: 0; width: 24px; position: relative;
    top: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);
    -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; transition: .3s ease-in-out;
}

.menu-btn div:nth-child(1) {
    top: 0; -webkit-transform-origin: left center; -moz-transform-origin: left center;
    -o-transform-origin: left center; transform-origin: left center;
}
.menu-btn div:nth-child(2) {
    top: 8px; -webkit-transform-origin: left center; -moz-transform-origin: left center;
    -o-transform-origin: left center; transform-origin: left center;
}
.menu-btn div:nth-child(3) {
    top: 16px; -webkit-transform-origin: left center; -moz-transform-origin: left center;
    -o-transform-origin: left center; transform-origin: left center;
}

.mobile_header_open .menu-btn div:nth-child(1) {
    left: 0; top: -1px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg); transform: rotate(45deg);
}
.mobile_header_open .menu-btn div:nth-child(2) {opacity: 0;width: 0;}
.mobile_header_open .menu-btn div:nth-child(3) {
    left: 0; top: 16px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg); transform: rotate(-45deg);
}

#header.mobile_header_open {top: 0 !important; box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.15) !important;}

.menu-btn div {
    background-color: #1A222A; border-radius: 4px; display: block; transition: .15s ease-in-out;
    height: 2px; left: 0; margin: 0; opacity: 1; padding: 0; position: absolute; width: 100%;
    -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);
    -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;
}

@media only screen and (max-width: 1460px) {
    #header.secondary_menu_open.villages #villages_menu, #header.secondary_menu_open.uchastki #uchastki_menu {width: calc(100% - 64px);}
}

@media only screen and (max-width: 1400px) {
    .header_logo {margin-right: 10px;}
    .header_messengers {width: 65px;}
    .header_messengers > a:first-child {margin-right: 15px;}
    .header_menu > div, .header_menu > a, .header_menu_secondary a {margin-right: 26px;}
    .header_phone > div {margin-right: 10px;}
}

@media only screen and (max-width: 1200px) {
    #uchastki_link:hover::after, #villages_link:hover::after {opacity: 0;}
}

@media only screen and (max-width: 1000px) {
    .header_phone > div {display: none;}
    .header_phone {margin-right: 5px; width: 40px;}
    .header_messengers {min-width: 58px;}
    .header_phone > a {margin-right: 10px;}
    .header_menu > div, .header_menu > a, .header_menu_secondary a {margin-right: 10px;}
}

@media only screen and (max-width: 800px) {
    .header {padding: 12px;}
    .header_logo {width: 70%;}
    .header_menu {display: none;}
    .header_logo img {width: 132px; height: 15px;}
    #header {top: 14px;}
    /* Исправление для мобильной шапки при скролле */
    #header.sticky {
        position: fixed !important; 
        top: 0 !important; 
        left: 0 !important; 
        right: 0 !important; 
        width: 100% !important; 
        max-width: 100vw !important; 
        margin: 0 !important; 
        border-radius: 0 !important;
    }
    .header_contacts img {width: 20px;}
    .header_messengers {width: 68px;}
    .header_phone i {font-size: 21px; line-height: 24px;}
    .header_messengers i {font-size: 16px;}
    .header_messengers > a:first-child i {font-size: 17px;}
    .header_messengers > a:last-child {margin-right: 8px;}
    .header_messengers > a:last-child i {font-size: 18px;}
    .header > div:nth-of-type(1) > div:last-child {display: inline-block; vertical-align: middle;}
    .burger_section {display: inline-block; vertical-align: middle; margin-right: 10px;}
    .header_mobile_menu {margin-top: 120px; display: inline-flex; flex-direction: column; align-items: flex-start;}
    .header_mobile_menu a {width: 100%; color: #555966; margin-bottom: 32px; text-align: left; font-size: 20px; font-weight: 700;}
    .header_mobile_menu a:hover {color: #5b6936;}
    .header_mobile_menu a.active {color: #5b6936;}
    .header_mobile_menu a:last-child {margin-bottom: 0;}
    .header_mobile_menu .sub_menu {display: none; -webkit-justify-content: center; flex-wrap: wrap;}
    .header_mobile_menu .sub_menu.active {display: flex; flex-direction: column; width: 100%; padding: 0;}
    .header_mobile_menu .sub_menu a {display: block; width: fit-content; font-size: 16px; margin-bottom: 20px; position: relative;}
    .header_mobile_menu .sub_menu a::after {position: absolute; bottom: -2px; left: 0; width: 100%; height: 1px; content: ""; background: #555966; opacity: 1; transition: .3s ease-in-out;}
    .header_mobile_menu .sub_menu a:hover::after {background: #5b6936;}
    #villages_sub_menu_btn, #uchastki_sub_menu_btn {display: flex; align-items: center; cursor: pointer; user-select: none;}
    #villages_sub_menu_btn i, #uchastki_sub_menu_btn i {transform: rotate(-90deg); margin-left: auto; font-size: 24px; transition: .3s ease-in-out;}
    #villages_sub_menu_btn.active i, #uchastki_sub_menu_btn.active i {transform: rotate(90deg);}
    .header_mobile_contacts > div:nth-of-type(1) {text-align: center; width: 100%; color: #555966; font-size: 14px; font-weight: 400;}
    .header_mobile_contacts > div:nth-of-type(2) {text-align: center; width: 100%;}
    .header_mobile_contacts > div:nth-of-type(2) a {color: #1A222A; font-size: 20px; font-weight: 700;}
    .header_mobile_contacts {margin-bottom: 24px;}
    .header_footer_menu {margin-top: auto; padding-top: 60px; position: relative; bottom: 0; left: 0; width: 100%;}
    #header_mobile.open_menu .header_footer_menu {padding-top: 0;}
    #header_mobile .footer_mobile {display: table; width: 75%; color: #555966; margin: 12px auto 30px auto; font-size: 14px; font-weight: 400;}
    #header_mobile .footer_mobile > div:nth-of-type(1) {width: 70%; display: inline-block;}
    #header_mobile .footer_mobile > div:last-child {width: 30%; display: inline-block;}
    #header_mobile .footer_mobile img {width: 24px;}
    #header_mobile .footer_mobile > div > div:nth-of-type(2) {margin-top: 20px; display: flex;}
    #header_mobile .footer_mobile > div > div:nth-of-type(2) > a:first-child {margin-right: 20px;}
    #header_mobile hr {opacity: 0.1; background: #1A222A; height: 2px; width: 100%; margin-bottom: 12px; margin-top: 0;}
    #header_mobile {display: flex !important;flex-direction: column;}
    #header_mobile .btn {width: 100%; font-size: 18px; margin: 50px auto 24px auto; height: 64px;}
    .header_phone > a {margin-right: 10px;}
    .header_messengers > a:first-child {margin-right: 15px;}
}

@media only screen and (max-height: 120px) {
    .header_mobile_menu {margin-top: 100px; padding-bottom: 0;}
    .header_mobile_menu a {margin-bottom: 20px;}
    #header_mobile .btn {margin: 20px auto 14px auto;}
    .header_mobile_contacts {margin-bottom: 24px;}
}

@media only screen and (max-height: 770px) {
    .header_mobile_menu {margin-top: 80px; padding-bottom: 0;}
    #header_mobile .btn {height: 50px; margin: 20px auto 24px auto;}
    .header_footer_menu {position: static; width: 100%; margin-top: auto;}
    #header.mobile_header_open + #header_mobile {overflow: auto;}
}

/* ------------------------------- MAIN ------------------------------- */

#main {padding-top: 40px;}

#main .background {
    height: 668px; object-fit: cover; object-position: right; mask: url("../images/masks/main.svg") 0 0 / 100% 100% no-repeat;
    -webkit-mask: url("../images/masks/main.svg") left / auto 100% no-repeat;
}

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

.main img {position: relative; width: 100%;}
.main .btn {position: absolute; bottom: 0; right: 0;}

.main .video {
    z-index: 2; border-radius: 20px; position: absolute; top: 0; left: 0; width: 158px; height: 100px; cursor: pointer;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.60) 0%, rgba(0, 0, 0, 0.60) 100%), url(../images/video/video.jpg) 0 0 / cover no-repeat;
}


.main .video {cursor: pointer; z-index: 2; border-radius: 20px; position: absolute; top: 0; left: 0; width: 158px; height: 100px; background: linear-gradient(0deg, rgba(0, 0, 0, 0.60) 0%, rgba(0, 0, 0, 0.60) 100%), url(../images/video/video.jpg) 0 0 / cover no-repeat;}

.main .video:hover .video_play {opacity: 1;}

.main_info {position: absolute; bottom: 30px; left: 0; color: #FFF;}

.main_title {font-size: 56px; font-weight: 700; color: #EFF1F6; padding-left: 45px; line-height: 130%;}

.main_mobile_desc {display: none;}

.main_desc {display: flex; margin-top: 67px; padding-left: 45px; transition: .2s;}
.main_desc > div {margin-right: 80px;}
.main_desc i {font-size: 48px; line-height: 48px;}

.main_desc > div > div:nth-of-type(1) {font-size: 40px; font-weight: 700; margin-top: 16px;}
.main_desc > div > div:last-child {margin-top: 8px; font-size: 16px; font-weight: 400;}

@media only screen and (max-width: 1000px) {
    .main_desc > div > div:nth-of-type(1) {font-size: 30px;}
    .main_desc > div > div:last-child {font-size: 14px;}
    .main_desc i {font-size: 38px; line-height: 38px;}
    .main_desc > div {margin-right: 30px;}
    .main_desc {margin-top: 90px;}
    .main_title {padding-left: 20px;}
    .main_desc {padding-left: 20px;}
}

@media only screen and (max-width: 800px) {
    #main {padding-top: 28px;}
    #main .background {height: 532px;}
    .main_desc {display: none; }
    .main_title {font-size: 40px;}
    .main_info {left: 0; top: 25%; bottom: auto;}
    .main_title {width: 80%; min-width: 314px;}
    .main .video {width: 124px; height: 80px;}
    .main_mobile_desc {
        margin-top: 32px; display: flex; flex-direction: column; border-radius: 20px; padding: 31px 19px; background: #5b6936;
        color: #ffffff;
    }
    .main_mobile_desc > div {display: flex; margin-bottom: 24px; align-items: center;}
    .main_mobile_desc > div:last-child {margin-bottom: 0;}
    .main_mobile_desc > div > div:nth-of-type(1) {display: flex; align-items: center;}
    .main_mobile_desc > div i {font-size: 48px; line-height: 48px; margin-right: 20px;}
    .main_mobile_desc > div > div:nth-of-type(2) > div:nth-of-type(1) {font-size: 24px; font-weight: 700;}
    .main_mobile_desc > div > div:nth-of-type(2) > div:last-child {font-size: 14px; font-weight: 400;}
}

/* --------------------------- COTTAGE SETTLEMENTS --------------------------- */

#cottage_settlements {margin-top: 40px;}

.settlements {margin-top: 32px; display: flex; flex-wrap: wrap;}

.settlements > a {
    position: relative; width: calc(50% - 10px); max-height: 450px; min-height: 305px; height: 30vw;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 71.67%, rgba(0, 0, 0, 0.63) 100%);
    border-radius: 20px; overflow: hidden; box-shadow: rgba(0,0,0,0.5) 0 -170px 40px -50px inset;
}
.settlements > a:first-child {margin-right: 20px;}
.settlements > a:nth-child(3) {margin-right: 20px; margin-top: 20px;}
.settlements > a:nth-child(4) {margin-top: 20px;}
.settlements > a:last-child .sticker {width: auto; top: 35px; left: 24px; height: 54px;}

.settlements > a:hover > div > div:nth-of-type(2) {max-height: 70px; opacity: 1;}
.settlements > a:hover > div > div:nth-of-type(3) {max-height: 70px; opacity: 1;}
.settlements > a:hover > img {scale: 1.05;}

.settlements > a > div {position: absolute; width: 100%; bottom: 20px; left: 24px; color: #FFF;}
.settlements > a > div > div:nth-of-type(1) {font-size: 24px; font-weight: 700;}
.settlements > a > div > div:nth-of-type(2) {
    margin-top: 16px; width: 100%; font-size: 14px; font-weight: 400; max-height: 0; opacity: 0; transition: all 0.8s ease-in-out;
}
.settlements > a > div > div:nth-of-type(3) {
    display: flex; align-items: end; width: 100%; margin-top: 24px; font-size: 14px; font-weight: 400; max-height: 0; opacity: 0;
    transition: all 0.8s ease-in-out;
}
.settlements > a > div > div:nth-of-type(3) i {margin-right: 8px;}
.settlements > a > img {width: 100%; height: 100%; transition: all .5s ease-in-out; object-fit: cover; z-index: -1; position: relative;}

@media only screen and (max-width: 1000px) {
    .settlements > a > div > div:nth-of-type(3) {display: none;}
}

@media only screen and (max-width: 600px) {
    #cottage_settlements {margin-top: 32px;}
    .settlements > a > div {width: 100%;}
    .settlements {flex-direction: column; margin-top: 16px;}
    .settlements > a {width: 100%; height: 305px; margin-right: 12px; margin-bottom: 12px;}
    .settlements > a > div > div:nth-of-type(1) {font-size: 20px;}
    .settlements > a > div > div:nth-of-type(2) {max-height: 70px; width: calc(100% - 50px); opacity: 1;}
    .settlements > a:hover:before {opacity: 0;}
    .settlements > a:hover > div > div:nth-of-type(2) {opacity: 1;}
    .settlements > a:nth-child(3) {margin-top: 0; margin-right: 0;}
    .settlements > a:nth-child(4) {margin-top: 0;}
}

/* --------------------------- ABOUT SETTLEMENTS --------------------------- */

#about_settlements {margin-top: 40px;}

#about_settlements .title {display: table; vertical-align: middle;}
#about_settlements .title > div {display: table-cell; vertical-align: middle; color: #555966;}
#about_settlements .title > div:nth-of-type(2) {width: 40%; font-size: 16px;}

#about_settlements .atmosphere {margin-top: 32px; position: relative; overflow: hidden; border-radius: 20px 20px 0 20px;}

#about_settlements .background {
    width: 100%; height: 600px; object-position: center; object-fit: cover; transition: background-size .5s ease-in-out; cursor: pointer;
    mask: url("../images/masks/about_settle.svg") right bottom / 1376px 100% no-repeat; -webkit-mask: url("../images/masks/about_settle.svg") right bottom / 1376px 100% no-repeat;
    background: url(../images/settlements/about_settlements.jpg?2) no-repeat center; background-size: 120% auto !important;
}

#about_settlements .atmosphere.woodside .background {background: url(../images/settlements/woodside/about.jpg?2) no-repeat center; background-size: 120% auto !important;}
#about_settlements .atmosphere.bayside .background {background: url(../images/settlements/bayside/about.jpg?2) no-repeat center; background-size: 120% auto !important;}
#about_settlements .atmosphere.highwood .background {background: url(../images/settlements/highwood/about.jpg?2) no-repeat center; background-size: 120% auto !important;}

#about_settlements .background:hover {background-size: 125% auto !important;}
#about_settlements .atmosphere.woodside .background:hover {background-size: 125% auto !important;}
#about_settlements .atmosphere.bayside .background:hover {background-size: 125% auto !important;}

#about_settlements .video_background {
    width: 100%; height: 600px; object-fit: cover; position: absolute; z-index: -1; cursor: pointer;
    mask: url("../images/masks/about_settle.svg") right bottom / 1376px 100% no-repeat; -webkit-mask: url("../images/masks/about_settle.svg") right bottom / 1376px 100% no-repeat;
}

.title > div + div {padding-left: 24px;}

.atmosphere .background_mobile {display: none;}
#about_settlements .title.bayside > div:nth-of-type(2) {width: 30%;}
#about_settlements .title.woodside > div:nth-of-type(2) {width: 30%;}

.atmosphere .video {
    position: absolute; top: calc(50% - 20px); left: calc(50% - 20px); width: 40px; height: 40px;
}
.atmosphere.woodside .video {
    position: absolute; top: calc(50% - 20px); left: calc(50% - 20px); width: 40px; height: 40px;
}
.atmosphere.bayside .video {
    position: absolute; top: calc(50% - 20px); left: calc(50% - 20px); width: 40px; height: 40px;
}
.atmosphere .btn {z-index: 2; position: absolute; border-radius: 12px; bottom: 0; right: 0; width: 288px; height: 64px; font-size: 18px;}

#about_settlements .additional_videos {display: flex; margin-top: 40px;}
#about_settlements .additional_videos > div {width: 50%; position: relative;}
#about_settlements .additional_videos > div:first-child {margin-right: 24px;}
#about_settlements .additional_videos > div video {display: block; width: 100%; border-radius: 20px; position: relative; mask: none; -webkit-mask: none; height: auto;}
#about_settlements .slides_paginator {display: none;}

@media only screen and (max-width: 1000px) {
    #about_settlements .background {background-size: auto 100% !important;}
    #about_settlements .atmosphere.woodside .background {background-size: auto 100% !important; background-position: 60% 50%;}
    #about_settlements .atmosphere.bayside .background {background-size: auto 100% !important; background-position: 60% 50%;}
    #about_settlements .background:hover {background-size: auto 105% !important;}
    #about_settlements .atmosphere.woodside .background:hover {background-size: auto 105% !important;}
    #about_settlements .atmosphere.bayside .background:hover {background-size: auto 105% !important;}
    #about_settlements .title {display: block;}
    #about_settlements .title.bayside > div:nth-of-type(2) {width: 100%;}
    #about_settlements .title.woodside > div:nth-of-type(2) {width: 100%;}
    #about_settlements .title > div:nth-of-type(2) {display: block; width: 100%; margin-top: 12px; padding-left: 0; font-size: 14px; text-align: left;}
    #about_settlements .additional_videos {margin-top: 32px;}
    #about_settlements .additional_videos > div:first-child {margin-right: 20px;}
}

@media only screen and (max-width: 600px) {
    #about_settlements {margin-top: 32px; overflow: hidden;}
    .atmosphere .video {top: 16px; left: 16px;}
    .atmosphere.bayside .video {top: 16px; left: 16px;}
    .atmosphere.woodside .video {top: 16px; left: 16px;}
    #about_settlements .atmosphere {margin-top: 16px;}
    #about_settlements .title {flex-direction: column; align-items: unset;}
    #about_settlements .video_background {height: 469px;}
    #about_settlements .background {height: 469px;}
    .atmosphere .btn {height: 56px; width: 297px;}
    #about_settlements .additional_videos {transition: .5s ease-in-out;}
    #about_settlements .additional_videos > div {min-width: 75%;}
    #about_settlements .additional_videos > div video {height: 340px;}
    #about_settlements .slides_paginator {display: block;}
}

/* ------------------------ BACK TO MAIN ------------------------ */

#back_to_main {padding-top: 50px;}
#back_to_main .wrap > div {display: flex; align-items: center; padding-left: 24px;}
#back_to_main .wrap > div > div {display: inline; vertical-align: middle;}
#back_to_main .wrap > div > a:last-child {display: inline; margin-right: 0;}
#back_to_main a {display: inline; vertical-align: middle; font-size: 14px; font-weight: 500; color: #8F97A6; margin-right: 4px;}
#back_to_main i {margin-top: 2px; font-size: 16px; margin-right: 4px; color: #9497A2; line-height: 18px;}

@media only screen and (max-width: 800px) {
    #back_to_main {padding-top: 30px;}
    #back_to_main .wrap > div {padding-left: 0;}
    #back_to_main a {font-size: 12px;}
    #back_to_main i {font-size: 14px;}
    #back_to_main .wrap > div > a:last-child {display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 150px;}
    #back_to_main .wrap > div > a.active:last-child {display: inline; white-space: unset;}
}
/* --------------------------- HOW WORK --------------------------- */

#how_work {margin-top: 40px; overflow: hidden;}

.cards {display: flex; flex-wrap: wrap; transition: all .5s ease-in-out;}
.cards > div {
    background-size: 120% auto !important; margin-right: 20px; margin-bottom: 20px; width: calc(33.3% - 14px);
    transition: background-size .5s ease-in-out, max-height .5s ease-in-out, opacity .5s ease-in-out;
}
.cards > div:nth-child(3n) {margin-right: 0;}
.cards > div:nth-last-child(-n+3) {margin-bottom: 0;}

#how_work .slides_paginator {display: none;}

#how_work h2 {padding-bottom: 32px;}

.cards > div:hover {background-size: 130% auto !important;}
.cards > div:hover > div > div:nth-of-type(2) {max-height: 200px; opacity: 0.7;}

.cards > div > div > div:nth-of-type(1) {
    color: #FFF; font-size: 24px; font-weight: 700; padding: 60px 0 12px 0;
}
.cards > div > div > div:nth-of-type(2) {
    opacity: 0; max-height: 0; color: #FFF; font-size: 16px; font-weight: 400;
    transition: all 0.8s ease-in-out;
}

.cards > div {position: relative; max-height: 400px; min-height: 300px; border-radius: 20px; overflow: hidden; padding: 0;}

.cards > div:nth-of-type(1) {background: url(../images/how_work/1.jpg?2) center / cover no-repeat;}
.cards > div:nth-of-type(2) {background: url(../images/how_work/2.jpg?2) center / cover no-repeat;}
.cards > div:nth-of-type(3) {background: url(../images/how_work/3.jpg?2) center / cover no-repeat;}
.cards > div:nth-of-type(4) {background: url(../images/how_work/4.jpg?2) center / cover no-repeat;}
.cards > div:nth-of-type(5) {background: url(../images/how_work/5.jpg?2) center / cover no-repeat;}
.cards > div:nth-of-type(6) {background: url(../images/how_work/6.jpg?2) center / cover no-repeat;}

.cards > div > div {
    position: absolute; bottom: 0; width: 100%; padding: 0 32px 32px 32px; transition: .5s ease-in-out;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.45) 50%, rgba(0, 0, 0, 0.90) 100%);
}

@media only screen and (max-width: 1000px) {
    .cards > div:nth-child(3n) {margin-right: 20px;}
    .cards > div:nth-child(2n) {margin-right: 0;}
    .cards > div > div {padding: 0 16px 16px 16px;}
    .cards > div:nth-last-child(3) {margin-bottom: 20px;}
    .cards > div {width: calc(50% - 10px);}
}

@media only screen and (max-width: 700px) {
    .cards > div {background-size: 140% auto !important;}
    .cards > div:hover {background-size: 170% auto !important;}
}

@media only screen and (max-width: 600px) {
    .cards {display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch;}
    #how_work h2 {padding-bottom: 16px;}
    .cards > div:nth-child(2n) {margin-right: 20px;}
    .cards > div > div > div:nth-of-type(1) {font-size: 20px; margin-bottom: 4px; padding: 0;}
    .cards > div > div > div:nth-of-type(2) {opacity: 1; max-height: 100px; font-size: 14px;}
    .cards > div {min-width: 314px; margin-bottom: 0; width: 314px; height: 282px; flex-shrink: 0;}
    #how_work .slides_paginator {display: table;}
    .cards > div:hover:before {opacity: 0;}
    .cards > div:hover > div > div:nth-of-type(2) {opacity: 1;}
    #how_work {margin-top: 32px; overflow-x: hidden;}
}

/* ------------------------------- APP ------------------------------- */

#app_section {max-width: 1600px; width: 100%; margin: 40px auto 0;}
#app_section > .wrap {overflow: inherit;}
.app_group {display: flex; width: 100%; flex-direction: row-reverse;}
.app_group > div {width: 50%; position: relative;}
.app_group > div:nth-of-type(2) {min-width: 500px;}

.app_title_mobile {display: none;}

.app_phone_1 {max-height: 600px; height: 597px; width: auto; position: absolute; top: 0; right: 348px; z-index: 7;}
.app_phone_2 {max-height: 660px; height: 655px; width: auto; position: absolute; top: 50px; right: 99px; z-index: 8;}

.app_page_title {font-size: 32px; color: #111418; font-weight: 500;}

.app_table {display: flex; flex-wrap: wrap; width: 100%; max-width: 600px; margin-top: 40px;}
.app_table > div {flex-grow: 1; width: calc(50% - 8px); padding: 30px; background: #FFFFFF; border-radius: 24px; position: relative;}
.app_table > div:nth-child(2n+1) {margin-right: 8px;}
.app_table > div:nth-child(2n) {margin-left: 8px;}
.app_table > div:nth-child(1), .app_table > div:nth-child(2) {margin-bottom: 16px;}

.app_table_icon {width: 50px; height: 50px; text-align: center;}
.app_table_icon i {color: #5b6936; position: relative; line-height: 50px; font-size: 44px;}
.app_table_icon i.icon_time_2 {top: -1px; left: -2px;}
.app_table_icon i.icon_food {top: -2px; left: 1px;}

.app_table_title {font-size: 24px; font-weight: 700; margin-top: 24px; color: #1A222A;}
.app_table_desc {font-size: 16px; line-height: 150%; margin-top: 8px; color: #555966;;}

@media only screen and (max-width: 1400px) {
    .app_phone_1 {right: 160px; height: 500px;}
    .app_phone_2 {right: 0; height: 550px;}
}

@media only screen and (max-width: 1000px) {
    .app_group > div:nth-of-type(2) {min-width: 400px;}
    .app_phone_1 {right: 70px;}
    .app_table_icon i {font-size: 30px;}
    .app_table_icon {width: 36px; height: 36px;}
    .app_table_title {font-size: 20px;}
    .app_table_desc {font-size: 14px;}
}

@media only screen and (max-width: 800px) {
    .app_title_mobile {display: block;}
    .app_title {display: none;}
    .app_group {display: block; padding-top: 70px;}
    .app_group > div:nth-child(1) {height: 430px;}
    .app_group > div {width: 100%; padding-top: 120px;}
    .app_phone_1 {right: auto; left: 0; top: -40px; max-height: 500px;}
    .app_phone_2 {right: auto; left: 180px; top: 20px; max-height: 550px;}
    .app_table {padding-top: 20px;}
    .app_table > div {width: calc(50% - 5px); padding: 16px;}
    .app_table > div:nth-child(2n+1) {margin-right: 5px;}
    .app_table > div:nth-child(2n) {margin-left: 5px;}
    .app_table > div:nth-child(1), .app_table > div:nth-child(2) {margin-bottom: 10px;}
}
@media only screen and (max-width: 600px) {
    #app_section {margin: 32px auto 0;}
}

@media only screen and (max-width: 530px) {
    .app_group > div {padding-top: 160px;}
    .app_phone_1 {max-height: 530px;}
    .app_phone_2 {max-height: 580px; right: 0; left: auto;}
}

@media only screen and (max-width: 460px) {
    .app_group > div {padding-top: 70px;}
    .app_phone_1 {max-height: 450px;}
    .app_phone_2 {max-height: 500px;}
    .app_group > div:nth-of-type(2) {min-width: 300px;}
}

@media only screen and (max-width: 400px) {
    .app_group > div {padding-top: 0;}
    .app_phone_1 {max-height: 400px;}
    .app_phone_2 {max-height: 440px;}
}

/* --------------------------- ABOUT MAIN --------------------------- */

#about_main {margin-top: 30px;}

#about_main .title {font-size: 56px; color: #1A222A; font-weight: 700; margin-bottom: 30px; line-height: 100%;}
#about_main .main {height: 602px;}
#about_main .main img {height: 100%; object-fit: cover; border-radius: 20px;}
#about_main > .wrap > div.info {display: flex; margin-top: 20px; align-items: center; border-radius: 20px; margin-bottom: 20px; background: #FFF; padding: 20px;}
#about_main > .wrap > div.info > div {width: 50%; margin-left: 44px; margin-right: auto;}
#about_main > .wrap > div.info > div > div:first-child {font-size: 40px; font-weight: 700; margin-bottom: 25px; color: #160F0F;}
#about_main > .wrap > div.info > div > div:last-child {font-size: 16px; max-width: 435px; width: 100%; color: #555966;}
#about_main > .wrap > div.info > img {width: calc(50% - 20px); height: 326px; object-fit: cover; border-radius: 20px;}

@media only screen and (max-width: 1000px) {
    #about_main > .wrap > div.info > div {margin-left: 0; margin-bottom: 20px;}
    #about_main > .wrap > div.info {background: unset; flex-direction: column; padding: 0;}
    #about_main > .wrap > div.info > img {width: 100%;}
    #about_main > .wrap > div.info > div {width: 100%;}
}

@media only screen and (max-width: 600px) {
    #about_main {margin-top: 20px;}
    #about_main .title {font-size: 40px; margin-bottom: 20px;}
    #about_main .main {height: 532px;}
    #about_main > .wrap > div.info {margin-top: 32px; margin-bottom: 32px;}
    #about_main > .wrap > div.info > div > div:first-child {font-size: 24px; margin-bottom: 12px;}
    #about_main > .wrap > div.info > div > div:last-child {font-size: 14px;}
}

/* --------------------------- EXPERIENCE --------------------------- */

#experience {margin-top: 40px;}

.experience {display: flex;}
.experience.about {flex-direction: row-reverse;}
.experience .info {display: flex; max-height: 467px; min-height: 337px; width: 50%; padding: 105px 99px; background: #5b6936; color: #FFFFFF; font-size: 24px; font-weight: 700; margin-right: 20px; border-radius: 20px;}
.experience .info > img {margin-right: 16px; height: 25px; position: relative; top: 6px;}
.experience .info > div > img {margin-left: 16px; width: fit-content; height: 25px; transform: scale(-1, 1); position: relative; top: 6px;}
.experience > img {min-height: 337px; width: 50%; max-height: 467px; border-radius: 20px; object-fit: cover;}
.experience.about .info {margin-right: 0;}
.experience.about > img {margin-right: 20px;}

@media only screen and (max-width: 1300px) {
    .experience .info {padding: 40px 40px;}
}

@media only screen and (max-width: 1000px) {
    .experience {flex-direction: column-reverse;}
    .experience.about {flex-direction: column;}
    .experience .info > img {margin-right: 12px;}
    .experience .info > div > img {margin-left: 12px;}
    .experience .info {padding: 99px 108px; font-size: 18px; width: 100%; margin-right: 0; margin-top: 12px;}
    .experience.about .info {margin-top: 0; margin-bottom: 12px;}
    .experience > img {width: 100%; max-height: 337px;}
}

@media only screen and (max-width: 600px) {
    .experience .info {padding: 40px 20px;}
}

/* --------------------------- MODERN HOUSES --------------------------- */

#modern_houses {margin-top: 40px;}

#modern_houses > .wrap > div:nth-of-type(2) {display: flex; align-items: baseline;}
.link_houses {margin-left: auto; font-size: 14px; font-weight: 500;}
.mobile_link_houses {margin-left: auto; display: none; font-size: 14px; padding-top: 10px; font-weight: 500;}

#modern_houses .houses {display: flex; margin-top: 27px;}

#modern_houses .houses > a {
    margin-left: 24px;
    width: calc(33.3% - 16px);
    border-radius: 20px;
    aspect-ratio: 16 / 9;
    /* Fallback for browsers without aspect-ratio support */
    min-height: 260px;
    height: auto;
    background-size: cover !important;
    background-repeat: no-repeat;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    display: flex; flex-direction: column; -webkit-justify-content: flex-end; cursor: pointer;
    text-decoration: none;
    position: relative;
    overflow: hidden;
}
#modern_houses .houses > a::before{
    content:"";
    position:absolute;
    inset:0;
    background: linear-gradient(180deg, rgba(0,0,0,0.18) 0%, rgba(0,0,0,0.62) 100%);
    pointer-events:none;
}
#modern_houses .houses > a::after{
    content:"";
    position:absolute;
    inset:0;
    background: rgba(0,0,0,0.10);
    opacity: 0;
    transition: opacity 0.25s ease;
    pointer-events:none;
}
#modern_houses .houses > a:first-child {margin-left: 0;}
#modern_houses .houses > a:hover {
    transform: translateY(-2px);
}
#modern_houses .houses > a:hover::after{
    opacity: 1;
}

.house_info {color: #FFFFFF; padding: 0 32px 32px; width: 100%; position: relative; z-index: 1;}

.house_info .name_house {font-size: 24px; color: #FFFFFF; font-weight: 700; margin-top: 6px;}
.house_info .price_house {
    font-size: 24px; font-weight: 700; margin-top: 6px; pointer-events: none !important; color: #FFFFFF !important;
    cursor: default !important; text-decoration: none !important; -webkit-appearance: none;
}
.house_info .name_house, .house_info .price_house, .house_info .info_house{
    text-shadow: 0 2px 16px rgba(0,0,0,0.55);
}

.house_info .info_house {font-size: 14px; font-weight: 400;}

.house_spec {display: flex; flex-wrap: wrap; margin-top: 12px; white-space: nowrap;}
.house_spec > div:nth-of-type(3) {white-space: normal;}
.house_spec > div {display: flex; align-items: baseline; margin-right: 16px; margin-bottom: 10px;}
.house_spec > div i {margin-right: 8px;}
.house_spec > div:first-child .info_house {white-space: normal;}

#modern_houses .houses > a:nth-of-type(1) {background: url(../assets/projects/S75/cover.jpg) center / cover;}
#modern_houses .houses > a:nth-of-type(2) {background: url(../assets/projects/S95/cover.jpg) center / cover;}
#modern_houses .houses > a:nth-of-type(3) {background: url(../assets/projects/S120/cover.jpg) center / cover;}

@media only screen and (max-width: 1000px) {
    #modern_houses .houses > a {width: calc(33.3% - 8px); margin-left: 12px;}
    #modern_houses .houses > a {min-height: 220px;}
    .house_info {padding: 0 10px 10px;}
}

@media only screen and (max-width: 800px) {
    .houses {flex-direction: column;}
    .houses {flex-wrap: wrap;}
    .house_spec > div:first-child .info_house {
        white-space: normal;
        line-height: 1.4;
    }
    .house_spec > div:first-child {
        flex-basis: 100%;
        margin-right: 0;
    }
    .house_info {padding: 0 24px 24px;}
    #modern_houses .houses > a {margin-left: 0; width: 100%; margin-top: 24px; min-height: 240px;}
    #modern_houses .houses > a:first-child {margin-top: 0;}
}

@media only screen and (max-width: 600px) {
    #modern_houses .houses {margin-top: 12px;}
    .house_info .name_house, .house_info .price_house {font-size: 20px;}
    #modern_houses {margin-top: 32px;}
    .mobile_link_houses {display: block;}
    .link_houses {display: none;}
    #modern_houses .houses > a {min-height: 200px;}
}

/* --------------------------- HOUSES PAGES --------------------------- */

.houses_page_grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    padding: 0 24px;
}

.houses_page_card {
    border-radius: 20px;
    background: #FFF;
    border: 1px solid #EFF1F6;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.houses_page_card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(26,34,42,0.10);
}

.houses_page_card_media {
    display: block;
    height: 220px;
    background-size: cover;
    background-position: center;
}

.houses_page_card_body {display:block; padding: 16px;}
.houses_page_card_title {display:block; font-weight: 700; font-size: 18px; color: #111418;}
.houses_page_card_price {display:block; margin-top: 6px; font-weight: 700; color: #5b6936;}
.houses_page_card_meta {display:block; margin-top: 10px; color: #555966; font-size: 13px;}

.house_detail_wrap {padding-top: 30px; padding-bottom: 50px;}
.house_detail_wrap h2 {padding-left: 0;}
.house_detail_wrap .block_name {padding-left: 0;}
.house_detail_wrap .title > div:last-child {padding-left: 0;}

.house_breadcrumbs {
    padding: 0 24px;
    color: #555966;
    font-size: 13px;
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}
.house_build {margin-left: auto; color:#9aa0ad; font-size: 12px;}
.house_breadcrumbs a {color: #555966;}
.house_breadcrumbs a:hover {color: #5b6936;}

.house_project_header{
    display:grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 16px;
    padding: 12px 24px 0 24px;
}
.house_project_left h2 {padding-left: 0;}
.house_project_note {margin-top: 12px; color:#555966; line-height: 1.55;}

.house_project_metrics{
    margin-top: 14px;
    display:grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.house_metric{
    background:#FFF;
    border:1px solid #EFF1F6;
    border-radius: 16px;
    padding: 12px 14px;
}
.house_metric_label{color:#555966; font-size:12px;}
.house_metric_value{margin-top: 6px; font-weight:800; color:#111418;}

.house_project_media{
    border-radius: 24px;
    overflow: hidden;
    background: #FFF;
    border: 1px solid #EFF1F6;
    box-shadow: 0 10px 40px rgba(0,0,0,0.06);
    position: relative;
    height: 520px;
}
.house_project_media img{width: 100%; height: 100%; object-fit: cover; display:block;}

/* configurator overlay on hero image */
.house_project_media .house_detail_config{
    position: absolute;
    left: 14px;
    bottom: 14px;
    right: auto;
    max-width: 360px;
    background: rgba(255,255,255,0.86);
    border: 1px solid rgba(239,241,246,0.9);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 12px 30px rgba(17,20,24,0.10);
    padding: 12px;
}
.house_project_media .house_detail_config_title{display:none;}
.house_project_media .house_detail_config_row{grid-template-columns: 1fr; gap: 8px; margin-top: 0;}
.house_project_media .house_detail_config_label{display:none;}
.house_project_media .house_detail_config_controls{gap: 6px;}
.house_project_media .house_pill{font-size: 13px; line-height: 34px; height: 34px; padding: 0 12px; border-radius: 999px;}
.house_project_media .house_detail_config_row + .house_detail_config_row{margin-top: 8px;}
.house_project_media .house_detail_config_summary{display:none;}

@media only screen and (max-width: 1000px) {
    .house_project_media .house_detail_config{
        left: 10px;
        bottom: 10px;
        max-width: min(340px, calc(100% - 20px));
        padding: 10px;
    }
    .house_project_media .house_pill{font-size: 12px; line-height: 32px; height: 32px; padding: 0 10px;}
}

@media only screen and (max-width: 600px) {
    /* keep it in the corner, not half of image */
    .house_project_media .house_detail_config{
        left: 8px;
        bottom: 8px;
        max-width: min(220px, calc(100% - 16px));
        padding: 0;
        background: transparent;
        border: 0;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    .house_project_media .house_detail_config_controls{gap: 4px;}
    .house_project_media .house_pill{
        font-size: 11px;
        line-height: 28px;
        height: 28px;
        padding: 0 9px;
    }
    .house_project_media .house_detail_config_row + .house_detail_config_row{margin-top: 6px;}
    .house_project_media .house_detail_config_controls{
        background: rgba(255,255,255,0.86);
        border: 1px solid rgba(239,241,246,0.9);
        border-radius: 999px;
        padding: 4px;
        flex-wrap: nowrap;
    }
}

.house_project_freebies{
    margin-top: 12px;
    display: grid;
    gap: 10px;
}
.house_project_freebie{
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 14px;
    background: #FFF;
    border: 1px solid #EFF1F6;
    padding: 12px 14px;
    color:#111418;
    font-weight: 700;
}
.house_project_freebie svg{flex: 0 0 auto;}
.house_project_freebie span{color:#5b6936;}

.house_project_summary{
    border-radius:20px;
    background:#FFF;
    border:1px solid #EFF1F6;
    padding: 18px;
}
.house_project_summary h2{margin-top: 6px;}
.house_project_summary .block_name{padding-left: 0;}
.house_project_summary .house_project_metrics{margin-top: 12px;}
.house_project_summary .house_project_note{margin-top: 10px;}
.house_project_summary_divider{
    height: 1px;
    background: #EFF1F6;
    margin: 16px 0;
}

/* house_actions_compact removed from hero (left for compatibility if used elsewhere) */
.house_actions_compact {padding-left: 0;}

.house_project_right{display:grid; gap: 12px;}
.house_price_card_title{color:#555966; font-size: 13px;}
.house_price_card_price{margin-top: 10px; font-size: 28px; font-weight: 900; color:#111418;}
.house_price_card_mortgage{margin-top: 10px;}
.house_price_card_mortgage[hidden]{display: none !important;}
.house_price_card_mortgage_value{font-size: 16px; font-weight: 700; color: #5b6936; line-height: 1.35;}
.house_price_card_mortgage_note{margin-top: 4px; font-size: 11px; line-height: 1.4; color: #7a8290;}
.houses_page_card_mortgage{display: block; margin-top: 4px; font-size: 12px; line-height: 1.35; color: #5b6936; font-weight: 500;}
.houses_page_card_mortgage[hidden]{display: none !important;}
.house_price_card_cta{
    margin-top: 14px;
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.house_price_card_cta .btn{
    width: 100%;
    min-width: 0;
}

.house_detail_price_row {margin-top: 10px; display: flex; flex-direction: column; gap: 4px; padding-left: 24px;}
.house_detail_price {font-size: 28px; font-weight: 800; color: #111418;}
.house_detail_price_note {font-size: 12px; color: #555966;}

/* compact interesting facts under CTA */
.house_project_facts{
    margin-top: 14px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.house_fact{
    border-radius: 14px;
    background: #F7F8FB;
    border: 1px solid #EFF1F6;
    padding: 10px 12px;
    display:flex;
    gap: 10px;
    align-items: flex-start;
}
.house_fact i{margin-top: 2px; flex: 0 0 auto; opacity: 0.9;}
.house_fact span{display:block; font-size: 12px; color:#6B7180;}
.house_fact strong{display:block; margin-top: 2px; font-weight: 900; color:#111418; font-size: 14px;}

.house_fact_desc{
    grid-column: 1 / -1;
    background: #FFF;
}
.house_fact_desc strong{
    font-size: 16px;
    margin-top: 0;
}
.house_fact_desc p{
    margin: 10px 0 0 0;
    color:#555966;
    line-height: 1.55;
}

.house_detail_actions {display: flex; gap: 10px; flex-wrap: wrap; padding-left: 24px; margin-top: 16px;}
.house_detail_actions .btn {min-width: unset; flex: 1;}

.house_detail_config {
    border-radius: 20px;
    background: #FFF;
    border: 1px solid #EFF1F6;
    padding: 18px;
    height: fit-content;
}
.house_detail_config_title {font-size: 16px; font-weight: 800; color: #111418;}
.house_detail_config_row {margin-top: 14px; display: grid; grid-template-columns: 120px 1fr; gap: 10px; align-items: center;}
.house_detail_config_label {color: #555966; font-size: 13px;}
.house_detail_config_controls {display: flex; gap: 8px; flex-wrap: wrap;}
.house_pill {
    border: 1px solid #EFF1F6;
    background: #FFF;
    color: #111418;
    border-radius: 999px;
    padding: 10px 12px;
    cursor: pointer;
    font-weight: 600;
    font-size: 13px;
}
.house_pill.active {border-color: #5b6936; color: #5b6936;}
.house_detail_config_summary {margin-top: 14px; padding-top: 14px; border-top: 1px solid #EFF1F6; color: #555966; font-size: 13px; display: grid; gap: 6px;}

.house_detail_grid {
    margin-top: 16px;
    padding: 0 24px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}
.house_card {border-radius: 20px; background:#FFF; border:1px solid #EFF1F6; padding: 18px;}
.house_card_title {font-weight: 800; color:#111418; margin-bottom: 10px;}
.house_specs {display: grid; gap: 10px;}
.house_specs > div {display:flex; justify-content: space-between; gap: 12px; color:#555966;}
.house_specs > div strong {color:#111418;}
.house_desc {color:#555966; line-height: 1.55;}

.house_section {margin-top: 34px; padding: 0 24px;}
.house_gallery {margin-top: 14px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px;}
.house_gallery_thumb {
    border: 0;
    padding: 0;
    background: transparent;
    cursor: pointer;
    border-radius: 12px;
    overflow: hidden;
    height: 110px;
}
.house_gallery_thumb img {width: 100%; height: 100%; object-fit: cover; display:block;}
.house_gallery_empty {color:#555966; font-size: 13px;}

/* Houses galleries: strip thumbs + full-width project image */
.house_gallery_strip{
    margin-top: 14px;
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding-bottom: 6px;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
}
.house_gallery_strip::-webkit-scrollbar {height: 6px;}
.house_gallery_strip::-webkit-scrollbar-track {background: transparent;}
.house_gallery_strip::-webkit-scrollbar-thumb {background: rgba(188, 192, 198, 0.7); border-radius: 999px;}

.house_gallery_strip .house_gallery_thumb{
    flex: 0 0 auto;
    width: 124px;
    height: 82px;
    border-radius: 10px;
    scroll-snap-align: start;
    border: 1px solid #EFF1F6;
    background: #FFF;
}

.house_gallery_project_full{
    margin-top: 14px;
    border-radius: 24px;
    overflow: hidden;
    border: 1px solid #EFF1F6;
    background: #FFF;
    height: min(56vh, 520px);
    cursor: pointer;
}
.house_gallery_project_full img{width: 100%; height: 100%; object-fit: cover; display:block;}

/* Project plan should fit fully (no crop) */
.house_gallery_project_full.plan {cursor: default;}
.house_gallery_project_full.plan img{object-fit: contain; background: #FFF;}

.house_modal_photos {position: relative;}
.house_modal_photos img {height: calc(100vh - 200px); object-fit: contain; display: none;}
.house_modal_photos img.visible {display: block;}
.house_modal_photos img.hidden {display: none;}

.house_genplan_frame {
    margin-top: 14px;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid #EFF1F6;
    height: min(70vh, 680px);
    background: #f0f0f0;
}
.house_genplan_hint {margin-top: 10px; color:#555966; font-size: 13px;}

.house_final_cta{
    border-radius: 24px;
    border: 1px solid #EFF1F6;
    background: #FFF;
    padding: 20px;
}
.house_final_cta_text{margin-top: 10px; color:#555966; line-height: 1.55; max-width: 680px;}
.house_final_cta_actions{margin-top: 16px; display:flex; gap: 10px; flex-wrap: wrap;}
.house_final_cta_actions .btn{min-width: 280px;}

.house_tabs {margin-top: 14px; display:flex; gap: 10px; flex-wrap: wrap;}
.house_tab {
    border: 1px solid #EFF1F6;
    background: #FFF;
    color: #111418;
    border-radius: 999px;
    padding: 10px 14px;
    cursor: pointer;
    font-weight: 700;
    font-size: 13px;
}
.house_tab.active {border-color: #5b6936; color: #5b6936;}

.house_plan_view{
    margin-top: 12px;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid #EFF1F6;
    background: #FFF;
    min-height: 260px;
}
.house_plan_view img {width: 100%; height: auto; display:block; object-fit: contain;}

.house_kit_card{
    margin-top: 12px;
    border-radius: 20px;
    background:#FFF;
    border:1px solid #EFF1F6;
    padding: 16px;
}
.house_kit_head{display:flex; align-items:center; justify-content: space-between; gap: 12px; flex-wrap: wrap;}
.house_kit_title{font-weight: 900; color:#111418;}
.house_kit_price{margin-top: 6px; font-weight: 900; color:#5b6936;}
.house_kit_list{margin-top: 14px; display:grid; gap: 10px;}
.house_kit_row{display:flex; justify-content: space-between; gap: 14px; color:#555966;}
.house_kit_row strong{color:#111418; font-weight: 700;}

@media only screen and (max-width: 1000px) {
    .houses_page_grid {grid-template-columns: 1fr; padding: 0 12px;}
    .house_breadcrumbs {padding: 0 12px;}
    .house_project_header {display: flex; flex-direction: column; padding: 12px 12px 0 12px;}
    .house_project_header > div:first-child {display: contents;}
    .house_detail_price_row, .house_detail_actions {padding-left: 0;}
    .house_detail_grid {grid-template-columns: 1fr; padding: 0 12px;}
    .house_section {padding: 0 12px;}
    .house_gallery {grid-template-columns: repeat(3, minmax(0, 1fr));}
    .house_gallery_project_full{border-radius: 20px; height: 240px;}
    .house_gallery_project_full.plan{height: 320px;}
    .house_gallery_strip .house_gallery_thumb{width: 110px; height: 74px;}
    .house_project_metrics {grid-template-columns: 1fr; }
    .house_project_media {order: 1; height: auto; border-radius: 20px; overflow: visible; box-shadow: none;}
    .house_project_media img {height: auto; aspect-ratio: 16 / 10; border-radius: 20px;}
    .house_project_media .house_detail_config{
        position: static;
        max-width: none;
        margin-top: 10px;
        padding: 0;
        background: transparent;
        border: 0;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    .house_project_media .house_detail_config_controls{
        background: #FFF;
        border: 1px solid #EFF1F6;
        border-radius: 999px;
        padding: 4px;
    }
    .house_project_right {order: 2;}
    .house_project_freebies {order: 3;}
    .house_project_summary {display: flex; flex-direction: column;}
    .house_project_summary > .house_price_card_title {order: 1;}
    .house_project_summary > .house_price_card_price {order: 2;}
    .house_project_summary > .house_price_card_mortgage {order: 3;}
    .house_project_summary > .house_detail_price_note {order: 4;}
    .house_project_summary > .house_price_card_cta {order: 5;}
    .house_project_summary > .house_project_facts {order: 7;}
    .house_project_summary > .block_name,
    .house_project_summary > h2,
    .house_project_summary > .house_project_note,
    .house_project_summary > .house_project_summary_divider {order: 6;}
    .house_project_info {border-radius: 20px; padding: 16px;}
    .house_actions_compact {grid-template-columns: 1fr;}
    .house_price_card_cta {grid-template-columns: 1fr;}
    .house_detail_config_detached {
        margin-top: 10px;
        margin-bottom: 8px;
        border: 0;
        background: transparent;
        padding: 0;
    }
    .house_detail_config_detached .house_detail_config_title {display: none;}
    .house_detail_config_detached .house_detail_config_label {display: none;}
    .house_detail_config_detached .house_detail_config_row {grid-template-columns: 1fr; gap: 4px; margin-top: 0;}
    .house_detail_config_detached .house_detail_config_row + .house_detail_config_row {margin-top: 6px;}
    .house_detail_config_detached .house_detail_config_summary {display: none;}
    .house_detail_config_detached .house_detail_config_controls {
        gap: 4px;
        background: rgba(255,255,255,0.86);
        border: 1px solid rgba(239,241,246,0.9);
        border-radius: 999px;
        padding: 4px;
        flex-wrap: nowrap;
    }
    .house_detail_config_detached .house_pill {
        font-size: 11px;
        line-height: 28px;
        height: 28px;
        padding: 0 9px;
        border-radius: 999px;
    }
}

/* --------------------------- FINISHING VARIANTS --------------------------- */

#finishing_variants {margin-top: 40px;}

.finishing_tabs_menu {display: flex; margin-top: 27px;}
.finishing_tabs_menu > div {
    transition: .2s; width: 150px; text-align: center; line-height: 40px; user-select: none; cursor: pointer;
    color: #9497A2; font-size: 18px; font-weight: 700; margin-right: 52px; margin-bottom: 32px; border-bottom: transparent 2px solid;
}
.finishing_tabs_menu > div:hover {color: #5b6936;}
.finishing_tabs_menu > div.active {color: #004B1E; border-bottom: #004B1E 2px solid;}

.finishing_tab {display: none; opacity: 0; transition: opacity 0.3s;}
.finishing_tab.active {display: block; opacity: 1;}

.finishing_gallery {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 32px;
}
.finishing_gallery > div {
    position: relative; border-radius: 12px; overflow: hidden; cursor: pointer;
    aspect-ratio: 4/3; background: #EFF1F6; transition: transform 0.3s ease;
}
.finishing_gallery > div:hover {transform: scale(1.02);}
.finishing_gallery > div img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}

@media only screen and (max-width: 1000px) {
    .finishing_gallery {grid-template-columns: repeat(3, 1fr); gap: 16px;}
    .finishing_tabs_menu > div {margin-right: 24px; font-size: 16px;}
}

@media only screen and (max-width: 800px) {
    .finishing_gallery {grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 24px;}
    .finishing_tabs_menu {margin-top: 20px;}
    .finishing_tabs_menu > div {font-size: 14px; line-height: 30px; margin-right: 12px; margin-bottom: 20px;}
}

@media only screen and (max-width: 600px) {
    #finishing_variants {margin-top: 32px;}
    .finishing_gallery {grid-template-columns: 1fr; gap: 12px; margin-top: 20px;}
    .finishing_tabs_menu {flex-wrap: wrap; margin-top: 16px;}
    .finishing_tabs_menu > div {width: auto; padding: 0 8px; margin-right: 8px; margin-bottom: 12px;}
}

/* --------------------------- SERVICES --------------------------- */

#services {margin-top: 40px; overflow: hidden;}

#services .slides_paginator {display: none;}

.services {display: flex;}

.services > div:nth-of-type(1) {margin-right: 30px; margin-bottom: 25px;}
.services > div:nth-of-type(1) > div:nth-of-type(2) {max-width: 435px; padding-left: 24px; margin-top: 24px; color: #555966; font-size: 16px; font-weight: 400;}

.services .btn {height: 64px; margin-top: 32px; margin-left: 24px;}

.services > div {width: 50%;}

.services > div:nth-of-type(2) {transition: all .5s ease-in-out; display: flex; flex-wrap: wrap; min-width: 600px;}
.services > div:nth-of-type(2) > div {min-width: 280px; width: 47%; max-width: 340px; margin-right: 20px; margin-bottom: 20px;}
.services > div:nth-of-type(2) > div:nth-child(2n) {margin-right: 0;}
.services > div:nth-of-type(2) > div:nth-last-child(-n+2) {margin-bottom: 0;}
.services_item {position: relative; border-radius: 20px; overflow: hidden;}

.services_item > div {position: absolute; color: #FFF; font-size: 24px; font-weight: 700; bottom: 24px; padding: 0 32px;}

.services_item img {width: 100%; height: 100%;}

@media only screen and (max-width: 1000px) {
    .services {flex-direction: column;}
    .services > div:nth-of-type(2) {min-width: 400px;}
    .services > div:nth-of-type(2) > div {min-width: 200px;}
    .services > div {width: 100%;}
    .services .btn {display: none;}
    .services > div:nth-of-type(1) > div:nth-of-type(2) {padding-left: 0; font-size: 14px; margin-top: 16px;}
}

@media only screen and (max-width: 600px) {
    .services_item {border-radius: 8px;}
    #services {margin-top: 32px; overflow-x: hidden;}
    .services > div:nth-of-type(2) {display: flex; flex-wrap: nowrap; -webkit-justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch;}
    .services > div:nth-of-type(2) > div:nth-child(2n) {margin-right: 20px;}
    .services > div:nth-of-type(2) > div {min-width: 241px; margin-bottom: 0; min-height: 201px; flex-shrink: 0;}
    .services_item > div {bottom: 16px; padding: 0 16px; font-size: 22px; font-weight: 500;}
    #services .slides_paginator {display: block;}
}

/* --------------------------- MORTGAGE --------------------------- */

#mortgage {margin-top: 40px;}

.mortgage {border-radius: 20px 20px 20px 0; overflow: hidden; position: relative;}

#mortgage .background_mobile {display: none; height: 654px; width: 100%; object-fit: cover; object-position: left bottom;}
#mortgage .background {height: 341px; width: 100%; object-fit: cover; object-position: left bottom;}
.mortgage strong {font-size: 60px;}

.mortgage > div > div:nth-of-type(2) {width: 40%;}
.mortgage > div:nth-of-type(2) {position: absolute; top: 50px; padding: 0 48px; display: flex; align-items: baseline;}
.mortgage > div:nth-of-type(2) > div:nth-of-type(1) {width: 40%; line-height: 60px; }
.mortgage > div:nth-of-type(2) > div:nth-of-type(1) {color: #FFF; font-size: 40px; font-weight: 700;}
.mortgage > div:nth-of-type(2) > div:nth-of-type(2) {color: #FFF; font-size: 16px; font-weight: 400;}

.mortgage > div:nth-of-type(3) {min-width: 666px; display: flex; flex-wrap: wrap; position: absolute; bottom: 15px; left: 40%; width: 55%;}
.mortgage > div:nth-of-type(3) > a {min-width: 33.3%; max-width: 33.3%;}
.mortgage > div:nth-of-type(3) .btn {width: calc(100% - 12px); height: 67px; border: 1px solid rgba(239, 241, 246, 0.30); margin-right: 12px !important;}
.mortgage > div:nth-of-type(3) .btn:nth-child(-n+3) {margin-bottom: 12px;}
.mortgage > div:nth-of-type(3) .btn:last-child {margin-right: 0;}
.mortgage > div:nth-of-type(3) .btn img {height: 30px; width: 100% !important; object-fit: contain !important; object-position: center !important;}
.mortgage > div:nth-of-type(3) > a:nth-of-type(2) .btn img {height: 25px;}
.mortgage > div:nth-of-type(3) > a:nth-of-type(3) .btn img {height: 42px;}
.mortgage > div:nth-of-type(3) > a:nth-of-type(4) .btn img {height: 26px;}
.mortgage > div:nth-of-type(3) > a:nth-of-type(5) .btn img {height: 40px;}

.mortgage > .btn:nth-of-type(1) {width: 323px; height: 64px; position: absolute; bottom: 0; left: 0;}

@media only screen and (max-width: 1400px) {
    .mortgage > div:nth-of-type(2) > div:nth-of-type(1) {width: 40%;}
    .mortgage > div:nth-of-type(3) .btn {margin-right: 20px;}
}

@media only screen and (max-width: 1200px) {
    .mortgage > div:nth-of-type(2) > div:nth-of-type(1) {width: 100%;}
    .mortgage > div > div:nth-of-type(2) {width: 100%;}
    .mortgage > div:nth-of-type(2) {flex-direction: column; width: 50%;}
    .mortgage > div:nth-of-type(3) {padding: 0 17px; min-width: 0;}
    .mortgage > div:nth-of-type(3) {flex-direction: column; bottom: 3px; right: 32px; left: auto; width: 40%;}
    .mortgage > div:nth-of-type(3) > a {width: 100%; max-width: 100%;}
    .mortgage > div:nth-of-type(3) .btn {margin-right: 0 !important; margin-bottom: 8px !important;}
    .mortgage > div:nth-of-type(3) .btn:last-child {margin-bottom: 0;}
    .mortgage > div:nth-of-type(3) .btn {height: 56px; width: 100%;}
    .mortgage > div:nth-of-type(2) > div:nth-of-type(1) {font-size: 24px; line-height: 40px;}
    .mortgage > div:nth-of-type(2) > div:nth-of-type(2) {font-size: 14px; margin-top: 12px;}
    .mortgage strong {font-size: 48px;}
}

@media only screen and (max-width: 800px) {
    .mortgage > div:nth-of-type(3) {display: none;}
    .mortgage > div:nth-of-type(2) {width: 100%;}
}

@media only screen and (max-width: 600px) {
    #mortgage {margin-top: 32px;}
    #mortgage .background {height: 543px; display: none;}
    #mortgage .background_mobile {display: block;}
    .mortgage > div:nth-of-type(2) {padding: 0 28px;}
    .mortgage > div:nth-of-type(3) {display: flex; width: 100%; left: unset; right: auto; bottom: 80px;}
    .mortgage > .btn:nth-of-type(1) {width: 282px; height: 56px; font-size: 16px;}
    .mortgage > div:nth-of-type(3) .btn {margin-bottom: 12px !important;}
}

/* -------------------------- QUESTIONS -------------------------- */

#questions {margin-top: 40px; height: 745px;}

#questions_modal {pointer-events: auto; opacity: 1; width: 100%; height: 100%; min-height: 600px; transition: all 0.35s ease-out;}

#questions_modal .questions_form {right: -32px;}

.questions_modal_close {
    z-index: 10050; position: fixed; top: 12px; right: 12px;
    width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
    border-radius: 50%; background: rgba(255, 255, 255, 0.18); border: 1px solid rgba(255, 255, 255, 0.45);
    font-size: 28px; line-height: 1; color: #fff; opacity: 1; cursor: pointer;
    transition: background 0.2s ease-out; -webkit-tap-highlight-color: transparent;
}
.questions_modal_close:hover {background: rgba(255, 255, 255, 0.3);}

#questions .wrap, #questions_modal .wrap {position: relative;}
#questions_modal .wrap {max-width: 900px;}

#questions .background, #questions_modal .background {max-width: 934px; width: 100%; max-height: 644px; min-height: 297px; border-radius: 20px; overflow: hidden;}

#questions .background img, #questions_modal .background img {width: 100%; object-fit: cover;}

#modal_question_name_error, #modal_question_phone_error, #question_name_error, #question_phone_error {
    opacity: 0; transition: .2s; position: absolute; top: 24px; right: 32px; font-size: 12px; font-weight: 400; color: #F46F6F;
    pointer-events: none;
}

#modal_question_name_error.active, #modal_question_phone_error.active, #question_name_error.active, #question_phone_error.active {opacity: 1;}

#phone {transition: .1s; line-height: 64px;}

.questions_form {
    display: none; padding: 48px; position: absolute; color: #FFF; right: 32px; max-width: 578px;
    width: calc(100% - 64px); height: 523px; top: 221px; background: #5b6936; border-radius: 20px;
}
.questions_form.active {display: block;}

.questions_form .questions_title {font-size: 40px; font-weight: 700; padding-bottom: 16px;}

#question_success .questions_title, #modal_question_success .questions_title {text-align: center;}
#question_success .questions_info, #modal_question_success .questions_info {text-align: center;}
#question_success.active, #modal_question_success.active {display: flex; flex-direction: column; align-items: center; justify-content: center;}

.questions_form .questions_info {font-size: 16px; font-weight: 400; padding-bottom: 24px;}

.questions_form input {border: 1px solid transparent; transition: .2s; background: rgba(255, 255, 255, 0.10); width: 100%; height: 64px; margin-bottom: 24px; font-size: 16px;}

.questions_form input.error {border: 1px solid #F46F6F;}

.questions_form > div:nth-of-type(3), .questions_form > div:nth-of-type(4) {position: relative;}

.questions_form > div:last-child {display: flex; width: 100%; flex-direction: row-reverse;}

.questions_form > div > div:nth-of-type(2) {margin-right: 25px; width: 50%;}
.questions_form > div > div:nth-of-type(2) {font-size: 12px; font-weight: 400;}

.questions_form .btn {width: 220px !important; background: #FFF; color: #5b6936;}
.questions_form .btn:hover {background: #EFF1F6;}

@media only screen and (max-width: 1000px) {
    #questions_modal .questions_form {right: 32px;}
}

@media only screen and (max-height: 900px) {
    #questions_modal .questions_form {top: 200px; height: auto; min-height: 0;}
    #modal_content {margin: 0 auto;}
}

@media only screen and (max-height: 719px) {
    .questions_form .questions_title {font-size: 35px;}
    #questions_modal .background {width: 80%;}
    #questions_modal .questions_form {width: calc(100% - 64px); top: 120px; height: auto; min-height: 0; padding: 28px; max-width: 528px;}
}

@media only screen and (max-width: 600px) {
    .questions_form {right: 12px; width: calc(100% - 24px); padding: 28px; height: auto;}
    #questions_modal {min-height: 0; height: auto; padding: 56px 12px 24px; box-sizing: border-box;}
    #questions_modal .background {display: none;}
    #questions_modal .wrap {max-width: none;}
    #questions_modal .questions_form {
        position: relative; top: auto; right: auto; width: 100%; height: auto; min-height: 0;
        padding: 24px 20px 28px; margin: 0; box-sizing: border-box;
    }
    #questions_modal .questions_form > div:last-child {flex-direction: column; gap: 16px;}
    #questions_modal .questions_form > div > div:nth-of-type(2) {
        width: 100%; margin: 0; word-wrap: break-word; overflow-wrap: break-word;
        font-size: 11px; line-height: 1.45; overflow: visible;
    }
    .questions_modal_close {
        top: max(12px, env(safe-area-inset-top, 0px));
        right: max(12px, env(safe-area-inset-right, 0px));
    }
    #modal.active #modal_overlay {align-items: flex-start; padding: 0;}
    #modal_content.mobile {margin: 0 !important; width: 100% !important; min-height: 100%; padding-bottom: env(safe-area-inset-bottom, 0px);}
    #questions {margin-top: 32px; height: 676px;}
    .questions_form .questions_title {font-size: 24px;}
    .questions_form .questions_info {font-size: 14px;}
    .questions_form > div {flex-direction: column;}
    .questions_form > div > div:nth-of-type(2) {width: 100%; margin-top: 25px; word-wrap: break-word; overflow-wrap: break-word; font-size: 11px; line-height: 1.4;}
    .questions_form > div .btn {width: 100% !important;}
    .questions_form > div:not(.btn):last-child {flex-direction: column;}
    .questions_form input {height: 56px; font-size: 14px;}
    .questions_form input::placeholder {font-size: 14px;}
}

@media only screen and (max-width: 400px) {
    .questions_form {height: auto;}
    #question_success.active {height: 455px;}
    #questions {height: 750px;}
}

/* ------------------------------- MEDIA ------------------------------- */

#media_section {margin-top: 40px;}

.media_header {display: flex; align-items: center;}
.media_all {display: none; cursor: pointer; color: #5b6936; font-size: 14px; font-weight: 500; margin-left: auto;}

.media_title {font-size: 40px; font-weight: 700; line-height: 130%; letter-spacing: 0.2px; margin-left: 24px; color: #111418;}

.media_items {display: flex; flex-wrap: wrap; padding-top: 40px;}
.media_items > div {flex: 1 0 33.333%; max-width: 33.333%; padding: 0 8px 16px 8px;}

.media_item {background: #FFFFFF; border-radius: 20px; padding: 25px 16px; height: 100%; position: relative;}
.media_item > img {height: 28px; width: auto;}
.media_item > div {font-size: 16px; padding-top: 22px; line-height: 130%; color: #111318; padding-bottom: 36px;}
.media_item > a {position: absolute; bottom: 25px; left: 16px; text-decoration: none; font-size: 14px; line-height: 130%; color: #5b6936; margin-top: 16px;}
.media_item > a:hover {text-decoration: underline;}

@media only screen and (max-width: 800px) {
    .media_items > div {display: none;}
    .media_items > div:nth-child(4) {padding: 0;}
    .media_items.active > div:nth-child(4) {padding: 0 0 22px 0;}
    .media_items > div:nth-child(-n+4) {display: block;}
    .media_items.active > div {display: block !important;}
    .media_all {display: block;}
    .media_title {font-size: 24px; margin-left: 0;}
    .media_items {flex-direction: column; padding-top: 20px;}
    .media_items > div {flex: 1 0 100%; max-width: 100%; padding: 0 0 22px 0;}
    .media_items > div:last-child {padding: 0;}
    .media_item > div {font-size: 14px;}
    .media_item > a {text-decoration: none;}
}

@media only screen and (max-width: 600px) {
    #media_section {margin-top: 32px;}
}

/* -------------------------- FOUNDERS -------------------------- */

#founders {margin-top: 40px;}

.founders {display: flex; margin-top: 41px;}
.founder {margin-right: 12px; width: calc(33.3% - 8px);}
.founders > div:nth-child(3) {margin-right: 0 !important;}

.founder_background {overflow: hidden; max-height: 395px; width: 100%; max-width: 301px; border-radius: 20px;}

.founder_background img {width: 100%; height: 100%; object-fit: cover;}

.founder > div:nth-of-type(2) {color: #1A222A; font-size: 18px; font-weight: 700; margin-top: 18px;}

.founders_info {width: 30%; padding-left: 50px;}

.founders_title:nth-of-type(1) {color: #1A222A; font-size: 24px; font-weight: 700;}

.founders_title:nth-of-type(2) {color: #1A222A; font-size: 60px; font-weight: 700;}

.founders_desc {color: #1A222A; font-size: 16px; font-weight: 400;}

@media only screen and (max-width: 1000px) {
    .founders {flex-wrap: wrap; -webkit-justify-content: flex-end;}
    .founder_background {width: 100%;}
    .founders_info {margin-top: 32px; flex-basis: 66%; padding-left: 0;}
}

@media only screen and (max-width: 800px) {
    .founders {margin-top: 16px;}
    .founder > div:nth-of-type(2) {font-size: 14px; margin-top: 10px;}
    .founders_title:nth-of-type(1) {font-size: 20px;}
    .founders_title:nth-of-type(2) {font-size: 48px;}
    .founders_desc {font-size: 14px;}
    .founders_desc:last-child {display: none;}
}

@media only screen and (max-width: 600px) {
    .founders_info {flex-basis: 66.6%;}
    #founders {margin-top: 32px;}
    .founder > div:nth-of-type(2) span {display: block;}
}

/* -------------------------- CONTACTS -------------------------- */

#contacts {margin-top: 40px; width: 100%; padding: 0 32px; margin-left: auto; margin-right: auto; max-width: 1440px;}

#contacts .wrap {border-radius: 20px; background: #FFF; padding: 50px 32px 50px 32px;}

.contacts {display: flex;}

#contacts .block_name, #contacts h2 {padding: 0;}
#contacts h1 {padding-left: 0; color: #1A222A; font-size: 40px; font-weight: 700; padding-top: 0; line-height: 120%;}

.contacts .contacts_info {width: 50%;}

.contacts .map {width: 50%; overflow: hidden;}

.contacts .map iframe {border-radius: 20px;}

.contacts_info > div:nth-of-type(1) {display: flex; flex-direction: row-reverse; margin-top: 32px;}

.contacts_info > div:nth-of-type(1) > div:first-child {width: 50%; display: flex; flex-direction: column; margin-bottom: 0;}
.contacts_info > div:nth-of-type(1) > div:first-child > div {margin-bottom: 30px; padding-left: 20px;}
.contacts_info > div:nth-of-type(1) > div:last-child {width: 50%; display: flex; flex-direction: column; margin-bottom: 0;}
.contacts_info > div:nth-of-type(1) > div:last-child > div {margin-bottom: 30px;}
.contacts_info > div:nth-of-type(1) > div:last-child .contacts_title {margin-bottom: 6px;}
.contacts_info > div:nth-of-type(1) > div:last-child > div:first-child .contacts_title {margin-bottom: 3px;}
.contacts_info > div:nth-of-type(1) > div:last-child > div:last-child {margin-bottom: 0;}

.contacts_desc {color: #555966; font-size: 14px; font-weight: 400; margin-bottom: 6px; position: relative;}
.contacts_desc.underline::after {position: absolute; bottom: -2px; left: 0; width: 100%; height: 1px; content: ""; background: #5b6936; opacity: 0; transition: .3s ease-in-out;}
.contacts_desc.underline:hover::after {opacity: 1;}
.contacts_desc:hover {color: #5b6936;}

.link_map {position: relative;}
.link_map.underline::after {position: absolute; bottom: -2px; left: 0; width: 100%; height: 1px; content: ""; background: #5b6936; opacity: 0; transition: .3s ease-in-out;}
.link_map.underline:hover::after {opacity: 1;}

.contacts_title {color: #1A222A; margin-bottom: 3px; font-size: 18px; font-weight: 700;}

.link_map {font-size: 14px; font-weight: 500; text-decoration: none; margin-top: 10px;}

.contacts_info > div:nth-of-type(2) {width: 50%; color: #9497A2; font-size: 12px; font-weight: 400; margin-top: 46px;}

.contacts_info .btn {height: 64px; margin-top: 20px;}

.contacts .map {height: 429px;}

@media only screen and (max-width: 1000px) {
    .contacts {flex-direction: column-reverse; margin-top: 12px;}
    #contacts h1 {padding-left: 0; font-size: 24px;}
    .contacts .map {width: 100%; margin-bottom: 12px;}
    .contacts .contacts_info {width: 100%;}
    #contacts .wrap {padding: 32px 32px;}
}

@media only screen and (max-width: 800px) {
    .contacts .map {margin-top: 0;}
    #contacts .wrap {padding: 24px 12px;}
}

@media only screen and (max-width: 600px) {
    .contacts .map {height: 279px;}
    #contacts {margin-top: 32px; padding: 0 12px;}
    .contacts_info > div:nth-of-type(1) {flex-direction: column; margin-top: 0;}
    .contacts_info > div:nth-of-type(1) > div:first-child {flex-direction: row; flex-wrap: wrap; width: 100%;}
    .contacts_info > div:nth-of-type(1) > div:first-child > div {width: 50%; padding-left: 0;}
    .contacts_info > div:nth-of-type(1) > div:first-child > div:last-child {width: 100%;}
    .contacts_info > div:nth-of-type(1) > div:last-child {width: 100%;}
    .contacts_info > div:nth-of-type(2) {width: 100%; margin-top: 12px;}
    .contacts_info .btn {width: 100%; height: 56px;}
    .contacts_info .btn {margin-top: 24px;}
    #contacts .wrap {padding: 24px 12px;}
}

/* ------------------------ CONTACTS MENU ------------------------ */

#contacts_menu {margin-top: 40px;}

.contacts_menu {display: flex;}

.contacts_menu > div {position: relative; margin-right: 20px; width: 33%; height: 203px; display: flex; border-radius: 20px; background: #FFF; padding: 35px 20px;}
.contacts_menu > div:last-child {margin-right: 0; margin-bottom: 0;}
.contacts_menu > div:last-child .btn {margin-top: 18px;}

.contacts_menu_title {color: #1A222A; font-size: 18px; font-weight: 700;}
.contacts_menu_desc {color: #555966; font-size: 16px; font-weight: 400;}

.contacts_menu .btn {width: 151px; max-width: 420px; height: 42px; border-radius: 8px; padding: 12px 16px; font-size: 14px;}
.contacts_menu .btn i {font-weight: normal;}

.contacts_menu > div > div:nth-of-type(1) {display: flex; justify-content: center; align-items: center; min-width: 54px; width: 54px; height: 54px; border-radius: 50%; background: #ECF9EF;}
.contacts_menu > div > div:nth-of-type(1) > i {font-size: 24px; color: #02601C;}
.contacts_menu > div > div:nth-of-type(2) {margin-left: 24px; width: 100%;}
.contacts_menu > div:nth-of-type(1) > div:nth-of-type(1) > i {font-size: 20px; line-height: 20px;}
.contacts_menu > div:nth-of-type(1) .btn {position: absolute; bottom: 35px;}
.contacts_menu > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child {
    display: flex !important; 
    position: absolute; 
    bottom: 35px; 
    gap: 16px; 
    width: auto; 
    align-items: center;
}
.contacts_menu > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child a {
    display: inline-block;
    transition: opacity 0.2s ease;
}
.contacts_menu > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child a:hover {
    opacity: 0.7;
}
.contacts_menu > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child img {
    height: 40px; 
    width: auto; 
    display: block;
}

.contacts_addresses {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 20px;
}

.contacts_address_card {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    background: #FFF;
    border-radius: 20px;
    padding: 28px 24px;
    border: 1px solid rgba(91, 105, 54, 0.08);
    box-shadow: 0 8px 28px rgba(26, 34, 42, 0.04);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.contacts_address_card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(26, 34, 42, 0.08);
}

.contacts_address_icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: #ECF9EF;
}

.contacts_address_icon i {
    font-size: 22px;
    color: #02601C;
}

.contacts_address_icon_village {
    background: #f3f5ec;
}

.contacts_address_body {min-width: 0;}

.contacts_address_label {
    display: inline-block;
    margin-bottom: 8px;
    padding: 4px 10px;
    border-radius: 999px;
    background: #f3f5ec;
    color: #5b6936;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.contacts_address_title {
    color: #1A222A;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
}

.contacts_address_text {
    margin-top: 8px;
    color: #555966;
    font-size: 15px;
    line-height: 1.5;
}

.contacts_address_link {
    display: inline-flex;
    margin-top: 14px;
    color: #5b6936;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid rgba(91, 105, 54, 0.25);
    transition: color 0.2s ease, border-color 0.2s ease;
}

.contacts_address_link:hover {
    color: #004B1E;
    border-bottom-color: #004B1E;
}

@media only screen and (max-width: 1110px) {
    .contacts_menu > div {flex-direction: row; margin-bottom: 20px; width: 100%;}
    .contacts_menu {flex-direction: column;}
    .contacts_addresses {grid-template-columns: 1fr;}
}

@media only screen and (max-width: 600px) {
    .contacts_menu > div:nth-of-type(1) .btn {bottom: 24px; left: 20px; right: 20px; width: auto; max-width: none;}
    .contacts_menu > div:nth-of-type(2) .btn {bottom: 24px;}
    .contacts_menu > div:nth-of-type(2) .social-icons-container {
        margin-top: 63px !important;
    }
    .contacts_menu > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child {
        bottom: auto; 
        position: relative; 
        width: 100%; 
        margin-top: 0 !important;
        display: flex !important;
        flex-direction: row;
        gap: 16px;
        flex-wrap: wrap;
    }
    .contacts_menu > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child img {
        height: 36px;
        width: auto;
    }
    .contacts_menu > div {height: auto; min-height: 172px; padding: 24px 20px;}
    .contacts_menu_title {font-size: 14px;}
    .contacts_menu_desc {font-size: 14px; margin-top: 4px;}
    #contacts_menu {margin-top: 32px;}
    .contacts_menu .btn {width: 100%; max-width: 100%; min-width: auto;}
    .contacts_menu > div:nth-of-type(1) .btn {width: calc(100% - 40px);}
    .contacts_menu > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child .btn {width: 100%; max-width: 100%;}
    .contacts_addresses {gap: 12px; margin-top: 12px;}
    .contacts_address_card {padding: 20px 16px; gap: 14px; border-radius: 16px;}
    .contacts_address_icon {width: 46px; height: 46px;}
    .contacts_address_icon i {font-size: 18px;}
    .contacts_address_title {font-size: 16px;}
    .contacts_address_text {font-size: 13px; margin-top: 6px;}
    .contacts_address_link {margin-top: 10px; font-size: 13px;}
}

/* houses */

.modal_houses {padding: 50px 50px 40px 50px; border-radius: 20px; background: #fff; position: relative;}
.house_modal_close {color: #5b6936; transition: .2s ease-in-out; z-index: 9999; position: absolute; top: 20px; right: 20px; cursor: pointer;}
.house_modal_close:hover {color: #4a5630;}

.modal_houses_header {display: flex; padding-bottom: 30px;}
.modal_houses_header > div {width: 50%; margin-top: auto;}

.modal_houses_title {font-size: 28px; font-weight: 600; color: #111418;}
.modal_houses_price {font-size: 24px; font-weight: 600; color: #111418; padding-top: 30px;}
.modal_houses_price small {font-size: 16px;}
.modal_houses_note {font-size: 14px; line-height: 110%; color: #5b6936; height: 22px; padding-top: 6px;}

.modal_houses_header_right {display: flex; align-items: baseline; justify-content: end;}
.modal_houses_calendar .icon_calendar {font-size: 26px; position: relative; top: 1px; color: #5b6936;}
.modal_houses_duration {padding-left: 16px;}
.modal_houses_duration > div:nth-of-type(1) {font-size: 28px; font-weight: 600; color: #111418;}
.modal_houses_duration > div:nth-of-type(2) {font-size: 14px; color: #5b6936; line-height: 100%; padding-top: 4px;}

.modal_houses_desc_title {font-size: 14px; font-weight: 700; line-height: 130%; color: #111418;}
.modal_houses_desc_items {display: flex; flex-direction: row; flex-wrap: wrap; padding-top: 14px; padding-bottom: 20px;}
.modal_houses_desc_items > div {flex: 1 0 50%; font-size: 14px; line-height: 130%; color: #111418; padding-bottom: 8px;}

.modal_houses_table {display: flex; flex-direction: column; width: 100%;}
.modal_houses_table > div:nth-child(1) {width: 100%; height: auto; margin-bottom: 12px;}
.modal_houses_table > div:nth-child(2) {display: flex; width: 100%; overflow: hidden;}
.modal_houses_table > div:nth-child(2) > div {display: flex; transition: .3s ease-in-out;}
.modal_houses_table > div:nth-child(2) > div > div {
    display: flex; align-items: center; width: 20%; min-width: 150px; padding-right: 8px; cursor: pointer; position: relative;
}
.modal_houses_table > div:nth-child(2) > div > div:after {
    content: ''; position: absolute; top: 0; left: 0; bottom: 0; width: calc(100% - 8px); background: rgba(0, 0, 0, 0); pointer-events: none;
    transition: all 0.35s ease-out;
}
.modal_houses_table > div:nth-child(2) > div > div:hover:after {background: rgba(0, 0, 0, 0.15);}
.modal_houses_table > div:nth-child(2) > div > div.modal_houses_table_plan:after {
    content: ''; position: absolute; top: 0; left: 0; bottom: 0; width: calc(100% - 8px); pointer-events: none;
    border: 1px solid #eee; transition: all 0.2s ease-out;
}
.modal_houses_table > div:nth-child(2) > div > div.modal_houses_table_plan:hover:after {border-color: #5b6936;}

#house_photo_cover {display: block; touch-action: pan-y pinch-zoom; user-select: none; -webkit-user-select: none;}

.modal_houses_extra {display: flex; flex-wrap: wrap; width: 100%; font-weight: 400; padding-top: 20px;}
.modal_houses_extra > div {flex: 33.333%; max-width: 33.333%; padding-top: 30px;}
.modal_houses_extra > div {padding-top: 20px; padding-right: 20px; position: relative;}
.modal_houses_extra > div:after {content: ''; position: absolute; bottom: 3px; left: 0; right: 20px; border-bottom: 1px dashed #BCC0C6;}
.modal_houses_extra > div:nth-child(3n):after {right: 0;}
.modal_houses_extra > div:nth-child(3n) {padding-right: 0;}
.modal_houses_extra span:nth-child(1) {background: #fff; z-index: 1; position: relative; padding-right: 5px;}
.modal_houses_extra span:nth-child(2) {float: right; background: #fff; z-index: 1; position: relative; padding-left: 5px;}

.modal_houses_desc_main {padding-top: 30px;}
.modal_houses_desc_main > div {display: flex; font-size: 14px; line-height: 130%; color: #111418; padding-bottom: 8px;}
.modal_houses_desc_main > div > div:nth-of-type(1) {padding-right: 8px; font-size: 20px;}
.modal_houses_desc_main > div > div > span {font-weight: 600;}

.modal_houses_desc_note {padding-top: 50px;}
.modal_houses_desc_note > div {font-size: 12px; line-height: 130%; color: #111418; padding-bottom: 4px;}
.modal_houses_desc_note > div.rubcoff {font-size: 14px; margin-bottom: 1rem; line-height: 140%;}
.modal_houses_desc_note > div > span {font-weight: 600;}

/* paginator */

.modal_slides_paginator {display: table; margin-top: 25px; margin-bottom: 30px;}
.modal_slides_paginator_btn {display: table-cell; vertical-align: middle; width: 0;}

.modal_slides_paginator_arrow {color: #AEB3BB; font-size: 20px;}
.modal_slides_paginator_arrow.active {color: #5b6936; cursor: pointer;}
#modal_slides_paginator_prev {margin-right: 25px;}
#modal_slides_paginator_next {margin-left: 25px;}
#modal_slides_paginator_progress {height: 2px; background: #5b6936; transition: all 0.35s ease-in-out;}

@media only screen and (max-width: 800px) {
    .modal_houses {padding: 15px 15px 35px 15px; border-radius: 0; max-height: none; overflow: visible;}
    .modal_houses_header {flex-direction: column;}
    .modal_houses_header > div {width: 100%;}
    .modal_houses_duration {padding-left: 0;}
    .modal_houses_calendar {display: none;}
    .modal_houses_header_right {justify-content: start; padding-top: 20px;}
    .modal_houses_table > div:nth-child(2) > div {margin-bottom: 5px;}
    .modal_houses_desc_items {flex-direction: column;}
    .modal_houses_desc_items > div {flex: 1 0 100%; padding-bottom: 4px;}
    .modal_houses_extra > div {flex: 100%; max-width: 100%; padding-right: 0;}
    .modal_houses_extra > div:after {right: 0;}
    #modal_container {overflow-y: auto; -webkit-overflow-scrolling: touch; touch-action: pan-y;}
    #modal_content {overflow: visible;}
}

/* ------------------------ HOUSES ------------------------ */

#houses {margin-top: 20px;}

.link_more {height: 64px; width: 100%; text-align: center;}
#houses a {line-height: 64px; text-align: center; font-size: 14px; font-weight: 500;}

.houses_title {display: flex; align-items: center;}
.houses_title > div {width: 50%;}
.houses_title > div:last-child {margin-left: auto; width: calc(50% - 48px); color: #8F97A6; font-size: 16px; font-weight: 400;}
.houses_title h1 {padding-left: 24px; color: #1A222A; font-size: 40px; font-weight: 700; padding-top: 10px; line-height: 120%;}

#houses .houses {display: flex; flex-wrap: wrap; margin-top: 30px;}
#houses .houses > div {
    display: flex; align-items: flex-end; width: calc(33.333% - 16px); min-height: 440px; max-height: 605px; height: 40vw; transition: .3s ease-in-out;
    border-radius: 20px; overflow: hidden; position: relative; padding-top: 20%; margin-left: 24px; cursor: pointer; background-size: 110% !important;
}
#houses .houses > div:hover {background-size: 120% !important;}
#houses .houses > div:first-child {margin-left: 0;}

#houses .houses > div:nth-of-type(1) {margin-left: 0; background: url(../images/houses/barn.jpg?2) center / cover;}
#houses .houses > div:nth-of-type(2) {background: url(../images/houses/house_15p_1.jpg) center / cover;}
#houses .houses > div:nth-of-type(3) {background: url(../images/houses/house_16p_1.jpg) center / cover;}
#houses .houses > div:nth-of-type(4) {margin-top: 24px; margin-left: 0; background: url(../images/houses/house_17p_1.jpg) center / cover;}
#houses .houses > div:nth-of-type(5) {margin-top: 24px; background: url(../images/houses/house_18p_1.jpg) center / cover;}
#houses .houses > div:nth-of-type(6) {margin-top: 24px; background: url(../images/houses/house_19p_1.jpg) center / cover;}
#houses .houses > div:nth-of-type(7) {margin-left: 0; margin-top: 24px; background: url(../images/houses/313.jpg) center / cover;}
#houses .houses > div:nth-of-type(8) {margin-top: 24px; background: url(../images/houses/336.jpg) center / cover;}
#houses .houses > div:nth-of-type(9) {margin-top: 24px; background: url(../images/houses/367.jpg) center / cover;}
#houses .houses > div:nth-of-type(10) {margin-top: 24px; margin-left: 0; background: url(../images/houses/366.jpg) center / cover;}
#houses .houses > div:nth-of-type(11) {margin-top: 24px; background: url(../images/houses/346.jpg) center / cover;}
#houses .houses > div:nth-of-type(12) {margin-top: 24px; background: url(../images/houses/312.jpg) center / cover;}
#houses .houses > div:nth-of-type(13) {margin-top: 24px; margin-left: 0; background: url(../images/houses/flagman.jpg) center / cover;}
#houses .houses > div:nth-of-type(14) {margin-top: 24px; background: url(../images/houses/brez.jpg) center / cover;}
#houses .houses > div:nth-of-type(15) {margin-top: 24px; background: url(../images/houses/istok.jpg) center / cover;}
#houses .houses > div:nth-of-type(16) {margin-top: 24px; margin-left: 0; background: url(../images/houses/grot.jpg) center / cover;}
#houses .houses > div:nth-of-type(17) {margin-top: 24px; background: url(../images/houses/baobab.jpg) center / cover;}
#houses .houses > div:nth-of-type(18) {margin-top: 24px; background: url(../images/houses/kedr.jpg) center / cover;}

@media only screen and (max-width: 800px) {
    #houses .houses {margin-top: 24px;}
    .houses_title {flex-direction: column; align-items: flex-start;}
    .houses_title > div {width: 100%;}
    .houses_title > div:last-child {width: 100%;margin-top: 12px; font-size: 14px;}
    .houses_title h1 {padding-left: 0; font-size: 24px;}
    #houses .houses > div {margin-left: 0; margin-top: 12px; width: 100%;}
    #houses .houses > div:nth-of-type(4) {margin-top: 12px;}
    #houses .houses > div:nth-of-type(5) {margin-top: 12px;}
    #houses .houses > div:nth-of-type(6) {margin-top: 12px;}
    #houses .houses > div:nth-of-type(7) {margin-top: 12px;}
    #houses .houses > div:nth-of-type(8) {margin-top: 12px;}
    #houses .houses > div:nth-of-type(9) {margin-top: 12px;}
    #houses .houses > div:nth-of-type(10) {margin-top: 12px;}
    #houses .houses > div:nth-of-type(11) {margin-top: 12px;}
    #houses .houses > div:nth-of-type(12) {margin-top: 12px;}
    #houses .houses > div:first-child {margin-top: 0;}
}

/* ---------------------- SETTLEMENTS --------------------- */

/* preloader card */

.loading {pointer-events: none; position: relative; overflow: hidden;}
.loading::before {
    content: ''; position: absolute; top: -100%; height: 300%; max-width: 45px; width: 45px; transform: rotate(45deg); z-index: 5;
    left: -150%; background: linear-gradient(90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.4)); animation: flare_animation 1s infinite linear;
}
@keyframes flare_animation {
    0% {left: -150%;}
    100% {left: 150%;}
}

/* settlements */

#settlements {margin-top: 40px;}

#settlements .wrap {display: flex; flex-direction: column;}

#settlements .filters {display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 30px;}
#settlements .filters > .btn {margin-right: 14px; border-radius: 30.5px; border: 1px solid #D7D9E0; background: #FFF; color: #1A222A; margin-bottom: 10px;}
#settlements .filters > .btn:hover, #settlements .filters > .btn.active {background: #5b6936; color: #FFFFFF;}

.more_picture {
    width: 53px; border-radius: 24px; background: #E4E0E0; height: 44px; color: #1A222A; cursor: pointer;
    text-align: center; font-size: 14px; font-weight: 700; position: absolute; bottom: -4px; right: -7px; line-height: 44px; z-index: 3;
    transition: .2s;
}

.more_picture:hover {color: #5b6936;}

.settlement {
    width: 100%; height: 380px; position: relative; display: flex; padding: 30px; border-radius: 20px;
    background: url(../images/settlements/background.svg) right bottom / cover no-repeat;
    filter: drop-shadow(4px 4px 12px rgba(0, 0, 0, 0.10));
}

.settlement .block_name {padding: 0; color: #898989; font-size: 12px; font-weight: 500; text-transform: uppercase;}
.settlement h2 {padding: 0; color: #1A222A; font-size: 24px; font-weight: 700;}
.settlement h2.loading {color: transparent; border-radius: 12px; background: #EFF1F6;}
.settlement:not(.region) h2 {cursor: pointer; transition: .3s ease-in-out;}
.settlement:not(.region) h2:hover {color: #5b6936;}

.settlement:not(.region) .main {border-radius: 20px; width: 100%; cursor: pointer;}
.settlement:not(.region) .additional {display: flex; flex-direction: column; width: 131px; height: 100%;}
.settlement:not(.region) .additional > div {margin-top: 20px; border-radius: 20px; width: 131px; height: 94px; cursor: pointer;}
.settlement:not(.region) .additional > div:first-child {margin-top: 0; position: relative;}
.settlement:not(.region) .additional > div:last-child {position: relative;}

.settlement:not(.region):nth-of-type(1) {margin-bottom: 40px;}
.settlement:not(.region):nth-of-type(1) .main .sticker {top: 25px; left: 25px; height: 48px;}
.settlement:not(.region):nth-of-type(1) .main {margin-right: 20px; background: url(../images/settlements/highwood/gallery/gallery_1p.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(1) .additional > div:nth-of-type(1) {background: url(../images/settlements/highwood/gallery/gallery_2p.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(1) .additional > div:nth-of-type(2) {background: url(../images/settlements/highwood/gallery/gallery_4p.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(1) .additional > div:nth-of-type(3) {background: url(../images/settlements/highwood/gallery/gallery_5p.jpg) center / cover no-repeat;}

.settlement:not(.region):nth-of-type(2) {margin-bottom: 40px;}
.settlement:not(.region):nth-of-type(2) .main {margin-right: 20px; background: url(../images/settlements/bayside/gallery/gallery_1.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(2) .additional > div:nth-of-type(1) {background: url(../images/settlements/bayside/about_p.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(2) .additional > div:nth-of-type(2) {background: url(../images/settlements/bayside/gallery/gallery_3p.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(2) .additional > div:nth-of-type(3) {background: url(../images/settlements/bayside/gallery/gallery_4p.jpg) center / cover no-repeat;}

.settlement:nth-of-type(1) .additional > div:nth-of-type(1):hover .video_play {opacity: 1;}
.settlement:nth-of-type(2) .additional > div:nth-of-type(1):hover .video_play {opacity: 1;}

.settlement:not(.region):nth-of-type(3) {margin-bottom: 40px;}
.settlement:not(.region):nth-of-type(3) .main {margin-right: 20px; background: url(../images/settlements/woodside/gallery/gallery_6.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(3) .additional > div:nth-of-type(1) {background: url(../images/settlements/woodside/gallery/gallery_9t.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(3) .additional > div:nth-of-type(2) {background: url(../images/settlements/woodside/gallery/gallery_3t.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(3) .additional > div:nth-of-type(3) {background: url(../images/settlements/woodside/gallery/gallery_4t.jpg) center / cover no-repeat;}

.settlement:not(.region):nth-of-type(4) {margin-bottom: 40px;}
.settlement:not(.region):nth-of-type(4) .main {cursor: default; margin-right: 20px; background: url(../images/settlements/lakeside/gallery/gallery_6p.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(4) .additional > div:nth-of-type(1) {cursor: default; background: url(../images/settlements/lakeside/gallery/gallery_8t.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(4) .additional > div:nth-of-type(2) {cursor: default; background: url(../images/settlements/lakeside/gallery/gallery_1t.jpg) center / cover no-repeat;}
.settlement:not(.region):nth-of-type(4) .additional > div:nth-of-type(3) {cursor: default; background: url(../images/settlements/lakeside/gallery/gallery_7t.jpg) center / cover no-repeat;}

.settlement:not(.region) .main {transition: .3s ease-in-out;}
.settlement:not(.region) .main:hover {-webkit-filter: brightness(77%);}
.settlement:not(.region) .additional > div {position: relative;}
.settlement:not(.region) .additional > div::after {transition: .3s ease-in-out; border-radius: 20px; content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0); z-index: 2;}
.settlement:not(.region) .additional > div:hover::after {background: rgba(0,0,0,.23)}

.settlement:not(.region) .main.loading {background: #EFF1F6;}
.settlement:not(.region) .main.loading .sticker {display: none;}
.settlement:not(.region) .additional > div.loading {background: #EFF1F6 !important;}
.settlement:not(.region) .additional > div.loading .more_picture {display: none;}
.settlement:not(.region) .additional > div.loading .video_play {display: none;}

.settlement > div:nth-of-type(1) {display: flex; width: calc(50% - 60px); height: 100%; margin-right: 60px;}
.settlement > div:nth-of-type(2) {width: 50%; display: flex; flex-direction: column;}
.settlement > div:nth-of-type(2) > div:nth-of-type(2) {
    margin-top: 16px; color: #1A222A; font-size: 14px; font-weight: 400; white-space: nowrap;
}
.settlement > div:nth-of-type(2) > div:nth-of-type(3) {display: flex; align-items: center; margin-top: 8px;}
.settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(3) i {font-size: 16px; color: #1A222A; margin-right: 8px;}
.settlement > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(1) {
    margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400;
}
.settlement > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(2) {
    margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400;
}
.settlement > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(3) {
    color: #555966; font-size: 14px; font-weight: 400;
}

.settlement > div:nth-of-type(2) > div:nth-of-type(4) {display: flex; margin-top: 40px;}
.settlement > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1) {margin-right: 60px;}
.settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(1) {color: #555966; font-size: 12px; font-weight: 400;}
.settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(1).loading {border-radius: 12px; background: #EFF1F6; color: transparent; width: fit-content;}
.settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(2) {margin-top: 9px; color: #1A222A; font-size: 14px; font-weight: 400;}
.settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(2).loading {border-radius: 12px; background: #EFF1F6; color: transparent !important; width: fit-content;}

.settlement > div:nth-of-type(2) > div:nth-of-type(5) {display: flex; margin-top: 0;}
.settlement > div:nth-of-type(2) > div:nth-of-type(5) > div {
    display: flex; margin-right: 14px; flex-direction: column; width: 70px; height: 70px; text-align: center; border-radius: 12px;
    background: #F5F5F5;
}
.settlement > div:nth-of-type(2) > div:nth-of-type(5) > div:last-child {margin-right: 0;}
.settlement > div:nth-of-type(2) > div:nth-of-type(5) > div > i {line-height: 50px; font-size: 30px;}
.settlement > div:nth-of-type(2) > div:nth-of-type(5) > div:last-child > i {font-size: 24px;}
.settlement > div:nth-of-type(2) > div:nth-of-type(5) > div > div {color: #1A222A; font-size: 12px; font-weight: 400;}

.settlement > div:nth-of-type(2) > div:nth-of-type(5) {position: relative;}
.settlement.region > div:nth-of-type(2) {cursor: pointer;}
.settlement_price {margin-left: auto; text-align: right;}
.settlement_price > div:nth-of-type(1) {color: #555966; font-size: 12px; font-weight: 400;}
.settlement_price > div:nth-of-type(2) {color: #5b6936 !important; font-size: 24px !important; font-weight: 700 !important;}
.settlement_price > div:nth-of-type(3) {color: #555966; font-size: 12px; font-weight: 400;}

.settlement .btn {position: absolute; bottom: 0; right: 0; width: 271px; height: 52px;}
.settlement .btn.loading {color: transparent; background: #FFF;}

/* region */

.region_map {margin-top: 50px;}

/* regions */

#regions {margin-top: 20px; overflow: hidden;}
#regions .wrap > h1 {margin-bottom: 26px; font-size: 56px; line-height: 1.2; font-weight: 700; padding-left: 24px;}

#regions .filters {padding-left: 24px;}
#regions .filters > div.highway {display: flex; flex-wrap: wrap; margin-bottom: 16px;}
#regions .filters > div.highway .btn {height: 32px; width: auto; font-size: 14px; margin-bottom: 12px; line-height: 60px; border-radius: 24px; border: 1px solid #D7D9E0; color: #1A222A; background: #FFF; padding: 7px 12px; margin-right: 12px;}
#regions .filters > div.highway .btn span.count {color: #9497A2; margin-left: 5px;}
#regions .filters > div.highway .btn:hover {background: #5b6936; color: #FFFFFF;}
#regions .filters > div.highway .btn.active {background: #5b6936; color: #FFFFFF;}
#regions .filters > div.sort {display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 30px;}
#regions .filters > div.sort .title {color: #555966; font-size: 16px; margin-right: 20px;}
#regions .filters > div.sort .price {color: #5b6936; font-size: 16px; font-weight: 700; margin-right: 8px;}
#regions .filters > div.sort .price_up {background: url(../images/regions/price.svg); transition: .5s; cursor: pointer; width: 24px; height: 24px; margin-right: 8px;}
#regions .filters > div.sort .price_down {background: url(../images/regions/price.svg); transition: .5s; transform: rotate(180deg); cursor: pointer; width: 24px; height: 24px; margin-right: 20px;}
#regions .filters > div.sort .price_up:hover {background: url(../images/regions/price_hover.svg);}
#regions .filters > div.sort .price_up.active {background: url(../images/regions/price_active.svg);}
#regions .filters > div.sort .price_down:hover {background: url(../images/regions/price_hover.svg);}
#regions .filters > div.sort .price_down.active {background: url(../images/regions/price_active.svg);}
#regions .filters > div.sort .price_sort {cursor: pointer; color: #5b6936; transition: .3s ease-in-out; font-size: 16px; font-weight: 400; border-bottom: 1px solid #1A222A; margin-right: 20px;}
#regions .filters > div.sort .price_sort.active {font-weight: 700; color: #5b6936; border-bottom: 1px solid #5b6936;}
#regions .filters > div.sort .price_sort:hover, #regions .filters > div.sort .mkad:active {color: #5b6936; border-bottom: 1px solid #5b6936;}
#regions .filters > div.sort .mkad {cursor: pointer; color: #5b6936; transition: .3s ease-in-out; font-size: 16px; font-weight: 400; border-bottom: 1px solid #1A222A; margin-right: 20px;}
#regions .filters > div.sort .mkad.active {font-weight: 700; color: #5b6936; border-bottom: 1px solid #5b6936;}
#regions .filters > div.sort .mkad:hover, #regions .filters > div.sort .mkad:active {color: #5b6936; border-bottom: 1px solid #5b6936;}
#regions .filters > div.sort .default {display: flex; align-items: center; cursor: pointer; color: #5b6936; margin-right: 20px; transition: .3s ease-in-out; font-size: 16px; font-weight: 400;}
#regions .filters > div.sort .default.reset {color: #5b6936 !important; font-weight: 400 !important;}
#regions .filters > div.sort .default > div {border-bottom: 1px solid #1A222A;}
#regions .filters > div.sort .default i {font-size: 14px; text-decoration: none; margin-left: 8px;}
#regions .filters > div.sort .default.active {font-weight: 700; color: #5b6936;}
#regions .filters > div.sort .default.active > div {border-bottom: 1px solid #5b6936;}
#regions .filters > div.sort .default:hover > div, #regions .filters > div.sort .default:active > div {color: #5b6936; border-bottom: 1px solid #5b6936;}
#regions .filters > div.sort .preloader {margin-left: auto; opacity: 0; display: flex; align-items: center; transition: .3s ease-in-out;}
#regions .filters > div.sort .preloader.active {opacity: 1;}
#regions .filters > div.sort .preloader .name {font-size: 16px; color: #555966; margin-left: 20px;}

.settlement.region {margin-bottom: 50px;}
.settlement.region > div:nth-of-type(1) {min-width: 457px; margin-right: 20px; display: flex; }
.settlement.region > div:nth-of-type(1) .main {width: 70%; height: 100%; position: relative; }
.main > div.photo_switch:nth-child(1) {cursor: pointer; position: absolute; right: 10px; color: #FFFFFF; font-size: 18px; top: calc(50% - 15px); z-index: 10;}
.main > div.photo_switch:nth-child(2) {cursor: pointer; position: absolute; left: 10px; color: #FFFFFF; font-size: 18px; top: calc(50% - 15px); z-index: 10;}
.settlement.region > div:nth-of-type(1) .main.loading::after {content: ''; background: #EFF1F6; width: 100%; height: 100%; border-radius: 20px; position: absolute; top: 0; left: 0; display: block;}
.settlement.region > div:nth-of-type(1) .additional {overflow: hidden; margin-left: 20px; display: flex; flex-direction: column; width: 131px; height: 100%;}
.settlement.region > div:nth-of-type(1) .additional > div {width: 100%; max-width: 133px; height: 100%; margin-bottom: 20px; position: relative; margin-right: 20px;}
.settlement.region > div:nth-of-type(1) .additional > div.loading {overflow: unset;}
.settlement.region > div:nth-of-type(1) .additional > div.loading::after {content: ''; background: #EFF1F6; width: 100%; height: 100%; border-radius: 20px; position: absolute; top: 0; left: 0; display: block;}
.settlement.region > div:nth-of-type(1) .additional > div:last-child {margin-right: 0; margin-bottom: 0;}
.settlement.region > div:nth-of-type(1) img {width: 100%; height: 100%; object-fit: cover; border-radius: 20px;}

.settlement.region > div:nth-of-type(2) > div:nth-of-type(1) {display: flex; flex-wrap: wrap; margin-top: 16px;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(1).loading {background: #EFF1F6; border-radius: 12px; width: fit-content;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(1).loading > a {color: transparent;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(1).loading > div {color: transparent;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(1) > a {margin-right: 12px; text-decoration-line: underline; font-size: 14px;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(1) > div {font-size: 14px; color: #1A222A;}

.settlement.region > div:nth-of-type(2) > div:nth-of-type(2) {display: flex; align-items: center; margin-top: 12px;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(2).loading {background: #EFF1F6; border-radius: 12px; width: fit-content;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(2).loading > i {color: transparent;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(2).loading > div {color: transparent;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(2).loading > div:last-child {color: transparent;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(2) i {font-size: 16px; color: #1A222A; margin-right: 8px;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(2) > div {margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child {color: #555966; font-size: 14px; margin-right: 0; font-weight: 400;}

.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) {display: flex; flex-wrap: wrap; margin-top: 45px;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div {display: flex; margin-right: 10px; margin-bottom: 10px; flex-direction: column; min-width: 69px; height: 76px; text-align: center; border-radius: 12px; background: #F5F5F5;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div:last-child {margin-right: 0;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div.loading {background: #EFF1F6;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div.loading > i {color: transparent;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div.loading > div.square {color: transparent;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div.loading > div {color: transparent;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div > i {line-height: 50px; font-size: 30px;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) i.icon_lake {font-size: 20px;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div:last-child > i {font-size: 24px;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div > div.square {line-height: 16px; min-width: 70px; color: #5b6936; white-space: nowrap; max-width: 40px; margin: 14px 0 1px; font-size: 18px; text-align: center; font-weight: 700;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div > div.square span {font-size: 12px;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div > div {color: #1A222A; font-size: 12px; font-weight: 400;}
.settlement.region > div:nth-of-type(2) > div:nth-of-type(3) {position: relative;}

.settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {margin-top: auto; flex-wrap: wrap;}
.settlement.region .settlement_price {margin-left: 0; margin-right: 0; text-align: left;}

.open_filters {width: 100%; -webkit-justify-content: center; margin-bottom: 33px; font-size: 18px; display: none;}
.open_filters i {margin-right: 10px; font-size: 13px;}

#regions .paginator {display: flex; -webkit-justify-content: center;}
#regions .paginator > div {
    cursor: pointer; margin-right: 12px; padding: 12px 16px; background: #FFFFFF; border-radius: 4px; border: 1px solid #EFF1F6;
    font-size: 16px; color: #1A222A; transition: .5s ease-in-out; white-space: nowrap; user-select: none;
}
#regions .paginator > div.active {color: #FFFFFF; background: #5b6936;}
#regions .paginator > div:first-child, #regions .paginator > div:last-child {width: 140px;}
#regions .paginator > div:last-child {text-align: right;}
#regions .paginator > div:hover {color: #FFFFFF; background: #5b6936;}
#regions .paginator > div:hover > i {color: #FFFFFF;}
#regions .paginator > div i {font-size: 14px; color: #555966; transition: .5s ease-in-out;}
#regions .paginator > div:first-child > i:last-child {position: relative; left: -8px;}
#regions .paginator > div:last-child > i:first-child {position: relative; left: 8px;}

@media only screen and (max-width: 1400px) {
    .settlement .btn {width: 261px;}
    .settlement.region .btn {width: 261px;}
}

@media only screen and (max-width: 1280px) {
    .settlement.region > div:nth-of-type(1) {min-width: 353px; height: auto; flex-direction: column;}
    .settlement.region > div:nth-of-type(1) .main {width: 100%;}
    .settlement.region > div:nth-of-type(1) .additional {width: 100%; height: 30%; min-height: 100px; flex-direction: row; margin-left: 0;}
    .settlement.region > div:nth-of-type(1) .additional > div {min-width: calc(33.3% - 6px); max-width: 140px; min-height: 90px; height: 90px; max-height: 90px; margin-bottom: 0; margin-right: 8px;}
    .settlement.region .main {height: 100%; width: 100%;}
    .settlement.region .additional > div {margin-top: 8px !important; margin-right: 8px; max-width: 111px; max-height: 79px;}
    .settlement.region .additional > div:last-child {margin-right: 0;}
    .settlement.region .additional {flex-direction: row; width: 100%; height: auto;}
    .settlement.region {background: white; height: auto;}
    .settlement.region .btn {position: relative;}
}

@media only screen and (max-width: 1000px) {
    .settlement:not(.region) > div:nth-of-type(1) {width: 353px; flex-direction: column; margin-right: 20px;}
    .settlement:not(.region) .main {width: 353px; height: 282px;}
    .settlement:not(.region) .additional > div {margin-top: 8px !important; margin-right: 8px; max-width: 111px; max-height: 79px;}
    .settlement:not(.region) .additional > div:last-child {margin-right: 0;}
    .settlement:not(.region) .additional {flex-direction: row; width: 100%; height: auto;}
    .settlement:not(.region) > div:nth-of-type(2) {width: 100%;}
    .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1) {margin-right: 30px;}
    .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(3) {flex-wrap: wrap;}
    .settlement.region h2 {font-size: 20px;}
    #regions .filters {padding-left: 0;}
    .settlement:not(.region), .settlement.region {flex-direction: column; height: auto; background: #FFFFFF; padding: 8px 8px 24px 8px; margin-bottom: 36px;}
    .settlement:not(.region) > div:nth-of-type(1), .settlement.region > div:nth-of-type(1) {height: auto; width: 100%; margin-right: 0; margin-bottom: 16px;}
    .settlement:not(.region) > div:nth-of-type(2), .settlement.region > div:nth-of-type(2) {width: 100%; padding: 0 8px;}
    .settlement:not(.region) .main, .settlement.region .main {width: 100%; min-height: 282px;}
    .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(2), .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) {margin-top: 12px; white-space: normal;}
    .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(3), .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) {margin-top: 12px;}
    .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(3), .settlement.region > div:nth-of-type(3) > div:nth-of-type(3) {margin-top: 8px; flex-basis: 100%;}
    .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(4), .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {display: flex; margin-top: 24px; flex-wrap: wrap;}
    .more_picture {width: 42px; height: 34px; position: absolute; bottom: -2px; right: 0; line-height: 34px;}
    .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(5), .settlement.region > div:nth-of-type(2) > div:nth-of-type(5) {margin-top: 24px;}
    .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1), .settlement.region > div:nth-of-type(2) > div:nth-of-type(4)  > div:nth-of-type(1) {margin-right: 68px; order: 0;}
    .settlement_price {width: 100%; margin-left: 0; margin-bottom: 24px; text-align: left; order: -1;}
    .settlement_price > div:last-child {margin-top: 1px !important;}
    .settlement:not(.region) .btn, .settlement.region .btn {max-width: 337px; margin-bottom: 16px; position: static; width: 100%; bottom: unset; left: unset; right: unset; margin-top: 24px;}
    .settlement.region .btn {margin: 0; width: 100%;}
    .settlement.region .additional {display: none;}
    .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {flex-direction: column;}
    #regions .wrap > h1 {margin-bottom: 32px; font-size: 24px; padding-left: 0;}
}

@media only screen and (max-width: 800px) {
    #settlements {margin-top: 32px;}
    .region_map {margin-top: 32px;}
    #regions .filters > div.sort .preloader {display: none;}
    #regions .filters > div.sort .mkad {margin-top: 10px;}
    #regions .filters > div.sort .default {margin-top: 10px;}
    .settlement.region > div:nth-of-type(1) .main {height: 325px;}
    .settlement:not(.region):nth-of-type(1) {margin-bottom: 24px;}
    .settlement:not(.region):nth-of-type(2) {margin-bottom: 24px;}
    .settlement:not(.region):nth-of-type(3) {margin-bottom: 24px;}
    .settlement:not(.region):nth-of-type(4) {margin-bottom: 24px;}
    .settlement.region > div:nth-of-type(1) {min-width: 100%;}
    .settlement.region .main {margin-right: 0; width: 100%;}
    .settlement.region > div:nth-of-type(2) > div:nth-of-type(1) {margin-top: 10px;}
    .settlement.region > div:nth-of-type(2) > div:nth-of-type(1) > a {margin-bottom: 10px;}
    .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) {margin-top: 10px; flex-wrap: wrap;}
    .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) {margin-top: 5px;}
    .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child {margin-top: 5px;}
    .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) {margin-top: 25px; max-width: 400px;}
    .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {margin-top: 15px;}
    .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div {margin-bottom: 10px;}
    .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(4) {margin-right: 0;}
    .settlement.region .settlement_price {display: flex; align-items: baseline; margin-right: 0 !important; max-width: 420px;}
    .settlement.region .settlement_price > div:first-child {margin-right: auto;}
    #regions .filters > div.highway {margin-bottom: 20px;}
    #regions .paginator > div {display: none;}
    #regions .paginator > div:first-child, #regions .paginator > div:last-child {display: block;}
    #regions .filters > div.highway .btn.filter {display: none;}
    #regions .filters > div.highway .btn.filter.open {display: block;}
    .open_filters {display: flex;}
    .settlement.region .btn {max-width: 420px;}
}

/* ------------------------ REGIONS INFO -------------------------- */

#info {margin-top: 112px;}
#info .info {border-radius: 20px; background: #FFF; padding: 30px 24px;}
#info .info h2 {padding-left: 0; font-size: 24px; color: #1A222A; margin-bottom: 12px;}
#info .info h3 {font-weight: 700;}
#info .info p {margin-bottom: 1rem;}
#info .info div {font-size: 16px; color: #000000; max-height: 140px; overflow: hidden; position: relative; margin-bottom: 16px;}
#info .info div::after {position: absolute; top: 0; left: 0; content: ""; background: linear-gradient(0deg, #FDFDFD 25.52%, rgba(255, 255, 255, 0.00) 92.07%); width: 100%; height: 100%;}
#info .info.active div {max-height: 100%;}
#info .info.active div::after {background: none;}
#info .info a {font-size: 16px; text-decoration-line: underline; color: #5b6936; cursor: pointer; transition: .3s ease-in-out;}
#info .info a:hover {color: #4a5630;}

@media only screen and (max-width: 600px) {
    #info {margin-top: 32px;}
}

/* ----------------------- SIMILAR REGIONS ------------------------ */

#similar_regions {margin-top: 40px;}

#similar_regions h2 {margin-bottom: 30px; padding-top: 0;}
.similar_regions {display: flex; flex-wrap: wrap;}
.similar_regions > div {display: flex; flex-direction: column; width: calc(33.3% - 15px); padding: 22px; background: #FFFFFF; border-radius: 20px; margin-bottom: 22px; margin-right: 22px;}
.similar_regions > div:nth-child(3n) {margin-right: 0;}
.similar_regions > div img {width: 100%; border-radius: 20px; margin-bottom: 24px;}
.similar_regions > div > div:nth-of-type(1) {color: #1A222A; font-size: 18px; font-weight: 700; margin-bottom: auto;}
.similar_regions > div > div:nth-of-type(2) {font-size: 14px; color: #1A222A; margin-top: 27px;}
.similar_regions > div > div:nth-of-type(3) {display: flex; flex-wrap: wrap; align-items: center; margin-top: 12px; margin-bottom: 32px;}
.similar_regions > div > div:nth-of-type(3) i {font-size: 16px; color: #1A222A; margin-right: 8px;}
.similar_regions > div > div:nth-of-type(3) > div:nth-of-type(1) {margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400;}
.similar_regions > div > div:nth-of-type(3) > div:nth-of-type(2) {margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400;}
.similar_regions > div > div:nth-of-type(3) > div:nth-of-type(3) {color: #555966; font-size: 14px; font-weight: 400;}
.similar_regions > div > div:nth-of-type(4) {display: flex; align-items: center; margin-bottom: 32px;}
.similar_regions > div > div:nth-of-type(4) > i {font-size: 16px; color: #1A222A; margin-right: 8px;}
.similar_regions > div > div:nth-of-type(4) > div:nth-of-type(1) {font-size: 14px;}
.similar_regions > div > div:nth-of-type(4) > div:nth-of-type(2) {margin-left: auto; font-size: 14px; font-weight: 700;}
.similar_regions > div > div:nth-of-type(5) {display: flex; align-items: center; margin-bottom: 32px;}
.similar_regions > div > div:nth-of-type(5) > div:first-child {font-size: 14px; color: #555966; margin-right: auto;}
.similar_regions > div > div:nth-of-type(5) > div:last-child {font-size: 24px; font-weight: 700; color: #5b6936;}
.similar_regions > div .btn {height: 52px; line-height: 52px; width: 100%; }

@media only screen and (max-width: 1000px) {
    .similar_regions > div {width: calc(50% - 6px); margin-right: 12px;}
    .similar_regions > div:nth-child(3n) {margin-right: 12px;}
    .similar_regions > div:nth-child(2n) {margin-right: 0;}
}

@media only screen and (max-width: 600px) {
    #similar_regions h2 {margin-bottom: 12px;}
    .similar_regions > div {width: 100%; margin-right: 0; margin-bottom: 12px;}
    .similar_regions > div:nth-child(3n) {margin-right: 0;}
    .similar_regions > div:nth-child(2n) {margin-right: 0;}
}

/* ----------------------- REGION INFO ------------------------ */

#region_info {margin-top: 20px;}

.region_info {display: flex; padding: 30px; background: #FFFFFF; border-radius: 20px; margin-top: 20px;}

.region_info > div:first-child {min-width: 457px; margin-right: 50px; display: flex; flex-direction: column;}
.region_info > div:first-child .main {width: 457px; height: 322px; position: relative;}
.region_info > div:first-child .additional {display: flex; width: 457px; height: auto; overflow: hidden; margin-top: 20px;}
.region_info > div:first-child .additional > div {min-width: calc(33.3% - 14px); height: 95px; position: relative; margin-right: 20px;}
.region_info > div:first-child .additional > div:last-child {margin-right: 0;}

.region_info > div:first-child img {width: 100%; height: 100%; object-fit: cover; border-radius: 20px;}

.region_info > div:last-child {width: 100%; display: flex; flex-direction: column;}
.region_info h1 {
    font-size: 24px; padding-left: 0; padding-top: 0; margin-bottom: 32px; margin-right: 20px; font-weight: 700; line-height: 130%;
}
.region_info > div:last-child > div:nth-of-type(1) {display: flex;}
.region_info > div:last-child > div:nth-of-type(1) > a {margin-left: auto; cursor: pointer; color: #5b6936; font-size: 24px; font-weight: 700; text-decoration-line: underline;}

.region_info > div:last-child > div:nth-of-type(2) {display: flex; flex-wrap: wrap;}
.region_info > div:last-child > div:nth-of-type(2) > a {text-decoration-line: underline; color: #5b6936; font-size: 14px; margin-right: 8px;}
.region_info > div:last-child > div:nth-of-type(2) > div {font-size: 14px; color: #1A222A;}

.region_info > div:last-child > div:nth-of-type(3) {display: flex; flex-wrap: wrap; align-items: center; margin-top: 12px; margin-bottom: 32px;}
.region_info > div:last-child > div:nth-of-type(3) i {font-size: 16px; color: #1A222A; margin-right: 8px;}
.region_info > div:last-child > div:nth-of-type(3) > div {margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400;}
.region_info > div:last-child > div:nth-of-type(3) > div:last-child {color: #555966; font-size: 14px; font-weight: 400;}

.region_info > div:last-child > a > i {margin-right: 10px; color: #5b6936; transition: .3s ease-in-out;}
.region_info > div:last-child > a {display: flex; transition: .3s ease-in-out; align-items: center; padding: 8px 16px; width: fit-content; border-radius: 12px; color: #5b6936; border: 1px solid #5b6936;}
.region_info > div:last-child > a:hover {background: #5b6936; color: #FFFFFF;}
.region_info > div:last-child > a:hover i {color: #FFFFFF;}

.region_info > div:last-child > div:nth-of-type(4) {display: flex; flex-wrap: wrap; margin-top: 45px;}
.region_info > div:last-child > div:nth-of-type(4) > div {display: flex; margin-right: 14px; margin-bottom: 10px; flex-direction: column; min-width: 69px; height: 76px; text-align: center; border-radius: 12px;background: #F5F5F5;}
.region_info > div:last-child > div:nth-of-type(4) > div:last-child {margin-right: 0;}
.region_info > div:last-child > div:nth-of-type(4) > div > i {line-height: 50px; font-size: 30px;}
.region_info > div:last-child > div:nth-of-type(4) i.icon_lake {font-size: 20px;}
.region_info > div:last-child > div:nth-of-type(4) > div:last-child > i {font-size: 24px;}
.region_info > div:last-child > div:nth-of-type(4) > div > div.square {line-height: 16px; min-width: 70px; color: #5b6936; white-space: nowrap; max-width: 40px; margin: 14px 0 1px; font-size: 18px; text-align: center; font-weight: 700;}
.region_info > div:last-child > div:nth-of-type(4) > div > div.square span {font-size: 12px;}
.region_info > div:last-child > div:nth-of-type(4) > div > div {color: #1A222A; font-size: 12px; font-weight: 400;}
.region_info > div:last-child > div:nth-of-type(4) {position: relative;}

.region_info > div:last-child > div:nth-of-type(5) {display: flex; flex-wrap: wrap; align-items: flex-end; margin-top: 30px;}
.region_info > div:last-child > div:nth-of-type(5) .settlement_price {margin-right: auto; margin-bottom: 20px; text-align: left; flex-wrap: nowrap; margin-left: 0;}
.region_info > div:last-child > div:nth-of-type(5) .btn {height: 52px; line-height: 52px; width: 226px;}
.region_info > div:last-child > div:nth-of-type(5) > div:last-child {display: flex;}
.region_info > div:last-child > div:nth-of-type(5) > div:last-child > a:nth-of-type(1) {margin-right: 20px;}
.region_info > div:last-child > div:nth-of-type(5) > div:last-child > a:nth-of-type(2) .btn {background: #FFFFFF; border: 1px solid #5b6936; color: #5b6936;}

@media only screen and (max-width: 1120px) {
    .region_info {flex-direction: column;}
    .region_info > div:first-child .additional > div {width: 140px;}
    .region_info > div:first-child {margin-bottom: 20px; margin-right: 0;}
}

@media only screen and (max-width: 800px) {
    #region_info {margin-top: 16px;}
    .region_info > div:last-child > div:nth-of-type(4) > div {min-width: calc(25% - 8px); width: calc(20% - 6px); margin-right: 8px;}
    .region_info > div:first-child {min-width: 0;}
    .region_info > div:first-child .additional {display: none;}
    .region_info {padding: 0; margin-top: 16px;}
    .region_info > div:first-child .main {width: 100%;}
    .region_info > div:last-child {padding: 0 20px 32px;}
    .region_info > div:last-child > div:nth-of-type(1) > a {display: none;}
    .region_info h1 {margin-bottom: 10px; font-size: 20px;}
    .region_info > div:last-child > div:nth-of-type(2) > a {margin-bottom: 10px;}
    .region_info > div:last-child > div:nth-of-type(3) {margin-top: 10px; margin-bottom: 25px;}
    .region_info > div:last-child > div:nth-of-type(4) {margin-top: 25px;}
    .region_info > div:last-child > div:nth-of-type(5) {margin-top: 25px;}
    .settlement_price > div:nth-child(3) {display: none;}
    .region_info > div:last-child > div:nth-of-type(5) .settlement_price {display: flex; align-items: center; margin-bottom: 25px; max-width: 471px;}
    .settlement_price > div:nth-of-type(1) {margin-right: auto;}
    .region_info > div:last-child > div:nth-of-type(5) > div:last-child {flex-direction: column-reverse; margin-bottom: 0; width: 100%;}
    .region_info > div:last-child > div:nth-of-type(5) > div:last-child > a:nth-of-type(1) {margin-right: 0; margin-top: 10px;}
    .region_info > div:last-child > div:nth-of-type(5) .btn {width: 100%;}

}

/* ------------------- MORTGAGE CALCULATOR -------------------- */

#similar_regions {margin-top: 40px; padding-bottom: 40px;}
.mortgage_calculator {
    margin-top: 32px; border-radius: 24px; background: #FFF; padding: 32px;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.3s ease;
}

.mortgage_calculator:hover {
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}

.calc_container {display: flex; gap: 32px; align-items: flex-start;}

.calc_inputs {flex: 0 0 320px; display: flex; flex-direction: column; gap: 24px;}

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

.calc_field label {
    font-size: 14px; font-weight: 600; color: #1A222A; line-height: 130%;
    margin-bottom: 0;
}

.calc_input_wrapper {
    position: relative; display: flex; align-items: center;
}

.calc_input_wrapper input[type="text"] {
    width: 100%; padding: 12px 40px 12px 16px; border: 2px solid #EFF1F6;
    border-radius: 12px; font-size: 16px; font-weight: 500; color: #1A222A;
    background: #FFF; transition: all 0.2s;
}

.calc_input_wrapper input[type="text"]:focus {
    border-color: #5b6936; outline: none; box-shadow: 0 0 0 3px rgba(91, 105, 54, 0.1);
}

.calc_input_wrapper input[type="text"]:hover:not(:focus) {
    border-color: #D1D5DB;
}

.calc_currency {
    position: absolute; right: 16px; font-size: 16px; font-weight: 500;
    color: #555966; pointer-events: none;
}

.calc_percent {
    font-size: 13px; font-weight: 600; color: #5b6936; margin-top: 4px;
    display: inline-flex; align-items: center; padding: 3px 10px;
    background: rgba(91, 105, 54, 0.1); border-radius: 6px;
    width: fit-content;
}

.calc_percent span {
    font-weight: 700;
}

.calc_range {
    margin-top: 8px; position: relative;
}

.calc_range input[type="range"] {
    width: 100%; height: 8px; -webkit-appearance: none; appearance: none;
    background: linear-gradient(to right, #5b6936 0%, #5b6936 var(--range-progress, 0%), #EFF1F6 var(--range-progress, 0%), #EFF1F6 100%);
    border-radius: 10px; outline: none; cursor: pointer;
    transition: background 0.2s;
}

.calc_range input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none; width: 24px; height: 24px;
    background: #5b6936; border-radius: 50%; cursor: pointer;
    transition: all 0.2s; box-shadow: 0 2px 8px rgba(91, 105, 54, 0.3);
    border: 3px solid #FFF;
}

.calc_range input[type="range"]::-webkit-slider-thumb:hover {
    background: #4a5630; transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(91, 105, 54, 0.4);
}

.calc_range input[type="range"]::-moz-range-thumb {
    width: 24px; height: 24px; background: #5b6936; border-radius: 50%;
    cursor: pointer; border: 3px solid #FFF; transition: all 0.2s;
    box-shadow: 0 2px 8px rgba(91, 105, 54, 0.3);
}

.calc_range input[type="range"]::-moz-range-thumb:hover {
    background: #4a5630; transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(91, 105, 54, 0.4);
}

.calc_range input[type="range"]::-moz-range-track {
    height: 8px; border-radius: 10px; background: #EFF1F6;
}

.calc_actions {
    margin-top: 8px;
}

.calc_btn {
    width: 100%;
}

/* Предложения по ипотеке */
.calc_offers {
    flex: 1; display: flex; flex-direction: column; gap: 16px;
}

.mortgage_offer {
    border-radius: 16px; padding: 24px; display: flex; flex-direction: column;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transition: box-shadow 0.3s ease;
}

.mortgage_offer:hover {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.mortgage_offer_sber {
    background: linear-gradient(135deg, #5b6936 0%, #4a5630 100%);
    color: #FFF;
}

.mortgage_offer_rural {
    background: linear-gradient(135deg, #FF6B35 0%, #E85A2B 100%);
    color: #FFF;
}

.mortgage_offer_header {
    display: flex; align-items: center; gap: 16px; margin-bottom: 20px;
}

.mortgage_offer_logo {
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}

.mortgage_offer_logo img {
    width: 64px; height: 64px; object-fit: contain; display: block;
}

.mortgage_offer_logo_text {
    font-size: 18px; font-weight: 700; color: #FFF;
}

.mortgage_offer_logo_rural {
    background: rgba(255, 255, 255, 0.25);
}

.mortgage_offer_logo_rural i {
    font-size: 24px; color: #FFF;
}

.mortgage_offer_title {
    font-size: 18px; font-weight: 700; color: #FFF;
}

.mortgage_offer_content {
    display: flex; flex-direction: column; gap: 16px; margin-bottom: 20px;
}

.mortgage_offer_item {
    display: flex; flex-direction: column; gap: 4px;
}

.mortgage_offer_label {
    font-size: 13px; font-weight: 400; color: rgba(255, 255, 255, 0.8);
}

.mortgage_offer_value {
    font-size: 16px; font-weight: 600; color: #FFF;
}

.mortgage_offer_value_main {
    font-size: 20px; font-weight: 700;
}

.mortgage_offer_value_wrapper {
    display: flex; flex-direction: column; gap: 4px;
}

.mortgage_offer_diff {
    font-size: 12px; font-weight: 400; color: rgba(255, 255, 255, 0.9);
}

.mortgage_offer_diff_down {
    color: rgba(255, 255, 255, 0.9);
}

.mortgage_offer_savings {
    display: flex; justify-content: space-between; align-items: center;
    padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 14px; font-weight: 500; color: rgba(255, 255, 255, 0.9);
}

.mortgage_offer_savings_value {
    font-size: 18px; font-weight: 700; color: #FFF;
}

.mortgage_offer_savings_rural {
    border-top: 1px solid rgba(255, 255, 255, 0.25);
}

@media only screen and (max-width: 1000px) {
    .calc_container {flex-direction: column; gap: 24px;}
    .calc_inputs {flex: 1; max-width: 100%;}
    .calc_offers {flex: 1;}
    .mortgage_calculator {padding: 24px;}
}

@media only screen and (max-width: 800px) {
    #similar_regions {margin-top: 32px; padding-bottom: 32px;}
    .mortgage_calculator {padding: 20px; border-radius: 16px;}
    .calc_container {align-items: stretch;}
    .calc_inputs {gap: 20px; flex: 1;}
    .calc_offers {flex: 1;}
    .calc_field {gap: 8px;}
    .calc_field label {font-size: 13px;}
    .calc_input_wrapper input[type="text"] {padding: 10px 36px 10px 14px; font-size: 15px;}
    .calc_currency {right: 14px; font-size: 15px;}
    .calc_range {margin-top: 8px;}
    .calc_range input[type="range"] {height: 8px;}
    .calc_range input[type="range"]::-webkit-slider-thumb {
        width: 22px; height: 22px; border: 3px solid #FFF;
    }
    .calc_range input[type="range"]::-moz-range-thumb {
        width: 22px; height: 22px; border: 3px solid #FFF;
    }
    .calc_range input[type="range"]::-moz-range-track {
        height: 8px;
    }
    .mortgage_offer {padding: 20px;}
    .mortgage_offer_header {gap: 12px; margin-bottom: 16px; align-items: center;}
    .mortgage_offer_logo img {width: 52px; height: 52px;}
    .mortgage_offer_title {font-size: 16px;}
    .mortgage_offer_content {gap: 12px; margin-bottom: 16px;}
    .mortgage_offer_value_main {font-size: 18px;}
    .mortgage_offer_value {font-size: 15px;}
    .mortgage_offer_savings {align-items: center;}
}

@media only screen and (max-width: 600px) {
    .mortgage_calculator {padding: 16px;}
    .calc_container {gap: 20px; align-items: stretch;}
    .calc_inputs {gap: 16px; width: 100%;}
    .calc_offers {gap: 12px; width: 100%;}
    .mortgage_offer {padding: 16px; width: 100%;}
    .mortgage_offer_header {flex-wrap: wrap; justify-content: flex-start;}
    .mortgage_offer_title {flex: 1; min-width: 0;}
    .mortgage_offer_savings {flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px;}
    .mortgage_offer_savings_value {font-size: 16px; flex-shrink: 0;}
}

/* ---------------------- MORTGAGE STEPS ---------------------- */

#mortgage_steps {margin-top: 40px;}

.mortgage_steps {width: 100%; padding: 60px; border-radius: 24px; background: #FFF;}

.mortgage_steps .block_name, .mortgage_steps h2 {padding: 0; text-align: center; width: 100%;}

.mortgage_steps > div:last-child {display: flex; align-items: baseline; margin-top: 52px;}
.mortgage_steps > div:last-child > div > div:nth-of-type(1) {
    min-width: 86px; min-height: 86px; line-height: 86px; text-align: center; background: #E5F5EC; border-radius: 50%;
    color: #5b6936; font-size: 24px; font-weight: 700;
}

.mortgage_steps > div:last-child > div:first-child {margin-top: 0;}
.mortgage_steps > div:last-child > div {width: 25%; display: flex; align-items: center; flex-direction: column; text-align: center;}
.mortgage_steps > div:last-child > div:last-child > div:nth-of-type(1) {background: #5b6936; color: #FFFFFF;}
.mortgage_steps > div:last-child > div:last-child > div:nth-of-type(1) i {font-size: 30px;}

.mortgage_steps > div:last-child > div > div:nth-of-type(2) > div:first-child {margin-top: 40px; color: #1A222A; font-size: 18px; font-weight: 700;}
.mortgage_steps > div:last-child > div > div:nth-of-type(2) > div:last-child {margin-top: 12px; color: #555966; font-size: 14px; font-weight: 400;}

.step_arrow {width: auto !important; font-size: 24px;}

@media only screen and (max-width: 1000px) {
    .mortgage_steps > div:last-child > div > div:nth-of-type(2) > div:first-child {font-size: 15px;}
    .mortgage_steps {padding: 60px 20px 20px 20px;}
}

@media only screen and (max-width: 800px) {
    .mortgage_steps > div:last-child {flex-direction: column;}
    .mortgage_steps > div:last-child > div {margin-top: 24px; height: 73px; flex-direction: row; text-align: left; width: 100%; align-items: flex-start;}
    .mortgage_steps > div:last-child > div:nth-child(2n) {display: none;}
    .mortgage_steps > div:last-child > div > div:nth-of-type(2) > div:first-child {margin-top: 0;}
    .mortgage_steps > div:last-child > div > div:nth-of-type(1) {margin-right: 12px; min-width: 40px; min-height: 40px; line-height: 40px; font-size: 20px;}
    .mortgage_steps > div:last-child > div:last-child > div:nth-of-type(1) i {font-size: 20px;}
    .mortgage_steps > div:last-child > div > div:nth-of-type(2) > div:first-child {font-size: 14px;}
    .mortgage_steps > div:last-child > div > div:nth-of-type(2) > div:last-child {margin-top: 6px;}
    .mortgage_steps .block_name, .mortgage_steps h2 {text-align: left;}
    .mortgage_steps > div:last-child {margin-top: 32px;}
    .mortgage_steps {padding: 20px; height: auto;}
}

@media only screen and (max-width: 600px) {
    #mortgage_steps {margin-top: 32px;}
}

/* ---------------------- MORTGAGE HOUSE ---------------------- */

#mortgage_house {margin-top: 24px; overflow: hidden;}

.mortgage_house {display: flex;}
#mortgage_house .slides_paginator {display: none;}
#mortgage_house .slider_section {width: 50%;}

.mortgage_info {width: calc(50% - 10px); margin-right: 20px; height: 473px; position: relative; border-radius: 20px 20px 20px 0; overflow: hidden;}
.mortgage_info img {width: 1100px; height: 473px; object-fit: cover; object-position: left bottom;}
.mortgage_info .btn {position: absolute; bottom: 0; left: 0; height: 52px;}

.mortgage_info > div:last-child {position: absolute; width: 100%; padding-right: 60px; left: 32px; top: 32px;}
.mortgage_info > div:last-child > h1 {color: #FFF; font-size: 40px; font-weight: 700; line-height: 130%;}

.mortgage_info > div:last-child > div:nth-of-type(1) {width: 60%; margin-top: 20px; color: #FFF; display: flex; align-items: center;}
.mortgage_info > div:last-child > div:nth-of-type(1) > div:first-child {font-size: 48px; font-weight: 700; margin-right: 16px;}
.mortgage_info > div:last-child > div:nth-of-type(1) > div:last-child {font-size: 16px; font-weight: 400;}

.mortgage_info > div:last-child > div:nth-of-type(2) {margin-top: 20px; color: #FFF; display: flex; flex-direction: column;}
.mortgage_info > div:last-child > div:nth-of-type(2) i {font-size: 16px; font-weight: 700; padding-right: 11px;}
.mortgage_info > div:last-child > div:nth-of-type(2) > div {font-size: 16px; font-weight: 400; margin-bottom: 12px;}

.mortgage_info > i {display: flex; opacity: 0.2; color: #FFF; align-items: center; font-size: 230px; height: 230px; position: absolute; bottom: 32px; right: 32px;}

.mortgage_additional {display: flex; flex-wrap: wrap; height: 100%; transition: all .5s ease-in-out;}

.mortgage_additional > div {
    min-height: 224px; position: relative; padding: 40px 25px 20px 25px; width: calc(50% - 10px); height:calc(50% - 10px);
    background: #FFFFFF; border-radius: 20px; overflow: hidden;
}
.mortgage_additional > div > div:nth-of-type(1) {display: flex; align-items: baseline; color: #5b6936;}
.mortgage_additional > div > div:nth-of-type(1) > div:first-child {font-size: 18px; font-weight: 700; margin-right: 12px;}
.mortgage_additional > div > div:nth-of-type(1) > div:last-child {font-size: 60px; font-weight: 700;}
.mortgage_additional > div > div:nth-of-type(2) {margin-top: 18px; color: #5b6936; font-size: 17px; font-weight: 700;}
.mortgage_additional > div > div:nth-of-type(3) {color: #555966; font-size: 14px; font-weight: 400;}


.mortgage_additional > div:nth-of-type(1) {margin-right: 20px; margin-bottom: 20px; height: auto;}
.mortgage_additional > div:nth-of-type(2) {margin-bottom: 20px;}
.mortgage_additional > div:nth-of-type(3) {margin-right: 20px; }

.mortgage_additional > div img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}

@media only screen and (max-width: 1400px) {
    .mortgage_info > i {bottom: 84px;}
}

@media only screen and (max-width: 1000px) {
    .mortgage_house {flex-direction: column;}
    .mortgage_additional {width: 100%;}
    #mortgage_house .slider_section {width: 100%;}
    .mortgage_additional > div {height: 228px; padding: 40px 33px 20px 33px;}
    .mortgage_info {width: 100%; margin-right: 0; margin-bottom: 32px;}
}

@media only screen and (max-width: 800px) {
    .mortgage_info .btn {position: absolute; bottom: 0; left: 0; height: 52px; width: 288px; font-size: 18px;}
}

@media only screen and (max-width: 600px) {
    .mortgage_info > div:last-child > h1 {font-size: 24px;}
    .mortgage_info > div:last-child > div:nth-of-type(1) {width: 100%;}
    .mortgage_info > div:last-child > div:nth-of-type(1) > div:first-child {font-size: 32px;}
    .mortgage_info > div:last-child > div:nth-of-type(1) > div:last-child {font-size: 14px;}
    .mortgage_info > div:last-child > div:nth-of-type(2) > div {font-size: 14px;}
    .mortgage_info > div:last-child > div:nth-of-type(2) i {font-size: 12px;}
    .mortgage_info img {width: 860px;}
    .mortgage_info .btn {width: 235px; height: 50px; font-size: 16px;}
    .mortgage_additional > div:first-child {display: none;}
    .mortgage_additional > div {min-height: 142px; padding: 15px 19px; min-width: 223px; height: 142px; margin: 0 12px 0 0 !important;}
    .mortgage_additional {flex-wrap: nowrap;}
    #mortgage_house .slides_paginator {display: table; width: 100%;}
    .mortgage_info > div:last-child > div:nth-of-type(2) {width: 100%;}
    .mortgage_info > i {font-size: 154px; left: 24px; right: auto; bottom: 43px;}
    .mortgage_additional > div > div:nth-of-type(1) > div:first-child {font-size: 14px;}
    .mortgage_additional > div > div:nth-of-type(1) > div:last-child {font-size: 48px;}
    .mortgage_additional > div > div:nth-of-type(2) {margin-top: 6px; font-size: 14px;}
}

/* ----------------- COTTAGE SETTLEMENTS MAIN ----------------- */

#cottage_settlements_main {margin-top: 24px;}
.cottage_settlements_main {display: flex;}

.settlements_info {width: 50%; height: 473px; position: relative; border-radius: 20px 20px 20px 0; overflow: hidden;}
.settlements_info img {width: 1120px; height: 473px; object-fit: cover; object-position: left bottom;}
.settlements_info .btn {position: absolute; bottom: 0; left: 0; height: 52px;}

.settlements_info > div:last-child {position: absolute; width: 100%; left: 32px; top: 32px;}
.settlements_info > div:last-child > h1 {color: #FFF; font-size: 32px; font-weight: 700; line-height: 130%; max-width: 450px;}
.settlements_info > div:last-child > div {margin-top: 16px; width: 40%; min-width: 270px; color: #FFF; font-size: 16px; font-weight: 400;}

.settlements_info i {
    display: flex; opacity: 0.2; color: #FFFFFF; align-items: center; font-size: 230px; height: 230px; position: absolute;
    bottom: 32px; right: 32px;
}

.settlements_info_2 {
    display: flex; flex-wrap: wrap; width: 50%; min-width: 400px;

}

.settlement_info {
    display: block; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 69.72%, #000 99.88%); width: calc(50% - 20px); height: calc(50% - 10px); min-width: 200px;
    position: relative; border-radius: 20px; overflow: hidden; margin-left: 20px;
}
.settlement_info:nth-child(-n+2) {margin-bottom: 20px;}
.settlement_info::after {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0); transition: .3s ease-in-out;}
.settlement_info:hover::after {background: rgba(0, 0, 0, .23);}
.settlement_info img {position: absolute; z-index: -1; width: 100%; height: 100%; object-fit: cover; object-position: 0;}
.settlement_info > div {
    position: absolute; left: 16px; bottom: 21px; color: #FFF; font-size: 24px; font-weight: 700; max-width: 200px;
}

@media only screen and (max-width: 1300px) {
    .settlements_info i {bottom: 111px;}
    .settlements_info > div:last-child {width: 80%;}
}

@media only screen and (max-width: 1000px) {
    .settlements_info_2 {display: none;}
    .settlements_info {width: 100%;}
    .settlements_info img {width: 910px;}
    .settlements_info .btn {width: 247px;}
}

@media only screen and (max-width: 800px) {
    .settlements_info > div:last-child > h1 {font-size: 24px;}
    .settlements_info > div:last-child > div {left: 24px; width: 100%;}
    .settlements_info i {font-size: 154px; height: 154px; left: 24px; right: auto;}
}

/* -------------------------- FOOTER -------------------------- */

#footer {margin-top: auto; padding-top: 90px;}
#footer_mobile {display: none; margin-top: auto; padding-top: 32px;}

.footer_main {width: 100%; padding: 20px 32px; border-radius: 20px; background: #FFF; display: table; vertical-align: middle;}

.footer_main > div {display: table-cell; vertical-align: middle; margin-right: 72px; text-align: right;}
.footer_main > div:first-child {text-align: left;}

.footer_main_mobile {padding: 22px; border-radius: 24px; background: #FFF; display: flex; flex-direction: column;}
.footer_main_mobile > div:first-child {display: flex; margin-bottom: 10px;}
.footer_main_mobile > div:first-child > div:first-child {margin-right: auto;}
.footer_main_mobile > div:first-child > div:first-child > div:last-child {color: #1A222A; font-size: 20px; font-weight: 700;}

.footer {padding: 20px 32px; display: flex; align-items: center; width: 100%;}
.footer > div {display: block; margin-right: 20px;}
.footer > div:first-child > a:first-child {margin-right: 30px;}
.partner {font-size: 14px; font-weight: 400; color: #555966; margin-left: auto;}
.partner > a {color: #555966; transition: .1s ease-in-out; text-decoration: none;}
.partner > a:hover {color: #5b6936;}

.footer_mobile {display: flex; flex-direction: column; align-items: flex-start; width: 100%; margin-top: 16px; padding-bottom: 13px;}

.footer_main > div:nth-of-type(1) > a {color: #1A222A; font-size: 24px; font-weight: 700; margin-right: 72px;}

.footer_main_mobile > div:last-child {color: #1A222A; font-size: 20px; font-weight: 700;}

.footer_menu > a {display: inline-block; vertical-align: middle; margin-right: 32px;}
.footer_menu > a:last-child {margin-right: 72px;}

.footer_mobile .footer_menu {display: table-cell; vertical-align: middle;}
.footer_mobile .footer_menu > a {margin-right: 40px; display: inline-block;}
.footer_mobile .partner {margin-top: 6px;}
.footer_mobile .copyright {margin-top: 6px;}

.footer_main_mobile .footer_menu {display: flex; flex-wrap: wrap;}

.footer_main_mobile .footer_menu > a {text-align: left; margin-right: 15px; margin-bottom: 15px;}

.footer_media > a img {width: 24px;}
.footer_media > a:first-child img {width: 30px; margin-top: 2px;}
.footer_media > a {display: inline-block; vertical-align: middle; margin-right: 30px;}
.footer_media > a:last-child {margin-right: 72px;}

.footer_mobile_media {width: 80px; display: flex; flex-wrap: wrap;}
.footer_mobile_media > a {margin-right: 20px; margin-bottom: 20px; width: 30px;}
.footer_mobile_media > a:nth-child(2n) {margin-right: 0;}
.footer_mobile_media img {width: 24px;}
.footer_logo img {width: 132px; height: 15px;}

.footer_media i, .footer_mobile_media i {font-size: 18px; line-height: 30px;}
.footer_mobile_media > a:last-child i {font-size: 19px;}

.footer_menu > a, .copyright {
    color: #555966; transition: .1s ease-in-out; text-align: center; font-size: 14px; font-weight: 400;
    text-decoration: none;
}

.footer_menu > a:hover, .copyright:hover {color: #5b6936;}

@media only screen and (max-width: 1400px) {
    .footer_main > div:nth-of-type(1) > a {margin-right: 30px;}
    .footer_main > div {margin-right: 50px;}
    .footer_menu > a:last-child {margin-right: 50px;}
    .footer_media > a:last-child {margin-right: 50px;}
    .footer_menu > a {margin-right: 15px;}
    .footer_media > a {margin-right: 10px;}
}

@media only screen and (max-width: 1200px) {
    .footer_main > div:nth-of-type(1) {font-size: 20px;}
    .footer_menu > a:last-child {margin-right: 30px;}
    .footer_media > a:last-child {margin-right: 0;}
    .footer_logo {display: none !important;}
}

@media only screen and (max-width: 1000px) {
    #footer {display: none;}
    #footer_mobile {display: block;}
    .partner {margin-left: 0;}
    .footer_logo {display: block !important;}
    .footer_logo img {width: 184px; height: 21px; margin-bottom: 24px;}
    .footer_menu > a {margin-right: 0;}
}

@media only screen and (max-width: 600px) {
    .footer_mobile .footer_menu > a {margin-right: 15px;}
}

/* --------------------------------------------------------------------- */
/* ----------------------------- BAYSIDE ------------------------------- */
/* --------------------------------------------------------------------- */

/* --------------------------- BAYSIDE MAIN ---------------------------- */

#side_main {margin-top: 24px;}

.side_main {border-radius: 20px 20px 0 20px; overflow: hidden; position: relative;}

.side_main > div:first-child {
    position: absolute; left: 20px; width: 580px; color: #1A222A; font-size: 56px; font-weight: 700;
}
.side_main > div:first-child > h1 {font-weight: 700;}

.side_main .btn {position: absolute; bottom: 0; right: 0; width: 315px;}

.side_main .background {
    width: 100%; height: 668px; object-fit: cover; object-position: right;
    mask: url("../images/masks/side_main.svg") left top / 1376px 100% no-repeat;
    -webkit-mask: url("../images/masks/side_main.svg") left top / 1376px 100% no-repeat;
}

.side_main .background_m {
    display: none; width: 100%; height: 532px; object-fit: cover; object-position: right;
}

.side_info {position: absolute; bottom: 60px; left: 60px; display: flex; align-items: flex-end;}

.side_info > div {margin-right: 50px;}
.side_info > div:last-child {margin-right: 0;}
.side_info > div:nth-child(-n+3) > div:first-child {
    color: #FFF; font-size: 12px; font-weight: 500; text-transform: uppercase;
}
.side_info > div:nth-child(-n+3) > div:last-child {
    margin-top: 8px; color: #FFF; font-size: 24px; font-weight: 700;
}

.side_info > div:last-child {display: flex;}
.side_info > div:last-child > div {
    margin-right: 14px; width: 70px; height: 70px; text-align: center; border-radius: 12px;
    background: #EFF1F6;
}
.side_info > div:last-child > div:last-child {margin-right: 0;}
.side_info > div:last-child > div i {font-size: 30px; color: #5b6936; line-height: 50px;}
.side_info.lakeside > div:last-child > div:first-child i {font-size: 20px; height: 40px;}
.side_info.highwood > div:last-child > div:first-child i {font-size: 20px; height: 50px;}
.side_info > div:last-child > div:last-child i {font-size: 24px;}
.side_info > div:last-child > div > div {color: #1A222A; font-size: 11px; font-weight: 400; line-height: 100%; padding-top: 4px;}

.side_info_mobile {
    display: none; flex-wrap: wrap; margin-top: 32px; background: #5b6936; border-radius: 20px;
    padding: 32px 24px;
}
.side_info_mobile > div:nth-child(-n+4) {margin-right: auto; width: 40%; margin-bottom: 32px;}
.side_info_mobile > div:nth-child(-n+4) > div:first-child {
    color: #555966; font-size: 11px; font-weight: 500; text-transform: uppercase;
}
.side_info_mobile > div:nth-child(-n+4) > div:last-child {
    margin-top: 8px; color: #555966; font-size: 20px; font-weight: 700;
}
.side_info_mobile > div:nth-child(1), .side_info_mobile > div:nth-child(3) {width: 60%;}
.side_info_mobile > div:nth-child(5) {
    width: 100%; color: #555966; font-size: 11px; font-weight: 500; text-transform: uppercase;
}

.side_info_mobile > div:last-child {display: flex; flex-wrap: wrap; margin-top: 16px;}
.side_info_mobile > div:last-child > div {
    margin-right: 8px; margin-bottom: 8px; width: 72px; height: 79px; text-align: center; border-radius: 12px;
    background: #EFF1F6;
}
.side_info_mobile > div:last-child > div:last-child {margin-right: 0;}
.side_info_mobile > div:last-child > div i {font-size: 32px; color: #5b6936; line-height: 50px;}
.side_info_mobile.lakeside > div:last-child > div:first-child i {font-size: 20px; height: 40px;}
.side_info_mobile.highwood > div:last-child > div:first-child i {font-size: 20px; height: 50px;}
.side_info_mobile > div:last-child > div:last-child i {font-size: 26px;}
.side_info_mobile > div:last-child > div > div {color: #1A222A; font-size: 12px; font-weight: 400;}

.sticker {
    display: flex; align-items: center; position: absolute; left: 60px; bottom: 170px; padding: 0 30px; text-align: center;
    border-radius: 30px; background: #5b6936; font-size: 18px; font-weight: 500; color: #FFFFFF; height: 48px;
}
.sticker i {font-size: 18px; font-weight: 400; margin-right: 8px;}

@media only screen and (max-width: 1400px) {
    .side_info {left: 30px; bottom: 110px;}
    .sticker {left: 30px; bottom: 190px;}
}

@media only screen and (max-width: 1000px) {
    .sticker {display: none;}
    .side_info {display: none;}
    .side_info_mobile {display: flex;}
    .side_info_mobile > div:nth-child(-n+4) > div:first-child {color: #fff;}
    .side_info_mobile > div:nth-child(-n+4) > div:last-child {color: #fff;}
    .side_info_mobile > div:nth-child(5) {color: #fff;}
}

@media only screen and (max-width: 800px) {
    .side_info {display: none;}
    .side_info_mobile {display: flex;}
    .side_main > div:first-child {position: relative; margin-bottom: 20px; font-size: 40px; left: 0;}
    .side_main .background {height: 532px; -webkit-mask: none; mask: none; border-radius: 20px;}
    .side_main .btn {width: 255px; height: 56px;}
    .side_main > div:first-child {width: 100%;}
    .side_main > div:first-child > h1 {font-size: 40px;}
}

@media only screen and (max-width: 600px) {
    .side_main > div:first-child {left: 0;}
}

@media only screen and (max-width: 395px) {
    .side_info_mobile > div:last-child {width: 100%;}
    .side_info_mobile > div:last-child > div {width: calc(50% - 4px); height: 140px;}
    .side_info_mobile > div:last-child > div:nth-child(2n) {margin-right: 0;}
    .side_info_mobile > div:last-child > div i {font-size: 50px; margin-top: 30px;}
    .side_info_mobile.lakeside > div:last-child > div:first-child i {font-size: 30px; height: 50px;}
    .side_info_mobile > div:last-child > div > div {font-size: 16px;}
    .side_main .background {display: none;}
    .side_main .background_m {display: block; height: 370px; border-radius: 20px;}
    .side_main .btn.woodside {width: 244px;}
    .side_main .btn.bayside {width: 235px;}
}

/* --------------------------- HERO RUBLEVOCHKA ---------------------------- */

#hero_rublevochka {
    margin-top: 40px;
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    width: 100%;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 32px;
    box-sizing: border-box;
}

#hero_rublevochka .wrap {
    position: relative;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 0;
}

#hero_rublevochka .t396__artboard {
    position: relative;
    width: 100%;
    height: 600px;
    border-radius: 20px;
    overflow: hidden;
    max-width: 100%;
    contain: layout style paint;
}

#hero_rublevochka .t396__carrier {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    background-size: cover;
    background-position: center center;
}

.hero_rublevochka_clouds {
    position: absolute;
    top: 0;
    left: -10%;
    width: 120%;
    max-width: 120%;
    height: 471px;
    z-index: 1;
    background-image: url('../images/hero_rublevochka/hero_clouds.png');
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 10px;
    animation: cloudsMove 12s ease-in-out infinite;
    will-change: transform;
    transform-origin: center center;
}

@keyframes cloudsMove {
    0% {
        transform: translateX(0) scale(1.02);
    }
    25% {
        transform: translateX(2%) scale(1.02);
    }
    75% {
        transform: translateX(-2%) scale(1.02);
    }
    100% {
        transform: translateX(0) scale(1.02);
    }
}

@keyframes cloudsMove320 {
    0% {
        transform: translateX(0) scale(1.02);
    }
    25% {
        transform: translateX(2%) scale(1.02);
    }
    75% {
        transform: translateX(-2%) scale(1.02);
    }
    100% {
        transform: translateX(0) scale(1.02);
    }
}

@keyframes cloudsMove480 {
    0% {
        transform: translateX(0) translateY(-1%) scale(1.02);
    }
    25% {
        transform: translateX(2%) translateY(-1%) scale(1.02);
    }
    75% {
        transform: translateX(-2%) translateY(-1%) scale(1.02);
    }
    100% {
        transform: translateX(0) translateY(-1%) scale(1.02);
    }
}

@keyframes cloudsMove640 {
    0% {
        transform: translateX(0) translateY(-0.5%) scale(1.02);
    }
    25% {
        transform: translateX(2%) translateY(-0.5%) scale(1.02);
    }
    75% {
        transform: translateX(-2%) translateY(-0.5%) scale(1.02);
    }
    100% {
        transform: translateX(0) translateY(-0.5%) scale(1.02);
    }
}

@keyframes cloudsMove960 {
    0% {
        transform: translateX(0) scale(1.02);
    }
    25% {
        transform: translateX(2%) scale(1.02);
    }
    75% {
        transform: translateX(-2%) scale(1.02);
    }
    100% {
        transform: translateX(0) scale(1.02);
    }
}

#hero_rublevochka .t396__filter {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    background: linear-gradient(90deg, rgba(6, 8, 13, 0.72) 0%, rgba(6, 8, 13, 0.36) 50%, rgba(6, 8, 13, 0.10) 100%);
}

.hero_rublevochka_container {
    position: relative;
    z-index: 4;
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 60px;
    min-height: 600px;
}

.hero_rublevochka_content {
    position: absolute;
    z-index: 5;
    top: 27px;
    left: 80px;
    width: calc(100% - 340px);
    max-width: 633px;
    padding-top: 0;
    animation: fadeIn 1s ease-in-out;
}

.hero_rublevochka_kicker{
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.72);
    margin-bottom: 10px;
}

.hero_rublevochka_subtitle{
    margin-top: 14px;
    font-size: 16px;
    line-height: 1.35;
    color: rgba(255,255,255,0.82);
    max-width: 520px;
}

.hero_rublevochka_content_event .hero_rublevochka_title{
    font-size: 44px;
    line-height: 1.15;
}

.hero_rublevochka_event_date{
    margin-top: 12px;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.3;
    color: #f0dfb0;
    letter-spacing: 0.02em;
}

.hero_rublevochka_content_event .hero_rublevochka_subtitle{
    margin-top: 10px;
    font-size: 18px;
    font-weight: 500;
}

.hero_rublevochka_event_text{
    margin: 18px 0 0;
    max-width: 600px;
    font-size: 15px;
    line-height: 1.5;
    color: rgba(255,255,255,0.88);
}

.hero_rublevochka_cta_row_single{
    margin-top: 22px;
}

.hero_rublevochka_cta_row_single .hero_rublevochka_btn{
    width: auto;
    min-width: 260px;
}

.hero_event_badge{
    display: inline-block;
    margin-bottom: 12px;
    padding: 8px 14px;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(183, 155, 74, 0.95), rgba(240, 223, 176, 0.85));
    color: #1a222a;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    box-shadow: 0 8px 24px rgba(0,0,0,0.25);
}

.hero_rublevochka_lead{
    margin-top: 14px;
    max-width: 580px;
    font-size: 17px;
    line-height: 1.45;
    color: rgba(255,255,255,0.92);
    font-weight: 500;
}

.hero_event_perks{
    margin: 16px 0 0;
    padding: 0;
    list-style: none;
    max-width: 620px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 16px;
}

.hero_event_perks li{
    position: relative;
    padding-left: 22px;
    font-size: 14px;
    line-height: 1.35;
    color: rgba(255,255,255,0.9);
}

.hero_event_perks li::before{
    content: "✦";
    position: absolute;
    left: 0;
    top: 0;
    color: #f0dfb0;
    font-size: 12px;
}

.hero_rublevochka_content_event .hero_rublevochka_event_text{
    margin-top: 14px;
    font-size: 14px;
    line-height: 1.45;
    color: rgba(255,255,255,0.78);
}

.hero_rublevochka_cta_row_dual{
    margin-top: 22px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: stretch;
}

.hero_rublevochka_cta_row_dual .hero_rublevochka_btn{
    flex: 1 1 220px;
    min-width: 200px;
    text-decoration: none;
}

.hero_rublevochka_cta_row_dual a.hero_rublevochka_btn > div{
    justify-content: center;
}

#hero_rublevochka .hero_rublevochka_artboard_event{
    min-height: 720px;
}

@media only screen and (max-width: 639px) {
    .hero_event_perks{
        grid-template-columns: 1fr;
    }
    .hero_rublevochka_content_event .hero_rublevochka_title{
        font-size: 28px;
    }
    .hero_rublevochka_cta_row_dual .hero_rublevochka_btn{
        flex-basis: 100%;
    }
    #hero_rublevochka .hero_rublevochka_artboard_event{
        min-height: 640px;
    }
}

@media only screen and (max-width: 959px) {
    #hero_rublevochka .hero_rublevochka_artboard_event {
        height: auto !important;
        min-height: 0;
        padding-bottom: 28px;
    }

    #hero_rublevochka .hero_rublevochka_artboard_event .hero_rublevochka_container {
        min-height: auto !important;
        padding-top: 36px;
        padding-bottom: 28px;
    }

    #hero_rublevochka .hero_rublevochka_artboard_event .hero_rublevochka_content,
    #hero_rublevochka .hero_rublevochka_artboard_event .hero_rublevochka_content_event {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px !important;
        box-sizing: border-box;
    }

    #hero_rublevochka .hero_rublevochka_artboard_event .hero_rublevochka_cta_row,
    #hero_rublevochka .hero_rublevochka_artboard_event .hero_rublevochka_cta_row_dual {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        width: 100%;
        margin-top: 20px;
    }

    #hero_rublevochka .hero_rublevochka_artboard_event .hero_rublevochka_btn {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 56px !important;
        min-height: 56px;
        margin-right: 0 !important;
        flex: none;
    }

    #hero_rublevochka .hero_rublevochka_artboard_event .hero_rublevochka_btn > div {
        justify-content: center;
        white-space: normal;
        font-size: 15px;
        line-height: 1.25;
    }

    #hero_rublevochka .hero_rublevochka_artboard_event .hero_rublevochka_btn_secondary {
        background: rgba(255, 255, 255, 0.95) !important;
        border: 1px solid rgba(255, 255, 255, 0.35) !important;
        color: #1A222A !important;
    }

    #hero_rublevochka .hero_rublevochka_artboard_event .hero_rublevochka_btn_secondary > div {
        color: #1A222A !important;
    }
}

.hero_rublevochka_btn_mobile {
    display: none;
    position: relative;
    z-index: 17;
    background: #F5F5F0;
    border-radius: 12px;
    cursor: pointer;
    border: none;
    align-items: center;
    justify-content: center;
}

.hero_rublevochka_btn_text_mobile {
    display: none;
    position: relative;
    z-index: 18;
    color: #1A3A5C;
    font-size: 16px;
    font-weight: 500;
    font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.hero_rublevochka_btn_arrow_mobile {
    display: none;
    position: relative;
    z-index: 19;
    margin-left: 8px;
}

.hero_rublevochka_btn_arrow_mobile i {
    color: #1A3A5C;
    font-size: 18px;
}

.hero_rublevochka_title {
    font-size: 49px;
    font-weight: 700;
    line-height: 130%;
    color: #ffffff;
    margin: 0;
    font-family: ui-serif, Georgia, "Times New Roman", Times, serif;
}

.hero_rublevochka_artboard_event{
    min-height: 640px;
    height: auto;
}

#hero_rublevochka .hero_rublevochka_artboard_event{
    height: auto;
    min-height: 640px;
    padding-bottom: 28px;
}

@media only screen and (max-width: 639px) {
    #hero_rublevochka .hero_rublevochka_artboard_event {
        min-height: 580px;
        height: auto;
    }
}

.hero_rublevochka_offer_badge{
    margin-top: 18px;
    max-width: 640px;
    padding: 14px 16px;
    border-radius: 14px;
    background: rgba(12, 14, 18, 0.35);
    border: 1px solid rgba(183, 155, 74, 0.55);
    color: rgba(255,255,255,0.86);
    font-size: 13px;
    line-height: 1.35;
    box-shadow: 0 10px 30px rgba(0,0,0,0.20);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.hero_rublevochka_offer_badge_emph{
    font-weight: 700;
    color: #f0dfb0;
}

.hero_rublevochka_modes{
    margin-top: 14px;
    display: inline-flex;
    gap: 10px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.hero_rublevochka_mode{
    appearance: none;
    border: 0;
    cursor: pointer;
    padding: 0;
    border-radius: 0;
    font-size: 13px;
    font-weight: 500;
    color: rgba(255,255,255,0.70);
    background: transparent;
    font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.hero_rublevochka_mode + .hero_rublevochka_mode{
    position: relative;
    padding-left: 14px;
}

.hero_rublevochka_mode + .hero_rublevochka_mode:before{
    content: '/';
    position: absolute;
    left: 3px;
    top: 0;
    color: rgba(255,255,255,0.35);
}

.hero_rublevochka_mode.active{
    background: transparent;
    color: rgba(255,255,255,0.92);
}

.hero_rublevochka_cta_row{
    margin-top: 16px;
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

.hero_rublevochka_cta_row .hero_rublevochka_btn{
    width: auto;
    height: 56px;
    padding: 14px 20px;
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.12);
}

.hero_rublevochka_cta_row .hero_rublevochka_btn > div{
    gap: 10px;
}

.hero_rublevochka_btn_secondary{
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(255,255,255,0.35);
    color: #1A222A;
}

.hero_rublevochka_btn_secondary:hover{
    background: #fff;
    color: #1A222A;
    box-shadow: 0 12px 34px rgba(0,0,0,0.14);
}

.hero_rublevochka_btn_secondary > div{
    color: inherit;
}

.hero_rublevochka_cta_stack{
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

.hero_rublevochka_btn_primary > div{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    white-space: normal;
    text-align: center;
}

.hero_rublevochka_btn_secondary{
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(91,105,54,0.30);
    color: #5b6936;
}

.hero_rublevochka_btn_secondary:hover{
    background: rgba(255,255,255,0.16);
    color: #5b6936;
}

.hero_rublevochka_btn_secondary i{
    display: none;
}

.hero_rublevochka_btn_mobile_secondary{
    display: none;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.hero_rublevochka_card_image {
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px;
    height: auto;
}

.hero_rublevochka_card_image img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: 12px;
}

.hero_rublevochka_card_text {
    font-size: 24px;
    font-weight: 700;
    color: #5b6936;
    margin-bottom: 24px;
    line-height: 130%;
    font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.hero_rublevochka_card {
    position: absolute;
    z-index: 5;
    top: 176px;
    right: 0;
    width: 240px;
    height: auto;
    min-height: 312px;
    background: rgba(245, 245, 240, 0.95);
    border-radius: 20px;
    padding: 24px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    animation: fadeIn 1s ease-in-out 0.2s both;
    box-sizing: border-box;
    margin-right: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.hero_rublevochka_btn {
    position: relative;
    width: 100%;
    height: 40px;
    background: #5b6936;
    color: #F5F5F0;
    justify-content: space-between;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    border-radius: 30px;
    margin-top: 0;
    z-index: 6;
}

.hero_rublevochka_btn_primary{
    background: #5b6936;
    color: #F5F5F0;
}

.hero_rublevochka_btn_primary i{
    color: #F5F5F0;
}

.hero_rublevochka_btn_primary:hover{
    background: #4a5630;
    color: #F5F5F0;
    box-shadow: 0 4px 12px rgba(91, 105, 54, 0.3);
}

.hero_rublevochka_btn:hover {
    background: #4a5630;
    color: #F5F5F0;
    box-shadow: 0 4px 12px rgba(91, 105, 54, 0.3);
    transform: translateY(-1px);
}

.hero_rublevochka_btn:active {
    transform: translateY(0);
}

.hero_rublevochka_btn > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.hero_rublevochka_btn i {
    font-size: 18px;
    color: #F5F5F0;
    margin-left: 8px;
}

@media only screen and (max-width: 1199px) {
    #hero_rublevochka .wrap {
        padding: 0;
        max-width: 960px;
    }
    #hero_rublevochka .t396__artboard {
        height: 503px;
    }
    .hero_rublevochka_container {
        min-height: 503px;
        padding: 0;
    }
    .hero_rublevochka_content {
        left: 51px;
        width: calc(100% - 291px);
        max-width: 621px;
        padding-top: 17px;
    }
    .hero_rublevochka_title {
        font-size: 49px;
    }
    .hero_rublevochka_card {
        top: 146px;
        right: 0;
        width: 240px;
        height: auto;
        min-height: 294px;
        margin-right: 11px;
    }
    .hero_rublevochka_btn {
        position: relative;
        width: 100%;
        margin-right: 0;
    }
    .hero_rublevochka_clouds {
        left: -10%;
        width: 120%;
        max-width: 120%;
        height: 458px;
        animation: cloudsMove960 12s ease-in-out infinite;
    }
}

@media only screen and (max-width: 959px) {
    #hero_rublevochka .wrap {
        padding: 0;
        max-width: 640px;
    }
    #hero_rublevochka .t396__artboard {
        height: auto;
        min-height: 500px;
    }
    .hero_rublevochka_container {
        flex-direction: column;
        padding: 0;
        min-height: auto;
        align-items: flex-start;
        position: relative;
    }
    .hero_rublevochka_content {
        position: absolute;
        top: 39px;
        left: 29px;
        width: calc(100% - 58px);
        max-width: 502px;
        padding-top: 0;
    }
    .hero_rublevochka_title {
        font-size: 39px;
    }
    .hero_rublevochka_card {
        position: absolute;
        top: 237px;
        right: 0;
        width: 186px;
        height: auto;
        min-height: 229px;
        max-width: none;
        margin-right: 10px;
    }
    .hero_rublevochka_card_text {
        font-size: 13px;
    }
    .hero_rublevochka_btn {
        position: relative;
        width: 100%;
        height: 29px;
        margin-right: 0;
    }
    .hero_rublevochka_clouds {
        left: -10%;
        width: 120%;
        max-width: 120%;
        height: 471px;
        animation: cloudsMove480 12s ease-in-out infinite;
    }
}

/* Quiz modal */
.quiz_modal{
    padding: 20px;
    pointer-events: auto;
}

.quiz_modal_card{
    background: #fff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 18px 60px rgba(0,0,0,0.18);
    position: relative;
    z-index: 2;
}

.quiz_modal_header{
    padding: 18px 18px 14px 18px;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.quiz_modal_title{
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
}

.quiz_modal_close{
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    cursor: pointer;
    background: #f6f6f6;
}

.quiz_modal_body{
    padding: 18px;
}

.quiz_progress{
    width: 100%;
    height: 6px;
    border-radius: 999px;
    background: #ececec;
    overflow: hidden;
}

.quiz_progress_value{
    height: 100%;
    width: 0%;
    background: #5b6936;
}

.quiz_step_meta{
    margin-top: 10px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    color: #6a6a6a;
    font-size: 12px;
}

.quiz_question{
    margin-top: 16px;
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
}

.quiz_options_grid{
    margin-top: 14px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.quiz_option_card{
    border: 1px solid #e7e7e7;
    border-radius: 16px;
    padding: 14px;
    cursor: pointer;
    user-select: none;
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.quiz_option_media{
    width: 100%;
    height: 110px;
    border-radius: 14px;
    overflow: hidden;
    background: #f3f4f6;
    margin-bottom: 10px;
}

.quiz_option_media img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.quiz_option_card:hover{
    border-color: #d7dcc7;
    box-shadow: 0 10px 24px rgba(0,0,0,0.06);
    transform: translateY(-1px);
}

.quiz_option_card.active{
    border-color: #5b6936;
    box-shadow: 0 10px 24px rgba(91,105,54,0.16);
}

.quiz_option_label{
    font-weight: 700;
    color: #1a1a1a;
}

.quiz_option_hint{
    margin-top: 6px;
    color: #6a6a6a;
    font-size: 13px;
    line-height: 1.35;
}

.quiz_options_list{
    margin-top: 14px;
    display: grid;
    gap: 10px;
}

.quiz_radio{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid #e7e7e7;
    border-radius: 14px;
    cursor: pointer;
    user-select: none;
    background: #fff;
}

.quiz_radio.active{
    border-color: #5b6936;
    box-shadow: 0 10px 24px rgba(91,105,54,0.12);
}

.quiz_radio_dot{
    width: 18px;
    height: 18px;
    border-radius: 999px;
    border: 2px solid #cfcfcf;
    display: grid;
    place-items: center;
}

.quiz_radio.active .quiz_radio_dot{
    border-color: #5b6936;
}

.quiz_radio_dot:before{
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: transparent;
}

.quiz_radio.active .quiz_radio_dot:before{
    background: #5b6936;
}

.quiz_actions{
    margin-top: 16px;
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
}

.quiz_btn_secondary{
    background: #f6f6f6;
    border: 1px solid #ececec;
    color: #1A222A;
}

.quiz_btn_primary{
    background: #5b6936;
}

.quiz_btn_primary > div,
.quiz_btn_secondary > div{
    justify-content: center;
}

.quiz_btn_secondary:hover{
    background: #eef0f4;
    box-shadow: none;
}

.quiz_btn_secondary > div{
    color: inherit;
}

.quiz_btn_primary.disabled{
    opacity: .6;
    pointer-events: none;
}

.quiz_form{
    margin-top: 14px;
    display: grid;
    gap: 12px;
}

.quiz_input{
    width: 100%;
    border: 1px solid #e7e7e7;
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 14px;
    outline: none;
    box-sizing: border-box;
    background: #fff;
    color: #1A222A;
}

.quiz_input::placeholder{
    color: #9497A2;
}

.quiz_input:focus{
    border-color: rgba(91,105,54,0.55);
    box-shadow: 0 0 0 4px rgba(91,105,54,0.12);
}

.quiz_input.error{
    border-color: #d36b6b;
}

.quiz_error{
    margin-top: -6px;
    color: #d36b6b;
    font-size: 12px;
    display: none;
}

.quiz_error.active{
    display: block;
}

.quiz_legal{
    margin-top: 10px;
    font-size: 12px;
    line-height: 1.35;
    color: #6a6a6a;
}

.quiz_legal a{
    color: #5b6936;
    text-decoration: underline;
}

@media (max-width: 800px){
    .quiz_modal{
        padding: 0;
    }
    .quiz_modal_card{
        border-radius: 0;
        min-height: 100vh;
    }
    .quiz_options_grid{
        grid-template-columns: 1fr;
    }
    .hero_rublevochka_btn_mobile_secondary{
        display: block;
        margin-top: 10px;
        text-align: center;
        color: #F5F5F0;
        text-decoration: underline;
        opacity: .92;
        cursor: pointer;
        position: relative;
        z-index: 20;
    }

    .hero_rublevochka_cta_row{
        width: 100%;
        justify-content: center;
    }
    .hero_rublevochka_cta_row .hero_rublevochka_btn{
        width: 100%;
        max-width: 420px;
    }
}

@media only screen and (max-width: 639px) {
    #hero_rublevochka {
        max-width: 100% !important;
        padding: 0 12px !important;
    }
    #hero_rublevochka .wrap {
        padding: 0;
        max-width: 100%;
    }
    #hero_rublevochka .t396__artboard {
        height: 70vh;
        min-height: 500px;
    }
    #hero_rublevochka .hero_rublevochka_artboard_event {
        height: auto !important;
        min-height: 480px;
    }
    .hero_rublevochka_container {
        min-height: 70vh;
        padding: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
    }
    .hero_rublevochka_content {
        position: relative;
        top: 10%;
        left: auto;
        width: calc(100% - 32px);
        max-width: 100%;
        text-align: center;
        padding: 0 16px;
        margin: 0 auto;
    }
    .hero_rublevochka_title {
        font-size: 26px !important;
        line-height: 130% !important;
        color: #ffffff !important;
        margin-bottom: 24px !important;
        font-weight: 700 !important;
        font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    }
    .hero_rublevochka_card {
        display: none;
    }
    .hero_rublevochka_btn {
        display: flex;
    }
    .hero_rublevochka_btn_mobile {
        display: none !important;
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: 220px !important;
        height: 56px !important;
        background: #5b6936 !important;
        border-radius: 12px !important;
        margin: 0 auto !important;
        margin-top: 50px !important;
        box-shadow: 0 2px 8px rgba(91, 105, 54, 0.3) !important;
        cursor: pointer !important;
        transition: all 0.2s ease !important;
    }
    .hero_rublevochka_btn_mobile::after,
    .hero_rublevochka_btn_mobile::before {
        content: none !important;
    }
    .hero_rublevochka_btn_mobile:hover {
        background: #4a5630 !important;
        box-shadow: 0 4px 12px rgba(91, 105, 54, 0.4) !important;
        transform: translateY(-1px) !important;
    }
    .hero_rublevochka_btn_text_mobile {
        display: none !important;
        position: relative !important;
        z-index: 18 !important;
        margin-top: -42px !important;
        color: #FFF !important;
        font-size: 16px !important;
        font-weight: 500 !important;
        padding: 0 16px !important;
        text-align: center !important;
    }
    .hero_rublevochka_btn_arrow_mobile {
        display: none !important;
        position: relative !important;
        z-index: 19 !important;
        margin-top: -24px !important;
        opacity: 0.9 !important;
    }
    .hero_rublevochka_btn_arrow_mobile i {
        font-size: 18px !important;
        color: #FFF !important;
        line-height: 56px !important;
    }
    .hero_rublevochka_clouds {
        left: -10% !important;
        width: 120% !important;
        max-width: 120% !important;
        height: 65% !important;
        min-height: 350px !important;
        animation: cloudsMove640 12s ease-in-out infinite !important;
        will-change: transform !important;
        transform-origin: center center !important;
    }
}

@media only screen and (max-width: 479px) {
    #hero_rublevochka {
        max-width: 100% !important;
        padding: 0 12px !important;
    }
    #hero_rublevochka .wrap {
        padding: 0;
        max-width: 100%;
    }
    #hero_rublevochka .t396__artboard {
        height: 85vh !important;
        min-height: 650px !important;
    }
    #hero_rublevochka .hero_rublevochka_artboard_event {
        height: auto !important;
        min-height: 520px !important;
    }
    .hero_rublevochka_container {
        min-height: 85vh !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        position: relative !important;
    }
    .hero_rublevochka_content {
        position: relative !important;
        top: 8% !important;
        left: auto !important;
        width: calc(100% - 32px) !important;
        max-width: 100% !important;
        text-align: center !important;
        padding: 0 16px !important;
        margin: 0 auto !important;
    }
    .hero_rublevochka_title {
        font-size: 24px !important;
        line-height: 130% !important;
        color: #ffffff !important;
        margin-bottom: 40px !important;
        font-weight: 700 !important;
        font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    }
    .hero_rublevochka_card {
        display: none !important;
    }
    .hero_rublevochka_btn {
        display: flex !important;
    }
    .hero_rublevochka_btn_mobile {
        display: none !important;
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: 220px !important;
        height: 56px !important;
        background: #5b6936 !important;
        border-radius: 12px !important;
        margin: 0 auto !important;
        margin-top: 60px !important;
        box-shadow: 0 2px 8px rgba(91, 105, 54, 0.3) !important;
        cursor: pointer !important;
        transition: all 0.2s ease !important;
    }
    .hero_rublevochka_btn_mobile::after,
    .hero_rublevochka_btn_mobile::before {
        content: none !important;
    }
    .hero_rublevochka_btn_mobile:hover {
        background: #4a5630 !important;
        box-shadow: 0 4px 12px rgba(91, 105, 54, 0.4) !important;
        transform: translateY(-1px) !important;
    }
    .hero_rublevochka_btn_text_mobile {
        display: none !important;
    }
    .hero_rublevochka_btn_arrow_mobile {
        display: none !important;
    }
    .hero_rublevochka_btn_arrow_mobile i {
        font-size: 18px !important;
        color: #FFF !important;
        line-height: 56px !important;
    }
    .hero_rublevochka_clouds {
        left: -10% !important;
        width: 120% !important;
        max-width: 120% !important;
        height: 75% !important;
        min-height: 450px !important;
        animation: cloudsMove320 18s ease-in-out infinite !important;
        will-change: transform !important;
        transform-origin: center center !important;
    }
}

/* --------------------------- BAYSIDE INFO ---------------------------- */

#bayside_info {margin-top: 40px;}

.bayside_info_title {display: flex; width: 100%;}
.bayside_info_title h2 {white-space: nowrap;}
.bayside_info_title > div:last-child {padding-left: 10px; padding-right: 24px; width: 50%; margin-left: auto;}
.bayside_info_title > div:last-child > div:first-child {color: #1A222A; font-size: 18px; font-weight: 700;}
.bayside_info_title > div:last-child > div:last-child {
    margin-top: 12px; color: #555966; font-size: 16px; font-weight: 400;
}

.bayside_info_main {display: flex; margin-top: 32px;}
.bayside_info_main > div:last-child {margin-left: 20px; display: flex; flex-wrap: wrap;}
.bayside_info_main > div {width: calc(50% - 10px); height: 496px; border-radius: 8px; overflow: hidden;}
.bayside_info_main > div:first-child {cursor: pointer; transition: .3s ease-in-out;}
.bayside_info_main > div:first-child:hover {-webkit-filter: brightness(77%);}
.bayside_info_main img {width: 100%; height: 100%; object-fit: cover;}
.bayside_info_main > div:last-child > div {cursor: pointer; transition: .3s ease-in-out;}
.bayside_info_main > div:last-child > div:not(:last-child):hover {-webkit-filter: brightness(77%);}
.bayside_info_main > div:last-child > div:last-child:hover {background: rgba(0, 0, 0, 0.23) !important;}
.bayside_info_main > div:last-child > div:last-child {background: rgba(0, 0, 0, 0.35);}
.bayside_info_main > div:last-child > div:last-child img {position: absolute; z-index: -1;}
.bayside_info_main i {font-size: 14px;}

.bayside_info_main > div:last-child > div {width: calc(50% - 10px); margin-right: 10px; border-radius: 8px; overflow: hidden;}
.bayside_info_main > div:last-child > div:nth-child(2n) {margin-right: 0; margin-left: 10px;}
.bayside_info_main > div:last-child > div:nth-child(-n+2) {margin-bottom: 10px;}
.bayside_info_main > div:last-child > div:nth-last-child(-n+2) {margin-top: 10px;}
.bayside_info_main > div:last-child > div:last-child {position: relative;}
.bayside_info_main > div:last-child > div:last-child > div > div:first-child {
    margin-left: 23px; line-height: 54px; width: 54px; height: 54px; color: #8F97A6; background: #FFF; border-radius: 50%;
    cursor: pointer; margin-bottom: 12px;
}
.bayside_info_main > div:last-child > div:last-child > div:last-child {
    position: absolute; top: calc(50% - 45px); left: calc(50% - 50px); bottom: 80px; color: #FFF; text-align: center;
    font-size: 16px; font-weight: 500;
}

.bayside_info_main_swipe {display: none; margin-top: 32px;}
.bayside_info_swipe_track {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 6px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}
.bayside_info_swipe_track::-webkit-scrollbar {height: 4px;}
.bayside_info_swipe_track::-webkit-scrollbar-track {background: transparent;}
.bayside_info_swipe_track::-webkit-scrollbar-thumb {background: rgba(150, 150, 150, 0.35); border-radius: 10px;}

.bayside_info_swipe_item {
    scroll-snap-align: start;
    flex: 0 0 min(78vw, 360px);
    aspect-ratio: 4 / 3;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    background: #D9DDE6;
}
.bayside_info_swipe_item img {width: 100%; height: 100%; object-fit: cover; display: block;}

.bayside_info_swipe_item_all .bayside_info_swipe_overlay {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #FFF;
    background: rgba(0, 0, 0, 0.28);
    text-align: center;
    font-size: 14px;
    font-weight: 600;
}
.bayside_info_swipe_item_all .bayside_info_swipe_overlay > div:first-child {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #FFF;
    color: #8F97A6;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bayside_info_swipe_item_all .bayside_info_swipe_overlay i {font-size: 12px;}

@media only screen and (max-width: 1000px) {
    .bayside_info_main {display: none;}
    .bayside_info_main_swipe {display: block;}
    .bayside_info_main {flex-direction: column;}
    .bayside_info_main > div {width: 100%;}
    .bayside_info_main > div:last-child {margin-left: 0; margin-top: 20px;}
    .bayside_info_main > div {height: auto;}
    .bayside_info_title > div:last-child {padding-left: 0;}
}

@media only screen and (max-width: 800px) {
    .bayside_info_main > div {border-radius: 20px;}
    .bayside_info_main > div:last-child > div {border-radius: 20px;}
    .bayside_info_title {flex-direction: column;}
    .bayside_info_title > div:last-child {margin-left: 0; margin-top: 12px; width: 100%;}
}

@media only screen and (max-width: 600px) {
    .bayside_info_main {margin-top: 12px;}
    .bayside_info_main_swipe {margin-top: 12px;}
    .bayside_info_main i {font-size: 10px;}
    .bayside_info_main > div:last-child > div:last-child > div > div:first-child {margin-bottom: 8px;}
    .bayside_info_main > div:last-child {margin-top: 12px;}
    .bayside_info_main > div:last-child > div:nth-child(-n+2) {margin-bottom: 6px;}
    .bayside_info_main > div:last-child > div:nth-last-child(-n+2) {margin-top: 6px;}
    .bayside_info_main > div:last-child > div {margin-right: 6px; width: calc(50% - 6px);}
    .bayside_info_main > div:last-child > div:nth-child(2n) {margin-left: 6px;}
    #bayside_info {margin-top: 32px;}
    .bayside_info_title > div:last-child > div:first-child {font-size: 14px; width: 182px;}
    .bayside_info_title.lakeside > div:last-child > div:first-child {font-size: 14px; width: 250px;}
    .bayside_info_title > div:last-child {font-size: 14px;}
    .bayside_info_title > div:last-child > div:last-child {font-size: 14px;}
    .bayside_info_main > div:last-child > div:last-child > div > div:first-child {margin-left: 17px; line-height: 32px; width: 32px; height: 32px;}
    .bayside_info_main > div:last-child > div:last-child > div:last-child {font-size: 10px; top: calc(50% - 28px); left: calc(50% - 34px);}
}

/* ----------------------- BAYSIDE DOCUMENTATION ----------------------- */

#bayside_docs {margin-top: 40px;}
#bayside_docs.main {margin-top: 30px;}

#bayside_docs h1 {padding-left: 24px; color: #1A222A; font-size: 40px; font-weight: 700; line-height: 120%;}

.bayside_docs {margin-left: 24px; display: flex; flex-wrap: wrap; margin-top: 30px;}
.bayside_docs.main {margin-left: 0;}
.bayside_docs > a {
    width: calc(33.3% - 20px); height: 105px; margin-right: 20px; border-radius: 12px; background: #FFF;
    display: flex; align-items: center; padding: 26px 26px 26px 16px; margin-bottom: 20px;
}
.bayside_docs > a:nth-child(3n) {margin-right: 0; width: 33.3%;}

.bayside_docs > a > div:nth-of-type(1) {color: #5b6936; font-size: 40px; font-weight: 700;}
.bayside_docs > a > div:nth-of-type(2) {margin-left: 20px; color: #1A222A; width: 70%; font-size: 16px; font-weight: 400;}
.bayside_docs > a > div:last-child {margin-left: auto;}
.bayside_docs > a > div:last-child > i {font-size: 22px;}

.bayside_docs_footer {margin-left: 24px; display: flex; align-items: center; margin-top: 12px;}
.bayside_docs_footer.main {margin-left: 0;}
.bayside_docs_footer > div:first-child {max-width: 500px; color: #9497A2; font-size: 14px; font-weight: 400;}
.bayside_docs_footer > div:first-child strong {font-weight: 400; color: #1A222A;}
.bayside_docs_footer .btn {margin-left: auto; max-width: 324px; height: 64px;}

@media only screen and (max-width: 1200px) {
    .bayside_docs.main > a {width: 100% !important; margin-right: 0 !important;}
}

@media only screen and (max-width: 1000px) {
    #bayside_docs h1 {padding-left: 0;}
    .bayside_docs > a {width: calc(50% - 20px);}
    .bayside_docs > a:nth-child(3n) {margin-right: 20px; width: calc(50% - 20px);}
    .bayside_docs > a:nth-child(2n) {margin-right: 0; width: 50%;}
    .bayside_docs > a:last-child {width: 100%; margin-right: 0;}
    .bayside_docs {margin-left: 0;}
    .bayside_docs_footer {margin-left: 0;}
}

@media only screen and (max-width: 800px) {
    .bayside_docs_footer {flex-direction: column;}
    .bayside_docs_footer .btn {margin-right: auto; margin-top: 24px; width: 100%; max-width: 400px;}
}

@media only screen and (max-width: 600px) {
    .bayside_docs {margin-top: 12px;}
    .bayside_docs > a {flex-direction: column; align-items: flex-start; height: auto; margin-right: 12px; margin-bottom: 12px; padding: 16px 8px;}
    .bayside_docs > a:nth-child(3n) {margin-right: 12px;}
    .bayside_docs > a:nth-child(2n) {margin-right: 0;}
    .bayside_docs > a > div:nth-of-type(1) {font-size: 24px;}
    .bayside_docs > a > div:nth-of-type(2) {margin-left: 0; font-size: 14px; width: 100%; margin-top: 8px; margin-bottom: 8px;}
    .bayside_docs > a > div:last-child {margin-left: 0; margin-top: auto;}
    .bayside_docs > a > div:last-child > i {font-size: 14px;}
    #bayside_docs {margin-top: 32px;}
    #bayside_docs.main {margin-top: 20px;}
}

/* --------------------------- BAYSIDE PLAN ---------------------------- */

#bayside_plan {margin-top: 40px; overflow: hidden;}

.bayside_plan_menu {display: flex;}
.bayside_plan_menu > div {
    transition: .2s; width: 150px; text-align: center; line-height: 40px; user-select: none; cursor: pointer;
    color: #9497A2; font-size: 18px; font-weight: 700; margin-right: 52px; margin-bottom: 32px; border-bottom: transparent 2px solid;
}
.bayside_plan_menu > div:hover {color: #5b6936;}
.bayside_plan_menu > div.active {color: #004B1E; border-bottom: #004B1E 2px solid;}
#bayside_plan > div:last-child {display: flex; flex-direction: column;}

@media only screen and (max-width: 1000px) {
    #bayside_plan {margin: 0 !important; padding: 0 !important;}
    .bayside_plan_menu {margin: 0 !important; padding: 0 !important;}
    .bayside_plan_menu > div {margin: 0 !important; padding: 0 !important; margin-right: 12px !important;}
    .bayside_plan_menu.wrap {margin: 0 !important; padding: 0 12px !important;}
    #bayside_plan > div:last-child {margin: 0 !important; padding: 0 !important;}
    #tab_1 {margin: 0 !important; padding: 0 !important;}
    #tab_1.active {margin: 0 !important; padding: 0 !important;}
    #tab_1 > div {margin: 0 !important; padding: 0 !important;}
    #plan_left {margin: 0 !important; padding: 0 !important;}
    #plan_right {margin: 0 !important; padding: 0 !important;}
}

@media only screen and (max-width: 800px) {
    #bayside_plan {margin: 0 !important; padding: 0 !important;}
    #bayside_plan > div:last-child {flex-direction: column-reverse; margin: 0 !important; padding: 0 !important;}
    .bayside_plan_menu {margin: 0 !important; padding: 0 !important;}
    .bayside_plan_menu.wrap {margin: 0 !important; padding: 0 12px !important;}
    .bayside_plan_menu > div {font-size: 14px; line-height: 30px; margin: 0 !important; padding: 0 !important; margin-right: 12px !important;}
    #tab_1 {margin: 0 !important; padding: 0 !important;}
    #tab_1.active {margin: 0 !important; padding: 0 !important;}
    #tab_1 > div {margin: 0 !important; padding: 0 !important;}
    #plan_left {margin: 0 !important; padding: 0 !important;}
    #plan_right {margin: 0 !important; padding: 0 !important;}
}

@media only screen and (max-width: 600px) {
    #bayside_plan {margin: 0 !important; padding: 0 !important; min-height: 0;}
    .bayside_plan_menu {margin: 0 !important; padding: 0 !important;}
    .bayside_plan_menu.wrap {margin: 0 !important; padding: 0 12px !important;}
    .bayside_plan_menu > div {margin: 0 !important; padding: 0 !important; margin-right: 12px !important;}
    #bayside_plan > div:last-child {margin: 0 !important; padding: 0 !important;}
    #tab_1 {margin: 0 !important; padding: 0 !important;}
    #tab_1.active {margin: 0 !important; padding: 0 !important;}
    #tab_1 > div {margin: 0 !important; padding: 0 !important;}
    #plan_left {margin: 0 !important; padding: 0 !important;}
    #plan_right {margin: 0 !important; padding: 0 !important;}
    #plan_block {margin: 0 !important; padding: 0 !important;}
    #plan_wrap {margin: 0 !important; padding: 0 !important;}
    #plan_pan {margin: 0 !important; padding: 0 !important;}
}

/* ------------------------ BAYSIDE ADVANTAGES ------------------------ */

#bayside_advantages {margin-top: 40px;}

.bayside_advantages {display: flex; flex-wrap: wrap;}
.bayside_advantages > div {
    position: relative; padding-top: 30%; min-height: 259px; border-radius: 12px; overflow: hidden; max-height: 432px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.70) 100%); width: calc(33.3% - 16px);
    margin-right: 24px; margin-top: 24px;
}
.bayside_advantages > div:nth-child(3n) {margin-right: 0;}
.bayside_advantages > div img {z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.bayside_advantages > div > div > div:first-child {width: 100%; padding-right: 24px; color: #FFF; font-size: 24px; font-weight: 700;}
.bayside_advantages > div > div > div:last-child {
    width: 100%; padding-top: 16px; padding-right: 24px; color: #FFF; font-size: 16px; margin-top: 0; font-weight: 400; opacity: 0;
    max-height: 0; transition: all 0.8s ease-in-out;
}
.bayside_advantages > div > div {position: absolute; bottom: 30px; left: 24px;}
.bayside_advantages > div:before {
    content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.7) 100%); opacity: 0; transition: all 0.5s ease-in-out;
}

.bayside_advantages > div:hover:before {opacity: 1;}
.bayside_advantages > div:hover > div > div:last-child {display: block; opacity: 0.7; max-height: 200px;}

@media only screen and (max-width: 1000px) {
    .bayside_advantages > div > div > div:first-child {font-size: 14px;}
    .bayside_advantages > div > div > div:last-child {font-size: 12px;}
    .bayside_advantages > div > div {bottom: 20px; left: 12px;}
    .bayside_advantages > div > div > div:first-child {padding-right: 12px;}
    .bayside_advantages > div > div > div:last-child {padding-right: 12px;}
}

@media only screen and (max-width: 800px) {
    .bayside_advantages > div {width: calc(50% - 8px); padding-top: 65%; margin-right: 12px; margin-top: 12px;}
    .bayside_advantages > div:nth-child(3n) {margin-right: 12px;}
    .bayside_advantages > div:nth-child(2n) {margin-right: 0;}
    .bayside_advantages > div > div {bottom: 10px;}
}

@media only screen and (max-width: 600px) {
    #bayside_advantages {margin-top: 32px;}
}

/* ------------------------ HOUSE VS APARTMENT ------------------------ */

#house_vs_apartment {margin-top: 40px; padding-bottom: 40px;}

.comparison_table {margin-top: 32px; width: 100%;}

/* -------------------------- LIFE COMICS -------------------------- */

#life_comics {
    margin-top: 0;
    padding: 28px 0 40px;
    background: linear-gradient(180deg, #f7f8f5 0%, #ffffff 100%);
}

#life_comics .block_name,
#life_comics h2 {padding-left: 0;}

.life_comics_lead {
    margin-top: 12px;
    max-width: 640px;
    color: #555966;
    font-size: 16px;
    line-height: 1.5;
}

.life_comics_legend {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 24px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.life_comics_legend_city,
.life_comics_legend_village {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
}

.life_comics_legend_city {
    background: #eef0f3;
    color: #5c6370;
}

.life_comics_legend_city::before {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #9aa3b2;
    flex-shrink: 0;
}

.life_comics_legend_village {
    background: #ecf4ee;
    color: #004B1E;
}

.life_comics_legend_village::before {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #5b6936;
    flex-shrink: 0;
}

.life_comics_legend_divider {
    flex: 1;
    min-width: 24px;
    max-width: 80px;
    height: 1px;
    background: linear-gradient(90deg, #c4c9d4, #5b6936);
}

.life_comics_viewport {
    overflow: hidden;
    border-radius: 20px;
    box-shadow: 0 12px 40px rgba(26, 34, 42, 0.12);
    background: #1a222a;
    touch-action: pan-y pinch-zoom;
}

.life_comics_track {
    display: flex;
    transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
}

.life_comics_slide {
    flex: 0 0 100%;
    min-width: 100%;
}

.life_comics_slide img {
    display: block;
    width: 100%;
    height: auto;
}

.life_comics_caption {
    margin: 16px 0 0;
    text-align: center;
    font-size: 15px;
    color: #1A222A;
    font-weight: 500;
    line-height: 1.45;
    min-height: 1.45em;
}

.life_comics_nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
}

.life_comics_arrow {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid #dbe0e8;
    background: #fff;
    color: #5b6936;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    line-height: 1;
    padding: 0 0 2px;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
    -webkit-tap-highlight-color: transparent;
}

.life_comics_arrow:hover:not(.disabled) {
    background: #5b6936;
    color: #fff;
    border-color: #5b6936;
}

.life_comics_arrow.disabled {
    opacity: 0.35;
    cursor: default;
    pointer-events: none;
}

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

.life_comics_dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #c4c9d4;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: width 0.2s, border-radius 0.2s, background 0.2s;
    -webkit-tap-highlight-color: transparent;
}

.life_comics_dot.active {
    width: 24px;
    border-radius: 4px;
    background: #5b6936;
}

@media only screen and (max-width: 600px) {
    #life_comics {
        margin-top: 0;
        padding: 24px 0 32px;
    }

    .life_comics_lead {font-size: 14px;}

    .life_comics_legend {
        margin-top: 16px;
        margin-bottom: 16px;
        gap: 10px;
    }

    .life_comics_legend_divider {display: none;}

    .life_comics_viewport {border-radius: 16px;}

    .life_comics_caption {
        font-size: 14px;
        padding: 0 4px;
    }

    .life_comics_nav {gap: 14px; margin-top: 16px;}

    .life_comics_arrow {
        width: 40px;
        height: 40px;
        font-size: 22px;
    }
}

.comparison_table table {
    width: 100%; border-collapse: collapse; background: #FFF; border-radius: 24px;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.04); overflow: hidden;
    table-layout: fixed;
}

.comparison_table thead {
    background: #5b6936;
}

.comparison_table th {
    padding: 24px; text-align: left; color: #FFF; font-size: 18px; font-weight: 700;
    line-height: 130%;
}

.comparison_table th:first-child {
    width: 30%; padding-left: 32px;
}

.comparison_table th.house_column {
    width: 35%; background: rgba(91, 105, 54, 0.9);
}

.comparison_table th.apartment_column {
    width: 35%; background: rgba(91, 105, 54, 0.8);
}

.comparison_table tbody tr {
    border-bottom: 1px solid #EFF1F6; transition: background 0.2s;
}

.comparison_table tbody tr:hover {
    background: #FAFBFC;
}

.comparison_table tbody tr:last-child {
    border-bottom: none;
}

.comparison_table td {
    padding: 24px; font-size: 16px; line-height: 150%; color: #1A222A;
    vertical-align: top;
}

.comparison_table td:first-child {
    padding-left: 32px; font-weight: 600; color: #1A222A;
}

.comparison_table td.house_column {
    color: #5b6936; font-weight: 500;
    background: rgba(91, 105, 54, 0.03);
}

.comparison_table td.apartment_column {
    color: #555966;
}

.comparison_table td strong {
    font-weight: 700; color: #1A222A;
}

/* Стили для строки с ценами */
.comparison_table tr.price-row {
    background: linear-gradient(135deg, rgba(91, 105, 54, 0.05) 0%, rgba(91, 105, 54, 0.02) 100%);
}

.comparison_table tr.price-row:hover {
    background: linear-gradient(135deg, rgba(91, 105, 54, 0.08) 0%, rgba(91, 105, 54, 0.04) 100%);
}

.comparison_table .price-cell-content {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
}

.comparison_table .price-value {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    color: #5b6936;
    display: block;
}

.comparison_table .price-unit {
    font-size: 14px;
    font-weight: 500;
    color: #6b7280;
    line-height: 1.4;
}

.comparison_table .price-description {
    font-size: 14px;
    font-weight: 400;
    color: #6b7280;
    line-height: 1.5;
    margin-top: 4px;
}

.comparison_table td.apartment_column .price-value {
    color: #555966;
}

@media only screen and (max-width: 1000px) {
    .comparison_table .price-value {
        font-size: 20px;
    }
    
    .comparison_table .price-unit,
    .comparison_table .price-description {
        font-size: 12px;
    }
}

@media only screen and (max-width: 1000px) {
    .comparison_table th {
        font-size: 16px; padding: 20px 16px;
    }
    
    .comparison_table th:first-child {
        padding-left: 24px;
    }
    
    .comparison_table td {
        font-size: 14px; padding: 20px 16px;
    }
    
    .comparison_table td:first-child {
        padding-left: 24px;
    }
}

@media only screen and (max-width: 800px) {
    .comparison_table {
        margin-top: 24px;
    }
    
    .comparison_table table {
        border-radius: 16px;
    }
    
    .comparison_table th {
        font-size: 14px; padding: 16px 12px;
    }
    
    .comparison_table th:first-child {
        padding-left: 16px;
    }
    
    .comparison_table td {
        font-size: 13px; padding: 16px 12px; line-height: 140%;
    }
    
    .comparison_table td:first-child {
        padding-left: 16px;
    }
}

@media only screen and (max-width: 600px) {
    #house_vs_apartment {
        margin-top: 32px; padding-bottom: 32px;
    }
    
    .comparison_table {
        margin-top: 20px;
    }
    
    .comparison_table table {
        border-radius: 12px;
        font-size: 12px;
    }
    
    .comparison_table th {
        font-size: 13px; 
        padding: 10px 6px;
        line-height: 120%;
    }
    
    .comparison_table th:first-child {
        display: none;
    }
    
    .comparison_table th.house_column,
    .comparison_table th.apartment_column {
        width: 50%;
    }
    
    .comparison_table td {
        font-size: 12px; 
        padding: 10px 6px;
        line-height: 140%;
    }
    
    .comparison_table td:first-child {
        display: none;
    }
    
    .comparison_table .price-value {
        font-size: 18px;
    }
    
    .comparison_table .price-unit,
    .comparison_table .price-description {
        font-size: 10px;
    }
}

@media only screen and (max-width: 400px) {
    .comparison_table table {
        font-size: 11px;
    }
    
    .comparison_table th {
        font-size: 12px; 
        padding: 8px 5px;
    }
    
    .comparison_table th:first-child {
        display: none;
    }
    
    .comparison_table th.house_column,
    .comparison_table th.apartment_column {
        width: 50%;
    }
    
    .comparison_table td {
        font-size: 11px; 
        padding: 8px 5px;
        line-height: 135%;
    }
    
    .comparison_table td:first-child {
        display: none;
    }
    
    .comparison_table .price-value {
        font-size: 16px;
    }
    
    .comparison_table .price-unit,
    .comparison_table .price-description {
        font-size: 9px;
    }
}

/* ------------------------ BAYSIDE INTERESTING ----------------------- */

#bayside_interesting {margin-top: 40px;}
#bayside_interesting .block_name,
#bayside_interesting h2 {padding-left: 0;}

.bayside_interesting {display: flex; flex-wrap: wrap; margin-top: 30px;}
.bayside_interesting > div {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.70) 100%); max-height: 520px; border-radius: 20px;
    overflow: hidden; margin-right: 24px; margin-bottom: 24px; position: relative; padding-top: 30%; width: calc(33.3% - 16px);
}
.bayside_interesting > div:last-child {width: calc(66.6% - 8px); margin-right: 0;}
.bayside_interesting > div:nth-child(3) {margin-right: 0;}
.bayside_interesting > div:nth-last-child(-n+2) {margin-bottom: 0;}
.bayside_interesting > div img {width: 100%; height: 100%; left: 0; top: 0; object-fit: cover; position: absolute; z-index: -1;}
.bayside_interesting > div > div {position: absolute; left: 24px; bottom: 24px; width: 100%;}
.bayside_interesting > div > div > div:first-child {
    width: 90%; color: #FFF; font-size: 24px; font-weight: 700;
}
.bayside_interesting > div > div > div:nth-of-type(2) {
    display: flex; align-items: center; margin-top: 12px; line-height: 20px; color: #FFF; font-size: 16px;
    font-weight: 400; letter-spacing: 0.32px;
}
.bayside_interesting > div > div > div:nth-of-type(2) .icon_car {font-size: 11px; margin-right: 8px;}
.bayside_interesting > div > div > div:nth-of-type(2) .icon_walking {font-size: 16px; margin-right: 8px; margin-top: -4px;}
.bayside_interesting > div > div > div:last-child {
    width: 90%; padding-top: 12px; color: #FFF; font-size: 16px; font-weight: 400; opacity: 0;
    max-height: 0; transition: all 0.8s ease-in-out;
}
.bayside_interesting > div:before {
    content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; opacity: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.7) 100%); transition: all 0.5s ease-in-out;
}

.bayside_interesting > div:hover:before {opacity: 1;}
.bayside_interesting > div:hover > div > div:last-child {opacity: 0.7; max-height: 300px;}

@media only screen and (max-width: 1000px) {
    .bayside_interesting > div > div > div:first-child {font-size: 14px;}
    .bayside_interesting > div > div > div:nth-of-type(2) {font-size: 14px;}
    .bayside_interesting > div > div > div:last-child {font-size: 14px;}
    .bayside_interesting > div > div {left: 12px; bottom: 12px;}
    .bayside_interesting > div {max-height: 300px;}
}

@media only screen and (max-width: 800px) {
    .bayside_interesting > div:nth-last-child(2) {margin-bottom: 12px;}
    .bayside_interesting > div {width: calc(50% - 6px); margin-right: 12px; margin-bottom: 12px;}
    .bayside_interesting > div:nth-child(3) {margin-right: 12px;}
    .bayside_interesting > div:nth-child(2n) {margin-right: 0;}
    .bayside_interesting > div:last-child {width: 100%; margin-bottom: 0;}
    .bayside_interesting > div > div > div:last-child {display: none;}
    .bayside_interesting > div:hover:before {opacity: 0;}
}

@media only screen and (max-width: 600px) {
    .bayside_interesting > div > div > div:nth-of-type(2) {margin-top: 9px;}
    .bayside_interesting {margin-top: 12px;}
    .bayside_interesting > div {margin-right: 12px; padding-top: 65%; margin-bottom: 12px; width: calc(50% - 6px);}
    .bayside_interesting > div:last-child {padding-top: 65%;}
    #bayside_interesting {margin-top: 32px;}
    .bayside_interesting > div > div {left: 12px; bottom: 16px;}
}

/* --------------------------------------------------------------------- */
/* ---------------------------- WOODSIDE  ------------------------------ */
/* --------------------------------------------------------------------- */

/* ------------------------ WOODSIDE ADVANTAGES ------------------------ */

#woodside_advantages {margin-top: 40px;}

.woodside_advantages {display: flex; flex-wrap: wrap;}
.woodside_advantages > div {
    position: relative; padding-top: 30%; border-radius: 12px; width: calc(33.3% - 16px); margin-right: 24px; margin-top: 24px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 50%, rgba(0, 0, 0, 0.70) 100%); overflow: hidden; max-height: 432px;
}
.woodside_advantages > div:nth-child(3n) {margin-right: 0;}
.woodside_advantages > div img {z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.woodside_advantages > div > div > div {color: #FFF; font-size: 24px; font-weight: 700;}
.woodside_advantages > div > div > div:last-child {
    width: 90%; padding-top: 16px; color: #FFF; font-size: 16px; margin-top: 0; font-weight: 400; opacity: 0; max-height: 0;
    transition: all 0.8s ease-in-out;
}
.woodside_advantages > div > div {position: absolute; bottom: 30px; left: 24px; width: calc(100% - 48px);}
.woodside_advantages > div:before {
    content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; opacity: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.7) 100%); transition: all 0.5s ease-in-out;
}

.woodside_advantages > div:hover:before {opacity: 1;}
.woodside_advantages > div:hover > div > div:last-child {display: block; opacity: 0.7; max-height: 200px;}

@media only screen and (max-width: 1000px) {
    .woodside_advantages > div:hover:before {opacity: 0;}
    .woodside_advantages > div:hover > div > div:last-child {opacity: 0; max-height: 0; margin-top: 0;}
    .woodside_advantages > div > div > div {font-size: 14px;}
    .woodside_advantages > div > div {bottom: 20px; left: 12px; width: calc(100% - 24px);}
}

@media only screen and (max-width: 800px) {
    .woodside_advantages > div {width: calc(50% - 8px); padding-top: 65%; margin-right: 12px; margin-top: 12px;}
    .woodside_advantages > div:nth-child(3n) {margin-right: 12px;}
    .woodside_advantages > div:nth-child(2n) {margin-right: 0;}
    .woodside_advantages > div > div {bottom: 10px;}
}

@media only screen and (max-width: 600px) {
    #woodside_advantages {margin-top: 32px;}
}

/* ----------------------- BAYSIDE DOCUMENTATION ----------------------- */

#woodside_docs {margin-top: 40px;}

.woodside_docs {margin-left: 24px; display: flex; flex-wrap: wrap; margin-top: 47px;}
.woodside_docs > a {
    width: calc(50% - 20px); height: 105px; margin-right: 20px; border-radius: 12px; background: #FFF;
    display: flex; align-items: center; padding: 26px 26px 26px 16px; margin-bottom: 20px;
}
.woodside_docs > a:nth-child(2n) {margin-right: 0; width: 50%;}
.woodside_docs > a:last-child {width: 100%; margin-right: 0;}

.woodside_docs > a > div:nth-of-type(1) {color: #5b6936; font-size: 40px; font-weight: 700;}
.woodside_docs > a > div:nth-of-type(2) {
    margin-left: 20px; color: #1A222A; width: 70%; font-size: 16px; font-weight: 400;
}
.woodside_docs > a > div:last-child {margin-left: auto;}
.woodside_docs > a > div:last-child > i {font-size: 22px;}

.woodside_docs_footer {display: flex; align-items: center; margin-top: 12px;}
.woodside_docs_footer > div:first-child {max-width: 500px; color: #9497A2; font-size: 14px; font-weight: 400;}
.woodside_docs_footer > div:first-child strong {color: #1A222A;}
.woodside_docs_footer .btn {margin-left: auto; max-width: 324px; height: 64px;}

@media only screen and (max-width: 1000px) {
    .woodside_docs {margin-left: 0;}
    .woodside_docs > a {margin-right: 0; width: 100%;}
    .woodside_docs > a:nth-child(2n) {margin-right: 0; width: 100%;}
    .woodside_docs > a:last-child {width: 100%; margin-right: 0;}
}

@media only screen and (max-width: 800px) {
    .woodside_docs_footer {flex-direction: column;}
    .woodside_docs_footer .btn {margin-right: auto; margin-top: 24px; width: 100%; max-width: 400px;}
}

@media only screen and (max-width: 600px) {
    .woodside_docs {margin-top: 12px;}
    .woodside_docs > a {align-items: center; height: auto; padding: 16px; margin-bottom: 12px;}
    .woodside_docs > a > div:nth-of-type(1) {font-size: 24px;}
    .woodside_docs > a > div:nth-of-type(2) {font-size: 14px;}
    .woodside_docs > a > div:last-child > i {font-size: 20px;}
    #woodside_docs {margin-top: 32px;}
}

/* ------------------------ WOODSIDE INTERESTING ----------------------- */

#woodside_interesting {margin-top: 40px;}

.woodside_interesting {display: flex; flex-wrap: wrap; margin-top: 56px;}
.woodside_interesting > div {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.70) 100%); max-height: 520px; border-radius: 20px;
    overflow: hidden; margin-right: 24px; margin-bottom: 20px; position: relative; padding-top: 30%; width: calc(33.3% - 16px);
}
.woodside_interesting > div:nth-of-type(3) {margin-right: 0;}
.woodside_interesting > div:last-child {margin-right: 0;}
.woodside_interesting > div img {width: 100%; height: 100%; left: 0; top: 0; object-fit: cover; position: absolute; z-index: -1;}
.woodside_interesting > div > div {position: absolute; left: 24px; bottom: 34px; width: 100%;}
.woodside_interesting > div > div > div:first-child {
    width: 90%; color: #FFF; font-size: 24px; font-weight: 700;
}
.woodside_interesting > div > div > div:nth-child(2) {
    display: flex; align-items: center; margin-top: 12px; line-height: 20px; color: #FFF;
    font-size: 16px; font-weight: 400; letter-spacing: 0.32px;
}
.woodside_interesting > div > div > div:nth-child(2) .icon_car {font-size: 11px; margin-right: 8px;}
.woodside_interesting > div > div > div:last-child {
    width: 90%; padding-top: 24px; color: #FFF; font-size: 16px; font-weight: 400; opacity: 0;
    max-height: 0; transition: all 0.8s ease-in-out;
}
.woodside_interesting > div:before {
    content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; opacity: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.7) 100%); transition: all 0.5s ease-in-out;
}

.woodside_interesting > div:hover:before {opacity: 1;}
.woodside_interesting > div:hover > div > div:last-child {opacity: 0.7; max-height: 600px;}

@media only screen and (max-width: 1400px) {
    .woodside_interesting > div > div > div:last-child {font-size: 14px;}
}

@media only screen and (max-width: 1200px) {
    .woodside_interesting > div > div > div:last-child {display: none;}
    .woodside_interesting > div:hover:before {opacity: 0;}
}

@media only screen and (max-width: 1000px) {
    .woodside_interesting > div > div > div:first-child {font-size: 14px;}
    .woodside_interesting > div > div > div:nth-child(2) {font-size: 14px;}
    .woodside_interesting > div > div > div:last-child {font-size: 14px;}
}

@media only screen and (max-width: 800px) {
    .woodside_interesting > div {width: calc(50% - 6px); margin-right: 12px; margin-bottom: 12px;}
    .woodside_interesting > div:nth-of-type(3) {margin-right: 12px;}
    .woodside_interesting > div:nth-child(2n) {margin-right: 0;}
}

@media only screen and (max-width: 600px) {
    .woodside_interesting {margin-top: 12px;}
    .woodside_interesting > div {margin-right: 12px; padding-top: 65%; margin-bottom: 12px; width: calc(50% - 6px);}
    #woodside_interesting {margin-top: 32px;}
    .woodside_interesting > div > div {left: 12px; bottom: 16px;}
}

/* ------------------------- INFRASTRUCTURE --------------------------- */

#tab_2 .slider_section > div:first-child, #tab_3 > div:first-child {display: flex; align-items: baseline; margin-bottom: 34px;}
#tab_2 .slider_section > div:first-child {padding-right: 32px;}
#tab_2 .slider_section > div:first-child > div:first-child, #tab_3 > div:first-child > div:first-child {
    margin-left: 9px; width: 30%; color: #160F0F; font-size: 24px; font-weight: 700; margin-right: 20px;
}
#tab_3 > div:first-child > div:last-child {color: #555966; width: 35%; font-size: 16px; font-weight: 400;}
#tab_2 .slider_section > div:first-child > div:last-child {
    color: #555966; width: 50%; font-size: 16px; font-weight: 400;
}
#tab_2 .slider_section {overflow: hidden; position: relative;}

.infrastructure {display: flex; margin-bottom: 54px; transition: all .5s ease-in-out; will-change: transform;}

.infrastructure > div {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 59.7%, rgba(0, 0, 0, 0.70) 100%); position: relative;
    overflow: hidden; min-width: 516px; height: 485px; border-radius: 20px;
    margin-right: 20px;
}
.infrastructure > div img {position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1;}

.infrastructure > div > div {position: absolute; bottom: 32px; left: 24px; width: 90%;}
.infrastructure > div > div > div:first-child {color: #FFF; font-size: 24px; font-weight: 700;}
.infrastructure > div > div >div:last-child {margin-top: 16px; color: #FFF; font-size: 16px; font-weight: 400;}

@media only screen and (max-width: 1000px) {
    .infrastructure > div {min-width: 314px; height: 282px;}
    .infrastructure > div > div > div:first-child {font-size: 20px;}
    .infrastructure > div > div > div:last-child {margin-top: 4px; font-size: 14px;}
    #tab_2 .slider_section > div:first-child, #tab_3 > div:first-child {flex-direction: column;}
    #tab_2 .slider_section > div:first-child > div:first-child, #tab_3 > div:first-child > div:first-child {margin-left: 0; width: 100%;}
    #tab_2 .slider_section > div:first-child > div:last-child, #tab_3 > div:first-child > div:last-child {width: 100%; margin-top: 12px;}
}

@media only screen and (max-width: 800px) {
    #tab_2 .slider_section > div:first-child, #tab_3 > div:first-child {margin-bottom: 16px;}
    #tab_2 .slider_section {overflow: hidden !important;}
    .infrastructure {margin-bottom: 16px; overflow: visible; position: relative;}
    .infrastructure > div {flex-shrink: 0; position: relative;}
    .infrastructure > div > div {bottom: 16px; left: 16px;}
    #tab_2 .slider_section > div:first-child > div:first-child, #tab_3 > div:first-child > div:first-child {font-size: 20px;}
    #tab_2 .slider_section > div:first-child > div:last-child, #tab_3 > div:first-child > div:last-child {font-size: 14px;}
}

@media only screen and (max-width: 600px) {
    #tab_2 .slider_section {overflow: hidden;}
    #tab_2 .slider_section > div:first-child {padding-right: 12px;}
}

/* ------------------------ PARTNERS SECTION ----------------------- */

#partners_section {margin-top: 80px; margin-bottom: 80px; overflow: hidden; position: relative;}
.partners_title {font-size: 32px; font-weight: 700; color: #1A222A; margin-bottom: 40px; text-align: center;}

.partners_slider {width: 100%; overflow: hidden; position: relative;}
.partners_track {display: flex; animation: partners-scroll 30s linear infinite; width: fit-content;}
.partners_slide {flex-shrink: 0; padding: 0 40px; display: flex; align-items: center; justify-content: center; opacity: 0.7; transition: opacity 0.3s ease;}
.partners_slide img {max-width: 200px; max-height: 80px; width: auto; height: auto; object-fit: contain; filter: grayscale(100%); transition: filter 0.3s ease;}
.partners_slide:hover {opacity: 1;}
.partners_slide:hover img {filter: grayscale(0%);}

@keyframes partners-scroll {
    0% {transform: translateX(0);}
    100% {transform: translateX(-50%);}
}

@media only screen and (max-width: 1000px) {
    #partners_section {margin-top: 60px; margin-bottom: 60px;}
    .partners_title {font-size: 28px; margin-bottom: 32px;}
    .partners_slide {padding: 0 30px;}
    .partners_slide img {max-width: 150px; max-height: 60px;}
}

@media only screen and (max-width: 600px) {
    #partners_section {margin-top: 40px; margin-bottom: 40px;}
    .partners_title {font-size: 24px; margin-bottom: 24px;}
    .partners_slide {padding: 0 20px;}
    .partners_slide img {max-width: 120px; max-height: 50px;}
}

/* ------------------------------- WAY -------------------------------- */

#tab_3 > div:last-child {display: flex;}
#tab_3 > div:last-child > div:first-child {
    width: 60%; max-height: 479px; min-height: 235px; border-radius: 20px; background: #FFF; padding: 9px; margin-right: 20px;
}
#tab_3 > div:last-child > div:first-child img {width: 100%; height: 100%; object-fit: cover; min-height: 225px; border-radius: 20px;}
#tab_3 > div:last-child > div:first-child > ymaps {width: 100%; border-radius: 20px;}
#tab_3 > div:last-child > div:last-child {border-radius: 20px; width: 40%; min-height: 100%; background: #FFF; padding: 44px;}

#tab_3 > div:last-child > div:last-child > div {display: flex; margin-bottom: 32px;}
#tab_3 > div:last-child > div:last-child > div:last-child {margin-bottom: 0;}
#tab_3 > div:last-child > div:last-child > div > div:first-child {
    margin-right: 16px; min-width: 48px; min-height: 48px; max-width: 48px; max-height: 48px; border-radius: 50%; line-height: 48px;
    text-align: center; background: #ECF9EF;
}
#tab_3 > div:last-child > div:last-child > div:first-child > div:first-child i {font-size: 14px;}
#tab_3 > div:last-child > div:last-child > div > div:last-child > div:first-child {
    color: #1A222A; font-size: 18px; font-weight: 700;
}
#tab_3 > div:last-child > div:last-child > div > div:last-child > div:nth-of-type(2) {
    color: #555966; font-size: 16px; font-weight: 400;
}
#tab_3 > div:last-child > div:last-child > div > div:last-child > a {font-size: 14px; font-weight: 500;}

@media only screen and (max-width: 1000px) {
    #tab_3 > div:last-child {flex-direction: column;}
    #tab_3 > div:last-child > div:first-child {width: 100%; margin-right: 0; margin-bottom: 10px;}
    #tab_3 > div:last-child > div:last-child {width: 100%;}
    #tab_3 > div:last-child > div:last-child {padding: 16px;}
    #tab_3 > div:last-child > div:last-child > div > div:last-child > div:first-child {font-size: 14px;}
    #tab_3 > div:last-child > div:last-child > div > div:last-child > div:nth-of-type(2) {font-size: 14px;}
}

/* ------------------------------- TAB -------------------------------- */

.tab {display: none !important; opacity: 0; transition: opacity 1s; margin-top: 0 !important; padding-top: 0 !important; margin-bottom: 0 !important;}
#tab_1.active {display: flex !important; opacity: 1; margin-top: 0 !important; padding-top: 0 !important; margin-bottom: 0 !important; flex-direction: column;}
#tab_2.active {display: block !important; opacity: 1; margin-top: 0 !important; margin-bottom: 0 !important;}
#tab_3.active {display: block !important; opacity: 1; margin-top: 0 !important; margin-bottom: 0 !important;}

@media only screen and (max-width: 1000px) {
    .tab {margin-top: 0 !important; padding-top: 0 !important; margin-bottom: 0 !important;}
    #tab_1.active {margin-top: 0 !important; padding-top: 0 !important; margin-bottom: 0 !important;}
}

/* ------------------------------- PLAN ------------------------------- */

#plan_section {padding-top: 100px; padding-bottom: 100px;}
#plan_section .container_primary {padding: 0 20px;}
.plan_section {overflow: inherit; position: relative;}

@media only screen and (max-width: 1000px) {
    #plan_section .container_primary {margin: 0 !important; padding: 0 !important;}
    #plan_left .container_primary {margin: 0 !important; padding: 0 !important;}
}
.plan_title {display: none;}

#plan_wrapper {width: 100%; display: block;}

#plan_right.woodside {border-radius: 0; padding: 0 0 0 20px; margin-bottom: 100px; overflow: unset;}
#plan_right.woodside #plan_block {min-height: 488px;}
#plan_right.woodside #plan_wrap {width: calc(100% - 230px); margin-left: 230px;}
#plan_right.woodside #menu_in_plan {
    padding: 20px 25px; display: flex; flex-direction: column; position: absolute; left: 0; width: 500px; border-radius: 20px;
    background: #5b6936; bottom: -80px; height: 100%;
}
#plan_right.woodside #menu_in_plan > a {
    display: flex; font-size: 12px; font-weight: 300; padding: 14px 0; color: #FFFFFF; position: relative; cursor: pointer;
    transition: .3s ease-in-out;
}
#plan_right.woodside #menu_in_plan > .prompt {font-size: 11px; font-weight: 300; line-height: 140%; letter-spacing: 0.28px; color: #FFFFFF; position: absolute; bottom: 20px; right: 35px;}
#plan_right.woodside #menu_in_plan > a i {margin-right: 20px; font-weight: 300; font-size: 18px; width: 20px;}
#plan_right.woodside #menu_in_plan > a:hover {padding-left: 10px;}
#plan_right.woodside #menu_in_plan > a::after {position: absolute; width: 180px; left: 0; bottom: 0; height: 1px; background: rgba(255, 255, 255, 0.20); content: "";}
#plan_right.woodside #menu_info {display: flex; position: absolute; bottom: -72px; left: 550px;}
#plan_right.woodside #menu_info > div {width: 140px;}
#plan_right.woodside #menu_info > div p {font-size: 38px; font-weight: 500; color: #1A222A; letter-spacing: 0.88px; line-height: 1.1;}
#plan_right.woodside #menu_info > div span {font-size: 14px; font-weight: 300; line-height: 140%; letter-spacing: 0.28px;}
#plan_right.woodside #zoom_block {display: none;}

#plan_left {width: 100%; padding-bottom: 10px;}

@media only screen and (max-width: 1000px) {
    #plan_left {padding-bottom: 0 !important; margin-bottom: 0 !important; padding-top: 0 !important; margin-top: 0 !important;}
}
#plan_left > .header_info_btn {
    margin: auto 0 0 0; height: 50px; line-height: 50px; width: 100%; padding: 0 10px; font-size: 14px;
    white-space: nowrap; max-width: 210px;
}
#plan_right {width: 100%; overflow: hidden; max-width: 1445px; margin-left: auto; margin-right: auto; position: relative; left: 0; right: 0;}

@media only screen and (max-width: 1000px) {
    #plan_right {margin: 0 !important; padding: 0 !important;}
    #plan_block {margin: 0 !important; padding: 0 !important;}
    #plan_wrap {margin: 0 !important; padding: 0 !important;}
    #plan_pan {margin: 0 !important; padding: 0 !important;}
    #genplan-container {margin: 0 !important; padding: 0 !important;}
}

.plan_menu {max-width: 1200px; margin-bottom: 22px;}
.plan_menu > a {
    border: 1px solid rgba(0, 0, 0, 0.3); line-height: 30px; font-size: 12px; padding: 0 14px; margin-right: 3px; border-radius: 18px; position: relative;
    left: -12px; margin-bottom: 10px; cursor: pointer; text-decoration: none; color: #333; display: inline-block;
    transition: all 0.35s ease-out;
}
.plan_menu > a:hover {color: #FFFFFF; background-color: #5b6936; border-color: #5b6936;}
.plan_menu > a.active, .plan_menu > a:hover.active {color: #FFFFFF; background-color: #5b6936; border-color: #5b6936;}

#block_small_responsive {display: none;}

@media only screen and (min-width: 1445px) {
    #plan_right {border-radius: 20px;}
}

@media only screen and (max-width: 1250px) {
    .plan_bg {z-index: -2000;}
}

@media only screen and (max-width: 1100px) {
    #plan_right.woodside #menu_in_plan > a {padding: 12px 0;}
    #plan_right.woodside #plan_block {min-height: 442px;}
}

@media only screen and (max-width: 1000px) {
    #plan_right.woodside {min-height: 0; margin-bottom: 0; padding: 0; overflow: hidden;}
    #plan_right.woodside #plan_block {min-height: 0;}
    #plan_right.woodside #plan_wrap {width: 100%; margin-left: 0;}
    #plan_right.woodside #menu_in_plan {display: none;}
    #plan_section {padding: 0 !important; margin: 0 !important; overflow: hidden;}
    .plan_section {padding: 0 !important; margin: 0 !important;}
    .plan_bg {bottom: -20px; width: 100%; top: 50px; border-radius: 0;}

    #plan_right {width: 100%; display: block; margin: 0 !important; padding: 0 !important;}
    #plan_block {margin: 0 !important; padding: 0 !important;}
    #plan_wrap {margin: 0 !important; padding: 0 !important;}
    #plan_pan {margin: 0 !important; padding: 0 !important;}
    #genplan-container {margin: 0 !important; padding: 0 !important;}
    .plan_menu {width: 100%; user-select: none; text-align: left; padding: 0 !important; margin: 0 !important;}
    .plan_menu a {
        display: inline-block; margin-right: 5px; border: 1px solid #84A7BD; padding: 2px 12px; border-radius: 22px;
        left: 0; margin-bottom: 10px !important; font-size: 11px;
    }
    .plan_menu .active {border: 1px solid #34A8E9;}
    #block_small_responsive {display: block;}
}

@media only screen and (max-width: 800px) {
    .plan_title {padding: 0 15px; margin-bottom: 20px; font-weight: 700; font-size: 22px; display: block;}
    .plan_menu a {margin-bottom: 30px;}
}

#plan_block {width: 100%; height: 100%; position: relative; display: block; z-index: 8; margin: 0; padding: 0;}
#plan_block.modal {width: calc(80% - 64px); height: auto; overflow: hidden;}
#plan_wrap {width: 100%; height: auto; position: relative; margin: 0; padding: 0;}
#block_plan {cursor: default; width: 100%; height: auto;}

/* Кнопка для мобильных устройств */
.genplan-mobile-button {
    display: none;
    padding: 20px;
    text-align: center;
    margin: 20px 0;
}

@media only screen and (max-width: 1000px) {
    /* Скрываем генплан на мобильных */
    #plan_block {display: none !important;}
    #plan_wrap {display: none !important;}
    #plan_pan {display: none !important;}
    #genplan-container {display: none !important;}
    
    /* Показываем кнопку на мобильных */
    .genplan-mobile-button {
        display: block !important;
        margin: 20px 0;
        padding: 20px 12px;
        width: auto;
        height: auto;
        overflow: visible;
        visibility: visible;
        position: relative;
        z-index: 1;
        pointer-events: auto;
    }
    
    .genplan-mobile-button .btn {
        width: 100%;
        max-width: 400px;
        margin: 0 auto;
        position: relative;
        z-index: 1;
        pointer-events: auto;
        touch-action: manipulation;
    }
}

/* Стили для десктопной версии */
@media only screen and (min-width: 1001px) {
    /* Скрываем кнопку на десктопе - полностью убираем из потока */
    .genplan-mobile-button {
        display: none !important;
        position: absolute;
        width: 0;
        height: 0;
        overflow: hidden;
        visibility: hidden;
        margin: 0;
        padding: 0;
    }
    
    /* Убеждаемся, что генплан виден на десктопе */
    #plan_block {
        display: block !important;
    }
    
    #plan_wrap {
        display: block !important;
    }
    
    #plan_pan {
        display: block !important;
    }
    
    #genplan-container {
        display: block !important;
    }
    
    /* Исправляем позиционирование на десктопе */
    #plan_right {
        width: 100%;
        overflow: hidden;
        max-width: 1445px;
        margin-left: auto;
        margin-right: auto;
        padding: 0;
        position: relative;
        left: 0;
        right: 0;
    }
    
    #plan_block {
        width: 100%;
        height: 100%;
        position: relative;
        display: block;
        z-index: 8;
        margin: 0;
        padding: 0;
        left: 0;
        right: 0;
    }
    
    #plan_wrap {
        width: 100%;
        height: auto;
        position: relative;
        margin: 0;
        padding: 0;
        left: 0;
        right: 0;
    }
    
    #plan_pan {
        width: 100%;
        min-width: 100%;
        height: 100vh;
        overflow: hidden;
        position: relative;
        margin: 0;
        padding: 0;
        left: 0;
        right: 0;
    }
    
    #genplan-container {
        width: 100%;
        height: 100vh;
        position: relative;
        display: block;
        margin: 0;
        padding: 0;
        left: 0;
        right: 0;
    }
}

/* Popup с генпланом */
.genplan-popup {
    display: none !important;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
}

.genplan-popup.active {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.genplan-popup-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(4px);
}

.genplan-popup-content {
    position: relative;
    width: 100%;
    height: 100%;
    background: white;
    display: flex;
    flex-direction: column;
    z-index: 10001;
}

.genplan-popup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    border-bottom: 1px solid #e0e0e0;
    background: white;
    flex-shrink: 0;
}

.genplan-popup-header h2 {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    color: #1A222A;
}

.genplan-popup-close {
    background: none;
    border: none;
    font-size: 32px;
    line-height: 1;
    color: #666;
    cursor: pointer;
    padding: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s;
}

.genplan-popup-close:hover {
    color: #000;
}

.genplan-popup-body {
    flex: 1;
    overflow: hidden;
    position: relative;
    width: 100%;
    height: calc(100% - 81px); /* Вычитаем высоту header */
    min-height: 0;
}

.genplan-popup-wrapper {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    touch-action: none;
    -webkit-overflow-scrolling: touch;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

#genplan-popup-container {
    width: 100%;
    height: 100%;
    position: relative;
    min-height: 0;
    transform-origin: center center;
    transition: transform 0.1s ease-out;
    will-change: transform;
}

#genplan-popup-container iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
    pointer-events: auto;
    touch-action: pan-x;
}

/* На мобильных устройствах отключаем переходы во время жестов для лучшей производительности */
@media only screen and (max-width: 1000px) {
    .genplan-popup-wrapper {
        touch-action: pan-x;
    }
    
    #genplan-popup-container {
        transition: none;
    }
}
#plan_pan {width: 100%; min-width: 100%; height: clamp(360px, 62vh, 720px); overflow: hidden; position: relative; margin: 0 !important; padding: 0 !important;}
#genplan-container {width: 100%; height: 100%; position: relative; display: block; margin: 0 !important; padding: 0 !important; touch-action: none; -webkit-user-select: none; user-select: none; will-change: transform;}
#genplan-container iframe {width: 100%; height: 100%; border: none; display: block; margin: 0; padding: 0; pointer-events: auto; touch-action: none; -webkit-user-select: none; user-select: none;}

@media only screen and (max-width: 1000px) {
    #plan_pan {height: clamp(320px, 56vh, 620px); margin: 0 !important; padding: 0 !important;}
    #genplan-container {height: 100%; margin: 0 !important; padding: 0 !important; touch-action: pan-x; -webkit-user-select: none; user-select: none;}
    #genplan-container iframe {touch-action: pan-x;}
}

@media only screen and (max-width: 600px) {
    #plan_pan {height: clamp(280px, 52vh, 520px); margin: 0 !important; padding: 0 !important;}
    #genplan-container {height: 100%; margin: 0 !important; padding: 0 !important; touch-action: pan-x; -webkit-user-select: none; user-select: none;}
    #genplan-container iframe {touch-action: pan-x;}
}

/*@media only screen and (max-height: 600px) {
    #plan_pan {@media (min-height: 100vh) {width: calc((100vh - 100px)*16/9); margin: 0 auto; height: calc(100vh - 100px); min-height: calc(60vw*9/16); min-width: 60vw;}}
}*/

@media only screen and (min-width: 1830px) {
    #block_plan {height: 100%; width: 100%;}
}

@media only screen and (max-width: 1080px) {
    #block_plan {width: 100%; border-radius: 0;}
    #plan_block {height: 100%; max-width: 100vw;}
}

@media only screen and (max-width: 1000px) {
    #block_plan {width: 100%; height: auto;}
    #plan_wrap {width: 100%; min-width: 100%; height: auto; overflow: hidden; touch-action: none; -webkit-user-select: none; user-select: none;}
}

@media only screen and (max-width: 800px) {
    #block_plan {width: 100%;}
    #plan_block.modal {width: 100%;}
}

.land-free {fill: rgba(91, 105, 54, 0); stroke: rgba(91, 105, 54, 0);}
.selected-free {fill: rgba(91, 105, 54, 0.4); stroke: rgba(91, 105, 54, 1);}
.land-occupied {fill: rgba(241, 193, 0, 0); stroke: rgba(241, 159, 0, 0);}
.number-occupied {fill: rgba(241, 193, 0, 1); stroke: #f19f00;}
.selected-occupied {fill: rgba(241, 193, 0, 0.5); stroke: rgba(241, 159, 0, 1);}
.land-sold {fill: rgba(255, 12, 28, 0); stroke: rgba(255, 58, 61, 0);}
.selected-sold {fill: rgba(150, 149, 153, 0.5); stroke: rgba(96, 100, 111, 1);}
.number-sold {fill: rgba(189, 189, 190, 1); stroke: rgba(129, 132, 138, 1);}

.info_block {
    position: absolute; background: #fff; padding: 10px; font-size: 14px; line-height: 16px; border-radius: 8px; opacity: 0;
    visibility: hidden; -webkit-transition: opacity .7s ease-in-out; transition: opacity .7s ease-in-out; user-select: none;
    max-width: calc(100% - 20px); max-height: calc(100% - 20px); overflow: auto; box-sizing: border-box;
    z-index: 1000;
}
.info_block.active {
    display: block;visibility: visible; opacity: 1; -webkit-transition: opacity .7s ease-in-out; transition: opacity .7s ease-in-out;
}

.info_block .title {color: #000; display: block; font-size: 14px; font-weight: 700; margin-bottom: 0;}
.info_block .text-grey {display: block; color: #828282; font-size: 12px;}
.info_block .cadastral-line {overflow-wrap: anywhere; word-break: break-all;}
.info_block .cadastral-line .cadastral-number {display: block; overflow-wrap: anywhere; word-break: break-all;}
.info_block .text-green {display: block; color: #5b6936; font-size: 14px; font-weight: 700; margin-top: 8px;}
.info_block .text-red {display: block; color: #ff3a3d; font-size: 14px; font-weight: 700; margin-top: 8px;}
.info_block .text-orange {display: block; color: #f19f00; font-size: 14px; font-weight: 700; margin-top: 8px;}

.info_block_button {
    display: block;
    width: 100%;
    margin-top: 10px;
    padding: 8px 16px;
    background: #5b6936;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    text-align: center;
    transition: background 0.3s ease;
}

.info_block_button:hover {
    background: #4a5630;
}

.info_block_photo {padding: 3px; border-radius: 9px; max-width: 130px;}
.info_block .photo {display: flex;}
.info_block .photo > img {display: flex; width: 100%; border-radius: 8px; overflow: hidden;}
.info_block_photo .title {max-width: 200px; padding: 7px 10px 5px 10px; font-weight: 400; line-height: 120%;}

#zoom_block {position: absolute; top: 20px; left: 1%; z-index: 100;}
#zoom_in, #zoom_out {cursor: pointer; width: 36px; height: 36px; display: block;}
#zoom_in {margin-bottom: 10px;}
#swipe_block {display: none; z-index: 999;}

@media only screen and (max-width: 1080px) {
    #plan_block_small {display: none;}
    #block_small_responsive {width: 100%; overflow: hidden; padding: 20px 15px 15px 15px;}
    #zoom_block {top: 10%; display: none;}
    #swipe_block {display: none; width: 48px; height: 48px; position: absolute; bottom: 10%; left: 50%; transform: translate(-50%, 0);}
}

@media only screen and (max-width: 800px) {
    #swipe_block {display: none;}
    .info_block {padding: 6px 8px; max-width: calc(100vw - 20px); max-height: calc(100vh - 20px);}
    .info_block .title {font-size: 10px; border-radius: 3px;}
    .info_block .text-green, .info_block .text-grey, .info_block .text-red, .info_block .text-orange {font-size: 10px; line-height: 120%;}
    .info_block .text-green, .info_block .text-red, .info_block .text-orange {margin-top: 4px;}
    .text-grey {margin-bottom: 8px;}
    .info_block_photo {padding: 1px; border-radius: 3px;}
    .info_block .photo > img {max-width: 90px; border-radius: 2px; overflow: hidden;}
    .info_block_photo .title {padding: 3px 6px 3px 6px; max-width: 90px; font-size: 10px; line-height: 120%;}
}

@media only screen and (max-width: 420px) {
    #zoom_block {top: 25px; right: 25px; left: auto;}
    #swipe_block {bottom: 20px;}
    #zoom_in, #zoom_out {width: 46px; height: 46px;}
    #zoom_in {margin-bottom: 14px;}
}

/* ------------------------------- MODAL ------------------------------- */

#modal {
    position: fixed; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; overflow: hidden; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(10px);
    display: none; opacity: 0; filter: alpha(opacity=0); background: rgba(4, 7, 15, 0.90); z-index: 1000;
}
#modal.active {display: block; opacity: 1; filter: alpha(opacity=100);}

#modal_container {overflow-y: auto; -webkit-overflow-scrolling: touch; z-index: 1001; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; text-align: left; direction: ltr; position: fixed;}
#modal_overlay {position: absolute; width: 100%; min-height: 100%; left: 0; top: 0; display: flex; align-items: center; justify-content: center; padding: 20px; box-sizing: border-box;}

#modal_content {position: relative; height: auto; margin: 20px auto;}

@media only screen and (max-width: 800px) {
    #modal_content {margin: 0; border-radius: 0; width: 100% !important;}
}

/* --------------------------- VIDEO PLAYER --------------------------- */

#video_modal {width: 100%; opacity: 1; pointer-events: auto; transition: all 0.35s ease-out;}

#video_modal.fullscreen .video_modal_menu {display: none;}
#video_modal.fullscreen .video_modal_body {height: 100vh; width: 100vw; position: absolute; top: 0;}
#video_modal.fullscreen .video_main {border-radius: 0; height: 100%; width: 100%; max-width: unset; max-height: unset;}

.video_modal_menu {height: 54px; position: absolute; display: flex; right: 0; top: 0; align-items: center; padding: 0 20px;}
.video_modal_menu > div:first-child {width: max-content; position: absolute; line-height: 54px; right: 63px; color: #FFF; font-size: 16px; font-weight: 500;}
.video_modal_menu > div > i {padding: 10px; font-size: 14px; color: #fff; position: absolute; top: 9px; right: 14px; opacity: 0.5; cursor: pointer; transition: all 0.35s ease-out;}
.video_modal_menu > div > i:hover {opacity: 1;}

.video_modal_body {height: calc(100vh - 100px); width: 100%; display: flex; -webkit-justify-content: center; align-items: center;}
.video_main {position: relative; max-width: 1140px; max-height: 680px; border-radius: 20px; overflow: hidden;}
.video_main > video {object-fit: cover; width: 100%; height: 100%;}

.video_controls_footer_mobile {display: none; color: #FFFFFF; font-size: 20px;}
.video_controls {color: #FFFFFF; font-size: 16px; position: absolute; bottom: 0; left: 0; padding: 16px 40px; height: auto; width: 100%;}
.video_controls::after {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(8, 9, 13, 0.00) 0%, rgba(8, 9, 13, 0.90) 80.37%);}

.video_controls_header {z-index: 2; position: relative; display: flex; margin-bottom: 16px;}
.video_time {margin-left: auto;}

.video_controls_progress {z-index: 2; position: relative; cursor: pointer; width: 100%; height: 3px; border-radius: 20px; background: #D9D9D966; transition: all .1s ease-in-out; margin-bottom: 16px;}
.video_progress {height: 100%; border-radius: 20px; background: #FFFFFF;}

.video_controls_footer {z-index: 2; position: relative; display: flex;}
.video_controls_footer > div {width: 48px; height: 48px; padding: 12px;}
.video_controls_footer > div.disabled {display: none;}
.video_controls_footer i, .video_controls_footer_mobile i {cursor: pointer; width: 24px; line-height: 24px; text-align: center; transition: all .3s ease-in-out;}
.video_controls_footer i:hover, .video_controls_footer_mobile i:hover {text-shadow: 0 0 10px #fff;}
.video_volume {margin-left: auto; display: none;}
.video_controls_footer > div:last-child {margin-left: auto;}

@media only screen and (max-width: 1000px) {
    .video_main {width: 90%;}
}

@media only screen and (max-width: 600px) {
    .video_controls {padding: 48px 32px 24px 32px;}
    .video_controls_progress {margin-bottom: 0;}
    .video_controls_footer {display: none;}
    .video_controls_footer_mobile {display: block;}
    .video_pause {
        position: absolute; transition: .5s ease-in-out; top: calc(50% - 29px); left: calc(50% - 29px);
        background: url(../images/video_control_place.svg) center / cover no-repeat; border-radius: 50%; text-align: center;
        width: 58px; height: 58px; line-height: 58px; box-shadow: -0.73px 0.73px 0.73px -1.46px rgba(255, 255, 255, 0.35) inset;
        backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    }
    .video_next_time {
        display: none; font-size: 16px; position: absolute; top: calc(50% - 16px); right: calc(50% - 80px);
        background: url(../images/video_control_place.svg) center / cover no-repeat; border-radius: 50%; text-align: center;
        width: 32px; height: 32px; line-height: 32px; box-shadow: -0.73px 0.73px 0.73px -1.46px rgba(255, 255, 255, 0.35) inset;
        backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    }
    .video_prev_time {
        display: none; font-size: 16px; position: absolute; top: calc(50% - 16px); left: calc(50% - 80px);
        background: url(../images/video_control_place.svg) center / cover no-repeat; border-radius: 50%; text-align: center;
        width: 32px; height: 32px; line-height: 32px; box-shadow: -0.73px 0.73px 0.73px -1.46px rgba(255, 255, 255, 0.35) inset;
        backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    }
    .video_fullscreen {
        position: absolute; transition: .5s ease-in-out; top: 12px; right: 12px; border-radius: 50%; line-height: 48px;
        background: url(../images/video_control_place.svg) center / cover no-repeat; text-align: center; width: 48px; height: 48px;
        box-shadow: -0.73px 0.73px 0.73px -1.46px rgba(255, 255, 255, 0.35) inset; backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
    #video_modal.fullscreen .video_main {background: #000000;}
    #video_modal.fullscreen .video_main > video {object-fit: scale-down;}
    .video_main {width: 100%; height: auto; margin: 0 12px;}
    #video_modal.fullscreen .video_main {margin: 0;}
}

/* ---------------------------- REELS MODAL ---------------------------- */

#reels_modal {padding: 0 15px; width: 100vw; max-width: 1500px; margin: 0 auto;}

.progress_reels {position: relative; margin: 0 auto 5px auto; overflow: hidden; width: 100%; height: 4px; border-radius: 20px; background: #7C7878;}
.progress_reels_value {position: absolute; left: 0; top: 0; height: 100%; border-radius: 20px; background: #FFF;}

.reels_modal_item {opacity: .75; max-height: 80vh; width: 33.3vw; height: calc(33.3vw * 16 / 9); transition: padding .3s;}
.reels_modal_item > div {width: 100%; height: 100%; display: flex; align-items: center;}
.reels_modal_item > div > div:last-child {max-height: 80vh; height: 75%; margin-left: auto; margin-right: auto; border-radius: 8px; overflow: hidden;}
.reels_modal_item video {width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 2;}
.reels_modal_item .reels_video_poster {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; pointer-events: none;}

.reels_modal_item.is-selected {display: flex; align-items: center; opacity: 1; padding: 0 !important; margin: 0 !important; flex-direction: column;}
.reels_modal_item.is-selected > div {max-height: 80vh; width: auto; flex-direction: column; }
.reels_modal_item.is-selected > div > div:last-child {margin-right: auto; background: #000000; height: calc(100% - 10px) !important;}
.reels_modal_item.is-selected ~ .reels_modal_item > div > div:last-child {margin-left: auto; margin-right: auto;}

#reels_modal .flickity-prev-next-button {background: #BCC0C6; border-radius: 50%; width: 24px; height: 24px;}
.flickity-prev-next-button .flickity-button-icon {left: 25%; width: 50%;}
#reels_modal .flickity-prev-next-button.next {right: 31%;}
#reels_modal .flickity-prev-next-button.previous {left: 31%;}

.modal_reels_close {
    position: absolute; top: 20px; right: 20px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    user-select: none; z-index: 10; padding: 10px;
}

.modal_reels_close i {font-size: 14px; color: #fff; opacity: 0.5; transition: all 0.35s ease-out;}
.modal_reels_close:hover > i {opacity: 1;}

@media only screen and (max-width: 800px) {
    #reels_modal {width: 60vw;}
    .reels_modal_item {width: calc(60vw - 30px); height: calc((60vw - 30px) * 16 / 9);}
    #reels_modal .flickity-button {display: none;}
}

@media only screen and (max-width: 600px) {
    #reels_modal {width: 100vw;}
    .reels_modal_item {width: calc(100vw - 30px); height: calc((100vw - 30px) * 16 / 9);}
}

/* ------------------------------- REELS ------------------------------- */

#reels_section {margin-top: 40px;}

@media only screen and (max-width: 1000px) {
    #reels_section {margin: 0 !important; padding: 0 !important;}
}

@media only screen and (max-width: 600px) {
    #reels_section {margin: 0 !important; padding: 0 !important;}
}

.reels_group {padding-left: 24px; position: relative; left: -10px; right: -10px; width: calc(100% + 20px);}
.reels_wrap {width: 100%; display: flex; align-items: center; flex-wrap: wrap;}

.reels_title {padding: 0; margin-bottom: 6px;}
.reels_title > div:first-child {font-size: 32px; font-weight: 700;}
.reels_title > div:last-child {cursor: pointer; font-size: 16px; font-weight: 500; display: flex; align-items: center; color: #5b6936;}
.reels_title > div:last-child i {font-size: 15px; position: relative; left: 5px; height: 9px; overflow: hidden;}
.reels_title > div:last-child i::before {top: -5px; position: relative;}

.reels_wrap > div:last-child {width: calc(100% - 200px); margin-left: auto; overflow-x: hidden; padding-top: 15px;}

#reels_items {width: 100%; margin-left: auto; display: flex; transition: .5s ease-in-out;}

.new_video {
    width: 90px; height: 31px; border-radius: 8px; border: 2px solid #FFF; background: #5b6936; color: #FFF; text-align: center;
    padding: 5px 0; position: absolute; right: -10px; top: -15px;
}

.reels_item {min-width: calc(20% - 16px); margin-right: 20px; position: relative; cursor: auto;}
.reels_item img {position: absolute; width: 60px; height: 41px; top: calc(50% - 30px); left: calc(50% - 30px);}
.reels_item > div {width: 100%; padding-top: 177.7%; transition: .3s; border-radius: 8px; cursor: pointer; box-shadow: inset 0 0 1000px 1000px rgba(0, 0, 0, 0.2);}
.reels_item > div:hover {box-shadow: inset 0 0 1000px 1000px rgba(0, 0, 0, 0.1);}

.reels_item.bayside:nth-of-type(1) > div {background: url(../images/reels/bayside/reels_1.png) center center / cover no-repeat;}
.reels_item.bayside:nth-of-type(2) > div {background: url(../images/reels/bayside/reels_2.png) center center / cover no-repeat;}
.reels_item.bayside:nth-of-type(3) > div {background: url(../images/reels/bayside/reels_3.png) center center / cover no-repeat;}
.reels_item.bayside:nth-of-type(4) > div {background: url(../images/reels/bayside/reels_4.png) center center / cover no-repeat;}
.reels_item.bayside:nth-of-type(5) > div {background: url(../images/reels/bayside/reels_5.png) center center / cover no-repeat;}
.reels_item.bayside:nth-of-type(6) > div {background: url(../images/reels/bayside/reels_6.png) center center / cover no-repeat;}
.reels_item.bayside:nth-of-type(7) > div {background: url(../images/reels/bayside/reels_7.png) center center / cover no-repeat;}
.reels_item.bayside:nth-of-type(8) > div {background: url(../images/reels/bayside/reels_8.png) center center / cover no-repeat;}

.reels_item.woodside:nth-of-type(1) > div {background: url(../images/reels/woodside/reels_2.jpg) 0 / cover no-repeat;}
.reels_item.woodside:nth-of-type(2) > div {background: url(../images/reels/woodside/reels_3.jpg) 0 / cover no-repeat;}
.reels_item.woodside:nth-of-type(3) > div {background: url(../images/reels/woodside/reels_4.jpg) 0 / cover no-repeat;}
.reels_item.woodside:nth-of-type(4) > div {background: url(../images/reels/woodside/reels_6.jpg) 0 / cover no-repeat;}
.reels_item.woodside:nth-of-type(5) > div {background: url(../images/reels/woodside/reels_7.jpg) 0 / cover no-repeat;}
.reels_item.woodside:nth-of-type(6) > div {background: url(../images/reels/woodside/reels_8.jpg) 0 / cover no-repeat;}
.reels_item.woodside:nth-of-type(7) > div {background: url(../images/reels/woodside/reels_9.jpg) 0 / cover no-repeat;}
.reels_item.woodside:nth-of-type(8) > div {background: url(../images/reels/woodside/reels_10.jpg) 0 / cover no-repeat;}

@media only screen and (max-width: 1000px) {
    .reels_item > div {border-radius: 4px;}
    .reels_group {padding-left: 0;}
}

@media only screen and (max-width: 800px) {
    .reels_group {padding-left: 0; left: 0; right: 0; width: 100%;}
    .reels_wrap {flex-direction: column; align-items: normal;}
    .reels_wrap > div:last-child {margin-left: 0; width: 100%;}
    .reels_item {min-width: calc(33.3% - 15px);}
    #reels_section {margin-bottom: 25px; margin-top: 16px;}
    .reels_item {width: 33.3%;}
    .reels_title {margin-bottom: 20px; display: flex; padding: 0 10px 0 0}
    .reels_title > div:first-child {margin-right: auto; font-size: 24px;}
    .reels_title > div:last-child {font-size: 14px;}
    .reels_title > div:last-child i {display: none;}
    .reels_item img {width: 30px; height: 20px; top: calc(50% - 15px); left: calc(50% - 15px);}
}

/* -------------------------------- VIDEOS --------------------------------- */

#videos {margin-top: 112px;}

.videos {display: flex; margin-top: 32px;}
.video_item .video_background {width: 100%; height: 100%; object-fit: cover; border-radius: 20px; position: relative;}
.videos .video_item {overflow: hidden; width: 50%; position: relative;}
.video_item.bayside {margin-right: 20px;}

.videos .video_item .background {top: 0; left: 0; position: absolute; border-radius: 20px; width: 100%; height: 100%; object-position: center; object-fit: cover; transition: background-size .5s ease-in-out; cursor: pointer;}
.video_item.bayside .background {background: url(../images/settlements/bayside/about.jpg?2) no-repeat center; background-size: 120% auto !important; }
.video_item.woodside .background {background: url(../images/settlements/woodside/about.jpg) no-repeat center; background-size: 120% auto !important; }


@media only screen and (max-width: 600px) {
    #videos {margin-top: 32px;}
    .videos {margin-top: 12px; flex-direction: column;}
    .videos .video_item {width: 100%;}
    .video_item.bayside {margin-right: 0; margin-bottom: 12px;}
}

/* -------------------------------- ERROR --------------------------------- */

#main_404 {margin-top: 40px;}

.main_404 {display: flex; align-items: center;}
.main_404 > div:first-child {max-width: 386px; width: 100%;}
.main_404 > div:last-child {max-width: 762px; width: 100%; margin-left: auto;}
.main_404 > div:last-child > img {width: 100%;}
.main_404 .block_name {font-size: 20px; text-transform: none;}
.main_404 h2 {font-size: 48px; padding-top: 30px;}
.main_404 .desc {font-size: 20px; color: #1A222A; padding-left: 24px; margin: 30px 0;}
.main_404 .btn {height: 52px; line-height: 52px; margin-left: 24px;}

@media only screen and (max-width: 1000px) {
    .main_404 .desc {padding-left: 0;}
    .main_404 .btn {margin-left: 0;}
    .main_404 {flex-direction: column-reverse; align-items: normal;}
    .main_404 > div:last-child {margin-left: 0;}
    .main_404 > div:first-child {margin-top: 30px;}
}

@media only screen and (max-width: 600px) {
    #main_404 {margin-top: 20px;}
    .main_404 .block_name {font-size: 12px;}
    .main_404 h2 {font-size: 24px; padding-top: 10px;}
    .main_404 .desc {font-size: 14px; margin: 16px 0;}
    .main_404 .btn {height: 42px; line-height: 42px; font-size: 14px;}
}

/* --------------------------- PRELOADER SITES ---------------------------- */

#circular {position: relative; width: 39px; height: 39px; margin: auto;}

.circular {
    position: absolute; background-color: rgb(148,151,162); width: 9px; height: 9px; border-radius: 6px;
    -o-border-radius: 6px; -ms-border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px;
    animation-name: bounce_circular; -o-animation-name: bounce_circular; -ms-animation-name: bounce_circular; -webkit-animation-name: bounce_circular; -moz-animation-name: bounce_circular;
    animation-duration: 0.96s; -o-animation-duration: 0.96s; -ms-animation-duration: 0.96s; -webkit-animation-duration: 0.96s; -moz-animation-duration: 0.96s;
    animation-iteration-count: infinite; -o-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite;
    animation-direction: normal; -o-animation-direction: normal; -ms-animation-direction: normal; -webkit-animation-direction: normal; -moz-animation-direction: normal;
}

#circular_1 {
    left: 0; top: 16px; animation-delay: 0.36s; -o-animation-delay: 0.36s; -ms-animation-delay: 0.36s;
    -webkit-animation-delay: 0.36s; -moz-animation-delay: 0.36s;
}

#circular_2 {
    left: 4px; top: 4px; animation-delay: 0.48s; -o-animation-delay: 0.48s; -ms-animation-delay: 0.48s;
    -webkit-animation-delay: 0.48s; -moz-animation-delay: 0.48s;
}

#circular_3 {
    top: 0; left: 16px; animation-delay: 0.6s; -o-animation-delay: 0.6s; -ms-animation-delay: 0.6s;
    -webkit-animation-delay: 0.6s; -moz-animation-delay: 0.6s;
}

#circular_4 {
    right: 4px; top: 4px; animation-delay: 0.72s; -o-animation-delay: 0.72s; -ms-animation-delay: 0.72s;
    -webkit-animation-delay: 0.72s; -moz-animation-delay: 0.72s;
}

#circular_5 {
    right: 0; top: 16px; animation-delay: 0.84s; -o-animation-delay: 0.84s; -ms-animation-delay: 0.84s;
    -webkit-animation-delay: 0.84s; -moz-animation-delay: 0.84s;
}

#circular_6 {
    right: 4px; bottom: 4px; animation-delay: 0.96s; -o-animation-delay: 0.96s; -ms-animation-delay: 0.96s;
    -webkit-animation-delay: 0.96s; -moz-animation-delay: 0.96s;
}

#circular_7 {
    left: 16px; bottom: 0; animation-delay: 1.08s; -o-animation-delay: 1.08s; -ms-animation-delay: 1.08s;
    -webkit-animation-delay: 1.08s; -moz-animation-delay: 1.08s;
}

#circular_8 {
    left: 4px; bottom: 4px; animation-delay: 1.2s; -o-animation-delay: 1.2s; -ms-animation-delay: 1.2s;
    -webkit-animation-delay: 1.2s; -moz-animation-delay: 1.2s;
}

@keyframes bounce_circular{
    0% {transform: scale(1);}
    100% {transform: scale(.3);}
}

@-o-keyframes bounce_circular {
    0% {-o-transform: scale(1);}
    100% {-o-transform: scale(.3);}
}

@-ms-keyframes bounce_circular {
    0% {-ms-transform: scale(1);}
    100% {-ms-transform: scale(.3);}
}

@-webkit-keyframes bounce_circular {
    0% {-webkit-transform: scale(1);}
    100% {-webkit-transform: scale(.3);}
}

@-moz-keyframes bounce_circular {
    0% {-moz-transform: scale(1);}
    100% {-moz-transform: scale(.3);}
}

/* ------------------------------- FLICKITY ------------------------------- */

.flickity-enabled {position: relative;}
.flickity-enabled:focus {outline: none;}

.flickity-viewport {overflow: clip; overflow-y: visible; position: relative; height: 100%;}
.flickity-slider {position: absolute; width: 100%; height: 100%;}

/* draggable */

.flickity-enabled.is-draggable {-webkit-tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.flickity-enabled.is-draggable .flickity-viewport {cursor: move; cursor: -webkit-grab; cursor: grab;}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {cursor: -webkit-grabbing; cursor: grabbing;}

/* flickity-button */

.flickity-button {position: absolute; background: hsla(0, 0%, 100%, 0.75); border: none; color: #333;}
.flickity-button:hover {background: white; cursor: pointer;}
.flickity-button:focus {outline: none;}
.flickity-button:active {opacity: 0.6;}
.flickity-button:disabled {opacity: 0; cursor: auto; pointer-events: none;}

.flickity-button-icon {fill: currentColor;}

/* previous/next buttons */

.flickity-prev-next-button {width: 25px; height: 25px; top: 50%; transform: translateY(-50%); background: transparent;}
.flickity-prev-next-button:hover {background: transparent;}
.flickity-prev-next-button:focus {outline: none !important;}
.flickity-prev-next-button .arrow {fill: #777;}
.flickity-prev-next-button.no-svg {color: #777;}
.flickity-prev-next-button.previous {left: -25px;}
.flickity-prev-next-button.next {right: -25px;}

/* right to left */

.flickity-rtl .flickity-prev-next-button.previous {left: auto; right: 10px;}
.flickity-rtl .flickity-prev-next-button.next { right: auto; left: 10px;}
.flickity-prev-next-button .flickity-button-icon {position: absolute; left: 20%; top: 20%; width: 60%; height: 60%;}

/* page dots */

.flickity-page-dots {
    position: absolute; width: 100%; bottom: -25px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1;
}
.flickity-rtl .flickity-page-dots {direction: rtl;}
.flickity-page-dots .dot {
    display: inline-block; width: 10px; height: 10px; margin: 0 8px; background: #333; border-radius: 50%; opacity: 0.25;
    cursor: pointer;
}
.flickity-page-dots .dot.is-selected {opacity: 1;}

@media (max-width: 800px) {
    .flickity-prev-next-button.previous {left: calc(50% - 50px); top: 100%; margin-top: 20px;}
    .flickity-prev-next-button.next {left: calc(50% + 25px); top: 100%; margin-top: 20px;}
}

@media (max-width: 600px) {
    .flickity-prev-next-button.previous, .flickity-prev-next-button.next {margin-top: 40px;}
}

/* ------------------------------- SCROLL ------------------------------- */

html.has-scroll-smooth {overflow: hidden;}
html.has-scroll-dragging {-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.has-scroll-smooth body {overflow: hidden;}
.has-scroll-smooth [data-scroll-container] {min-height: 100vh;}
/* Отключаем блокировку скролла если LocomotiveScroll не активен */
html:not(.has-scroll-smooth) {overflow-x: hidden !important; overflow-y: visible !important;}
html:not(.has-scroll-smooth) body {overflow-x: hidden !important; overflow-y: auto !important;}
[data-scroll-direction="horizontal"] [data-scroll-container] {height: 100vh; display: inline-block; white-space: nowrap;}
[data-scroll-direction="horizontal"] [data-scroll-section] {
    display: inline-block; vertical-align: top; white-space: nowrap; height: 100%;
}
.c-scrollbar {
    position: absolute; right: 0; top: 0; width: 11px; height: 100vh; transform-origin: center right;
    transition: transform 0.3s, opacity 0.3s; opacity: 0; z-index: 99999;
}
.c-scrollbar:hover {transform: scaleX(1);}
.c-scrollbar:hover, .has-scroll-scrolling .c-scrollbar, .has-scroll-dragging .c-scrollbar {opacity: 1;}
[data-scroll-direction="horizontal"] .c-scrollbar {width: 100%; height: 10px; top: auto; bottom: 0; transform: scaleY(1);}
[data-scroll-direction="horizontal"] .c-scrollbar:hover {transform: scaleY(1.3); }
.c-scrollbar_thumb {
    position: absolute; top: 0; right: 0; background-color: rgba(0, 0, 0, 0.4); width: 7px;
    border-radius: 10px; margin: 2px; cursor: grab;
}
.has-scroll-dragging .c-scrollbar_thumb {cursor: grabbing;}
[data-scroll-direction="horizontal"] .c-scrollbar_thumb {right: auto; bottom: 0;}

.is-inview {opacity: 1 !important; transform: none !important;}
.anim_text {transform: translateY(70px); opacity: 0; transition: 1s ease-in-out;}
.split-parent {overflow: hidden;}
.split-child {display: inline-block; top: -3px;}

@media (max-width: 1024px) {
    .anim_text {transform: none; opacity: 1;}
}

html.lenis{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
.lenis.lenis-scrolling iframe{pointer-events:none}

/* ----------------- YMAPS -------------- */

.ymaps_site_baloon {display: flex; align-items: center; font-family: "SF Pro", sans-serif; font-size: 18px; font-weight: 600; color: #FFF; line-height: 130%;}
.ymaps_site_baloon img {width: 30px !important; object-fit: none !important; height: auto !important; min-height: 0 !important; border-radius: 0 !important; margin-right: 12px !important;}
.ymaps-2-1-79-balloon__tail {display: none !important;}
.ymaps-2-1-79-balloon {box-shadow: none !important;}
.ymaps-2-1-79-balloon__layout {background: none !important;}
.ymaps-2-1-79-gototech {display: none!important;}
.ymaps-2-1-79-balloon__content {display: flex !important; align-items: center !important; padding: 0 12px !important; max-width: 130px !important; height: 48px !important; border-radius: 12px !important; background: #5b6936 !important;}

/* ------------------------------- MESSENGERS FLOATING BUTTON ------------------------------- */

#floating_actions{
    position: fixed;
    right: 24px;
    bottom: 24px;
    display: flex;
    gap: 14px;
    align-items: flex-end;
    z-index: 999;
    animation: messengers-appear 0.5s ease-out 1s both, messengers-float 3s ease-in-out infinite 1.5s;
}

#messengers_float_btn {
    width: 70px;
    height: 70px;
    background: #5b6936;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(91, 105, 54, 0.5), 0 0 0 0 rgba(91, 105, 54, 0.7);
    transition: all 0.3s ease;
    animation: messengers-pulse 2s infinite 1.5s;
    overflow: visible;
    user-select: none;
}

#messengers_float_btn:hover {
    background: #4a5630;
    transform: translateY(-8px) scale(1.15);
    box-shadow: 0 8px 24px rgba(91, 105, 54, 0.6), 0 0 0 8px rgba(91, 105, 54, 0.1);
    animation: none;
}

#messengers_float_btn:hover i {
    animation: none;
    transform: scale(1.2);
}

#messengers_float_btn:active {
    transform: scale(1.05);
    transition: all 0.1s ease;
}

#messengers_float_btn i {
    font-size: 32px;
    color: #FFF;
    animation: messengers-icon-bounce 2s ease-in-out infinite;
}

/* legacy badge (unused) */

/* ------------------------------- QUIZ FLOATING BUTTON ------------------------------- */

#quiz_float_btn{
    width: 70px;
    height: 70px;
    background: #5b6936;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(91, 105, 54, 0.5), 0 0 0 0 rgba(91, 105, 54, 0.7);
    transition: all 0.3s ease;
    animation: messengers-pulse 2s infinite 1.6s;
}

#quiz_float_btn:hover{
    background: #4a5630;
    transform: translateY(-8px) scale(1.15);
    box-shadow: 0 8px 24px rgba(91, 105, 54, 0.6), 0 0 0 8px rgba(91, 105, 54, 0.1);
    animation: none;
}

#quiz_float_btn:active{
    transform: scale(1.05);
    transition: all 0.1s ease;
}

#quiz_float_btn .quiz_float_icon{
    color: #FFF;
    width: 28px;
    height: 28px;
}

@media only screen and (max-width: 600px) {
    #floating_actions{
        right: 18px;
        bottom: 18px;
        gap: 12px;
        animation: none;
        transform: none;
    }
    #quiz_float_btn{
        width: 62px;
        height: 62px;
        animation: none;
        transform: none;
    }
    #messengers_float_btn{
        width: 62px;
        height: 62px;
        animation: none;
        transform: none;
    }
    #quiz_float_btn .quiz_float_icon{
        width: 26px;
        height: 26px;
    }
    #messengers_float_btn i{
        animation: none;
    }
}

body.modal-open #floating_actions {
    display: none !important;
}

@keyframes messengers-pulse {
    0% {
        box-shadow: 0 4px 16px rgba(91, 105, 54, 0.5), 0 0 0 0 rgba(91, 105, 54, 0.7);
    }
    50% {
        box-shadow: 0 4px 16px rgba(91, 105, 54, 0.5), 0 0 0 10px rgba(91, 105, 54, 0);
    }
    100% {
        box-shadow: 0 4px 16px rgba(91, 105, 54, 0.5), 0 0 0 0 rgba(91, 105, 54, 0.7);
    }
}

@keyframes messengers-float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-8px);
    }
}

@keyframes messengers-icon-bounce {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

@keyframes messengers-appear {
    0% {
        opacity: 0;
        transform: scale(0) translateY(20px);
    }
    60% {
        transform: scale(1.1) translateY(-5px);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

/* ------------------------------- MESSENGERS MODAL ------------------------------- */

#messengers_modal {
    position: relative;
    background: #FFF;
    border-radius: 20px;
    padding: 32px;
    max-width: 100%;
}

.messengers_modal_close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 50%;
    background: #EFF1F6;
    transition: all 0.2s ease;
    z-index: 10;
}

.messengers_modal_close:hover {
    background: #d0d3da;
}

.messengers_modal_close i {
    font-size: 18px;
    color: #1A222A;
}

.messengers_modal_content {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.messengers_title {
    font-size: 24px;
    font-weight: 700;
    color: #1A222A;
    text-align: center;
    margin-bottom: 8px;
}

.messengers_disclaimer {
    font-size: 12px;
    color: #9497A2;
    text-align: center;
    margin-bottom: 16px;
}

.messengers_container {
    display: flex;
    flex-direction: column;
    gap: 0;
    align-items: stretch;
}

.messengers_qr_section {
    flex: 1;
    background: #F5F6F8;
    border-radius: 16px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.messengers_qr_banner {
    background: #5b6936;
    color: #FFF;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    width: 100%;
}

.messengers_qr_code {
    width: 100%;
    max-width: 200px;
    aspect-ratio: 1;
    background: #FFF;
    border-radius: 12px;
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

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

.messengers_buttons {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.messenger_btn {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    border-radius: 12px;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
}

.messenger_btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.messenger_icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.messenger_icon svg {
    width: 100%;
    height: 100%;
}

.messenger_btn span {
    font-size: 16px;
    font-weight: 500;
    color: #FFF;
}

.messenger_max {
    background: linear-gradient(135deg, #0077FF 0%, #8B00FF 100%);
}

.messenger_telegram {
    background: #0088cc;
}

@media only screen and (max-width: 768px) {
    #messengers_float_btn {
        width: 60px;
        height: 60px;
        bottom: 16px;
        right: 16px;
    }

    #messengers_float_btn i {
        font-size: 28px;
    }

    #messengers_modal {
        padding: 24px;
    }

    .messengers_title {
        font-size: 20px;
    }

    .messengers_container {
        flex-direction: column;
        gap: 0;
    }

    .messengers_buttons {
        width: 100%;
    }
}

@media only screen and (max-width: 600px) {
    #messengers_float_btn {
        width: 56px;
        height: 56px;
        bottom: 12px;
        right: 12px;
    }

    #messengers_float_btn i {
        font-size: 26px;
    }

    #messengers_modal {
        padding: 20px;
    }

    .messengers_title {
        font-size: 18px;
    }

    .messengers_disclaimer {
        font-size: 11px;
    }
}

/* ------------------------------- PRELOADER ------------------------------- */
/* Прелоадер удален */

/* Cookie Banner */
#cookie_banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
    z-index: 10000;
    padding: 20px;
}

.cookie_banner_content {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}

.cookie_banner_text {
    flex: 1;
    min-width: 300px;
    font-size: 14px;
    line-height: 1.5;
    color: #1A222A;
}

.cookie_banner_buttons {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}

.cookie_btn_accept,
.cookie_btn_reject {
    padding: 12px 24px;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease-out;
    font-family: 'SF Pro', sans-serif;
}

.cookie_btn_accept {
    background: #5b6936;
    color: #fff;
}

.cookie_btn_accept:hover {
    background: #4a5630;
}

.cookie_btn_reject {
    background: #e0e0e0;
    color: #1A222A;
}

.cookie_btn_reject:hover {
    background: #d0d0d0;
}

/* Cookie Policy Modal */
#cookie_policy_modal {
    position: relative;
    background: #fff;
    border-radius: 8px;
    max-height: 90vh;
    overflow-y: auto;
}

.cookie_policy_modal_close {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 30px;
    height: 30px;
    cursor: pointer;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cookie_policy_modal_content {
    padding: 40px;
}

.cookie_policy_title {
    font-size: 24px;
    font-weight: 600;
    color: #1A222A;
    margin-bottom: 20px;
}

.cookie_policy_text {
    font-size: 14px;
    line-height: 1.6;
    color: #1A222A;
}

.cookie_policy_text h3 {
    font-size: 18px;
    font-weight: 600;
    margin-top: 20px;
    margin-bottom: 10px;
    color: #1A222A;
}

.cookie_policy_text p {
    margin-bottom: 15px;
}

.cookie_policy_text ul {
    margin-left: 20px;
    margin-bottom: 15px;
    list-style: disc;
}

.cookie_policy_text li {
    margin-bottom: 8px;
    display: list-item;
}

.cookie_policy_text a {
    color: #5b6936;
    text-decoration: underline;
}

.cookie_policy_buttons {
    margin-top: 30px;
    text-align: center;
}

@media only screen and (max-width: 768px) {
    .cookie_banner_content {
        flex-direction: column;
        align-items: stretch;
    }

    .cookie_banner_buttons {
        width: 100%;
        flex-direction: column;
    }

    .cookie_btn_accept,
    .cookie_btn_reject {
        width: 100%;
    }

    .cookie_policy_modal_content {
        padding: 20px;
    }

    .cookie_policy_title {
        font-size: 20px;
        padding-right: 40px;
    }
}

/* -------------------------- OPEN HOUSE LANDING -------------------------- */

.open_house_page #main_sheet{
    background: #f5f6f8;
    align-items: stretch;
}

.open_house_page #main_sheet > .oh_container{
    align-self: stretch;
    min-width: 0;
}

.open_house_page .oh_container{
    width: 100%;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 32px;
    padding-right: 32px;
    box-sizing: border-box;
}

.open_house_page .oh_h2,
.open_house_page .block_name{
    padding-left: 0;
}

.open_house_page .oh_hero_container{
    margin-top: 16px;
    align-self: stretch;
    width: 100%;
    max-width: 1440px;
}

.open_house_page .oh_hero{
    position: relative;
    width: 100%;
    max-width: none;
    border-radius: 20px;
    overflow: hidden;
    min-height: 360px;
    display: block;
    box-sizing: border-box;
}

.open_house_page .oh_hero_bg{
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
}

.open_house_page .oh_hero_overlay{
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, rgba(8, 18, 12, 0.88) 0%, rgba(8, 18, 12, 0.55) 55%, rgba(8, 18, 12, 0.35) 100%);
}

.open_house_page .oh_hero_content{
    position: relative;
    z-index: 2;
    width: 100%;
    box-sizing: border-box;
    padding: 48px 40px 56px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.open_house_page .oh_hero_badge{
    display: inline-block;
    margin-bottom: 12px;
    padding: 8px 14px;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(183, 155, 74, 0.95), rgba(240, 223, 176, 0.85));
    color: #1a222a;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    box-shadow: 0 8px 24px rgba(0,0,0,0.25);
}

.open_house_page .oh_hero_title{
    margin: 0;
    color: #fff;
    font-size: 46px;
    line-height: 1.12;
    font-family: ui-serif, Georgia, "Times New Roman", Times, serif;
    max-width: 720px;
}

.open_house_page .oh_hero_lead{
    margin: 16px 0 0;
    color: rgba(255,255,255,0.9);
    font-size: 18px;
    line-height: 1.5;
    max-width: 600px;
}

.open_house_page .oh_hero_actions{
    margin-top: 24px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
    max-width: 560px;
}

.open_house_page .oh_btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: 56px;
    padding: 14px 24px;
    border-radius: 30px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.25;
    text-decoration: none;
    white-space: normal;
    text-align: center;
    flex: 1 1 240px;
    max-width: 100%;
    border: none;
    cursor: pointer;
    transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.open_house_page .oh_btn_primary{
    background: #5b6936;
    color: #f5f5f0;
}

.open_house_page .oh_btn_primary:hover{
    background: #4a5630;
    box-shadow: 0 4px 12px rgba(91, 105, 54, 0.3);
}

.open_house_page .oh_btn_secondary{
    background: rgba(255, 255, 255, 0.95);
    color: #1a222a;
}

.open_house_page .oh_btn_secondary:hover{
    background: #fff;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.open_house_page .oh_btn i{
    margin-left: 8px;
    font-size: 18px;
    color: inherit;
}

.oh_section{
    padding: 40px 0 8px;
}

.oh_section_alt{
    margin-top: 24px;
    padding: 32px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid #eff1f6;
}

.oh_h2{
    margin: 8px 0 0;
    font-size: 32px;
    line-height: 1.2;
    color: #1a222a;
}

.oh_cards{
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.oh_card{
    padding: 22px 20px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid #eff1f6;
    box-shadow: 0 8px 24px rgba(26, 34, 42, 0.06);
}

.oh_section_alt .oh_checklist li{
    background: #f8f9fb;
}

.oh_card_highlight{
    border-color: rgba(183, 155, 74, 0.55);
    background: linear-gradient(180deg, #fffdf6 0%, #fff 100%);
}

.oh_card_icon{
    font-size: 28px;
    line-height: 1;
    margin-bottom: 10px;
}

.oh_card h3{
    margin: 0 0 8px;
    font-size: 18px;
    color: #1a222a;
}

.oh_card p{
    margin: 0;
    font-size: 14px;
    line-height: 1.45;
    color: #555966;
}

.oh_checklist{
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 12px;
}

.oh_checklist li{
    position: relative;
    padding: 14px 16px 14px 44px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #eff1f6;
    font-size: 15px;
    line-height: 1.4;
    color: #1a222a;
}

.oh_checklist li::before{
    content: "✓";
    position: absolute;
    left: 16px;
    top: 14px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #5b6936;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.oh_note{
    margin-top: 20px;
    font-size: 14px;
    color: #555966;
}

.oh_register_grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: start;
}

.oh_register_lead{
    margin-top: 12px;
    font-size: 16px;
    line-height: 1.5;
    color: #555966;
    max-width: 520px;
}

.oh_register_route{
    margin-top: 20px;
    display: inline-flex;
    text-decoration: none;
}

.oh_form_box{
    position: relative;
    min-height: 420px;
}

.oh_form_panel{
    display: none;
    padding: 28px 24px;
    border-radius: 20px;
    background: #5b6936;
    color: #fff;
    box-sizing: border-box;
}

.oh_form_panel.active{
    display: block;
}

.oh_form_panel_success.active{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 420px;
}

.oh_form_title{
    margin: 0 0 12px;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
}

.oh_form_info{
    margin: 0 0 20px;
    font-size: 15px;
    line-height: 1.45;
    color: rgba(255,255,255,0.9);
}

.oh_form_field{
    position: relative;
    margin-bottom: 16px;
}

.oh_form_panel input{
    display: block;
    width: 100%;
    height: 56px;
    margin: 0;
    padding: 16px 18px;
    border: 1px solid transparent;
    border-radius: 12px;
    background: rgba(255,255,255,0.12);
    color: #fff;
    font-size: 16px;
    box-sizing: border-box;
}

.oh_form_panel input::placeholder{
    color: rgba(255,255,255,0.65);
}

.oh_form_panel input.error{
    border-color: #f46f6f;
}

.oh_form_error{
    display: block;
    margin-top: 6px;
    font-size: 12px;
    color: #ffd4d4;
    opacity: 0;
    transition: opacity 0.2s;
}

.open_house_page #openhouse_name_error.active,
.open_house_page #openhouse_phone_error.active{
    opacity: 1;
}

.oh_form_actions .btn{
    width: 100% !important;
    max-width: 100%;
    background: #fff;
    color: #5b6936;
}

.oh_form_actions .btn:hover{
    background: #eff1f6;
}

.oh_form_legal{
    margin: 12px 0 0;
    font-size: 12px;
    line-height: 1.4;
    color: rgba(255,255,255,0.75);
}

.open_house_page #footer{
    margin-top: 40px;
}

@media only screen and (max-width: 1000px) {
    .open_house_page .oh_container{
        padding-left: 16px;
        padding-right: 16px;
    }
    .open_house_page .oh_hero_container{
        margin-top: 12px;
    }
    .open_house_page .oh_hero{
        min-height: 320px;
    }
    .open_house_page .oh_hero_content{
        padding: 32px 24px 40px;
    }
    .open_house_page .oh_hero_title{
        font-size: 34px;
    }
    .oh_section_alt{
        padding: 24px 20px;
    }
    .oh_cards,
    .oh_register_grid{
        grid-template-columns: 1fr;
    }
}

@media only screen and (max-width: 600px) {
    .open_house_page .oh_container{
        padding-left: 12px;
        padding-right: 12px;
    }
    .open_house_page .oh_hero_content{
        padding: 28px 20px 36px;
        align-items: center;
        text-align: center;
        max-width: 100%;
    }
    .open_house_page .oh_hero_lead{
        max-width: 100%;
    }
    .open_house_page .oh_hero_actions{
        justify-content: center;
    }
    .open_house_page .oh_btn{
        flex: 1 1 100%;
    }
    .open_house_page .oh_hero_title{
        font-size: 28px;
    }
    .oh_form_title{
        font-size: 22px;
    }
}