.flex_layout.stappen_met_cta .content_wrapper{
    grid-column: 1 / 5;
}

.flex_layout.stappen_met_cta .content_wrapper h2{
    font-size: var(--heading-5);
    max-width: 80%;
}

.flex_layout.stappen_met_cta .stap_container{
    grid-column: 5 / -1;
    counter-reset: stapCount;

    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 4rem 1.5rem;
}

.flex_layout.stappen_met_cta .stap{
    counter-increment: stapCount;
}

.flex_layout.stappen_met_cta .stap h4{
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.flex_layout.stappen_met_cta .stap .count{
    padding-bottom: 2rem;
    border-bottom: 1px solid;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: .5rem;
}

.flex_layout.stappen_met_cta .stap .count::before{
    content: '';
    width: .75rem; aspect-ratio: 1;
    border-radius: 50%;
    background-color: currentColor;
}

.flex_layout.stappen_met_cta .stap .count::after{
    content: counter(stapCount, decimal-leading-zero);
}

.flex_layout.stappen_met_cta .stap .content{
    max-width: 460px;
}


@media only screen and (max-width: 1024px){
    .flex_layout.stappen_met_cta .content_wrapper,
    .flex_layout.stappen_met_cta .stap_container{
        grid-column: 1/-1;
    }

    .flex_layout.stappen_met_cta .content_wrapper{
        margin-bottom: 2rem;
    }

    .flex_layout.stappen_met_cta .stap .count{
        padding-bottom: 1rem;
    }
    .flex_layout.stappen_met_cta .stap h4{
        margin-top: 1rem;
    }
}

@media only screen and (max-width: 767px){
    .flex_layout.stappen_met_cta .stap_container{
        grid-template-columns: 1fr;
    }
}