/* Homepage hero (wp_block 19, .cmp-home-hero) — video-ready cover.
 *
 * The hero is a stock core/cover. Today it carries a JPG; the content team can
 * swap that for an MP4 (select the Cover > Replace in the toolbar) or a
 * YouTube/Vimeo link and core takes care of the <video> / <iframe>. Three
 * pieces in the theme make that swap safe without anyone touching code:
 *
 *   - functions.php  cmp_cover_video_poster() lifts the video attachment's
 *                    Featured Image onto the <video> as its poster.
 *   - cmp-interactive.js  initCoverVideos() leaves the video paused on its
 *                    poster for prefers-reduced-motion / Save-Data visitors and
 *                    pauses it while the hero is scrolled off screen.
 *   - this file      the little that CSS has to add on top of core.
 */

/* Solid navy behind the media so the frame never flashes white while a video
 * (or the JPG) is still streaming in. Overlay dim sits on top as before. */
.wp-block-cover.cmp-home-hero {
	background-color: var(--wp--preset--color--theme-02);
}

/* A paused, never-autoplayed <video> is what reduced-motion visitors get
 * (class set by cmp-interactive.js). iOS Safari paints a play glyph over any
 * paused inline video; hide it — this is a backdrop, not a player. */
.wp-block-cover.is-video-still video.wp-block-cover__video-background {
	pointer-events: none;
}

.wp-block-cover.is-video-still video.wp-block-cover__video-background::-webkit-media-controls,
.wp-block-cover.is-video-still video.wp-block-cover__video-background::-webkit-media-controls-start-playback-button {
	display: none !important;
	-webkit-appearance: none;
}