/* ================================================================
   Wolke 7 – Scroll-Animationen
   Weiche Reveal-Effekte beim Hereinscrollen.
   Werden in js/animations.js mit IntersectionObserver aktiviert.
   ================================================================ */

/* Basis: Alles unsichtbar starten */
.reveal {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  transition:
    opacity .9s cubic-bezier(.22, .61, .36, 1),
    transform 1s cubic-bezier(.22, .61, .36, 1);
  will-change: opacity, transform;
}

/* Spezifische Reveal-Richtungen */
.reveal[data-reveal="fade"]       { transform: none; }
.reveal[data-reveal="fade-up"]    { transform: translate3d(0, 32px, 0); }
.reveal[data-reveal="fade-down"]  { transform: translate3d(0, -28px, 0); }
.reveal[data-reveal="slide-left"] { transform: translate3d(40px, 0, 0); }
.reveal[data-reveal="slide-right"]{ transform: translate3d(-40px, 0, 0); }
.reveal[data-reveal="scale"]      { transform: scale(.96); }

/* Sichtbar */
.reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

/* Verzögerungen über Daten-Attribut – per JS gesetzt als inline style.
   Hier nur Fallback für gestufte Listen. */
.reveal[data-delay="60"]  { transition-delay: .06s; }
.reveal[data-delay="80"]  { transition-delay: .08s; }
.reveal[data-delay="120"] { transition-delay: .12s; }
.reveal[data-delay="160"] { transition-delay: .16s; }
.reveal[data-delay="180"] { transition-delay: .18s; }
.reveal[data-delay="240"] { transition-delay: .24s; }
.reveal[data-delay="320"] { transition-delay: .32s; }

/* Spezielle, ruhige Animationen für Hero (sofort) */
.hero .reveal { transition-duration: 1.2s; }
.hero .reveal[data-reveal="fade-up"] { transform: translate3d(0, 40px, 0); }

/* Bildkarten leichter Floating-Effekt bei Hover */
.service-card,
.gift-card,
.trust__item,
.portfolio__item {
  transition:
    transform .6s cubic-bezier(.22, .61, .36, 1),
    box-shadow .6s cubic-bezier(.22, .61, .36, 1),
    opacity .4s cubic-bezier(.22, .61, .36, 1);
}

/* Sanfte Mikrobewegung im Saisonal-Tag */
.seasonal__tag {
  animation: tagBob 4.5s ease-in-out infinite;
  transform-origin: center;
}
@keyframes tagBob {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-3px); }
}

/* Sanftes Pulsieren am WhatsApp-Float */
.wa-float::before {
  content: "";
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: 2px solid rgba(37, 211, 102, .5);
  animation: waPulse 2.4s ease-out infinite;
  pointer-events: none;
}
@keyframes waPulse {
  0%   { transform: scale(.8); opacity: .8; }
  100% { transform: scale(1.4); opacity: 0; }
}
.wa-float { position: fixed; } /* sicherstellen */
.wa-float { isolation: isolate; }

/* Bei reduzierter Bewegung alle Reveals sofort sichtbar */
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  .seasonal__tag, .wa-float::before { animation: none !important; }
}