/* =========================================================
   EJXTJ - MENÚ CENTRAL V25
   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 ------------------
   Conserva el aspecto anterior, pero aislado del CSS de
   cada página para que no cambien tamaño, letra o posición.
   El JS existente todavía puede ocultar el enlace de la
   página actual, como ocurría antes. */
#ejxtjMobileNav{display:none;}

@media (max-width:991.98px){
    #ejxtjMobileNav{
        position:fixed !important;
        left:0 !important;
        right:0 !important;
        bottom:0 !important;
        width:100% !important;
        min-height:58px !important;
        margin:0 !important;
        padding:8px 5px !important;
        z-index:5000 !important;
        background:#111 !important;
        box-shadow:0 -4px 14px rgba(0,0,0,.28) !important;
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif !important;
    }

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

    #ejxtjMobileNav .ejx-mobile-link{
        flex:1 1 0;
        min-width:0 !important;
        margin:0 !important;
        padding:0 2px !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;
        text-align:center !important;
        text-decoration:none !important;
        font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif !important;
        font-size:.75rem !important;
        font-weight:400 !important;
        line-height:1.15 !important;
        transition:transform .2s ease,color .2s ease !important;
        display:flex;
    }

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

    #ejxtjMobileNav .ejx-mobile-link span{
        display:block;
        margin:0 !important;
        padding:0 !important;
        font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif !important;
    }

    #ejxtjMobileNav .ejx-mobile-link:hover,
    #ejxtjMobileNav .ejx-mobile-link:focus-visible{
        color:#ff9800 !important;
    }

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

@media (max-width:380px){
    #ejxtjMobileNav .ejx-mobile-link span{display:none;}
    #ejxtjMobileNav .ejx-mobile-link i{font-size:1.35rem !important;}
}