/* Blaauw Empire · fx-scroll: Scroll-Choreografie (GSAP ScrollTrigger), nur aktiv mit html.fx-scroll.
   Grundsatz: Die Einblendungen aus site.css über die Klasse .in werden hier neutralisiert (sichtbar,
   kein Übergang), js/fx-scroll.js setzt die Startwerte inline und übernimmt per GSAP.
   Läuft das Modul nicht (Reduced Motion, Fehler), bleibt alles sichtbar – ausfallsicher. */

/* Raster: Kacheln, Bereiche, Direkt-Karten, Schritte, FAQ, Fahrzeuge */
html.fx-scroll .tile,html.fx-scroll .tile.in{opacity:1;translate:none;transition:border-color .4s}
html.fx-scroll .tile.fx-done{transition:transform .35s ease,border-color .4s}   /* Neigung (site.js) wieder weich */
html.fx-scroll .fz,html.fx-scroll .fz.in{opacity:1;transition:border-color .4s}
html.fx-scroll .fz.fx-done{transition:transform .35s ease,border-color .4s}
html.fx-scroll .area,html.fx-scroll .area.in,
html.fx-scroll .dk,html.fx-scroll .dk.in,
html.fx-scroll .faq details,html.fx-scroll .faq details.in,
html.fx-scroll .steps>*,html.fx-scroll .steps>.reveal,html.fx-scroll .steps>.reveal.in{opacity:1;transform:none;transition:none}

/* Kapitel: Bild-Enthüllung per clip-path kommt aus GSAP, Goldlinie oben zieht per --fx-line auf */
html.fx-scroll .chapter .media,html.fx-scroll .chapter.in .media{clip-path:none;transition:none}
html.fx-scroll .chapter::before{content:"";position:absolute;left:0;top:0;height:1px;width:100%;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,var(--gold),rgba(200,169,90,.35) 60%,transparent);transform:scaleX(var(--fx-line,0));transform-origin:0 50%}

/* Hero: Medium zoomt und dunkelt beim Rausscrollen ab (Schleier wird per JS eingefügt) */
@media (min-width:901px){html.fx-scroll .cine-hero .media{will-change:transform}} /* Zoom läuft nur Desktop */
html.fx-scroll .cine-hero .media .fx-shade{position:absolute;inset:0;z-index:3;background:#04070f;opacity:0;pointer-events:none}

@media (prefers-reduced-motion:reduce){html.fx-scroll .chapter::before{transform:none}}