/* fx.css · reveal/circle, the photograph opens from a small circle · owner: Lizzy East · all rights reserved */

/* Put it on the frame around a photograph. Waiting, the photograph is clipped to a
   point at its centre; arriving, the circle opens like an iris until it clears the
   corners (72% reaches them from the centre of any shape), while the picture
   settles from a touch large. Only the photograph moves: captions never hide. */
[data-fx~="reveal/circle"] { overflow: clip; }
html.fx-armed [data-fx~="reveal/circle"].is-pending img {
  clip-path: circle(0% at 50% 50%);
  scale: var(--fx-reveal-scale, 1.15);
}
html.fx-armed [data-fx~="reveal/circle"].is-in img {
  clip-path: circle(72% at 50% 50%);
  transition: clip-path var(--fx-reveal-dur, 1300ms) var(--fx-reveal-ease, cubic-bezier(0.65, 0, 0.35, 1)), scale calc(var(--fx-reveal-dur, 1300ms) * 1.3) var(--fx-ease);
  transition-delay: calc(var(--fx-delay, 0ms) + var(--fx-i, 0) * var(--fx-stagger));
}