/* Caldiors motion – shared by the home page, journal and articles (driven by /assets/motion.js).
   Everything is keyframe-based so it never overrides an element's own hover transitions,
   and it all switches off for visitors who prefer reduced motion. */
@media (prefers-reduced-motion: no-preference) {
  /* On load: fade up out of a soft blur (.m-d1 … .m-d4 stagger it) */
  .m-rise { animation: m-rise 1.2s var(--ease, cubic-bezier(.2, .7, .1, 1)) backwards; }
  .m-d1 { animation-delay: .15s; } .m-d2 { animation-delay: .3s; }
  .m-d3 { animation-delay: .9s; } .m-d4 { animation-delay: 1.05s; }

  /* Headline: words blur in one after another */
  .js .split:not(.is-split) { opacity: 0; }
  .split .w {
    display: inline-block;
    animation: m-word 1.3s var(--ease, cubic-bezier(.2, .7, .1, 1)) backwards;
    animation-delay: calc(.3s + var(--i) * .07s);
  }

  /* Headings that light up word by word while scrolling */
  .scroll-fill .w { transition: opacity .2s linear; }

  /* On scroll: fade up out of a soft blur (stagger comes from --d) */
  .js .in-view:not(.shown) { opacity: 0; }
  .js .in-view.shown { animation: m-rise 1.2s var(--ease, cubic-bezier(.2, .7, .1, 1)) var(--d, 0s) backwards; }

  /* Images: open from a cropped frame while zooming out */
  .js .m-clip { overflow: hidden; }
  .js .m-clip:not(.shown) { clip-path: inset(12% 10% round 6px); }
  .js .m-clip:not(.shown) img { scale: 1.2; }
  .js .m-clip.shown { animation: m-clip 1.6s var(--ease, cubic-bezier(.2, .7, .1, 1)) var(--d, 0s) backwards; }
  .js .m-clip.shown img { animation: m-unzoom 1.9s var(--ease, cubic-bezier(.2, .7, .1, 1)) var(--d, 0s) backwards; }

  /* Slow zoom while an image scrolls through the viewport (--sp: 0 → 1) */
  .m-zoom img { scale: calc(1.08 - var(--sp, 0) * .08); }

  @keyframes m-rise { from { opacity: 0; translate: 0 40px; filter: blur(6px); } }
  @keyframes m-word { from { opacity: 0; translate: 0 .4em; filter: blur(10px); } }
  @keyframes m-clip { from { clip-path: inset(12% 10% round 6px); } to { clip-path: inset(0% 0% round 0px); } }
  @keyframes m-unzoom { from { scale: 1.2; } }
}