.smaller-cta {
    position: relative;
    padding: 50px 22px;
    overflow: hidden;
    color: #000000;
}

.smaller-cta--yellow {
    background: linear-gradient(87deg, rgba(245,245,245,1) 0%, rgba(253,187,18,1) 100%);
}

.smaller-cta--gray {
    background: linear-gradient(87deg, rgba(243,243,243,1) 0%, rgba(224,225,226,1) 100%);
}

.smaller-cta--black {
    background: linear-gradient(87deg, rgba(0,0,0,1) 0%, rgba(50,50,50,1) 100%);
    color: #fff;
}

.smaller-cta__bg {
    position: absolute;
    left: -362px;
    width: 691px;
    max-width: unset;
    top: 0;
}

.smaller-cta__bg {
    height: auto;
}

.smaller-cta__heading {
    position: relative;
    z-index: 1;
}

.smaller-cta__content {
    position: relative;
    z-index: 1;
}

.smaller-cta--yellow .sub-heading,
.smaller-cta--gray .sub-heading {
    color: #000000;
}

.smaller-cta__heading .sub-heading {
    margin-bottom: 10px;
}

.smaller-cta--yellow .btn {
    background: #fff;
}

.smaller-cta--black p {
    color: #fff;
}

.smaller-cta--black h2 {
    color: #fff;
}

.smaller-cta__content .btn {
    margin: 10px 0 0;
}

.smaller-cta.fx-cat-family:has(+ .section-padding){
    margin-bottom: 0;
}

.smaller-cta--yellow + .image-buttons--inner.bg-white{
    padding-top: 0;
}

/* .image-buttons--inner.bg-w+ .smaller-cta{
    margin-top: 0;
} */

.smaller-cta + .bg-white {
    padding-top: 0;
}
.smaller-cta--black {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.half-and-half-image-texture + .smaller-cta{
 margin-top : 0 ;
}
@media(min-width: 768px) {
    .smaller-cta {
        padding: 80px 58px;
        margin: 80px 0;
    }

    .smaller-cta + .smaller-cta {
        margin-top: -40px;
    }

    .smaller-cta__heading h2 {
        margin: 0 0 16px;
    }

    .smaller-cta__bg {
        left: -388px;
        width: 865px;
        top: -94px;
    }

    .smaller-cta__content .btn {
        margin-top: 10px;
    }

    .smaller-cta:after {
        content: "";
        position: absolute;
        right: 0;
        bottom: 0;
        clip-path: polygon(100% 0, 0% 100%, 100% 100%);
        width: 227px;
        height: 447px;
    }

    .smaller-cta--yellow:after {
        background: linear-gradient(97deg, rgba(245, 245, 245, 1) 0%, rgba(253, 187, 18, 1) 90%);
    }
}

@media(min-width: 1200px) {
    .smaller-cta {
        padding: 77px 105px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 100px 63px;
        min-height: 368px;
    }

    .smaller-cta + .smaller-cta {
        margin-top: -50px;
    }

    .smaller-cta:after {
        display: none;
    }

    .smaller-cta__bg {
        left: -164px;
        width: 782px;
        top: -16px;
    }

    .smaller-cta__heading {
        width: 331px;
    }

    .smaller-cta__content {
        width: calc(100% - 331px);
        padding-left: 93px;
    }
    .smaller-cta__content.align-cta-right{
        padding-left: 20px;
    }
    .smaller-cta__content.align-cta-right .btn {
        margin-top: 0;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translate(0, -50%);
    }

    .smaller-cta__heading h2 {
        margin: 0;
        line-height: 1.090em;
    }

    .smaller-cta--black:after {
        width: 408px;
        display: block;
        background: linear-gradient(110deg, rgba(34, 34, 34, 1) 50%, rgba(0, 0, 0, 1) 110%);
        height: 100%;
        clip-path: polygon(45% 0, 100% 0, 100% 100%, 0% 100%);
    }
}

@media(min-width: 1336px) {
    .smaller-cta__content.align-cta-right {
        padding-left: 93px;
    }
}

@media(min-width: 1600px) {
    .smaller-cta__heading {
        width: 525px;
    }

    .smaller-cta__content {
        width: calc(100% - 525px);
        padding-left: 78px;
        padding-right: 426px;
    }

    .smaller-cta__content:not(.align-cta-right) .btn {
        margin-top: 0;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translate(0, -50%);
    }

    .smaller-cta__content p {
        margin: 0;
    }

    .smaller-cta {
        padding: 74px 90px 74px 144px;
        margin: 115px 0;
        min-height: 371px;
    }

    .smaller-cta + .smaller-cta {
        margin-top: -40px;
    }

    .smaller-cta--black:after {
        width: 413px;
    }

    .smaller-cta--black .smaller-cta__bg {
        left: -294px;
        width: 995px;
        top: -286px;
    }

    .smaller-cta--long-heading .smaller-cta__content p {
        display: none;
    }

    .smaller-cta--long-heading .smaller-cta__heading {
        width: 653px;
    }

    .smaller-cta--long-heading .smaller-cta__content {
        width: calc(100% - 653px);
        padding-left: 93px;
        padding-right: 150px;
    }

    .smaller-cta--yellow .smaller-cta__bg {
        left: unset;
        width: 652px;
        top: 0;
        right: -73px;
    }

    .smaller-cta--gray .smaller-cta__bg {
        left: unset;
        width: 530px;
        top: 0;
        right: -40px;
    }

    .smaller-cta--yellow .smaller-cta__content .btn {
        background: #222222;
        color: #fff;
    }
}