@keyframes headerIn{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
@keyframes fabIn{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}
@keyframes floatY{0%,100%{transform:translateY(-6px)}50%{transform:translateY(6px)}}
@keyframes pulseRing{0%{opacity:.5;transform:scale(.9)}70%{opacity:0;transform:scale(1.25)}100%{opacity:0}}
@keyframes chatIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes shimmer{from{background-position:-140% 0}to{background-position:240% 0}}

/* Los bloques con [data-reveal] arrancan VISIBLES. Solo se ocultan cuando el
   JavaScript confirma que va a animarlos (html.js-reveal). Si el script falla o
   esta bloqueado, el contenido se ve y se puede dar clic con normalidad. */
[data-reveal]{opacity:1;transform:none}
html.js-reveal [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
html.js-reveal [data-reveal].is-visible{opacity:1;transform:none}
[data-reveal-delay="1"]{transition-delay:.08s}
[data-reveal-delay="2"]{transition-delay:.16s}
[data-reveal-delay="3"]{transition-delay:.24s}
[data-reveal-delay="4"]{transition-delay:.32s}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  [data-reveal],html.js-reveal [data-reveal]{opacity:1;transform:none}
  .hero__iso{animation:none !important;transform:none !important}
}