/* Grid tracks stretch nested cards to equal height. */
.ohso-content-container {
	--content-container-columns: var(--content-container-desktop-columns, 2);
	--content-container-tracks: repeat(var(--content-container-columns, 2), minmax(0, 1fr));
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.ohso-content-container--boxed {
	--content-container-surface: var(--content-accent-surface);
	--content-container-heading: var(--content-accent-dark);
	padding: var(--space-m);
	border: 1px solid var(--neutral-ultra-light);
	border-radius: var(--radius-m);
	color: var(--neutral-dark);
	overflow-wrap: anywhere;
}

.ohso-content-container--accent-default {
	--content-container-surface: var(--primary-ultra-light);
	--content-container-heading: var(--secondary-dark);
}

.ohso-content-container--background-tint { background: var(--content-container-surface); }
.ohso-content-container--background-gradient { background: linear-gradient(135deg, var(--content-container-surface), var(--white)); }
.ohso-content-container--background-white { background: var(--white); }

/* Use the darker audience colour for ordinary text headings on pale surfaces. */
.ohso-content-container--boxed > .ohso-content-container__inner > :is(h1, h2, h3, h4, h5, h6):not(.has-text-color),
.ohso-content-container--boxed > .ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-type="core/heading"]:not(.has-text-color) {
	color: var(--content-container-heading);
}

.ohso-content-container__inner,
.ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout {
	display: flex;
	flex-direction: column;
	gap: var(--content-container-gap, var(--space-s));
	min-width: 0;
}

.ohso-content-container--columns > .ohso-content-container__inner,
.ohso-content-container--columns > .ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout {
	display: grid;
	grid-template-columns: var(--content-container-tracks);
	align-items: stretch;
}

.ohso-content-container--columns-2.ohso-content-container--widths-33-66 {
	--content-container-tracks: minmax(0, 1fr) minmax(0, 2fr);
}

.ohso-content-container--columns-2.ohso-content-container--widths-66-33 {
	--content-container-tracks: minmax(0, 2fr) minmax(0, 1fr);
}

/* Gutenberg's editing wrappers must not become grid columns themselves. */
.ohso-content-container__inner > .block-editor-inner-blocks {
	grid-column: 1 / -1;
	min-width: 0;
}

.ohso-content-container .ohso-content-container__inner > *,
.ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block {
	width: 100%;
	max-width: none;
	min-width: 0;
	margin-block: 0;
}

.ohso-content-container .ohso-content-container__inner > :is(h1, h2, h3, h4, h5, h6),
.ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-type="core/heading"] {
	max-width: 600px;
	margin-inline: 0;
	text-align: left;
}

.ohso-content-container .ohso-content-container__inner > :is(h1, h2, h3, h4, h5, h6).has-text-align-center,
.ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-type="core/heading"].has-text-align-center {
	margin-inline: auto;
	text-align: center;
}

.ohso-content-container .ohso-content-container__inner > :is(h1, h2, h3, h4, h5, h6).has-text-align-right,
.ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-type="core/heading"].has-text-align-right {
	margin-inline: auto 0;
	text-align: right;
}

.ohso-content-container--columns > .ohso-content-container__inner > .acf-block-preview:is(.wp-block-acf-package, .wp-block-acf-package-cta),
.ohso-content-container--columns > .ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout > :is(.wp-block-acf-package, .wp-block-acf-package-cta),
.ohso-content-container--columns > .ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout > :is(.wp-block-acf-package, .wp-block-acf-package-cta) > .acf-block-preview {
	display: flex;
	flex-direction: column;
}

.ohso-content-container--columns > .ohso-content-container__inner > .acf-block-preview:is(.wp-block-acf-package, .wp-block-acf-package-cta) > :is(.ohso-package, .ohso-package-cta),
.ohso-content-container--columns > .ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout > :is(.wp-block-acf-package, .wp-block-acf-package-cta) > :is(.ohso-package, .ohso-package-cta),
.ohso-content-container--columns > .ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout > :is(.wp-block-acf-package, .wp-block-acf-package-cta) > .acf-block-preview > :is(.ohso-package, .ohso-package-cta) {
	flex: 1;
}

@media (max-width: 1023px) {
	.ohso-content-container--columns-3,
	.ohso-content-container--columns-4 {
		--content-container-columns: 2;
	}
}

@media (max-width: 767px) {
	.ohso-content-container--columns {
		--content-container-columns: 1;
	}

	.ohso-content-container--columns.ohso-content-container--columns-2 {
		--content-container-tracks: minmax(0, 1fr);
	}

	.ohso-content-container--columns.ohso-content-container--reverse-mobile > .ohso-content-container__inner,
	.ohso-content-container--columns.ohso-content-container--reverse-mobile > .ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout {
		display: flex;
		flex-direction: column-reverse;
	}

	/* Keep the editor's insertion control after the reversed content. */
	.ohso-content-container--reverse-mobile > .ohso-content-container__inner > .block-list-appender,
	.ohso-content-container--reverse-mobile > .ohso-content-container__inner > .block-editor-inner-blocks > .block-editor-block-list__layout > .block-list-appender {
		order: 1;
	}
}