/* ==========================================================================
   SOJOURN HOUSE — Animations
   Subtle, performance-friendly effects. All respect prefers-reduced-motion
   (see responsive.css) via the IntersectionObserver in js/main.js.
   ========================================================================== */

/* Scroll reveal (activated by .js-reveal on <html>, set in main.js) */
.js-reveal .reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .7s cubic-bezier(.22, .61, .36, 1), transform .7s cubic-bezier(.22, .61, .36, 1);
  transition-delay: var(--reveal-delay, 0s);
  will-change: opacity, transform;
}
.js-reveal .reveal.in-view { opacity: 1; transform: none; }

/* Stagger children of grids */
.js-reveal [data-stagger] > * {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .65s cubic-bezier(.22, .61, .36, 1), transform .65s cubic-bezier(.22, .61, .36, 1);
}
.js-reveal [data-stagger].in-view > * { opacity: 1; transform: none; }
.js-reveal [data-stagger].in-view > *:nth-child(1) { transition-delay: .0s; }
.js-reveal [data-stagger].in-view > *:nth-child(2) { transition-delay: .08s; }
.js-reveal [data-stagger].in-view > *:nth-child(3) { transition-delay: .16s; }
.js-reveal [data-stagger].in-view > *:nth-child(4) { transition-delay: .24s; }
.js-reveal [data-stagger].in-view > *:nth-child(5) { transition-delay: .32s; }
.js-reveal [data-stagger].in-view > *:nth-child(6) { transition-delay: .40s; }
.js-reveal [data-stagger].in-view > *:nth-child(7) { transition-delay: .48s; }
.js-reveal [data-stagger].in-view > *:nth-child(8) { transition-delay: .56s; }
.js-reveal [data-stagger].in-view > *:nth-child(n+9) { transition-delay: .6s; }

/* Hero entrance */
.js-reveal .hero-content > * {
  opacity: 0;
  transform: translateY(22px);
  animation: heroUp .8s cubic-bezier(.22, .61, .36, 1) forwards;
}
.js-reveal .hero-content > *:nth-child(1) { animation-delay: .05s; }
.js-reveal .hero-content > *:nth-child(2) { animation-delay: .15s; }
.js-reveal .hero-content > *:nth-child(3) { animation-delay: .25s; }
.js-reveal .hero-content > *:nth-child(4) { animation-delay: .35s; }
@keyframes heroUp { to { opacity: 1; transform: none; } }

/* Counter tick (added while counting) */
.impact-num.counting { text-shadow: 0 0 0 rgba(245, 185, 66, .4); }

/* Dropdown / mobile-nav micro-motion handled in style.css transitions */

/* Card hover lift easing (kept here so it is easy to tune globally) */
.icon-card, .photo-card, .donate-card, .logo-card, .resource-item {
  will-change: transform;
}

/* Gallery item enter when filtered */
.g-item.filter-in { animation: gIn .4s ease both; }
@keyframes gIn {
  from { opacity: 0; transform: scale(.96); }
  to { opacity: 1; transform: none; }
}

/* Gold underline sweep for inline text links inside prose */
.prose a:not(.btn) {
  background-image: linear-gradient(var(--gold), var(--gold));
  background-repeat: no-repeat;
  background-size: 100% 2px;
  background-position: 0 100%;
  transition: background-size .2s ease;
}
.prose a:not(.btn):hover { background-size: 100% 100%; color: #fff; }

/* Back-to-top pulse once visible */
.back-to-top.show { animation: bttIn .35s ease; }
@keyframes bttIn {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Print & no-JS safety: never hide content */
@media print {
  .js-reveal .reveal, .js-reveal [data-stagger] > *, .js-reveal .hero-content > * {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}

/* Lightbox image fade between slides */
.lightbox .lb-stage img.lb-switching { opacity: 0; transform: scale(.985); }
.lightbox .lb-stage img { transition: opacity .18s ease, transform .18s ease; }
