/* ============================================================
   TCA WEBSITE — SHARED SCROLL-REVEAL ("AOS-lite")
   A small, dependency-free alternative to the AOS library, built
   to match this codebase's existing IntersectionObserver pattern
   (see main.js .fade-up). Unlike .fade-up (fires once, stays
   visible), elements with [data-aos] toggle back to hidden when
   scrolled out of view, then reveal again — matching the "fade
   in and out" behavior requested for the soar/about sections.

   Usage:
     <div data-aos="fade-up">...</div>
     <div data-aos="zoom-in" style="transition-delay:150ms">...</div>
   ============================================================ */

[data-aos] {
  opacity: 0;
  transition: opacity 0.7s cubic-bezier(0.22, 0.61, 0.36, 1),
              transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: opacity, transform;
}

[data-aos="fade-up"]    { transform: translateY(32px); }
[data-aos="fade-down"]  { transform: translateY(-32px); }
[data-aos="fade-left"]  { transform: translateX(32px); }
[data-aos="fade-right"] { transform: translateX(-32px); }
[data-aos="zoom-in"]    { transform: scale(0.92); }
[data-aos="fade-in"]    { transform: none; }

[data-aos].aos-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  [data-aos] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
