/* Inicio: animaciones de entrada direccionales, repetibles y aceleradas por GPU. */
.hm-reveal {
  opacity: 0 !important;
  transform: translate3d(var(--hm-x, 0), var(--hm-y, 0), 0) scale(var(--hm-scale, 1)) !important;
  clip-path: inset(var(--hm-clip, 0 0 0 0));
  transition:
    opacity 0.78s cubic-bezier(0.16, 1, 0.3, 1),
    transform 1.12s cubic-bezier(0.16, 1, 0.3, 1),
    clip-path 1.16s cubic-bezier(0.16, 1, 0.3, 1) !important;
  transition-delay: var(--hm-delay, 0ms) !important;
  will-change: opacity, transform, clip-path;
}
.hm-reveal.hm-in {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  clip-path: inset(0) !important;
}
.hm-reveal.hm-done {
  clip-path: none !important;
  overflow: visible !important;
  will-change: auto;
}
.hm-left {
  --hm-x: -72px;
  --hm-clip: 0 100% 0 0;
}
.hm-right {
  --hm-x: 72px;
  --hm-clip: 0 0 0 100%;
}
.hm-up {
  --hm-y: 54px;
  --hm-clip: 100% 0 0 0;
}
.hm-down {
  --hm-y: -34px;
  --hm-clip: 0 0 100% 0;
}
.hm-scale {
  --hm-y: 24px;
  --hm-scale: 0.92;
}

/* Distribuidor: tipografía horizontal y barrido vertical de la imagen. */
#impact .impact-dealer-stage.hm-reveal {
  --hm-x: 0;
  --hm-y: 0;
  --hm-scale: 1;
  --hm-clip: 100% 0 0 0;
  transform-origin: 50% 100% !important;
}
#impact .impact-dealer-stage.hm-reveal .impact-dealer-bike img {
  transform: translate3d(0, 11%, 0) scale(1.13) !important;
  transition: transform 1.45s cubic-bezier(0.16, 1, 0.3, 1) !important;
  transition-delay: calc(var(--hm-delay, 0ms) + 80ms) !important;
}
#impact .impact-dealer-stage.hm-in .impact-dealer-bike img {
  transform: translate3d(0, 0, 0) scale(1) !important;
}
#impact .impact-dealer-heading.hm-reveal {
  --hm-x: -84px;
  --hm-clip: 0 100% 0 0;
}
#impact .impact-dealer-copy.hm-reveal {
  --hm-x: -52px;
  --hm-clip: 0 100% 0 0;
}
#impact .distributor-cta.hm-reveal {
  --hm-x: 54px;
  --hm-clip: 0 0 0 100%;
}

/* Introducción y titulares de sección con barridos horizontales. */
#catalog .timeline-intro h2.hm-reveal,
#features .difference-head h2.hm-reveal,
#marcas-teaser .prod-intro-title span.hm-reveal,
#stats .stats-editorial-head h2.hm-reveal,
#cta .cta-editorial-lead h2.hm-reveal {
  --hm-x: -82px;
  --hm-clip: 0 100% 0 0;
}
#marcas-teaser .prod-intro-title span.hm-reveal {
  transition:
    opacity 1.02s cubic-bezier(0.16, 1, 0.3, 1),
    transform 1.48s cubic-bezier(0.16, 1, 0.3, 1),
    clip-path 1.54s cubic-bezier(0.16, 1, 0.3, 1) !important;
  transition-delay: var(--hm-delay, 0ms) !important;
}
#catalog .timeline-intro p.hm-reveal,
#features .difference-head p.hm-reveal {
  --hm-x: 64px;
  --hm-clip: 0 0 0 100%;
}

/* Los datos se elevan ligeramente al entrar. */
#features .difference-stat.hm-reveal,
#attitude .att-criteria article.hm-reveal,
#stats .stats-editorial-grid article.hm-reveal {
  --hm-y: 58px;
  --hm-scale: 0.965;
  transform-origin: 50% 100% !important;
}
#features .difference-stat.hm-reveal strong,
#stats .stats-editorial-grid article.hm-reveal strong {
  display: block;
  transition: transform 1.05s cubic-bezier(0.16, 1, 0.3, 1);
  transform: translate3d(0, 18px, 0);
}
#features .difference-stat.hm-in strong,
#stats .stats-editorial-grid article.hm-in strong {
  transform: none;
}

/* La introducción de filosofía y el cierre usan ejes opuestos para contrastar. */
#attitude .att-criteria-intro.hm-reveal {
  --hm-x: -68px;
  --hm-clip: 0 100% 0 0;
}
#cta .cta-editorial-photo.hm-reveal {
  --hm-y: 0;
  --hm-scale: 1;
  --hm-clip: 100% 0 0 0;
}
#cta .cta-editorial-photo.hm-reveal img,
#cta .cta-editorial-photo.hm-in img {
  transform: translate3d(0, var(--cta-parallax, -8%), 0) scale(1.015) !important;
  transform-origin: center center !important;
  backface-visibility: hidden;
  transition: none !important;
  will-change: transform;
}
#cta .cta-editorial-copy h3.hm-reveal {
  --hm-x: 68px;
  --hm-clip: 0 0 0 100%;
}
#cta .cta-editorial-copy p.hm-reveal,
#cta .cta-btns.hm-reveal {
  --hm-y: 38px;
}

/* Espacio extra para ascendentes: la tipografía condensada grande no debe recortarse en su propia caja de línea. */
#marcas-teaser .prod-intro-title {
  overflow: visible !important;
}
#marcas-teaser .prod-intro-title span {
  display: block !important;
  padding-top: 0.12em;
  line-height: 0.82 !important;
  overflow: visible !important;
}
#stats .stats-editorial-head h2 {
  padding-top: 0.13em !important;
  line-height: 0.84 !important;
  overflow: visible !important;
}
#cta .cta-editorial-lead h2 {
  padding-top: 0.13em !important;
  line-height: 0.82 !important;
  overflow: visible !important;
}

@media (max-width: 680px) {
  .hm-left,
  .hm-right {
    --hm-x: 42px;
  }
  .hm-left {
    --hm-x: -42px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hm-reveal,
  .hm-reveal.hm-in {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
    transition: none !important;
  }
}
