@media (max-width:999px){body.fdg-menu-open #mobile-menu,#mobile-menu.fdg-mobile-open{display:block!important;opacity:1!important;visibility:visible!important}}
.menu-item-has-children.fdg-submenu-open>.sub-menu{display:block!important;opacity:1!important;visibility:visible!important}


/* FDG: ESPECIALS DROPDOWN START */
@media only screen and (min-width: 1000px) {

    /* SOLO el desplegable "Especials" */
    #header-outer #top nav > ul > #menu-item-4719 > .sub-menu {
        width: 360px !important;
        min-width: 360px !important;
    }

    /* Evitar que "La cuina creativa de Gràcia (2018)" se parta */
    #header-outer #top nav > ul > #menu-item-4719 > .sub-menu > li > a {
        white-space: nowrap !important;
    }
}
/* FDG: ESPECIALS DROPDOWN END */




/* FDG: FLOORA TITULOS START */

@font-face {
    font-family: 'Floora';
    src: url('/media/fonts/floora.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/*
 * FLOORA + UPPERCASE EN TODA LA WEB
 * EXCEPTO:
 *
 * 4106 = Especial Programes de festes
 * 4769 = Especial Esquitxos de festa
 * 4508 = Especial La cuina creativa de Gràcia
 *
 * Los Especiales conservan íntegramente su tipografía editorial original.
 */

body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) h1,
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) h2,
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) h3,
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) h4,
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) h5,
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) h6,

body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) .elementor-heading-title,
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) .elementor-page-title,
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) .entry-title,
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) .wp-block-heading,

body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) .elementor-gallery-item__title,
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) .elementor-gallery-title,

body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) .post-navigation__prev--title,
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) .post-navigation__next--title,

