@keyframes load{to{width:100%}}
@keyframes float{0%,100%{transform:translateY(0) rotateY(-9deg) rotateX(3deg)}50%{transform:translateY(-14px) rotateY(-9deg) rotateX(3deg)}}
@keyframes sweep{0%,30%{transform:translateX(-80%)}60%,100%{transform:translateX(90%)}}
@keyframes pulseGlow{0%,100%{filter:drop-shadow(0 0 6px rgba(138,63,242,.35))}50%{filter:drop-shadow(0 0 18px rgba(138,63,242,.7))}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes drift{0%,100%{transform:translate(0,0)}50%{transform:translate(14px,-10px)}}

.loader{transition:opacity .5s ease,visibility .5s ease}
.loader.hide{opacity:0;visibility:hidden;pointer-events:none}

.reveal{
  opacity:0;transform:translateY(26px);filter:blur(3px);
  transition:opacity .8s ease,transform .8s cubic-bezier(.16,1,.3,1),filter .8s ease;
}
.reveal.visible{opacity:1;transform:none;filter:none}

.benefit:nth-child(2),.experience-card:nth-child(2){transition-delay:.06s}
.benefit:nth-child(3),.experience-card:nth-child(3){transition-delay:.12s}
.benefit:nth-child(4),.experience-card:nth-child(4){transition-delay:.18s}

.orb-a{animation:drift 9s ease-in-out infinite}
.orb-b{animation:drift 11s ease-in-out infinite reverse}
.orb-c{animation:drift 7s ease-in-out infinite}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{transition:none;opacity:1;transform:none;filter:none}
  .device-wrap,.card-glare,.mini-glow,.orb-a,.orb-b,.orb-c,.loader-mark img{animation:none!important}
  .card-bg{transition:none!important}
}