/* ============================================================================
   Scroll-reveal entrance animations — additive presentation layer.
   The hidden state applies ONLY under html.ineko-reveal, which the inline head
   guard adds when IntersectionObserver is supported AND motion is allowed.
   No-JS / reduced-motion / unsupported browsers never get the class -> the page
   renders fully visible and static (identical to before this feature).
   ============================================================================ */

html.ineko-reveal {
  --reveal-distance: 14px;
  --reveal-duration: 0.55s;
  --reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --reveal-step: 65ms;
  --reveal-cap: 6;
}

/* Pre-JS + pre-reveal: hide every direct child of a not-yet-revealed section.
   Applies from first paint so content never flashes before reveal.js tags the
   precise targets. Direct children cover all nested content. */
html.ineko-reveal .post-content .flex-block:not(.is-revealed) > * {
  opacity: 0;
}

/* Precise reveal targets (tagged by reveal.js): start hidden + shifted down. */
html.ineko-reveal .post-content .flex-block .reveal-item {
  opacity: 0;
  transform: translateY(var(--reveal-distance));
  will-change: opacity, transform;
}

/* Opacity-only targets (Isotope/masonry-managed cards): never set transform. */
html.ineko-reveal .post-content .flex-block .reveal-item.reveal-item--fade {
  transform: none;
  will-change: opacity;
}

/* Revealed: animate targets to natural state with a staggered, capped delay. */
html.ineko-reveal .post-content .flex-block.is-revealed .reveal-item {
  opacity: 1;
  transform: none;
  transition:
    opacity var(--reveal-duration) ease,
    transform var(--reveal-duration) var(--reveal-ease);
  transition-delay: calc(min(var(--ri, 0), var(--reveal-cap)) * var(--reveal-step));
  will-change: auto;
}

/* Belt-and-suspenders: honor reduced motion even if the class is present. */
@media (prefers-reduced-motion: reduce) {
  html.ineko-reveal .post-content .flex-block .reveal-item,
  html.ineko-reveal .post-content .flex-block:not(.is-revealed) > * {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}