/* WolfTech — animaciones (CSS nativo) */
@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes drawLine{from{stroke-dashoffset:120}to{stroke-dashoffset:0}}
@keyframes nodePop{0%{opacity:0;transform:scale(0)}70%{transform:scale(1.4)}100%{opacity:1;transform:scale(1)}}
@keyframes nodePulse{0%,100%{opacity:1}50%{opacity:.45}}
@keyframes eyeGlow{0%,100%{opacity:1}50%{opacity:.55}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes waPulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.6);opacity:0}}
@keyframes barGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* Hero: entrada escalonada */
.hero .intro>*{opacity:0;animation:fadeUp .9s var(--ease) forwards}
.hero .intro>*:nth-child(1){animation-delay:.05s}
.hero .intro>*:nth-child(2){animation-delay:.15s}
.hero .intro>*:nth-child(3){animation-delay:.28s}
.hero .intro>*:nth-child(4){animation-delay:.4s}
.hero .intro>*:nth-child(5){animation-delay:.55s}

/* Lobo animado */
.wolf--anim .edges line{stroke-dasharray:120;stroke-dashoffset:120;animation:drawLine 1.6s var(--ease) forwards;animation-delay:calc(var(--i) * 45ms + .3s)}
.wolf--anim .nodes circle{transform-box:fill-box;transform-origin:center;opacity:0;animation:nodePop .6s var(--ease) forwards,nodePulse 3.6s ease-in-out infinite;animation-delay:calc(var(--i) * 60ms + .6s),calc(var(--i) * 200ms + 2.4s)}
.wolf--anim .eye{opacity:0;animation:fadeIn .6s 1.8s forwards,eyeGlow 2.8s 2.4s ease-in-out infinite}
.hero__visual .float{animation:float 7s ease-in-out infinite;width:100%;height:100%}
.hero__ring{animation:spin 60s linear infinite}

/* Scroll reveal (solo si JS está activo) */
.js [data-reveal]{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.js [data-reveal="fade"]{transform:none}
@media (min-width:961px){.js [data-reveal="left"]{transform:translateX(-30px)}.js [data-reveal="right"]{transform:translateX(30px)}}
.js [data-reveal].is-in{opacity:1;transform:none}
.js .bars span{transform:scaleY(0)}
.js .is-in .bars span,.js .bars.is-in span{animation:barGrow 1s var(--ease) forwards;animation-delay:calc(var(--k,0) * 70ms)}

[data-parallax]{will-change:transform}
.calc__total.bump{animation:fadeIn .35s}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js [data-reveal]{opacity:1;transform:none}
  .wolf--anim .edges line{stroke-dashoffset:0}
  .wolf--anim .nodes circle,.wolf--anim .eye,.hero .intro>*{opacity:1}
  .js .bars span{transform:none}
}