/* Wipe Reveal. The photo keeps the site's own size, corners and shadow: this file only adds the mask.
   Speed and strength can be set in SETTINGS, or per photo with --fx-wipe-duration and --fx-wipe-cover. */
.fx-wipe {
  --_duration: var(--fx-wipe-duration, var(--fx-wipe-duration-set, 1100ms));
  --_cover: var(--fx-wipe-cover, var(--fx-wipe-cover-set, 100%));
  transition: clip-path var(--_duration) cubic-bezier(.7, 0, .2, 1);
}
/* Each class clips one side away to begin with */
.fx-wipe-right { clip-path: inset(0 var(--_cover) 0 0); }
.fx-wipe-left { clip-path: inset(0 0 0 var(--_cover)); }
.fx-wipe-bottom { clip-path: inset(0 0 var(--_cover) 0); }
.fx-wipe-top { clip-path: inset(var(--_cover) 0 0 0); }
.fx-wipe.is-in { clip-path: inset(0 0 0 0); }

/* The script does nothing when reduced motion is on; this is a second safety net */
@media (prefers-reduced-motion: reduce) {
  .fx-wipe { clip-path: none !important; transition: none !important; }
}
