/* ==========================================================================
   Shared scroll "appear" animation — Customer Stories listing + detail pages

   Same mechanism and timings as intergration.php so every page feels alike:
   a plain fade + rise, no blur or scale.

   The hidden state is gated on html.js-reveal, which js/cs-reveal.js adds
   before first paint. With JS disabled or broken the class never lands and
   the content simply stays visible.
   ========================================================================== */

/* lead elements — hero lines, CTA banner, section blocks: longer travel */
html.js-reveal .cs-reveal--lead {
  opacity: 0;
  transform: translateY(38px);
  will-change: opacity, transform;
  transition: opacity .7s ease,
              transform .8s cubic-bezier(.16, .8, .3, 1);
}

/* cells — cards, list items: shorter, quicker */
html.js-reveal .cs-reveal {
  opacity: 0;
  transform: translateY(26px);
  will-change: opacity, transform;
  transition: opacity .55s ease,
              transform .6s cubic-bezier(.16, .8, .3, 1);
}

html.js-reveal .cs-reveal.is-in,
html.js-reveal .cs-reveal--lead.is-in {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {

  html.js-reveal .cs-reveal,
  html.js-reveal .cs-reveal--lead {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}