@font-face {
    font-family: Montserrat;
    src: url('../assets/fonts/Montserrat-Regular.woff2');

    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Montserrat;
    src: url('../assets/fonts/Montserrat-Medium.woff2');

    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Montserrat;
    src: url('../assets/fonts/Montserrat-Bold.woff2');

    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Montserrat;
    src: url('../assets/fonts/Montserrat-ExtraBold.woff2');

    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Raleway;
    src: url('../assets/fonts/Raleway-Regular.woff2');

    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Raleway;
    src: url('../assets/fonts/Raleway-Medium.woff2');

    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Raleway;
    src: url('../assets/fonts/Raleway-ExtraBold.woff2');

    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Josefin Sans';
    src: url('../assets/fonts/JosefinSans-Light.woff2');

    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

:root {
    --green-m: #007869;
    --green-d: #005248;
    --green-dd: #004038;
    --green-l: #139081;
    --grey-dm: #282828;
    --grey-mm: #747879;
    --grey-l: #aeb0b0;
    --grey-sl: #e2e2e2;
    --bg-gr: #f6f6f6;
    --white: #fff;
    --cream: #fafaf0;
    --font-family: 'Montserrat', sans-serif;
    --second-family: 'Raleway', sans-serif;
    --third-family: 'Inter', sans-serif;
    --font3: 'Josefin Sans', sans-serif;
}

body {
    display: flex;
    align-items: center;
    flex-direction: column;

    background-color: var(--green-dd);
}

.wrapper {
    width: 100%;
    max-width: 1280px;
}

input::placeholder {
    letter-spacing: 0.1em;

    color: var(--white);

    font-family: var(--second-family);
    font-size: 12px;
    font-weight: 500;
    line-height: 160%;
}

*:focus {
    outline: none;
}

a,
input,
textarea,
button {
    transition: border 0.2s ease-in-out;
}

a:focus,
input:focus,
textarea:focus,
button:focus {
    border: 1px solid var(--white);
    outline: none;
}

a:hover,
a:active {
    text-decoration: underline;

    border: none;

    outline: none;
}

.header {
    position: fixed;
    z-index: 101;
    top: 0;
    left: 0;

    flex-shrink: 0;

    width: 100%;

    background: linear-gradient(180deg, #004038 21%, rgb(0 64 56 / 50%) 100%);

    box-shadow: 0 7px 10px 2px rgb(0 0 0 / 25%);
}

.header__preheader {
    position: relative;

    overflow: hidden;

    width: 100%;
    padding-top: 7px;

    white-space: nowrap;
}

.marquee {
    display: flex;

    width: max-content;

    animation: marquee 200s linear infinite;
}

.marquee__content {
    display: flex;
    gap: 20px;

    padding-right: 10px;
}

.marquee__content::after {
    padding-left: 20px;

    content: attr(data-text); /* Берём тот же текст */
    white-space: nowrap;
}

.city {
    display: inline-block;

    letter-spacing: 0.22px;

    color: rgb(19 144 129 / 70%);

    font-family: Raleway, sans-serif;
    font-size: 11px;
    font-weight: 700;
    font-style: normal;
    line-height: 140%;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.header__menu {
    display: flex;
    justify-content: center;

    width: 100%;
}

.menu {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;

    padding: 16px 50px 21px 70px;
    gap: 20px;

    transition: padding 0.3s ease;
}

.menu.shrink {
    padding: 8px 50px 10px 70px;
}

.nav_logo {
    display: flex;

    overflow: hidden;
    align-items: center;
    flex-shrink: 0;
    justify-content: center;
}

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

.menu__list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;

    width: 100%;

    /* max-width: 800px; */
    gap: 10px 42px;
}

.nav_link {
    text-align: center;
    letter-spacing: 0.72px;

    color: var(--white);

    font-family: Montserrat, sans-serif;
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    line-height: 140%;
}

.nav_link:hover,
.nav_link:focus {
    text-decoration: underline;
}

a[aria-current='page'] {
    text-decoration: none;
    pointer-events: none;

    /* opacity: 0.8; */
}

@media screen and (width <= 800px) {
    .menu {
        padding: 16px 30px 21px 40px;
    }

    .nav_link {
        font-size: 16px;
    }
}

.mobile-header {
    display: none;
}

.mobile-nav {
    display: none;
}

@media (width <= 551px) {
    .header {
        display: none;
    }

    .mobile-header {
        position: fixed;
        z-index: 11;
        top: 0;
        left: 0;

        display: flex;
        align-items: center;
        justify-content: space-between;

        width: 100%;
        padding: 12px 16px;

        /* background: linear-gradient(
            180deg,
            #004038 21%,
            rgb(0 64 56 / 50%) 100%
        ); */

        background: var(--green-dd);

        /* box-shadow: 0 7px 10px 2px rgb(0 0 0 / 25%); */
    }

    .mobile-logo img {
        width: 91px;
        height: 48px;
    }

    .burger-menu {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 40px;
        height: 40px;

        cursor: pointer;

        border: none;
        background: none;
    }

    .burger-icon {
        transition: transform 0.3s ease-in-out;
    }

    .mobile-nav {
        position: fixed;

        z-index: 99;

        top: 72px;
        left: 0;

        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: flex-start;

        width: 100%;
        height: 100%;

        transition: transform 0.3s ease-in-out;
        transform: translateY(calc(-100% - 72px));

        background: rgb(0 0 0 / 50%);
    }

    .mobile-nav-container {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: flex-start;

        width: 100%;
        padding: 0;
        padding: 40px 16px;

        background: var(--green-d);
    }

    .mobile-nav.active {
        transform: translateY(0);
    }

    .mobile-menu {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: flex-start;

        width: 100%;
        gap: 24px;
    }

    .mobile-menu li {
        width: 100%;

        text-align: center;
    }

    .mobile-menu a {
        text-decoration: none;
        letter-spacing: 0.05em;
        text-transform: uppercase;

        color: var(--white);

        font-family: var(--font-family);
        font-size: 18px;
        font-weight: 800;
        line-height: 140%;
    }

    .menu-divider {
        position: relative;

        width: 100%;
        height: 2px;

        background: repeating-linear-gradient(
            90deg,
            rgb(0 120 105 / 10%) 0,
            rgb(0 120 105 / 10%) 4px,
            #007869 4px,
            #007869 8px
        );

        mask-image: linear-gradient(
            90deg,
            rgb(0 0 0 / 0%) 0%,
            rgb(0 0 0 / 50%) 25%,
            rgb(0 0 0 / 100%) 40%,
            rgb(0 0 0 / 100%) 60%,
            rgb(0 0 0 / 50%) 75%,
            rgb(0 0 0 / 0%) 100%
        );
    }

    .menu-divider::after {
        position: absolute;
        z-index: 999;
        top: 2px;
        left: 0;

        width: 100%;
        height: 4px;

        content: '';

        box-shadow: 0 4px 4px 0 rgb(0 0 0 / 25%);
    }

    .mobile-nav > img {
        display: block;

        width: 100%;
        height: auto;
        margin: 0;
        padding: 0;

        border: none;
        object-fit: cover;
    }
}

.main {
    display: flex;
    align-items: center;
    flex-direction: column;
    flex-grow: 1;
    justify-content: flex-start;

    width: 100%;

    margin-top: 30px;

    background-color: var(--white);
}

@media screen and (width <= 630px) {
    .main {
        margin-top: 60px;
    }
}

.main__image {
    width: 100%;
}

.main_top {
    position: relative;

    display: flex;

    justify-content: center;
    order: 0;

    width: 100%;
    padding: 205px 50px 75px;

    background-color: var(--green-dd);
    background-image: url('../assets/images/webp/main-bg-preview.webp');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.main_top::before {
    position: absolute;
    z-index: 0;

    content: '';
    transition: opacity 0.8s ease;

    opacity: 0;

    background-image: url('../assets/images/webp/main-bg.webp');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    inset: 0;
}

.main_top.loaded::before {
    opacity: 1;
}

.main_top > * {
    position: relative;
    z-index: 1;
}

.main_topic {
    position: relative;

    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 40px;
}

.main_topic-head {
    display: flex;
    align-items: start;
    flex-direction: column;
    justify-content: start;
    gap: 2px;
}

.main_topic-pretitle {
    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: var(--white);

    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 900;
    line-height: 140%;
}

.main_topic-title {
    letter-spacing: 0.02em;

    color: var(--white);
    text-shadow: 0 1px 3px 0 rgb(166 175 195 / 40%);

    font-family: var(--font-family);
    font-size: 74px;
    font-weight: 900;
    line-height: 90%;
}

.first-word {
    display: block;
}

.main_topic-content {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    width: 100%;
}

.topic-content-text {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    flex-grow: 1;
    justify-content: flex-start;
    gap: 40px;
}

.main_topic-describe {
    max-width: 360px;
}

.topic-describe-text {
    letter-spacing: 0.02em;

    color: var(--white);

    font-family: var(--second-family);
    font-size: 24px;
    font-weight: 400;
    line-height: 160%;
}

.main_topic-footer {
    max-width: 530px;
}

.topic-footer-text {
    letter-spacing: 0.02em;

    color: var(--white);

    font-family: var(--font-family);
    font-size: 24px;
    font-weight: 900;
    line-height: 110%;
}

.topic-content-form {
    position: relative;

    display: flex;
    align-items: center;
    flex-direction: column;
    flex-grow: 1;
    justify-content: flex-start;

    padding: 32px 40px;

    background: var(--green-d);
    box-shadow: 0 7px 10px 2px rgb(0 0 0 / 25%);
    gap: 14px;
}

.form_head {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
    gap: 2px;
}

.form_head_title {
    text-align: center;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: var(--white);

    font-family: var(--font-family);
    font-size: 22px;
    font-weight: 900;
    line-height: 120%;
}

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

.form_head_subtitle > p,
.form_head_subtitle > a {
    text-align: center;
    letter-spacing: 0.04em;

    color: var(--white);

    font-family: var(--font-family);
    font-size: 14px;
    font-weight: 500;
    line-height: 120%;
}

@media screen and (width <= 780px) {
    .main_topic-content {
        flex-direction: column;
        gap: 40px;
    }
}

/* Section feedback form */
.section_form {
    display: none;
    order: 1;

    width: 100%;
    padding: 0 0 10px;

    background: var(--green-dd);
}

.section_form-container {
    width: 100%;
    padding: 20px 40px;

    background: var(--green-d);
    box-shadow: 0 5px 5px 2px rgb(0 0 0 / 15%);
}

/* Section Info */
.info-section {
    z-index: 1;

    display: flex;
    justify-content: center;
    order: 2;

    width: 100%;

    background: var(--green-dd);

    box-shadow: 0 2px 6px 2px rgb(0 0 0 / 20%);
}

.info_wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;

    padding: 35px 50px;
    gap: 40px 60px;

    background-color: var(--green-dd);

    box-shadow: 0 1px 3px 0 rgb(58 58 58 / 40%);
}

.group-block1,
.group-block2 {
    display: flex;
    align-items: center;
    gap: 60px;
}

.info-block {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;

    width: 240px;

    padding: 0 20px;

    text-align: center;
    gap: 20px;
}

.info-block:nth-child(3) {
    break-before: column;
}

.info-block-svg {
    height: 26px;
}

.info-block-svg > svg {
    width: auto;
    height: 100%;
    fill: var(--white);
}

.info-text {
    text-align: center;
    letter-spacing: 0.02em;

    color: var(--white);

    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 700;
    line-height: 120%;
}

/* Offer Section */

.offer-section {
    display: flex;
    justify-content: center;
    order: 3;

    width: 100%;

    background-color: var(--green-dd);
}

.offer-wrapper {
    display: flex;
    flex-direction: column;

    padding: 70px 50px 76px;

    background-color: var(--white);
    gap: 40px;
}

.offer-header {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    gap: 5px;

    max-width: 560px;
}

.title,
.offer-title {
    color: var(--grey-dm);
    text-shadow: 0 1px 3px 0 rgb(195 201 208 / 70%);

    font-family: var(--font-family);
    font-size: 44px;
    font-weight: 500;
    line-height: 115%;
}

.offer-description {
    letter-spacing: 0.04em;

    color: var(--grey-dm);

    font-family: var(--font-family);
    font-size: 15px;
    font-weight: 400;
    line-height: 150%;
}

.offer-content {
    display: flex;
    gap: 20px;

    align-items: center;
}

.offer-text {
    display: flex;
    flex-direction: column;
    gap: 30px;

    width: 50%;
    padding-top: 66px;
}

.text-block1,
.text-block2 {
    display: flex;
    gap: 20px;
}

.block-image {
    display: none;
}

.offer-item {
    position: relative;
    z-index: 1;

    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;

    max-width: 280px;
    padding: 0 20px 20px;

    border-radius: 20px;
    gap: 8px;
}

.offer-item::before {
    position: absolute;
    z-index: -1;
    top: -58px;
    left: 20px;

    content: attr(data-number);

    color: #f1f1f1;
    text-shadow: 0 1px 3px 0 rgb(195 201 208 / 70%);

    font-family: var(--font-family);
    font-size: 88px;
    font-weight: 900;
    line-height: 100%;
}

.text-block1 .offer-item:nth-child(2) {
    margin-top: 60px;
}

.text-block2 .offer-item:nth-child(2) {
    margin-top: 60px;
}

.offer-item-title {
    letter-spacing: 0.02em;

    color: var(--green-d);

    font-family: var(--font-family);
    font-size: 19px;
    font-weight: 700;
    line-height: 114%;
}

.offer-item-description {
    letter-spacing: 0.02em;

    color: var(--grey-dm);

    font-family: var(--second-family);
    font-size: 14px;
    font-weight: 400;
    line-height: 160%;
}

.offer-images {
    display: flex;
    gap: 20px;
}

.image-block1,
.image-block2 {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
    gap: 20px;
}

.image-block1 .offer-image:nth-child(1) {
    margin-top: 60px;
}

/* Cities */
.cities {
    position: relative;

    display: flex;
    overflow: hidden;
    flex-shrink: 0;
    justify-content: center;
    order: 4;

    width: 100%;
    height: 100%;
    max-height: 560px;

    background-color: var(--bg-gr);
}

.cities::before,
.cities::after {
    position: absolute;
    z-index: 2;
    right: 0;
    left: 0;

    height: 15%;

    content: '';
    pointer-events: none;
}

.cities::before {
    top: 0;

    background: linear-gradient(to bottom, var(--bg-gr), transparent);
}

.cities::after {
    bottom: 0;

    background: linear-gradient(to top, var(--bg-gr), transparent);
}

.cities-wrapper {
    height: 100%;
    padding: 70px 50px;

    transition: transform 0.5s ease-in-out;
}

.cities-text {
    position: relative;

    display: flex;
    overflow: hidden;
    flex-wrap: wrap;
    justify-content: center;

    height: 100%;

    transition: transform 0.3s linear, opacity 0.3s linear;

    clip-path: inset(0);
    gap: 7px 5px;
}

.cities-text span {
    transition: color 0.5s ease-in-out;

    text-align: center;
    white-space: nowrap;

    color: var(--grey-l);

    font-family: var(--font3);
    font-size: 26px;
    font-weight: 300;
    line-height: 160%;
}

.cities-text span:nth-child(7n) {
    color: var(--green-m);
}

/* Choose Us Section */
.choose_us {
    display: flex;
    justify-content: center;
    order: 5;

    width: 100%;

    background-color: var(--green-dd);
}

.choose_us-wrapper {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;

    padding: 28px 50px 80px;

    background-color: var(--white);
    gap: 30px;
}

.choose_us-title {
    max-width: 673px;

    text-align: center;
}

.choose_us-content {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    padding: 34px;
    gap: 80px;
}

.circle {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 50%;

    height: 100%;

    transform: translate(-50%);

    background-color: transparent;
}

.circle svg {
    height: 100%;

    border-radius: 50%;
    filter: drop-shadow(0 3px 4px rgb(0 0 0 / 40%));
}

.circle-anim {
    transform-origin: center;
    animation: rotate-animation 50s linear infinite;
}

.circle-anim-reverse {
    transform-origin: center;
    animation: rotate-animation-reverse 50s linear infinite;
}

@keyframes rotate-animation {
    0% {
        transform: rotate(0deg);
    }

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

@keyframes rotate-animation-reverse {
    0% {
        transform: rotate(360deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

.expert-cards {
    z-index: 2;

    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 80px;
}

.expert-card {
    display: flex;
    align-items: flex-end;
    flex: 1 1 calc(50% - 40px);
    flex-direction: column;
    justify-content: flex-start;

    max-width: 480px;

    padding: 20px;

    border-top: 4px solid var(--green-m);
    border-radius: 8px;
    background: var(--bg-gr);
    box-shadow: 0 1px 3px 0 rgb(195 201 208 / 70%);
    gap: 20px;
}

.card-title {
    width: 100%;

    text-align: center;
    text-transform: uppercase;

    color: var(--green-d);

    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 700;
    line-height: 160%;
}

.card-divider {
    flex-shrink: 0;

    width: 100%;
    height: 2px;

    background: repeating-linear-gradient(
        90deg,
        rgb(0 120 105 / 10%) 0,
        rgb(0 120 105 / 10%) 4px,
        #007869 4px,
        #007869 8px
    );

    mask-image: linear-gradient(
        90deg,
        rgb(0 0 0 / 0%) 0%,
        rgb(0 0 0 / 50%) 25%,
        rgb(0 0 0 / 100%) 40%,
        rgb(0 0 0 / 100%) 60%,
        rgb(0 0 0 / 50%) 75%,
        rgb(0 0 0 / 0%) 100%
    );
}

.card-text {
    letter-spacing: 0.02em;

    color: var(--grey-dm);

    font-family: var(--second-family);
    font-size: 14px;
    font-weight: 400;
    line-height: 160%;
}

/* Feedback invite section */
.feedback-invite {
    position: relative;
    z-index: 0;

    display: flex;
    overflow: hidden;
    align-items: center;
    flex-direction: column;
    flex-shrink: 0;
    justify-content: flex-start;
    order: 6;

    width: 100%;

    padding: 30px;

    background-color: var(--bg-gr);
    box-shadow: 0 1px 3px 0 rgb(195 201 208 / 70%);
    gap: 25px;
}

.feedback-invite::before {
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;

    width: 100%;
    max-width: 1112px;
    height: 121px;

    content: '';
    transform: translate(-50%, -50%);

    background: url('../assets/images/webp/invite.webp') no-repeat center;
    background-size: contain;
}

.invite-title {
    text-align: center;
    letter-spacing: 0.02em;
    text-transform: uppercase;

    color: var(--green-m);

    font-family: var(--font-family);
    font-size: 24px;
    font-weight: 800;
    line-height: 130%;
}

.invite-btn {
    width: 100%;
    max-width: 380px;
}

/* Cost-factors Section */
.cost-factors {
    display: flex;
    justify-content: center;
    order: 7;

    width: 100%;

    background-color: var(--green-dd);
}

.cost-factors-wrapper {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;

    padding: 70px 50px;
    gap: 50px;

    background-color: var(--white);
}

.cost-factors_header {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;

    max-width: 885px;
    gap: 5px;
}

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

.cost-factors_subtitle {
    max-width: 750px;

    text-align: center;
    letter-spacing: 0.04em;

    color: var(--grey-dm);

    font-family: var(--font-family);
    font-size: 15px;
    font-weight: 400;
    line-height: 150%;
}

.cost-factors__accordion {
    position: relative;

    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
}

.accordion-item {
    display: flex;
    overflow: hidden;
    align-items: flex-end;
    flex-direction: column;
    justify-content: flex-start;

    width: 100%;
    max-width: 780px;

    padding: 16px 20px 20px;

    cursor: pointer;

    transition: max-height 0.5s ease-in-out;

    border-radius: 8px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;

    background: var(--bg-gr);
    box-shadow: 0 -4px 10px 0 rgb(0 0 0 / 7%);
    gap: 10px;
}

.accordion-item-desc {
    max-height: 82px;
}

.accordion-item-desc:nth-child(5) {
    max-height: none;

    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}

.accordion-item-desc.active {
    max-height: 100%;

    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}

.accordion-index {
    letter-spacing: 0.06em;

    color: var(--green-d);

    font-family: var(--second-family);
    font-size: 18px;
    font-weight: 600;
    line-height: 100%;
}

.accordion-index_total {
    color: var(--grey-l);

    font-size: 12px;
}

.accordion-content {
    display: flex;
    flex-flow: row nowrap;

    gap: 20px;
}

.accordion-description {
    display: flex;
    align-items: flex-start;
    flex: 1 1 calc(100% - 370px);
    flex-direction: column;
    justify-content: flex-start;
    gap: 10px;
}

.description-title {
    letter-spacing: 0.02em;

    color: var(--green-d);

    font-family: var(--font-family);
    font-size: 19px;
    font-weight: 700;
    line-height: 114%;
}

.description-text {
    letter-spacing: 0.02em;

    color: var(--grey-dm);

    font-family: var(--second-family);
    font-size: 14px;
    font-weight: 400;
    line-height: 160%;
}

.accordion-image {
    flex: 1 1 360px;

    width: 100%;
    height: auto;
}

.accordion-image img {
    width: 100%;
    height: auto;
}

.cost-factors-swiper {
    display: none;
}

.slider-progress {
    display: none;
}

/* Map section */
.map {
    position: relative;
    z-index: 1;

    display: flex;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    order: 8;

    width: 100%;
    height: 100%;
    max-height: 616px;
    padding: 0 18px;

    background: var(--bg-gr);
}

.map::before,
.map::after {
    position: absolute;
    z-index: 2;
    right: 0;
    left: 0;

    height: 15%;

    content: '';
    pointer-events: none;
}

.map::before {
    top: 0;

    background: linear-gradient(to bottom, var(--bg-gr), transparent);
}

.map::after {
    bottom: 0;

    background: linear-gradient(to top, var(--bg-gr), transparent);
}

.map-wrapper {
    position: relative;

    display: flex;
    overflow: hidden;
    align-items: center;
    justify-content: center;

    height: 100%;
}

.map-image {
    position: relative;

    width: 77%;
    aspect-ratio: 1.6678;
}

.map-image img {
    object-fit: cover;
    object-position: center;

    width: 100%;
    height: auto;

    transition: transform 0.3s linear;
    will-change: transform;
}

/* Partner Section */
.partner-section {
    display: flex;
    justify-content: center;
    order: 9;

    width: 100%;

    background: var(--green-dd);
}

.partner-wrapper {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;

    gap: 30px;

    padding: 90px 50px 70px;

    background-color: var(--white);
}

.partner-content {
    position: relative;

    display: flex;
    gap: 87px;

    align-items: flex-start;
    justify-content: space-between;

    width: 100%;
}

.partner-content-scroll {
    position: absolute;
    top: 50%;
    left: 0;

    /* height: 55%; */

    transform: translateY(-50%);
}

.partner-content-scroll svg {
    height: 100%;
}

.partner-content-scroll svg path.active {
    stroke-width: 5;
    stroke: #005248;

    transition: stroke-width 0.3s ease-in-out;
}

.partner-list {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    gap: 40px;

    padding-left: 40px;
    scrollbar-width: none;
}

.step {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    gap: 8px;

    max-width: 670px;
}

.step-title {
    transition: font-size 0.2s ease;

    color: var(--grey-mm);

    font-family: var(--font-family);
    font-size: 24px;
    font-weight: 500;
    line-height: 140%;
}

.step.active .step-title {
    font-size: 32px;
}

.step-text {
    transition: font-size 0.2s ease;
    letter-spacing: 0.02em;

    color: var(--grey-mm);

    font-family: var(--second-family);
    font-size: 14px;
    font-weight: 400;
    line-height: 160%;
}

.step.active .step-text {
    font-size: 15px;
    line-height: 165%;
}

.partner-image {
    /* flex: 1; */
    flex-shrink: 0;

    max-width: 380px;
}

.partner-image img {
    width: 100%;
    height: auto;
}

/* CTA section */
.cta-section {
    display: flex;
    justify-content: center;
    order: 10;

    width: 100%;

    background-color: var(--green-dd);
}

.cta-wrapper {
    padding: 0 50px;

    background-color: var(--white);
}

.cta-content {
    position: relative;
    z-index: 0;

    display: flex;
    overflow: hidden;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;

    padding: 30px 0 30px 100px;

    border-radius: 8px;
    background: var(--bg-gr);
    box-shadow: 0 1px 3px 0 rgb(195 201 208 / 70%);
    gap: 20px;
}

.cta-content::before {
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;

    width: 628px;
    height: 100%;

    content: '';

    background: linear-gradient(90deg, #f6f6f6 5%, rgb(246 246 246 / 0%) 69%),
        url('../assets/images/webp/cta-bgi.webp');

    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.cta-text {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    gap: 8px;
}

.cta-title {
    letter-spacing: 0.02em;
    text-transform: uppercase;

    color: var(--green-m);
    text-shadow: 0 1px 3px 0 rgb(195 201 208 / 70%);

    font-family: var(--font-family);
    font-size: 24px;
    font-weight: 800;
    line-height: 100%;
}

.cta-description {
    max-width: 470px;

    letter-spacing: 0.04em;

    color: var(--grey-dm);

    font-family: var(--font-family);
    font-size: 13px;
    font-weight: 400;
    line-height: 150%;
}

.cta-button {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: center;

    width: 100%;
    max-width: 380px;
    padding: 16px 20px;

    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: var(--white);

    background: var(--grey-dm);

    font-family: var(--font-family);
    font-size: 14px;
    font-weight: 700;
    line-height: 160%;
    gap: 10px;
}

/* Reviews section */
.reviews-section {
    display: flex;
    justify-content: center;
    order: 11;

    width: 100%;

    background-color: var(--green-dd);
}

.reviews-wrapper {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;

    padding: 70px 150px 80px;

    background-color: var(--white);
    gap: 50px;
}

.reviews {
    position: relative;
    z-index: 0;

    display: flex;
    align-items: center;
    flex-direction: column;
    flex-shrink: 0;
    justify-content: center;

    width: 100%;

    padding: 50px 100px 40px;

    border-radius: 8px;
    background: var(--bg-gr, #f6f6f6);
    box-shadow: 0 1px 3px 0 rgb(166 175 195 / 40%);
}

.controllers {
    position: absolute;
    top: 20px;
    right: 20px;

    display: flex;
    gap: 10px;

    width: max-content;
}

.control_btn {
    display: flex;
    overflow: visible;
    align-items: center;
    flex-shrink: 0;
    justify-content: center;

    width: 24px;
    height: 24px;

    /* padding: 4px; */

    border: 1px solid var(--green-dd);

    border-radius: 50%;
    background-color: transparent;
}

.control_btn:focus {
    border: 1px solid var(--green-dd);
}

.button_prev svg {
    margin-right: 2px;
}

.button_next svg {
    margin-left: 1px;
}

.icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;
}

.control_btn svg {
    overflow: visible;
}

.control_btn:hover {
    cursor: pointer;
}

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

    min-width: 50px;
}

.counter_text {
    text-align: center;
    letter-spacing: 0.7px;

    color: var(--grey-dm, #282828);

    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    line-height: 140%;
}

.review_item {
    position: relative;

    display: none;
    align-items: center;
    flex-direction: column;
    justify-content: center;

    max-width: 780px;

    transition: opacity 0.5s ease;

    opacity: 0;
    gap: 10px;
}

.review_item::before {
    position: absolute;
    z-index: -1;
    top: -20px;
    left: -20px;

    width: 160px;
    height: 105px;

    content: '';

    background: url('../assets/icons/drops.png') no-repeat center/contain;
}

@media screen and (width <= 1160px) {
    .reviews-wrapper {
        padding-right: 84px;
        padding-left: 84px;
        gap: 30px;
    }

    .reviews {
        padding-right: 50px;
        padding-left: 50px;
    }

    .review_item::before {
        left: 10px;
    }
}

.visible_review {
    display: flex;

    opacity: 1;
}

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

.reviewer {
    display: flex;
    align-items: center;
    gap: 6px;
}

.line {
    width: 14px;
    height: 1px;

    background-color: var(--grey-dm);
}

.name {
    color: var(--grey-dm, #282828);

    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-weight: 700;
    font-style: normal;
    line-height: 24px;
}

.divider {
    width: 1px;
    height: 14px;

    opacity: 0.2;
    background: #282828;
}

.stars {
    display: flex;
    gap: 4px;
}

.reviews_texts {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
}

.review_text {
    align-self: stretch;

    text-align: center;
    letter-spacing: 0.3px;

    color: var(--grey-dm, #282828);

    font-family: Raleway, sans-serif;
    font-size: 15px;
    font-weight: 400;
    font-style: normal;
    line-height: 165%;
}

.date {
    align-self: stretch;

    text-align: center;
    text-transform: uppercase;

    color: var(--grey-l, #aeb0b0);

    font-family: Montserrat, sans-serif;
    font-size: 10px;
    font-weight: 700;
    font-style: normal;
    line-height: 24px;
}

/* FAQ Section */
.faq {
    display: flex;
    justify-content: center;
    order: 12;

    width: 100%;

    background-color: var(--green-dd);
}

.wrapper-faq {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;

    padding: 40px 150px 60px;
    gap: 50px;

    background: var(--bg-gr);
}

.faq-title {
}

.faq-accordion {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    gap: 24px;

    width: 100%;
}

.accordion-faq-item {
    display: flex;
    overflow: hidden;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;

    width: 100%;
    padding: 30px;

    border-left: 4px solid var(--green-m);
    border-radius: 8px;
    background: var(--white);
    box-shadow: 0 1px 3px 0 rgb(195 201 208 / 70%);
    gap: 10px;
}

.accordion-faq-item:focus {
    border: 1px solid var(--green-m);
    border-left: 4px solid var(--green-m);
}

.accordion-button {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
    gap: 22px;

    width: 100%;

    background-color: inherit;
}

.accordion-title {
    text-align: left;
    letter-spacing: 0.02em;

    color: var(--grey-dm);

    font-family: var(--font-family);
    font-size: 19px;
    font-weight: 700;
    line-height: 114%;
}

.btn-svg svg {
    transition: transform 0.4s ease-in-out;
}

.accordion-faq-item.active .btn-svg svg {
    transform: rotate(180deg);
}

.accordion-text {
    overflow: hidden;

    max-height: 0;

    transition: max-height 0.6s ease-out, opacity 0.4s ease-in 0.2s;
    letter-spacing: 0.02em;

    opacity: 0;
    color: var(--grey-mm);

    font-family: var(--second-family);
    font-size: 15px;
    font-weight: 400;
    line-height: 165%;
}

.accordion-faq-item.active .accordion-text {
    max-height: 200px;

    transition: max-height 0.8s ease-out, opacity 0.4s ease-in;

    opacity: 1;
}

/* Section Feedback */

.feedback {
    display: flex;
    justify-content: center;

    width: 100%;
}

.feedback_wrapper {
    display: flex;
    flex-wrap: wrap;

    background-color: var(--green-d);
}

.contacts {
    z-index: 2;

    display: flex;
    align-items: center;
    flex-direction: column;

    width: 100%;
    max-width: 50%;

    padding: 40px 40px 23px 50px;

    background: var(--green-d);

    /* padding: 0 20px; */

    box-shadow: 0 7px 10px 2px rgb(0 0 0 / 25%);
}

.contacts_content {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;

    width: 100%;

    padding: 0 20px;
    gap: 18px;
}

.feedback_title {
    width: 100%;

    text-align: center;
    letter-spacing: 3.96px;
    text-transform: uppercase;

    color: var(--white, #fff);

    font-family: Montserrat, sans-serif;
    font-size: 22px;
    font-weight: 900;
    font-style: normal;
    line-height: 120%;
}

.contacts_divider {
    width: 100%;
    height: 0.5px;

    background-color: #139081;
}

.phone_media {
    display: flex;
    align-items: start;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 20px;

    width: 100%;
}

.phone_item {
    width: 100%;
    max-width: 230px;
}

.media_item {
    width: 100%;
    max-width: 230px;
}

.contacts_title {
    align-self: stretch;

    letter-spacing: 0.3px;
    text-transform: uppercase;

    color: var(--green-l, #139081);

    font-family: Raleway, sans-serif;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    line-height: 115%;
}

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

.contacts_text {
    align-self: stretch;

    letter-spacing: 0.3px;

    color: var(--white, #fff);

    font-family: Montserrat, sans-serif;
    font-size: 15px;
    font-weight: 600;
    font-style: normal;
    line-height: 115%;
}

.media_list {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.emails {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;

    width: 100%;
}

.email-lists {
    display: flex;
    flex-flow: row wrap;
    gap: 7px;

    width: 100%;
}

.emails_list {
    display: flex;
    flex-flow: column wrap;

    width: 100%;
    max-width: 250px;
}

.email_item {
    /* flex: 1 0 0; */
    width: 100%;

    letter-spacing: 0.3px;
}

.email_item > a {
    letter-spacing: 0.3px;

    color: var(--white, #fff);

    font-family: Raleway, sans-serif;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    line-height: 125%;
}

.getintouch {
    position: relative;

    display: flex;
    align-items: center;
    flex-direction: column;

    width: 100%;
    max-width: 50%;

    padding: 40px;

    background: var(--green-d, #005248);
    box-shadow: 0 7px 10px 2px rgb(0 0 0 / 25%);
    gap: 18px;
}

.feedback_subtitle {
    display: none;
}

.get_form {
    display: flex;
    flex-direction: column;
    gap: 22px;

    width: 100%;
}

.form_input {
    display: flex;
    align-items: center;

    padding: 16px 20px;

    text-align: start;
    letter-spacing: 1.2px;
    text-transform: uppercase;

    color: var(--white, #fff);

    border: 0.5px solid var(--green-l, #139081);
    background: var(--green-d, #005248);

    font-family: Raleway, sans-serif;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    line-height: 160%;
    gap: 10px;
}

.input_name {
    width: 100%;
}

.mobile_email_inputs {
    display: flex;
    gap: 20px;

    flex-wrap: wrap;
}

.input_mobile,
.input_email {
    width: 100%;
    max-width: calc(50% - 10px);
}

.form_button {
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 16px 20px;

    text-align: center;
    letter-spacing: 2.52px;
    text-transform: uppercase;

    color: var(--white, #fff);

    background: var(--grey-dm, #282828);

    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
    line-height: 160%;
    gap: 10px;
}

.button {
    transition: background-color 0.3s ease;
}

.button:hover {
    background-color: #4f4f4f;
}

.footer {
    z-index: 2;

    display: flex;
    justify-content: center;

    width: 100%;

    background-color: var(--green-dd);
}

.footer_wrapper {
    display: flex;
    flex-direction: column;

    padding: 20px 50px 34px;
    gap: 20px;
}

.footer_content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.footer_links {
    display: flex;
    gap: 0 50px;

    flex-wrap: wrap;
    justify-content: flex-start;
}

.footer_links1,
.footer_links2 {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-end;
}

.footer_link {
    width: 100%;
}

.footer_link > a {
    align-self: stretch;

    width: 100%;

    letter-spacing: 0.56px;
    text-transform: uppercase;

    color: var(--grey-sl, #e2e2e2);

    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    line-height: 100%;
}

.footer_contacts {
    display: flex;
    align-items: end;
    flex-direction: column;
    justify-content: flex-end;
}
.footer_address {
    align-self: stretch;

    text-align: right;
    letter-spacing: 0.56px;
    text-transform: uppercase;

    color: var(--grey-sl, #e2e2e2);

    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    line-height: 100%;
}

.footer_number > a {
    align-self: stretch;

    text-align: right;
    letter-spacing: 0.56px;
    text-transform: uppercase;

    color: var(--grey-sl, #e2e2e2);

    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    line-height: 100%;
}

.footer_emails {
    display: flex;
    align-items: start;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 20px;
}

.footer_email > a {
    letter-spacing: 0.4px;

    color: var(--grey-sl, #e2e2e2);

    font-family: Montserrat, sans-serif;
    font-size: 10px;
    font-weight: 400;
    font-style: normal;
    line-height: 150%;
}

.footer_rights {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 14px 0;

    border-top: 1px solid var(--green-m, #007869);
}

.rights_text {
    text-align: center;

    color: var(--grey-sl, #e2e2e2);

    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    line-height: 151%;
}

.rights_link {
    text-align: center;

    color: var(--grey-sl, #e2e2e2);

    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    line-height: 151%;
}

.mobile-footer {
    display: none;
}

/* Popup */
.popup {
    position: fixed;
    z-index: 9;
    top: 0;
    left: 0;

    display: none;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;
    padding: 0 16px;

    transition: all 0.4s ease;
    pointer-events: none;

    opacity: 0;
    background: rgb(0 0 0 / 50%);
}

.popup.open {
    display: flex;

    pointer-events: all;

    opacity: 1;
}

.popup-form {
    position: relative;

    display: flex;
    align-items: center;
    flex-direction: column;
    flex-grow: 1;
    justify-content: flex-start;

    width: 100%;
    max-width: 980px;

    padding: 80px 0;

    background: var(--bg-gr);

    box-shadow: 0 7px 10px 2px rgb(0 0 0 / 25%);
    gap: 40px;
}

.popup_head {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
    gap: 10px;
}

.popup-title {
    text-align: center;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: var(--green-m);

    font-family: var(--font-family);
    font-size: 22px;
    font-weight: 900;
    line-height: 120%;
}

.popup-subtitle {
    max-width: 470px;

    text-align: center;

    color: var(--grey-dm);

    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 600;
    line-height: 130%;
}

.popup-content,
.popup-partner_form {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;

    width: 100%;

    max-width: 580px;
    gap: 20px;
}

.popup-form_input {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: flex-start;

    width: 100%;
    padding: 16px 20px;

    text-align: left;
    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: var(--green-d);

    border: 1px solid var(--green-d);

    background: var(--white);

    font-family: var(--second-family);
    font-size: 12px;
    font-weight: 500;
    line-height: 160%;
    gap: 10px;
}

.popup-form_input::placeholder {
    text-align: left;

    color: var(--green-d);
}

.popup-form_button {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: center;

    width: 100%;
    padding: 16px 20px;

    text-align: center;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: var(--white);

    background: var(--grey-dm);

    font-family: var(--font-family);
    font-size: 14px;
    font-weight: 700;
    line-height: 160%;
    gap: 10px;
}

/* Изначально скрываем иконку */
.loading-icon {
    display: none;
}

/* Скрытие текста и отображение иконки при загрузке */
.popup-form_button.loading .button-text {
    display: none;
}

.popup-form_button.loading .loading-icon {
    display: block;

    animation: spin 3s linear infinite;
}

/* Скрытие текста и отображение иконки при загрузке */
.form_button.loading .button-text {
    display: none;
}

.form_button.loading .loading-icon {
    display: block;

    animation: spin 3s linear infinite;
}

/* Анимация для крутилки */
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

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

.popup-close-btn {
    position: absolute;
    z-index: 5;
    top: 30px;
    right: 30px;

    background: transparent;
}

.popup-close-btn:hover {
    transition: transform 0.3s ease;
    transform: scale(1.1);
}

.popup-close-btn svg {
    fill: var(--green-d);
}

.success-message {
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;

    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: center;

    width: 100%;
    height: 100%;

    gap: 16px;

    background-color: #fff;
}

.success-message p {
    color: var(--grey-dm);

    font-family: var(--font-family);
    font-size: 24px;
    font-weight: 500;
    line-height: 115%;
}

.success-message-form {
    background-color: var(--green-d);
}

.success-message-form p {
    color: var(--white);
}

.success-message svg {
    width: 35px;
    height: 20px;
}

.error-border {
    border: 1px solid #d00000 !important;
}

.hidden {
    display: none;
}

/* Popup Review */

.rating {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: flex-start;

    width: 100%;
    gap: 20px;
}

.rating-label {
    padding-left: 20px;

    text-align: center;
    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: var(--green-d);

    font-family: var(--second-family);
    font-size: 12px;
    font-weight: 500;
    line-height: 160%;
}

.stars-container {
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-grow: 1;
    justify-content: center;
    gap: 30px;
}

.popup-form-star {
    cursor: pointer;
}

.popup-form-star svg path {
    transition: fill 0.3s ease;
}

.popup-star-active svg path {
    fill: var(--green-d);
}

.form_textarea {
    display: flex;
    align-items: flex-start;
    flex-direction: row;
    justify-content: flex-start;

    width: 100%;

    min-height: 116px;
    padding: 16px 20px;

    text-align: left;
    letter-spacing: 0.1em;

    color: var(--green-d);

    border: 1px solid var(--green-d);

    background: var(--white);

    font-family: var(--second-family);
    font-size: 12px;
    font-weight: 500;
    line-height: 160%;
    gap: 20px;
}

.form_textarea::placeholder {
    text-transform: uppercase;

    color: var(--green-d);
}

@media screen and (width < 1280px) {
    .offer-content {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
        gap: 0;

        width: 100%;
    }

    .offer-text {
        width: 100%;
        padding-top: 44px;
    }

    .text-block1,
    .text-block2 {
        width: 100%;
    }

    .offer-item {
        max-width: calc(50% - 15px);
    }

    .text-block1 .offer-item:nth-child(2) {
        margin-top: 60px;
    }

    .text-block2 .offer-item:nth-child(2) {
        margin-top: 60px;
    }

    .offer-images {
        width: 100%;
    }

    .image-block1,
    .image-block2 {
        width: 100%;
        max-width: calc(50% - 10px);
    }

    .offer-image {
        width: 100%;
    }

    .offer-image > img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    .image-block2 .offer-image:nth-child(1) {
        margin-top: 60px;
    }

    .image-block1 .offer-image:nth-child(1) {
        margin-top: 0;
    }
}

@media screen and (width < 1024px) {
    .partner-content {
        gap: 30px;
    }

    .partner-list {
        gap: 20px;

        padding-left: 20px;
    }

    /* CTA section */
    .cta-section {
        display: flex;
        justify-content: center;

        width: 100%;

        background-color: var(--green-dd);
    }

    .cta-wrapper {
        padding: 0 50px;

        background-color: var(--white);
    }

    .cta-content {
        padding: 30px;

        background: linear-gradient(
                180deg,
                rgb(0 82 72 / 60%) 0%,
                rgb(0 82 72 / 60%) 95.83%
            ),
            url('../assets/images/webp/cta-bgi.webp'); /* Картинка должна идти в конце */

        background-color: var(--green-dd); /* Зелёный фон */
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    }

    .cta-content::before {
        display: none;
    }

    .cta-title {
        color: var(--white);
    }

    .cta-description {
        color: var(--white);
    }

    .footer_content {
        gap: 30px;
    }

    .footer_links {
        gap: 0 20px;
    }

    .footer_emails {
        flex-direction: column;
        flex-grow: 1;
        gap: 0;
    }

    .footer_emails1,
    .footer_emails2 {
        display: flex;
        align-items: flex-end;
        flex-direction: column;

        width: 100%;
    }

    .footer_email,
    .footer_email > a {
        width: 100%;

        text-align: end;
        white-space: nowrap;
    }

    .wrapper-faq {
        padding: 40px 50px;
    }
}

@media screen and (width <= 890px) {
    .input_mobile,
    .input_email {
        max-width: 100%;
    }

    .offer-wrapper {
        padding: 40px 16px;
    }

    /* Choose us Section */

    .choose_us-wrapper {
        padding: 28px 16px 40px;
    }

    .choose_us-content {
        gap: 30px;

        padding: 34px 0;
    }

    .expert-cards {
        gap: 20px;
    }

    .partner-wrapper {
        padding: 50px 16px;
    }

    .partner-image {
        display: none;
    }

    .cta-wrapper {
        padding: 40px 16px 0;
    }

    .cta-content {
        padding: 163px 16px 20px;
    }

    .reviews-wrapper {
        padding: 40px 16px;
    }
}

@media screen and (width <= 740px) {
    .contacts,
    .getintouch {
        padding: 30px 20px 23px;
    }

    .accordion-content {
        flex-direction: column;
    }

    .accordion-image {
        flex: none;
    }

    .popup-form {
        max-width: 580px;

        padding: 80px 20px;

        gap: 30px;
    }
}

@media screen and (width <= 620px) {
    .circle {
        top: 20%;

        width: 80%;
        height: auto;
    }

    .circle svg {
        width: 100%;
        height: auto;
    }
}

@media screen and (width <= 551px) {
    .main {
        margin-top: 72px;
    }

    .main_top {
        padding: 70px 16px 20px;
    }

    .main_topic {
        gap: 20px;
    }

    .main_topic-pretitle {
        letter-spacing: 0.08em;

        font-size: 12px;
        font-weight: 800;
        line-height: 120%;
    }

    .main_topic-title {
        letter-spacing: 0.02em;

        font-size: 30px;
        font-weight: 800;
        line-height: 110%;
    }

    .topic-content-text {
        gap: 20px;
    }

    .topic-describe-text {
        letter-spacing: 0.03em;

        font-size: 15px;
        line-height: 130%;
    }

    .topic-footer-text {
        max-width: 343px;

        letter-spacing: 0.1em;
        text-transform: uppercase;

        font-size: 12px;
        font-weight: 800;
        line-height: 130%;
    }

    .topic-content-form {
        display: none;
    }

    .section_form {
        display: flex;
    }

    /* Info Section */
    .info-section {
        background-color: var(--green-d);
    }

    .info_wrapper {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;

        padding: 20px 16px 30px;
        gap: 24px 15px;
    }

    .group-block1,
    .group-block2 {
        justify-content: space-around;

        width: 100%;
        gap: 10px;
    }

    .info-block {
        width: 164px;
        gap: 10px;
    }

    .info-block-svg {
        height: 20px;
    }

    .info-block-svg > svg {
        stroke-width: 0.35px;
    }

    .info-text {
        letter-spacing: 0.04em;

        font-size: 13px;
        font-weight: 400;
        line-height: 130%;
    }

    /* Offer Section */
    .offer-wrapper {
        padding: 40px 16px;
    }

    .offer-header {
        gap: 15px;
    }

    .title,
    .offer-title {
        font-size: 30px;
        font-weight: 500;
        line-height: 115%;
    }

    .offer-description {
        letter-spacing: 0.02em;

        font-size: 14px;
        font-weight: 400;
        line-height: 140%;
    }

    .offer-content {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        gap: 24px;
    }

    .offer-item {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;

        max-width: 100%;
        padding: 12px 16px;

        border-radius: 16px;
        background: #f6f6f6;
        box-shadow: 0 1px 3px 0 rgb(195 201 208 / 70%);
        gap: 12px;
    }

    .offer-text {
        padding-top: 0;
        gap: 24px;
    }

    .text-block1,
    .text-block2 {
        flex-direction: column;
        gap: 24px;
    }

    .text-block1 .offer-item:nth-child(2) {
        margin-top: 0;
    }

    .text-block2 .offer-item:nth-child(2) {
        margin-top: 0;
    }

    .block-image {
        display: block;

        width: 100%;
        height: auto;

        border-radius: 8px;
    }

    .block-image > img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    .offer-item::before {
        position: absolute;
        z-index: -1;
        top: 12px;
        right: 16px;
        left: auto;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 44px;
        height: 44px;
        padding: 16px;

        content: attr(data-number);
        text-align: center;

        color: var(--green-d);

        border-radius: 50px;
        background: var(--white);
        box-shadow: 0 1px 3px 0 rgba(195 201 208 / 70%);
        text-shadow: 0 1px 3px 0 rgba(195 201 208 / 70%);

        font-family: var(--font-family);
        font-size: 18px;
        font-weight: 800;
        line-height: 100%;
        gap: 10px;
    }

    .offer-item-title {
        letter-spacing: 0.02em;

        font-size: 19px;
        font-weight: 700;
        line-height: 114%;
    }

    .offer-item-description {
        letter-spacing: 0.02em;

        font-size: 14px;
        font-weight: 400;
        line-height: 160%;
    }

    .offer-images {
        display: none;
    }

    /* Cities */
    .cities {
        height: 295px;
    }

    .cities-wrapper {
        padding: 10px 16px;
    }

    .cities-text {
        height: 100%;
        gap: 7px 5px;
    }

    .cities-text span {
        font-size: 18px;
        font-weight: 300;
        line-height: 150%;
    }

    /* Choose us Section */

    .choose_us-wrapper {
        padding: 40px 16px;
        gap: 30px;
    }

    .choose_us-title {
        text-align: left;
    }

    .choose_us-content {
        padding: 0;
    }

    .circle {
        display: none;
    }

    .expert-cards {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;

        width: 100%;
        min-height: 440px;

        padding: 0;
        gap: 0;

        transition: min-height 0.4s ease-in-out;
    }

    .expert-card {
        display: flex;
        overflow: hidden;
        align-items: flex-end;
        flex-direction: column;
        justify-content: flex-start;

        width: 100%;

        padding: 20px;

        transition: max-height 0.5s ease-in-out;

        border-top: 4px solid var(--green-m);
        border-radius: 8px;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
        gap: 16px;
    }

    .expert-card:nth-child(4) {
        max-height: none;
    }

    .expert-card.active {
        max-height: 1000px;

        border-bottom-right-radius: 8px;
        border-bottom-left-radius: 8px;
    }

    .card-title {
        cursor: pointer;
    }

    /* Cost-factors Section */
    .cost-factors-wrapper {
        position: relative;

        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: flex-start;

        width: 100%;
        max-width: 100%;
        margin: 0 auto;

        padding: 40px 16px 60px;
        gap: 30px;
    }

    .cost-factors_header {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;

        max-width: 885px;
        gap: 15px;
    }

    .cost-factors_title {
        text-align: left;
    }

    .cost-factors_subtitle {
        text-align: left;
        letter-spacing: 0.02em;

        font-size: 14px;
        line-height: 140%;
    }

    .cost-factors__accordion {
        display: none;
    }

    .swiper-container,
    .cost-factors-swiper {
        display: block;
        overflow: hidden;

        width: 100%;

        border-radius: 8px;
    }

    .swiper-wrapper {
        display: flex;
        align-items: stretch;

        transition: transform 0.5s ease-in-out;
    }

    .swiper-slide {
        flex-shrink: 0;

        width: 100%;

        border-radius: 8px;
    }

    .accordion-item {
        position: relative;

        width: 100%;
        height: 100%;

        padding: 16px 0 0;

        border-radius: 8px;
    }

    .accordion-index {
        padding-right: 20px;
    }

    .accordion-content {
        display: flex;
        flex-flow: column nowrap;
        justify-content: space-between;

        height: 100%;
        gap: 20px;
    }

    .accordion-description {
        flex: auto;

        padding: 0 20px;
    }

    .accordion-image {
        flex: initial;
    }

    .accordion-image img {
        width: 100%;
        height: auto;
        object-fit: cover;

        border-bottom-right-radius: 5px;
        border-bottom-left-radius: 5px;
    }

    /* Полоска внизу */
    .slider-progress {
        position: absolute;
        bottom: 40px;
        left: 50%;

        display: block;

        width: calc(100% - 32px);

        transform: translateX(-50%);
    }

    .slider-progress svg {
        width: 100%;
    }

    #slider-progress-fill {
        transition: all 0.3s ease-in-out;
    }

    .map {
        order: 9;
    }

    /* Partner Section */
    .partner-section {
        order: 8;

        background-image: url('../assets/images/webp/partner-mobile.webp');
        background-repeat: no-repeat;
        background-position: center;
    }

    .partner-wrapper {
        background-color: rgb(0 82 72 / 60%);
    }

    .partner-title {
        color: var(--white);
    }

    .partner-content {
        position: relative;
        z-index: 0;

        display: flex;

        align-items: flex-start;
        justify-content: space-between;

        width: 100%;

        gap: 0;
    }

    .partner-content-scroll svg {
        height: 532px;
    }

    .partner-content-scroll svg path:nth-child(1) {
        stroke: #f6f6f6;
    }

    .partner-content-scroll svg path:nth-child(2) {
        stroke: white;
    }

    .partner-content-scroll svg path.active {
        stroke-width: 5;
        stroke: #005248;

        transition: stroke-width 0.3s ease-in-out;
    }

    .partner-list {
        overflow: scroll;

        max-height: 548px;

        padding-left: 20px;
        gap: 30px;
    }

    .step-title {
        color: var(--white);
    }

    .step.active .step-title {
        font-size: 32px;
    }

    .step-text {
        color: var(--white);
    }

    .step.active .step-text {
        font-size: 15px;
        line-height: 165%;
    }

    .step.fade-text {
        background: linear-gradient(
            180deg,
            #fff 0%,
            rgb(255 255 255 / 30%) 64.5%,
            rgb(255 255 255 / 0%) 96.5%
        );
        background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    /* Map Section */
    .map-image {
        width: 100%;
    }

    /* CTA section */
    .cta-section {
        display: flex;
        justify-content: center;

        width: 100%;

        background-color: var(--green-dd);
    }

    .cta-wrapper {
        padding: 40px 16px 0;

        background-color: var(--white);
    }

    .cta-content {
        background-repeat: no-repeat;
        background-position: right;
        background-size: cover;
    }

    .cta-description {
        font-weight: 700;
    }

    /* Review section */
    .reviews {
        padding: 20px 0;
        gap: 20px;
    }

    .controllers {
        position: static;

        justify-content: space-between;

        width: 100%;
        padding: 0 15px;
    }

    .counter_text {
        text-transform: uppercase;

        color: var(--green-d);

        font-family: var(--font-family);
        font-size: 14px;
        font-weight: 700;
        line-height: 171%;
    }

    .divider {
        display: none;
    }

    .review_item {
        gap: 20px;
    }

    .review_item::before {
        top: -33px;
    }

    .review_item-top {
        flex-direction: column;
        gap: 8px;
    }

    .reviews_texts {
        padding: 0 16px;
    }

    /* FAQ Section */
    .faq {
        display: flex;
        justify-content: center;

        width: 100%;

        background-color: var(--green-dd);
    }

    .wrapper-faq {
        padding: 40px 16px;
        gap: 30px;
    }

    .accordion-faq-item {
        padding: 20px;
    }

    .accordion-title {
        font-size: 16px;
        font-weight: 600;
        line-height: 130%;
    }

    /* Feedback Section */
    .feedback_wrapper {
        padding: 20px 40px;

        box-shadow: 0 5px 5px 2px rgb(0 0 0 / 15%);
    }

    .contacts {
        display: none;
    }

    .getintouch {
        max-width: 100%;
        padding: 0;

        box-shadow: none;
    }

    .getintouch_title {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: flex-start;
        gap: 9px;
    }

    .feedback_title {
        text-align: center;
        letter-spacing: 0.1em;
        text-transform: uppercase;

        color: var(--white);

        font-family: var(--font-family);
        font-size: 14px;
        font-weight: 800;
        line-height: 130%;
    }

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

        justify-content: center;
    }

    .call_us {
        display: inline;

        letter-spacing: 0.04em;

        color: var(--white);

        font-family: var(--font-family);
        font-size: 12px;
        font-weight: 500;
        line-height: 120%;
    }

    .call_us-link {
        text-align: center;
        letter-spacing: 0.04em;

        color: var(--white);

        font-family: var(--font-family);
        font-size: 12px;
        font-weight: 500;
        line-height: 120%;
    }

    /* Feedback invite section */
    .feedback-invite {
        padding: 30px 16px 27px;

        gap: 20px;
    }

    .feedback-invite::before {
        width: 100%;
        max-width: 1112px;
        height: 121px;
    }

    .invite-titles {
        display: flex;
        align-items: start;
        flex-direction: column;
        gap: 10px;
    }

    .invite-title {
        text-align: left;
    }

    .invite-subtitle {
        font-size: 14px;
        font-weight: 400;
        line-height: 140%;
    }

    .invite-btn {
        width: 100%;
        max-width: 380px;
    }

    /* Footer */
    .footer {
        display: none;
    }

    .mobile-footer {
        display: flex;
        justify-content: center;

        width: 100%;
    }

    .footer_wrapper {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: flex-start;
        gap: 30px;

        padding: 40px 16px 30px;
    }

    .footer_content {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: flex-start;
        gap: 30px;

        width: 100%;
    }

    .footer_top {
        display: flex;
        align-items: center;
        flex-direction: row;
        justify-content: space-between;
        gap: 16px;

        width: 100%;
    }

    .footer_number > a {
        letter-spacing: 0.05em;

        color: var(--grey-sl);

        font-family: var(--font-family);
        font-size: 18px;
        font-weight: 400;
        line-height: 160%;
    }

    .footer_emails {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
        gap: 16px;
    }

    .footer_emails_list {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
        gap: 12px;
    }
    .footer_address {
    text-align: center;
    letter-spacing: 0.05em;
    text-transform: none;

    color: var(--white);

    font-family: var(--second-family);
    font-size: 15px;
    font-weight: 400;
    line-height: 140%;
    }

    .footer_email > a {
        text-align: center;
        letter-spacing: 0.05em;

        color: var(--white);

        font-family: var(--second-family);
        font-size: 15px;
        font-weight: 400;
        line-height: 140%;
    }

    .footer_rights {
        display: flex;
        align-items: flex-start;
        flex-direction: row;
        justify-content: space-between;

        width: 100%;

        padding: 20px 0;
        gap: 20px;
    }

    .footer_rights_text {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
        gap: 3px;
    }

    .footer_rights_text > p {
        color: var(--grey-sl);

        font-family: var(--font-family);
        font-size: 12px;
        font-weight: 500;
        line-height: 151%;
    }

    .footer_rights_links {
        display: flex;
        align-items: flex-end;
        flex-direction: column;
        justify-content: flex-start;
        gap: 8px;
    }

    .privacy_link {
        color: var(--grey-sl);

        font-family: var(--font-family);
        font-size: 12px;
        font-weight: 500;
        line-height: 151%;
    }

    .footer_social {
        display: flex;
        gap: 16px;
    }

    /* Popup */

    .popup {
        padding: 0;
    }

    .popup.open {
        display: flex;

        pointer-events: all;

        opacity: 1;
    }

    .popup-form {
        max-width: 375px;

        padding: 60px 16px 20px;

        gap: 20px;
    }

    .popup_head {
        gap: 9px;
    }

    .popup-title {
        letter-spacing: 0.1em;

        font-size: 14px;
        font-weight: 800;
        line-height: 130%;
    }

    .popup-subtitle {
        max-width: 300px;

        font-size: 12px;
        font-weight: 500;
    }

    .popup-content,
    .popup-partner_form {
        width: 100%;

        max-width: 343px;
        gap: 18px;
    }

    .popup-form_button {
        letter-spacing: 0.2em;

        font-size: 12px;
    }

    .popup-close-btn {
        top: 20px;
        right: 16px;
    }

    .success-message {
        gap: 8px;
    }

    .success-message p {
        font-size: 16px;
        font-weight: 700;
        line-height: 115%;
    }

    .success-message svg {
        width: 35px;
        height: 20px;
    }

    /* Popup Review */

    .stars-container {
        gap: 15px;
    }

    .popup-form-star {
        cursor: pointer;
    }

    .popup-form-star svg {
        width: 26px;
        height: 27px;
    }
}