.cta {
    position: relative;
    z-index: 1;
}

.cta::before {
    content: '';
    z-index: -1;
    position: absolute;
    width: 100%;
    height: 50%;
    bottom: 0;
    left: 0;
    background: transparent;
}

.cta__wrap {
    background: var(--color-tertiary);
    padding: 35px;
}

.cta__left {
    padding-bottom: 22px;
}

.cta__left h2,
.cta__left p {
    color: var(--color-white);
}

@media (min-width: 768px) {
    .cta__wrap {
        padding: 40px 58px;
    }
}

@media (min-width: 1200px) {
    .cta__wrap {
        padding: 40px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .cta__left,
    .cta__right {
        width: 50%;
    }
}

@media (min-width: 1366px) {
    .cta__left {
        width: 55%;
    }

    .cta__right {
        width: 45%
    }
}

@media (min-width: 1367px) {
    .cta__wrap {
        padding: 40px 67px;
    }
}