/* ─── Keyframes ─── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(32px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes slideLeft {
  from { opacity: 0; transform: translateX(-40px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes slideRight {
  from { opacity: 0; transform: translateX(40px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.72); }
  to   { opacity: 1; transform: scale(1); }
}

/* ─── Hero entrance (fires on load) ─── */
.hero-welcome { animation: fadeUp 0.7s ease both 0.10s; }
.hero-title   { animation: fadeUp 0.7s ease both 0.25s; }
.hero-church  { animation: fadeUp 0.7s ease both 0.38s; }
.hero-city    { animation: fadeUp 0.7s ease both 0.48s; }
.hero-verse   { animation: fadeUp 0.7s ease both 0.62s; }
.hero-ctas    { animation: fadeUp 0.7s ease both 0.78s; }

/* ─── Scroll-reveal: hidden until JS fires ─── */
[data-anim] { opacity: 0; }