/* ============================================================================
   REVEAL HARMONY — the single entrance used by reveal-harmony.js.

   .rv        a block waiting to arrive (rise + fade + sharpen)
   .rvf       a decorative piece waiting to arrive (fade only)
   .rv-in     arriving

   The !important flags are there because each section ships its own entrance
   rules with their own delays and higher specificity; this has to win over all
   of them while a block is arriving. Both classes are removed by the script as
   soon as the block has landed, so nothing here outlives the entrance and no
   hover or tap transition is affected afterwards.
   ============================================================================ */
@media (prefers-reduced-motion: no-preference) {
  .rv {
    opacity: 0 !important;
    transform: translateY(18px) !important;
    filter: blur(4px) !important;
    transition: none !important;
    animation: none !important;
  }
  .rv.rv-in {
    opacity: 1 !important;
    transform: none !important;
    filter: blur(0) !important;
    transition:
      opacity 700ms cubic-bezier(.22, .61, .36, 1) var(--rv-delay, 0ms),
      transform 800ms cubic-bezier(.22, .61, .36, 1) var(--rv-delay, 0ms),
      filter 700ms cubic-bezier(.22, .61, .36, 1) var(--rv-delay, 0ms) !important;
  }

  /* Fade only: for pieces that carry their own transform. */
  .rvf {
    opacity: 0 !important;
    transition: none !important;
  }
  .rvf.rv-in {
    opacity: 1 !important;
    transition: opacity 900ms cubic-bezier(.22, .61, .36, 1) var(--rv-delay, 0ms) !important;
  }
}
