/* =========================================================
   SCROLL REVEAL
   - Applied only via JS (see scroll-reveal.js).
   - .anim-block elements render fully visible by default
     (safe fallback if JS never runs).
   - JS adds .scroll-reveal on mount, then .visible once the
     element crosses the intersection threshold.
   ========================================================= */

.scroll-reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 700ms ease, transform 700ms ease;
  transition-delay: var(--reveal-delay, 0ms);
}

.scroll-reveal.visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .scroll-reveal,
  .scroll-reveal.visible {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* =========================================================
   HOVER, GENERAL
   - Decorative only. anim-block items are not links/buttons.
   - 400ms ease-out, mirrors a Figma "While hovering" +
     Smart Animate (Ease Out, 400ms) interaction.
   ========================================================= */

.anim-block {
  transition: transform 400ms ease-out, box-shadow 400ms ease-out;
}

@media (prefers-reduced-motion: reduce) {
  .anim-block,
  .anim-block:hover {
    transition: none;
    transform: none;
    box-shadow: none;
  }
}