/* K&M Invest — delikatne animacje; translate/scale nie naruszają istniejącego transform. */
body.km-site-page .km-scroll-motion {
  will-change: opacity, translate, scale, clip-path, filter;
  backface-visibility: hidden;
}

@media (prefers-reduced-motion: no-preference) {
  body.km-site-page .km-scroll-motion {
    opacity: 0;
    translate: 0 20px;
    transition-property: opacity, translate, scale, clip-path, filter;
    transition-duration: 680ms;
    transition-timing-function: cubic-bezier(.22, 1, .36, 1);
    transition-delay: var(--km-motion-delay, 0ms);
  }

  body.km-site-page .km-scroll-motion.km-motion-photo {
    translate: none;
    scale: 1.022;
    clip-path: inset(0 0 3% 0 round 0px);
    transition-duration: 920ms;
  }

  body.km-site-page .km-scroll-motion.km-motion-deco {
    translate: 12px 0;
    transition-duration: 760ms;
  }

  body.km-site-page .km-scroll-motion.km-motion-soft {
    translate: none;
    transition-duration: 760ms;
  }

  body.km-site-page .km-scroll-motion.km-motion-visible {
    opacity: 1;
    translate: 0 0;
    scale: 1;
    clip-path: inset(0 0 0 0 round 0px);
    filter: none;
  }

  /* Wizualizacje i galerie — łagodniejsze wejście bez „szarpnięcia” podczas wczytywania. */
  body.km-site-page .km-gallery-grid img.km-gallery-pending,
  body.km-site-page .km-lightbox img.km-gallery-pending,
  body.km-site-page .km-scroll-motion.km-motion-gallery {
    opacity: 0;
    scale: 1.016;
    clip-path: inset(0 0 2% 0 round 0px);
    filter: blur(2px);
    transition-duration: 980ms;
    transition-timing-function: cubic-bezier(.2, .9, .24, 1);
  }

  body.km-site-page .km-gallery-grid img.km-gallery-ready,
  body.km-site-page .km-lightbox img.km-gallery-ready,
  body.km-site-page .km-scroll-motion.km-motion-gallery.km-motion-visible {
    opacity: 1;
    scale: 1;
    clip-path: inset(0 0 0 0 round 0px);
    filter: blur(0);
  }
}

@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
  body.km-site-page .km-scroll-motion:not(.km-motion-photo):not(.km-motion-soft):not(.km-motion-gallery) {
    translate: 0 12px;
  }

  body.km-site-page .km-scroll-motion.km-motion-photo,
  body.km-site-page .km-scroll-motion.km-motion-gallery {
    scale: 1.01;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.km-site-page .km-scroll-motion,
  body.km-site-page .km-gallery-grid img,
  body.km-site-page .km-lightbox img {
    opacity: 1 !important;
    translate: 0 0 !important;
    scale: 1 !important;
    clip-path: none !important;
    filter: none !important;
    transition: none !important;
  }
}

/*
 * Mobile-only correction: reveal earlier, keep content readable before its entrance,
 * avoid compositing expensive blur/clip-path/zoom on phone GPUs.
 * Desktop transitions and design CSS remain intact.
 */
@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
  body.km-site-page .km-scroll-motion {
    opacity: .86;
    translate: 0 7px;
    scale: 1;
    clip-path: none;
    filter: none;
    will-change: auto;
    transition-property: opacity, translate;
    transition-duration: 560ms;
    transition-timing-function: cubic-bezier(.22, 1, .36, 1);
  }

  body.km-site-page .km-scroll-motion.km-motion-photo,
  body.km-site-page .km-scroll-motion.km-motion-soft,
  body.km-site-page .km-scroll-motion.km-motion-gallery {
    opacity: .88;
    translate: 0 5px;
    scale: 1;
    clip-path: none;
    filter: none;
    transition-property: opacity, translate;
    transition-duration: 620ms;
  }

  body.km-site-page .km-scroll-motion.km-motion-deco {
    translate: 6px 0;
    transition-duration: 600ms;
  }

  body.km-site-page .km-gallery-grid img.km-gallery-pending {
    opacity: .88;
    translate: none;
    scale: 1;
    clip-path: none;
    filter: none;
    transition-property: opacity;
    transition-duration: 620ms;
  }

  body.km-site-page .km-scroll-motion.km-motion-visible,
  body.km-site-page .km-scroll-motion.km-motion-photo.km-motion-visible,
  body.km-site-page .km-scroll-motion.km-motion-gallery.km-motion-visible,
  body.km-site-page .km-gallery-grid img.km-gallery-ready {
    opacity: 1;
    translate: 0 0;
    scale: 1;
    clip-path: none;
    filter: none;
  }
}

/* Mobile: stable, instantly visible content. Keep existing desktop animations intact. */
@media (max-width: 767px) {
  body.km-site-page .km-scroll-motion,
  body.km-site-page .km-gallery-grid img.km-gallery-pending,
  body.km-site-page .km-gallery-grid img.km-gallery-ready,
  body.km-site-page .km-lightbox img.km-gallery-pending,
  body.km-site-page .km-lightbox img.km-gallery-ready {
    opacity: 1 !important;
    translate: none !important;
    scale: none !important;
    clip-path: none !important;
    filter: none !important;
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
  }
}
