.elementor-kit-8{--e-global-color-primary:#FFFFFF;--e-global-color-secondary:#000000;--e-global-color-text:#000000;--e-global-color-accent:#255FF1;--e-global-typography-primary-font-family:"Mulish";--e-global-typography-primary-font-size:24px;--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Mukta Vaani";--e-global-typography-secondary-font-size:16px;--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Mulish";--e-global-typography-text-font-size:14px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Mulish";--e-global-typography-accent-font-size:14px;--e-global-typography-accent-font-weight:700;}.elementor-kit-8 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);}@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 *//* 1. Contenedor principal de Elementor (con la clase hero-content-wrapper) */
.elementor-kit-8 {
    /* Es esencial que el contenedor principal sea relativo 
    para posicionar el canvas de forma absoluta dentro de él. */
    position: relative;
    /* Necesitas que el contenido (hijos) se apilen correctamente */
    z-index: 2; 
}

/* 2. Contenedor del Canvas (dentro del widget HTML) */
.home-hero_canvas-wrapper {
    /* Posición absoluta para colocarlo detrás del contenido Elementor */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;

    /* Ponemos un z-index bajo para que el contenido de Elementor (títulos, botones) 
    quede por encima del canvas. */
    z-index: 1; 
    overflow: hidden; /* Evita barras de scroll inesperadas */
}

/* 3. Ajustar el widget HTML para que no interfiera */
.elementor-widget-html {
    /* Si tienes el widget HTML directamente dentro del contenedor principal,
    asegúrate de que también sea absoluto y cubra el área. */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1; 
    padding: 0 !important;
    margin: 0 !important;
    
}

/* 4. El canvas en sí */
.home-hero_canvas {
    width: 100%;
    height: 100%;
    display: block;
}/* End custom CSS */