.elementor-67 .elementor-element.elementor-element-fe74066{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-67 .elementor-element.elementor-element-c55507d{--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;--justify-content:center;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-67 .elementor-element.elementor-element-95f9f95{--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;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-67 .elementor-element.elementor-element-b674f18 .elementor-menu-toggle{margin:0 auto;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-67 .elementor-element.elementor-element-c55507d{--width:20%;}.elementor-67 .elementor-element.elementor-element-95f9f95{--width:80%;}}/* Start custom CSS for container, class: .elementor-element-fe74066 *//* Instrucciones:
   1. En Elementor, selecciona la SECCIÓN o CONTENEDOR que contiene tu logo, menú y botón.
   2. En la pestaña Avanzado > ID de CSS, pon: premium-nav-wrapper
   3. Pega este código en la pestaña Avanzado > CSS personalizado.
*/

/* Corrección para que el contenido no se oculte detrás de la barra fija */
body {
    padding-top: 100px !important;
}

/* Estilo del Contenedor Principal (Efecto Cristal Flotante) */
#premium-nav-wrapper {
    position: fixed !important;
    top: 20px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 90% !important;
    max-width: 1200px !important;
    z-index: 9999 !important;
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border-radius: 20px !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
    padding: 10px 25px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

/* Estilo para los ítems del Menú de Elementor (clase .nav-menu) */
#premium-nav-wrapper .nav-menu .elementor-item {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.95rem !important;
    color: #1a1a1a !important;
    position: relative !important;
    padding: 10px 15px !important;
    transition: all 0.3s ease !important;
}

/* Animación de subrayado con degradado PARC al pasar el mouse */
#premium-nav-wrapper .nav-menu .elementor-item::after {
    content: '' !important;
    position: absolute !important;
    bottom: 5px !important;
    left: 15px !important;
    right: 15px !important;
    height: 2px !important;
    background: linear-gradient(90deg, #00aeef, #ec008c, #f7941d) !important;
    transform: scaleX(0) !important;
    transition: transform 0.3s ease !important;
    transform-origin: center !important;
}

#premium-nav-wrapper .nav-menu .elementor-item:hover::after,
#premium-nav-wrapper .nav-menu .elementor-item.elementor-item-active::after {
    transform: scaleX(1) !important;
}

#premium-nav-wrapper .nav-menu .elementor-item:hover {
    color: #ec008c !important; /* Color Magenta al hover */
    background: transparent !important;
}

/* Ajuste para el Logo (si usas el widget de Imagen de Elementor) */
#premium-nav-wrapper .elementor-widget-image {
    margin-bottom: 0 !important;
}

/* Ajuste para el Botón de Acción (si usas el widget de Botón de Elementor) */
#premium-nav-wrapper .elementor-widget-button .elementor-button {
    background: linear-gradient(135deg, #b22222 0%, #8b1a1a 100%) !important;
    border-radius: 12px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    box-shadow: 0 4px 15px rgba(178, 34, 34, 0.2) !important;
    transition: all 0.3s ease !important;
}

#premium-nav-wrapper .elementor-widget-button .elementor-button:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(178, 34, 34, 0.4) !important;
}

/* Responsividad: Ajustes para tablets y móviles */
@media (max-width: 1024px) {
    #premium-nav-wrapper {
        width: 95% !important;
        padding: 10px 15px !important;
    }
}

/* Ocultar subrayado en el menú móvil para que no se vea extraño */
@media (max-width: 767px) {
    #premium-nav-wrapper .nav-menu .elementor-item::after {
        display: none !important;
    }
    body {
        padding-top: 80px !important; /* Espacio reducido en móvil */
    }
}/* End custom CSS */