/* HERO SECTION */
.hero-section { padding: 80px 0; background-color: var(--background-white); overflow: hidden; }
.hero-content { display: flex; align-items: center; justify-content: space-between; gap: 4rem; }
.hero-text { flex: 1; }
.hero-text h1 { font-size: clamp(2.5rem, 5vw, 3.5rem); font-weight: 800; line-height: 1.3; margin-bottom: 1.5rem; }
.hero-text p { font-size: 1.25rem; color: var(--text-light); margin-bottom: 2.5rem; }
.hero-actions { display: flex; gap: 1rem; }
.hero-image { flex: 1; display: flex; justify-content: center; }
.hero-image img { border-radius: 12px; }

/* --- ANIMACIÓN DE PALABRAS (FUTURO / NEGOCIO) --- */

.word-rotator-wrapper {
    display: inline-block;
    vertical-align: bottom; /* Alineación perfecta con el texto */
    height: 1.2em; /* Altura fija para mostrar solo una palabra */
    overflow: hidden; /* Oculta la palabra que no debe verse */
    position: relative;
    top: 5px; /* Pequeño ajuste visual si se ve muy arriba */
}

.word-rotator {
    display: block;
    /* La animación dura 6 segundos en total e infinita */
    animation: rotateWords 6s cubic-bezier(0.23, 1, 0.32, 1) infinite;
}

.word-item {
    display: block;
    height: 1.2em; /* Debe coincidir con el wrapper */
    color: var(--primary-color); /* Azul Eyiro */
    font-weight: 800;
    /* Evita que la palabra se rompa en dos líneas */
    white-space: nowrap; 
}

/* La Lógica del Movimiento */
@keyframes rotateWords {
    0% { transform: translateY(0); }        /* Muestra FUTURO */
    45% { transform: translateY(0); }       /* Espera... */
    50% { transform: translateY(-50%); }    /* Desliza hacia arriba (Muestra NEGOCIO) */
    95% { transform: translateY(-50%); }    /* Espera... */
    100% { transform: translateY(0); }      /* Vuelve a bajar */
}

/* Efecto de Levitación para la imagen */
.hero-image img {
    animation: floatImage 6s ease-in-out infinite;
}

@keyframes floatImage {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-15px); } /* Sube 15px */
    100% { transform: translateY(0px); }  /* Baja */
}

/* RESPONSIVE HERO */
@media (max-width: 968px) {
    .hero-content { flex-direction: column; text-align: center; }
    .hero-text { margin-bottom: 2rem; }
    .hero-actions { justify-content: center; }
}