.elementor-256 .elementor-element.elementor-element-2c3ecb8{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS *//* 1. CONFIGURACIÓN DEL GLASS HEADER (Para tu Menú de Elementor) */
/* IMPORTANTE: Asigna el ID 'my-header' a la SECCIÓN de tu Header en Elementor */

#my-header {
    background-color: transparent;
    transition: background-color 0.4s ease, backdrop-filter 0.4s ease;
    border-bottom: 1px solid transparent;
}

/* Cuando se hace scroll (se activa via JS) */
#my-header.scrolled {
    background-color: rgba(255, 255, 255, 0.85) !important; /* Fondo blanco semitransparente */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

/* Ajustes para modo oscuro si lo prefieres */
/* #my-header.scrolled {
    background-color: rgba(26, 26, 26, 0.6) !important;
    backdrop-filter: blur(12px);
}
*/


/* 2. ESTILOS DE UTILIDAD PARA EL CONTENIDO HTML */

/* Reinicio de imágenes para evitar conflictos con temas */
img.object-contain { object-fit: contain !important; }
img.object-cover { object-fit: cover !important; }

/* Animaciones de entrada */
.reveal-on-scroll {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.reveal-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Acordeón de Servicios (Adaptado a Móvil) */
.service-content {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.5s ease;
}

/* En Desktop: Hover */
@media (min-width: 768px) {
    .service-item:hover .service-content {
        max-height: 500px;
        opacity: 1;
    }
}

/* En Móvil: Mostrar siempre un poco o ajustar según prefieras */
@media (max-width: 767px) {
    /* Opción A: Siempre expandido en móvil para evitar clicks */
    .service-content {
        max-height: 500px !important;
        opacity: 1 !important;
        margin-top: 1rem;
    }
    /* Ocultar la flecha en móvil */
    .service-item i[data-lucide="arrow-up-right"] {
        display: none;
    }
}

/* Filtro de Logos */
.logo-filter {
    filter: grayscale(100%) opacity(0.6);
    transition: filter 0.4s ease, opacity 0.4s ease;
    display: inline-block;
}
.logo-filter:hover { filter: grayscale(0%) opacity(1); }

/* Enlaces limpios */
a.no-underline { text-decoration: none !important; box-shadow: none !important; }/* End custom CSS */