.content_image-layout {
	--content-image-panel-width: min(100%, calc(50% - (13 * var(--su))));
	--content-image-panel-top-color: transparent;
	--content-image-panel-bottom-color: transparent;
	background-color: var(--color-white);
	padding-inline: var(--pk-site-gutter);
	position: relative;
}

.content_image-layout--bg-white {
	background-color: var(--color-white);
}

.content_image-layout--bg-surface {
	background-color: var(--color-surface-tint);
}

.content_image-layout--bg-teal_light {
	background-color: var(--color-teal-light);
}

.content_image-layout--bg-teal {
	background-color: var(--color-teal);
}

.content_image-layout--panel-top-white {
	--content-image-panel-top-color: var(--color-white);
}

.content_image-layout--panel-top-surface {
	--content-image-panel-top-color: var(--color-surface-tint);
}

.content_image-layout--panel-top-teal_light {
	--content-image-panel-top-color: var(--color-teal-light);
}

.content_image-layout--panel-top-teal {
	--content-image-panel-top-color: var(--color-teal);
}

.content_image-layout--panel-bottom-white {
	--content-image-panel-bottom-color: var(--color-white);
}

.content_image-layout--panel-bottom-surface {
	--content-image-panel-bottom-color: var(--color-surface-tint);
}

.content_image-layout--panel-bottom-teal_light {
	--content-image-panel-bottom-color: var(--color-teal-light);
}

.content_image-layout--panel-bottom-teal {
	--content-image-panel-bottom-color: var(--color-teal);
}

.content_image-layout::before,
.content_image-layout::after {
	content: "";
	pointer-events: none;
	position: absolute;
	width: var(--content-image-panel-width);
	z-index: 0;
}

.content_image-layout::before {
	background-color: var(--content-image-panel-top-color);
	inset-block-start: 0;
	inset-inline-start: 0;
	height: 50%;
}

.content_image-layout::after {
	background-color: var(--content-image-panel-bottom-color);
	inset-block-end: 0;
	inset-inline-start: 0;
	height: 50%;
}

.content_image-layout--panel-right::before,
.content_image-layout--panel-right::after {
	inset-inline-start: auto;
	inset-inline-end: 0;
}

.content_image-layout--panel-full {
	--content-image-panel-width: 100%;
}

.content_image-layout .pk-row {
	min-height: clamp(30rem, calc(34 * var(--su)), 34rem);
	padding-block: clamp(4rem, calc(5 * var(--su)), 5rem);
	position: relative;
	z-index: 1;
}

.content_image-layout .pk-grid-container {
	align-items: center;
	column-gap: var(--pk-column-gap);
}

.content-image__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
}

.content_image-layout--image-left .content-image__media {
	grid-column: 1 / span 6;
	grid-row: 1;
}

.content_image-layout--image-left .content-image__content {
	grid-column: 7 / span 6;
	grid-row: 1;
}

.content_image-layout--image-right .content-image__content {
	grid-column: 1 / span 6;
	grid-row: 1;
}

.content_image-layout--image-right .content-image__media {
	grid-column: 7 / span 6;
	grid-row: 1;
}

.content-image__heading {
	color: var(--pk-heading-color);
	font-size: var(--scaling-h3);
	font-weight: var(--pk-heading-font-weight);
	letter-spacing: 0;
	line-height: var(--pk-heading-line-height);
	margin: 0;
	max-width: 17.75em;
	overflow-wrap: anywhere;
}

.content-image__text {
	color: var(--pk-text-color);
	font-size: var(--desktop-body-lg);
	font-weight: var(--pk-text-font-weight);
	letter-spacing: 0;
	line-height: var(--pk-text-line-height);
	/* margin-top: max(2rem, calc(2.25 * var(--su))); */
	max-width: 36.5em;
	overflow-wrap: anywhere;
}

.content-image__text p {
	margin: 0;
}

.content_image-layout .content-image__actions {
	margin-top: clamp(2rem, calc(3 * var(--su)), 3rem);
}

.content_image-layout .content-image__actions .pk-button {
	padding-inline-start: var(--pk-button-padding-inline-end);
	padding-inline-end: var(--pk-button-padding-inline-start);
}

.content_image-layout .content-image__actions .pk-button::before {
	order: 2;
	transform: scaleX(-1);
}

.content_image-layout .content-image__actions .pk-button .pk-button-text {
	order: 1;
}

.content-image__row-actions {
	display: flex;
	grid-column: 1 / -1;
	justify-content: center;
	margin-top: clamp(2.5rem, calc(3 * var(--su)), 3rem);
}

.content-image__row-actions .content-image__actions {
	justify-content: center;
	margin-top: 0;
}

.content-image__media {
	align-items: center;
	display: flex;
	justify-content: center;
	min-height: clamp(16rem, calc(24 * var(--su)), 24rem);
	min-width: 0;
}

.content_image-layout--image-right .content-image__media {
	justify-content: flex-end;
}

.content_image-layout--image-left .content-image__media {
	justify-content: flex-start;
}

.content-image__image {
	display: block;
	height: auto;
	max-height: clamp(15rem, calc(27 * var(--su)), 27rem);
	object-fit: contain;
	width: min(100%, clamp(16rem, calc(30 * var(--su)), 30rem));
}

