/* ============================================================
   ARTISTIK — Système d'apparition
   S'applique à n'importe quel élément via la classe .atk-reveal
   (champ « Classes CSS » d'Elementor, onglet Avancé).

   Principe de cohabitation : ces effets n'écrivent jamais dans
   `transform` ni dans `filter`. Un widget Elementor utilise
   couramment les deux — rotation, ombre portée, flou — et les
   écraser reviendrait à défaire les réglages de la page.
   On passe donc par `translate` et `scale`, propriétés
   indépendantes qui se composent avec `transform` au lieu de le
   remplacer, et on laisse `filter` entièrement tranquille.
   ============================================================ */

/* Rien n'est masqué tant que le script n'a pas confirmé sa présence :
   sans JS, le contenu reste intégralement visible. */
.atk-js .atk-reveal{
  opacity:0;
  translate:0 26px;
  will-change:opacity,translate;
}

/* Variantes de direction — à combiner avec .atk-reveal */
.atk-js .atk-reveal-left{translate:-32px 0}
.atk-js .atk-reveal-right{translate:32px 0}
.atk-js .atk-reveal-up{translate:0 44px}
.atk-js .atk-reveal-zoom{translate:0 0;scale:1.05}
.atk-js .atk-reveal-fade{translate:0 0}

/* Décalages, pour faire entrer plusieurs éléments en cascade */
.atk-d1{--atk-delay:.12s}
.atk-d2{--atk-delay:.24s}
.atk-d3{--atk-delay:.36s}
.atk-d4{--atk-delay:.48s}
.atk-d5{--atk-delay:.60s}
.atk-d6{--atk-delay:.72s}

/* Spécificité plus forte que les variantes ci-dessus, pour que l'état
   d'arrivée les neutralise toutes. */
.atk-js .atk-reveal.is-in{
  opacity:1;
  translate:0 0;
  scale:1;
  transition:
    opacity   .95s cubic-bezier(.22,.61,.36,1),
    translate .95s cubic-bezier(.22,.61,.36,1),
    scale     .95s cubic-bezier(.22,.61,.36,1);
  transition-delay:var(--atk-delay,0s);
}

/* Dévoilement au balayage : un volet qui descend, comme sur les portraits.
   Variante autonome, elle ne dépend pas de .atk-reveal et ne pilote que la
   découpe — opacité, transformations et filtres de l'élément intacts. */
.atk-js .atk-reveal-wipe{
  clip-path:inset(0 0 100% 0);
}
.atk-js .atk-reveal-wipe.is-in{
  clip-path:inset(0 0 0 0);
  transition:clip-path 1.25s cubic-bezier(.76,0,.24,1);
  transition-delay:var(--atk-delay,0s);
}
/* Sens alternatifs du volet. */
.atk-js .atk-reveal-wipe-up{clip-path:inset(100% 0 0 0)}
.atk-js .atk-reveal-wipe-left{clip-path:inset(0 100% 0 0)}
.atk-js .atk-reveal-wipe-right{clip-path:inset(0 0 0 100%)}

/* Une fois arrivé, on relâche la couche de composition. */
.atk-js .atk-reveal.is-done{will-change:auto}

@media (prefers-reduced-motion:reduce){
  .atk-js .atk-reveal,
  .atk-js .atk-reveal.is-in{
    opacity:1;
    translate:0 0;
    scale:1;
    transition:none;
  }
  .atk-js .atk-reveal-wipe,
  .atk-js .atk-reveal-wipe.is-in{
    clip-path:none;
    transition:none;
  }
}