.mega-menu-walker-wrapper ul {display:flex; gap:40px; justify-content:center; margin:0; padding:0; list-style:none;}


/* 1. Hide the Main Elementor Container by default */
.mega-menu-container {
    top:90px;
    visibility: hidden;
    opacity: 0;
    position: absolute !important; /* Assuming it drops down from header */
    transition: opacity 0.3s ease, visibility 0.3s ease; /* Basic animation ready */
}

/* 2. Show the Main Container when JS adds the class */
.mega-menu-container.is-mega-visible {
    visibility: visible;
    opacity: 1;
}

/* 3. Hide ALL individual content blocks inside the main container by default */
.mega-menu-container [class*="-content"] {
    display: none;
}

/* 4. Show ONLY the specific content block that got triggered */
.mega-menu-container [class*="-content"].is-content-visible {
    display: block;
}