/**
 * FachTap · Scroll-Reveal Base-Styles
 *
 * Wird zusammen mit /js/scroll-reveal.js verwendet.
 * Apple's ease-out-expo für cinematic feel.
 */

:root {
  --reveal-duration:  900ms;
  --reveal-duration-lg: 1100ms;
  --reveal-ease: cubic-bezier(0.16, 1, 0.3, 1); /* ease-out-expo */
}

/* ── Basis: unsichtbar, leicht nach unten verschoben ─────── */
[data-reveal],
[data-reveal-group] {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  transition:
    opacity var(--reveal-duration) var(--reveal-ease),
    transform var(--reveal-duration) var(--reveal-ease);
  will-change: opacity, transform;
}

/* Größere Verschiebung + längere Dauer (dramatischer) */
[data-reveal="up-lg"] {
  transform: translate3d(0, 48px, 0);
  transition-duration: var(--reveal-duration-lg);
}

/* Nur Opacity (für Bilder / große Blöcke) */
[data-reveal="fade"] {
  transform: none;
}

/* Von rechts (für Karten, Chips) */
[data-reveal="right"] {
  transform: translate3d(24px, 0, 0);
}

/* Von links */
[data-reveal="left"] {
  transform: translate3d(-24px, 0, 0);
}

/* Skaliert leicht rein (für Hero-Elemente) */
[data-reveal="scale"] {
  transform: translate3d(0, 24px, 0) scale(0.96);
}

/* ── Sichtbar-Zustand: eingerastet ─────────────────────── */
.is-revealed[data-reveal],
.is-revealed[data-reveal-group],
[data-reveal].is-revealed,
[data-reveal-group].is-revealed {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

/* ── Editorial Blur-In: Text unscharf → scharf (Loro-Piana-Feel) ── */
[data-reveal="blur"] {
  filter: blur(8px);
  transform: translate3d(0, 12px, 0);
  transition:
    opacity var(--reveal-duration) var(--reveal-ease),
    transform var(--reveal-duration) var(--reveal-ease),
    filter var(--reveal-duration) var(--reveal-ease);
}
[data-reveal="blur"].is-revealed {
  filter: blur(0);
}

/* ── Mask-Reveal: Bild wird von oben nach unten aufgezogen ── */
[data-reveal="mask"] {
  clip-path: inset(0 0 100% 0);
  transform: none;
  transition:
    opacity 1200ms var(--reveal-ease),
    clip-path 1200ms var(--reveal-ease);
}
[data-reveal="mask"].is-revealed {
  clip-path: inset(0 0 0 0);
}

/* ── Zoom-In-Reveal für Bilder: subtiler 1.06 → 1.0 Zoom ── */
[data-reveal="zoom"] {
  transform: scale(1.06);
  transition:
    opacity 1400ms var(--reveal-ease),
    transform 1400ms var(--reveal-ease);
}
[data-reveal="zoom"].is-revealed {
  transform: scale(1);
}

/* Cleanup after animation (perf) */
[data-reveal].is-revealed,
[data-reveal-group].is-revealed {
  will-change: auto;
}

/* ── Reduced-Motion: sofort sichtbar ─────────────────────── */
@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  [data-reveal-group] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}