/* ═══════════════════════════════════════════════════════
   ANIMATIONS — Oasis Change · Biolume
   Organic keyframes. Real ambient life is driven by the
   --breath/--pulse heartbeat (js/oasis-alive.js); keyframes
   here handle entrances and slow environmental cycles whose
   durations are deliberately incommensurate (6.1s, 7.3s,
   9.7s…) so overlapping loops never visibly sync.
   ═══════════════════════════════════════════════════════ */

/* ── Breathing (cards at rest) ── */
@keyframes breathe {
  0%, 100% { box-shadow: inset 0 1px 0 var(--glass-edge), 0 6px 24px -12px rgba(0,0,0,.5); }
  50% {
    transform: translateY(-2px);
    box-shadow: inset 0 1px 0 var(--glass-edge), 0 14px 44px -14px rgba(0,0,0,.55), 0 0 24px -10px var(--glow-mint);
  }
}
@keyframes breathe-dark {
  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 6px 24px -12px rgba(0,0,0,.55); }
  50% {
    transform: translateY(-2px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 14px 46px -14px rgba(0,0,0,.6), 0 0 26px -10px var(--glow-cyan);
  }
}

/* ── Environmental drift ── */
@keyframes orbDrift {
  0%, 100% { transform: translate(0, 0) scale(1); }
  30% { transform: translate(26px, -18px) scale(1.03); }
  62% { transform: translate(-18px, 24px) scale(.98); }
}

@keyframes scrollGuide {
  0%, 100% { opacity: .4; transform: translateX(-50%) translateY(0); }
  50% { opacity: .8; transform: translateX(-50%) translateY(6px); }
}
@keyframes scrollThumb {
  0% { top: -40%; }
  100% { top: 140%; }
}

@keyframes badgePulse {
  0%, 100% { opacity: 1; transform: scale(1); box-shadow: 0 0 0 0 rgba(110,207,160,.4); }
  50% { opacity: .6; transform: scale(1.25); box-shadow: none; }
}

/* ── Glimmers ── */
@keyframes cardGlimmer {
  from { background-position: 200% 0; }
  to { background-position: -200% 0; }
}
@keyframes splashPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(110,207,160,0); }
  50% { box-shadow: 0 0 0 12px rgba(110,207,160,.07); }
}

/* ── Content entrances ── */
@keyframes postIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes pageExit {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(-30px); }
}
@keyframes pageEnter {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ── Gradient flow ── */
@keyframes gradFlow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ── Breathing ring (impact arcs) ── */
@keyframes breatheRing {
  0%, 100% {
    
    transform: rotate(-90deg) scale(1);
  }
  50% {
    
    transform: rotate(-90deg) scale(1.03);
  }
}
@keyframes arcFillPulse {
  0%, 100% { stroke-dashoffset: 0; opacity: .8; }
  50% { stroke-dashoffset: 30; opacity: 1; }
}

/* ── Slow meander for decorative flecks ── */
@keyframes driftSlow {
  0%, 100% { transform: translate(0, 0); }
  25% { transform: translate(15px, -10px); }
  50% { transform: translate(-10px, 15px); }
  75% { transform: translate(20px, 5px); }
}

/* ── Applied ambient loops (incommensurate periods) ── */
.pillar { animation: breathe 6.1s ease-in-out infinite; }
.pillar:nth-child(2) { animation-delay: -1.5s; }
.pillar:nth-child(3) { animation-delay: -3s; }
.pillar:nth-child(4) { animation-delay: -4.5s; }
.pillar:hover { animation-play-state: paused; }

.blog-card { animation: breathe-dark 7.3s ease-in-out infinite; }
.blog-card:nth-child(2) { animation-delay: -2.3s; }
.blog-card:nth-child(3) { animation-delay: -4.6s; }
.blog-card:hover { animation-play-state: paused; }

.contrib-card { animation: breathe 6.7s ease-in-out infinite; }
.contrib-card:nth-child(2) { animation-delay: -1.6s; }
.contrib-card:nth-child(3) { animation-delay: -3.3s; }
.contrib-card:nth-child(4) { animation-delay: -5s; }
.contrib-card:hover { animation-play-state: paused; }

.stat-card { animation: breathe-dark 5.9s ease-in-out infinite; }
.stat-card:nth-child(2) { animation-delay: -1.4s; }
.stat-card:nth-child(3) { animation-delay: -2.8s; }
.stat-card:nth-child(4) { animation-delay: -4.2s; }
.stat-card:hover { animation-play-state: paused; }

.impact-card { animation: breathe-dark 6.4s ease-in-out infinite; }
.impact-card:nth-child(2) { animation-delay: -1.5s; }
.impact-card:nth-child(3) { animation-delay: -3s; }
.impact-card:nth-child(4) { animation-delay: -4.5s; }
.impact-card:hover { animation-play-state: paused; }

.card-3d:hover { animation-play-state: paused; }

.impact-arc-breathing svg { animation: breatheRing 4.3s ease-in-out infinite; }