/*
 * Both gates below are additive safety nets, not behavior changes:
 * - prefers-reduced-motion: a visitor with that OS setting just sees
 *   content normally, with no hidden state waiting on a scroll that
 *   may never come.
 * - .js-scroll-ready: added by scroll-animations.js itself, so if that
 *   script ever fails to load or run, nothing here ever matches and
 *   content stays at its default visible state instead of getting
 *   stuck invisible.
 */
@media (prefers-reduced-motion: no-preference) {
  .js-scroll-ready .entry-content > div {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
  }

  .js-scroll-ready .entry-content > div.visible, .js-scroll-ready .entry-content > div:first-child {
    opacity: 1;
    transform: translateY(0);
  }
  /* First child uses a keyframe animation on load instead */
  .js-scroll-ready .entry-content > div:first-child > *:first-child {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeSlideUp 0.6s ease 0.2s forwards;
  }

  @keyframes fadeSlideUp {
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}