.elementor-kit-10{--e-global-color-primary:#575761;--e-global-color-secondary:#8ACB88;--e-global-color-text:#575761;--e-global-color-accent:#FFBF46;--e-global-color-804dddd:#E4FDE1;--e-global-color-86e01fe:#648381;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-weight:600;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.7px;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-weight:600;}.elementor-kit-10 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ==========================================================
   INSOLAC COMUNIDADES — CSS GLOBAL DEFINITIVO

   1. Cabecera fija
   2. Puente del Dragón — solo página ID 312
   3. Responsive global
   4. Formularios responsive
   5. Header móvil compacto
   6. Móviles pequeños
   ========================================================== */


/* ==========================================================
   1. CABECERA FIJA EN TODA LA WEB
   ========================================================== */

.elementor-location-header{
    position:sticky !important;
    top:0 !important;

    width:100% !important;

    z-index:99999 !important;

    background:#ffffff !important;
}


/* Sticky de Elementor */

.elementor-location-header .elementor-sticky,
.elementor-location-header .elementor-sticky--active{
    top:0 !important;

    z-index:99999 !important;

    background:#ffffff !important;
}


/* Barra de administración de WordPress */

body.admin-bar .elementor-location-header{
    top:32px !important;
}


@media (max-width:782px){

    body.admin-bar .elementor-location-header{
        top:46px !important;
    }

}



/* ==========================================================
   2. PUENTE DEL DRAGÓN
   SOLO PÁGINA COMUNIDADES ALCALÁ — ID 312
   ========================================================== */

body.page-id-312::before{

    content:"";

    position:fixed;

    z-index:0;

    width:92vw;
    height:78vh;

    left:8vw;
    bottom:-4vh;

    background-image:url("https://insolacrenovables.com/wp-content/uploads/2026/08/Ilustracion-puente-del-Dragon-Vectorizado-CMYK.png");

    background-repeat:no-repeat;
    background-position:center bottom;
    background-size:contain;

    opacity:.14;

    pointer-events:none;
}


/* Contenido por encima del dragón */

body.page-id-312 .elementor-location-single,
body.page-id-312 main{

    position:relative;

    z-index:1;
}


/* Header por encima del dragón */

body.page-id-312 .elementor-location-header{

    z-index:99999 !important;

    background:#ffffff !important;
}



/* ==========================================================
   PUENTE DEL DRAGÓN — TABLET
   ========================================================== */

@media (max-width:1024px){

    body.page-id-312::before{

        width:105vw;
        height:70vh;

        left:-3vw;
        bottom:-2vh;

        background-position:center bottom;
        background-size:contain;

        opacity:.12;
    }

}



/* ==========================================================
   PUENTE DEL DRAGÓN — MÓVIL
   ========================================================== */

@media (max-width:767px){

    body.page-id-312::before{

        width:125vw;
        height:60vh;

        left:-12vw;
        bottom:1vh;

        background-position:center bottom;
        background-size:contain;

        opacity:.10;
    }

}



/* ==========================================================
   3. RESPONSIVE GLOBAL — MÓVIL
   ========================================================== */

@media (max-width:767px){


    /* Evitar scroll horizontal */

    html,
    body{

        width:100%;

        max-width:100%;

        overflow-x:hidden;
    }



    /* ======================================================
       CONTENEDORES ELEMENTOR
       ====================================================== */

    body .elementor-section,
    body .elementor-container,
    body .e-con,
    body .e-con-inner{

        max-width:100%;

        min-width:0;
    }


    body .elementor-widget,
    body .elementor-widget-container{

        max-width:100%;

        min-width:0;
    }



    /* ======================================================
       4. FORMULARIOS
       ====================================================== */

    body .elementor-widget-form,
    body .elementor-widget-form .elementor-widget-container,
    body .elementor-widget-form form{

        width:100% !important;

        max-width:100% !important;

        min-width:0 !important;
    }



    /* Campos en una sola columna */

    body .elementor-widget-form .elementor-form-fields-wrapper{

        display:grid !important;

        grid-template-columns:minmax(0,1fr) !important;

        width:100% !important;

        max-width:100% !important;

        min-width:0 !important;

        gap:12px !important;
    }



    /* Cada campo */

    body .elementor-widget-form .elementor-field-group{

        width:100% !important;

        max-width:100% !important;

        min-width:0 !important;

        grid-column:1 / -1 !important;

        padding-left:0 !important;

        padding-right:0 !important;
    }



    /* Inputs */

    body .elementor-widget-form input:not([type="checkbox"]),
    body .elementor-widget-form select,
    body .elementor-widget-form textarea{

        width:100% !important;

        max-width:100% !important;

        min-width:0 !important;

        box-sizing:border-box !important;
    }



    /* ======================================================
       BOTONES DE FORMULARIO
       ====================================================== */

    body .elementor-widget-form .e-form__buttons{

        width:100% !important;

        max-width:100% !important;

        grid-column:1 / -1 !important;
    }


    body .elementor-widget-form .elementor-button{

        width:100% !important;

        max-width:100% !important;

        min-width:0 !important;
    }



    /* ======================================================
       CHECKBOX
       ====================================================== */

    body .elementor-widget-form .elementor-field-type-acceptance{

        width:100% !important;

        max-width:100% !important;

        display:flex !important;

        align-items:flex-start !important;

        grid-column:1 / -1 !important;
    }


    body .elementor-widget-form
    .elementor-field-type-acceptance label{

        width:auto !important;

        max-width:calc(100% - 30px) !important;

        white-space:normal !important;

        font-size:12px !important;

        line-height:1.4 !important;
    }



    /* ======================================================
       TÍTULOS GENERADOS CON ::BEFORE
       ====================================================== */

    body .elementor-widget-form::before,
    body .elementor-widget-form
    .elementor-widget-container::before{

        display:block !important;

        width:100% !important;

        max-width:100% !important;

        min-width:0 !important;

        font-size:25px !important;

        line-height:1.08 !important;

        letter-spacing:-.03em !important;

        white-space:normal !important;

        overflow-wrap:break-word !important;

        margin-left:0 !important;

        margin-right:0 !important;
    }



    /* ======================================================
       TEXTOS GENERADOS CON ::AFTER
       ====================================================== */

    body .elementor-widget-form::after,
    body .elementor-widget-form
    .elementor-widget-container::after{

        display:block !important;

        width:100% !important;

        max-width:100% !important;

        min-width:0 !important;

        font-size:12px !important;

        line-height:1.45 !important;

        white-space:normal !important;

        overflow-wrap:break-word !important;

        margin-left:0 !important;

        margin-right:0 !important;
    }

}



/* ==========================================================
   5. HEADER MÓVIL COMPACTO

   IMPORTANTE:

   Contenedor del logo:
   clase CSS = header-logo

   Contenedor del menú:
   clase CSS = header-menu
   ========================================================== */

@media (max-width:767px){


    /* ======================================================
       HEADER GENERAL
       ====================================================== */

    .elementor-location-header{

        width:100% !important;

        max-width:100% !important;

        height:auto !important;

        min-height:0 !important;

        background:#ffffff !important;

        overflow:visible !important;
    }



    /* ======================================================
       CONTENEDOR PRINCIPAL
       LOGO + HAMBURGUESA
       ====================================================== */

    .elementor-location-header
    .e-con:has(> .header-logo){

        display:flex !important;

        flex-direction:row !important;

        flex-wrap:nowrap !important;

        align-items:center !important;

        justify-content:space-between !important;


        width:100% !important;

        max-width:100% !important;


        /* ALTURA DEL HEADER */
        height:76px !important;

        min-height:76px !important;


        padding:8px 24px !important;

        margin:0 !important;


        gap:15px !important;


        overflow:visible !important;
    }



    /* ======================================================
       CONTENEDOR LOGO
       ====================================================== */

    .elementor-location-header
    .header-logo{

        display:flex !important;

        flex:1 1 auto !important;

        align-items:center !important;

        justify-content:flex-start !important;


        width:auto !important;

        max-width:none !important;

        min-width:0 !important;


        height:auto !important;

        min-height:0 !important;


        padding:0 !important;

        margin:0 !important;
    }



    /* Widget del logo */

    .elementor-location-header
    .header-logo
    .elementor-widget-site-logo,

    .elementor-location-header
    .header-logo
    .elementor-widget-image{

        width:auto !important;

        max-width:none !important;

        margin:0 !important;

        padding:0 !important;
    }



    /* Imagen del logo */

    .elementor-location-header
    .header-logo img{

        display:block !important;

        width:auto !important;

        height:auto !important;


        max-width:170px !important;

        max-height:52px !important;


        margin:0 !important;

        padding:0 !important;
    }



    /* ======================================================
       CONTENEDOR DEL MENÚ
       ====================================================== */

    .elementor-location-header
    .header-menu{

        display:flex !important;

        flex:0 0 48px !important;

        flex-direction:row !important;


        align-items:center !important;

        justify-content:center !important;


        width:48px !important;

        min-width:48px !important;

        max-width:48px !important;


        height:48px !important;

        min-height:48px !important;


        padding:0 !important;

        margin:0 !important;


        gap:0 !important;


        overflow:visible !important;


        position:relative !important;


        z-index:100000 !important;
    }



    /* ======================================================
       WIDGET MENÚ WORDPRESS
       ====================================================== */

    .elementor-location-header
    .header-menu
    .elementor-widget-nav-menu{

        display:block !important;


        width:48px !important;

        min-width:48px !important;

        max-width:48px !important;


        flex:0 0 48px !important;


        margin:0 !important;

        padding:0 !important;


        position:relative !important;


        visibility:visible !important;

        opacity:1 !important;


        z-index:100001 !important;
    }



    /* ======================================================
       HAMBURGUESA
       ====================================================== */

    .elementor-location-header
    .header-menu
    .elementor-menu-toggle{

        display:flex !important;


        align-items:center !important;

        justify-content:center !important;


        width:48px !important;

        height:48px !important;


        min-width:48px !important;


        padding:0 !important;

        margin:0 !important;


        position:relative !important;

        inset:auto !important;


        visibility:visible !important;

        opacity:1 !important;


        z-index:100002 !important;
    }



    /* ======================================================
       BOTÓN CONTACTANOS DE ELEMENTOR

       Se oculta en móvil porque lo vamos a incluir
       como opción dentro del menú hamburguesa.
       En escritorio seguirá apareciendo normalmente.
       ====================================================== */

    .elementor-location-header
    .header-menu
    > .elementor-widget-button{

        display:none !important;
    }

}



/* ==========================================================
   6. MÓVILES PEQUEÑOS
   ========================================================== */

@media (max-width:480px){


    /* Títulos de formularios */

    body .elementor-widget-form::before,
    body .elementor-widget-form
    .elementor-widget-container::before{

        font-size:23px !important;
    }



    /* Logo ligeramente más pequeño */

    .elementor-location-header
    .header-logo img{

        max-width:160px !important;

        max-height:50px !important;
    }

} /* ==========================================================
   INSOLAC COMUNIDADES
   HEADER MÓVIL COMPACTO
   Logo izquierda + hamburguesa derecha
   ========================================================== */

@media (max-width:767px){

    /* =========================================
       HEADER GENERAL
       ========================================= */

    .elementor-location-header,
    .elementor-location-header > .elementor-element,
    .elementor-location-header > .e-con,
    .elementor-location-header .elementor-element.e-con{

        min-height:0 !important;
        height:auto !important;
    }


    /* =========================================
       CONTENEDORES SUPERIORES
       Eliminamos espacios heredados
       ========================================= */

    .elementor-location-header > .e-con,
    .elementor-location-header > .elementor-element > .e-con{

        padding-top:0 !important;
        padding-bottom:0 !important;

        margin-top:0 !important;
        margin-bottom:0 !important;

        min-height:0 !important;
    }


    /* =========================================
       CONTENEDOR DEL LOGO
       ========================================= */

    .elementor-location-header .header-logo{

        height:58px !important;
        min-height:58px !important;

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

        display:flex !important;

        align-items:center !important;
        justify-content:flex-start !important;
    }


    /* =========================================
       CONTENEDOR DEL MENÚ
       ========================================= */

    .elementor-location-header .header-menu{

        height:58px !important;
        min-height:58px !important;

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

        display:flex !important;

        align-items:center !important;
        justify-content:flex-end !important;
    }


    /* =========================================
       FILA LOGO + HAMBURGUESA
       ========================================= */

    .elementor-location-header
    .e-con:has(.header-logo):has(.header-menu){

        display:flex !important;

        flex-direction:row !important;
        flex-wrap:nowrap !important;

        align-items:center !important;
        justify-content:space-between !important;

        width:100% !important;

        height:58px !important;
        min-height:58px !important;

        padding:0 20px !important;
        margin:0 !important;

        gap:15px !important;
    }


    /* =========================================
       LOGO
       ========================================= */

    .elementor-location-header .header-logo img{

        display:block !important;

        width:auto !important;
        height:auto !important;

        max-width:145px !important;
        max-height:40px !important;

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


    /* Evitamos que el widget del logo genere altura */
    .elementor-location-header .header-logo .elementor-widget-container,
    .elementor-location-header .header-logo .elementor-widget-image,
    .elementor-location-header .header-logo a{

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

        line-height:0 !important;
    }


    /* =========================================
       HAMBURGUESA
       ========================================= */

    .elementor-location-header
    .header-menu
    .elementor-menu-toggle{

        width:38px !important;
        height:38px !important;

        min-width:38px !important;
        min-height:38px !important;

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

        display:flex !important;

        align-items:center !important;
        justify-content:center !important;
    }


    /* =========================================
       ELIMINAMOS ESPACIOS INTERNOS
       ========================================= */

    .elementor-location-header .e-con-inner{

        min-height:0 !important;

        padding-top:0 !important;
        padding-bottom:0 !important;

        margin-top:0 !important;
        margin-bottom:0 !important;
    }


    /* =========================================
       BOTÓN CONTACTANOS
       No aparece fuera del menú en móvil
       ========================================= */

    .elementor-location-header
    .header-menu
    .elementor-widget-button{

        display:none !important;
    }

} /* ==========================================================
   CONTÁCTANOS DENTRO DEL MENÚ MÓVIL
   ========================================================== */


/* ----------------------------------------------------------
   ESCRITORIO Y TABLET
   Ocultamos "Contáctanos" del menú normal.
   El botón amarillo independiente sigue funcionando.
   ---------------------------------------------------------- */

.elementor-location-header
.elementor-nav-menu a[href^="tel:"]{
    display:none !important;
}


/* ==========================================================
   MÓVIL
   ========================================================== */

@media (max-width:767px){

    /* Recuperamos Contáctanos dentro del desplegable */
    .elementor-location-header
    .elementor-nav-menu a[href^="tel:"]{

        display:flex !important;

        align-items:center !important;
        justify-content:center !important;

        width:calc(100% - 30px) !important;

        margin:16px 15px 10px !important;
        padding:13px 20px !important;

        background:#FFBF46 !important;

        color:#575761 !important;

        border:1px solid #648381 !important;
        border-radius:999px !important;

        font-size:15px !important;
        font-weight:800 !important;

        line-height:1.2 !important;
        text-align:center !important;

        text-decoration:none !important;
    }


    /* Icono teléfono delante del texto */
    .elementor-location-header
    .elementor-nav-menu a[href^="tel:"]::before{

        content:"☎";

        display:inline-block;

        margin-right:8px;

        font-size:16px;
    }


    /* Hover / pulsación */
    .elementor-location-header
    .elementor-nav-menu a[href^="tel:"]:hover{

        background:#8ACB88 !important;
        color:#575761 !important;
    }

}/* End custom CSS */