/* COMPREHENSIVE CSS PATCH FOR CLONED SITE - VERSION 4 (SPECIFICITY & VISIBILITY FIX) */

/* 1. Force Root Visibility - Overriding animation hidden states */
.transition,
.transition--root-hidden,
.layout-element.transition,
.is-visible {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

/* 2. AGGRESSIVE CHILD VISIBILITY 
   The original site hides internal elements using data-animation-role.
   We force them visible when the parent is-visible.
*/
.js-enabled .transition:not(.is-visible),
.js-enabled .transition--root-hidden:not(.is-visible) {
    opacity: 0 !important;
    transform: translateY(30px);
}

.is-visible [data-animation-role],
.is-visible img,
.is-visible .text-box,
.is-visible .image,
.is-visible .grid-shape {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    transition: opacity 0.8s ease, transform 0.8s ease !important;
}

/* 3. Image Wrapper Specifics (Found to have opacity: 0 in debugger) */
.image-wrapper,
.image,
.image--grid {
    opacity: 1 !important;
    visibility: visible !important;
}

/* 4. Responsive Image Switching - Refined to avoid display:none conflicts with Observer */
/* We use opacity/height instead of display:none where possible, or just be very specific */
@media (min-width: 920px) {
    .image-wrapper--desktop {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .image-wrapper--mobile {
        display: none !important;
    }
}

@media (max-width: 919px) {
    .image-wrapper--desktop {
        display: none !important;
    }

    .image-wrapper--mobile {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
}

/* 5. Layout & Spacing (Preserved & Improved) */
.block-background {
    z-index: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.block-layout {
    z-index: 2 !important;
    position: relative !important;
    min-height: auto !important;
}

.block-layout--layout {
    display: grid !important;
    grid-template-rows: auto !important;
    grid-auto-rows: auto !important;
    row-gap: 10px !important;
    /* Reduced from 24px */
}

/* Footer specific compactness */
.block--footer {
    padding-top: 40px !important;
    padding-bottom: 20px !important;
}

.block--footer .block-layout--layout {
    row-gap: 0 !important;
    column-gap: 20px !important;
}

.layout-element {
    position: relative !important;
    width: auto !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* 6. Text box & Grid Map fixes */
.text-box {
    white-space: normal !important;
    height: auto !important;
}

.grid-map__frame {
    min-height: 450px !important;
    width: 100% !important;
}

/* 7. Background Overlay transparency (ensure it doesn't black out content) */
.block-background__overlay {
    background-color: rgba(0, 0, 0, 0.2) !important;
    /* Soften aggressive overlays */
}

/* 8. Star ratings and body text */
.body-large,
.body,
.body-small,
p,
span,
h1,
h2,
h3,
h4,
h5,
h6 {
    opacity: 1 !important;
    visibility: visible !important;
}

/* 9. Form Status Messages */
.form-status {
    padding: 10px 0;
    font-size: 14px;
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* 10. Mobile Menu Expansion */
.block-header-layout-mobile__dropdown {
    display: none !important;
    /* Start hidden */
    width: 100% !important;
    max-height: 0;
    overflow: hidden;
    transition: all 0.4s ease-in-out !important;
    background-color: rgb(247, 247, 246) !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 99 !important;
    padding: 0 !important;
    visibility: visible !important;
    opacity: 0;
}

.block-header-layout-mobile__dropdown--open {
    display: block !important;
    max-height: 500px !important;
    /* Allow it to expand */
    opacity: 1 !important;
    padding: 24px 16px !important;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.05);
}

.block-header-layout-mobile__dropdown--open .block-header__nav {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Burger Animation to 'X' */
.burger.burger--open .burger__meat {
    opacity: 0 !important;
}

.burger {
    transition: all 0.3s ease !important;
}

.burger span {
    transition: all 0.3s ease !important;
}

.burger.burger--open .burger__bun:nth-child(1) {
    transform: translateY(8px) rotate(45deg) !important;
}

.burger.burger--open .burger__bun:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg) !important;
}

/* Scroll Lock */
.antigravity-scroll-lock {
    overflow: hidden !important;
}

/* Ensure mobile header stays on top */
.block-header {
    position: relative !important;
    z-index: 100 !important;
}