/* Scrollhinweis unter dem Hero (Max, 09.10.2026): pulsierender Pfeil, nur wo unter dem Bildschirm noch Inhalt steht. */
.scrollhinweis{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:20;
  display:grid;place-items:center;width:52px;height:52px;border-radius:50%;border:1px solid rgba(243,235,230,.45);
  background:rgba(26,20,23,.35);color:#f3ebe6;cursor:pointer;padding:0;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .4s}
.scrollhinweis.sichtbar{opacity:1;pointer-events:auto}
.scrollhinweis svg{width:22px;height:22px;display:block}
.scrollhinweis::before{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid rgba(243,235,230,.6);animation:scrollpuls 2.2s ease-out infinite}
.scrollhinweis.sichtbar svg{animation:scrollpfeil 2.2s ease-in-out infinite}
.scrollhinweis:focus-visible{outline:3px solid #f3ebe6;outline-offset:3px}
@keyframes scrollpuls{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.7);opacity:0}}
@keyframes scrollpfeil{0%,100%{transform:translateY(-2px)}50%{transform:translateY(4px)}}
@media (prefers-reduced-motion:reduce){.scrollhinweis::before,.scrollhinweis.sichtbar svg{animation:none}}
/* Auf dem Handy rechts über der Bildzeile und dem powered-Link, damit nichts verdeckt wird. */
@media (max-width:700px){.scrollhinweis{left:auto;right:22px;transform:none;bottom:max(72px,calc(env(safe-area-inset-bottom) + 60px))}}
