/* ==========================================================================
   Willow Design — Animation Keyframes
   (GSAP handles scroll/entrance choreography; these are ambient CSS loops)
   ========================================================================== */

@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-14px); }
}
.float { animation: floatY 5s ease-in-out infinite; }
.float-slow { animation: floatY 7.5s ease-in-out infinite; }
.float-delay { animation-delay: 1.2s; }
.float-delay-2 { animation-delay: 2.4s; }

@keyframes leafSway {
  0%, 100% { transform: rotate(-4deg) translateY(0); }
  50% { transform: rotate(4deg) translateY(-6px); }
}
.sway { animation: leafSway 4s ease-in-out infinite; transform-origin: top center; }

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(87,204,153,0.35); }
  50% { box-shadow: 0 0 0 14px rgba(87,204,153,0); }
}
.pulse-glow { animation: pulseGlow 2.4s ease-out infinite; }

@keyframes spinSlow {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.spin-slow { animation: spinSlow 18s linear infinite; }

/* Reveal helpers targeted by GSAP (initial state before JS runs) */
.reveal-up { opacity: 0; transform: translateY(40px); }
.reveal-right { opacity: 0; transform: translateX(-40px); }
.reveal-left { opacity: 0; transform: translateX(40px); }
.reveal-scale { opacity: 0; transform: scale(0.92); }
.js-ready .reveal-up,
.js-ready .reveal-right,
.js-ready .reveal-left,
.js-ready .reveal-scale { opacity: 1; transform: none; } /* fallback if JS/GSAP fails to load */

/* Page load veil */
.page-veil {
  position: fixed; inset: 0; z-index: 9999;
  background: var(--gradient-hero);
  display: flex; align-items: center; justify-content: center;
}
.page-veil svg { width: 90px; height: 90px; }
.page-veil .veil-leaf { transform-origin: center; animation: veilSpin 1.1s ease-in-out infinite; }
@keyframes veilSpin { 0%, 100% { transform: scale(0.85) rotate(0deg); opacity: 0.6; } 50% { transform: scale(1.05) rotate(180deg); opacity: 1; } }