.header {
    position: relative;
    z-index: 1;
}

.header__about_company {

}

.about-company {

    .section {
        padding: 0;
    }

    .mt200 {
        margin-top: clamp(50px, 12vw, 200px);
    }

    padding-bottom: clamp(70px, 12vw, 180px);

    .about-company__main {
        position: relative;
        margin-top: -213px;
        height: 100vh;
        background-color: #ebf4ff;
        /*background-color: #deecff;*/
        padding-block: 240px 150px;
        overflow: hidden;
        z-index: 0;

        @media (max-width: 1200px) {
            height: auto;
        }

        @media (max-width: 550px) {
            padding-block: 240px 40px;
        }

        .about-company__main_body {
            position: relative;
            pointer-events: none;
            user-select: none;
            z-index: 1;
        }

        h1 {
            font-weight: 500;
            font-size: clamp(28px, 5vw, 48px);
            line-height: 1.5;
            color: var(--tekst-zagolovok);
            max-width: 1070px;

            @media (max-width: 1350px) {
                max-width: 750px;
            }

            @media (max-width: 1200px) {
                max-width: 550px;
            }

            @media (max-width: 850px) {
                max-width: 450px;
            }

            @media (max-width: 768px) {
                max-width: 400px;
            }
        }

        h2 {
            margin: 24px 0 0 0;
            font-weight: 400;
            font-size: clamp(16px, 5vw, 30px);
            line-height: 1.5;
            color: var(--tekst-tekst);
            max-width: 1150px;

            @media (max-width: 2050px) {
                max-width: 900px;
            }

            @media (max-width: 1000px) {
                max-width: 750px;
            }

            @media (max-width: 768px) {
                max-width: none;
            }
        }

        .about-company__main_statistics {
            margin-top: clamp(40px, 12vw, 130px);
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            align-items: stretch;
            gap: 30px 10px;

            @media (max-width: 1200px) {
                grid-template-columns: repeat(3, 1fr);
            }

            @media (max-width: 550px) {
                grid-template-columns: repeat(2, 1fr);
            }

            .about-company__main_statistics_item {
                display: flex;
                flex-direction: column;


                .about-company__main_statistics_item_value {
                    font-weight: 700;
                    font-size: clamp(28px, 7vw, 60px);
                    color: var(--primary-blue-130);
                    white-space: nowrap;
                }

                .about-company__main_statistics_item_description {
                    font-weight: 400;
                    font-size: clamp(12px, 8vw, 18px);
                    color: var(--tekst-tekst);
                    max-width: 200px;
                }
            }
        }

        .about-company__main_model {
            position: absolute;
            /*transform: translateX(350px) translateY(-150px);*/
            top: 80px;
            right: 0;
            width: 100%;
            height: 100%;
            max-width: 1000px;
            max-height: 800px;

            @media (max-width: 1440px) {
                right: -100px;
            }

            @media (max-width: 768px) {
                top: 100px;
                max-width: 700px;
                max-height: 500px;
                pointer-events: none;
            }

            @media (max-width: 500px) {
                top: 0;
                right: 0;

                spline-viewer {
                    opacity: .3;
                }
            }
        }

        .about-company__main_video {
            display: none;
            position: absolute;
            transform: translateX(350px) translateY(-150px);
            top: 0;
            right: 0;
            height: 100%;
            width: auto;
            z-index: 0;
            pointer-events: none;
            user-select: none;
            object-fit: contain;

            @media (min-width: 768px) {
                display: none;
                transform: translateX(500px) translateY(-150px);
            }
        }
    }

    .about-company__description {

        .about-company__description_body {
            display: flex;
            align-items: flex-start;
            gap: 75px;

            @media (max-width: 1250px) {
                gap: 40px;
            }

            @media (max-width: 650px) {
                flex-direction: column;
                gap: 30px;
            }

            h3 {
                flex: 0 1 32%;
                font-weight: 500;
                font-size: 40px;
                line-height: 1.2;
                color: var(--tekst-zagolovok);
                margin: 0;

                @media (max-width: 900px) {
                    font-size: 32px;
                }

            }

            .about-company__description_text {
                flex: 0 1 65%;

                p {
                    font-weight: 400;
                    font-size: 30px;
                    line-height: 1.2;
                    color: var(--tekst-tekst);

                    @media (max-width: 900px) {
                        font-size: 24px;
                    }
                }
            }
        }
    }

    .about-company__services {

        .about-company__services_body {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            align-items: stretch;

            @media (max-width: 900px) {
                grid-template-columns: repeat(2, 1fr);
            }

            @media (max-width: 600px) {
                grid-template-columns: 1fr;
            }

            .about-company__services_item {
                position: relative;

                &:not(:first-child) {
                    padding: 20px 30px 30px 30px;

                    @media (max-width: 600px) {
                        padding: 30px 0;
                    }
                }

                &::before,
                &::after {
                    content: "";
                    position: absolute;
                    background-color: #e5e5e5;
                }

                &::before {
                    top: 0;
                    right: 0;
                    bottom: 0;
                    height: 95%;
                    width: 1px;
                    margin: auto 0;
                }

                &::after {
                    left: 0;
                    right: 0;
                    bottom: 0;
                    width: 95%;
                    height: 1px;
                    margin: 0 auto;
                }


                @media (min-width: 900px) {
                    &:nth-child(n+4) {
                        &::after {
                            display: none;
                        }
                    }

                    &:nth-child(3n) {
                        &::before {
                            display: none;
                        }
                    }
                }

                @media (max-width: 900px) {
                    &:nth-child(n+5) {
                        &::after {
                            display: none;
                        }
                    }

                    &:nth-child(2n) {
                        &::before {
                            display: none;
                        }
                    }
                }

                @media (max-width: 600px) {

                    &::after {
                        display: block !important;
                        width: 100%;
                    }

                    &:first-child,
                    &:last-child {
                        &::after {
                            display: none !important;
                        }
                    }

                    &::before {
                        display: none;
                    }
                }

                h3 {
                    font-weight: 500;
                    font-size: 40px;
                    line-height: 1.2;
                    color: var(--tekst-zagolovok);
                    margin: 0;

                    @media (max-width: 900px) {
                        font-size: 32px;
                    }

                    @media (max-width: 600px) {
                        text-align: center;
                        margin: 0 0 20px;
                    }
                }

                h4 {
                    margin: 0 0 20px;
                    font-size: 24px !important;
                }

                ul {
                    display: flex;
                    flex-direction: column;
                    gap: 20px;
                    margin: 0;
                }

                li {
                    padding: 0;
                    margin: 0;
                    line-height: 0;

                    a {
                        font-weight: 500;
                        font-size: 16px;
                        line-height: 1.25;
                        color: var(--tekst-tekst);
                    }
                }
            }
        }
    }

    .about-company__stack {

        .about-company__stack_header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 20px;

            @media (max-width: 600px) {
                flex-direction: column;
            }

            h3 {
                flex: 0 1 32%;
                margin: 0;
                font-weight: 500;
                font-size: 40px;
                line-height: 1.2;
                color: var(--tekst-zagolovok);

                @media (max-width: 600px) {
                    font-size: 32px;
                }
            }

            p {
                flex: 0 1 40%;
                font-weight: 400;
                font-size: 20px;
                line-height: 1.45;
                color: var(--tekst-tekst);
            }
        }

        .about-company__stack_body {
            margin: 40px 0 0 0;
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            align-items: stretch;
            gap: 20px;

            @media (max-width: 768px) {
                grid-template-columns: 1fr;
            }

            .about-company__stack_card {
                display: flex;
                flex-direction: column;
                gap: 100px;
                border-radius: 12px;
                padding: 30px;
                background: var(--primary-blue-05);
                overflow: hidden;

                @media (max-width: 768px) {
                    gap: 50px;
                }


                .about-company__stack_card_title {
                    margin: 0;
                    font-weight: 500;
                    font-size: 22px;
                    line-height: 1.35;
                    color: var(--tekst-zagolovok);
                }

                .about-company__stack_card_items {
                    margin: auto 0 0 0;
                    display: flex;
                    align-items: center;
                    flex-wrap: wrap;
                    gap: 14px;

                    .about-company__stack_card_item {
                        flex: 0 1 auto;
                        display: grid;
                        grid-template-columns: 34px 1fr;
                        align-items: center;
                        gap: 14px;
                        border-radius: 30px;
                        padding: 8px 22px 8px 10px;
                        background: var(--tekst---belyy);

                        img {
                            width: 100%;
                            height: 100%;
                            object-fit: contain;
                        }

                        span {
                            white-space: nowrap;
                            font-weight: 400;
                            font-size: 18px;
                            line-height: 1.22222;
                            color: var(--tekst-tekst);
                        }

                    }
                }
            }
        }
    }

    .about-company__cases {

        .about-company__cases_cards {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            gap: 60px;

            @media (max-width: 768px) {
                gap: 40px;
            }

            .case__item {
                @media (max-width: 768px) {
                    -ms-grid-columns: 1fr;
                    grid-template-columns: 1fr;
                    -ms-grid-rows: auto 15px auto 15px auto;
                    grid-template-areas:
                            "h4"
                            "case__img"
                            "case__text";
                    grid-gap: 8px;
                }

                @media (max-width: 550px) {

                    .atvImg {
                        pointer-events: none;
                    }
                }
            }


            .case__text {
                display: flex;
                flex-direction: column;
                margin: 0;

                .span_h4 {
                    font-weight: 500;
                    font-size: 26px;
                    color: var(--tekst-zagolovok);
                    margin: 0 0 20px;
                }

                .tag {
                    gap: 16px;

                    .tag__item {
                        display: inline-flex;
                        align-items: center;
                        justify-content: center;
                        text-align: center;
                        background: #f5f5f5;
                        border-radius: 4px;
                        padding: 5px 12px 7px 12px;
                        font-weight: 500;
                        font-size: 13px;
                        line-height: 1.23077;
                        color: #828282;
                        margin: 0;
                    }
                }
            }

            .case__link {

            }
        }
    }

    .about-company__rating {

        .section-main__about {
            margin: 0 auto 80px auto;
            max-width: max-content;

            @media (max-width: 768px) {
                margin: 0 auto 40px auto;
            }

            p {
                padding: 0 10px;
                max-width: 730px;
                font-size: clamp(16px, 5vw, 40px);
                line-height: 1.2;
                color: var(--tekst-zagolovok);
            }
        }

        .section-rating {

            .section-rating__header {
                display: flex;
                align-items: center;
                gap: 20px;
                justify-content: space-between;

                @media (max-width: 768px) {
                    flex-direction: column;
                    align-items: flex-start;
                }

                .section-rating__title {
                    margin: 0;

                    @media (max-width: 768px) {
                        font-size: 26px;
                    }

                    @media (max-width: 600px) {
                        font-size: 24px;
                    }
                }

                .section-rating__body {

                    .section-rating__button {
                        @media (max-width: 600px) {
                            font-size: 14px;
                            padding: 12px 15px;
                        }
                        @media (max-width: 450px) {
                            font-size: 12px;
                            padding: 10px 12px;
                        }
                    }
                }
            }
        }

    }

    .about-company__specialists {

        .about-company__specialists_body {

            h3 {
                margin-bottom: clamp(30px, 5vw, 60px);
            }
        }
    }

    .about-company__plans {

        h3 {
            margin-bottom: clamp(30px, 5vw, 60px);
        }
    }

    .about-company__form_footer {

        .butblue {
            padding: 17px 90px;
            width: 100%;
            margin: 24px 0 0 0;
        }

        .form__footer {
            margin: 16px 0 0 0;
            font-weight: 500;
            font-size: 13px;
            line-height: 1.23077;
            color: var(--tekst-temno-seryy);

            a {
                color: #787878;
            }
        }
    }
}

