﻿.ul-why-choose-us {
    background: linear-gradient(90deg, #041C33 0%, #213C84 100%);
    counter-reset: section;
    color: var(--bs-white);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.ul-why-choose-us-imgs {
    position: relative;
    width: max-content;
    max-width: 100%;
    z-index: 1;
}

@media screen and (max-width: 991px) {
    .ul-why-choose-us-imgs {
        margin: auto;
    }
}

@media screen and (max-width: 575px) {
    .ul-why-choose-us-imgs {
        margin-left: 0;
    }
}

.ul-why-choose-us-imgs::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: clamp(0px, 19.76vw, 376px);
    aspect-ratio: 360/495.42;
    border: 8px solid #DBE9A1;
    border-radius: 16px;
    left: clamp(122px, 7.99vw, 152px);
    top: clamp(84px, 6.52vw, 124px);
}

.ul-why-choose-us-imgs-vector {
    position: absolute;
    z-index: -1;
    border-radius: 0 !important;
    inset: calc(0% - clamp(18px, 1.47vw, 28px));
    right: auto;
    bottom: auto;
}

.ul-why-choose-us-imgs img {
    border-radius: clamp(10px, 0.84vw, 16px);
}

.ul-why-choose-us-imgs .img-1 {
    margin-bottom: clamp(33px, 3.47vw, 66px);
    max-width: clamp(405px, 26.8vw, 510px);
    aspect-ratio: 510/616;
    object-fit: cover;
    width: 100%;
}

.ul-why-choose-us-imgs .img-2 {
    max-width: clamp(256px, 16.08vw, 306px);
    aspect-ratio: 306/272;
    object-fit: cover;
}

.ul-why-choose-us-video-cover {
    position: absolute;
    bottom: 0;
    right: calc(0% - clamp(50px, 5.25vw, 100px));
}

@media screen and (max-width: 479px) {
    .ul-why-choose-us-video-cover {
        right: -10px;
    }
}

.ul-why-choose-us-video-cover a {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: clamp(46px, 2.94vw, 56px);
    aspect-ratio: 1/1;
    border-radius: 50%;
    background-color: var(--bs-c3);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .ul-why-choose-us-video-cover a:hover {
        background-color: var(--bs-primary);
        color: var(--bs-white);
    }

.ul-why-choose-us-descr {
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: clamp(16px, 1.68vw, 32px);
}

.ul-why-choose-us-point {
    display: flex;
    align-items: flex-start;
    gap: clamp(10px, 0.84vw, 16px);
    margin-bottom: clamp(14px, 1.16vw, 22px);
}

    .ul-why-choose-us-point::before {
        counter-increment: section;
        content: counter(section, decimal-leading-zero);
        width: clamp(46px, 2.94vw, 56px);
        aspect-ratio: 1/1;
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background: var(--bs-white);
        color: var(--bs-blue);
        border: 4px solid #f2f2f2;
        border-radius: 28.5px;
        font-size: clamp(17px, 1.05vw, 20px);
        font-weight: 800;
        letter-spacing: 0.5px;
    }

.ul-why-choose-us-point-title {
    font-size: clamp(20px, 1.26vw, 24px);
    font-weight: 800;
    letter-spacing: 0.5px;
    margin-bottom: clamp(6px, 0.63vw, 12px);
}

.ul-why-choose-us-point-descr {
    color: rgba(255, 255, 255, 0.7);
    font-size: clamp(13px, 0.84vw, 16px);
}

.ul-why-choose-us .ul-btn {
    display: inline-flex;
    background: transparent;
    border: 1px solid var(--bs-blue);
    color: var(--bs-white);
}

    .ul-why-choose-us .ul-btn:hover {
        background-color: var(--bs-blue);
    }

.ul-why-choose-us-vectors > * {
    position: absolute;
    z-index: -1;
}

.ul-why-choose-us-vectors .vector-1 {
    bottom: 0;
    left: 0;
}

.ul-why-choose-us-vectors .vector-2 {
    right: 0;
    bottom: 0;
}

.ul-section-sub-title {
    color: var(--bs-blue);
    border: 1px solid var(--bs-blue);
    display: inline-flex;
    align-items: center;
    gap: clamp(5px, 0.42vw, 8px);
    padding: clamp(3px, 0.26vw, 5px) clamp(12px, 0.89vw, 17px);
    margin-bottom: clamp(5px, 0.42vw, 8px);
    font-size: clamp(15px, 0.95vw, 18px);
    font-weight: 600;
}

    .ul-section-sub-title::after,
    .ul-section-sub-title::before {
        content: "";
        display: inline-block;
        background-color: var(--bs-blue);
        clip-path: polygon(92.305% 10.683%, 92.305% 10.683%, 88.796% 7.021%, 84.935% 4.125%, 80.804% 1.996%, 76.486% 0.631%, 72.062% 0.031%, 67.614% 0.195%, 63.226% 1.123%, 58.978% 2.814%, 54.953% 5.267%, 51.234% 8.483%, 51.234% 8.483%, 51.013% 8.672%, 50.776% 8.82%, 50.524% 8.925%, 50.264% 8.988%, 50% 9.01%, 49.736% 8.988%, 49.476% 8.925%, 49.224% 8.82%, 48.987% 8.672%, 48.767% 8.483%, 48.767% 8.483%, 45.047% 5.269%, 41.022% 2.819%, 36.774% 1.132%, 32.386% 0.209%, 27.938% 0.049%, 23.514% 0.651%, 19.196% 2.016%, 15.065% 4.143%, 11.204% 7.033%, 7.696% 10.683%, 7.696% 10.683%, 4.789% 14.885%, 2.575% 19.447%, 1.047% 24.277%, 0.197% 29.281%, 0.018% 34.365%, 0.503% 39.434%, 1.643% 44.396%, 3.433% 49.155%, 5.864% 53.62%, 8.929% 57.694%, 43.299% 96.839%, 43.299% 96.839%, 44.473% 97.977%, 45.758% 98.862%, 47.126% 99.494%, 48.549% 99.873%, 50% 100%, 51.451% 99.873%, 52.874% 99.494%, 54.242% 98.862%, 55.527% 97.977%, 56.702% 96.839%, 91.071% 57.694%, 91.071% 57.694%, 94.136% 53.62%, 96.567% 49.155%, 98.357% 44.396%, 99.497% 39.434%, 99.982% 34.365%, 99.803% 29.281%, 98.954% 24.277%, 97.425% 19.447%, 95.212% 14.885%, 92.305% 10.683%);
        width: clamp(17px, 1.05vw, 20px);
        aspect-ratio: 20/18;
    }

    .ul-section-sub-title::after {
        content: none;
    }
