@font-face {
    font-family: "Century Gothic"; 
    src: url('../fonts/centurygothic_bold.ttf');
	font-weight: bold; 
	font-style: normal; 
}

@font-face {
    font-family: "Century Gothic"; 
    src: url('../fonts/centurygothic.ttf');
	font-weight: 400; 
	font-style: normal; 
}

@font-face {
    font-family: "Calibri"; 
    src: url('../fonts/calibri-regular.ttf');
	font-weight: 400; 
	font-style: normal; 
}

@font-face {
    font-family: "Calibri"; 
    src: url('../fonts/calibri-bold.ttf');
	font-weight: bold; 
	font-style: normal; 
}

@font-face {
    font-family: "Calibri"; 
    src: url('../fonts/calibri-italic.ttf');
	font-weight: 400; 
	font-style: italic; 
}
@font-face {
    font-family: "Calibri"; 
    src: url('../fonts/calibri-bold-italic.ttf');
	font-weight: bold; 
	font-style: italic; 
}

.layout-boxed.nice-scroll{
    padding: 0 !important;
    padding-top: 0 !important;
}
main {
    max-width: 1920px;
    width: 100%;
    margin: auto;
}

.new-wrapper {
    max-width: 100%;
    padding: 0 22px;
}

.new-wrapper * {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    transition: 0.3s
}

.flex-box-column {
    display: flex;
    flex-direction: column;
}

.flex-box-row {
    display: flex;
    flex-direction: row;
}

.space-between {
    justify-content: space-between;
}

.blue-text {
    color: #1B4389;
}

.red-text {
    color: #F56775;
}


/* Первый экран */
.text-column-1 {
    gap: 25px;
    max-width: 743px;
    width: 60%;
    padding-top: 110px;
    padding-bottom: 68px;
}

.black-text {
    color: #000;
}

.white-text {
    color: #fff;
}

.page-title {
    font-family: Calibri;
    font-size: 64px;
    font-weight: bold;
    line-height: 100%;
    text-transform: uppercase;
}

.text-column-1 p {
    font-family: Calibri;
    font-size: 24px;
    font-weight: normal;
    line-height: 115%;
}

.blue-button {
    background-color: #18BAC5;
    color: #fff;
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 366px;
    width: 100%;
    height: 68px;
    border: 2px solid #18BAC5;
    font-family: 'Century Gothic';
    text-transform: uppercase;
    font-size: 32px;
    line-height: 100%;
    font-weight: normal;
}

.blue-button:hover {
    background-color: #fff;
    color: #18BAC5 !important;
    text-decoration: none !important;
}

.first-photo {
    background-position: right;
    background-size: contain;
    background-repeat: no-repeat;
    width: 33%;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
}

section:nth-child(1) .new-wrapper {
    max-width: 1152px;
    margin: auto;
}

section:not(:last-child) {
    margin-bottom: 140px;
    position: relative;
}

/* Адаптация первого экрана */
@media (max-width:1240px) {
    .text-column-1 {
        gap: 20px;
        padding-top: 80px;
        padding-bottom: 50px;
    }

    .page-title {
        font-size: 44px;
        font-weight: bold;
        line-height: 100%;
    }

    .text-column-1 p {
        font-size: 20px;
    }

    .blue-button {
        font-size: 28px;
        height: 50px;
    }

    section:not(:last-child) {
        margin-bottom: 120px;
    }
}

@media (max-width: 959px) {

    .page-title {
        font-size: 36px;
        font-weight: bold;
        line-height: 100%;
    }

    .text-column-1 p {
        font-size: 18px;
    }

    .blue-button {
        font-size: 22px;
        height: 40px;
    }

    section:not(:last-child) {
        margin-bottom: 80px;
    }
}

@media (max-width: 768px) {

    .text-column-1 {
        gap: 15px;
        padding-top: 0 !important;
        align-items: center;
        text-align: center;
        padding-bottom: 210px;
        width: 100%;
    }

    .page-title {
        font-size: 26px;
        font-weight: bold;
        line-height: 100%;
    }

    .text-column-1 p {
        font-size: 16px;
    }

    .blue-button {
        font-size: 20px;
    }

    section:not(:last-child) {
        margin-bottom: 40px;
    }

    .first-photo {
        left: 50%;
        right: 50%;
        transform: translateX(-50%);
        top: unset;
        bottom: 0;
        height: 200px;
    }
}





