/* Hero video: give the fixed/centred video its own compositing layer so iOS
   Safari paints it as soon as it starts playing (not only after a scroll). */
.top-hero__bg-video {
  -webkit-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  will-change: transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* If the phone blocks autoplay (e.g. iOS Low Power Mode) show the poster frame
   instead of the browser's big "play" triangle; a tap still starts the video. */
.top-hero__bg-video::-webkit-media-controls,
.top-hero__bg-video::-webkit-media-controls-start-playback-button,
.top-hero__bg-video::-webkit-media-controls-overlay-play-button,
.top-hero__bg-video::-webkit-media-controls-panel {
  display: none !important;
  -webkit-appearance: none;
  opacity: 0 !important;
  pointer-events: none;
}

/* Autoplay blocked: hide the <video> (and its native play button), show the
   poster as the background; the first touch un-hides it (see hero-video.js). */
.top-hero__bg-video.is-blocked {
  visibility: hidden;
}
.top-hero__bg.is-blocked-sp {
  background: url("/wp-content/themes/butai-project/img/top/hero-sp-poster.jpg") center / cover no-repeat;
}
.top-hero__bg.is-blocked-pc {
  background: url("/wp-content/themes/butai-project/img/top/hero.jpg") center / cover no-repeat;
}
