/* =========================================================
   EJXTJ - MENÚ CENTRAL V26
   Referencia visual: menú de PC de Nosotros/Galería.
   Selectores propios para evitar conflictos con el CSS
   antiguo de cada página.
   ========================================================= */

#ejxtjDesktopNav,
#ejxtjMobileNav{
    font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif !important;
}

#ejxtjDesktopNav{display:none;}

@media (min-width:992px){
    #ejxtjDesktopNav{
        display:block !important;
        position:fixed !important;
        top:0 !important;
        left:0 !important;
        right:0 !important;
        width:100% !important;
        height:58px !important;
        margin:0 !important;
        padding:0 !important;
        z-index:5000 !important;
        background:rgba(255,255,255,.92) !important;
        border:0 !important;
        border-bottom:1px solid rgba(0,0,0,.06) !important;
        box-shadow:0 4px 16px rgba(0,0,0,.10) !important;
        -webkit-backdrop-filter:blur(10px) !important;
        backdrop-filter:blur(10px) !important;
        font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif !important;
    }

    #ejxtjDesktopNav,
    #ejxtjDesktopNav *{
        box-sizing:border-box !important;
    }

    #ejxtjDesktopNav .ejx-nav-inner{
        width:min(1440px,100%) !important;
        height:58px !important;
        margin:0 auto !important;
        padding:0 28px !important;
        display:grid !important;
        grid-template-columns:1fr auto 1fr !important;
        align-items:center !important;
        position:relative !important;
    }

    #ejxtjDesktopNav .ejx-brand{
        grid-column:1 !important;
        justify-self:start !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        width:42px !important;
        height:42px !important;
        margin:0 !important;
        padding:0 !important;
        line-height:1 !important;
        text-decoration:none !important;
    }

    #ejxtjDesktopNav .ejx-logo{
        display:block !important;
        width:40px !important;
        height:40px !important;
        min-width:40px !important;
        max-width:40px !important;
        margin:0 !important;
        padding:0 !important;
        border:0 !important;
        border-radius:50% !important;
        object-fit:cover !important;
        box-shadow:0 3px 10px rgba(0,0,0,.22) !important;
        transition:transform .2s ease !important;
    }

    #ejxtjDesktopNav .ejx-brand:hover .ejx-logo{
        transform:scale(1.04) !important;
    }

    #ejxtjDesktopNav .ejx-links{
        grid-column:2 !important;
        justify-self:center !important;
        display:flex !important;
        flex-direction:row !important;
        flex-wrap:nowrap !important;
        align-items:center !important;
        justify-content:center !important;
        gap:clamp(15px,1.8vw,28px) !important;
        margin:0 !important;
        padding:0 !important;
        list-style:none !important;
        white-space:nowrap !important;
    }

    #ejxtjDesktopNav .ejx-links li{
        display:flex !important;
        align-items:center !important;
        margin:0 !important;
        padding:0 !important;
        list-style:none !important;
    }

    #ejxtjDesktopNav .ejx-link,
    #ejxtjDesktopNav .ejx-contact{
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        margin:0 !important;
        text-decoration:none !important;
        white-space:nowrap !important;
        line-height:1 !important;
        letter-spacing:0 !important;
        text-transform:none !important;
        font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif !important;
        font-size:14px !important;
    }

    #ejxtjDesktopNav .ejx-link{
        position:relative !important;
        padding:8px 2px !important;
        color:#17171c !important;
        font-weight:600 !important;
        background:transparent !important;
        border:0 !important;
        border-radius:0 !important;
        transition:color .2s ease !important;
    }

    #ejxtjDesktopNav .ejx-link::after{
        content:"" !important;
        position:absolute !important;
        left:50% !important;
        bottom:2px !important;
        width:0 !important;
        height:2px !important;
        transform:translateX(-50%) !important;
        border-radius:999px !important;
        background:linear-gradient(90deg,#3f51b5,#673ab7) !important;
        transition:width .2s ease !important;
    }

    #ejxtjDesktopNav .ejx-link:hover{
        color:#3f51b5 !important;
    }

    #ejxtjDesktopNav .ejx-link:hover::after{
        width:100% !important;
    }

    #ejxtjDesktopNav .ejx-contact{
        min-height:34px !important;
        padding:0 15px !important;
        color:#fff !important;
        font-weight:700 !important;
        border:0 !important;
        border-radius:18px !important;
        background:linear-gradient(135deg,#3f51b5,#673ab7) !important;
        box-shadow:0 5px 14px rgba(63,81,181,.18) !important;
        transition:transform .2s ease,box-shadow .2s ease !important;
    }

    #ejxtjDesktopNav .ejx-contact:hover{
        color:#fff !important;
        transform:translateY(-1px) !important;
        box-shadow:0 7px 17px rgba(63,81,181,.24) !important;
    }
}

