/* ══════════════════════════════════════════════════ *
 * MARK: Bild / Text
 * ────────────────────────────────────────────────── */
/* #═#═#═#═#═# Media Columns #═#═#═#═#═# */
/**
 * Template: Zweispaltig
 * Kategorie: Bild / Text
 */
.cvh--multi-columns__block {
	--_multi-columns--min-gap: var(--cvh-col-gap-xs);
	--_multi-columns--gap: max(calc(var(--cvh-col-gap) / 2), var(--_multi-columns--min-gap));

	& .cvh--multi-columns__item {
		container: multi-columns / inline-size;

		& .cvh--multi-columns__subgrid {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			column-gap: var(--_multi-columns--gap);
			row-gap: var(--cvh-space-m, 3.5rem);

			@container (width < 450px) {
				grid-template-columns: 1fr;

				& .cvh--multi-columns__media {
					max-height: calc(100cqw / 16 * 9);
				}
			}
		}
	}
}


/* #═#═#═#═#═# Media Fullwide #═#═#═#═#═# */
/*
 * Template: Volle Breite
 * Kategorie: Bild / Text
 */
.cvh--media-underlay__root {
	--_media-layer__base-width: var(--cvh-col-width-50);

	position: relative;
	isolation: isolate;

	& .cvh--media-underlay__layer {
		position: absolute;
		inset-block: 0;
		z-index: -5;
		width: 100%;
		max-width: var(--_media-layer__base-width);
		--obj-fit: cover;

		& > * {
			height: 100%;
			width: 100%;
		}


		/* +──── Modefier ────+ */
		&.layer--left {
			left: 0;
		}

		&.layer--right {
			right: 0;
		}

		&.layer--pad {
			max-width: calc(var(--_media-layer__base-width) + var(--cvh-col-gap, var(--cvh-col-gap-m)));
		}

		&.layer--darken::after {
			content: '\0A';
			position: absolute;
			inset: 0;
			background-color: rgba(0, 0, 0, 0.3);
			z-index: 15;
		}
	}


	/* #════ Admin Area ════# */
	body.wp-admin .editor-visual-editor & .cvh--media-underlay__layer {
		position: static !important;
		max-width: unset !important;
	}
}

.cvh--media-fullwide__block .cvh--media-fullwide__grid {
	& > .cvh--media-fullwide__item:first-child .cvh--media-underlay__layer {
		left: 0;
	}

	& > .cvh--media-fullwide__item:last-child .cvh--media-underlay__layer {
		right: 0;
	}

	/* +──── Grid Sizes ────+ */
		/* Thirds */
	&[data-flex-ratio="1/2"] > .cvh--media-fullwide__item:first-child,
	&[data-flex-ratio="2/1"] > .cvh--media-fullwide__item:last-child {
		--_media-layer__base-width: calc(var(--cvh-col-width-33) + (var(--cvh-col-gap) / 2));
	}

	&[data-flex-ratio="1/2"] > .cvh--media-fullwide__item:last-child,
	&[data-flex-ratio="2/1"] > .cvh--media-fullwide__item:first-child {
		--_media-layer__base-width: calc(var(--cvh-col-width-66) - (var(--cvh-col-gap) / 2));
	}

		/* Quaters */
	&[data-flex-ratio="1/3"] > .cvh--media-fullwide__item:first-child,
	&[data-flex-ratio="3/1"] > .cvh--media-fullwide__item:last-child {
		--_media-layer__base-width: calc(var(--cvh-col-width-25) + (var(--cvh-col-gap) / 2));
	}

	&[data-flex-ratio="1/3"] > .cvh--media-fullwide__item:last-child,
	&[data-flex-ratio="3/1"] > .cvh--media-fullwide__item:first-child {
		--_media-layer__base-width: calc(var(--cvh-col-width-75) - (var(--cvh-col-gap) / 2));
	}
}


	/* #════ Breakpoints ════# */
@media screen and (width < 1200px) {
	.cvh--break-xl .cvh--media-underlay__layer {
		position: static;
		max-width: unset;
	}
}

@media screen and (width < 992px) {
	.cvh--break-l .cvh--media-underlay__layer {
		position: static;
		max-width: unset;
	}
}

