/* =============================================================
   Zenora Consulting — Animations Stylesheet
   Scroll-reveal states + keyframes (JS toggles .is-visible)
   ============================================================= */

/* Base reveal state — elements start hidden, revealed on intersect */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity 0.7s var(--ease),
    transform 0.7s var(--ease);
  will-change: opacity, transform;
}
[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Reveal variants */
[data-reveal="fade"] { transform: none; }
[data-reveal="left"]  { transform: translateX(-40px); }
[data-reveal="right"] { transform: translateX(40px); }
[data-reveal="left"].is-visible,
[data-reveal="right"].is-visible { transform: translateX(0); }
[data-reveal="zoom"] { transform: scale(0.94); }
[data-reveal="zoom"].is-visible { transform: scale(1); }

/* Stagger via inline --delay set on element or nth-child fallback */
[data-reveal][style*="--delay"] { transition-delay: var(--delay); }

/* Stagger helper for grids */
.stagger > * { opacity: 0; transform: translateY(28px); transition: opacity 0.7s var(--ease), transform 0.7s var(--ease); }
.stagger.is-visible > * { opacity: 1; transform: translateY(0); }
.stagger.is-visible > *:nth-child(1) { transition-delay: 0.05s; }
.stagger.is-visible > *:nth-child(2) { transition-delay: 0.13s; }
.stagger.is-visible > *:nth-child(3) { transition-delay: 0.21s; }
.stagger.is-visible > *:nth-child(4) { transition-delay: 0.29s; }
.stagger.is-visible > *:nth-child(5) { transition-delay: 0.37s; }
.stagger.is-visible > *:nth-child(6) { transition-delay: 0.45s; }
.stagger.is-visible > *:nth-child(7) { transition-delay: 0.53s; }
.stagger.is-visible > *:nth-child(8) { transition-delay: 0.61s; }
.stagger.is-visible > *:nth-child(9) { transition-delay: 0.69s; }

/* Image reveal (clip mask) */
.img-reveal { position: relative; overflow: hidden; }
.img-reveal img {
  transform: scale(1.12);
  transition: transform 1.1s var(--ease);
}
.img-reveal::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--color-primary);
  transform: scaleX(1);
  transform-origin: right;
  transition: transform 0.9s var(--ease);
  z-index: 2;
}
.img-reveal.is-visible img { transform: scale(1); }
.img-reveal.is-visible::after { transform: scaleX(0); }

/* Hero entrance (runs on load) */
.hero__content > * {
  opacity: 0;
  transform: translateY(24px);
  animation: heroIn 0.9s var(--ease) forwards;
}
.hero__content > *:nth-child(1) { animation-delay: 0.15s; }
.hero__content > *:nth-child(2) { animation-delay: 0.28s; }
.hero__content > *:nth-child(3) { animation-delay: 0.41s; }
.hero__content > *:nth-child(4) { animation-delay: 0.54s; }
.hero__content > *:nth-child(5) { animation-delay: 0.67s; }

@keyframes heroIn {
  to { opacity: 1; transform: translateY(0); }
}

/* Subtle floating for hero scroll cue already defined in core */

/* Counter numbers get a soft pop when counting completes */
.stat__num.is-counting { color: var(--color-accent); }

/* Nav link underline handled in core; ensure smooth */

/* Reduced motion: neutralize entrance animations */
@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  .stagger > *,
  .hero__content > *,
  .img-reveal img { opacity: 1 !important; transform: none !important; animation: none !important; }
  .img-reveal::after { display: none; }
}