﻿/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•
   SCROLL REVEAL â€” lightweight intersection-based animations
   Classes: .reveal (fade up) Â· .reveal-left Â· .reveal-right
   Add data-delay="1|2|3" for 100/200/300 ms stagger offsets
   â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */
.reveal,
.reveal-left,
.reveal-right {
  opacity: 0;
  transition: opacity 0.65s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.65s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: opacity, transform;
}

.reveal         { transform: translateY(28px); }
.reveal-left    { transform: translateX(-44px); }
.reveal-right   { transform: translateX(44px); }

.reveal.is-visible,
.reveal-left.is-visible,
.reveal-right.is-visible {
  opacity: 1;
  transform: none;
}

/* Stagger delay helpers (data-delay="1" â†’ 120ms, "2" â†’ 240ms, "3" â†’ 360ms) */
.reveal[data-delay="1"],
.reveal-left[data-delay="1"],
.reveal-right[data-delay="1"] { transition-delay: 120ms; }

.reveal[data-delay="2"],
.reveal-left[data-delay="2"],
.reveal-right[data-delay="2"] { transition-delay: 240ms; }

.reveal[data-delay="3"],
.reveal-left[data-delay="3"],
.reveal-right[data-delay="3"] { transition-delay: 360ms; }

/* Honour reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal-left,
  .reveal-right {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
/* â”€â”€ End Scroll Reveal â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */

/* â”€â”€ Reveal: restore interactive transitions after entry animation â”€â”€
   Once .is-visible fires the entry, any card with hover effects must
   switch back to its own hover-specific transition so on/off works. */
.program-card.is-visible {
  /* Reset stagger delay so hover feels instant after entry, but keep
     the full transition list (incl. opacity/transform) intact for the
     initial reveal animation to play correctly. */
  transition-delay: 0s;
}

.news-card.is-visible {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  transition-delay: 0s;
}
/* â”€â”€ End reveal interactive overrides â”€â”€â”€â”€ */

