/* ========================================================================== ANIMACIONES — Keyframes y clases de aparición ========================================================================== */ @keyframes spin { to { transform: rotate(360deg); } } @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } } @keyframes cardIn { from { opacity: 0; transform: translateY(18px) scale(.98); } to { opacity: 1; transform: none; } } @keyframes scrollHint{ 0%, 100% { opacity: .3; transform: scaleY(.5); transform-origin: top; } 50% { opacity: 1; transform: scaleY(1); } } /* Aparición al hacer scroll (activada por js/modules/reveal.js). Solo se oculta si JS está activo: la clase .js se agrega en . */ .js [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease), transform .9s var(--ease); transition-delay: var(--reveal-delay, 0s); } .js [data-reveal].is-visible { opacity: 1; transform: none; } /* Respeto a "reducir movimiento" */ @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; } .js [data-reveal] { opacity: 1; transform: none; } }