.reveal{opacity:0;transform:translateY(30px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.2s}
.reveal-delay-3{transition-delay:.3s}
.reveal-delay-4{transition-delay:.4s}
.reveal-delay-5{transition-delay:.5s}

@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeInDown{from{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}
@keyframes scaleIn{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
@keyframes slideInLeft{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideInRight{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
@keyframes glow{0%,100%{box-shadow:0 0 5px rgba(102,126,234,.3)}50%{box-shadow:0 0 20px rgba(102,126,234,.6)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}

.animate-fade-in{animation:fadeIn .6s ease forwards}
.animate-fade-in-up{animation:fadeInUp .6s ease forwards}
.animate-scale-in{animation:scaleIn .4s ease forwards}

.hero-gradient{position:relative;overflow:hidden}
.hero-gradient::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 50%,rgba(102,126,234,.15) 0%,transparent 60%),radial-gradient(ellipse at 70% 50%,rgba(118,75,162,.1) 0%,transparent 60%);animation:pulse 8s ease-in-out infinite}

.neon-border{position:relative}
.neon-border::after{content:'';position:absolute;inset:-1px;border-radius:inherit;background:var(--gradient-accent);z-index:-1;opacity:0;transition:opacity var(--transition-normal)}
.neon-border:hover::after{opacity:1}

.glow-hover{transition:box-shadow var(--transition-normal)}
.glow-hover:hover{box-shadow:var(--glow-primary)}

.float{animation:float 3s ease-in-out infinite}

.spinner{width:24px;height:24px;border:2px solid var(--glass-border);border-top-color:var(--accent-primary);border-radius:50%;animation:spin .8s linear infinite}
