/* ==========================================================================
   YELLOWSTONE SOLAR — ANIMATIONS
   Subtle, performant, never over-designed.
   ========================================================================== */

/* Staggered reveal children */
.reveal-group > * { opacity: 0; transform: translateY(26px); transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1); }
.reveal-group.in-view > * { opacity: 1; transform: translateY(0); }
.reveal-group.in-view > *:nth-child(1) { transition-delay: 0s; }
.reveal-group.in-view > *:nth-child(2) { transition-delay: .09s; }
.reveal-group.in-view > *:nth-child(3) { transition-delay: .18s; }
.reveal-group.in-view > *:nth-child(4) { transition-delay: .27s; }
.reveal-group.in-view > *:nth-child(5) { transition-delay: .36s; }
.reveal-group.in-view > *:nth-child(6) { transition-delay: .45s; }

/* Hero entrance */
@keyframes heroFadeUp {
  from { opacity: 0; transform: translateY(34px); }
  to { opacity: 1; transform: translateY(0); }
}
.hero-content > * { animation: heroFadeUp .9s cubic-bezier(.2,.8,.2,1) both; }
.hero-content > *:nth-child(1) { animation-delay: .15s; }
.hero-content > *:nth-child(2) { animation-delay: .3s; }
.hero-content > *:nth-child(3) { animation-delay: .45s; }
.hero-content > *:nth-child(4) { animation-delay: .6s; }

/* Sun pulse in hero */
@keyframes sunGlow {
  0%, 100% { opacity: .8; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.04); }
}
.hero-sun { animation: sunGlow 8s ease-in-out infinite; }

/* Battery charge animation (SVG) */
@keyframes chargeFill {
  from { width: 8%; }
  to { width: 86%; }
}
.battery-fill { animation: chargeFill 3.2s cubic-bezier(.4,0,.2,1) infinite alternate; }

@keyframes energyFlow {
  from { stroke-dashoffset: 60; }
  to { stroke-dashoffset: 0; }
}
.energy-line { stroke-dasharray: 8 8; animation: energyFlow 1.6s linear infinite; }

/* Gold shimmer for premium accents */
@keyframes shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}
.shimmer-text {
  background: linear-gradient(90deg, var(--gold) 20%, var(--gold-light) 40%, var(--gold) 60%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shimmer 5s linear infinite;
}

/* Floating cards (very subtle) */
@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
.float { animation: floatY 6s ease-in-out infinite; }

/* Page transition */
@keyframes pageIn { from { opacity: 0; } to { opacity: 1; } }
body { animation: pageIn .5s ease both; }

@media (prefers-reduced-motion: reduce) {
  .hero-content > *, .hero-sun, .battery-fill, .energy-line, .float, .shimmer-text { animation: none !important; }
  .shimmer-text { -webkit-text-fill-color: var(--gold); }
}