
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes scaleIn{from{transform:scale(0.9);opacity:0}to{transform:scale(1);opacity:1}}
.animate-fade{animation:fadeInUp 0.8s ease forwards}
.animate-delay-1{animation-delay:0.15s;opacity:0}
.animate-delay-2{animation-delay:0.3s;opacity:0}
.animate-delay-3{animation-delay:0.45s;opacity:0}
.reveal{opacity:0;transform:translateY(30px);transition:0.8s}
.reveal.active{opacity:1;transform:translateY(0)}
.perspective-card{perspective:1000px}
.perspective-card .inner{transition:transform 0.6s}
.perspective-card:hover .inner{transform:rotateY(6deg) rotateX(4deg)}
.timeline{position:relative;padding-left:40px}
.timeline::before{content:'';position:absolute;left:12px;top:0;bottom:0;width:3px;background:linear-gradient(var(--primary),var(--light-blue))}
.timeline-item{position:relative;margin-bottom:30px;background:#fff;padding:20px;border-radius:14px;box-shadow:var(--shadow)}
.timeline-item::before{content:'';position:absolute;left:-32px;top:24px;width:16px;height:16px;background:var(--primary);border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 3px var(--light-blue)}
.rotate-icon{transition:transform 0.6s}
.rotate-icon:hover{transform:rotateY(180deg)}
.counter{font-weight:700;color:var(--primary)}
