/* Animations ajoutées par assets/js/animations.js.
   Les classes sr-* ne sont posées que par le JS : sans JS, tout reste visible. */

/* Titres : les lignes montent derrière un masque */
.sr-line {
  display: block;
  overflow: hidden;
  /* marge pour ne pas couper accents et jambages */
  padding: 0.1em 0 0.14em;
  margin: -0.1em 0 -0.14em;
}
.sr-line-in {
  display: block;
  transition: transform 1.15s var(--ease);
}
.sr-lines:not(.sr-in) .sr-line-in {
  transform: translateY(110%);
}

/* Textes et blocs : fondu en montant */
.sr-fade {
  opacity: 0;
  translate: 0 30px;
  transition:
    opacity 0.9s var(--ease) var(--sr-delay, 0ms),
    translate 1.2s var(--ease) var(--sr-delay, 0ms);
}
.sr-fade.sr-in {
  opacity: 1;
  translate: 0 0;
}

/* Images : dévoilement de bas en haut + léger dézoom.
   La forme animée reprend l'angle coupé du cadre (--cut, 0 si aucun) :
   l'image apparaît directement avec son angle, sans saut en fin d'animation. */
.sr-img,
.sr-zoom {
  --sr-scale: 1.12;
  overflow: hidden;
}
.sr-img {
  clip-path: polygon(
    0 100%,
    100% 100%,
    100% 100%,
    calc(100% - var(--cut, 0px)) 100%,
    0 100%
  );
  transition: clip-path 1.3s var(--ease) var(--sr-delay, 0ms);
}
.sr-img img,
.sr-zoom img {
  transition: scale 1.8s var(--ease) var(--sr-delay, 0ms);
}
.sr-img.sr-in,
.sr-zoom.sr-in {
  --sr-scale: 1;
}
.sr-img.sr-in {
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - var(--cut, 0px)),
    calc(100% - var(--cut, 0px)) 100%,
    0 100%
  );
}

/* Survol des images : zoom + suivi de la souris (variables posées par le JS).
   Propriétés scale/translate : indépendantes des transform existants. */
.hz {
  overflow: hidden;
}
.hz img,
.sr-img img,
.sr-zoom img {
  scale: calc(var(--sr-scale, 1) * var(--hz-s, 1));
  translate: var(--hz-x, 0px) var(--hz-y, 0px);
}

/* Animations désactivées (bouton du pied de page ou réglage système) */
.motion-off .sr-fade {
  opacity: 1 !important;
  translate: none !important;
}
.motion-off .sr-img {
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - var(--cut, 0px)),
    calc(100% - var(--cut, 0px)) 100%,
    0 100%
  ) !important;
}
.motion-off .sr-line-in {
  transform: none !important;
}
.motion-off .sr-img,
.motion-off .sr-zoom,
.motion-off .hz {
  --sr-scale: 1 !important;
  --hz-s: 1 !important;
  --hz-x: 0px !important;
  --hz-y: 0px !important;
}
.motion-off .hero-link,
.motion-off .all-work,
.motion-off .contact-links > :not(.contact-logo),
.motion-off .text-link,
.motion-off .filter,
.motion-off .contact h2 a,
.motion-off .play-label {
  translate: none !important;
}