.cards-v2-4-across.has-bg {
    background-color: var(--sw-key-color);
    padding-block: 45px;
    position: relative;

    &::before,
    &::after {
        content: '';
        pointer-events: none;
        position: absolute;
        left: 50%;
        display: block;
        width: 100%;
        height: 13px;
        background-image: url(/includes/public/assets/shared/mtn-pattern-olive.svg);
        background-repeat: no-repeat;
        background-position: 50% 50%;
        background-size: 1920px;
    }

    
    &::before {
        top: 0;
        translate: -50% -100%;
    }
    &::after {
        transform-origin: center;
        rotate: 180deg;
        bottom: 0;
        translate: -50% 95%;
    }

    & .widget-title,
    & .widget-subtitle,
    & .widget-desc {
        color: var(--white);
    }

    & .widget-view-all {
        background-color: var(--white);
        color: var(--black-11);
    }

    & .content-section {
        background-color: var(--white);
    }
}

.cards-v2-4-across .slides {
    max-width: 1200px;
}

.cards-v2-4-across .slide-top {
    margin-block-end: 0;
}

.cards-v2-4-across .content-section {
    border-radius: 0 0 15px 15px;
    padding: 10px 20px 20px;
}

.cards-v2-4-across .slide-title {
    font-size: 1.25rem;
    line-height: calc(24/20);
}

.cards-v2-4-across .slide-desc {
    font-size: 1rem;
    line-height: calc(24/16);
}

@media screen and (min-width: 64em) {
    .cards-v2-4-across.has-bg {
        padding-block: 100px 85px;
    }

    .cards-v2-4-across .slide-title {
        font-size: 1.5rem;
        line-height: calc(33/24);
    }

    .cards-v2-4-across .slide-desc {
        font-size: 1.25rem;
        line-height: calc(30/20);
    }
}