.cta {
    position: relative;
    background: #D3D3D3;
    color: #3C3C3C;
}

.cta-text {
    padding: 70px 22px 60px;
}

.cta-text h2 {
    text-transform: uppercase;
    color: #3C3C3C;
}

.cta-text p {
    line-height: 1.68em;
    letter-spacing: 0.02em;
}

.cta-image {
    width: 100%;
    height: 290px;
}

.cta-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (min-width: 768px) {

    .cta-text {
        padding: 70px 52px;
    }

    .cta-image {
        height: 395px;
    }
}

@media (min-width: 1025px) {
    .cta-wrapper {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }

    .cta-image {
        width: 50%;
        height: auto;
        position: relative;
    }

    .cta-image img {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
    }

    .cta-info {
        width: 50%;
        position: relative;
    }

    .cta-info::before {
        content: "";
        position: absolute;
        top: 0;
        right: -285px;
        width: 290px;
        height: 100%;
        background: linear-gradient(to right,  rgba(211,211,211,1) 0%,rgba(211,211,211,0) 100%); 
        z-index: 1;
    }

    .cta-text {
        padding: 70px 50px 70px 16px;
        float: right;
    }
}

@media (min-width: 1025px) {
    .cta-text {
        padding: 70px 170px 74px 15px;
        float: right;
        max-width: 660px;
    }
}