@media screen and (width < 768px) {
	.cvh--break-m .cvh--media-underlay__layer {
		position: static;
		max-width: unset;
	}
}

@media screen and (width < 600px) {
	.cvh--break-s .cvh--media-underlay__layer {
		position: static;
		max-width: unset;
	}
}


/* #═#═#═#═#═# Layered Images #═#═#═#═#═# */
/**
 * Template: Gestapelte Bilder
 * Kategorie: Bild / Text
 */
.cvh--layered-images__block {
	--_layered-images--media-width: 75%;
	--_layered-images--overlap: var(--cvh-space-xl, 7.5rem);

	.cvh--layered-images__stack {
		display: flex;
		flex-direction: column;
		align-items: stretch;

		& > * {
			max-width: var(--_layered-images--media-width);
			margin-left: 0 !important;
			margin-right: 0 !important;
	
			&:nth-child(odd) {
				align-self: flex-start;
			}
	
			&:nth-child(even) {
				align-self: flex-end;
			}
	
			&:not(:first-child) {
				margin-top: calc(var(--_layered-images--overlap) * -1);
			}
		}


			/* #════ Admin Area ════# */
		body.wp-admin .editor-visual-editor & {
			& > * figure {
				margin-bottom: 0 !important;
			}

			&:is(.is-selected, :focus-within) {
				row-gap: var(--cvh-space-s, 2.5rem);
				
				> * {
					max-width: 100% !important;
					margin-top: unset !important;
				}
			}
		}
	}
}


/* #═#═#═#═#═# Overlayed Box #═#═#═#═#═# */
/*
 * Template: Überlagerte Box
 * Kategorie: Bild / Text
 */
.cvh--overlayed-box__block {
	--_overlayed-box--media-size: 210px;
	--_overlayed-box--overlap-x: 50%;
	--_overlayed-box--overlap-y: var(--cvh-space-l, 5rem);

	.cvh--overlayed-box__grid {
		display: grid;
		isolation: isolate;

		.cvh--overlayed-box__title {
			margin: 0;
			align-self: center;
			z-index: 30;
		}

		.cvh--overlayed-box__media {
			max-height: var(--_overlayed-box--media-size);
			z-index: 20;
		}

		.cvh--overlayed-box__content {
			padding: var(--cvh-space-l, 5rem) var(--cvh-space-m, 3.5rem);
			z-index: 10;
		}
	}

	@media screen and (768px < width) {
		.cvh--overlayed-box__grid {
			grid-template-columns: 1fr auto;
			grid-template-areas: "title media"
								 "content content";

			.cvh--overlayed-box__title {
				grid-area: title;
			}

			.cvh--overlayed-box__media {
				grid-area: media;
			}

			.cvh--overlayed-box__content {
				grid-area: content;
			}
		}
	}

	@media screen and (992px < width) {
		.cvh--overlayed-box__grid {
			grid-template-rows: auto var(--_overlayed-box--overlap-y) auto;
			grid-template-columns: 1fr fit-content(var(--_overlayed-box--overlap-x)) fit-content(350px);

			.cvh--overlayed-box__title {
				grid-row: 1 / 2;
				grid-column: 1 / 2;
			}

			.cvh--overlayed-box__media {
				grid-row: 1 / 3;
				grid-column: -3 / -1;
			}

			.cvh--overlayed-box__content {
				grid-row: 2 / 4;
				grid-column: 1 / -2;
			}
		}
	}

	@media screen and (width <= 768px) {
		--_overlayed-box--media-size: 350px;

		.cvh--overlayed-box__grid {
			grid-template-columns: 1fr;
		}
	}
}


/* #═#═#═#═#═# Cloverleaf #═#═#═#═#═# */
/*
 * Template: Kleeblatt
 * Kategorie: Bild / Text
 */
