/**
 * Strategic Split — Core Freeze pass.
 *
 * Widget CSS owns only composition glue. Section, Header, Layout, Media,
 * Button, List and Animation controls remain owned by their cores.
 */

.huu-uib-strategic-split {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	isolation: isolate;
	box-sizing: border-box;
}

.huu-uib-strategic-split *,
.huu-uib-strategic-split *::before,
.huu-uib-strategic-split *::after {
	box-sizing: border-box;
}

.huu-uib-strategic-split__section-overlay {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.huu-uib-strategic-split__container {
	position: relative;
	z-index: 1;
	width: 100%;
	display: flex;
	justify-content: center;
}

.huu-uib-strategic-split__inner {
	width: 100%;
	margin-inline: auto;
}

.huu-uib-strategic-split__layout {
	--huu-uib-layout-media-width: 50%;
	--huu-uib-layout-gap: var(--huu-uib-grid-gap, 40px);
	display: grid;
	grid-template-columns: minmax(0, calc(100% - var(--huu-uib-layout-media-width) - var(--huu-uib-layout-gap))) minmax(0, var(--huu-uib-layout-media-width));
	gap: var(--huu-uib-layout-gap);
	align-items: center;
	width: 100%;
}

.huu-uib-strategic-split__content-column,
.huu-uib-strategic-split__media-column {
	min-width: 0;
	width: 100%;
	max-width: 100%;
}

.huu-uib-strategic-split__content-column {
	display: flex;
}

.huu-uib-strategic-split__media-column {
	display: flex;
	justify-self: stretch;
	min-height: 0;
}

.huu-uib-strategic-split--media-left .huu-uib-strategic-split__media-column,
.huu-uib-strategic-split--media-top .huu-uib-strategic-split__media-column {
	order: -1;
}

.huu-uib-strategic-split--media-top .huu-uib-strategic-split__layout,
.huu-uib-strategic-split--media-bottom .huu-uib-strategic-split__layout {
	grid-template-columns: 1fr;
}

.huu-uib-strategic-split--media-top .huu-uib-strategic-split__media-column,
.huu-uib-strategic-split--media-bottom .huu-uib-strategic-split__media-column {
	width: 100%;
}

.huu-uib-strategic-split__content-stack {
	--huu-uib-strategic-content-align: flex-start;
	--huu-uib-strategic-text-align: left;
	display: flex;
	flex-direction: column;
	align-items: var(--huu-uib-strategic-content-align, flex-start);
	text-align: var(--huu-uib-strategic-text-align, left);
	gap: 20px;
	width: 100%;
}

.huu-uib-strategic-split__header {
	margin-bottom: 0;
}

.huu-uib-strategic-split__text {
	font-size: var(--huu-uib-body-size, 17px);
	line-height: 1.75;
	color: var(--huu-uib-text, #52607a);
}

.huu-uib-strategic-split__text > :first-child { margin-top: 0; }
.huu-uib-strategic-split__text > :last-child { margin-bottom: 0; }

.huu-uib-strategic-split__points {
	width: 100%;
}

.huu-uib-strategic-split__points .huu-uib-list__item {
	justify-content: var(--huu-uib-strategic-content-align, flex-start);
}

.huu-uib-strategic-split__media-frame {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	flex: 1 1 auto;
	align-self: stretch;
	height: var(--huu-uib-media-core-height, 420px);
	min-height: var(--huu-uib-media-core-height, 420px);
	display: flex;
	align-items: stretch;
	padding: 24px;
	overflow: hidden;
	background: var(--huu-uib-surface, #fff);
	border: 1px solid var(--huu-uib-border, rgba(17, 24, 39, .12));
	border-style: solid;
	border-radius: var(--huu-uib-media-radius, var(--huu-uib-radius-xl, 28px));
	box-shadow: 0 24px 60px rgba(17, 24, 39, .08);
}

.huu-uib-strategic-split__media-frame > .huu-uib-media-core,
.huu-uib-strategic-split__media-frame .huu-uib-media-core {
	width: 100%;
	height: 100%;
	min-height: 0;
	aspect-ratio: auto;
	border-radius: inherit;
	--huu-uib-media-radius: inherit;
}

.huu-uib-strategic-split__media-frame .huu-uib-media-core__picture,
.huu-uib-strategic-split__media-frame .huu-uib-media-core__image,
.huu-uib-strategic-split__media-frame .huu-uib-media-core__video-button,
.huu-uib-strategic-split__media-frame .huu-uib-media-core__poster-placeholder,
.huu-uib-strategic-split__media-frame .huu-uib-media-core__embed,
.huu-uib-strategic-split__media-frame .huu-uib-media-core__embed iframe {
	width: 100%;
	height: 100%;
	min-height: 0;
	display: block;
	border-radius: inherit;
}

.huu-uib-strategic-split__media-frame .huu-uib-media-core__image,
.huu-uib-strategic-split__media-frame .huu-uib-media-core__poster-placeholder,
.huu-uib-strategic-split__media-frame .huu-uib-media-core__embed iframe {
	object-fit: var(--huu-uib-media-object-fit, cover);
	object-position: var(--huu-uib-media-object-position, center center);
}

.huu-uib-strategic-split__actions {
	width: 100%;
	display: flex;
	justify-content: var(--huu-uib-strategic-content-align, flex-start);
}

.huu-uib-strategic-split__actions .huu-uib-buttons {
	justify-content: var(--huu-uib-strategic-content-align, flex-start);
}

.huu-uib-strategic-split__actions .huu-uib-buttons--width-full {
	width: 100%;
}

.huu-uib-strategic-split__actions .huu-uib-buttons--width-full > .huu-uib-btn {
	width: 100%;
}

.huu-uib-strategic-split__trust {
	font-size: var(--huu-uib-small-size, 14px);
	line-height: 1.5;
	color: var(--huu-uib-text-muted, #6b7280);
}

@media (max-width: 1024px) {
	.huu-uib-strategic-split__layout {
		grid-template-columns: 1fr;
	}

	.huu-uib-strategic-split--tablet-media-left .huu-uib-strategic-split__media-column,
	.huu-uib-strategic-split--tablet-media-top .huu-uib-strategic-split__media-column {
		order: -1;
	}

	.huu-uib-strategic-split--tablet-media-right .huu-uib-strategic-split__media-column,
	.huu-uib-strategic-split--tablet-media-bottom .huu-uib-strategic-split__media-column {
		order: 0;
	}

	.huu-uib-strategic-split__content-column,
	.huu-uib-strategic-split__media-column {
		width: 100%;
		max-width: 100%;
	}
}

@media (max-width: 767px) {
	.huu-uib-strategic-split__layout {
		gap: var(--huu-uib-layout-gap, 28px);
	}

	.huu-uib-strategic-split--mobile-media-left .huu-uib-strategic-split__media-column,
	.huu-uib-strategic-split--mobile-media-top .huu-uib-strategic-split__media-column {
		order: -1;
	}

	.huu-uib-strategic-split--mobile-media-right .huu-uib-strategic-split__media-column,
	.huu-uib-strategic-split--mobile-media-bottom .huu-uib-strategic-split__media-column {
		order: 0;
	}

	.huu-uib-strategic-split--edge-mobile .huu-uib-strategic-split__media-column,
	.huu-uib-strategic-split--edge-all .huu-uib-strategic-split__media-column {
		width: 100vw;
		max-width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
	}

	.huu-uib-strategic-split__actions {
		width: 100%;
		max-width: 100%;
		display: flex;
		justify-content: stretch;
		align-items: stretch;
		overflow: visible;
	}

	.huu-uib-strategic-split__actions .huu-uib-buttons.huu-uib-buttons--mobile-width-full,
	.huu-uib-strategic-split__actions .huu-uib-buttons.huu-uib-buttons--width-full {
		width: 100%;
		max-width: 100%;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		gap: var(--huu-uib-button-gap-mobile, var(--huu-uib-button-gap, 12px));
	}

	.huu-uib-strategic-split__actions .huu-uib-buttons.huu-uib-buttons--mobile-width-full > .huu-uib-btn,
	.huu-uib-strategic-split__actions .huu-uib-buttons.huu-uib-buttons--width-full > .huu-uib-btn {
		width: 100%;
		max-width: 100%;
		min-width: 0;
		box-sizing: border-box;
		flex: 0 0 auto;
	}
}

@media (min-width: 768px) {
	.huu-uib-strategic-split--edge-all .huu-uib-strategic-split__media-column {
		width: 100vw;
		max-width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
	}
}

/* v2.1-alpha.06.2 — Strategic Split media containment regression fix.
 * Edge bleed must not turn a side media column into a 100vw layer inside
 * a desktop/tablet split, because that makes the media frame overlap the
 * content column. Bleed remains valid for stacked/mobile compositions.
 */
@media (min-width: 768px) {
	.huu-uib-strategic-split--edge-all:not(.huu-uib-strategic-split--media-top):not(.huu-uib-strategic-split--media-bottom) .huu-uib-strategic-split__media-column {
		width: 100%;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
}

.huu-uib-strategic-split__media-column {
	position: relative;
	z-index: 0;
	overflow: visible;
}

.huu-uib-strategic-split__media-frame {
	position: relative;
	z-index: 0;
	max-width: 100%;
	contain: layout paint;
}

.huu-uib-strategic-split__media-frame > .huu-uib-media-core,
.huu-uib-strategic-split__media-frame .huu-uib-media-core {
	position: relative;
	overflow: hidden;
	max-width: 100%;
}

.huu-uib-strategic-split__media-frame .huu-uib-media-core__picture,
.huu-uib-strategic-split__media-frame .huu-uib-media-core__video-button,
.huu-uib-strategic-split__media-frame .huu-uib-media-core__poster-placeholder,
.huu-uib-strategic-split__media-frame .huu-uib-media-core__embed {
	overflow: hidden;
	max-width: 100%;
}