/* OmniSEO CTA Styles */
.omniseo-cta {
    width: 100%;
    position: relative;
    border-radius: 8px;
    overflow: hidden;
}
.container .omniseo-cta .container {
    padding-left: 0!important;
    padding-right: 0!important;
}
.omniseo-cta .container {
    position: relative;
    z-index: 1;
}

.omniseo-cta .cta-body {
    display: flex;
    align-items: center;
    background: linear-gradient(0deg, rgba(204, 227.72, 255, 0.30) 0%, rgba(204, 227.72, 255, 0.30) 100%), #F9FBFF;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
}

.omniseo-cta .left-content {
    flex: 1;
    padding: 48px 64px;
    padding-right: 200px;
}

.omniseo-cta .content-wrapper {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.omniseo-cta .content-header {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.omniseo-cta h2,
.omniseo-cta h3 {
    color: #222222;
    font-size: 48px;
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    line-height: 56px;
    margin: 0;
}

.omniseo-cta .text-primary {
    color: #207DE9;
}

.omniseo-cta .description,
.omniseo-cta .description p {
    color: #222222;
    font-size: 21px;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    line-height: 35px;
    margin: 0;
}

.omniseo-cta .button-wrapper {
    display: flex;
    align-items: center;
}

.omniseo-cta .fx-btn.fx-primary-btn.has-arrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 16px 40px;
    background: #207DE9;
    color: white;
    font-size: 21px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    line-height: 28px;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.omniseo-cta .fx-btn.fx-primary-btn.has-arrow:hover {
    background: #1b67c7;
    transform: translateY(-2px);
}

.omniseo-cta .arrow-icon {
    width: 18.75px;
    height: 15.75px;
    transition: transform 0.3s ease;
}

.omniseo-cta .fx-btn.fx-primary-btn.has-arrow:hover .arrow-icon {
    transform: translateX(4px);
}

.omniseo-cta .right-image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.omniseo-cta .image-wrapper {
    position: relative;
    display: flex;
    height: 100%;
}

.omniseo-cta .right-image img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
    position: relative;
    z-index: 2;
}

/* Full-width variant (default) */

.omniseo-cta.variant-full-width .right-image img {
    width: 306px;
}
.omniseo-cta.variant-full-width .right-image {
    position: absolute;
    right: 0;
    top: 0;
}
.omniseo-cta.variant-full-width .cta-body {
    margin-right: 100px;
}


@media screen and (min-width: 992px) {
    .omniseo-cta.variant-full-width .button-wrapper .fx-primary-btn {
        font-size: 21px!important;
        font-style: normal!important;
        font-weight: 700!important;
        line-height: 28px!important; /* 133.333% */
        letter-spacing: -0.168px!important;
        
    }
}

/* In-content variant */


.omniseo-cta.variant-in-content .cta-body {
    flex-direction: column;
    margin: 0 auto;
    margin-right: 100px;
}

.omniseo-cta.variant-in-content .left-content {
    padding: 40px;
    text-align: center;
    padding-right: 180px;
}

.omniseo-cta.variant-in-content .content-header {
    align-items: center;
    text-align: left;
}
.omniseo-cta.variant-in-content .content-header h2 {
    font-size: 32px;
    font-style: normal;
    font-weight: 800;
    line-height: 40px; /* 125% */
    letter-spacing: -1.152px;


}
.omniseo-cta .content-wrapper {
    align-items: flex-start;
}

.omniseo-cta.variant-in-content .button-wrapper {
    justify-content: center;
}

.omniseo-cta.variant-in-content .right-image {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
}

.omniseo-cta.variant-in-content .right-image img {
    width: 100%;
    max-width: 245px;
}

.omniseo-cta.variant-in-content .cta-main-wrapper {
    max-width: 748px;
    position: relative;
}

/* Sidebar variant */
.omniseo-cta.variant-sidebar .cta-body {
    flex-direction: column;
    padding: 24px;
    padding-top: 80px;
}

.omniseo-cta.variant-sidebar .cta-main-wrapper {
    width: 100%;
    display: flex;
    flex-direction: column;

}

.omniseo-cta.variant-sidebar .left-content {
    padding: 0;
    text-align: center;
}

.omniseo-cta.variant-sidebar .content-header {
    align-items: center;
}
.omniseo-cta.variant-sidebar .content-header h2 {
    font-family: Inter;
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    line-height: 30px;
    letter-spacing: -0.864px;

    
}


.omniseo-cta.variant-sidebar .fx-btn.fx-primary-btn.has-arrow {
    text-align: center!important; 
    font-size: 18px!important;
    font-style: normal!important;
    font-weight: 700!important;
    line-height: 24px!important; /* 133.333% */
    letter-spacing: -0.144px!important;    
}

.omniseo-cta.variant-sidebar .button-wrapper {
    justify-content: center;
    width: 100%;
}

.omniseo-cta.variant-sidebar .right-image {
    width: 100%;
    order: -1;
    position: relative;
    bottom: -65px;
}

.omniseo-cta.variant-sidebar .right-image img {
    width: 100%;
    max-width: 250px;
}

/* Responsive Styles */

/* Tablet styles (max-width: 991px) */
@media screen and (max-width: 991px) {
    /* Full-width variant should look like in-content on tablet */
    .omniseo-cta.variant-full-width .cta-body {
        flex-direction: column;
        margin: 0 auto;
        margin-right: 100px;
    }
    
    .omniseo-cta.variant-full-width .left-content {
        padding: 40px;
        text-align: center;
        padding-right: 180px;
    }
    
    .omniseo-cta.variant-full-width .content-header {
        align-items: center;
        text-align: left;
    }
    
    .omniseo-cta.variant-full-width .content-header h2 {
        font-size: 32px;
        font-style: normal;
        font-weight: 800;
        line-height: 40px;
        letter-spacing: -1.152px;
    }
    
    .omniseo-cta.variant-full-width .button-wrapper {
        justify-content: center;
    }
    
    .omniseo-cta.variant-full-width .right-image {
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
    }
    
    .omniseo-cta.variant-full-width .right-image img {
        width: 100%;
        max-width: 245px;
    }
    
    .omniseo-cta.variant-full-width .cta-main-wrapper {
        max-width: 748px;
        position: relative;
    }
}

/* Mobile styles (max-width: 767px) */
@media screen and (max-width: 767px) {
    /* Full-width variant should look like sidebar on mobile */
    .omniseo-cta.variant-full-width .cta-body {
        flex-direction: column;
        padding: 24px;
        padding-top: 80px;
        margin-right: 0;
    }
    
    .omniseo-cta.variant-full-width .cta-main-wrapper {
        width: 100%;
        display: flex;
        flex-direction: column;
    }
    
    .omniseo-cta.variant-full-width .left-content {
        padding: 0;
        text-align: center;
    }
    
    .omniseo-cta.variant-full-width .content-header {
        align-items: center;
        text-align: center;
    }
    
    .omniseo-cta.variant-full-width .content-header h2,
    .omniseo-cta.variant-full-width .content-header h3 {
        font-family: Inter;
        font-size: 24px;
        font-style: normal;
        font-weight: 800;
        line-height: 30px;
        letter-spacing: -0.864px;
        text-align: center;
    }
    
    .omniseo-cta.variant-full-width .description,
    .omniseo-cta.variant-full-width .description p {
        text-align: center;
    }
    
    .omniseo-cta.variant-full-width .content-wrapper {
        align-items: center;
    }
    
    .omniseo-cta.variant-full-width .fx-btn.fx-primary-btn.has-arrow {
        text-align: center!important;
        font-size: 18px!important;
        font-style: normal!important;
        font-weight: 700!important;
        line-height: 24px!important;
        letter-spacing: -0.144px!important;
    }
    
    .omniseo-cta.variant-full-width .button-wrapper {
        justify-content: center;
        width: 100%;
    }
    
    .omniseo-cta.variant-full-width .right-image {
        width: 100%;
        order: -1;
        position: relative;
        bottom: -65px;
        right: auto;
        top: auto;
        height: auto;
    }
    
    .omniseo-cta.variant-full-width .right-image img {
        width: 100%;
        max-width: 250px;
    }
    
    /* In-content variant should look like sidebar on mobile */
    .omniseo-cta.variant-in-content .cta-body {
        flex-direction: column;
        padding: 24px;
        padding-top: 80px;
        margin-right: 0;
    }
    
    .omniseo-cta.variant-in-content .cta-main-wrapper {
        width: 100%;
        display: flex;
        flex-direction: column;
    }
    
    .omniseo-cta.variant-in-content .left-content {
        padding: 0;
        text-align: center;
    }
    
    .omniseo-cta.variant-in-content .content-header {
        align-items: center;
        text-align: center;
    }
    
    .omniseo-cta.variant-in-content .content-header h2,
    .omniseo-cta.variant-in-content .content-header h3 {
        font-family: Inter;
        font-size: 24px;
        font-style: normal;
        font-weight: 800;
        line-height: 30px;
        letter-spacing: -0.864px;
        text-align: center;
    }
    
    .omniseo-cta.variant-in-content .description,
    .omniseo-cta.variant-in-content .description p {
        text-align: center;
    }
    
    .omniseo-cta.variant-in-content .content-wrapper {
        align-items: center;
    }
    
    .omniseo-cta.variant-in-content .fx-btn.fx-primary-btn.has-arrow {
        text-align: center!important;
        font-size: 18px!important;
        font-style: normal!important;
        font-weight: 700!important;
        line-height: 24px!important;
        letter-spacing: -0.144px!important;
    }
    
    .omniseo-cta.variant-in-content .button-wrapper {
        justify-content: center;
        width: 100%;
    }
    
    .omniseo-cta.variant-in-content .right-image {
        width: 100%;
        order: -1;
        position: relative;
        bottom: -65px;
        right: auto;
        top: auto;
        height: auto;
    }
    
    .omniseo-cta.variant-in-content .right-image img {
        width: 100%;
        max-width: 250px;
    }
    
    /* Sidebar variant - update to ensure 100% width */
    .omniseo-cta.variant-sidebar .cta-main-wrapper {
        width: 100%;
        max-width: none;
    }
}

/* Parent-based Layout Overrides */

/* When full-width variant is inside wysiwyg content wrapper, use in-content layout */
.wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .cta-body {
    flex-direction: column;
    margin: 0 auto;
    margin-right: 100px;
}

.wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .left-content {
    padding: 40px;
    text-align: center;
    padding-right: 180px;
}

.wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .content-header {
    align-items: center;
    text-align: left;
}

.wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .content-header h2 {
    font-size: 32px;
    font-style: normal;
    font-weight: 800;
    line-height: 40px;
    letter-spacing: -1.152px;
}

.wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .content-wrapper {
    align-items: flex-start;
}

.wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .button-wrapper {
    justify-content: center;
}

.wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .right-image {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
}

.wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .right-image img {
    width: 100%;
    max-width: 245px;
}

.wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .cta-main-wrapper {
    max-width: 748px;
    position: relative;
}

/* When full-width variant is inside sidebar container, use sidebar layout */
.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .cta-body {
    flex-direction: column;
    padding: 24px;
    padding-top: 80px;
    margin-right: 0;
}

.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .cta-main-wrapper {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .left-content {
    padding: 0;
    text-align: center;
}

.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .content-header {
    align-items: center;
}

.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .content-header h2 {
    font-family: Inter;
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    line-height: 30px;
    letter-spacing: -0.864px;
}

.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .content-wrapper {
    align-items: center;
}

.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .fx-btn.fx-primary-btn.has-arrow {
    text-align: center!important;
    font-size: 18px!important;
    font-style: normal!important;
    font-weight: 700!important;
    line-height: 24px!important;
    letter-spacing: -0.144px!important;
}

.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .button-wrapper {
    justify-content: center;
    width: 100%;
}
.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .right-image {
    position: relative;
    order: -1;
}
.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .right-image .image-wrapper {
    width: 100%;
    position: relative;
    bottom: -65px;
    justify-content: center;
    align-items: center;
}

.wysiwyg.sidebar-enabled .sidebar-container .omniseo-cta.variant-full-width .right-image img {
    width: 100%;
    max-width: 250px;
}

/* Mobile styles for parent-based layouts */
@media screen and (max-width: 767px) {
    /* When full-width variant is inside wysiwyg content wrapper, use sidebar layout on mobile */
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .cta-body {
        flex-direction: column;
        padding: 24px;
        padding-top: 80px;
        margin-right: 0;
    }
    
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .cta-main-wrapper {
        width: 100%;
        display: flex;
        flex-direction: column;
    }
    
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .left-content {
        padding: 0;
        text-align: center;
    }
    
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .content-header {
        align-items: center;
        text-align: center;
    }
    
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .content-header h2,
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .content-header h3 {
        font-family: Inter;
        font-size: 24px;
        font-style: normal;
        font-weight: 800;
        line-height: 30px;
        letter-spacing: -0.864px;
        text-align: center;
    }
    
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .description,
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .description p {
        text-align: center;
    }
    
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .content-wrapper {
        align-items: center;
    }
    
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .fx-btn.fx-primary-btn.has-arrow {
        text-align: center!important;
        font-size: 18px!important;
        font-style: normal!important;
        font-weight: 700!important;
        line-height: 24px!important;
        letter-spacing: -0.144px!important;
    }
    
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .button-wrapper {
        justify-content: center;
        width: 100%;
    }
    
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .right-image {
        width: 100%;
        order: -1;
        position: relative;
        bottom: -65px;
        right: auto;
        top: auto;
        height: auto;
    }
    
    .wysiwyg.sidebar-enabled .wysiwyg__content-wrapper .omniseo-cta.variant-full-width .right-image img {
        width: 100%;
        max-width: 250px;
    }
}

