/* IQ services overview: reuse the four approved homepage illustrations. */
main.services-overview-page .services-overview-direction > .services-overview-visual.iqso-art {
  --iqso-position: 0 0;
  display: block;
  position: relative;
  align-self: center;
  justify-self: center;
  width: 100%;
  max-width: 480px;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  perspective: none;
  pointer-events: none;
}
main.services-overview-page .services-overview-direction > .services-overview-visual-promotion.iqso-art { --iqso-position: 100% 0; }
main.services-overview-page .services-overview-direction > .services-overview-visual-development.iqso-art { --iqso-position: 0 100%; }
main.services-overview-page .services-overview-direction > .services-overview-visual-platforms.iqso-art { --iqso-position: 100% 100%; }
main.services-overview-page .iqso-art > .iqso-scene {
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: 12px;
  background-image: url('/assets/iq-services-volume-finish-20261028-e783b04aa789.webp');
  background-position: var(--iqso-position);
  background-size: 200% 200%;
  background-repeat: no-repeat;
  transform: none;
  transform-origin: center;
  opacity: 1;
}
/* The existing RU/EN observers trigger one calm entrance, then a still image.
   Without JavaScript the complete artwork remains visible. No new JS or timers. */
@media (prefers-reduced-motion: no-preference) {
  main.services-overview-page .services-overview-direction.is-in-view .iqso-scene {
    animation: iqso-art-settle 2600ms cubic-bezier(.2,.7,.25,1) both;
  }
}
@keyframes iqso-art-settle {
  0% { transform: translateY(8px) scale(.985); }
  100% { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  main.services-overview-page .iqso-art > .iqso-scene {
    animation: none !important;
    transform: none !important;
  }
}
@media (max-width: 1100px) {
  main.services-overview-page .services-overview-direction > .services-overview-visual.iqso-art {
    max-width: 440px;
  }
}
@media (max-width: 640px) {
  main.services-overview-page .services-overview-direction > .services-overview-visual.iqso-art {
    max-width: 440px;
  }
  main.services-overview-page .iqso-art > .iqso-scene { border-radius: 10px; }
}