.standout-hero {
	overflow-x: hidden;

	&.side-spacing {
		margin-inline: var(--content-margin);
	}

	&.has-bg > * > .standout-block-inner {
		display: grid;
		grid-template-columns: 100%;
	}

	&.has-bg > * > * > .standout-block-background-deco,
	&.has-bg > * > * > .acf-innerblocks-container {
		grid-column: 1 / -1;
		grid-row: 1 / -1;
	}

	&.has-bg > * > * > .standout-block-background-deco {
		position: relative;
        left: 50%;
        width: 100vw;
        transform: translateX(-50%);
	}

	&.has-bg-img > * > * > .acf-innerblocks-container,
	&.has-bg-video > * > * > .acf-innerblocks-container,
	&.has-bg-iframe > * > * > .acf-innerblocks-container {
		padding: var(--gap-m) var(--content-margin);
		z-index: 1;
	}

	& > * > * > .standout-block-background-deco {
		display: flex;
		align-items: var(--bg-align-vertical);
		justify-content: var(--bg-align-horizontal);
		height: 0;
		min-height: 100%;
		line-height: 0;
		overflow: hidden;

		& > .standout-block-background-deco-element {
			width: auto;
			max-width: none;
			min-width: 100%;
			height: auto;
			max-height: none;
			min-height: 100%;
			object-fit: cover;
			pointer-events: none;
		}
	}

	&.has-bg-iframe > * > * > .standout-block-background-deco > .standout-block-background-deco-element {
		position: relative;
		height: 100%;
		overflow: hidden;

		& iframe {
			position: absolute;
			top: 50%;
			left: 50%;
			width: auto;
			min-width: calc(100% + 4px);
			max-width: none;
			height: auto;
			min-height: 100%;
			max-height: none;
			aspect-ratio: 16 / 9;
			transform: translateX(-50%) translateY(-50%);
		}
	}

	&.has-bg-iframe[data-bg-min-height="img"] > * > * > .standout-block-background-deco > .standout-block-background-deco-element {
		height: 100vh;
	}

	&[data-bg-min-height="img"] > * > * > .standout-block-background-deco {
		height: auto;

		& > .standout-block-background-deco-element {
			height: calc(100vh - var(--header-actual-height, 0px) - var(--wp-admin--admin-bar--height, 0px));

			@media only screen and (max-width: 767px) {
				:is(.mobile-height-of-text) & {
					height: 50vh;
				}
			}
		}
	}

	&[data-bg-min-height="img"] > * > * > .acf-innerblocks-container {
		align-self: center;

		& > p {
			margin-inline: 0;
		}
	}


	&.has-bg {
		padding-inline: var(--content-margin);

		& .standout-max-container {
			/* max-width: unset; */
		}
		
		& .acf-innerblocks-container {
			padding-inline: 0;
			min-height: var(--bg-max-size, 100svh);

			:is(.standout-hero:first-of-type) & {
				min-height: var(--bg-max-size, calc(100svh - var(--header-height)));

				@media only screen and (max-width: 767px) {
					:is(.mobile-height-of-text) & {
						min-height: 50vh;
					}
				}
			}
		}

		& .standout-block-background-deco {
			position: relative;

			&::after {
				inset: 0;
				content: '';
				position: absolute;
				background: rgba(0, 0, 0, 0.30);
			}
		}
	}
	
	& .acf-innerblocks-container {
		display: flex;
		flex-direction: column;
		justify-content: center;

		& .wp-block-image.size-full > img {
			width: 100%;
		}
	}
}