/* S3–S8 3D icon scene-entry motion — once via .is-mod-icons-active. */

@keyframes qrmo-icon-s3-globe {
  0% {
    transform: rotateY(-18deg) rotate(-6deg) scale(0.92);
    opacity: 0.78;
  }
  100% {
    transform: rotateY(0deg) rotate(0deg) scale(1);
    opacity: 1;
  }
}

@keyframes qrmo-icon-s4-slide {
  0% {
    transform: translate3d(-6px, 3px, 0) scale(0.94);
    opacity: 0.5;
  }
  62% {
    transform: translate3d(1px, -1px, 0) scale(1.02);
    opacity: 1;
  }
  100% {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 1;
  }
}

@keyframes qrmo-icon-s5-sparkle {
  0% {
    transform: scale(0.86);
    opacity: 0.55;
  }
  42% {
    transform: scale(1.07);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes qrmo-icon-s5-spark {
  0% {
    opacity: 0;
    transform: scale(0.4);
  }
  45% {
    opacity: 1;
    transform: scale(1.12);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes qrmo-icon-s6-scan {
  0% {
    transform: translate3d(0, -120%, 0);
    opacity: 0;
  }
  28% {
    opacity: 0.9;
  }
  100% {
    transform: translate3d(0, 130%, 0);
    opacity: 0;
  }
}

@keyframes qrmo-icon-s6-settle {
  0% {
    transform: rotateX(12deg) scale(0.92);
    opacity: 0.7;
  }
  100% {
    transform: rotateX(0deg) scale(1);
    opacity: 1;
  }
}

@keyframes qrmo-icon-s7-pulse {
  0% {
    transform: rotate(-11deg) scale(0.9);
    opacity: 0.7;
  }
  48% {
    transform: rotate(6deg) scale(1.05);
    opacity: 1;
  }
  100% {
    transform: rotate(0deg) scale(1);
    opacity: 1;
  }
}

@keyframes qrmo-icon-s8-bar {
  0% {
    transform: scaleY(0.12);
    opacity: 0.45;
  }
  100% {
    transform: scaleY(1);
    opacity: 1;
  }
}

@keyframes qrmo-icon-s8-trend {
  0% {
    opacity: 0;
    transform: translate3d(-4px, 4px, 0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s3 .qrmo-translation-v3-benefit-icon svg.qrmo-mod-3d {
  transform-origin: 50% 50%;
  transform-style: preserve-3d;
  animation: qrmo-icon-s3-globe 760ms cubic-bezier(0.16, 0.84, 0.22, 1) both;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s3 .qrmo-translation-v3-benefit:nth-child(1) .qrmo-translation-v3-benefit-icon svg {
  animation-delay: 0ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s3 .qrmo-translation-v3-benefit:nth-child(2) .qrmo-translation-v3-benefit-icon svg {
  animation-delay: 70ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s3 .qrmo-translation-v3-benefit:nth-child(3) .qrmo-translation-v3-benefit-icon svg {
  animation-delay: 140ms;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s4 .qrmo-benefit-check svg.qrmo-mod-3d {
  animation: qrmo-icon-s4-slide 720ms cubic-bezier(0.16, 0.84, 0.22, 1) both;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s4 .qrmo-smart-filter-benefit:nth-child(1) .qrmo-benefit-check svg {
  animation-delay: 0ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s4 .qrmo-smart-filter-benefit:nth-child(2) .qrmo-benefit-check svg {
  animation-delay: 65ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s4 .qrmo-smart-filter-benefit:nth-child(3) .qrmo-benefit-check svg {
  animation-delay: 130ms;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s5 .qrmo-chatbot-feature__icon svg.qrmo-mod-3d {
  transform-origin: 50% 50%;
  animation: qrmo-icon-s5-sparkle 740ms cubic-bezier(0.16, 0.84, 0.22, 1) both;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s5 .qrmo-mod-3d-spark {
  transform-origin: 50% 50%;
  animation: qrmo-icon-s5-spark 740ms cubic-bezier(0.16, 0.84, 0.22, 1) both;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s5 .qrmo-chatbot-feature__item:nth-child(1) .qrmo-chatbot-feature__icon svg {
  animation-delay: 0ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s5 .qrmo-chatbot-feature__item:nth-child(2) .qrmo-chatbot-feature__icon svg {
  animation-delay: 70ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s5 .qrmo-chatbot-feature__item:nth-child(3) .qrmo-chatbot-feature__icon svg {
  animation-delay: 140ms;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s6 .qrmo-tables-v5__check {
  position: relative;
  overflow: hidden;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s6 .qrmo-tables-v5__check svg.qrmo-mod-3d {
  transform-origin: 50% 80%;
  animation: qrmo-icon-s6-settle 760ms cubic-bezier(0.16, 0.84, 0.22, 1) both;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s6 .qrmo-tables-v5__check::after {
  content: "";
  position: absolute;
  left: 8%;
  right: 8%;
  top: 0;
  height: 38%;
  background: linear-gradient(
    180deg,
    rgba(232, 199, 102, 0) 0%,
    rgba(232, 199, 102, 0.55) 48%,
    rgba(232, 199, 102, 0) 100%
  );
  pointer-events: none;
  animation: qrmo-icon-s6-scan 780ms cubic-bezier(0.16, 0.84, 0.22, 1) both;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s6 .qrmo-tables-v5__benefit:nth-child(1) .qrmo-tables-v5__check::after {
  animation-delay: 0ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s6 .qrmo-tables-v5__benefit:nth-child(2) .qrmo-tables-v5__check::after {
  animation-delay: 80ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s6 .qrmo-tables-v5__benefit:nth-child(3) .qrmo-tables-v5__check::after {
  animation-delay: 160ms;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s7 .qrmo-service-v2__feature-icon svg.qrmo-mod-3d {
  transform-origin: 50% 18%;
  animation: qrmo-icon-s7-pulse 720ms cubic-bezier(0.16, 0.84, 0.22, 1) both;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s7 .qrmo-service-v2__feature:nth-child(1) .qrmo-service-v2__feature-icon svg {
  animation-delay: 0ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s7 .qrmo-service-v2__feature:nth-child(2) .qrmo-service-v2__feature-icon svg {
  animation-delay: 70ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s7 .qrmo-service-v2__feature:nth-child(3) .qrmo-service-v2__feature-icon svg {
  animation-delay: 140ms;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s8 .qrmo-mod-3d-bar {
  transform-origin: 50% 100%;
  animation: qrmo-icon-s8-bar 760ms cubic-bezier(0.16, 0.84, 0.22, 1) both;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s8 .qrmo-mod-3d-trend {
  animation: qrmo-icon-s8-trend 820ms cubic-bezier(0.16, 0.84, 0.22, 1) both;
}

html.qrmo-mod-story-v4 .is-mod-icons-active--s8 .qrmo-analytics-v3__pillar:nth-child(1) .qrmo-mod-3d-bar {
  animation-delay: 0ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s8 .qrmo-analytics-v3__pillar:nth-child(2) .qrmo-mod-3d-bar {
  animation-delay: 60ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s8 .qrmo-analytics-v3__pillar:nth-child(3) .qrmo-mod-3d-bar {
  animation-delay: 120ms;
}
html.qrmo-mod-story-v4 .is-mod-icons-active--s8 .qrmo-analytics-v3__pillar:nth-child(4) .qrmo-mod-3d-bar {
  animation-delay: 180ms;
}

@media (max-width: 767px) {
  html.qrmo-mod-story-v4 .is-mod-icons-active--s3 .qrmo-translation-v3-benefit-icon svg.qrmo-mod-3d,
  html.qrmo-mod-story-v4 .is-mod-icons-active--s4 .qrmo-benefit-check svg.qrmo-mod-3d,
  html.qrmo-mod-story-v4 .is-mod-icons-active--s5 .qrmo-chatbot-feature__icon svg.qrmo-mod-3d,
  html.qrmo-mod-story-v4 .is-mod-icons-active--s6 .qrmo-tables-v5__check svg.qrmo-mod-3d,
  html.qrmo-mod-story-v4 .is-mod-icons-active--s7 .qrmo-service-v2__feature-icon svg.qrmo-mod-3d,
  html.qrmo-mod-story-v4 .is-mod-icons-active--s8 .qrmo-analytics-v3__pillar-icon svg.qrmo-mod-3d {
    animation-duration: 640ms;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.qrmo-mod-story-v4 .is-mod-icons-active .qrmo-translation-v3-benefit-icon svg,
  html.qrmo-mod-story-v4 .is-mod-icons-active .qrmo-benefit-check svg,
  html.qrmo-mod-story-v4 .is-mod-icons-active .qrmo-chatbot-feature__icon svg,
  html.qrmo-mod-story-v4 .is-mod-icons-active .qrmo-tables-v5__check svg,
  html.qrmo-mod-story-v4 .is-mod-icons-active .qrmo-tables-v5__check::after,
  html.qrmo-mod-story-v4 .is-mod-icons-active .qrmo-service-v2__feature-icon svg,
  html.qrmo-mod-story-v4 .is-mod-icons-active .qrmo-mod-3d-bar,
  html.qrmo-mod-story-v4 .is-mod-icons-active .qrmo-mod-3d-trend,
  html.qrmo-mod-story-v4 .is-mod-icons-active .qrmo-mod-3d-spark {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
}