/* Keyframes */
@keyframes fadeInUp { from { opacity:0; transform:translateY(40px) } to { opacity:1; transform:translateY(0) } }
@keyframes fadeInDown { from { opacity:0; transform:translateY(-40px) } to { opacity:1; transform:translateY(0) } }
@keyframes fadeInLeft { from { opacity:0; transform:translateX(-40px) } to { opacity:1; transform:translateX(0) } }
@keyframes fadeInRight { from { opacity:0; transform:translateX(40px) } to { opacity:1; transform:translateX(0) } }
@keyframes scaleIn { from { opacity:0; transform:scale(0.8) } to { opacity:1; transform:scale(1) } }
@keyframes float { 0%,100% { transform:translateY(0) } 50% { transform:translateY(-20px) } }
@keyframes pulse { 0%,100% { opacity:1 } 50% { opacity:0.5 } }
@keyframes glow { 0%,100% { box-shadow: 0 0 20px rgba(6,182,212,0.3) } 50% { box-shadow: 0 0 40px rgba(6,182,212,0.6) } }
@keyframes slideInRight { from { transform:translateX(100%); opacity:0 } to { transform:translateX(0); opacity:1 } }
@keyframes slideOutRight { from { transform:translateX(0); opacity:1 } to { transform:translateX(100%); opacity:0 } }
@keyframes scrollPreview { 0% { transform:translateY(0) } 100% { transform:translateY(-50%) } }
@keyframes testimonialScroll { 0% { transform:translateX(0) } 100% { transform:translateX(-50%) } }
@keyframes charReveal { from { opacity:0; transform:translateY(20px) } to { opacity:1; transform:translateY(0) } }
@keyframes introFadeOut { from { opacity:1 } to { opacity:0; visibility:hidden } }
@keyframes logoParticles { 0% { opacity:0; transform:scale(0) rotate(180deg) } 50% { opacity:1; transform:scale(1.2) rotate(0deg) } 100% { opacity:1; transform:scale(1) rotate(0deg) } }
@keyframes curtainReveal { from { clip-path: inset(0 0 100% 0) } to { clip-path: inset(0 0 0 0) } }
@keyframes rotateIn { from { transform: rotate(-180deg) scale(0); opacity:0 } to { transform: rotate(0) scale(1); opacity:1 } }
@keyframes shimmer { 0% { background-position: -200% center } 100% { background-position: 200% center } }

/* Scroll reveal classes */
.reveal { opacity:0; transform:translateY(40px); transition: opacity 0.8s ease, transform 0.8s ease; }
.reveal.active { opacity:1; transform:translateY(0); }
.reveal-left { opacity:0; transform:translateX(-60px); transition: all 0.8s ease; }
.reveal-left.active { opacity:1; transform:translateX(0); }
.reveal-right { opacity:0; transform:translateX(60px); transition: all 0.8s ease; }
.reveal-right.active { opacity:1; transform:translateX(0); }
.reveal-scale { opacity:0; transform:scale(0.8); transition: all 0.8s ease; }
.reveal-scale.active { opacity:1; transform:scale(1); }

/* Stagger children */
.stagger-children .reveal:nth-child(1) { transition-delay: 0.1s }
.stagger-children .reveal:nth-child(2) { transition-delay: 0.2s }
.stagger-children .reveal:nth-child(3) { transition-delay: 0.3s }
.stagger-children .reveal:nth-child(4) { transition-delay: 0.4s }
.stagger-children .reveal:nth-child(5) { transition-delay: 0.5s }
.stagger-children .reveal:nth-child(6) { transition-delay: 0.6s }
.stagger-children .reveal:nth-child(7) { transition-delay: 0.7s }
.stagger-children .reveal:nth-child(8) { transition-delay: 0.8s }

.char {
  display: inline-block;
  opacity: 0;
  animation: charReveal 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  white-space: pre;
}