.cvh--cloverleaf__block {
	--_cloverleaf--grid-translate: 150px;
	--_cloverleaf--grid--media-row--size: 350px;
	--_cloverleaf--grid-gaps-x: var(--cvh-col-gap-s);
	--_cloverleaf--grid-gaps-y: var(--cvh-row-gap);
	--_cloverleaf--content-padding: var(--cvh-space-m);

	.cvh--cloverleaf__grid {
		display: grid;
		column-gap: var(--_cloverleaf--grid-gaps-x);
		row-gap: var(--_cloverleaf--grid-gaps-y);

		& > .cvh--cloverleaf__gallery .cvh--image-ctn {
			max-height: 100%;
			height: 100%;
		}
	}

	@media screen and (1200px < width) {
		.cvh--cloverleaf__grid {
			grid-template-columns: var(--_cloverleaf--grid-translate) 1fr var(--_cloverleaf--grid-translate) 1fr;
			grid-template-rows: auto var(--_cloverleaf--grid--media-row--size) auto;

			& > .cvh--cloverleaf__content {
				padding: var(--_cloverleaf--content-padding);

				&:nth-child(1 of &) {
					grid-column: 1 / 3;
					grid-row: 1 / 2;

					&:not(:where([class^="bg--"], [class*=" bg--"])) {
						padding-top: 0;
						padding-left: 0;
					}
				}

				&:nth-child(2 of &) {
					grid-column: 4 / 5;
					grid-row: 3 / 4;

					&:not(:where([class^="bg--"], [class*=" bg--"])) {
						padding-bottom: 0;
						padding-right: 0;
					}
				}
			}

			& > .cvh--cloverleaf__gallery {
				display: contents;

				& > :nth-child(1) {
					grid-column: 3 / 5;
					grid-row: 1 / 3;
				}

				& > :nth-child(2) {
					grid-column: 1 / 3;
					grid-row: 2 / 3;
				}

				& > :nth-child(3) {
					grid-column: 2 / 4;
					grid-row: 3 / 4;
				}

				& .cvh--image-ctn {
					max-height: 100%;
					height: 100%;
				}
			}
		}
	}

	@media screen and (width <= 1200px) {
		--_cloverleaf--grid-gaps-y: var(--cvh-space-l);

		.cvh--cloverleaf__grid {
			@media screen and (768px < width) {
				grid-template-columns: 1fr 1fr;
				grid-template-rows: auto auto;
				grid-template-areas: "content gallery"
									 "content gallery";
			}

			& > .cvh--cloverleaf__content:where([class^="bg--"], [class*=" bg--"]) {
				padding: var(--_cloverleaf--content-padding);
			}

			& > .cvh--cloverleaf__gallery {
				display: grid;
				grid-template-columns: auto var(--cvh-space-xl) var(--cvh-space-l) auto auto;
				grid-template-rows: auto var(--cvh-space-l) auto var(--cvh-space-m) auto;
				column-gap: var(--_cloverleaf--grid-gaps-x);
				row-gap: var(--_cloverleaf--grid-gaps-y);
				grid-area: gallery;

				isolation: isolate;

				& > :nth-child(1) {
					grid-column: 3 / 6;
					grid-row: 1 / 3;

					z-index: 30;
				}

				& > :nth-child(2) {
					grid-column: 1 / 4;
					grid-row: 2 / 5;

					z-index: 20;
				}

				& > :nth-child(3) {
					grid-column: 2 / 5;
					grid-row: 4 / 6;

					z-index: 10;
				}

				& :is([class^="cvh--breakout-"], [class*=" cvh--breakout-"]) {
					--breakout-max: 0px !important;
				}
			}
		}
	}

	@media screen and (width <= 768px) {
		.cvh--cloverleaf__grid {
			grid-template-columns: 1fr;

			& > .cvh--cloverleaf__gallery {
				grid-area: unset;
			}
		}
	}
}


/* #═#═#═#═#═# Testimonial Grid #═#═#═#═#═# */
/*
 * Template: Testimonial
 * Kategorie: Bild / Text
 */
