.elementor-5739 .elementor-element.elementor-element-eac234b{--display:flex;--min-height:100vh;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5739 .elementor-element.elementor-element-c5acd21 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-5739 .elementor-element.elementor-element-c5acd21.elementor-element{--flex-grow:1;--flex-shrink:1;}.elementor-5739 .elementor-element.elementor-element-e13d200{--display:flex;--min-height:100vh;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5739 .elementor-element.elementor-element-73a0a86 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}/* Start custom CSS for shortcode, class: .elementor-element-c5acd21 */.wa__btn_popup_txt {
    display: none!important
    ;
}
/* 1. Ampliar el contenedor translúcido de fondo */
#n2-ss-10 .n2-ss-control-bullet-horizontal {
    width: auto !important;
    min-width: 140px !important; /* Espacio suficiente para las 3 rayas expandidas */
    display: inline-flex !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

/* 2. Transformar los puntos en rayas */
#n2-ss-10 .nextend-bullet {
    width: 32px !important;
    height: 3px !important;
    background: rgba(15, 15, 15, .18) !important;
    border: none !important;
    padding: 0 !important;
    cursor: pointer !important;
    border-radius: 2px !important;
    margin: 0 6px !important; /* Separación horizontal entre cada raya */
    transition: background .3s ease !important;
    box-shadow: none !important; /* Quita sombras previas si las hay */
}

/* 3. Estilo para la raya activa */
#n2-ss-10 .nextend-bullet.n2-active {
    background: rgba(15, 15, 15, 0.8) !important;
}

.elementor-kit-6 .hfe-scroll-to-top-wrap .hfe-scroll-to-top-button {
    display: none;
}

@media screen and (max-width: 768px) {
#ast-scroll-top 
    {
    display:none!important;
    }
}

@media screen and (min-width: 769px) {
    
    

  /* FLECHA BACK TO TOP */ 
  /* Estado normal: Círculo con sombra, alineación y tamaño */ 
  .ast-scroll-top-icon.ast-scroll-to-top-right { 
    border-radius: 50% !important; 
    background-color: rgba(255, 255, 255, 0.9) !important; 
    opacity: 1 !important; 
    transform: translateY(-80px) translateX(-17px) scale(1.15) !important; 
    transition: all 0.3s ease; 
    position: relative; 
  } 

  /* Ocultar el contenido SVG y limpiar elementos previos */ 
  .ast-scroll-top-icon.ast-scroll-to-top-right svg, 
  .ast-scroll-top-icon.ast-scroll-to-top-right::before { 
    display: none !important; 
  } 

  /* Dibujar la flecha unificada con línea vertical ultra fina */ 
  .ast-scroll-top-icon.ast-scroll-to-top-right::after { 
    content: "" !important; 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%) !important; 
    width: 8px; 
    height: 16px; 
    background-color: #1A8FCA !important; 
    transition: background-color 0.3s ease; 
    display: block !important; 
    clip-path: polygon( 50% 0%, 100% 30%, 58% 30%, 58% 100%, 42% 100%, 42% 30%, 0% 30% ) !important; 
  } 

  /* Estado Hover: La flecha ultra fina cambia a negro */ 
  .ast-scroll-top-icon.ast-scroll-to-top-right:hover::after { 
    background-color: #000000 !important; 
  }

}


div#wa .wa_btn_popup .wa_btn_popup_icon::before {
    background-blend-mode: unset !important;
    filter: brightness(0) saturate(100%) invert(63%) sepia(82%) saturate(497%) hue-rotate(93deg) brightness(97%) contrast(92%) !important;
    -webkit-filter: brightness(0) saturate(100%) invert(63%) sepia(82%) saturate(497%) hue-rotate(93deg) brightness(97%) contrast(92%) !important;
}


/* INDICADORES DE PAGINAS DEL SLIDER */

/* Cambiar los puntos por líneas horizontales */

div#n2-ss-10 .n2-style-4e2a289a1e38a572658e079562eabe30-simple {
    background: RGBA(255, 255, 255, 0) !important;
    padding: 10px 20px 40px 20px !important;
    box-shadow: none !important;
    border: 0px solid RGBA(0, 0, 0, 1) !important;
    border-radius: 50px !important;
    margin: 10px 3px !important;
}

