/* Force the whole item wrapper to behave on desktop */
.features04 .item.features-image .item-wrapper {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    min-height: 420px !important;          /* match your image height */
    max-width: 1280px !important;          /* or whatever fits your layout; prevents over-stretch */
    margin: 0 auto !important;             /* center if desired */
    visibility: visible !important;
    opacity: 1 !important;
}

/* Add space between the heading ("We Now Offer 2 Options") and the cards below */
.features04 .title-wrapper {
    margin-bottom: 60px !important;   /* Adjust this value: 40px = subtle, 80px = more generous */
}

/* Image side - fixed size */
.features04 .item.features-image .item-img {
    flex: 0 0 640px !important;
    width: 640px !important;
    height: 420px !important;
    min-height: 420px !important;
}

.features04 .item.features-image .item-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 15px 15px 15px 15px !important;
    display: block !important;
}

/* Green card side - force visible, same height, green BG */
.features04 .item.features-image.active .card-box.card-wrap,
.features04 .item.features-image .card-box.card-wrap {  /* target both active/non-active if needed */
    display: flex !important;              /* flex to center content vertically */
    flex-direction: column !important;
    justify-content: center !important;
    background-color: #caf31d !important;
    color: #000 !important;                /* ensure text visible if contrast issue */
    visibility: visible !important;
    opacity: 1 !important;
    min-height: 420px !important;          /* match image height */
    height: 420px !important;              /* or auto if content varies */
    flex: 1 !important;
    padding: 40px 30px !important;
    border-radius: 15px 15px 15px 15px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15) !important;
    margin: 0 !important;
}

/* Mobile stacking - keep what works */
@media (max-width: 991px) {
    .features04 .item.features-image .item-wrapper {
        flex-direction: column !important;
        max-width: 100% !important;
        min-height: auto !important;
    }
    .features04 .item.features-image .item-img {
        flex: 0 0 auto !important;
        width: 100% !important;
        height: auto !important;
    }
    .features04 .item.features-image .item-img img {
        border-radius: 15px 15px 15px 15px !important;
        height: auto !important;
    }
    .features04 .item.features-image.active .card-box.card-wrap {
        border-radius: 15px 15px 15px 15px !important;
        min-height: auto !important;
        height: auto !important;
    }
}