/* =============================================================================
   Apparitions au défilement — mêmes effets que les pages « grand format »
   (pages-v2.css), en version autonome pour les pages qui n'utilisent pas
   ce gabarit (Entretien, Dépannage). Classes posées par js/reveal.js ;
   sans script, ou si l'utilisateur préfère limiter les animations, tout
   reste visible normalement.
   ========================================================================== */
:root { --pw-ease: cubic-bezier(.2, .8, .2, 1); }

/* textes, titres, cartes : fondu montant */
.pw-js .pw-reveal {
    opacity: 0;
    transform: translateY(42px);
    transition: opacity .9s ease, transform 1s var(--pw-ease);
    transition-delay: calc(var(--pw-d, 0) * 90ms);
}
.pw-js .pw-reveal.is-in { opacity: 1; transform: none; }

/* photos et vidéos à côté du texte : elles glissent depuis le bord de l'écran */
.pw-js .pw-slide {
    clip-path: inset(-80px -80px -80px 100%);
    transform: translateX(60px);
    opacity: .2;
    transition: clip-path 1.2s var(--pw-ease), transform 1.2s var(--pw-ease), opacity .8s ease;
}
.pw-js .pw-slide.pw-from-left { clip-path: inset(-80px 100% -80px -80px); transform: translateX(-60px); }
.pw-js .pw-slide.is-in { clip-path: inset(-80px -80px -80px -80px); transform: none; opacity: 1; }

@media (prefers-reduced-motion: reduce) {
    .pw-js .pw-reveal, .pw-js .pw-slide { opacity: 1; transform: none; clip-path: none; transition: none; }
}