.cvh--testimonial__block {
	--_testimonial__img__row-layout: minmax(auto, min(350px, 50vh));

	& .cvh--testimonial__grid {
		display: grid;
		column-gap: var(--cvh-space-s, 2.5rem);
		row-gap: var(--cvh-space-s, 2.5rem);
	
		@media screen and ( 992px < width ) {
			grid-template-columns: repeat(2, 1fr) !important;
			grid-template-rows: repeat(2, auto);
			grid-template-areas: "content image-2"
								 "image-1 details";
		}
	
		@media screen and ( width <= 992px ) {
			grid-template-columns: 1fr !important;
			grid-template-rows: auto var(--_testimonial__img__row-layout) auto var(--_testimonial__img__row-layout);
			grid-template-areas: "content"
								 "image-1"
								 "details"
								 "image-2";
	
	
			&.break-layout {
				grid-template-rows: auto;
			}
		}
	
	
		/* #════ Columns ════# */
		& .cvh--testimonial__grid-column {
			display: grid;
			grid-template-columns: subgrid !important;
			grid-template-rows: subgrid !important;
			grid-column: span 1 / auto;
			gap: 0;
	
			@media screen and ( 992px < width ) {
				grid-row: 1 / -1;
			}
	
			@media screen and ( width <= 992px ) {
				grid-row: auto / span 2;
			}
	
			& > :is(.cvh--image-ctn, .cvh--testimonial__images) {
				min-width: 0;
			}
	
			&:first-child > :is(.cvh--image-ctn, .cvh--testimonial__images) {
				grid-area: image-1;
			}
	
			&:last-child > :is(.cvh--image-ctn, .cvh--testimonial__images) {
				grid-area: image-2;
			}
		}
	
	
		/* #════ Content ════# */
		& .cvh--testimonial__details {
			grid-area: details;
	
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: stretch;
		}
	
		& .cvh--testimonial__content {
			grid-area: content;
			margin-bottom: var(--cvh-space-s, 3.5rem);
		}
	
	
		/* #════ Images ════# */
		& .cvh--testimonial__images {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
			gap: 0;
	
			& .cvh--image-ctn {
				--obj-ratio: 3 / 4;
			}
		}
	
		& .cvh--image-ctn {
			--obj-height: 100%;
			max-width: 100%;
			width: 100%;
		}
	}
}


/* #═#═#═#═#═# Details #═#═#═#═#═# */
.cvh--testimonial__details .cvh--testimonial__details__grid {
	display: grid;
	column-gap: var(--cvh-space-m, 3.5rem);
	align-items: center;
	padding: var(--cvh-space-m, 3.5rem);
	row-gap: var(--cvh-space-s, 2.5rem);

	@media screen and ( 560px < width) {
		grid-template-columns: [icon-start] auto [icon-end name-start description-start] 1fr [name-end description-end];
		grid-template-rows: [icon-start name-start] var(--cvh-space-xxl, 11.5rem) [description-start] auto [icon-end name-end] 1fr [description-end];
	}

	@media screen and ( width <= 560px) {
		grid-template-columns: fit-content(120px) 1fr;
		grid-template-rows: auto auto;
		grid-template-areas: "icon name"
							 "description description";
	}

	& .cvh--testimonial__icon {
		grid-area: icon;
	}

	& .cvh--testimonial__name {
		grid-area: name;
		margin: var(--cvh-space-xs, 1.5rem) 0 !important;

		& *:not(hgroup, .cvh--heading-ctn):is(h1, h2, h3, h4, h5, h6) {
			margin: 0 !important;
		}
	}

	& .cvh--testimonial__description {
		grid-area: description;
	}
}


/* ══════════════════════════════════════════════════ *
 * MARK: Text
 * ────────────────────────────────────────────────── */
/* #═#═#═#═#═# Text Table #═#═#═#═#═# */
/*
 * Template: Tabellarisch
 * Kategorie: Text
 */
