/* Effekte – progressive Enhancement, AA-safe. Greift nur mit .js-fx (JS aktiv). */

/* ---------- Scroll-Reveal ---------- */
.js-fx [data-reveal]{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.js-fx [data-reveal].is-in{ opacity:1; transform:none; }

/* Stagger in Rastern */
.js-fx .kpf-grid .kpf-card:nth-child(2),
.js-fx .home-services__grid .home-service:nth-child(2){ transition-delay:.09s; }
.js-fx .kpf-grid .kpf-card:nth-child(3),
.js-fx .home-services__grid .home-service:nth-child(3){ transition-delay:.18s; }
.js-fx .kpf-grid .kpf-card:nth-child(4){ transition-delay:.27s; }
.js-fx .kpf-grid .kpf-card:nth-child(5){ transition-delay:.36s; }
.js-fx .kpf-grid .kpf-card:nth-child(6){ transition-delay:.45s; }

/* ---------- Hero: Ken Burns + Intro-Stagger ---------- */
.js-fx .home-hero__bg{ transform:scale(1); transform-origin:center center; }
.js-fx .home-hero.is-ready .home-hero__bg{ animation:kbZoom 18s cubic-bezier(.2,.5,.25,1) forwards; }
/* Spürbar, aber zurückhaltend: Start bei 1.0 (Haus vollständig),
   sanft auf 1.045 – der Beschnitt bleibt minimal. */
@keyframes kbZoom{ from{ transform:scale(1); } to{ transform:scale(1.045); } }

.js-fx .home-hero__inner > *{ opacity:0; transform:translateY(24px); }
.js-fx .home-hero.is-ready .home-hero__inner > *{ animation:heroIn .95s var(--ease) forwards; }
.js-fx .home-hero.is-ready .home-hero__inner > *:nth-child(1){ animation-delay:.15s; }
.js-fx .home-hero.is-ready .home-hero__inner > *:nth-child(2){ animation-delay:.30s; }
.js-fx .home-hero.is-ready .home-hero__inner > *:nth-child(3){ animation-delay:.48s; }
.js-fx .home-hero.is-ready .home-hero__inner > *:nth-child(4){ animation-delay:.64s; }
@keyframes heroIn{ to{ opacity:1; transform:none; } }

/* ---------- Reduced Motion: alles ruhig ---------- */
@media (prefers-reduced-motion: reduce){
  .js-fx [data-reveal]{ opacity:1 !important; transform:none !important; transition:none !important; }
  .js-fx .home-hero__bg{ animation:none !important; }
  .js-fx .home-hero__inner > *{ opacity:1 !important; transform:none !important; animation:none !important; }
}