/* Same dimensions and crop as the painted background keep every detail anchored. */
.hero-atmosphere {
  position: absolute;
  top: 0;
  left: 50%;
  width: max(100%, 1100px);
  height: 100%;
  transform: translateX(-50%);
  pointer-events: none;
  z-index: 0;
}
.water-shimmer { opacity: .3; animation: oasis-ripple 6s ease-in-out infinite alternate; }
.water-shimmer-second { animation-delay: -3s; animation-duration: 8s; }
@keyframes oasis-ripple {
  from { opacity: .12; transform: translateX(-4px); }
  to { opacity: .4; transform: translateX(5px); }
}
.palm-breeze { transform-origin: 0 0; animation: palm-wind 7s ease-in-out infinite alternate; }
.palm-breeze-late { animation-delay: -4s; animation-duration: 9s; }
@keyframes palm-wind { from { transform: rotate(-1deg); } to { transform: rotate(2deg) skewX(2deg); } }
.camp-flame { transform-origin: 1255px 659px; animation: fire-flicker 2s ease-in-out infinite alternate; }
@keyframes fire-flicker { to { opacity: .7; } }
.camp-smoke { opacity: 0; filter: blur(1.8px); animation: camp-smoke-rise 9s linear infinite; }
.camp-smoke-late { animation-delay: -4.5s; }
@keyframes camp-smoke-rise {
  0% { opacity: 0; transform: translate(0, 3px); }
  30% { opacity: .24; }
  100% { opacity: 0; transform: translate(-17px, -29px); }
}
.camel-cargo {
  transform-origin: 44px 26px;
  animation: luggage-sway var(--gait-duration, 1.3s) ease-in-out var(--gait-delay, 0s) infinite alternate;
}
@keyframes luggage-sway {
  from { transform: rotate(-1.5deg) translateY(-.3px); }
  to { transform: rotate(1.5deg) translateY(.4px); }
}
.caravan-print {
  position: absolute;
  bottom: 1px;
  width: 3px;
  height: 2px;
  border-radius: 45%;
  background: #604323;
  box-shadow: -9px -2px 0 #604323, -18px 1px 0 #604323;
  pointer-events: none;
  animation: print-fade 5s ease-out forwards;
}
.mini-caravan .caravan-print { width: 2px; height: 1px; }
.caravan-print.person-print { width: 4px; height: 2px; }
@keyframes print-fade { from { opacity: .3; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .hero-atmosphere *, .camel-cargo { animation: none !important; }
  .camp-smoke, .caravan-print { display: none; }
}
