/* hero-bewegt.css · Fitness: Hero bewegt sich ohne Scrollen.
   Alles hier ist Dekor oder Transform. Der Normalzustand ist sichtbar:
   Ohne Skript und bei «Bewegung reduzieren» steht ein ruhiges Standbild
   (Foto ohne Zoom, Überschrift fertig gesetzt). Bildbudget: Foto w1800,
   höchste Vergrösserung 1,10 x 1,14 = 1,25, bis 1440 px Breite ohne Hochrechnen. */

.hw { display: inline-block; vertical-align: top; overflow: hidden; padding-bottom: .12em; margin-bottom: -.12em; }
.hw > span { display: inline-block; }
.hb-ekg { display: none; }

@media (prefers-reduced-motion: no-preference) {
  /* Kamera: langsames Auszoomen beim Laden, danach weiter Hin- und Herdriften */
  .sz-held .sz-foto {
    transform-origin: 62% 50%;
    animation: hb-kamera 26s ease-in-out infinite alternate;
    translate: calc(var(--hb-px, 0) * -16px) calc(var(--hb-py, 0) * -10px);
  }
  .sz-held .sz-riese--neun { translate: calc(var(--hb-px, 0) * 26px) calc(var(--hb-py, 0) * 16px); }

  /* Überschrift: Wort für Wort aus dem Schnitt */
  .hw > span { animation: hb-wort .95s cubic-bezier(.2, .8, .1, 1) calc(.2s + var(--i, 0) * .1s) backwards; }
  .hb-marke { animation: hb-auf .8s ease .05s backwards; }
  .hb-lead { animation: hb-auf .9s ease .85s backwards; }
  .hb-tun { animation: hb-auf .9s ease 1.05s backwards; }
  .hb-belege li { animation: hb-auf .8s ease backwards; }
  .hb-belege li:nth-child(1) { animation-delay: 1.25s; }
  .hb-belege li:nth-child(2) { animation-delay: 1.38s; }
  .hb-belege li:nth-child(3) { animation-delay: 1.51s; }

  /* Pulslinie: leuchtender Abschnitt läuft endlos über den unteren Bildrand */
  .hb-ekg { display: block; position: absolute; left: 0; bottom: 5%; width: 100%; height: 9vh; overflow: visible; pointer-events: none; }
  .hb-ekg path { fill: none; stroke: var(--hb-hervor); stroke-width: 2.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
  .hb-ekg-grund { opacity: .22; }
  .hb-ekg-lauf { stroke-dasharray: .16 1.2; stroke-dashoffset: 1.2; animation: hb-lauf 3.6s linear 1s infinite; filter: drop-shadow(0 0 6px var(--hb-hervor)); }
}

@keyframes hb-kamera {
  from { transform: scale(1.1) translate3d(1.2%, .4%, 0); }
  to   { transform: scale(1.02) translate3d(-1.2%, -.5%, 0); }
}
@keyframes hb-wort { from { transform: translateY(108%); } to { transform: none; } }
@keyframes hb-auf  { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes hb-lauf { from { stroke-dashoffset: 1.2; } to { stroke-dashoffset: -.16; } }

@media print { .hb-ekg { display: none; } }
.sz-foto picture { display: block; width: 100%; height: 100%; }