@keyframes advFadeIn{
from{opacity:0}
to{opacity:1}
}
@keyframes advFadeInUp{
from{opacity:0;transform:translateY(12px)}
to{opacity:1;transform:translateY(0)}
}
@keyframes advFadeInDown{
from{opacity:0;transform:translateY(-12px)}
to{opacity:1;transform:translateY(0)}
}
@keyframes advScaleIn{
from{opacity:0;transform:scale(.96)}
to{opacity:1;transform:scale(1)}
}
@keyframes advSlideInRight{
from{opacity:0;transform:translateX(24px)}
to{opacity:1;transform:translateX(0)}
}
@keyframes advSlideInLeft{
from{opacity:0;transform:translateX(-24px)}
to{opacity:1;transform:translateX(0)}
}
@keyframes advPulse{
0%,100%{opacity:1}
50%{opacity:.6}
}
@keyframes advSpin{
to{transform:rotate(360deg)}
}
@keyframes advSkeleton{
0%{background-position:100% 50%}
100%{background-position:0 50%}
}

.anim-fade-in{animation:advFadeIn var(--duration-medium) var(--ease-out) both}
.anim-fade-in-up{animation:advFadeInUp var(--duration-medium) var(--ease-out) both}
.anim-fade-in-down{animation:advFadeInDown var(--duration-medium) var(--ease-out) both}
.anim-scale-in{animation:advScaleIn var(--duration-medium) var(--ease-out) both}
.anim-slide-in-right{animation:advSlideInRight var(--duration-medium) var(--ease-out) both}
.anim-slide-in-left{animation:advSlideInLeft var(--duration-medium) var(--ease-out) both}
.anim-pulse{animation:advPulse 1.8s ease-in-out infinite}
.anim-spin{animation:advSpin 1s linear infinite}

.anim-delay-1{animation-delay:80ms}
.anim-delay-2{animation-delay:160ms}
.anim-delay-3{animation-delay:240ms}
.anim-delay-4{animation-delay:320ms}
.anim-delay-5{animation-delay:400ms}

.hover-lift{transition:transform var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard)}
.hover-lift:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}

.hover-underline{position:relative}
.hover-underline::after{
content:"";
position:absolute;
left:0;
bottom:-2px;
width:0;
height:2px;
background:var(--color-accent);
transition:width var(--duration-base) var(--ease-standard);
}
.hover-underline:hover::after{width:100%}

.reveal{opacity:0;transform:translateY(16px);transition:opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out)}
.reveal.is-visible{opacity:1;transform:none}

@media (prefers-reduced-motion: reduce){
.anim-fade-in,
.anim-fade-in-up,
.anim-fade-in-down,
.anim-scale-in,
.anim-slide-in-right,
.anim-slide-in-left,
.anim-pulse,
.anim-spin,
.hover-lift,
.hover-underline::after,
.reveal{
animation:none!important;
transition:none!important;
transform:none!important;
opacity:1!important;
}
}