/* ============================================================
   animations.css — Scroll- & Intro-Animationen (GSAP)
   Gilt für die ganze Captain-Wasserschadenhilfe-Seite.
   Wirkt nur, wenn JS läuft (<html class="gsap-anim">).
   Ohne JS / bei prefers-reduced-motion bleibt alles sichtbar.
   ============================================================ */

/* Hero-Zeilen einzeln stapeln, damit sie nacheinander einfliegen */
.hero .triple .line { display: block; }

/* Pre-Hide: animierte Elemente sind anfangs unsichtbar — aber NUR
   wenn JS aktiv ist. Fällt JS aus, greift keine dieser Regeln. */
.gsap-anim .hero .triple .line,
.gsap-anim .hero .sub,
.gsap-anim .hero .cta-row,
.gsap-anim .hero .trust,
.gsap-anim .page-hero .crumbs,
.gsap-anim .page-hero h1,
.gsap-anim .page-hero .lead,
.gsap-anim section .kicker,
.gsap-anim section > .wrap > h2,
.gsap-anim section > .wrap > .lead,
.gsap-anim section > .wrap > p,
.gsap-anim .split > div,
.gsap-anim .checklist li,
.gsap-anim .card,
.gsap-anim .logo-chip,
.gsap-anim .cert,
.gsap-anim .insta-grid .tile,
.gsap-anim .cta-band .wrap > * {
  opacity: 0;
  will-change: transform, opacity;
}

/* Header bekommt beim Scrollen einen dezenten Schatten */
header.site {
  transition: box-shadow .3s ease, background-color .3s ease;
}
header.site.is-scrolled {
  box-shadow: 0 8px 24px rgba(10, 42, 74, .12);
}

/* Wer Animationen abgeschaltet hat, sieht alles sofort und statisch */
@media (prefers-reduced-motion: reduce) {
  .gsap-anim * {
    opacity: 1 !important;
    transform: none !important;
  }
}