/* ── AURORA BASE ─────────────────────────────────────────────── */
.aurora { will-change: transform; }

/* ── SCROLL REVEAL ───────────────────────────────────────────── */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .65s ease, transform .65s ease; }
.reveal.visible { opacity: 1; transform: none; }
.reveal-delay-1 { transition-delay: .1s; }
.reveal-delay-2 { transition-delay: .2s; }
.reveal-delay-3 { transition-delay: .3s; }
.reveal-delay-4 { transition-delay: .4s; }
.reveal-delay-5 { transition-delay: .5s; }

/* ── KEYFRAMES ───────────────────────────────────────────────── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes aurora1 {
  0%, 100% { transform: translateX(-30%) scaleY(1) rotate(-6deg); }
  50%       { transform: translateX(10%) scaleY(1.18) rotate(-3deg); }
}
@keyframes aurora2 {
  0%, 100% { transform: translateX(20%) scaleY(0.9) rotate(5deg); }
  50%       { transform: translateX(-10%) scaleY(1.12) rotate(2deg); }
}
@keyframes aurora3 {
  0%, 100% { transform: translateX(-10%) scaleY(1.05) rotate(2deg); }
  50%       { transform: translateX(20%) scaleY(0.88) rotate(-4deg); }
}

@keyframes ping2 {
  0%, 100% { transform: scale(1);    opacity: 1; }
  50%       { transform: scale(1.18); opacity: .5; }
}

@keyframes countUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}

@keyframes shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position:  200% 0; }
}

@keyframes shake {
  0%, 100% { transform: translateX(0); }
  20%       { transform: translateX(-6px); }
  40%       { transform: translateX(6px); }
  60%       { transform: translateX(-4px); }
  80%       { transform: translateX(4px); }
}

/* ── SKELETON LOADING STATE — used by newsletter.html and the homepage
   "Latest from ACBHC" widget while posts are being fetched from Sanity ── */
.skeleton-block, .skeleton-line {
  background: linear-gradient(90deg, #EDE8E3 25%, #F5F1EC 37%, #EDE8E3 63%);
  background-size: 400% 100%;
  animation: shimmer 1.6s ease infinite;
  border-radius: 6px;
}
.skeleton-block { border-radius: 0; }
.skeleton-line { height: 13px; }

/* ── REDUCED MOTION ─────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .aurora, .hero-badge::before, .scroll-dot, .skeleton-block, .skeleton-line { animation: none !important; }
  .reveal, .reveal.visible { opacity: 1; transform: none; transition: none; }
}
