.cta-wrap {
    display: inline-block;
    padding: 80px 0;
    position: relative;
    width: 100%;
}

.cta-wrap:before {
    background: radial-gradient(ellipse 800px 400px at 50% 100%, rgba(200, 230, 255, 0.4) 0%, rgba(190, 220, 255, 0.2) 100%);
    background-position: 0;
    background-position: top;
    background-repeat: no-repeat;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transform: translateY(61%);
    width: 100%;
}

.cta-wrap>div {
    position: relative;
    z-index: 9
}

.cta-otr {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.cta-left {
    width: 60%
}

.cta-left,
.cta-rgt {
    border: 4px solid #000;
    position: relative
}

.cta-rgt {
    background-color: #000;
    transition: all .5s ease;
    width: 38%
}

.cta-rgt:hover {
    background-color: #4da3ff;
    border: 4px solid #4da3ff;
    transition: all .5s ease
}

.cta-rgt:hover .cta-title h4 {
    color: #000;
    transition: all .5s ease
}

.cta-rgt:hover .cta-arrow img {
    filter: brightness(1) invert(0);
    transition: all .5s ease
}

.cta-left-inr {
    padding: 90px 50px
}

.cta-header {
    max-width: 500px
}

.cta-btn {
    padding-top: 30px
}

.cta-rgt-inr {
    padding: 50px
}

.cta-link a {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.cta-title {
    max-width: 250px;
    padding-bottom: 10px;
    padding-top: 70px
}

.cta-title h4 {
    color: #fff
}

.cta-arrow img {
    filter: brightness(0) invert(1)
}

@media (max-width:1080px) {
    .cta-left {
        border: 2px solid #000;
        width: 100%;
    }

    .cta-rgt {
        margin-top: 30px;
        width: 100%;
    }

    .cta-left-inr {
        padding: 50px 30px
    }

    .cta-btn {
        padding-top: 10px
    }

    .cta-title {
        padding-top: 20px
    }

    .cta-wrap:before {
        background-position: bottom;
        display: none;
        transform: none
    }
}

@media (max-width:767px) {
    .cta-left-inr {
        padding: 40px 20px
    }

    .cta-rgt-inr {
        padding: 20px
    }

    .cta-arrow img {
        max-width: 50px !important
    }
}