.content_image-layout--image-fit-cover .content-image__media {
	align-items: stretch;
	min-height: clamp(18rem, calc(25 * var(--su)), 25rem);
}

.content_image-layout--image-fit-cover .content-image__image {
	aspect-ratio: 4 / 3;
	border-radius: max(0.75rem, calc(1 * var(--su)));
	height: auto;
	max-height: none;
	object-fit: cover;
	overflow: hidden;
	width: min(100%, clamp(18rem, calc(31 * var(--su)), 31rem));
}

.content-image__list-card {
	background-color: color-mix(in srgb, var(--color-accent) 12%, var(--color-white));
	border-radius: max(1rem, calc(1.5 * var(--su)));
	box-sizing: border-box;
	color: var(--pk-text-color);
	font-size: var(--desktop-body-lg);
	line-height: var(--pk-text-line-height);
	padding: clamp(1.75rem, calc(3 * var(--su)), 3rem);
	width: min(100%, clamp(24rem, calc(38 * var(--su)), 38rem));
}

.content-image__list-title {
	color: var(--pk-heading-color);
	font-size: var(--desktop-body-xl);
	font-weight: var(--pk-heading-font-weight);
	letter-spacing: 0;
	line-height: var(--pk-heading-line-height);
	margin: 0 0 max(1rem, calc(1 * var(--su)));
}

.content-image__list {
	display: flex;
	flex-direction: column;
	gap: max(0.5rem, calc(0.5 * var(--su)));
	list-style: none;
	margin: 0;
	padding: 0;
}

.content-image__list li {
	line-height: var(--pk-text-line-height);
	padding-left: max(1.75rem, calc(1.75 * var(--su)));
	position: relative;
}

.content-image__list li::before {
	background-color: var(--color-accent);
	border-radius: 50%;
	content: "";
	height: max(0.75rem, calc(0.75 * var(--su)));
	left: 0;
	position: absolute;
	top: 0.45em;
	width: max(0.75rem, calc(0.75 * var(--su)));
}

@media screen and (max-width: 992px) {
	.content_image-layout .pk-row {
		min-height: auto;
		padding-block: max(4rem, calc(4 * var(--su)));
	}

	.content-image__content,
	.content-image__media {
		grid-column-start: auto;
		grid-column: span 4;
		grid-row: auto;
	}

	.content_image-layout--image-left .content-image__media,
	.content_image-layout--image-right .content-image__content {
		grid-column: 1 / span 4;
	}

	.content_image-layout--image-left .content-image__content,
	.content_image-layout--image-right .content-image__media {
		grid-column: 5 / span 4;
	}

	.content-image__heading {
		max-width: 18em;
	}

	.content-image__text {
		font-size: var(--desktop-body-md);
		max-width: none;
	}

	.content-image__list-card {
		font-size: var(--desktop-body-md);
		padding: max(1.75rem, calc(2 * var(--su)));
	}
}

@media screen and (max-width: 767px) {
	.content_image-layout .pk-grid-container {
		display: flex;
		flex-direction: column;
		gap: 0;
	}

	.content_image-layout::before,
	.content_image-layout::after {
		display: none;
	}

	.content_image-layout .pk-row {
		padding-block: max(3rem, calc(3 * var(--su)));
	}

	.content-image__content,
	.content-image__media,
	.content-image__row-actions {
		box-sizing: border-box;
		grid-column-start: 1;
		grid-column: 1 / -1;
		grid-row: auto;
		width: 100%;
	}

	.content_image-layout--image-left .content-image__content,
	.content_image-layout--image-left .content-image__media,
	.content_image-layout--image-right .content-image__content,
	.content_image-layout--image-right .content-image__media {
		grid-column: 1 / -1;
	}

	.content_image-layout--image-left .content-image__media {
		order: 1;
	}

	.content_image-layout--image-left .content-image__content {
		order: 2;
	}

	.content_image-layout--image-right .content-image__content {
		order: 1;
	}

	.content_image-layout--image-right .content-image__media {
		order: 2;
	}

	.content_image-layout--no-media .content-image__content {
		grid-column: 1 / -1;
	}

	.content-image__media {
		justify-content: center;
		margin-top: max(2.5rem, calc(2.5 * var(--su)));
		min-height: 0;
	}

	.content-image__image {
		max-height: none;
		width: 100%;
	}

	.content_image-layout--image-fit-cover .content-image__image {
		aspect-ratio: 16 / 11;
		width: 100%;
	}

	.content-image__list-card {
		width: 100%;
	}

	.content_image-layout--image-left .content-image__media {
		margin-top: 0;
		margin-bottom: max(2.5rem, calc(2.5 * var(--su)));
	}

	.content-image__heading {
		font-size: var(--scaling-h4);
		max-width: 100%;
	}

	.content-image__text {
		font-size: var(--desktop-body-sm);
		margin-top: max(1.5rem, calc(1.5 * var(--su)));
	}

	.content_image-layout .content-image__actions {
		margin-top: max(2rem, calc(2 * var(--su)));
	}

	.content-image__row-actions {
		margin-top: max(2rem, calc(2 * var(--su)));
		order: 3;
	}

	.content-image__row-actions .content-image__actions {
		align-items: center;
		flex-direction: column;
		width: 100%;
	}

}
