.elementor-3902 .elementor-element.elementor-element-d23b9de{--display:flex;--min-height:10vh;--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;}.elementor-3902 .elementor-element.elementor-element-d23b9de:not(.elementor-motion-effects-element-type-background), .elementor-3902 .elementor-element.elementor-element-d23b9de > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-uicore_secondary );}.elementor-3902 .elementor-element.elementor-element-a40544e{--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;--padding-top:100px;--padding-bottom:100px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}@media(min-width:768px){.elementor-3902 .elementor-element.elementor-element-a40544e{--content-width:90%;}}/* Start custom CSS for container, class: .elementor-element-d23b9de *//* 1. Limpiamos cualquier rastro del icono roto */
.menu-item-has-children > a::after {
    content: "" !important;
    position: static !important; /* Resetea el problema de que se vaya arriba */
    display: inline-block !important;
    
    /* Dibujamos la flecha minimalista */
    width: 6px !important;
    height: 6px !important;
    border-right: 1.5px solid currentColor !important;
    border-bottom: 1.5px solid currentColor !important;
    
    /* Separación de la palabra y centrado vertical */
    margin-left: 8px !important;
    vertical-align: middle !important;
    
    /* Posición inicial apuntando abajo */
    transform: rotate(45deg) translateY(-2px) !important;
    
    /* Transición suave para el giro */
    transition: transform 0.3s ease, color 0.3s ease !important;
}

/* 2. Efecto HOVER: Girar la flecha hacia arriba */
.menu-item-has-children:hover > a::after {
    /* Rota hacia arriba de manera limpia */
    transform: rotate(225deg) translateY(-1px) !important;
    
    /* Color lila de tu diseño al pasar el cursor */
    color: #a370f7 !important;
}/* End custom CSS */