/* Homepage hero reel. Linked after styles.css so it wins.
   Three stills crossfade. Each one slowly scales and drifts so it reads like a locked-off camera, not a video file. */
.hero-media:has(.hero-reel)::before {
  content: none;
  animation: none;
}
.hero-reel {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.8s ease;
}
.hero-slide.is-on {
  opacity: 1;
}
.hero-slide img {
  position: absolute;
  left: -9%;
  top: -9%;
  width: 118%;
  height: 118%;
  max-width: none;
  object-fit: cover;
  filter: saturate(0.86) contrast(1.04);
  transform: scale(1) translate3d(0, 0, 0);
  animation: hero-ken 20s ease-in-out infinite alternate;
  will-change: transform;
}
.hero-slide:nth-child(1) img { object-position: 68% 58%; animation-delay: -2s; }
.hero-slide:nth-child(2) img { object-position: center 46%; animation-delay: -9s; animation-direction: alternate-reverse; }
.hero-slide:nth-child(3) img { object-position: center 62%; animation-delay: -15s; }
@keyframes hero-ken {
  from { transform: scale(1) translate3d(0, 0, 0); }
  to { transform: scale(1.07) translate3d(-2.2%, -1.4%, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slide { transition: none; }
  .hero-slide img { animation: none; }
}