/* Estilo inicial de las secciones */
.section {
    opacity: 0; /* Inicialmente oculto */
    transform: translateY(30px); /* Desplazado hacia abajo */
    transition: opacity 1s ease, transform 1s ease; /* Efecto suave */
}

/* Cuando la sección entra en la vista */
.section-visible {
    opacity: 1;
    transform: translateY(0); /* Regresa a su posición original */
}

.hidden {
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.8s ease-out;
}

.show {
    opacity: 1;
    transform: translateY(0);
}