/* =========================================================================
 * layout-fixes.css  —  ADDITIVE ONLY
 *
 * New classes/rules to fix two static-export bugs on the service-card grids
 * WITHOUT modifying any existing rule and WITHOUT touching hover animations.
 *
 *  1. Service card images are wrapped in `.thumb` divs that the plugin JS
 *     upgrades at runtime to `.thumb.reveal ... revealBottom2`. Those reveal
 *     rules set `visibility:hidden; opacity:0` and rely on a scroll-triggered
 *     entrance animation that never completes in this static export, so the
 *     photos stay invisible (blank / broken boxes).
 *
 *  2. On the grids the photos render at unequal natural heights, so the three
 *     cards fall out of vertical alignment (middle card sits higher, side
 *     cards' buttons get pushed down).
 *
 * Everything below is scoped to the new `.rbc-cards-fix` marker class added
 * on the relevant sections, so no other part of the site is affected.
 * ========================================================================= */

/* --- 1. Keep the reveal-animated photos permanently visible ------------- */
/* Force both the .inner wrapper (targeted by `.reveal>*`) and the <img>
 * (targeted by `.reveal.revealBottom2 img`) to their visible end-state.
 * This only overrides the entrance-reveal opacity/visibility — it does not
 * touch any :hover rule, so hover effects keep working. */
.rbc-cards-fix .master-image-box .thumb-wrap .thumb,
.rbc-cards-fix .master-image-box .thumb-wrap .thumb > .inner,
.rbc-cards-fix .master-image-box .thumb-wrap .thumb > .inner > img {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Neutralise the grey reveal overlay in case its animation is paused. */
.rbc-cards-fix .master-image-box .thumb-wrap .thumb.reveal:after {
    display: none !important;
}

/* --- 2. Equalise image heights so the cards line up -------------------- */
/* Fixed, equal photo height + object-fit keeps every card the same height,
 * which aligns the titles, text and buttons across the row. */
.rbc-cards-fix .master-image-box .thumb-wrap .thumb > .inner > img {
    width: 100% !important;
    height: 260px !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block;
}

/* Top-align the columns and let them share equal height. */
.rbc-cards-fix > .elementor-container {
    align-items: stretch;
}

.rbc-cards-fix > .elementor-container > .elementor-column > .elementor-widget-wrap {
    height: 100%;
}

@media (max-width: 767px) {
    .rbc-cards-fix .master-image-box .thumb-wrap .thumb > .inner > img {
        height: 220px !important;
    }
}