@media (min-width:992px) and (max-width:1180px){
    #ejxtjDesktopNav .ejx-nav-inner{padding:0 18px !important;}
    #ejxtjDesktopNav .ejx-links{gap:13px !important;}
    #ejxtjDesktopNav .ejx-link,
    #ejxtjDesktopNav .ejx-contact{font-size:13px !important;}
    #ejxtjDesktopNav .ejx-contact{padding:0 12px !important;}
}

/* ------------------ MÓVIL V28 ------------------
   Cinco posiciones exactamente iguales.
   "Más" abre una bandeja visual y el mismo botón pasa
   a decir "Volver" mientras está abierta. */
#ejxtjMobileNav{display:none;}

#ejxtjDesktopNav .ejx-link.active{
    color:#3f51b5 !important;
}
#ejxtjDesktopNav .ejx-link.active::after{
    width:100% !important;
}
#ejxtjDesktopNav .ejx-contact.active{
    box-shadow:0 0 0 2px rgba(103,58,183,.20),0 5px 14px rgba(63,81,181,.18) !important;
}

@media (max-width:991.98px){
    #ejxtjMobileNav{
        position:fixed !important;
        left:0 !important;
        right:0 !important;
        bottom:0 !important;
        width:100% !important;
        min-height:64px !important;
        margin:0 !important;
        padding:7px max(6px,env(safe-area-inset-right))
                calc(7px + env(safe-area-inset-bottom))
                max(6px,env(safe-area-inset-left)) !important;
        z-index:5000 !important;
        display:grid !important;
        grid-template-columns:repeat(5,minmax(0,1fr)) !important;
        align-items:stretch !important;
        gap:0 !important;
        background:rgba(17,17,17,.985) !important;
        border-top:1px solid rgba(255,255,255,.08) !important;
        box-shadow:0 -6px 22px rgba(0,0,0,.36) !important;
        font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif !important;
        -webkit-backdrop-filter:blur(14px) !important;
        backdrop-filter:blur(14px) !important;
    }

    #ejxtjMobileNav,
    #ejxtjMobileNav *{
        box-sizing:border-box !important;
    }

    #ejxtjMobileNav > .ejx-mobile-link,
    #ejxtjMobileNav > .ejx-mobile-more{
        width:100% !important;
        min-width:0 !important;
        margin:0 !important;
    }

    #ejxtjMobileNav > .ejx-mobile-more{
        position:static !important;
        padding:0 !important;
    }

    #ejxtjMobileNav .ejx-mobile-link{
        width:100% !important;
        min-width:0 !important;
        min-height:49px !important;
        margin:0 !important;
        padding:3px 0 !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;
        position:relative !important;
        color:#aaa !important;
        background:transparent !important;
        border:0 !important;
        border-radius:10px !important;
        text-align:center !important;
        text-decoration:none !important;
        font:500 .71rem/1.1 "Segoe UI",Tahoma,Geneva,Verdana,sans-serif !important;
        cursor:pointer !important;
        transition:transform .16s ease,color .16s ease,background .16s ease !important;
    }

    #ejxtjMobileNav .ejx-mobile-link > i{
        display:block !important;
        margin:0 0 4px !important;
        padding:0 !important;
        font-size:1.22rem !important;
        line-height:1 !important;
    }

    #ejxtjMobileNav .ejx-mobile-link > span:not(.ejx-more-state){
        display:block !important;
        margin:0 !important;
        padding:0 !important;
        white-space:nowrap !important;
    }

    #ejxtjMobileNav .ejx-mobile-link:hover,
    #ejxtjMobileNav .ejx-mobile-link:focus-visible,
    #ejxtjMobileNav .ejx-mobile-link.active,
    #ejxtjMobileNav .ejx-mobile-more[open] > .ejx-mobile-more-trigger{
        color:#ff9800 !important;
        background:rgba(255,152,0,.075) !important;
    }

    #ejxtjMobileNav .ejx-mobile-link.active::before,
    #ejxtjMobileNav .ejx-mobile-more-trigger.active::before{
        content:"" !important;
        position:absolute !important;
        top:-7px !important;
        left:50% !important;
        width:28px !important;
        height:3px !important;
        transform:translateX(-50%) !important;
        border-radius:999px !important;
        background:#ff9800 !important;
    }

    #ejxtjMobileNav .ejx-mobile-link:active{
        transform:scale(.94) !important;
    }

    #ejxtjMobileNav .ejx-mobile-more > summary{
        list-style:none !important;
        width:100% !important;
        height:100% !important;
    }
    #ejxtjMobileNav .ejx-mobile-more > summary::-webkit-details-marker{
        display:none !important;
    }

    #ejxtjMobileNav .ejx-more-state{
        width:100% !important;
        height:100% !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;
    }

    #ejxtjMobileNav .ejx-more-state i{
        display:block !important;
        margin:0 0 4px !important;
        font-size:1.22rem !important;
        line-height:1 !important;
    }

    #ejxtjMobileNav .ejx-more-state > span{
        display:block !important;
        white-space:nowrap !important;
    }

    #ejxtjMobileNav .ejx-more-state-open{
        display:none !important;
    }

    #ejxtjMobileNav .ejx-mobile-more[open] .ejx-more-state-closed{
        display:none !important;
    }

    #ejxtjMobileNav .ejx-mobile-more[open] .ejx-more-state-open{
        display:flex !important;
    }

    #ejxtjMobileNav .ejx-mobile-more-menu{
        position:fixed !important;
        left:8px !important;
        right:8px !important;
        bottom:calc(73px + env(safe-area-inset-bottom)) !important;
        width:auto !important;
        max-width:520px !important;
        margin:0 auto !important;
        padding:11px !important;
        display:grid !important;
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        gap:8px !important;
        border:1px solid rgba(255,255,255,.12) !important;
        border-radius:19px !important;
        background:
            radial-gradient(circle at 50% 0%,rgba(117,132,218,.14),transparent 45%),
            rgba(19,20,28,.985) !important;
        box-shadow:0 20px 55px rgba(0,0,0,.52) !important;
        -webkit-backdrop-filter:blur(18px) !important;
        backdrop-filter:blur(18px) !important;
        overflow:hidden !important;
    }

    #ejxtjMobileNav .ejx-more-heading{
        grid-column:1/-1 !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        min-height:48px !important;
        padding:4px 8px 9px !important;
        text-align:center !important;
        border-bottom:1px solid rgba(255,255,255,.07) !important;
    }

    #ejxtjMobileNav .ejx-more-heading strong{
        display:block !important;
        color:#fff !important;
        font-size:.86rem !important;
        line-height:1.2 !important;
    }

    #ejxtjMobileNav .ejx-more-heading small{
        display:block !important;
        margin-top:3px !important;
        color:#999fac !important;
        font-size:.67rem !important;
        line-height:1.25 !important;
    }

    #ejxtjMobileNav .ejx-more-link{
        min-width:0 !important;
        min-height:104px !important;
        padding:12px 6px 10px !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;
        gap:8px !important;
        border:1px solid rgba(255,255,255,.07) !important;
        border-radius:14px !important;
        color:#e9eaf2 !important;
        background:rgba(255,255,255,.035) !important;
        text-decoration:none !important;
        text-align:center !important;
        transition:transform .16s ease,border-color .16s ease,background .16s ease !important;
    }

    #ejxtjMobileNav .ejx-more-link:hover,
    #ejxtjMobileNav .ejx-more-link:focus-visible,
    #ejxtjMobileNav .ejx-more-link.active{
        color:#fff !important;
        border-color:rgba(255,152,0,.30) !important;
        background:rgba(255,152,0,.09) !important;
        transform:translateY(-1px) !important;
    }

    #ejxtjMobileNav .ejx-more-icon{
        width:42px !important;
        height:42px !important;
        display:grid !important;
        place-items:center !important;
        flex:0 0 auto !important;
        border-radius:13px !important;
        color:#ffb347 !important;
        background:linear-gradient(145deg,rgba(255,152,0,.16),rgba(117,132,218,.10)) !important;
        border:1px solid rgba(255,180,90,.14) !important;
    }

    #ejxtjMobileNav .ejx-more-icon svg{
        display:block !important;
        width:23px !important;
        height:23px !important;
        fill:currentColor !important;
    }

    #ejxtjMobileNav .ejx-more-link > span:last-child{
        min-width:0 !important;
        width:100% !important;
    }

    #ejxtjMobileNav .ejx-more-link strong,
    #ejxtjMobileNav .ejx-more-link small{
        display:block !important;
        overflow:hidden !important;
        text-overflow:ellipsis !important;
        white-space:nowrap !important;
    }

    #ejxtjMobileNav .ejx-more-link strong{
        font-size:.76rem !important;
        line-height:1.2 !important;
    }

    #ejxtjMobileNav .ejx-more-link small{
        margin-top:3px !important;
        color:#999fac !important;
        font-size:.61rem !important;
        line-height:1.2 !important;
    }
}

@media (max-width:370px){
    #ejxtjMobileNav .ejx-mobile-link{
        font-size:.66rem !important;
    }

    #ejxtjMobileNav .ejx-mobile-link > i,
    #ejxtjMobileNav .ejx-more-state i{
        font-size:1.16rem !important;
    }

    #ejxtjMobileNav .ejx-mobile-more-menu{
        left:5px !important;
        right:5px !important;
        padding:8px !important;
        gap:6px !important;
    }

    #ejxtjMobileNav .ejx-more-link{
        min-height:96px !important;
        padding:9px 3px !important;
    }

    #ejxtjMobileNav .ejx-more-icon{
        width:38px !important;
        height:38px !important;
    }

    #ejxtjMobileNav .ejx-more-link strong{
        font-size:.70rem !important;
    }

    #ejxtjMobileNav .ejx-more-link small{
        font-size:.57rem !important;
    }
}