.cvh--text-table__block {
	--_text-table--separator-width: var(--cvh-border-width, 2px);
	--_text-table--separator-color: oklch(from var(--current-bg, var(--cvh-color-text-dynamic)) 80% c h);
	--_text-table--row-gap: var(--cvh-space-m, 3.5rem);
	--_text-table--column-gap: var(--cvh-space-m, 3.5rem);
	--_text-table--subgrid--row-gap: var(--cvh-space-xs, 1.5rem);
	--_text-table--subgrid--column-gap: inherit;

	& .cvh--text-table__grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr) !important;
		row-gap: calc(var(--_text-table--row-gap) * 2 + var(--_text-table--separator-width));
		column-gap: var(--_text-table--column-gap);

		& > .cvh--text-table__row {
			display: grid;
			grid-template-columns: subgrid;
			align-items: center;
			column-gap: var(--_text-table--subgrid--column-gap);
			row-gap: var(--_text-table--subgrid--row-gap);
			grid-column: 1 / -1;

			position: relative;
			isolation: isolate;

			& > * {
				margin: 0 !important;
			}

			&:not(:last-child)::after {
				content: '\0A';
				height: var(--_text-table--separator-width);
				background-color: var(--_text-table--separator-color);
				position: absolute;
				inset-inline: 0;
				bottom: calc(var(--_text-table--row-gap) * -1);
				transform: translateY(50%);
			}
		}
	}

	/* #════ With Media Query ════# */
	& :not(.cvh--text-table__container > .cvh--text-table__grid) {
		@media screen and ( width <= 768px ) {
			&.cvh--text-table__grid {
				grid-template-columns: 1fr !important;
			}
		}
	}

	/* #════ With Container Query ════# */
	& .cvh--text-table__container {
		container: text-table / inline-size;

		& .cvh--text-table__grid {
			@container (width <= 768px) {
				grid-template-columns: 1fr !important;
			}
		}
	}
}


/* #═#═#═#═#═# Icon Tiles #═#═#═#═#═# */
/*
 * Template: 4 Kacheln
 * Kategorie: Text
 */
.cvh--icon-tiles__block {
	--_icon-tiles__item--padding-x: var(--cvh-space-m, 3.5rem);
	--_icon-tiles__item--padding-y: var(--cvh-space-m, 3.5rem);

	& .cvh--icon-tiles__grid {
		background-color: unset;

		& > * {
			padding-inline: var(--_icon-tiles__item--padding-x);
			padding-block: var(--_icon-tiles__item--padding-y);
			background-color: var(--current-bg);

			&:not([class^="cvh--owl-"], [class*=" cvh--owl-"]) .cvh--icon-element:not(:last-child) {
				margin-bottom: var(--cvh-space-s, 2.5rem);
			}
		}
	}
}


/* #═#═#═#═#═# Duo Icons #═#═#═#═#═# */
/*
 * Template: 2 Spaltig Iconboxen
 * Kategorie: Text
 */
.cvh--duo-icons__block {
	--_duo-icons__column--padding-x: var(--cvh-space-m, 3.5rem);
	--_duo-icons__column--padding-y: var(--cvh-space-m, 3.5rem);
	--_duo-icons__column--border-width: var(--cvh-border-width, 2px);
	--_duo-icons__column--border-color: oklch(from var(--current-bg, var(--cvh-color-text-dynamic)) 80% c h);
	--_duo-icons__body--gap: var(--cvh-space-m, 3.5rem);

	& .cvh--duo-icons__grid {
		display: grid;
		isolation: isolate;

		& .cvh--duo-icons__column {
			display: grid;
			grid-template-columns: 1fr;
			grid-template-rows: auto auto 1fr;
			row-gap: 0 !important;

			& .cvh--duo-icons__head {
				grid-column: 1 / -1;
				grid-row: 1 / 3;
				margin-inline: var(--_duo-icons__column--padding-x);
				position: relative;
				z-index: 20;
			}

			& .cvh--duo-icons__body {
				display: grid;
				grid-template-rows: subgrid;
				row-gap: var(--_duo-icons__body--gap);
				grid-column: 1 / -1;
				grid-row: 2 / 4;
				border-color: var(--_duo-icons__column--border-color);
				border-style: solid;
				border-width: var(--_duo-icons__column--border-width);
				padding-inline: var(--_duo-icons__column--padding-x);
				padding-block: var(--_duo-icons__column--padding-y);
				position: relative;
				z-index: 10;

				& > * {
					grid-row: 2 / auto;
				}
			}
		}
	}
}

