/* lpen-home.css — the ONLY asset the home page ships.
 *
 * §18i made a point of the home page having zero CSS and zero JS, and that is
 * still nearly true: this file exists for one rule that Elementor has no
 * control for. Everything else about the hero video — the loop, the scrim, the
 * poster, the mobile fallback — is expressed in Elementor's own settings and
 * stays editable in the UI.
 *
 * ⚠️ Every selector must contain #lpen-home-hero. lpen-assets/ is enqueued
 * site-wide, so an unanchored rule here repaints every page on the site.
 * build_home.py::assert_anchored() fails the build otherwise.
 */

/* A hero that moves on its own is exactly the thing prefers-reduced-motion is
 * for, and Elementor's background video ignores the setting entirely. Hiding
 * the video container leaves Elementor's own fallback background-image — the
 * poster — painted on the container, with the navy scrim still over it. So the
 * hero degrades to the still frame it was designed around rather than to a
 * hole. Nothing else on the page animates, so this is the whole file.
 *
 * Note this cannot be done by pausing: CSS has no way to stop playback, and
 * display:none does stop it in every current engine. */
@media (prefers-reduced-motion: reduce) {
  #lpen-home-hero .elementor-background-video-container,
  #lpen-home-hero .elementor-background-video-hosted {
    display: none !important;
  }
}

/* Elementor sizes the hosted background video with object-fit only from 3.x
 * onward and drops it on some container/kit combinations, which leaves the
 * video letterboxed inside the hero instead of covering it. Restating it is
 * cheap and makes the crop deterministic. `object-position` biases toward the
 * upper-middle: the speaker and the lit wall are the top third of the frame,
 * and a centred crop on a short viewport pushes them out of shot. */
#lpen-home-hero .elementor-background-video-container,
#lpen-home-hero .elementor-background-video-hosted {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 38%;
}

/* The poster does the same job before the first frame paints and whenever the
 * video is suppressed, so it has to be cropped the same way or the hero shifts
 * the moment playback starts. */
#lpen-home-hero {
  background-size: cover;
  background-position: 50% 38%;
  background-repeat: no-repeat;
}