/* AyInnovate · Bewegung des Inhalts
   Eine Kurve, eine Richtung, kleine Wege. Der Rest ist Schnitt. */

.reveal {
  opacity: 0;
  transform: translate3d(0, 16px, 0);
  transition:
    opacity 0.6s var(--kurve),
    transform 0.6s var(--kurve);
  transition-delay: var(--d, 0ms);
}
.reveal.ist-da {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  html.gescrollt .scrollhinweis { transition: none; }
}

/* Kontaktfenster — Antritt und Abgang. Dieselbe Kurve in beide Richtungen,
   der Abgang kürzer. Der Grund wird nur gedämpft, nicht verdeckt.
   Die Dauer des Blattes ist zugleich die Wartezeit vor dialog.close(),
   js/kontakt.js liest sie hier ab — sie steht nur an dieser Stelle. */
.kontakt::backdrop {
  background-color: rgba(0, 0, 0, 0);
  transition: background-color 240ms var(--kurve);
}
.kontakt.ist-auf::backdrop { background-color: rgba(0, 0, 0, 0.28); }
.kontakt.geht-zu::backdrop { transition-duration: 150ms; }

.kontakt__blatt {
  opacity: 0;
  transform: translate3d(0, 14px, 0);
  transition:
    opacity 240ms var(--kurve),
    transform 240ms var(--kurve);
}
.kontakt.ist-auf .kontakt__blatt { opacity: 1; transform: translate3d(0, 0, 0); }
.kontakt.geht-zu .kontakt__blatt { transition-duration: 150ms; }

/* Versatz je Weg — dieselbe Staffelung wie im Feld: 24 ms, nacheinander. */
.kontakt .weg {
  opacity: 0;
  transform: translate3d(0, 10px, 0);
  transition:
    opacity 220ms var(--kurve) var(--d, 0ms),
    transform 220ms var(--kurve) var(--d, 0ms);
}
.kontakt.ist-auf .weg { opacity: 1; transform: translate3d(0, 0, 0); }
.wege li:nth-child(2) .weg { --d: 24ms; }
.wege li:nth-child(3) .weg { --d: 48ms; }
.wege li:nth-child(4) .weg { --d: 72ms; }
.kontakt.geht-zu .weg { transition-duration: 130ms; transition-delay: 0ms; }

@media (prefers-reduced-motion: reduce) {
  /* Kein Weg, kein Blatt, kein Schleier bewegt sich — das Fenster steht sofort.
     Auch der Abgang wird auf 0 ms gesetzt; js/kontakt.js misst ihn und
     schließt dann ohne Wartezeit. */
  .kontakt::backdrop,
  .kontakt.geht-zu::backdrop { background-color: rgba(0, 0, 0, 0.28); transition: none; }
  .kontakt__blatt,
  .kontakt.geht-zu .kontakt__blatt,
  .kontakt .weg,
  .kontakt.geht-zu .weg { opacity: 1; transform: none; transition: none; }
}