/* Auftritt und Einflug der Leistungs-Unterseiten (Ansage Inhaber 01.11.2026), Gegenstück zu js/einflug.js.
   Reihenfolge beim Laden: 1. die Überschrift (h1) wird Buchstabe für Buchstabe hingeschrieben, 2. der Rest des ersten
   Bildschirms blendet auf einmal weich ein, 3. erst dann dürfen Videos starten. Beim Scrollen fliegen Bilder seitlich,
   Kacheln von unten und Texte weich herein (das macht js/einflug.js über Inline-Stile, nicht hier).
   Alles hängt an html.ef-js, das nur das Skript setzt und nur, wenn Bewegung erlaubt ist: ohne Skript und bei
   „Bewegung reduzieren“ greift hier nichts, die Seite steht sofort. Nur opacity und transform, kein Layoutsprung. */

/* bis das Skript die Überschrift zerlegt hat: Inhalt verborgen (Platz bleibt, kein Sprung); Notbremse nach 4 s ohne Skript */
html.ef-js:not(.ef-bereit) main{visibility:hidden;animation:ef-notfall 0s 4s forwards}
@keyframes ef-notfall{to{visibility:visible}}

/* 1. Überschrift: jeder Buchstabe ein eigener Schriftzug, gestaffelt (Abstand --ef-schritt setzt das Skript) */
html.ef-js main h1.ef-h1{animation:none!important;opacity:1!important}
html.ef-js main h1.ef-h1 .ef-z{opacity:0;transition:opacity .38s cubic-bezier(.33,0,.2,1);transition-delay:calc(var(--i,0) * var(--ef-schritt,45ms))}
html.ef-js main h1.ef-h1.ef-schreibt .ef-z{opacity:1}
html.ef-js main h1.ef-h1.ef-sofort .ef-z{opacity:1;transition:none}

/* 2. der Rest des ersten Bildschirms: alles auf einmal */
html.ef-js .ef-rest{opacity:0;translate:0 10px}
html.ef-js.ef-rest-da .ef-rest{opacity:1;translate:0 0;transition:opacity .65s cubic-bezier(.22,1,.36,1),translate .65s cubic-bezier(.22,1,.36,1)}
html.ef-js.ef-rest-fertig .ef-rest{transition:none;translate:none}

@media (prefers-reduced-motion: reduce){
  html.ef-js main{visibility:visible!important}
  html.ef-js main h1.ef-h1 .ef-z,html.ef-js .ef-rest{opacity:1!important;translate:none!important;transition:none!important}
}
@media print{
  html.ef-js main{visibility:visible!important}
  html.ef-js main h1.ef-h1 .ef-z,html.ef-js .ef-rest{opacity:1!important;translate:none!important}
}