.slider-specialists {
    position: relative;

    .slider-specialists__swiper {

        .swiper-wrapper {
            align-items: flex-start;

            .slider-specialists__slide {
                background-color: var(--primary-blue-05);
                border-radius: 12px;
                padding: 8px;
                transition: transform .3s ease-in-out, opacity .3s ease-in-out;
                /*margin-right: clamp(10px, 5vw, 60px);*/

                img {
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                }

                transform: scale(0.9);
                opacity: 0.8;

                &.swiper-slide-active {
                    transform: scale(1);
                    opacity: 1;
                    z-index: 1;
                }
            }

        }
    }

    .slider-specialists__prev,
    .slider-specialists__next {
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--primary-blue-10);
        border-radius: 10px;
        padding: 18px;
        width: 60px;
        height: 60px;
        transition: background .3s ease-in-out;

        @media (max-width: 768px) {
            width: 40px;
            height: 40px;
            padding: 10px;
        }


        svg {
            stroke: var(--tekst-tekst);
            transition: stroke .3s ease-in-out;
        }

        &:hover {
            background-color: var(--primary-blue-10);

            svg {
                stroke: #fff;
            }
        }

        &::after {
            display: none;
        }
    }
}

.company-plans {

    .company-plans__grid {
        display: grid;
        grid-template-columns: 355px 1fr;
        align-items: flex-start;
        gap: 0 46px;

        @media (max-width: 768px) {
            grid-template-columns: 255px 1fr;
            gap: 0 20px;
        }

        @media (max-width: 550px) {
            grid-template-columns: 1fr;
            gap: 0;
        }
    }

    .company-plans__about {
        display: flex;
        flex-direction: column;
        gap: 20px;

        @media (max-width: 550px) {
            display: none;
        }
    }

    .company-plans__support {

        h4 {
            height: 120px;
            font-weight: 500;
            font-size: 32px;
            line-height: 1.25;
            color: var(--tekst-zagolovok);
            margin: 0;

            @media (max-width: 768px) {
                font-size: 24px;
                margin: 40px 0 0 0;
                height: 80px;
            }

            @media (max-width: 550px) {
                font-size: 20px;
            }
        }

        ul {
            margin: 34px 0 0 0;
            padding: 0;

            li {
                margin: 0;
                font-weight: 400;
                font-size: 18px;
                line-height: 1.5;
                color: var(--tekst-tekst);
                border-bottom: 1px dashed rgba(32, 29, 38, 0.08);
                padding: 6px 0;
                white-space: nowrap;

                @media (max-width: 550px) {
                    white-space: wrap;
                    height: 67px;
                }
            }
        }
    }

    .company-plans__specialists {

        h4 {
            font-weight: 500;
            font-size: 32px;
            line-height: 1.25;
            color: var(--tekst-zagolovok);
            margin: 0;

            @media (max-width: 768px) {
                font-size: 24px;
            }

            @media (max-width: 550px) {
                font-size: 20px;
            }
        }

        ul {
            margin: 16px 0 0 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            gap: 4px 10px;
            flex-wrap: wrap;
            max-height: 150px;

            @media (max-width: 768px) {
                max-height: none;
            }

            li {
                position: relative;
                margin: 0;
                font-weight: 400;
                font-size: 16px;
                line-height: 1.5;
                color: var(--tekst-tekst);
                padding: 0 0 0 20px;

                &::before {
                    content: '';
                    position: absolute;
                    top: 0;
                    left: 0;
                    bottom: 0;
                    margin: auto 0;
                    width: 5px;
                    height: 5px;
                    background-color: var(--primary-blue-100);
                    border-radius: 100%;
                }
            }
        }
    }

    .company-plans__swiper {
        height: 100%;
        width: 100%;

        .swiper-slide {

        }
    }

    .company-plans__variant {
        padding: 10px 0;
        height: 100%;

        h6,
        span,
        li {
            white-space: nowrap;
        }

        .company-plans__variant_inner {
            height: 100%;
            background: linear-gradient(180deg, #d4e2ff 0%, #fefeff 100%);
            border-radius: 16px;
            padding: 23px 0 0 0;
            text-align: center;
            display: flex;
            flex-direction: column;
        }

        .company-plans__variant_header {
            display: flex;
            align-items: center;
            flex-direction: column;
            justify-content: center;
            text-align: center;
            height: 55px;
            margin: 0 0 16px 0;

            span {
                font-weight: 400;
                font-size: 16px;
                line-height: 1.75;
                text-align: center;
                color: var(--tekst-tekst);
            }

            h6 {
                margin: 0;
                font-weight: 500;
                font-size: 20px;
                text-transform: uppercase;
                color: var(--tekst-zagolovok);
            }
        }

        .company-plans__variant_price {
            padding: 0 10px;
            display: flex;
            align-items: flex-start;
            justify-content: center;
            gap: 3px;

            span {
                font-weight: 500;
                line-height: 1.5;
                text-align: center;
                color: var(--tekst-zagolovok);

                &:nth-of-type(1) {
                    font-size: 20px;
                }

                &:nth-of-type(2) {
                    font-size: 14px;
                    line-height: 1.85;
                }
            }
        }

        .company-plans__variant_list {
            margin: 24px 0 0 0;
            padding: 0 16px;
            display: flex;
            flex-direction: column;

            li {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                margin: 0;
                border-bottom: 1px dashed rgba(32, 29, 38, 0.08);
                padding: 6px 10px;
                font-weight: 400;
                font-size: 18px;
                line-height: 1.5;
                text-align: center;
                color: var(--tekst-zagolovok);

                span {
                    display: none;
                }

                @media (max-width: 550px) {
                    height: auto;
                    font-weight: 500;

                    span {
                        display: inline-block;
                        white-space: wrap;
                        font-weight: 400;
                        color: var(--tekst-tekst);
                    }
                }
            }
        }

        .company-plans__variant_specialists {
            position: relative;
            height: 100%;

            svg {
                position: absolute;
                margin-inline: auto;
                inset-inline: 0;
                inset-block-start: 50%;
                transform: translateY(-50%);
                stroke: var(--primary-blue-130);

                @media (max-width: 550px) {
                    display: none;
                }
            }

            .company-plans__specialists {
                margin: 10px 0 0 0;
                display: none;

                @media (max-width: 550px) {
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                }
            }
        }

        &.active {
            padding: 0;
            color: var(--tekst---belyy) !important;

            .company-plans__variant_inner {
                padding: 33px 0 0 0;
                background: linear-gradient(180deg, #2a60e4 0%, #86aeff 100%);
                color: var(--tekst---belyy);
            }

            h4,
            h6,
            span,
            li {
                color: var(--tekst---belyy) !important;
            }

        }
    }

    .company-plans__notes {
        margin-top: clamp(20px, 5vw, 40px);

        p {
            font-weight: 400;
            font-size: clamp(14px, 5vw, 20px);
            line-height: 1.5;
            color: var(--tekst-tekst);
            margin: 0;

            & + & {
                margin-top: 16px;
            }
        }

        span {
            display: inline-flex;
            margin-top:  clamp(15px, 4vw, 30px);
            font-weight: 400;
            font-size: clamp(14px, 5vw, 16px);
            line-height: 1.5;
            color: var(--tekst-tekst);
            max-width: 560px;

            @media (max-width: 550px) {
                max-width: none;
            }
        }

    }
}