.flex_layout.footer_cta .flex_layout_wrapper{
    background-image: linear-gradient(180deg, transparent 50%, var(--sandstone) 50%);
}
.flex_layout.footer_cta .cta_container{
    grid-column: 2 / 12;
    width: 100%;
    display: flex;
    gap: 2rem;
}


.flex_layout.footer_cta .background_image,
.flex_layout.footer_cta .content_wrapper{
    background: var(--mahogany);
    border-radius: 1.5rem;
    color: var(--ivory);
}

.flex_layout.footer_cta .content_wrapper{
    width: 100%;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.flex_layout.footer_cta .style_backdrop{
    z-index: -1;
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    display: inline-block;
}



.flex_layout.footer_cta .content_wrapper .circle_1,
.flex_layout.footer_cta .content_wrapper .circle_2{
    position: absolute;
    aspect-ratio: 1;
    background: linear-gradient(180deg, #AF9676 0%, #644E41 100%);
    transform: rotate(-90deg);
    border-radius: 100%;
}

.flex_layout.footer_cta .content_wrapper .circle_1{
    left: -50px;
    top: -50px;
    height: 60%;
}

.flex_layout.footer_cta .content_wrapper .circle_2{
    right: -50px;
    bottom: -50px;
    height: 80%;
}



/* Base styles - fallback for other browsers */
.flex_layout.footer_cta .content_wrapper .background_layer {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    background: rgba(255, 255, 255, 0.01);
    backdrop-filter: blur(120px);
    -webkit-backdrop-filter: blur(120px);
}

/* Chrome ONLY - Optimized blur */
@supports (-webkit-appearance: none) and (not (-moz-appearance: none)) and (not (-webkit-hyphens: none)) {
    .flex_layout.footer_cta .content_wrapper .background_layer {
        background: rgba(255, 255, 255, 0.01);
        backdrop-filter: blur(25px) contrast(1.15) brightness(1.08);
        -webkit-backdrop-filter: blur(25px) contrast(1.15) brightness(1.08);
        transform: translateZ(0);
        will-change: transform;
    }
}

/* Safari ONLY - Keep your original strong blur */
@supports (-webkit-hyphens: none) and (not (background: -webkit-named-image(i))) {
    .flex_layout.footer_cta .content_wrapper .background_layer {
        background: rgba(255, 255, 255, 0.01);
        backdrop-filter: blur(120px);
        -webkit-backdrop-filter: blur(125px);
    }
}

.flex_layout.footer_cta .content_wrapper > div{
    color: var(--ivory);
}

.flex_layout.footer_cta .content_wrapper > div :where(h1,h2,h3,h4,h5,h6){
    color: inherit;
    max-width: 80%;
}

.flex_layout.footer_cta .content_wrapper{
    padding: 3rem;
}

.flex_layout.footer_cta .buttons{
    margin-top: 1.5rem;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
    align-items: center;
}

.flex_layout.footer_cta .buttons .contact{
    display: flex;
    gap: 1rem;
    color: var(--ivory);
}

.flex_layout.footer_cta .buttons .contact,
.flex_layout.footer_cta .buttons .contact:is(:hover,:active,:focus){
    text-decoration: none;
}

.flex_layout.footer_cta .buttons .contact .avatars{
    border-radius: 5rem;
    padding: .25rem;
    background-color: currentColor;
}

.flex_layout.footer_cta .buttons .contact .avatars img{
    max-height: 3rem; width: auto;
    aspect-ratio: 1;
    border-radius: 50%;
}

.flex_layout.footer_cta .buttons .contact .avatars img:not(:first-child){
    margin-left: -1.5rem;
}

.flex_layout.footer_cta .buttons .contact .title{
    font-weight: var(--body-semibold);
    display: flex;
    gap: .5rem;
    align-items: center;
}

.flex_layout.footer_cta .buttons .contact .title::after{
    content: '';
    width: 1em; height: 1em;
    background-color: currentColor;
    mask: url(/wp-content/uploads/2025/08/arrow_right.svg) no-repeat center / contain;
    -webkit-mask: url(/wp-content/uploads/2025/08/arrow_right.svg) no-repeat center / contain;
}


@media only screen and (max-width: 1024px){
    .flex_layout.footer_cta .cta_container{
        grid-column: 1 / -1;
    }
    
    .flex_layout.footer_cta .content_wrapper{
        padding-block: 2rem;
        padding-inline: 2rem;
    }
}

@media only screen and (max-width: 767px){
    .flex_layout.footer_cta .content_wrapper{
        padding-block: 1.5rem;
        padding-inline: 1.5rem;
    }

    .flex_layout.footer_cta .buttons .contact{
        gap: .5rem;
        flex-direction: column;
    }

    .flex_layout.footer_cta .buttons .contact .avatars{
        width: fit-content;
    }
    
    .flex_layout.footer_cta .background_image{
        display: none;
    }
}