/* Второй экран */

section:nth-child(2) .new-wrapper {
    max-width: 1188px;
    justify-content: end;
    margin: auto;
}

.second-photo {
    object-fit: cover;
    width: 40%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    max-width: 571px;
}

.text-column-2 {
    padding-bottom: 163px;
    gap: 70px;
    max-width: 582px;
    width: 50%;
}

.screen-title {
    max-width: 517px;
    font-family: Calibri;
    font-size: 40px;
    font-weight: bold;
    line-height: 130%;
    text-transform: uppercase;
}

.text-grids-2 {
    display: grid;
    align-items: stretch;
    row-gap: 120px;
    column-gap: 160px;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.text-grid-2 {
    height: auto;
    position: relative;
}

.text-grid-2 .blue-svg {
    position: absolute;
    top: -30px;
    left: 1px;
}

.text-grid-2 .red-svg {
    position: absolute;
    top: -1px;
    left: -25px;
}

.grid-title-2 {
    text-transform: uppercase;
    font-family: Calibri;
    font-size: 24px;
    font-weight: bold;
    line-height: 130%;
    min-height: 61px;
}

.text-grid-2 p {
    font-family: Calibri;
    font-size: 20px;
    font-weight: normal;
    line-height: 130%;
}

/* Адаптация второго экрана */
@media (max-width:1240px) {
    .text-grids-2 {
        display: grid;
        row-gap: 50px;
        column-gap: 30px;
    }

    .grid-title-2 {
        text-transform: uppercase;
        font-family: Calibri;
        font-size: 20px;
        font-weight: bold;
        line-height: 130%;
        min-height: 52px;
    }

    .text-grid-2 p {
        font-size: 18px;
    }

    .screen-title {
        max-width: unset;
        font-size: 34px;
    }

    section:nth-child(2) .new-wrapper {
        gap: 80px;
    }

}

@media (max-width: 959px) {
    .text-grids-2 {
        row-gap: 20px;
    }

    .grid-title-2 {
        font-size: 18px;
        min-height: 45px;
    }

    .text-grid-2 p {
        font-size: 16px;
    }

    .screen-title {
        max-width: unset;
        font-size: 26px;
    }

    .text-grid-2 svg {
        display: none;
    }

    section:nth-child(2) .new-wrapper {
        gap: 30px;
    }

    .second-photo {
        width: 50%;
    }
    .text-column-2{
        padding-left: 20px;
    }
}

@media (max-width: 768px) {
    .grid-title-2 {
        font-size: 16px;
        min-height: unset;
    }

    .text-grid-2 p {
        font-size: 14px;
    }

    .screen-title {
        max-width: unset;
        font-size: 22px;
    }

    .text-grids-2 {
        row-gap: 20px;
        column-gap: 70px;
        grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
    }

    section:nth-child(2) .new-wrapper {
        flex-direction: column;
    }

    .second-photo {
        height: 400px;
        width: 100%;
        object-position: center;
        max-width: unset;
    }

    .text-column-2 {
        gap: 30px;
        width: 100%;
        padding-bottom: 0;
        padding-left: 0;
        padding-top: 430px;
        max-width: unset;
        justify-content: center;
        text-align: center;
    }

    .text-grid-2 {
        gap: 5px;
    }

}

@media (max-width: 550px) {
    .text-grids-2 {
        row-gap: 20px;
        column-gap: 30px;
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    }
}

/* Третий экран */

section:nth-child(3) .new-wrapper {
    max-width: 1282px;
    margin: auto;
    gap: 50px;
    padding: 0 40px;
}
section:nth-child(3) .page-title{
    padding-left: 25px;
}
.text-grids-3 {
    display: grid;
    align-items: start;
    row-gap: 80px;
    column-gap: 92px;
    grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
}

.text-grid-3 {
    gap: 22px;
}

.grid-title-3 {
    position: relative;
}

.grid-title-3-number {
    position: absolute;
    left: -40px;
    top: -30px;
    font-size: 64px;
    font-family: "Century Gothic";
    font-weight: bold;
    line-height: 130%;
    color: #F56775;
}

.grid-title-3-normal {
    font-family: Calibri;
    font-size: 24px;
    font-weight: bold;
    line-height: 130%;
}

.text-grid-3 p {
    font-family: Calibri;
    font-size: 18px;
    font-weight: normal;
    line-height: 130%;
}

section:nth-child(3) svg {
    margin: auto;
}

/* Адаптация третьего экрана */

@media (max-width: 1240px) {
    section:nth-child(3) .new-wrapper {
        gap: 30px;
        padding: 0 30px;
    }

    .text-grids-3 {
        display: grid;
        align-items: start;
        row-gap: 40px;
        column-gap: 40px;
        grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
    }

    .text-grid-3 {
        gap: 15px;
    }

    .grid-title-3-number {
        left: -30px;
        top: -15px;
        font-size: 44px;
    }

    .grid-title-3-normal {
        font-family: Calibri;
        font-size: 22px;
        font-weight: bold;
        line-height: 130%;
    }

    .text-grid-3 p {
        font-family: Calibri;
        font-size: 16px;
        font-weight: normal;
        line-height: 130%;
    }
}

@media (max-width: 959px) {
    section:nth-child(3) .new-wrapper {
        gap: 20px;
        padding: 0 30px;
    }

    .text-grids-3 {
        display: grid;
        align-items: start;
        row-gap: 30px;
        column-gap: 30px;
        grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
    }

    .text-grid-3 {
        gap: 10px;
    }

    .grid-title-3-number {
        left: -20px;
        top: -7px;
        font-size: 30px;
    }

    .grid-title-3-normal {
        font-family: Calibri;
        font-size: 20px;
        font-weight: bold;
        line-height: 130%;
    }

    .text-grid-3 p {
        font-family: Calibri;
        font-size: 14px;
        font-weight: normal;
        line-height: 130%;
    }
}

@media (max-width: 768px) {
    section:nth-child(3) .new-wrapper {
        gap: 20px;
        padding: 0 22px;
        text-align: center;
    }


    .text-grids-3 {
        display: grid;
        align-items: start;
        row-gap: 20px;
        column-gap: 100px;
        grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    }

    .grid-title-3 {
        margin: auto;
        width: fit-content;
    }

    .text-grid-3 {
        gap: 10px;
    }

    .grid-title-3-number {
        left: -15px;
        top: -5px;
        font-size: 24px;
    }

    .grid-title-3-normal {
        font-family: Calibri;
        font-size: 18px;
        font-weight: bold;
        line-height: 130%;

    }

    .text-grid-3 p {
        font-family: Calibri;
        font-size: 14px;
        font-weight: normal;
        line-height: 130%;
    }

    section:nth-child(3) .page-title{
        padding-left: 0;
    }
}

@media (max-width: 550px) {
    .text-grids-3 {
        display: grid;
        align-items: start;
        row-gap: 20px;
        column-gap: 200px;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
}



/* Четвёртый экран */

section:nth-child(4) {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

section:nth-child(4) .new-wrapper {
    max-width: 1084px;
    margin: auto;
    padding-top: 120px;
    padding-bottom: 312px;
    gap: 50px;
}

.screen-4-title {
    font-family: Calibri;
    font-size: 48px;
    font-weight: normal;
    line-height: 130%;
    text-transform: uppercase;
}

.faq-4 {
    gap: 5px;
}

.faq-4-el {
    background-color: #18BAC5;
    padding: 12px 23px;
    max-width: 570px;
    width: 100%;
    gap: 10px;
}

.faq-4-q {
    gap: 10px;
    align-items: center;
}

.question-text {
    font-family: Calibri;
    font-size: 20px;
    line-height: 130%;
    font-weight: normal;
}

.answer-text {
    font-family: Calibri;
    font-size: 18px;
    line-height: 130%;
    font-weight: normal;
}

.faq-4-el,
.serviceprice-5 {
    transition: background-color 0.3s ease;
    cursor: pointer;
}

.faq-4-el:hover {
    background-color: #1ca8b3;
    /* Немного темнее при наведении */
}

.answer-text,
.description {
    display: none;
    opacity: 0;
    height: 0;
    overflow: hidden;
    will-change: opacity, height;
    transition: opacity 0.3s ease, height 0.3s ease;
}

.faq-4-q svg {
    transition: transform 0.3s ease;
    transform-origin: center;

}

@media(max-width: 1240px) {
    section:nth-child(4) .new-wrapper {
        padding-top: 80px;
        padding-bottom: 210px;
        gap: 40px;
    }

    .screen-4-title {
        font-size: 36px;
    }

    .question-text {
        font-size: 18px;
    }

    .answer-text {
        font-size: 16px;
    }
}

@media(max-width: 959px) {
    section:nth-child(4) .new-wrapper {
        padding-top: 50px;
        padding-bottom: 160px;
        gap: 30px;
    }

    .screen-4-title {
        font-size: 30px;
    }
}

@media(max-width: 768px) {
    section:nth-child(4) .new-wrapper {
        padding-top: 30px;
        padding-bottom: 100px;
        gap: 20px;
    }

    .screen-4-title {
        font-size: 24px;
        text-align: center;
    }

    .faq-4-el {
        max-width: unset;
    }
}

/* Пятый экран */

section:nth-child(5) .new-wrapper {
    max-width: 1152px;
    margin: auto;
    gap: 50px;
}

.top-5 {
    gap: 100px;
    align-items: center;
}

.bottom-5 {
    background-color: #FBFBFB;
    padding: 46px 74px;
    gap: 44px;
}

.price-5-title {
    font-family: Montserrat;
    font-size: 30px;
    font-weight: light;
    line-height: 130%;
    color: #000;
}

.services-5 {
    gap: 25px;
}

.serviceprice-5 {
    gap: 11px;
}

.serviceprice {
    gap: 10px;
    padding-bottom: 17px;
    border-bottom: 1px solid #269C9E;
    align-items: center;
}

.serviceprice:hover .service {
    color: #269C9E;
}

.service {
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 500;
    line-height: 130%;
    color: #000;
}

.price {
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 500;
    line-height: 130%;
    color: #3349AC;
    white-space: nowrap;
}

.description {
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 400;
    line-height: 200%;
    color: #000;
}

.mini-text {
    font-family: Montserrat;
    font-size: 14px;
    font-weight: 400;
    line-height: 130%;
    letter-spacing: -0.1em;
    color: #000;
}

@media (max-width: 1240px) {
    section:nth-child(5) .new-wrapper {
        gap: 30px;
    }

    .top-5 {
        gap: 50px;
        align-items: center;
    }

    .bottom-5 {
        background-color: #FBFBFB;
        padding: 32px 45px;
        gap: 33px;
    }

    .price-5-title {
        font-size: 26px;
    }

    .services-5 {
        gap: 20px;
    }

    .serviceprice-5 {
        gap: 8px;
    }

    .serviceprice {
        gap: 8px;
        padding-bottom: 15px;
    }

    .service {
        font-size: 16px;
    }

    .price {
        font-size: 16px;
    }

    .description {
        font-size: 16px;
    }

    .mini-text {
        font-size: 13px;
    }
}

@media (max-width: 959px) {
    section:nth-child(5) .new-wrapper {
        gap: 25px;
    }

    section:nth-child(5) svg {
        width: 200px;
        height: fit-content;
    }

    .top-5 {
        gap: 30px;
        align-items: center;
    }

    .bottom-5 {
        background-color: #FBFBFB;
        padding: 22px 35px;
        gap: 22px;
    }

    .price-5-title {
        font-size: 23px;
    }

    .services-5 {
        gap: 15px;
    }


    .serviceprice {
        padding-bottom: 10px;
    }

    .service {
        font-size: 14px;
    }

    .price {
        font-size: 14px;
    }

    .description {
        font-size: 14px;
    }

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

@media (max-width: 768px) {
    section:nth-child(5) svg {
        width: 100px;
        height: fit-content;
    }

    section:nth-child(5) .new-wrapper {
        gap: 25px;
        align-items: center;
    }

    .price-5-title {
        text-align: center;
    }

    .top-5 {
        gap: 20px;
        flex-direction: column;
    }

    .bottom-5 {
        background-color: #FBFBFB;
        padding: 10px 20px;
        gap: 20px;
    }

    .price-5-title {
        font-size: 20px;
    }

    .services-5 {
        gap: 15px;
    }

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



/* Шестой экран */

section:nth-child(6) .new-wrapper {
    max-width: 1152px;
    margin: auto;
    padding-top: 400px;
    padding-bottom: 200px;
    gap: 120px;
}

section:nth-child(6) .page-title {
    text-transform: none;
}

.client-cards {
    display: grid;
    column-gap: 50px;
    row-gap: 80px;
    max-width: 1012px;
    width: 100%;
    margin: auto;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.client-card {
    height: fit-content;
    padding: 65px 30px;
    background-color: #fff;
    border-radius: 30px;
    position: relative;
}

.client-photo {
    border-radius: 99px;
    border: 4px solid #fff;
    background-position: top center;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    top: -70px;
    width: 95px;
    height: 95px;
    left: 50%;
    transform: translateX(-50%);
}

.client-text {
    font-family: Calibri;
    font-size: 20px;
    font-style: italic;
    line-height: 130%;
    color: #000;
}
@media(max-width: 1440px){
    section:nth-child(6) .new-wrapper {
        padding-top: 200px;
        padding-bottom: 155px;
    }
}
@media (max-width: 1240px) {
    .client-cards {
        display: grid;
        column-gap: 40px;
        row-gap: 80px;
    }

    .client-card {
        padding: 55px 20px;
    }

    .client-text {
        font-size: 18px;
    }
}

@media (max-width: 959px) {
    .client-cards {
        display: grid;
        column-gap: 30px;
        row-gap: 80px;
    }

    .client-card {
        padding: 50px 20px;
    }

    .client-text {
        font-size: 17px;
    }
}

@media (max-width: 768px) {
    .client-cards {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    }

    .client-text {
        font-size: 16px;
        text-align: center;
    }

    .client-card {
        padding: 30px 15px;
    }

    section:nth-child(6) .page-title {
        text-align: center;
    }

    section:nth-child(6) .new-wrapper {
        padding-top: 150px;
        padding-bottom: 80px;
    }
}


/* Седьмой экран */


/* Стили для слайдера */

section:nth-child(7) .new-wrapper {
    max-width: 1152px;
    margin: auto;
    gap: 45px;
}

.swiper {
    width: 100%;
    height: auto;
    max-width: 1029px;
    margin: auto;
    padding-bottom: 75px;
}


.swiper-slide-active {
    transform: scale(1.7) !important;
    z-index: 2;
}

.slide-images {
    display: flex;
    height: 100%;
    gap: 1px;
    align-items: center;
}

.slider-image {
    height: 380px;
    width: 50%;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

/* Стили для навигации */
.swiper-navigation {
    display: flex;
    justify-content: center !important;
    align-items: center !important;
    height: fit-content;
    gap: 50px;
    margin-top: 40px !important;
}

.swiper-button-prev,
.swiper-button-next {
    position: relative !important;
    cursor: pointer !important;
    top: unset !important;
    right: unset !important;
    left: unset !important;
    bottom: unset !important;
    margin-top: 0 !important;
    height: 35px;
    width: 35px;
}

.swiper-button-prev::after,
.swiper-button-next::after {
    content: "" !important;
    position: absolute;
    display: inline-block !important;
    width: 35px !important;
    height: 35px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.swiper-button-prev::after {
    background-image: url('data:image/svg+xml;utf8,<svg width="35" height="35" viewBox="0 0 35 35" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18.8616 15.9057C18.3099 16.4566 18 17.2033 18 17.9818C18 18.7604 18.3099 19.5071 18.8616 20.058L29.9706 31.1399C30.5233 31.6908 31.2728 32.0002 32.0543 32C32.8357 31.9998 33.5851 31.6901 34.1375 31.1389C34.6899 30.5878 35.0002 29.8404 35 29.0611C34.9998 28.2819 34.6892 27.5346 34.1365 26.9837L25.1095 17.9818L34.1365 8.97998C34.6735 8.42613 34.9708 7.68414 34.9644 6.91381C34.9581 6.14348 34.6486 5.40646 34.1026 4.86148C33.5566 4.31651 32.8178 4.00718 32.0453 4.00012C31.2729 3.99307 30.5285 4.28885 29.9726 4.82377L18.8597 15.9037L18.8616 15.9057Z" fill="%23F56775"/><path fill-rule="evenodd" clip-rule="evenodd" d="M1.06435 14.8821C0.382814 15.5707 0 16.5041 0 17.4773C0 18.4505 0.382814 19.3839 1.06435 20.0725L14.7873 33.9249C15.47 34.6135 16.3959 35.0002 17.3612 35C18.3265 34.9998 19.2521 34.6126 19.9346 33.9237C20.617 33.2347 21.0002 32.3005 21 31.3264C20.9998 30.3523 20.6161 29.4182 19.9334 28.7296L8.78228 17.4773L19.9334 6.22497C20.5966 5.53266 20.9639 4.60517 20.9561 3.64226C20.9482 2.67936 20.5659 1.75808 19.8914 1.07685C19.217 0.395632 18.3044 0.00897247 17.3501 0.000154193C16.3959 -0.00866408 15.4764 0.361065 14.7897 1.02971L1.06192 14.8797L1.06435 14.8821Z" fill="%23F56775"/></svg>');
}

.swiper-button-next::after {
    background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg width="35" height="35" viewBox="0 0 35 35" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M16.1384 15.9057C16.6901 16.4566 17 17.2033 17 17.9818C17 18.7604 16.6901 19.5071 16.1384 20.058L5.02936 31.1399C4.47667 31.6908 3.72716 32.0002 2.94572 32C2.16429 31.9998 1.41493 31.6901 0.862496 31.1389C0.310065 30.5878 -0.000184089 29.8404 8.19494e-08 29.0611C0.000184253 28.2819 0.310786 27.5346 0.863477 26.9837L9.89054 17.9818L0.863477 8.97998C0.326541 8.42613 0.0292285 7.68414 0.0355745 6.91381C0.0419204 6.14348 0.351417 5.40646 0.897405 4.86148C1.44339 4.31651 2.18219 4.00718 2.95466 4.00012C3.72714 3.99307 4.47149 4.28885 5.0274 4.82377L16.1403 15.9037L16.1384 15.9057Z" fill="%23F56775"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M33.9356 14.8821C34.6172 15.5707 35 16.5041 35 17.4773C35 18.4505 34.6172 19.3839 33.9356 20.0725L20.2127 33.9249C19.53 34.6135 18.6041 35.0002 17.6388 35C16.6735 34.9998 15.7479 34.6126 15.0654 33.9237C14.383 33.2347 13.9998 32.3005 14 31.3264C14.0002 30.3523 14.3839 29.4182 15.0666 28.7296L26.2177 17.4773L15.0666 6.22497C14.4034 5.53266 14.0361 4.60517 14.0439 3.64226C14.0518 2.67936 14.4341 1.75808 15.1086 1.07685C15.783 0.395632 16.6956 0.00897247 17.6499 0.000154193C18.6041 -0.00866408 19.5236 0.361065 20.2103 1.02971L33.9381 14.8797L33.9356 14.8821Z" fill="%23F56775"/%3E%3C/svg%3E');
}

@media (max-width: 768px) {
    section:nth-child(7) .new-wrapper {
        text-align: center;
        gap: 20px;
    }

    .swiper-slide-active {
        transform: unset !important;
        z-index: 2;
    }

    .slider-image {
        height: 300px;
        width: 50%;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
    }
}

@media (max-width: 550px) {
    .slider-image {
        height: 150px;
        width: 50%;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
    }
}



/* восьмой экран */
section:nth-child(8) {
    position: relative;
}

section:nth-child(8) .new-wrapper {
    max-width: 1152px;
    margin: auto;
    gap: 50px;
    padding-top: 250px;
    padding-bottom: 350px;
}

.bg-new {
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.top-8 {
    gap: 25px;
    max-width: 1016px;
    width: 100%;
}



.top-8 p {
    font-family: Calibri;
    font-size: 20px;
    font-weight: normal;
    line-height: 130%;
}

.bottom-8 {
    display: grid;
    gap: 31px;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    width: 100%;
}

.doctor-card {
    gap: 25px;
}

.doctor-card img {
    height: 290px;
    width: 100%;
    object-fit: cover;
    object-position: top;
}

.doctor-name,
.doctor-type {
    max-width: 144px;
    font-family: calibri;
    font-size: 18px;
    line-height: 130%;
    color: #000;
}

.doctor-name {
    font-weight: normal;
}

.doctor-type {
    font-style: italic;
}
@media (max-width: 1440px) {
    section:nth-child(8) .new-wrapper {
        padding-top: 80px;
        padding-bottom: 140px;
    }
}
@media (max-width: 1240px) {
    .top-8 p {
        font-size: 18px;
    }

    .bottom-8 {
        gap: 26px;
    }

    .doctor-card {
        gap: 20px;
    }

    .doctor-name,
    .doctor-type {
        font-size: 16px;
    }

    section:nth-child(8) .new-wrapper {
        padding-top: 45px;
        padding-bottom: 120px;
    }
}

@media (max-width: 959px) {
    .top-8 p {
        font-size: 16px;
    }

    .bottom-8 {
        gap: 21px;
    }

    .doctor-card {
        gap: 15px;
    }


    .doctor-name,
    .doctor-type {
        font-size: 16px;
    }

    section:nth-child(8) .new-wrapper {
        padding-top: 35px;
        padding-bottom: 80px;
    }
}

@media (max-width: 768px) {
    .top-8 {
        text-align: center;
        max-width: unset;
    }

    .top-8 p {
        font-size: 15px;
    }

    .doctor-name,
    .doctor-type {
        font-size: 15px;
    }

    #bg-8 {
        display: none;
    }

    .doctor-name,
    .doctor-type {
        max-width: unset;
        text-align: center;
    }

    section:nth-child(8) .new-wrapper {
        padding-top: 20px;
        padding-bottom: 40px;
    }
    section:nth-child(8) .bg-new{
        display: none;
    }
}

/* Девятый экран - Mobile First подход */

section:nth-child(9) .new-wrapper {
    gap: 20px;
    max-width: 1196px;
    margin: auto;
    /* Начальное значение для мобильных */
}

section:nth-child(9) .page-title {
    text-align: center;
}

.mySwiper-2 {
    max-width: 1086px;
    height: auto;
    width: 100%;
}

.mySwiper-2 .slider img {
    height: auto;
    max-height: 180px;
    /* Меньшее значение для мобильных */
    width: auto;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}

.mySwiper-2 .slider {
    width: 100% !important;
    border-radius: unset !important;
    display: flex;
    justify-content: center;
}

.mySwiper-2 .swiper-slide {
    height: 220px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center;
}

.mySwiper-2 .swiper-slide-active img {
    border-left: 5px solid #fff;
    border-right: 5px solid #fff;
}

/* Планшетная версия (768px и выше) */
@media (min-width: 768px) {
    section:nth-child(9) .new-wrapper {
        gap: 40px;
    }

    .mySwiper-2 .slider {
        width: auto !important;
    }

    .mySwiper-2 .swiper-slide {
        height: 300px !important;
    }

    .mySwiper-2 .slider img {
        max-height: 200px;
    }

    section:nth-child(9) .page-title {
        text-align: left;
    }
}

/* Десктопная версия (960px и выше) */
@media (min-width: 960px) {
    section:nth-child(9) .new-wrapper {
        gap: 50px;
    }


    .mySwiper-2 .swiper-slide {
        height: 370px !important;
        width: auto !important;
    }

    .mySwiper-2 .slider img {
        max-height: 212px;
    }
}


/* Десятый экран */
section:nth-child(10){
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
section:nth-child(10) .new-wrapper{
    max-width: 1030px;
    margin: auto;
    padding-top: 350px;
    padding-bottom: 250px;
    gap: 50px;
}

.screen-10-title{
    font-family: Calibri;
    font-size: 36px;
    line-height: 130%;
    font-weight: bold;
}


.before-after-box {
    position: relative;
    max-width: 515px;
    border-radius: 70px;
    width: 100%;
    height: 339px;
    overflow: hidden;
}

.after-img,
.before-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    will-change: transform;
}

.before-img {
    z-index: 2;
    clip-path: inset(0 50% 0 0);
}

/* Оптимизация во время перетаскивания */
.before-after-box.dragging .before-img {
    transition: none !important;
}

.slider-line {
    position: absolute;
    top: 0;
    left: 50%;
    width: 3px;
    height: 100%;
    background-color: white;
    z-index: 3;
    transform: translateX(-50%);
    pointer-events: none;
    will-change: transform;
    transition: unset;
}

.slider-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 40px;
    height: 40px;
    background: transparent;
    border: 1px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
    z-index: 4;
    cursor: grab;
    touch-action: none;
    will-change: transform;
    transition: unset;
}

.slider-circle:active {
    cursor: grabbing;
}
@media(max-width: 1440px){
    section:nth-child(10) .new-wrapper{
        padding-top: 246px;
        padding-bottom: 97px;
    }
}
@media (max-width: 768px) {
    .before-after-box {
        height: 400px;
    }
}

@media (max-width: 480px) {
    .before-after-box {
        height: 300px;
    }

    .slider-circle {
        width: 30px;
        height: 30px;
    }
}

.slider-circle::before,
.slider-circle::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 4px;
    height: 4px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    padding: 3px;
    transform: translateY(-50%);
}

.slider-circle::before {
    left: 7px;
    transform: translateY(-50%) rotate(135deg); /* Стрелка влево */
}

.slider-circle::after {
    right: 7px;
    transform: translateY(-50%) rotate(-45deg); /* Стрелка вправо */
}


.bottom-10{
    align-items: center;
    gap: 10px;
}
.custom-form input[type="text"],
.custom-form input[type="tel"],
.custom-form input[type="submit"] {
    display: block;
    width: 100%;
    max-width: 317px;
    margin-bottom: 40px;
    text-align: left !important;
    padding: 9px 40px !important;
    font-size: 24px !important;
    line-height: 130% !important;
    font-weight: normal !important;
    font-family: 'Century Gothic' !important;
    border: none;
    border-radius: 15px;
    box-sizing: border-box;
    transition: 0.3s;
}

.custom-form input[type="text"],
.custom-form input[type="tel"] {
    background-color: #15c2cc;
    color: white;
}
.custom-form input[type="text"]:focus,
.custom-form input[type="tel"]:focus{
    color: #000 !important;
}
.custom-form input[type="submit"] {
    background-color: #f97986 !important;
    color: white !important;
    border: 2px solid #f97986;
    font-weight: bold;
    cursor: pointer;
}
.custom-form input[type="submit"]:hover{
    background-color: transparent !important;
}
.custom-form input::placeholder {
    color: white;
    opacity: 1;
}
.custom-form input:focus::placeholder{
    color: #000 !important;
}
.wpcf7 form .wpcf7-response-output{
    margin: 0 !important;
    border-color: #f97986 !important;
    color: #fff !important;
    max-width: 317px;
}

@media (max-width: 1240px){
    .screen-10-title{
        font-size: 30px;
    }
    .custom-form input[type="text"],
    .custom-form input[type="tel"],
    .custom-form input[type="submit"] {
        margin-bottom: 35px;
        font-size: 22px !important;
    }
}

@media (max-width: 959px){
    .screen-10-title{
        font-size: 25px;
    }
    .custom-form input[type="text"],
    .custom-form input[type="tel"],
    .custom-form input[type="submit"] {
        margin-bottom: 30px;
        font-size: 20px !important;
    }
}

@media (max-width: 768px){
    .screen-10-title{
        font-size: 23px;
        text-align: center;
    }
    .custom-form input[type="text"],
    .custom-form input[type="tel"],
    .custom-form input[type="submit"] {
        max-width: unset;
        margin-bottom: 20px;
        font-size: 18px !important;
        text-align: center !important;
    }
    .bottom-10{
        flex-direction: column;
        gap: 30px;
    }
    .wpcf7 form .wpcf7-response-output{
        max-width: unset;
    }
    .before-after-box {
        height: 280px;
    }
    section:nth-child(10) .new-wrapper{
        padding-top: 150px;
        padding-bottom: 40px;
        gap: 30px;
    }
    .form-10{
        width: 100%;
    }
}