div#n2-ss-10 .n2-style-314b986e494a5720bd8f1c8d899666f0-dot.n2-active, div#n2-ss-5 .n2-style-314b986e494a5720bd8f1c8d899666f0-dot:HOVER, div#n2-ss-5 .n2-style-314b986e494a5720bd8f1c8d899666f0-dot:FOCUS {
    width: 30px;
    height: 2px;
    background: rgba(15, 15, 15, .18);
    border: none;
    padding: 0;
    cursor: pointer;
    border-radius: 2px;
    transition: background .3s;
}

div#n2-ss-10 .nextend-bullet-bar .n2-bullet {
    width: 30px;
    height: 2px;
    background: rgba(15, 15, 15, .18);
    border: none;
    padding: 0;
    cursor: pointer;
    border-radius: 2px;
    transition: background .3s;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-73a0a86 *//* 1. Ampliar el contenedor translúcido de fondo */
#n2-ss-12 .n2-ss-control-bullet-horizontal {
    width: auto !important;
    min-width: 140px !important; /* Espacio suficiente para las 3 rayas expandidas */
    display: inline-flex !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

/* 2. Transformar los puntos en rayas */
#n2-ss-12 .nextend-bullet {
    width: 32px !important;
    height: 3px !important;
    background: rgba(15, 15, 15, .18) !important;
    border: none !important;
    padding: 0 !important;
    cursor: pointer !important;
    border-radius: 2px !important;
    margin: 0 6px !important; /* Separación horizontal entre cada raya */
    transition: background .3s ease !important;
    box-shadow: none !important; /* Quita sombras previas si las hay */
}

/* 3. Estilo para la raya activa */
#n2-ss-12 .nextend-bullet.n2-active {
    background: rgba(15, 15, 15, 0.8) !important;
}




/* INDICADORES DE PAGINAS DEL SLIDER */

/* Cambiar los puntos por líneas horizontales */

div#n2-ss-12 .n2-style-4e2a289a1e38a572658e079562eabe30-simple {
    background: RGBA(255, 255, 255, 0) !important;
    padding: 10px 20px 40px 20px !important;
    box-shadow: none !important;
    border: 0px solid RGBA(0, 0, 0, 1) !important;
    border-radius: 50px !important;
    margin: 10px 3px !important;
}

div#n2-ss-12 .n2-style-314b986e494a5720bd8f1c8d899666f0-dot.n2-active, div#n2-ss-12 .n2-style-314b986e494a5720bd8f1c8d899666f0-dot:HOVER, div#n2-ss-12 .n2-style-314b986e494a5720bd8f1c8d899666f0-dot:FOCUS {
    width: 30px;
    height: 2px;
    background: rgba(15, 15, 15, .18);
    border: none;
    padding: 0;
    cursor: pointer;
    border-radius: 2px;
    transition: background .3s;
}

div#n2-ss-12 .nextend-bullet-bar .n2-bullet {
    width: 30px;
    height: 2px;
    background: rgba(15, 15, 15, .18);
    border: none;
    padding: 0;
    cursor: pointer;
    border-radius: 2px;
    transition: background .3s;
}


@media screen and (max-width: 768px) {
#ast-scroll-top 
    {
    display:none!important;
    }
}

@media screen and (min-width: 769px) {
    
    

  /* FLECHA BACK TO TOP */ 
  /* Estado normal: Círculo con sombra, alineación y tamaño */ 
  .ast-scroll-top-icon.ast-scroll-to-top-right { 
    border-radius: 50% !important; 
    background-color: rgba(255, 255, 255, 0.9) !important; 
    opacity: 1 !important; 
    transform: translateY(-80px) translateX(-17px) scale(1.15) !important; 
    transition: all 0.3s ease; 
    position: relative; 
  } 

  /* Ocultar el contenido SVG y limpiar elementos previos */ 
  .ast-scroll-top-icon.ast-scroll-to-top-right svg, 
  .ast-scroll-top-icon.ast-scroll-to-top-right::before { 
    display: none !important; 
  } 

  /* Dibujar la flecha unificada con línea vertical ultra fina */ 
  .ast-scroll-top-icon.ast-scroll-to-top-right::after { 
    content: "" !important; 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%) !important; 
    width: 8px; 
    height: 16px; 
    background-color: #1A8FCA !important; 
    transition: background-color 0.3s ease; 
    display: block !important; 
    clip-path: polygon( 50% 0%, 100% 30%, 58% 30%, 58% 100%, 42% 100%, 42% 30%, 0% 30% ) !important; 
  } 

  /* Estado Hover: La flecha ultra fina cambia a negro */ 
  .ast-scroll-top-icon.ast-scroll-to-top-right:hover::after { 
    background-color: #000000 !important; 
  }

}/* End custom CSS */