.awp-has-background-media {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.awp-has-background-media > :not(.awp-background-media):not(.awp-group-shape) {
	position: relative;
	z-index: 1;
}

/* Core constrained layouts also constrain direct children. The media layer
   belongs to the owning surface, so it must keep the surface's geometry. */
.awp-has-background-media > .awp-background-media,
.awp-section.awp-has-background-media > .awp-background-media {
	width: auto;
	max-width: none;
	margin-inline: 0;
}

.awp-background-media {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	overflow: hidden;
}

/* Motion supplies the exact parallax travel allowance. Expanding the media
 * plane preserves coverage at both transform extremes without altering the
 * client section or adding a visual mask. */
.awp-has-background-motion--parallax > .awp-background-media {
	inset-block: calc(-1 * var(--awp-motion-parallax-overscan-y, 0px));
}

.awp-background-media__layer,
.awp-background-media__video,
.awp-background-media__playlist,
.awp-background-media__overlay {
	position: absolute;
	inset: 0;
}

.awp-background-media__layer {
	background-repeat: no-repeat;
}

img.awp-background-media__layer,
.awp-background-media__image {
	width: 100%;
	height: 100%;
	display: block;
}

.awp-background-media__video {
	width: 100%;
	height: 100%;
	opacity: 0;
}

.awp-background-media__video--is-visible {
	opacity: 1;
}

.awp-background-media__gallery-layer {
	background-repeat: no-repeat;
	will-change: opacity, transform;
	contain: layout paint style;
	backface-visibility: hidden;
}

.awp-background-media__gallery-layer--standby {
	opacity: 0;
	pointer-events: none;
}

.awp-background-media__gallery-layer--is-visible {
	opacity: 1;
	transition: opacity 0.9s ease-out;
}

.awp-background-media__poster {
	transition: opacity 180ms linear;
}

.awp-has-background-media[data-awp-background-state="video-active"] .awp-background-media__poster {
	opacity: 0;
}

.awp-background-media__overlay {
	z-index: 2;
	background: var(--awp-bg-overlay-background, transparent);
	opacity: var(--awp-bg-overlay-opacity, 0);
	mix-blend-mode: var(--awp-bg-overlay-blend-mode, normal);
	background-repeat: no-repeat;
	background-size: cover;
}

.awp-has-background-media-fixed .awp-background-media__layer--image {
	background-attachment: fixed;
}

/* Gutenberg has no front-end render filter, so the editor uses the same
   attachment, focal point, fit and overlay data on the block wrapper. This
   selector intentionally works inside both iframed and legacy canvases.
   Full `.block-editor-block-list__block` prefix ensures the preview wins
   over any editor-scoped Core resets inside the iframe canvas. */
.block-editor-block-list__block.awp-has-background-media-preview,
.awp-has-background-media-preview {
	position: relative;
	isolation: isolate;
	background-image: var(--awp-bg-preview-image, none);
	background-position: var(--awp-background-media-preview-position, 50% 50%);
	background-repeat: no-repeat;
	background-size: var(--awp-background-media-preview-fit, cover);
}
.block-editor-block-list__block.awp-has-background-media-preview::before,
.awp-has-background-media-preview::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background: var(--awp-bg-overlay-background, transparent);
	opacity: var(--awp-bg-overlay-opacity, 0);
	mix-blend-mode: var(--awp-bg-overlay-blend-mode, normal);
	background-repeat: no-repeat;
	background-size: cover;
}
.block-editor-block-list__block.awp-has-background-media-preview > *,
.awp-has-background-media-preview > * { position: relative; z-index: 1; }

@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
	.awp-has-background-media-fixed .awp-background-media__layer--image {
		background-attachment: scroll !important;
	}
}