/* #═#═#═#═#═# Column Icons #═#═#═#═#═# */
/*
 * Template: 4 Spaltig Boxen mit Icon
 * Kategorie: Text
 */
 .cvh--column-border{
	border: 2px solid var(--primary);
 }

 .cvh--separator-column{
	width: 35%;
	margin: auto;

 }

/* ══════════════════════════════════════════════════ *
 * MARK: Call to Action
 * ────────────────────────────────────────────────── */
/* #═#═#═#═#═# Form Accent Color #═#═#═#═#═# */
/*
 * Template: Formular mit akzent Farbe
 * Kategorie: Call to Action
 */
.cvh--form-overlap__block {
	--_form-overlap__form-background: var(--accent);
	--_form_overlap__form-padding-y: var(--cvh-space-m, 3.5rem);
	--_form_overlap__form-padding-x: var(--cvh-space-m, 3.5rem);
	--_form-overlap__fold: calc(var(--cvh-space-xxl, 11.5rem) * 3);

	margin-bottom: var(--_form-overlap__fold) !important;

	.cvh--form-overlap__form-ctn {
		margin-bottom: calc(var(--_form-overlap__fold) * -1);

		.cvh--form-overlap__form {
			padding-inline: var(--_form_overlap__form-padding-x);
			padding-block: var(--_form_overlap__form-padding-y);
			background-color: var(--_form-overlap__form-background);
		}
	}
}


/* ══════════════════════════════════════════════════ *
 * MARK: Icon Blocks
 * ────────────────────────────────────────────────── */
/* #═#═#═#═#═#  #═#═#═#═#═# */
/*
 * Template: Icon Box
 * Kategorie: Icon
 */
.cvh--icon-selection__block {
	--_icon-selection__item--padding: var(--cvh-space-s, 2.5rem);
	--_icon-selection__item--gap: var(--cvh-space-s, 2.5rem);

	& .cvh--icon-selection__grid .cvh--icon-selection__item {
		transition: var(--cvh-transition-normal);
		transition-property: color, background-color, border-color, box-shadow;
		padding: var(--_icon-selection__item--padding);

		&:is(a):is(:hover, :focus-visible) {
			background-color: var(--base);

			& * {
				--cvh-color-text-dynamic: var(--cvh-color-text-light) !important;
				--cvh-color-heading-dynamic: var(--cvh-color-heading-light) !important;
			}
		}

		& .cvh--icon-element {
			margin-bottom: var(--_icon-selection__item--gap);
		}
	}
}


/* ══════════════════════════════════════════════════ *
 * MARK: Gallery
 * ────────────────────────────────────────────────── */
/* #═#═#═#═#═# Gallery Media overlay #═#═#═#═#═# */
/*
 * Template: Bildraster
 * Kategorie: Galerie
 */
