/* Shared Home/review Hero: retain the approved crop, overlay and layout. */
.hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 66% center;
  opacity: 0;
  /* The still is this video's first frame. Swap on a decoded frame, without
     crossfading moving lines over a stationary copy. */
  transition: none;
}
.hero[data-video-visible="true"] .hero__video { opacity: 1; }
.hero[data-video-state="pending"] .hero__img,
.hero[data-video-state="loading"] .hero__img,
.hero[data-video-state="decoding"] .hero__img,
.hero[data-video-state="ready"] .hero__img,
.hero[data-video-visible="true"] .hero__img {
  /* Keep the first paint and decoded opening frame aligned, before JS too.
     Image-only fallbacks retain the established Ken Burns animation. */
  animation: none;
  transform: none;
}
.hero[data-video-visible="true"] .hero__img,
.hero[data-motion-paused="true"] .hero__img { animation-play-state: paused; }
.hero-review { padding: 24px var(--content-pad); background: var(--paper); border-bottom: 1px solid rgba(0, 0, 0, 0.06); }
.hero-review__inner { max-width: var(--content-max); margin: 0 auto; }
.hero-review p + p { margin-top: 8px; }
.hero-review__controls { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.hero-review__controls[hidden] { display: none; }
.hero-review button:disabled { opacity: 0.55; cursor: default; }
body.reduced-motion .hero__video { display: none; transition: none; }
@media (prefers-reduced-motion: reduce) {
  body:not(.hero-motion-forced) .hero__img { animation: none; transform: none; }
  body:not(.hero-motion-forced) .hero__video { display: none; transition: none; }
}
@media print { .hero__video, .hero-review { display: none; } }