body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) [class*="heading-title"],
body:not(.page-id-4106):not(.page-id-4769):not(.page-id-4508) [class*="page-title"] {
    font-family: 'Floora', sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
    text-transform: uppercase !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* FDG: FLOORA TITULOS END */




/* FDG: MOBILE REAL LOGO START */

@media only screen and (max-width: 999px) {

    /*
     * El logob2026 REAL está en este widget.
     * En Elementor estaba deliberadamente oculto en móvil.
     */
    .elementor-element-212d42c {
        display: block !important;

        /*
         * Ahora pertenece a SU CONTENEDOR,
         * no al viewport. Por tanto se desplaza
         * normalmente al hacer scroll.
         */
        position: absolute !important;

        left: -225px !important;
        top: 50% !important;

        width: 520px !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: translateY(-50%) rotate(-90deg) !important;
        transform-origin: center center !important;

        z-index: 20 !important;

        pointer-events: none !important;
    }

    /*
     * El contenedor REAL donde vive el logo
     * será la referencia de posición.
     */
    .elementor-element-e5f7a81 > .elementor-widget-wrap {
        position: relative !important;
    }

    .elementor-element-212d42c .elementor-widget-container {
        width: 520px !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .elementor-element-212d42c img {
        display: block !important;

        width: 520px !important;
        max-width: none !important;
        height: auto !important;

        margin: 0 !important;
    }
}

/*
 * Escritorio: exactamente como estaba.
 */
@media only screen and (min-width: 1000px) {
    .elementor-element-212d42c {
        position: relative;
    }
}

/* FDG: MOBILE REAL LOGO END */


/* FDG: MOBILE HERO BOTTOM INFO START */

@media only screen and (max-width: 767px) {

    /*
     * El contenedor de la foto superior será la referencia.
     */
    .elementor-5522 .elementor-element.elementor-element-e5f7a81
    > .elementor-widget-wrap {
        position: relative !important;
        min-height: 700px !important;
    }

    /*
     * ESCUDO
     * Más pequeño y abajo.
     */
    .elementor-5522 .elementor-element.elementor-element-efa55a3 {
        position: absolute !important;
        left: 68% !important;
        bottom: 132px !important;
        transform: translateX(-50%) !important;
        width: auto !important;
        margin: 0 !important;
        z-index: 25 !important;
    }

    .elementor-5522 .elementor-element.elementor-element-efa55a3 img {
        width: auto !important;
        max-width: 72px !important;
        height: auto !important;
    }

    /*
     * AJUNTAMENT DE MAÓ
     */
    .elementor-5522 .elementor-element.elementor-element-3e29e56 {
        position: absolute !important;
        left: 68% !important;
        bottom: 100px !important;
        transform: translateX(-50%) !important;
        width: auto !important;
        margin: 0 !important;
        z-index: 25 !important;
    }

    .elementor-5522 .elementor-element.elementor-element-3e29e56 img {
        width: 215px !important;
        max-width: 215px !important;
        height: auto !important;
    }

    /*
     * TEXTO / FECHA
     */
    .elementor-5522 .elementor-element.elementor-element-f37d4fe {
        position: absolute !important;
        left: 68% !important;
        bottom: 78px !important;
        transform: translateX(-50%) !important;

        width: 90% !important;
        margin: 0 !important;

        text-align: center !important;
        z-index: 25 !important;
    }

    .elementor-5522
    .elementor-element.elementor-element-f37d4fe
    .elementor-heading-title {
        font-size: 18px !important;
        line-height: 1.1 !important;
        margin: 0 !important;
    }

}

/* FDG: MOBILE HERO BOTTOM INFO END */




/* FDG: FINAL BANNERS FIT START */

/*
 * SOLO las imágenes inferiores:
 * banner00...
 * punt_lila...
 * no_embrutis_sa_festa...
 *
 * Deben ocupar el ancho de SU CONTENEDOR,
 * igual que el iframe superior, sin desbordar.
 */

img[src*="banner00"],
img[src*="punt_lila"],
img[src*="punt-lila"],
img[src*="no_embrutis_sa_festa"],
img[src*="no-embrutis-sa-festa"] {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;

    margin-left: auto !important;
    margin-right: auto !important;

    object-fit: contain !important;
    box-sizing: border-box !important;
}

/*
 * El propio widget tampoco puede crecer por culpa
 * del tamaño original de la imagen.
 */
.elementor-widget-image:has(img[src*="banner00"]),
.elementor-widget-image:has(img[src*="punt_lila"]),
.elementor-widget-image:has(img[src*="punt-lila"]),
.elementor-widget-image:has(img[src*="no_embrutis_sa_festa"]),
.elementor-widget-image:has(img[src*="no-embrutis-sa-festa"]) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    box-sizing: border-box !important;
}

.elementor-widget-image:has(img[src*="banner00"]) .elementor-widget-container,
.elementor-widget-image:has(img[src*="punt_lila"]) .elementor-widget-container,
.elementor-widget-image:has(img[src*="punt-lila"]) .elementor-widget-container,
.elementor-widget-image:has(img[src*="no_embrutis_sa_festa"]) .elementor-widget-container,
.elementor-widget-image:has(img[src*="no-embrutis-sa-festa"]) .elementor-widget-container {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* FDG: FINAL BANNERS FIT END */




/* FDG: MOBILE ESCUT SOBRE LOGO START */

@media only screen and (max-width: 767px) {

    /*
     * ESCUDO ARRIBA DEL LOGO VERTICAL.
     * NO encima del centro del logo.
     */
    .elementor-5522 .elementor-element.elementor-element-efa55a3 {
        position: absolute !important;

        /* centro horizontal del logo vertical */
        left: 41px !important;

        /*
         * El logo mide 520px y está centrado al 50%.
         * Su extremo superior está aprox. 260px por encima.
         * Ponemos el escudo un poco MÁS ARRIBA.
         */
        top: calc(50% - 265px) !important;
        bottom: auto !important;

        transform: translate(-50%, -100%) !important;

        width: auto !important;
        margin: 0 !important;

        z-index: 35 !important;
    }

    .elementor-5522 .elementor-element.elementor-element-efa55a3 img {
        display: block !important;
        width: auto !important;
        max-width: 72px !important;
        height: auto !important;
        margin: 0 !important;
    }
}

/* FDG: MOBILE ESCUT SOBRE LOGO END */




/* FDG: MOBILE LANG FLAGS CENTER START */

@media only screen and (max-width: 999px) {

    /*
     * SOLO el UL principal del menú móvil.
     * Los elementos normales siguen ocupando toda la línea.
     */
    #mobile-menu .menu-items-wrap > ul {
        display: flex !important;
        flex-wrap: wrap !important;

        text-align: initial !important;

        padding-bottom: 24px !important;
    }

    /*
     * TODAS las opciones normales mantienen su ancho
     * y su alineación original.
     */
    #mobile-menu .menu-items-wrap > ul > li:not(.lang-item) {
        flex: 0 0 100% !important;
        width: 100% !important;

        text-align: initial !important;
    }

    /*
     * ÚNICAMENTE LAS BANDERAS:
     * misma fila.
     */
    #mobile-menu .menu-items-wrap > ul > li.lang-item {
        flex: 0 0 auto !important;
        width: auto !important;

        display: flex !important;

        margin-top: 12px !important;
        margin-bottom: 12px !important;
        padding: 0 !important;
    }

    /*
     * Primera bandera empuja desde la izquierda.
     */
    #mobile-menu .menu-items-wrap > ul > li.lang-item-first {
        margin-left: auto !important;
        margin-right: 8px !important;
    }

    /*
     * Segunda bandera empuja desde la derecha.
     */
    #mobile-menu .menu-items-wrap > ul > li.lang-item-first + li.lang-item {
        margin-left: 8px !important;
        margin-right: auto !important;
    }

    #mobile-menu .menu-items-wrap > ul > li.lang-item > a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: auto !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 6px !important;
    }

    #mobile-menu .menu-items-wrap > ul > li.lang-item img {
        display: block !important;
        margin: 0 !important;
    }
}

/* FDG: MOBILE LANG FLAGS CENTER END */