.blur-circle { filter: blur(120px); pointer-events: none; }
.reveal { opacity: 0; transform: translateY(30px); transition: 0.8s ease-out; }
.reveal-right { opacity: 0; transform: translateX(50px); transition: 0.8s ease-out; }
.reveal.active, .reveal-right.active { opacity: 1; transform: translate(0); }

.nav-scrolled { background: rgba(15, 23, 42, 0.98); backdrop-filter: blur(8px); border-bottom: 1px solid #1e293b; }

/* VS Section */
.vs-data-card {
    background: #050b18;
    padding: 1.5rem;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.05);
    width: 100%;
}
.vs-img-box { 
    width: 100%; 
    aspect-ratio: 16 / 9;
    border-radius: 12px; 
    overflow: hidden; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

/* Data Driven */
.data-block { transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); border: 1px solid rgba(255,255,255,0.05); border-radius: 16px; }
.data-block:hover { transform: scale(1.08); border-color: rgba(14, 165, 233, 0.5); }

/* LIDERES - ANIMACIÓN CARRUSEL (MARQUEE) */
.marquee-container {
    overflow: hidden;
    position: relative;
    display: flex;
    /* Difuminado a los costados para que aparezcan suavemente */
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}

.marquee-content {
    display: flex;
    gap: 1.5rem;
    /* Velocidad de la animación, 30s da un ritmo cómodo para leer */
    animation: scroll 35s linear infinite;
    width: max-content;
}

.marquee-content:hover {
    animation-play-state: paused;
}

@keyframes scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-33.33% - 0.5rem)); }
}

.team-card { 
    width: 250px; /* Ancho fijo para el scroll continuo */
    display: flex;
    flex-direction: column;
    background: rgba(30, 41, 59, 0.4);
    padding: 1rem;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.03);
    transition: all 0.3s ease;
    height: 100%; 
}
.team-card:hover { border-color: #0ea5e9; transform: translateY(-5px); }

/* Foto 4:5 Fija */
.team-photo-box { 
    width: 100%; height: 250px; flex-shrink: 0;
    margin-bottom: 1rem; border-radius: 10px; overflow: hidden;
    background: #0f172a; position: relative; 
}
.leader-img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ALTURAS FIJAS PARA TEXTOS */
.leader-name-box { height: 24px; display: flex; align-items: flex-end; justify-content: center; margin-bottom: 4px; flex-shrink: 0; }
.leader-ig-box { height: 20px; display: flex; align-items: center; justify-content: center; margin-bottom: 8px; flex-shrink: 0; }
.leader-role-box { height: 36px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid rgba(255,255,255,0.1); margin-bottom: 12px; flex-shrink: 0; text-align: center; }
.leader-desc-box { height: 140px; overflow: hidden; display: flex; align-items: flex-start; justify-content: center; flex-shrink: 0; }

.soluciones-tag { font-size: 1.5rem; }
@keyframes bounce-slow { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
.animate-bounce-slow { animation: bounce-slow 3s infinite ease-in-out; }

/* --------------------------------------------------- */
/* NUEVO: EFECTO LUPA Y ANIMACIÓN LATIDO PARA TARJETAS */
/* --------------------------------------------------- */

.soluciones-card {
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* Efecto Lupa al pasar el mouse por la tarjeta entera */
.soluciones-card:hover {
    transform: scale(1.05); /* Agranda la tarjeta un 5% */
    border-color: rgba(14, 165, 233, 0.5); /* Usa tu mismo color de resalte */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

/* Ícono con latido CONSTANTE */
.soluciones-icon {
    display: inline-block;
    transition: transform 0.3s ease;
    /* La animación ahora se aplica siempre */
    animation: icon-pulse 1.5s infinite ease-in-out; 
}

/* Animación de latido (crece y se achica constantemente) */
@keyframes icon-pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2); /* Crece un 20% */
    }
    100% {
        transform: scale(1);
    }
}