/* ================================================
   HISHAM CTA - STYLE 4 (Split Layout CTA)
================================================ */

.hisham-cta-style-4 {
    display: flex;
    width: 100%;
    overflow: hidden;
}

/* LEFT PANEL (IMAGE) */
.hisham-cta-style-4-left {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.hisham-cta-style-4-left img {
    width: 100%;
    height: 100%;
    object-fit: var(--left-img-fit, cover);
    object-position: var(--left-img-position, center center);
}

/* RIGHT PANEL (CONTENT) */
.hisham-cta-style-4-right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 40px;
    background: var(--right-bg, #ffffff);
}

/* Title */
.hisham-cta-style-4-right .cta-title {
    font-size: var(--title-size, 3rem);
    font-weight: var(--title-weight, 700);
    color: var(--title-color, #000);
    margin: 0 0 15px 0;
}

/* Title gradients */
.hisham-cta-title-gradient-1 { background: linear-gradient(90deg, #024035, #9a6404); }
.hisham-cta-title-gradient-2 { background: linear-gradient(90deg, #000000, #ffffff); }
.hisham-cta-title-gradient-3 { background: linear-gradient(90deg, #024035, #ffffff); }
.hisham-cta-title-gradient-4 { background: linear-gradient(90deg, #9a6404, #ffffff); }

.cta-title.cta-gradient-text {
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow: none !important;
}

/* Description 1 & 2 */
.hisham-cta-style-4-right .cta-desc {
    font-size: var(--desc-size, 1rem);
    margin-bottom: 20px;
}

.hisham-cta-style-4-right .cta-desc2 {
    font-size: var(--desc2-size, 0.9rem);
    margin-top: 20px;
    opacity: 0.8;
}

/* Shortcode container */
.hisham-cta-style-4-shortcode {
    margin: 20px 0;
}

/* MOBILE */
@media (max-width: 767px) {
    .hisham-cta-style-4 {
        flex-direction: column;
    }

    .hisham-cta-style-4-left,
    .hisham-cta-style-4-right {
        width: 100% !important;
    }

    .hisham-cta-style-4-right {
        padding: 25px;
    }
}

.hisham-cta-style-4-mobile-image {
    display: none;
    width: 100%;
    text-align: center;
}

.hisham-cta-style-4-mobile-image img {
    width: 100%;
    height: auto;
    display: block;
}

@media (max-width: 767px) {

    .hisham-cta-style-4-left {
        display: none !important;
    }

    .hisham-cta-style-4-mobile-image {
        display: block !important;
        margin-bottom: 20px;
    }
}