.elementor-24701 .elementor-element.elementor-element-0ae4cfa{--display:flex;--min-height:124px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-24701 .elementor-element.elementor-element-0ae4cfa:not(.elementor-motion-effects-element-type-background), .elementor-24701 .elementor-element.elementor-element-0ae4cfa > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;}.elementor-24701 .elementor-element.elementor-element-ca4af12{--display:flex;}.elementor-24701 .elementor-element.elementor-element-d7a8018{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-24701 .elementor-element.elementor-element-d7a8018 img{width:100%;max-width:33%;height:1px;}.elementor-24701 .elementor-element.elementor-element-e236ed3{--display:flex;--min-height:37px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:20px;}.elementor-24701 .elementor-element.elementor-element-da2dfdb{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}.elementor-24701 .elementor-element.elementor-element-7832ca5{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -10px) 0px;}.elementor-24701 .elementor-element.elementor-element-7832ca5.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-24701 .elementor-element.elementor-element-7832ca5.elementor-view-framed .elementor-icon, .elementor-24701 .elementor-element.elementor-element-7832ca5.elementor-view-default .elementor-icon{color:#FFFFFF;border-color:#FFFFFF;}.elementor-24701 .elementor-element.elementor-element-7832ca5.elementor-view-framed .elementor-icon, .elementor-24701 .elementor-element.elementor-element-7832ca5.elementor-view-default .elementor-icon svg{fill:#FFFFFF;}.elementor-24701 .elementor-element.elementor-element-7832ca5 .elementor-icon{font-size:33px;}.elementor-24701 .elementor-element.elementor-element-7832ca5 .elementor-icon svg{height:33px;}.elementor-24701 .elementor-element.elementor-element-7832ca5 .elementor-icon i, .elementor-24701 .elementor-element.elementor-element-7832ca5 .elementor-icon svg{transform:rotate(0deg);}.elementor-24701 .elementor-element.elementor-element-fae9329{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;--padding-top:07.3%;--padding-bottom:7.3%;--padding-left:0%;--padding-right:0%;}.elementor-24701 .elementor-element.elementor-element-fae9329:not(.elementor-motion-effects-element-type-background), .elementor-24701 .elementor-element.elementor-element-fae9329 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#020000BD;}.elementor-24701 .elementor-element.elementor-element-b5dd19b{--display:flex;--gap:10px 0px;--row-gap:10px;--column-gap:0px;}.elementor-24701 .elementor-element.elementor-element-a0d9b22{--spacer-size:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-24701 .elementor-element.elementor-element-549b70b:hover{--e-transform-scale:1.1;}.elementor-24701 .elementor-element.elementor-element-549b70b{text-align:center;}.elementor-24701 .elementor-element.elementor-element-549b70b .elementor-heading-title{font-family:"Rubik", Sans-serif;font-weight:600;color:#FFFFFF;}.elementor-24701 .elementor-element.elementor-element-73954f8:hover{--e-transform-scale:1.1;}.elementor-24701 .elementor-element.elementor-element-73954f8{text-align:center;}.elementor-24701 .elementor-element.elementor-element-73954f8 .elementor-heading-title{font-family:"Rubik", Sans-serif;font-weight:600;color:#FFFFFF;}.elementor-24701 .elementor-element.elementor-element-7cfac8b:hover{--e-transform-scale:1.1;}.elementor-24701 .elementor-element.elementor-element-7cfac8b{text-align:center;}.elementor-24701 .elementor-element.elementor-element-7cfac8b .elementor-heading-title{font-family:"Rubik", Sans-serif;font-size:41px;font-weight:600;color:#FFFFFF;}.elementor-24701 .elementor-element.elementor-element-f0331a2{--spacer-size:10px;}.elementor-24701 .elementor-element.elementor-element-cdda5b4{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--gap:0px 120px;--row-gap:0px;--column-gap:120px;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-24701 .elementor-element.elementor-element-8164fb4{margin:0px -20px calc(var(--kit-widget-spacing, 0px) + 0px) 20px;font-family:"Rubik", Sans-serif;font-size:20px;font-weight:400;color:#FFFFFF;}.elementor-24701 .elementor-element.elementor-element-8164fb4.elementor-element{--align-self:center;--order:-99999 /* order start hack */;}.elementor-24701 .elementor-element.elementor-element-8164fb4 p{margin-block-end:0px;}.elementor-24701 .elementor-element.elementor-element-2228bb1{margin:0px -50px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;font-family:"Rubik", Sans-serif;font-size:20px;font-weight:400;color:#FFFFFF;}.elementor-24701 .elementor-element.elementor-element-2228bb1.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:0;}.elementor-24701 .elementor-element.elementor-element-2228bb1 p{margin-block-end:0px;}.elementor-24701 .elementor-element.elementor-element-6a7a9fe{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 20px;font-family:"Rubik", Sans-serif;font-size:20px;font-weight:400;color:#FFFFFF;}.elementor-24701 .elementor-element.elementor-element-6a7a9fe.elementor-element{--align-self:center;}.elementor-24701 .elementor-element.elementor-element-6a7a9fe p{margin-block-end:0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-24701 .elementor-element.elementor-element-fae9329{--width:100%;}}@media(max-width:1440px){.elementor-24701 .elementor-element.elementor-element-0ae4cfa{--min-height:0px;}.elementor-24701 .elementor-element.elementor-element-d7a8018 img{width:100%;max-width:100%;height:100%;}}@media(max-width:1200px){.elementor-24701 .elementor-element.elementor-element-d7a8018 img{width:100%;}}@media(max-width:1024px){.elementor-24701 .elementor-element.elementor-element-0ae4cfa{--min-height:0px;}.elementor-24701 .elementor-element.elementor-element-d7a8018 img{max-width:100%;height:100%;}.elementor-24701 .elementor-element.elementor-element-7832ca5{width:var( --container-widget-width, 10% );max-width:10%;margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;--container-widget-width:10%;--container-widget-flex-grow:0;}}@media(max-width:767px){.elementor-24701 .elementor-element.elementor-element-0ae4cfa{--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-24701 .elementor-element.elementor-element-e236ed3{--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-24701 .elementor-element.elementor-element-7832ca5{--container-widget-width:15%;--container-widget-flex-grow:0;width:var( --container-widget-width, 15% );max-width:15%;}.elementor-24701 .elementor-element.elementor-element-a0d9b22{--spacer-size:0px;}}@media(max-width:1024px) and (min-width:768px){.elementor-24701 .elementor-element.elementor-element-e236ed3{--width:100%;}}@media(min-width:2400px){.elementor-24701 .elementor-element.elementor-element-0ae4cfa{--width:80%;}}/* Start custom CSS for html, class: .elementor-element-da2dfdb *//* ===================================================== */ /* OCULTAR BARRA DE SCROLL SOLO EN ESTA PÁGINA */ /* ===================================================== */ html, body { scrollbar-width: none !important; -ms-overflow-style: none !important; } html::-webkit-scrollbar, body::-webkit-scrollbar { display: none !important; width: 0 !important; } /* ===================================================== */ /* CONTENEDOR DERECHO DEL HEADER */ /* Clase para el contenedor donde están menú + audio */ /* ===================================================== */ html body .header-actions-inakutana { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; gap: 22px !important; position: relative !important; z-index: 999999 !important; } /* Compatibilidad con estructura de Elementor */ html body .header-actions-inakutana > .elementor-widget-wrap, html body .header-actions-inakutana.e-con, html body .header-actions-inakutana .e-con-inner { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; gap: 22px !important; } /* ===================================================== */ /* WIDGET HTML DEL BOTÓN DE AUDIO */ /* La clase boton-audio-widget va en el widget Editar HTML */ /* ===================================================== */ html body .boton-audio-widget { width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; position: relative !important; z-index: 999999 !important; } html body .boton-audio-widget .elementor-widget-container { width: 52px !important; height: 52px !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; padding: 0 !important; } /* ===================================================== */ /* BOTÓN DE AUDIO */ /* Tamaño fijo, sin fondo, sin borde, solo icono */ /* ===================================================== */ html body .boton-audio-video { width: 52px !important; height: 52px !important; display: flex !important; align-items: center !important; justify-content: center !important; position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; padding: 0 !important; margin: 0 !important; border: none !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; cursor: pointer !important; outline: none !important; opacity: 0.95 !important; transform: none !important; transition: opacity 0.25s ease, transform 0.25s ease !important; } html body .boton-audio-video:hover { opacity: 1 !important; transform: scale(1.04) !important; background: transparent !important; border: none !important; box-shadow: none !important; } html body .boton-audio-video:focus, html body .boton-audio-video:active { outline: none !important; background: transparent !important; border: none !important; box-shadow: none !important; } html body .boton-audio-video::before, html body .boton-audio-video::after { display: none !important; content: none !important; } /* ===================================================== */ /* ICONOS SVG */ /* ===================================================== */ html body .boton-audio-video .icono-audio { width: 32px !important; height: 32px !important; display: block !important; object-fit: contain !important; margin: 0 !important; padding: 0 !important; pointer-events: none !important; } /* ===================================================== */ /* ESTADO POR DEFECTO: SONIDO ACTIVO */ /* ===================================================== */ html body .boton-audio-video .icono-audio-off { display: none !important; } html body .boton-audio-video .icono-audio-on { display: block !important; } /* ===================================================== */ /* ESTADO SILENCIADO: SOLO ICONO MUTE */ /* ===================================================== */ html body .boton-audio-video.audio-silenciado .icono-audio-off { display: block !important; } html body .boton-audio-video.audio-silenciado .icono-audio-on { display: none !important; } /* ===================================================== */ /* ESTADO CON SONIDO: SOLO ICONO SONIDO */ /* ===================================================== */ html body .boton-audio-video.audio-activo .icono-audio-off { display: none !important; } html body .boton-audio-video.audio-activo .icono-audio-on { display: block !important; } /* ===================================================== */ /* TABLET */ /* Mantiene el tamaño del icono, solo ajusta separación */ /* ===================================================== */ @media (max-width: 1024px) { html body .header-actions-inakutana, html body .header-actions-inakutana > .elementor-widget-wrap, html body .header-actions-inakutana.e-con, html body .header-actions-inakutana .e-con-inner { gap: 20px !important; } html body .boton-audio-widget .elementor-widget-container, html body .boton-audio-video { width: 52px !important; height: 52px !important; } html body .boton-audio-video .icono-audio { width: 32px !important; height: 32px !important; } } /* ===================================================== */ /* MÓVIL */ /* Mantiene el tamaño del icono, solo ajusta separación */ /* ===================================================== */ @media (max-width: 767px) { html body .header-actions-inakutana, html body .header-actions-inakutana > .elementor-widget-wrap, html body .header-actions-inakutana.e-con, html body .header-actions-inakutana .e-con-inner { gap: 18px !important; } html body .boton-audio-widget .elementor-widget-container, html body .boton-audio-video { width: 52px !important; height: 52px !important; } html body .boton-audio-video .icono-audio { width: 32px !important; height: 32px !important; } } /* ===================================================== */ /* MÓVIL PEQUEÑO */ /* Mantiene el tamaño del icono */ /* ===================================================== */ @media (max-width: 480px) { html body .header-actions-inakutana, html body .header-actions-inakutana > .elementor-widget-wrap, html body .header-actions-inakutana.e-con, html body .header-actions-inakutana .e-con-inner { gap: 16px !important; } html body .boton-audio-widget .elementor-widget-container, html body .boton-audio-video { width: 52px !important; height: 52px !important; } html body .boton-audio-video .icono-audio { width: 32px !important; height: 32px !important; } }
<script>
document.addEventListener('DOMContentLoaded', function () {

    const .elementor-24701 .elementor-element.elementor-element-da2dfdbContenedor = '.main-container-video';
    const .elementor-24701 .elementor-element.elementor-element-da2dfdbBotonAudio = '.boton-audio-video';

    const primerVideo = '/wp-content/uploads/2026/06/intro_a-1080p.mp4';
    const segundoVideo = '/wp-content/uploads/2026/06/intro_b-1080p.mp4';

    let intentos = 0;
    const maxIntentos = 80;

    function prepararVideoSecuencia() {
        const contenedor = document.querySelector(.elementor-24701 .elementor-element.elementor-element-da2dfdbContenedor);

        if (!contenedor) {
            reintentar();
            return;
        }

        let video = contenedor.querySelector('video.elementor-background-video-hosted');

        if (!video) {
            video = contenedor.querySelector('video');
        }

        if (!video) {
            reintentar();
            return;
        }

        if (video.dataset.secuenciaVideosActiva === 'true') {
            prepararBotonAudio(video);
            actualizarBotonAudio(video);
            return;
        }

        video.dataset.secuenciaVideosActiva = 'true';

        video.autoplay = true;
        video.loop = false;
        video.playsInline = true;
        video.volume = 1;

        /*
         * Intentamos sonido por defecto.
         * Si el navegador lo bloquea, se reproducirá muteado automáticamente.
         */
        video.muted = false;
        video.defaultMuted = false;
        video.removeAttribute('muted');

        video.setAttribute('autoplay', '');
        video.setAttribute('playsinline', '');
        video.removeAttribute('loop');

        video.style.width = '100%';
        video.style.height = '100%';
        video.style.objectFit = 'cover';

        limpiarVideo(video);

        video.src = primerVideo;
        video.setAttribute('src', primerVideo);

        prepararBotonAudio(video);
        actualizarBotonAudio(video);

        video.load();

        video.addEventListener('loadeddata', function () {
            reproducirVideo(video);
        }, { once: true });

        video.addEventListener('ended', function () {
            cambiarASegundoVideo(video);
        }, { once: true });

        video.addEventListener('timeupdate', function () {
            if (!video.duration) return;

            const tiempoRestante = video.duration - video.currentTime;

            if (tiempoRestante <= 0.2 && video.dataset.segundoVideoActivo !== 'true') {
                cambiarASegundoVideo(video);
            }
        });

        video.addEventListener('volumechange', function () {
            actualizarBotonAudio(video);
        });

        setTimeout(function () {
            reproducirVideo(video);
        }, 400);
    }

    function prepararBotonAudio(video) {
        const botonAudio = document.querySelector(.elementor-24701 .elementor-element.elementor-element-da2dfdbBotonAudio);

        if (!botonAudio || !video) return;

        if (botonAudio.dataset.audioConfigurado === 'true') {
            actualizarBotonAudio(video);
            return;
        }

        botonAudio.dataset.audioConfigurado = 'true';

        actualizarBotonAudio(video);

        botonAudio.addEventListener('click', function (e) {
            e.preventDefault();

            if (video.muted || video.volume === 0) {
                video.muted = false;
                video.defaultMuted = false;
                video.removeAttribute('muted');
                video.volume = 1;

                actualizarBotonAudio(video);

                video.play().catch(function () {
                    /*
                     * Si el navegador sigue bloqueando el sonido,
                     * dejamos el vídeo reproduciéndose muteado.
                     */
                    video.muted = true;
                    video.defaultMuted = true;
                    video.setAttribute('muted', '');

                    actualizarBotonAudio(video);

                    video.play().catch(function () {});
                });

            } else {
                video.muted = true;
                video.defaultMuted = true;
                video.setAttribute('muted', '');

                actualizarBotonAudio(video);
            }
        });
    }

    function actualizarBotonAudio(video) {
        const botonAudio = document.querySelector(.elementor-24701 .elementor-element.elementor-element-da2dfdbBotonAudio);

        if (!botonAudio || !video) return;

        if (video.muted || video.volume === 0) {
            botonAudio.classList.remove('audio-activo');
            botonAudio.classList.add('audio-silenciado');
            botonAudio.setAttribute('aria-label', 'Activar sonido');
        } else {
            botonAudio.classList.remove('audio-silenciado');
            botonAudio.classList.add('audio-activo');
            botonAudio.setAttribute('aria-label', 'Silenciar sonido');
        }
    }

    function cambiarASegundoVideo(video) {
        if (!video || video.dataset.segundoVideoActivo === 'true') {
            return;
        }

        const estabaSilenciado = video.muted;

        video.dataset.segundoVideoActivo = 'true';

        video.pause();

        limpiarVideo(video);

        video.src = segundoVideo;
        video.setAttribute('src', segundoVideo);

        video.loop = true;
        video.setAttribute('loop', '');

        video.autoplay = true;
        video.setAttribute('autoplay', '');

        video.playsInline = true;
        video.setAttribute('playsinline', '');

        video.volume = 1;

        if (estabaSilenciado) {
            video.muted = true;
            video.defaultMuted = true;
            video.setAttribute('muted', '');
        } else {
            video.muted = false;
            video.defaultMuted = false;
            video.removeAttribute('muted');
        }

        actualizarBotonAudio(video);

        video.load();

        setTimeout(function () {
            reproducirVideo(video);
        }, 150);
    }

    function limpiarVideo(video) {
        const sources = video.querySelectorAll('source');

        sources.forEach(function (source) {
            source.remove();
        });

        video.removeAttribute('src');
        video.removeAttribute('srcset');
        video.removeAttribute('data-src');
        video.removeAttribute('data-srcset');
    }

    function reproducirVideo(video) {
        const playPromise = video.play();

        if (playPromise !== undefined) {
            playPromise.catch(function () {
                /*
                 * Si el navegador bloquea autoplay con sonido,
                 * forzamos mute para que al menos el vídeo se reproduzca.
                 */
                video.muted = true;
                video.defaultMuted = true;
                video.setAttribute('muted', '');

                actualizarBotonAudio(video);

                video.play().catch(function () {});
            });
        }

        actualizarBotonAudio(video);
    }

    function reintentar() {
        intentos++;

        if (intentos < maxIntentos) {
            setTimeout(prepararVideoSecuencia, 250);
        }
    }

    prepararVideoSecuencia();

});
</script>/* End custom CSS */
/* Start custom CSS *//* =====================================================
   MIROKUTANA - HEADER DARK ASPECTO OPTIMIZADO
   Pegar en el CSS del Header Dark.
   No usa imports externos. No cambia la funcion del boton de sonido.
   ===================================================== */

:root {
    --mirokutana-scrollbar-ancho: 0px;
}

.contenedor-superior-header {
    --header-x: clamp(20px, 3.35vw, 66px);
    --header-y: 50%;
    --header-h: clamp(82px, 6.7vw, 128px);
    --header-logo-w: clamp(205px, 16vw, 320px);
    --header-icon-box: clamp(38px, 2.5vw, 48px);
    --header-icon-gap: clamp(13px, 1.35vw, 26px);
    --menu-x-size: 19px;
    --menu-x-stroke: 2px;

    position: relative !important;
    width: 100% !important;
    height: var(--header-h) !important;
    min-height: var(--header-h) !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    background: #000000 !important;
    z-index: 100010 !important;
}

@font-face {
    font-family: "Lato Local";
    src: local("Lato Regular"), local("Lato");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

html.menu-desplegable-bloqueado,
body.menu-desplegable-bloqueado {
    overflow: hidden !important;
    height: 100% !important;
}

body::before {
    content: "" !important;
    position: fixed !important;
    inset: -60px !important;
    z-index: 99998 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    background: rgba(0, 0, 0, 0.55) !important;
    backdrop-filter: blur(0) !important;
    -webkit-backdrop-filter: blur(0) !important;
    transform: scale(1.02) !important;
    transform-origin: center center !important;
    transition:
        opacity 0.85s cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0.85s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.85s cubic-bezier(0.22, 1, 0.36, 1),
        backdrop-filter 0.85s cubic-bezier(0.22, 1, 0.36, 1),
        -webkit-backdrop-filter 0.85s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

body.menu-blur-activo::before {
    opacity: 1 !important;
    visibility: visible !important;
    background: rgba(0, 0, 0, 0.72) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
}

body.menu-blur-activo .contenedor-superior-header {
    background: #000000 !important;
    box-shadow: none !important;
    filter: none !important;
}

/* Logo: compatible con el contenedor ca4af12 del Header Dark y con copias futuras. */
.contenedor-superior-header > .e-con-boxed,
.contenedor-superior-header > .e-con-boxed > .e-con-inner,
.contenedor-superior-header .elementor-widget-tl-site-logo,
.contenedor-superior-header .elementor-widget-tl-site-logo .elementor-widget-container {
    position: static !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
}

.contenedor-superior-header .elementor-widget-tl-site-logo a {
    position: absolute !important;
    left: var(--header-x) !important;
    top: var(--header-y) !important;
    transform: translateY(-50%) !important;
    width: var(--header-logo-w) !important;
    max-width: calc(100vw - 180px) !important;
    height: auto !important;
    display: block !important;
    line-height: 0 !important;
    z-index: 100035 !important;
}

.contenedor-superior-header .elementor-widget-tl-site-logo img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    display: block !important;
    object-fit: contain !important;
    object-position: left center !important;
}

/* Grupo derecha: sonido + menu */
.contenedor-superior-header > .elementor-element-e236ed3 {
    position: absolute !important;
    right: var(--header-x) !important;
    top: var(--header-y) !important;
    transform: translateY(-50%) !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    height: var(--header-icon-box) !important;
    min-height: var(--header-icon-box) !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: var(--header-icon-gap) !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    box-sizing: border-box !important;
    z-index: 100040 !important;
}

html.menu-desplegable-bloqueado .contenedor-superior-header > .elementor-element-e236ed3,
body.menu-desplegable-bloqueado .contenedor-superior-header > .elementor-element-e236ed3 {
    transform: translateX(calc(var(--mirokutana-scrollbar-ancho, 0px) * -1)) translateY(-50%) !important;
}

.contenedor-superior-header .elementor-widget-html,
.contenedor-superior-header .boton-audio-video,
.contenedor-superior-header .boton-menu {
    width: var(--header-icon-box) !important;
    height: var(--header-icon-box) !important;
    min-width: var(--header-icon-box) !important;
    max-width: var(--header-icon-box) !important;
    min-height: var(--header-icon-box) !important;
    max-height: var(--header-icon-box) !important;
    flex: 0 0 var(--header-icon-box) !important;
    align-self: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    box-sizing: border-box !important;
}

/* Boton sonido: solo aspecto, no cambia su funcionalidad. */
.contenedor-superior-header .boton-audio-video {
    position: relative !important;
    overflow: hidden !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    cursor: pointer !important;
    pointer-events: auto !important;
}

.contenedor-superior-header .boton-audio-video * {
    pointer-events: none !important;
}

.contenedor-superior-header .boton-audio-video .icono-audio {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: calc(var(--header-icon-box) * 0.55) !important;
    height: calc(var(--header-icon-box) * 0.55) !important;
    min-width: calc(var(--header-icon-box) * 0.55) !important;
    max-width: calc(var(--header-icon-box) * 0.55) !important;
    min-height: calc(var(--header-icon-box) * 0.55) !important;
    max-height: calc(var(--header-icon-box) * 0.55) !important;
    transform: translate(-50%, -50%) !important;
    display: block !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.contenedor-superior-header .boton-audio-video.audio-silenciado .icono-audio-off,
.contenedor-superior-header .boton-audio-video.audio-activo .icono-audio-on {
    opacity: 1 !important;
    visibility: visible !important;
}

.contenedor-superior-header .boton-audio-video.audio-silenciado .icono-audio-on,
.contenedor-superior-header .boton-audio-video.audio-activo .icono-audio-off {
    opacity: 0 !important;
    visibility: hidden !important;
}

/* Boton menu + X pequena centrada */
.contenedor-superior-header .boton-menu {
    position: relative !important;
    border: 0 !important;
    transform: none !important;
    overflow: visible !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    z-index: 100050 !important;
}

.contenedor-superior-header .boton-menu * {
    pointer-events: none !important;
    transform-origin: center center !important;
}

.contenedor-superior-header .boton-menu .boton-menu-icono-js,
.contenedor-superior-header .boton-menu-icono-js {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

.contenedor-superior-header .boton-menu .elementor-icon-wrapper,
.contenedor-superior-header .boton-menu .elementor-icon {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: var(--header-icon-box) !important;
    height: var(--header-icon-box) !important;
    min-width: var(--header-icon-box) !important;
    max-width: var(--header-icon-box) !important;
    min-height: var(--header-icon-box) !important;
    max-height: var(--header-icon-box) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    transform: translate(-50%, -50%) !important;
}

.contenedor-superior-header .boton-menu svg,
.contenedor-superior-header .boton-menu img:not(.boton-menu-icono-js),
.contenedor-superior-header .boton-menu i {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: calc(var(--header-icon-box) * 0.64) !important;
    height: calc(var(--header-icon-box) * 0.64) !important;
    max-width: calc(var(--header-icon-box) * 0.64) !important;
    max-height: calc(var(--header-icon-box) * 0.64) !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    transform: translate(-50%, -50%) scale(1) !important;
    transition:
        opacity 0.32s ease,
        transform 0.42s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.contenedor-superior-header .boton-menu::before,
.contenedor-superior-header .boton-menu::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: var(--menu-x-size) !important;
    height: var(--menu-x-stroke) !important;
    min-width: var(--menu-x-size) !important;
    max-width: var(--menu-x-size) !important;
    min-height: var(--menu-x-stroke) !important;
    max-height: var(--menu-x-stroke) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    background-image: none !important;
    opacity: 0 !important;
    visibility: visible !important;
    pointer-events: none !important;
    transform-origin: center center !important;
    transition:
        opacity 0.32s ease,
        transform 0.42s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.contenedor-superior-header .boton-menu::before {
    transform: translate(-50%, -50%) rotate(45deg) scale(0.96) !important;
}

.contenedor-superior-header .boton-menu::after {
    transform: translate(-50%, -50%) rotate(-45deg) scale(0.96) !important;
}

.contenedor-superior-header .boton-menu.boton-menu-activo svg,
.contenedor-superior-header .boton-menu.boton-menu-activo img:not(.boton-menu-icono-js),
.contenedor-superior-header .boton-menu.boton-menu-activo i,
.contenedor-superior-header .boton-menu.boton-menu-activo .elementor-icon {
    opacity: 0 !important;
    transform: translate(-50%, -50%) scale(0.96) !important;
}

.contenedor-superior-header .boton-menu.boton-menu-activo::before {
    opacity: 1 !important;
    transform: translate(-50%, -50%) rotate(45deg) scale(1) !important;
}

.contenedor-superior-header .boton-menu.boton-menu-activo::after {
    opacity: 1 !important;
    transform: translate(-50%, -50%) rotate(-45deg) scale(1) !important;
}

/* Menu desplegable */
.menu-desplegable {
    --menu-font-main: clamp(20px, 1.65vw, 32px);
    --menu-font-lang: clamp(10px, 0.78vw, 13px);
    --menu-main-gap: clamp(14px, 2.8vh, 30px);
    --menu-lang-gap: clamp(24px, 4.6vw, 78px);
    --menu-lang-mt: clamp(6px, 1.2vh, 14px);

    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-height: 100vh !important;
    max-height: 100vh !important;
    z-index: 99999 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(0) scale(1.015) !important;
    margin: 0 !important;
    padding: clamp(76px, 10vh, 118px) clamp(18px, 4vw, 56px) clamp(48px, 7vh, 84px) !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    background: transparent !important;
    transition:
        opacity 0.85s cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0.85s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.95s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.85s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.menu-desplegable.menu-abierto {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
    background: rgba(0, 0, 0, 0.06) !important;
}

.menu-desplegable.menu-cerrando {
    opacity: 0 !important;
    visibility: visible !important;
    pointer-events: none !important;
    transform: translateY(0) scale(1.015) !important;
    background: transparent !important;
}

.menu-desplegable,
.menu-desplegable * {
    font-family: "Lato Local", "Lato", Arial, sans-serif !important;
    font-weight: 400 !important;
}

.menu-desplegable,
.menu-desplegable .elementor-section,
.menu-desplegable .elementor-container,
.menu-desplegable .elementor-widget-wrap,
.menu-desplegable .e-con,
.menu-desplegable .e-con-inner,
.menu-desplegable .elementor-widget-container,
.menu-desplegable .elementor-element {
    background-color: transparent !important;
}

.menu-desplegable > *,
.menu-desplegable .elementor-container,
.menu-desplegable .elementor-widget-wrap,
.menu-desplegable .elementor-element {
    position: relative !important;
    z-index: 2 !important;
}

.menu-desplegable > .elementor-element-6907121 {
    --gap: var(--menu-main-gap) !important;
    width: 100% !important;
    max-width: 920px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: var(--menu-main-gap) !important;
    margin: 0 !important;
    padding: 0 !important;
}

.menu-desplegable .filmografia-texto,
.menu-desplegable .quienes-somos-texto,
.menu-desplegable .contacto-texto,
.menu-desplegable .texto {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    opacity: 0 !important;
    transform: translateY(24px) scale(0.985) !important;
    transition:
        opacity 0.78s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.88s cubic-bezier(0.22, 1, 0.36, 1),
        color 0.35s ease !important;
}

.menu-desplegable.menu-abierto .filmografia-texto,
.menu-desplegable.menu-abierto .quienes-somos-texto,
.menu-desplegable.menu-abierto .contacto-texto,
.menu-desplegable.menu-abierto .texto {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
    transition-delay: 0.22s !important;
}

.menu-desplegable.menu-cerrando .filmografia-texto,
.menu-desplegable.menu-cerrando .quienes-somos-texto,
.menu-desplegable.menu-cerrando .contacto-texto,
.menu-desplegable.menu-cerrando .texto {
    opacity: 0 !important;
    transform: translateY(24px) scale(0.985) !important;
    transition-delay: 0s !important;
}

.menu-desplegable .filmografia-texto .elementor-heading-title,
.menu-desplegable .quienes-somos-texto .elementor-heading-title,
.menu-desplegable .contacto-texto .elementor-heading-title,
.menu-desplegable .texto .elementor-heading-title,
.menu-desplegable .filmografia-texto a,
.menu-desplegable .quienes-somos-texto a,
.menu-desplegable .contacto-texto a,
.menu-desplegable .texto a {
    font-family: "Lato Local", "Lato", Arial, sans-serif !important;
    font-size: var(--menu-font-main) !important;
    font-weight: 400 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-decoration: none !important;
}

.menu-desplegable.menu-abierto .filmografia-texto,
.menu-desplegable.menu-abierto .quienes-somos-texto,
.menu-desplegable.menu-abierto .contacto-texto,
.menu-desplegable.menu-abierto .texto,
.menu-desplegable.menu-abierto .filmografia-texto *,
.menu-desplegable.menu-abierto .quienes-somos-texto *,
.menu-desplegable.menu-abierto .contacto-texto *,
.menu-desplegable.menu-abierto .texto * {
    pointer-events: auto !important;
    cursor: pointer !important;
}

.menu-desplegable.menu-abierto .filmografia-texto:hover,
.menu-desplegable.menu-abierto .quienes-somos-texto:hover,
.menu-desplegable.menu-abierto .contacto-texto:hover,
.menu-desplegable.menu-abierto .texto:hover,
.menu-desplegable.menu-abierto .filmografia-texto:hover .elementor-heading-title,
.menu-desplegable.menu-abierto .quienes-somos-texto:hover .elementor-heading-title,
.menu-desplegable.menu-abierto .contacto-texto:hover .elementor-heading-title,
.menu-desplegable.menu-abierto .texto:hover .elementor-heading-title {
    transform: scale(1.035) !important;
    letter-spacing: 0 !important;
}

.menu-desplegable > .elementor-element-c35d458 {
    --gap: var(--menu-lang-gap) !important;
    width: 100% !important;
    max-width: 460px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    column-gap: var(--menu-lang-gap) !important;
    row-gap: 8px !important;
    margin: var(--menu-lang-mt) auto 0 !important;
    padding: 0 !important;
}

.menu-desplegable > .e-con:has(.boton-idioma-eu),
.menu-desplegable > .e-con:has(.boton-idioma-en),
.menu-desplegable > .e-con:has(.boton-idioma-es) {
    --gap: var(--menu-lang-gap) !important;
    width: 100% !important;
    max-width: 460px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    column-gap: var(--menu-lang-gap) !important;
    row-gap: 8px !important;
    margin: var(--menu-lang-mt) auto 0 !important;
    padding: 0 !important;
}

.menu-desplegable .boton-idioma-eu,
.menu-desplegable .boton-idioma-en,
.menu-desplegable .boton-idioma-es {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    line-height: 1 !important;
    visibility: visible !important;
    opacity: 0 !important;
    transform: translateY(24px) scale(0.985) !important;
    transition:
        opacity 0.78s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.88s cubic-bezier(0.22, 1, 0.36, 1),
        color 0.35s ease !important;
}

.menu-desplegable .boton-idioma-eu,
.menu-desplegable .boton-idioma-en,
.menu-desplegable .boton-idioma-es,
.menu-desplegable .boton-idioma-eu *,
.menu-desplegable .boton-idioma-en *,
.menu-desplegable .boton-idioma-es * {
    font-family: "Lato Local", "Lato", Arial, sans-serif !important;
    font-size: var(--menu-font-lang) !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: transparent !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

.menu-desplegable.menu-abierto .boton-idioma-eu,
.menu-desplegable.menu-abierto .boton-idioma-en,
.menu-desplegable.menu-abierto .boton-idioma-es {
    opacity: 0.72 !important;
    transform: translateY(0) scale(1) !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    transition-delay: 0.22s !important;
}

.menu-desplegable.menu-abierto .boton-idioma-eu.idioma-activo,
.menu-desplegable.menu-abierto .boton-idioma-en.idioma-activo,
.menu-desplegable.menu-abierto .boton-idioma-es.idioma-activo {
    opacity: 1 !important;
}

@media (max-width: 1024px) {
    .contenedor-superior-header {
        --header-x: clamp(18px, 4vw, 42px);
        --header-h: clamp(76px, 9vw, 100px);
        --header-logo-w: clamp(190px, 25vw, 280px);
        --header-icon-box: 42px;
        --header-icon-gap: 16px;
        --menu-x-size: 18px;
    }

    .menu-desplegable {
        --menu-font-main: clamp(19px, 2.5vw, 27px);
        --menu-font-lang: 11px;
        --menu-main-gap: clamp(12px, 2.4vh, 24px);
        --menu-lang-gap: clamp(22px, 5vw, 52px);
        --menu-lang-mt: 8px;
    }
}

@media (max-width: 767px) {
    .contenedor-superior-header {
        --header-x: clamp(14px, 5vw, 26px);
        --header-h: 72px;
        --header-logo-w: clamp(155px, 42vw, 205px);
        --header-icon-box: 38px;
        --header-icon-gap: 10px;
        --menu-x-size: 17px;
        --menu-x-stroke: 2px;
    }

    html.menu-desplegable-bloqueado .contenedor-superior-header > .elementor-element-e236ed3,
    body.menu-desplegable-bloqueado .contenedor-superior-header > .elementor-element-e236ed3 {
        transform: translateY(-50%) !important;
    }

    .contenedor-superior-header .elementor-widget-tl-site-logo a {
        max-width: calc(100vw - 126px) !important;
    }

    .menu-desplegable {
        --menu-font-main: clamp(18px, 5.3vw, 22px);
        --menu-font-lang: 10.5px;
        --menu-main-gap: clamp(10px, 2.2vh, 18px);
        --menu-lang-gap: clamp(16px, 5vw, 28px);
        --menu-lang-mt: 6px;
        padding: 74px 18px 44px !important;
    }

    .menu-desplegable > .elementor-element-c35d458 {
        max-width: 100% !important;
    }

    .menu-desplegable > .e-con:has(.boton-idioma-eu),
    .menu-desplegable > .e-con:has(.boton-idioma-en),
    .menu-desplegable > .e-con:has(.boton-idioma-es) {
        max-width: 100% !important;
    }

    body.menu-blur-activo::before {
        background: rgba(0, 0, 0, 0.78) !important;
        backdrop-filter: blur(14px) !important;
        -webkit-backdrop-filter: blur(14px) !important;
    }
}

@media (max-width: 390px) {
    .contenedor-superior-header {
        --header-x: 13px;
        --header-logo-w: 158px;
        --header-icon-box: 36px;
        --header-icon-gap: 8px;
        --menu-x-size: 16px;
    }

    .contenedor-superior-header .elementor-widget-tl-site-logo a {
        max-width: calc(100vw - 112px) !important;
    }
}

@media (max-height: 640px) {
    .menu-desplegable {
        --menu-font-main: clamp(17px, 4.8vh, 24px);
        --menu-font-lang: 10px;
        --menu-main-gap: 10px;
        --menu-lang-mt: 5px;
        padding-top: 66px !important;
        padding-bottom: 32px !important;
    }
}


/* =====================================================
   HEADER DARK - MATCH EXACTO CON HEADER TRANSPARENT
   Pegar AL FINAL, despues de todos los CSS del Header Dark.
   Ajustado segun las capturas: mismo tamano, posicion y espaciado.
   ===================================================== */

.menu-desplegable {
    --dark-menu-main-w: min(92vw, 720px) !important;
    --dark-menu-text-size: 32px !important;
    --dark-menu-lang-size: 13px !important;

    /* Posiciones desktop para igualar el Header Transparent */
    --dark-menu-filmografia-y: calc(42.8vh + 0px) !important;
    --dark-menu-quienes-y: calc(49.5vh + 0px) !important;
    --dark-menu-contacto-y: calc(56.25vh + 0px) !important;
    --dark-menu-idiomas-y: calc(65.7vh + 0px) !important;
}

/* Anula cualquier reparto vertical de Elementor en el Dark. */
.menu-desplegable > .elementor-element-6907121,
.menu-desplegable > .e-con:has(.filmografia-texto),
.menu-desplegable > .e-con:has(.quienes-somos-texto),
.menu-desplegable > .e-con:has(.contacto-texto) {
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    flex: 0 0 0 !important;
    display: block !important;
    align-items: initial !important;
    justify-content: initial !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
}

.menu-desplegable .filmografia-texto,
.menu-desplegable .quienes-somos-texto,
.menu-desplegable .contacto-texto {
    position: fixed !important;
    left: 50% !important;
    width: var(--dark-menu-main-w) !important;
    max-width: var(--dark-menu-main-w) !important;
    min-width: 0 !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    line-height: 1 !important;
    z-index: 100006 !important;
}

.menu-desplegable .filmografia-texto {
    top: var(--dark-menu-filmografia-y) !important;
}

.menu-desplegable .quienes-somos-texto {
    top: var(--dark-menu-quienes-y) !important;
}

.menu-desplegable .contacto-texto {
    top: var(--dark-menu-contacto-y) !important;
}

.menu-desplegable.menu-abierto .filmografia-texto,
.menu-desplegable.menu-abierto .quienes-somos-texto,
.menu-desplegable.menu-abierto .contacto-texto {
    opacity: 1 !important;
    transform: translateX(-50%) translateY(0) scale(1) !important;
}

.menu-desplegable:not(.menu-abierto) .filmografia-texto,
.menu-desplegable:not(.menu-abierto) .quienes-somos-texto,
.menu-desplegable:not(.menu-abierto) .contacto-texto,
.menu-desplegable.menu-cerrando .filmografia-texto,
.menu-desplegable.menu-cerrando .quienes-somos-texto,
.menu-desplegable.menu-cerrando .contacto-texto {
    opacity: 0 !important;
    transform: translateX(-50%) translateY(24px) scale(0.985) !important;
}

.menu-desplegable .filmografia-texto .elementor-heading-title,
.menu-desplegable .quienes-somos-texto .elementor-heading-title,
.menu-desplegable .contacto-texto .elementor-heading-title,
.menu-desplegable .filmografia-texto a,
.menu-desplegable .quienes-somos-texto a,
.menu-desplegable .contacto-texto a,
.menu-desplegable .filmografia-texto span,
.menu-desplegable .quienes-somos-texto span,
.menu-desplegable .contacto-texto span {
    font-family: "Lato Local", "Lato", Arial, sans-serif !important;
    font-size: var(--dark-menu-text-size) !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Idiomas en la misma linea y altura que el Transparent. */
.menu-desplegable > .elementor-element-c35d458,
.menu-desplegable > .e-con:has(.boton-idioma-eu),
.menu-desplegable > .e-con:has(.boton-idioma-en),
.menu-desplegable > .e-con:has(.boton-idioma-es) {
    position: fixed !important;
    left: 50% !important;
    top: var(--dark-menu-idiomas-y) !important;
    width: 350px !important;
    max-width: 350px !important;
    min-width: 350px !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    align-items: center !important;
    justify-items: center !important;
    gap: 0 !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateX(-50%) !important;
    z-index: 100005 !important;
}

.menu-desplegable .boton-idioma-eu,
.menu-desplegable .boton-idioma-en,
.menu-desplegable .boton-idioma-es {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    line-height: 1 !important;
    flex: initial !important;
}

.menu-desplegable.menu-abierto .boton-idioma-eu,
.menu-desplegable.menu-abierto .boton-idioma-en,
.menu-desplegable.menu-abierto .boton-idioma-es {
    opacity: 0.72 !important;
    transform: translateY(0) scale(1) !important;
}

.menu-desplegable.menu-abierto .boton-idioma-eu.idioma-activo,
.menu-desplegable.menu-abierto .boton-idioma-en.idioma-activo,
.menu-desplegable.menu-abierto .boton-idioma-es.idioma-activo {
    opacity: 1 !important;
}

.menu-desplegable .boton-idioma-eu,
.menu-desplegable .boton-idioma-en,
.menu-desplegable .boton-idioma-es,
.menu-desplegable .boton-idioma-eu *,
.menu-desplegable .boton-idioma-en *,
.menu-desplegable .boton-idioma-es * {
    font-family: "Lato Local", "Lato", Arial, sans-serif !important;
    font-size: var(--dark-menu-lang-size) !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 1024px) {
    .menu-desplegable {
        --dark-menu-text-size: 29px !important;
        --dark-menu-lang-size: 11px !important;
        --dark-menu-filmografia-y: 42.8vh !important;
        --dark-menu-quienes-y: 49.5vh !important;
        --dark-menu-contacto-y: 56.2vh !important;
        --dark-menu-idiomas-y: 65.7vh !important;
    }

    .menu-desplegable > .elementor-element-c35d458,
    .menu-desplegable > .e-con:has(.boton-idioma-eu),
    .menu-desplegable > .e-con:has(.boton-idioma-en),
    .menu-desplegable > .e-con:has(.boton-idioma-es) {
        width: 330px !important;
        max-width: 330px !important;
        min-width: 330px !important;
    }
}

@media (max-width: 767px) {
    .menu-desplegable {
        --dark-menu-main-w: min(94vw, 420px) !important;
        --dark-menu-text-size: clamp(20px, 6vw, 24px) !important;
        --dark-menu-lang-size: 10.5px !important;
        --dark-menu-filmografia-y: 41vh !important;
        --dark-menu-quienes-y: 48vh !important;
        --dark-menu-contacto-y: 55vh !important;
        --dark-menu-idiomas-y: 64.5vh !important;
    }

    .menu-desplegable .filmografia-texto,
    .menu-desplegable .quienes-somos-texto,
    .menu-desplegable .contacto-texto {
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
    }

    .menu-desplegable > .elementor-element-c35d458,
    .menu-desplegable > .e-con:has(.boton-idioma-eu),
    .menu-desplegable > .e-con:has(.boton-idioma-en),
    .menu-desplegable > .e-con:has(.boton-idioma-es) {
        width: min(88vw, 330px) !important;
        max-width: min(88vw, 330px) !important;
        min-width: 0 !important;
    }
}

@media (max-height: 640px) {
    .menu-desplegable {
        --dark-menu-text-size: clamp(18px, 5vh, 24px) !important;
        --dark-menu-lang-size: 10px !important;
        --dark-menu-filmografia-y: 36vh !important;
        --dark-menu-quienes-y: 45vh !important;
        --dark-menu-contacto-y: 54vh !important;
        --dark-menu-idiomas-y: 66vh !important;
    }
}
/* =====================================================
   HEADER DARK - TEXTOS EXACTOS COMO HEADER TRANSPARENT
   Pegar AL FINAL de todo el CSS del Header Dark.

   Medido contra:
   https://mirokutana.grupocodeum.com.es/?elementor_library=elementor-header-23373
   Viewport desktop medido: 1920x916
   ===================================================== */

.menu-desplegable {
    --dark-match-main-width: min(920px, 92vw) !important;
    --dark-match-font-main: clamp(24px, 1.65vw, 31.68px) !important;
    --dark-match-line-main: 1.08 !important;
    --dark-match-font-lang: 13px !important;
    --dark-match-line-lang: 1.2 !important;
    --dark-match-lang-width: 460px !important;

    /* Valores exactos del Header Transparent: se aplican como TOP de caja. */
    --dark-match-filmografia-top: 39.70vh !important;
    --dark-match-quienes-top: 46.24vh !important;
    --dark-match-contacto-top: 52.77vh !important;
    --dark-match-idiomas-top: 61.60vh !important;
}

/* El contenedor interno del Header Dark no debe repartir ni compactar los textos. */
.menu-desplegable > .elementor-element-6907121,
.menu-desplegable > .e-con:has(.filmografia-texto),
.menu-desplegable > .e-con:has(.quienes-somos-texto),
.menu-desplegable > .e-con:has(.contacto-texto) {
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    flex: 0 0 0 !important;
    display: block !important;
    align-items: initial !important;
    justify-content: initial !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
}

/* Lineas principales: misma anchura, posicion, fuente y espaciado que Transparent. */
.menu-desplegable .filmografia-texto,
.menu-desplegable .quienes-somos-texto,
.menu-desplegable .contacto-texto {
    position: fixed !important;
    left: 50% !important;
    width: var(--dark-match-main-width) !important;
    max-width: var(--dark-match-main-width) !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    z-index: 100006 !important;
}

.menu-desplegable .filmografia-texto {
    top: var(--dark-match-filmografia-top) !important;
}

.menu-desplegable .quienes-somos-texto {
    top: var(--dark-match-quienes-top) !important;
}

.menu-desplegable .contacto-texto {
    top: var(--dark-match-contacto-top) !important;
}

.menu-desplegable.menu-abierto .filmografia-texto,
.menu-desplegable.menu-abierto .quienes-somos-texto,
.menu-desplegable.menu-abierto .contacto-texto {
    opacity: 1 !important;
    transform: translateX(-50%) translateY(0) scale(1) !important;
}

.menu-desplegable:not(.menu-abierto) .filmografia-texto,
.menu-desplegable:not(.menu-abierto) .quienes-somos-texto,
.menu-desplegable:not(.menu-abierto) .contacto-texto,
.menu-desplegable.menu-cerrando .filmografia-texto,
.menu-desplegable.menu-cerrando .quienes-somos-texto,
.menu-desplegable.menu-cerrando .contacto-texto {
    opacity: 0 !important;
    transform: translateX(-50%) translateY(24px) scale(0.985) !important;
}

.menu-desplegable .filmografia-texto,
.menu-desplegable .quienes-somos-texto,
.menu-desplegable .contacto-texto,
.menu-desplegable .filmografia-texto *,
.menu-desplegable .quienes-somos-texto *,
.menu-desplegable .contacto-texto * {
    font-family: "Lato Local", "Lato", Arial, sans-serif !important;
    font-size: var(--dark-match-font-main) !important;
    font-weight: 400 !important;
    line-height: var(--dark-match-line-main) !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.menu-desplegable .filmografia-texto .elementor-heading-title,
.menu-desplegable .quienes-somos-texto .elementor-heading-title,
.menu-desplegable .contacto-texto .elementor-heading-title,
.menu-desplegable .filmografia-texto a,
.menu-desplegable .quienes-somos-texto a,
.menu-desplegable .contacto-texto a,
.menu-desplegable .filmografia-texto span,
.menu-desplegable .quienes-somos-texto span,
.menu-desplegable .contacto-texto span {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Idiomas: misma caja y reparto que Transparent. */
.menu-desplegable > .elementor-element-c35d458,
.menu-desplegable > .e-con:has(.boton-idioma-eu),
.menu-desplegable > .e-con:has(.boton-idioma-en),
.menu-desplegable > .e-con:has(.boton-idioma-es) {
    position: fixed !important;
    left: 50% !important;
    top: var(--dark-match-idiomas-top) !important;
    width: var(--dark-match-lang-width) !important;
    max-width: var(--dark-match-lang-width) !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    column-gap: 78px !important;
    row-gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateX(-50%) !important;
    z-index: 100005 !important;
}

.menu-desplegable .boton-idioma-eu,
.menu-desplegable .boton-idioma-en,
.menu-desplegable .boton-idioma-es {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    line-height: 1 !important;
    flex: 0 0 auto !important;
}

.menu-desplegable.menu-abierto .boton-idioma-eu,
.menu-desplegable.menu-abierto .boton-idioma-en,
.menu-desplegable.menu-abierto .boton-idioma-es {
    opacity: 0.72 !important;
    transform: translateY(0) scale(1) !important;
}

.menu-desplegable.menu-abierto .boton-idioma-eu.idioma-activo,
.menu-desplegable.menu-abierto .boton-idioma-en.idioma-activo,
.menu-desplegable.menu-abierto .boton-idioma-es.idioma-activo {
    opacity: 1 !important;
}

.menu-desplegable .boton-idioma-eu,
.menu-desplegable .boton-idioma-en,
.menu-desplegable .boton-idioma-es,
.menu-desplegable .boton-idioma-eu *,
.menu-desplegable .boton-idioma-en *,
.menu-desplegable .boton-idioma-es * {
    font-family: "Lato Local", "Lato", Arial, sans-serif !important;
    font-size: var(--dark-match-font-lang) !important;
    font-weight: 400 !important;
    line-height: var(--dark-match-line-lang) !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 1024px) {
    .menu-desplegable {
        --dark-match-font-main: clamp(24px, 3vw, 30px) !important;
        --dark-match-font-lang: 11px !important;
        --dark-match-lang-width: min(460px, 88vw) !important;
        --dark-match-filmografia-top: 39.70vh !important;
        --dark-match-quienes-top: 46.24vh !important;
        --dark-match-contacto-top: 52.77vh !important;
        --dark-match-idiomas-top: 61.60vh !important;
    }

    .menu-desplegable > .elementor-element-c35d458,
    .menu-desplegable > .e-con:has(.boton-idioma-eu),
    .menu-desplegable > .e-con:has(.boton-idioma-en),
    .menu-desplegable > .e-con:has(.boton-idioma-es) {
        column-gap: clamp(38px, 7.5vw, 78px) !important;
    }
}

@media (max-width: 767px) {
    .menu-desplegable {
        --dark-match-main-width: min(420px, 94vw) !important;
        --dark-match-font-main: clamp(20px, 5.8vw, 24px) !important;
        --dark-match-font-lang: 10.5px !important;
        --dark-match-lang-width: min(360px, 88vw) !important;
        --dark-match-filmografia-top: 39vh !important;
        --dark-match-quienes-top: 46.2vh !important;
        --dark-match-contacto-top: 53.4vh !important;
        --dark-match-idiomas-top: 63vh !important;
    }

    .menu-desplegable > .elementor-element-c35d458,
    .menu-desplegable > .e-con:has(.boton-idioma-eu),
    .menu-desplegable > .e-con:has(.boton-idioma-en),
    .menu-desplegable > .e-con:has(.boton-idioma-es) {
        column-gap: clamp(20px, 5vw, 36px) !important;
    }
}
/* Quitar desplazamiento lateral en hover de los textos del menu */
.menu-desplegable-header a,
.menu-desplegable-header a:hover,
.menu-desplegable-header a:focus,
.menu-desplegable-header a:active,
.mirokutana-menu a,
.mirokutana-menu a:hover,
.mirokutana-menu a:focus,
.mirokutana-menu a:active,
.menu-overlay-mirokutana a,
.menu-overlay-mirokutana a:hover,
.menu-overlay-mirokutana a:focus,
.menu-overlay-mirokutana a:active {
    transform: none !important;
    translate: 0 0 !important;
    left: auto !important;
    margin-left: 0 !important;
    margin-inline-start: 0 !important;
    padding-left: 0 !important;
    padding-inline-start: 0 !important;
}

/* Evita que pseudo-elementos provoquen movimiento */
.menu-desplegable-header a::before,
.menu-desplegable-header a::after,
.mirokutana-menu a::before,
.mirokutana-menu a::after,
.menu-overlay-mirokutana a::before,
.menu-overlay-mirokutana a::after {
    transform: none !important;
    translate: 0 0 !important;
    left: auto !important;
    margin-left: 0 !important;
}

/* Mantiene hover visual sin desplazamiento */
.menu-desplegable-header a:hover,
.mirokutana-menu a:hover,
.menu-overlay-mirokutana a:hover {
    opacity: 0.72;
}
/* =====================================================
   HEADER DARK - SIN DESPLAZAMIENTO EN HOVER DE TEXTOS
   Pegar AL FINAL de todo el CSS del Header Dark.

   Corrige el salto lateral del menu:
   el hover anterior sustituia translateX(-50%) por scale(...),
   y por eso los textos dejaban de estar centrados.
   ===================================================== */

html body .menu-desplegable.menu-abierto .filmografia-texto:hover,
html body .menu-desplegable.menu-abierto .quienes-somos-texto:hover,
html body .menu-desplegable.menu-abierto .contacto-texto:hover {
    transform: translateX(-50%) translateY(0) scale(1) !important;
    translate: 0 0 !important;
    left: 50% !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    letter-spacing: 0 !important;
}

html body .menu-desplegable.menu-abierto .filmografia-texto:hover *,
html body .menu-desplegable.menu-abierto .quienes-somos-texto:hover *,
html body .menu-desplegable.menu-abierto .contacto-texto:hover *,
html body .menu-desplegable.menu-abierto .filmografia-texto:hover .elementor-heading-title,
html body .menu-desplegable.menu-abierto .quienes-somos-texto:hover .elementor-heading-title,
html body .menu-desplegable.menu-abierto .contacto-texto:hover .elementor-heading-title {
    transform: none !important;
    translate: 0 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    letter-spacing: 0 !important;
}

html body .menu-desplegable.menu-abierto .filmografia-texto:hover::before,
html body .menu-desplegable.menu-abierto .filmografia-texto:hover::after,
html body .menu-desplegable.menu-abierto .quienes-somos-texto:hover::before,
html body .menu-desplegable.menu-abierto .quienes-somos-texto:hover::after,
html body .menu-desplegable.menu-abierto .contacto-texto:hover::before,
html body .menu-desplegable.menu-abierto .contacto-texto:hover::after {
    transform: none !important;
    translate: 0 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

html body .menu-desplegable.menu-abierto .boton-idioma-eu:hover,
html body .menu-desplegable.menu-abierto .boton-idioma-en:hover,
html body .menu-desplegable.menu-abierto .boton-idioma-es:hover {
    transform: translateY(0) scale(1) !important;
    translate: 0 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    letter-spacing: 0 !important;
}

html body .menu-desplegable.menu-abierto .boton-idioma-eu:hover *,
html body .menu-desplegable.menu-abierto .boton-idioma-en:hover *,
html body .menu-desplegable.menu-abierto .boton-idioma-es:hover * {
    transform: none !important;
    translate: 0 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    letter-spacing: 0 !important;
}
/* =====================================================
   HEADER DARK - GROW COMO HEADER TRANSPARENT SIN SALTO
   Pegar AL FINAL, despues del parche sin desplazamiento.

   El contenedor conserva translateX(-50%) para no moverse.
   El efecto grow se aplica solo al texto interno.
   ===================================================== */

html body .menu-desplegable.menu-abierto .filmografia-texto,
html body .menu-desplegable.menu-abierto .quienes-somos-texto,
html body .menu-desplegable.menu-abierto .contacto-texto {
    transform: translateX(-50%) translateY(0) scale(1) !important;
}

html body .menu-desplegable .filmografia-texto .elementor-heading-title,
html body .menu-desplegable .quienes-somos-texto .elementor-heading-title,
html body .menu-desplegable .contacto-texto .elementor-heading-title {
    display: block !important;
    transform: scale(1) !important;
    transform-origin: center center !important;
    transition:
        transform 0.42s cubic-bezier(0.16, 1, 0.3, 1),
        opacity 0.32s ease,
        color 0.32s ease !important;
    will-change: transform !important;
}

html body .menu-desplegable.menu-abierto .filmografia-texto:hover,
html body .menu-desplegable.menu-abierto .quienes-somos-texto:hover,
html body .menu-desplegable.menu-abierto .contacto-texto:hover {
    transform: translateX(-50%) translateY(0) scale(1) !important;
    left: 50% !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    letter-spacing: 0 !important;
}

html body .menu-desplegable.menu-abierto .filmografia-texto:hover .elementor-heading-title,
html body .menu-desplegable.menu-abierto .quienes-somos-texto:hover .elementor-heading-title,
html body .menu-desplegable.menu-abierto .contacto-texto:hover .elementor-heading-title {
    transform: scale(1.035) !important;
    transform-origin: center center !important;
    letter-spacing: 0 !important;
}

html body .menu-desplegable.menu-abierto .filmografia-texto:hover a,
html body .menu-desplegable.menu-abierto .quienes-somos-texto:hover a,
html body .menu-desplegable.menu-abierto .contacto-texto:hover a {
    transform: none !important;
    translate: 0 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

html body .menu-desplegable .boton-idioma-eu,
html body .menu-desplegable .boton-idioma-en,
html body .menu-desplegable .boton-idioma-es {
    transform-origin: center center !important;
    transition:
        transform 0.42s cubic-bezier(0.16, 1, 0.3, 1),
        opacity 0.32s ease,
        color 0.32s ease !important;
}

html body .menu-desplegable.menu-abierto .boton-idioma-eu:hover,
html body .menu-desplegable.menu-abierto .boton-idioma-en:hover,
html body .menu-desplegable.menu-abierto .boton-idioma-es:hover {
    transform: translateY(0) scale(1.035) !important;
    transform-origin: center center !important;
    translate: 0 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    letter-spacing: 0 !important;
}
/* =====================================================
   HEADER DARK - STICKY
   Pegar AL FINAL de todo el CSS del Header Dark.

   Hace sticky solo la barra superior del Header Dark.
   No modifica la logica del sonido ni del menu desplegable.
   ===================================================== */

:root {
    --mirokutana-header-sticky-top: 0px;
}

body.admin-bar {
    --mirokutana-header-sticky-top: 32px;
}

@media (max-width: 782px) {
    body.admin-bar {
        --mirokutana-header-sticky-top: 46px;
    }
}

/* El wrapper de Elementor debe permitir que sticky funcione. */
html body .elementor-location-header,
html body .elementor-location-header > .elementor,
html body .elementor-location-header .elementor-section-wrap,
html body .elementor-location-header .elementor-element {
    overflow: visible !important;
}

/* Sticky aplicado al Header Dark. */
html body .contenedor-superior-header {
    position: sticky !important;
    top: var(--mirokutana-header-sticky-top) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 100010 !important;
    transform: none !important;
    will-change: transform !important;
}

/* Evita que Elementor o efectos de scroll lo tapen. */
html body .elementor-location-header:has(.contenedor-superior-header) {
    position: sticky !important;
    top: var(--mirokutana-header-sticky-top) !important;
    z-index: 100010 !important;
    overflow: visible !important;
}

/* Cuando el menu esta abierto, el header sigue encima del blur. */
html body.menu-blur-activo .contenedor-superior-header,
html.menu-desplegable-bloqueado body .contenedor-superior-header,
html body.menu-desplegable-bloqueado .contenedor-superior-header {
    position: sticky !important;
    top: var(--mirokutana-header-sticky-top) !important;
    z-index: 100010 !important;
}

/* En moviles/tablets mantiene el mismo comportamiento sticky. */
@media (max-width: 1024px) {
    html body .contenedor-superior-header,
    html body .elementor-location-header:has(.contenedor-superior-header) {
        position: sticky !important;
        top: var(--mirokutana-header-sticky-top) !important;
        z-index: 100010 !important;
    }
}

/* =====================================================
   MIROKUTANA - HEADER DARK
   ANIMACIÓN SINCRONIZADA CON EL OTRO HEADER

   Este bloque sustituye al parche de rendimiento anterior.
   Mantiene el diseño, tamaños, posiciones, hover, sticky,
   logo, audio, idiomas y enlaces reales.

   La apertura y el cierre duran 320 ms, igual que el JS.
   ===================================================== */

:root {
    --mirokutana-menu-apertura: 320ms;
    --mirokutana-menu-cierre: 320ms;
    --mirokutana-menu-easing: cubic-bezier(0.22, 1, 0.36, 1);
}


/* =====================================================
   FONDO OSCURO
   Solo anima opacidad. No usa blur ni escala.
   ===================================================== */

html body::before {
    content: "" !important;

    position: fixed !important;
    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;

    z-index: 99998 !important;

    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;

    background: rgba(0, 0, 0, 0.72) !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    filter: none !important;

    transform: none !important;
    translate: none !important;

    transition:
        opacity var(--mirokutana-menu-apertura)
            var(--mirokutana-menu-easing),
        visibility 0s linear
            var(--mirokutana-menu-apertura) !important;

    will-change: opacity !important;
}

html body.menu-blur-activo::before {
    opacity: 1 !important;
    visibility: visible !important;

    background: rgba(0, 0, 0, 0.72) !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    filter: none !important;

    transform: none !important;
    translate: none !important;

    transition:
        opacity var(--mirokutana-menu-apertura)
            var(--mirokutana-menu-easing),
        visibility 0s linear 0s !important;
}


/* =====================================================
   MENÚ A PANTALLA COMPLETA
   Misma respuesta que el otro header:
   opacity + visibility, sin escala de la pantalla.
   ===================================================== */

html body .menu-desplegable {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;

    transform: none !important;
    translate: none !important;

    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    background: transparent !important;

    transition:
        opacity var(--mirokutana-menu-apertura)
            var(--mirokutana-menu-easing),
        visibility 0s linear
            var(--mirokutana-menu-apertura) !important;

    will-change: opacity !important;

    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
}

html body .menu-desplegable.menu-abierto {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;

    transform: none !important;
    translate: none !important;

    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    background: transparent !important;

    transition:
        opacity var(--mirokutana-menu-apertura)
            var(--mirokutana-menu-easing),
        visibility 0s linear 0s !important;
}

html body .menu-desplegable.menu-cerrando {
    opacity: 0 !important;
    visibility: visible !important;
    pointer-events: none !important;

    transform: none !important;
    translate: none !important;

    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    background: transparent !important;

    transition:
        opacity var(--mirokutana-menu-cierre)
            var(--mirokutana-menu-easing),
        visibility 0s linear
            var(--mirokutana-menu-cierre) !important;
}


/* =====================================================
   TEXTOS PRINCIPALES
   Todos comienzan a la vez, sin retardos escalonados.
   ===================================================== */

html body .menu-desplegable .filmografia-texto,
html body .menu-desplegable .quienes-somos-texto,
html body .menu-desplegable .contacto-texto {
    opacity: 0 !important;

    transform:
        translate3d(-50%, 18px, 0)
        scale(0.985) !important;

    transition:
        opacity var(--mirokutana-menu-apertura)
            var(--mirokutana-menu-easing),
        transform var(--mirokutana-menu-apertura)
            var(--mirokutana-menu-easing) !important;

    transition-delay: 0ms !important;

    will-change: opacity, transform !important;
}

html body .menu-desplegable .texto {
    opacity: 0 !important;

    transform:
        translate3d(0, 18px, 0)
        scale(0.985) !important;

    transition:
        opacity var(--mirokutana-menu-apertura)
            var(--mirokutana-menu-easing),
        transform var(--mirokutana-menu-apertura)
            var(--mirokutana-menu-easing) !important;

    transition-delay: 0ms !important;

    will-change: opacity, transform !important;
}

html body
    .menu-desplegable.menu-abierto
    .filmografia-texto,
html body
    .menu-desplegable.menu-abierto
    .quienes-somos-texto,
html body
    .menu-desplegable.menu-abierto
    .contacto-texto {
    opacity: 1 !important;

    transform:
        translate3d(-50%, 0, 0)
        scale(1) !important;

    transition-delay: 0ms !important;
}

html body
    .menu-desplegable.menu-abierto
    .texto {
    opacity: 1 !important;

    transform:
        translate3d(0, 0, 0)
        scale(1) !important;

    transition-delay: 0ms !important;
}

html body
    .menu-desplegable.menu-cerrando
    .filmografia-texto,
html body
    .menu-desplegable.menu-cerrando
    .quienes-somos-texto,
html body
    .menu-desplegable.menu-cerrando
    .contacto-texto {
    opacity: 0 !important;

    transform:
        translate3d(-50%, 12px, 0)
        scale(0.985) !important;

    transition-delay: 0ms !important;

    pointer-events: none !important;
}

html body
    .menu-desplegable.menu-cerrando
    .texto {
    opacity: 0 !important;

    transform:
        translate3d(0, 12px, 0)
        scale(0.985) !important;

    transition-delay: 0ms !important;

    pointer-events: none !important;
}


/* =====================================================
   HOVER PRINCIPAL
   Mantiene el centrado y el crecimiento original.
   ===================================================== */

html body
    .menu-desplegable.menu-abierto
    .filmografia-texto:hover,
html body
    .menu-desplegable.menu-abierto
    .quienes-somos-texto:hover,
html body
    .menu-desplegable.menu-abierto
    .contacto-texto:hover {
    left: 50% !important;

    transform:
        translate3d(-50%, 0, 0)
        scale(1) !important;

    translate: none !important;

    margin-left: 0 !important;
    padding-left: 0 !important;
    letter-spacing: 0 !important;
}

html body
    .menu-desplegable
    .filmografia-texto
    .elementor-heading-title,
html body
    .menu-desplegable
    .quienes-somos-texto
    .elementor-heading-title,
html body
    .menu-desplegable
    .contacto-texto
    .elementor-heading-title {
    transform: scale(1) !important;
    transform-origin: center center !important;

    transition:
        transform 320ms
            var(--mirokutana-menu-easing),
        opacity 320ms
            var(--mirokutana-menu-easing) !important;

    will-change: transform !important;
}

html body
    .menu-desplegable.menu-abierto
    .filmografia-texto:hover
    .elementor-heading-title,
html body
    .menu-desplegable.menu-abierto
    .quienes-somos-texto:hover
    .elementor-heading-title,
html body
    .menu-desplegable.menu-abierto
    .contacto-texto:hover
    .elementor-heading-title {
    transform: scale(1.035) !important;
}


/* =====================================================
   IDIOMAS
   Misma duración y comienzo simultáneo.
   ===================================================== */

html body .menu-desplegable .boton-idioma-eu,
html body .menu-desplegable .boton-idioma-en,
html body .menu-desplegable .boton-idioma-es {
    opacity: 0 !important;

    transform:
        translate3d(0, 18px, 0)
        scale(0.985) !important;

    transition:
        opacity var(--mirokutana-menu-apertura)
            var(--mirokutana-menu-easing),
        transform var(--mirokutana-menu-apertura)
            var(--mirokutana-menu-easing) !important;

    transition-delay: 0ms !important;

    will-change: opacity, transform !important;
}

html body
    .menu-desplegable.menu-abierto
    .boton-idioma-eu,
html body
    .menu-desplegable.menu-abierto
    .boton-idioma-en,
html body
    .menu-desplegable.menu-abierto
    .boton-idioma-es {
    opacity: 0.72 !important;

    transform:
        translate3d(0, 0, 0)
        scale(1) !important;

    transition-delay: 0ms !important;

    pointer-events: auto !important;
    cursor: pointer !important;
}

html body
    .menu-desplegable.menu-abierto
    .boton-idioma-eu.idioma-activo,
html body
    .menu-desplegable.menu-abierto
    .boton-idioma-en.idioma-activo,
html body
    .menu-desplegable.menu-abierto
    .boton-idioma-es.idioma-activo {
    opacity: 1 !important;
}

html body
    .menu-desplegable.menu-cerrando
    .boton-idioma-eu,
html body
    .menu-desplegable.menu-cerrando
    .boton-idioma-en,
html body
    .menu-desplegable.menu-cerrando
    .boton-idioma-es {
    opacity: 0 !important;

    transform:
        translate3d(0, 12px, 0)
        scale(0.985) !important;

    transition-delay: 0ms !important;

    pointer-events: none !important;
}

html body
    .menu-desplegable.menu-abierto
    .boton-idioma-eu:hover,
html body
    .menu-desplegable.menu-abierto
    .boton-idioma-en:hover,
html body
    .menu-desplegable.menu-abierto
    .boton-idioma-es:hover {
    opacity: 1 !important;

    transform:
        translate3d(0, 0, 0)
        scale(1.035) !important;

    translate: none !important;

    margin-left: 0 !important;
    padding-left: 0 !important;
    letter-spacing: 0 !important;
}


/* =====================================================
   BOTÓN HAMBURGUESA / X
   Sincronizado a 320 ms.
   ===================================================== */

html body
    .contenedor-superior-header
    .boton-menu
    svg,
html body
    .contenedor-superior-header
    .boton-menu
    img:not(.boton-menu-icono-js),
html body
    .contenedor-superior-header
    .boton-menu
    i,
html body
    .contenedor-superior-header
    .boton-menu
    .elementor-icon,
html body
    .contenedor-superior-header
    .boton-menu::before,
html body
    .contenedor-superior-header
    .boton-menu::after {
    transition:
        opacity 320ms
            var(--mirokutana-menu-easing),
        transform 320ms
            var(--mirokutana-menu-easing) !important;
}


/* =====================================================
   HEADER STICKY
   Elimina una capa gráfica permanente innecesaria.
   ===================================================== */

html body .contenedor-superior-header {
    will-change: auto !important;
}


/* =====================================================
   MÓVIL
   Conserva el tono más oscuro del diseño.
   ===================================================== */

@media (max-width: 767px) {
    html body.menu-blur-activo::before {
        background: rgba(0, 0, 0, 0.78) !important;

        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        filter: none !important;
    }
}


/* =====================================================
   ENLACES HTML REALES
   ===================================================== */

html body .menu-desplegable .mirokutana-menu-link {
    display: block !important;

    width: 100% !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    text-align: inherit !important;

    color: inherit !important;
    -webkit-text-fill-color: inherit !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    text-decoration: none !important;

    cursor: pointer !important;
    pointer-events: auto !important;
}

html body .menu-desplegable .mirokutana-menu-link:visited,
html body .menu-desplegable .mirokutana-menu-link:hover,
html body .menu-desplegable .mirokutana-menu-link:focus,
html body .menu-desplegable .mirokutana-menu-link:active {
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;
    text-decoration: none !important;
}

html body .menu-desplegable .mirokutana-menu-link:focus-visible {
    outline: 1px solid rgba(255, 255, 255, 0.85) !important;
    outline-offset: 6px !important;
}


/* =====================================================
   ACCESIBILIDAD
   ===================================================== */

@media (prefers-reduced-motion: reduce) {
    html body::before,
    html body .menu-desplegable,
    html body .menu-desplegable .filmografia-texto,
    html body .menu-desplegable .quienes-somos-texto,
    html body .menu-desplegable .contacto-texto,
    html body .menu-desplegable .texto,
    html body .menu-desplegable .boton-idioma-eu,
    html body .menu-desplegable .boton-idioma-en,
    html body .menu-desplegable .boton-idioma-es,
    html body .contenedor-superior-header .boton-menu *,
    html body .contenedor-superior-header .boton-menu::before,
    html body .contenedor-superior-header .boton-menu::after {
        transition-duration: 0.01ms !important;
        transition-delay: 0ms !important;
    }
}/* End custom CSS */