/* ==========================================================================
   Weiche Seitenwechsel
   ==========================================================================
   Beim Klick auf einen Link derselben Domain wird die alte Seite kurz
   ausgeblendet und die neue eingeblendet, statt hart umzuschalten. Das ist
   der Unterschied zwischen "Website" und "Anwendung" - und es kostet nichts
   ausser diesen paar Zeilen.

   Browser ohne Unterstuetzung ignorieren die Regeln und wechseln wie bisher.
   Zwischen verschiedenen Domains (etwa dikita.app -> prodocs.app) gibt es
   den Effekt bewusst nicht; das erlauben Browser aus Sicherheitsgruenden
   nur innerhalb derselben Domain.

   Eingebunden wird absolut als /seiten-uebergang.css - dieselbe Ueberlegung
   wie bei seiten-navigation.css: Die Weiterleitungsregel schreibt nur um,
   was im Produktordner liegt; diese Datei liegt dort nicht und gilt damit
   fuer alle Domains zugleich.

   Kurz und flach gehalten: 160ms hinaus, 200ms herein, dazu 6px Versatz.
   Alles darueber faellt als "Effekt" auf, und genau das soll es nicht.
   ========================================================================== */

@view-transition { navigation: auto; }

::view-transition-old(root) {
    animation: seitenwechsel-raus 0.16s ease-out both;
}

::view-transition-new(root) {
    animation: seitenwechsel-rein 0.2s ease-out both;
}

@keyframes seitenwechsel-raus {
    to { opacity: 0; transform: translateY(-6px); }
}

@keyframes seitenwechsel-rein {
    from { opacity: 0; transform: translateY(6px); }
}

@media (prefers-reduced-motion: reduce) {
    ::view-transition-old(root),
    ::view-transition-new(root) { animation: none; }
}