.cvh--media-overlay__stack {
	--cvh-color-heading-dynamic: var(--cvh-color-heading-light);
	--cvh-color-text-dynamic: var(--cvh-color-text-light);

	--_media-overlay__stack-min-line-height: 300px;

	--_media-overlay__title-padding: var(--cvh-space-xs, 1.5rem);
	--_media-overlay__title-lines: 2;
	--_media-overlay__title-font-size: var(--text-l);
	--_media-overlay__title-line-height: var(--cvh-line-height-s, 1.2);
	--_media-overlay__title-height: calc((var(--_media-overlay__title-font-size) * var(--_media-overlay__title-line-height)) * var(--_media-overlay__title-lines));
	--_media-overlay__title-align: left;

	--_media-overlay__body-padding-x: var(--cvh-space-xs, 1.5rem);
	--_media-overlay__body-padding-y: var(--cvh-space-xs, 1.5rem);
	--_media-overlay__body-transition: var(--cvh-transition-normal);
	--_media-overlay__body-background: var(--base);
	--_media-overlay__body-offset: var(--cvh-space-m, 3.5rem);
	--_media-overlay__body-expand-offset: var(--_media-overlay__body-offset);

	--_media-overlay__backdrop-blur: 5px;

	display: grid;
	grid-template-columns: 1fr !important;
	grid-auto-rows: minmax(var(--_media-overlay__stack-min-line-height), 1fr) !important;
	grid-template-areas: "stack" !important;
	isolation: isolate;
	overflow: clip;
	container: media-overlay / inline-size;

	& > * {
		grid-area: stack !important;

		&.cvh--media-overlay__head {
			position: relative;
			z-index: 10;
		}

		&.cvh--media-overlay__body {
			position: relative;
			z-index: 50;
			padding-inline: calc(var(--_media-overlay__body-padding-x) + var(--_media-overlay__body-expand-offset));
			padding-block: var(--_media-overlay__body-padding-y);
			margin-inline: calc(var(--_media-overlay__body-offset) - var(--_media-overlay__body-expand-offset));
			transition: var(--_media-overlay__body-transition);
			transition-property: transform, margin-inline, padding-inline;

			&::before {
				content: '\0A';
				position: absolute;
				inset: 0;
				z-index: -5;
				background-color: var(--_media-overlay__body-background);
				opacity: 1;
				transition: inherit;
				transition-property: opacity;
				backdrop-filter: blur(var(--_media-overlay__backdrop-blur));
			}

			& .cvh--media-overlay__title {
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				flex-wrap: nowrap;
				text-align: var(--_media-overlay__title-align);
				min-height: calc(var(--_media-overlay__title-height) + (2 * var(--_media-overlay__title-padding)));
				margin-top: calc(var(--_media-overlay__body-padding-y) * -1);
				padding-block: var(--_media-overlay__title-padding);
				width: 100%;
			}
		}
	}

	&:not(:hover, :focus) .cvh--media-overlay__body {
		transform: translateY(calc(100% - (var(--_media-overlay__title-height, 0) + (2 * var(--_media-overlay__title-padding)))));
		padding-inline: var(--_media-overlay__body-padding-x);
		margin-inline: var(--_media-overlay__body-offset);

		&::before {
			opacity: 0.6;
		}
	}


	/* #════ Admin Area ════# */
	body.wp-admin .editor-visual-editor & {
		grid-auto-rows: repeat(2, auto) !important;
		grid-template-areas: unset !important;

		& > * {
			grid-area: auto !important;

			&.cvh--media-overlay__body {
				transition: unset !important;
				padding-block: var(--cvh-space-m, 3.5rem) !important;
				padding-inline: var(--cvh-space-m, 3.5rem) !important;
				margin-inline: 0 !important;

				& .cvh--media-overlay__title {
					width: auto !important;
				}
			}
		}

		&:not(:hover, :focus) .cvh--media-overlay__body {
			transform: translateY(0) !important;
			padding-inline: var(--cvh-space-m, 3.5rem) !important;
			margin-inline: 0 !important;

			&::before {
				opacity: 1 !important;
			}
		}
	}
}


/* ══════════════════════════════════════════════════ *
 * MARK: Utility
 * ────────────────────────────────────────────────── */
/* #═#═#═#═#═# Box Span #═#═#═#═#═# */
:is(.cvh--grid, [class^="cvh--grid-"], [class*=" cvh--grid-"]) >  .cvh--box__span-height__2 {
	grid-row: span 2;
}

@media screen and ( width >= 992px ) {
	:is(.cvh--grid, [class^="cvh--grid-"], [class*=" cvh--grid-"]) > :is([class^="cvh--box__span-width__"], [class*=" cvh--box__span-width__"]) {
		padding: var(--cvh-space-m, 3.5rem) var(--cvh-space-xl, 7.5rem);
	}

	:is(.cvh--grid, [class^="cvh--grid-"], [class*=" cvh--grid-"]) > .cvh--box__span-width__3 {
		grid-column: span 9;
	}

	:is(.cvh--grid, [class^="cvh--grid-"], [class*=" cvh--grid-"]) > .cvh--box__span-width__2 {
		grid-column: span 6;
	}
}

@media screen and (  width < 992px ) {
	:is(.cvh--grid, [class^="cvh--grid-"], [class*=" cvh--grid-"]) > :is([class^="cvh--box__span-width__"], [class*=" cvh--box__span-width__"]) {
		grid-column: 1 / -1;
		padding: var(--cvh-space-m, 3.5rem) var(--cvh-space-m, 3.5rem);
	}
}
