/* Aparición al hacer scroll (sin JS todo se ve; main.js añade .js-reveal en html) */
.js-reveal .reveal { opacity: 0; transform: translateY(26px); transition: opacity 0.8s ease, transform 0.8s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--d, 0s); }
.js-reveal .reveal.is-visible { opacity: 1; transform: none; }
.js-reveal .reveal-left { transform: translateX(-34px); }
.js-reveal .reveal-right { transform: translateX(34px); }
.js-reveal .reveal-left.is-visible, .js-reveal .reveal-right.is-visible { transform: none; }

@media (max-width: 900px) { .js-reveal .reveal-left, .js-reveal .reveal-right { transform: translateY(26px); } }

/* Texto del hero al cambiar de diapositiva */
.slide .slide-copy > * { opacity: 0; transform: translateY(22px); }
.slide.is-active .slide-copy > * { animation: slideUp 0.8s cubic-bezier(.2, .7, .2, 1) forwards; }
.slide.is-active .slide-copy > *:nth-child(2) { animation-delay: 0.12s; }
.slide.is-active .slide-copy > *:nth-child(3) { animation-delay: 0.24s; }
.slide.is-active .slide-copy > *:nth-child(4) { animation-delay: 0.36s; }
.slide.is-active .slide-copy > *:nth-child(5) { animation-delay: 0.46s; }
@keyframes slideUp { to { opacity: 1; transform: none; } }
.slide.is-active .slide-media img { animation: slowZoom 9s ease-out forwards; }
@keyframes slowZoom { from { transform: scale(1.08); } to { transform: scale(1); } }

/* Barra de progreso de lectura */
.scroll-progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; background: linear-gradient(90deg, var(--blue-500), var(--red)); z-index: 200; }

/* Latido suave del botón de WhatsApp */
.wa-float::after { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #25d366; animation: waPulse 2.8s ease-out infinite; pointer-events: none; }
@keyframes waPulse { 0% { transform: scale(1); opacity: 0.7; } 100% { transform: scale(1.55); opacity: 0; } }

/* Destello en el botón principal */
.btn-primary { position: relative; overflow: hidden; }
.btn-primary::after { content: ''; position: absolute; top: 0; left: -80%; width: 50%; height: 100%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.35), transparent); transform: skewX(-20deg); transition: left 0.7s ease; pointer-events: none; }
.btn-primary:hover::after { left: 130%; }

@media (prefers-reduced-motion: reduce) {
  .js-reveal .reveal { opacity: 1; transform: none; }
  .slide .slide-copy > * { opacity: 1; transform: none; }
}