/* =====================================================
   SCROLL-REVEAL ANIMATIONS — Jakis Promotions
   A single, consistent "fade up" entrance used across every
   homepage section. Kept subtle and quick so it reads as
   polish rather than a gimmick, and reuses the hero's own
   easing curve so the whole site feels like one system.

   .reveal        — base hidden/animated state
   .is-visible    — applied by scroll-reveal.js once the
                    element enters the viewport
   .stagger       — put on a grid/list parent; its direct
                    .reveal children cascade in one after
                    another instead of all at once
   ===================================================== */

.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 700ms var(--ease), transform 700ms var(--ease);
  will-change: opacity, transform;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered cascade for grids/lists of similar items — each
   child fires a little later than the one before it. Covers
   up to 15 items (our largest grid, the gallery preview). */
.stagger > .reveal:nth-child(1)  { transition-delay: 0ms;   }
.stagger > .reveal:nth-child(2)  { transition-delay: 70ms;  }
.stagger > .reveal:nth-child(3)  { transition-delay: 140ms; }
.stagger > .reveal:nth-child(4)  { transition-delay: 210ms; }
.stagger > .reveal:nth-child(5)  { transition-delay: 280ms; }
.stagger > .reveal:nth-child(6)  { transition-delay: 350ms; }
.stagger > .reveal:nth-child(7)  { transition-delay: 420ms; }
.stagger > .reveal:nth-child(8)  { transition-delay: 460ms; }
.stagger > .reveal:nth-child(9)  { transition-delay: 500ms; }
.stagger > .reveal:nth-child(10) { transition-delay: 540ms; }
.stagger > .reveal:nth-child(11) { transition-delay: 580ms; }
.stagger > .reveal:nth-child(12) { transition-delay: 620ms; }
.stagger > .reveal:nth-child(13) { transition-delay: 660ms; }
.stagger > .reveal:nth-child(14) { transition-delay: 700ms; }
.stagger > .reveal:nth-child(15) { transition-delay: 740ms; }

/* The "Our Story" and "Podcast" blocks reveal side-by-side —
   give the second column a small extra delay so they don't
   land in perfect unison, which reads as more natural. */
.story-section .story-content.reveal,
.podcast-section .podcast-content.reveal {
  transition-delay: 140ms;
}

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