/* Variante „Modern“ – nur aktiv mit html.fx. Ohne JS/bei reduzierter Bewegung bleibt alles sichtbar. */

/* Bis fx.js die Startzustände gesetzt hat, animierte Elemente verstecken (kein Aufblitzen) */
.fx-pending [data-reveal],
.fx-pending [data-reveal-img],
.fx-pending [data-split],
.fx-pending [data-split-lines],
.fx-pending #intro-logo,
.fx-pending .card { opacity: 0; }

.fx .label::after { transform: scaleX(var(--draw, 1)); }

/* Wörter für Headline-Reveals */
.fx .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.fx .wi { display: inline-block; will-change: transform; }
.fx [data-split-lines] .wl { transition: none; }

/* Bild-Reveals */
.fx [data-reveal-img] { overflow: hidden; }
.fx [data-reveal-img] img { will-change: transform; }

/* Karten: etwas mehr Tiefe beim Hover */
.fx .card__img img { transition: transform 1s var(--ease), filter .5s; }
.fx .card:hover .card__img img { transform: scale(1.06); }
.fx .card__title { transition: color .3s; }
.fx .card:hover .card__title { color: var(--accent-ink); }

/* Buttons: feiner Schimmer */
.fx .btn { position: relative; overflow: hidden; }
.fx .btn::before {
  content: ""; position: absolute; inset: 0; transform: translateX(-120%);
  background: linear-gradient(100deg, transparent 20%, rgba(255,255,255,.55) 50%, transparent 80%);
  transition: transform .8s var(--ease);
}
.fx .btn:hover::before { transform: translateX(120%); }

/* Seitenübergang */
.fx-curtain { position: fixed; inset: 0; z-index: 100; background: var(--bg); pointer-events: none; }
.fx-curtain::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--accent); transform: scaleX(var(--p, 0)); transform-origin: left; }

/* Sanftes Scrollen (Lenis) */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }