/* hero-bg-fallback.css — Animated gradient for when hero-bg.jpg is not set yet */
/* This file is automatically loaded. Once you place your hero-bg.jpg image,
   the photo will take precedence over this gradient. */

#hero {
  background:
    linear-gradient(160deg, rgba(8,15,28,0.96) 0%, rgba(13,27,46,0.88) 40%, rgba(30,58,95,0.80) 100%),
    linear-gradient(220deg,
      #0D1B2E 0%,
      #152438 25%,
      #1E3A5F 50%,
      #0D1B2E 75%,
      #152438 100%
    );
  background-size: 100% 100%, 400% 400%;
  animation: heroGradientShift 14s ease-in-out infinite alternate;
}

@keyframes heroGradientShift {
  0%   { background-position: 0% 0%,   0% 50%; }
  50%  { background-position: 0% 0%, 100% 50%; }
  100% { background-position: 0% 0%,   0% 50%; }
}