/*!
 * Based on Sakura.js (MIT) — https://github.com/jhammann/sakura
 * Adapted for section-scoped hero atmosphere
 */
@keyframes sakura-fall {
  0% { opacity: .92; top: -8%; }
  100% { opacity: .18; top: 108%; }
}
@keyframes sakura-blow-soft-left {
  0% { margin-left: 0; }
  100% { margin-left: -42%; }
}
@keyframes sakura-blow-medium-left {
  0% { margin-left: 0; }
  100% { margin-left: -78%; }
}
@keyframes sakura-blow-soft-right {
  0% { margin-left: 0; }
  100% { margin-left: 42%; }
}
@keyframes sakura-blow-medium-right {
  0% { margin-left: 0; }
  100% { margin-left: 78%; }
}
@keyframes sakura-sway-0 {
  0% { transform: rotate(-8deg); }
  45% { transform: rotate(26deg); }
  100% { transform: rotate(4deg); }
}
@keyframes sakura-sway-1 {
  0% { transform: rotate(8deg); }
  45% { transform: rotate(40deg); }
  100% { transform: rotate(12deg); }
}
@keyframes sakura-sway-2 {
  0% { transform: rotate(16deg); }
  45% { transform: rotate(52deg); }
  100% { transform: rotate(20deg); }
}
@keyframes sakura-sway-3 {
  0% { transform: rotate(28deg); }
  45% { transform: rotate(70deg); }
  100% { transform: rotate(34deg); }
}
@keyframes sakura-sway-4 {
  0% { transform: rotate(42deg); }
  45% { transform: rotate(64deg); }
  100% { transform: rotate(24deg); }
}
@keyframes sakura-sway-5 {
  0% { transform: rotate(52deg); }
  45% { transform: rotate(78deg); }
  100% { transform: rotate(38deg); }
}

.hero-petal {
  pointer-events: none;
  position: absolute;
  z-index: 1;
  will-change: transform, top, margin-left;
  filter: drop-shadow(0 2px 4px rgba(178, 90, 110, .12));
}