.capabilities__wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 20px
}

@media (min-width: 760px) {
    .capabilities__wrapper {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

.capabilities__content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    max-width: 740px
}

.capabilities__label {
    color: var(--primary)
}

.capabilities__title {
    color: var(--black)
}

.capabilities__text {
    color: var(--gray-500);
    margin-top: 20px
}

@media (min-width: 1200px) {
    .capabilities__wrapper {
        gap: 60px
    }

    .capabilities__text {
        margin-top: 40px
    }

    .capabilities__btn {
        padding-left: 23px
    }
}

.capabilities__btn-wrapper {
    margin-top: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media (min-width: 1200px) {
    .capabilities__btn-wrapper {
        margin-top: 40px;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

.capabilities__image {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0
}

.capabilities__image-col {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    max-width: 800px
}

.capabilities__image-wrapper {
    position: relative;
    padding-bottom: 58.75%;
    min-height: 368px;
    border-radius: 12px;
    overflow: hidden
}

.capabilities__image-wrapper::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 53, 97, .45)), to(rgba(0, 53, 97, .45)));
    background: linear-gradient(0deg, rgba(0, 53, 97, .45) 0, rgba(0, 53, 97, .45) 100%);
    pointer-events: none
}

.capabilities__cards {
    margin-top: 20px;
    padding-right: 15px;
    padding-left: 15px;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns:(1fr) [ 1 ];
    grid-template-columns:repeat(1, 1fr)
}

@media (min-width: 760px) {
    .capabilities__cards {
        padding-right: 0;
        padding-left: 0;
        -ms-grid-columns:(1fr) [ 2 ];
        grid-template-columns:repeat(2, 1fr)
    }
}

@media (min-width: 1200px) {
    .capabilities__image-wrapper {
        border-radius: 28px
    }

    .capabilities__cards {
        margin-top: 40px;
        -ms-grid-columns:(1fr) [ 4 ];
        grid-template-columns:repeat(4, 1fr)
    }

    .capabilities__card:hover {
        background-color: var(--black)
    }

    .capabilities__card:hover .capabilities__card-number, .capabilities__card:hover .capabilities__card-text {
        color: var(--white)
    }
}

.capabilities__card {
    border: 1px solid var(--black-18);
    background-color: var(--white);
    padding: 22px 24px;
    margin: -1px;
    min-height: 116px;
    -webkit-transition: background-color var(--transition);
    transition: background-color var(--transition)
}

.capabilities__card:not([href]) {
    cursor: default
}

.capabilities__card-number {
    color: vaR(--primary);
    font-size: var(--text-size-12);
    font-weight: var(--fw-normal);
    line-height: 1.33;
    letter-spacing: .13rem;
    text-transform: uppercase;
    -webkit-transition: color var(--transition);
    transition: color var(--transition)
}

.capabilities__card-text {
    color: var(--black);
    font-size: var(--text-size);
    font-weight: var(--fw-normal);
    line-height: 1.35;
    margin-top: 9.5px;
    -webkit-transition: color var(--transition);
    transition: color var(--transition)
}

@media (min-width: 1200px) {
    .capabilities__card-number {
        letter-spacing: .015rem
    }

    .capabilities__card-text {
        line-height: var(--lh-md)
    }
}