.hero_alt-layout {
	--hero-alt-bg: var(--pk-color-primary);
	--hero-alt-heading: var(--pk-color-secondary);
	--hero-alt-text: var(--pk-color-secondary);

	position: relative;
	min-height: 420px;
	padding-block: var(--pk-row-spacing);
	aspect-ratio: 16 / 4.5;
	display: flex;
	align-items: center;
	overflow: hidden;
	margin-bottom: var(--pk-row-spacing);
}

.hero_alt-layout .pk-hero-bg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.hero_alt-layout .hero-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	z-index: 0;
}

.hero_alt-layout::before {
	content: '';
	position: absolute;
	inset: 0;
	width: 62%;
	background-color: var(--hero-alt-bg);
	clip-path: polygon(0 0, 55% 0, 100% 100%, 0% 100%);
	z-index: 5;
}

.hero_alt-layout .pk-row {
	position: relative;
	z-index: 10;
}

.hero_alt-layout .pk-col {
	padding: clamp(2rem, 5vw, 5.5rem) clamp(3.5rem, 12vw, 10rem) clamp(2rem, 5vw, 5.5rem) 0;
	max-width: 640px;
}

.hero_alt-layout .pk-heading {
	color: var(--hero-alt-heading);
	font-size: clamp(35px, 35px + (45 - 35) * ((100vw - 350px) / (1300 - 350)), 60px);
}

.hero_alt-layout .pk-module.pk-text,
.hero_alt-layout .pk-module.pk-text * {
	color: var(--hero-alt-text);
}

.hero_alt-layout .pk-module.pk-text {
	font-size: clamp(1.25rem, 2.2vw, 1.875rem);
	line-height: 1.2;
	font-weight: 700;
}

.hero_alt-layout .pk-button-group a.pk-button:nth-child(1),
.hero_alt-layout .pk-button-group a.pk-button:nth-child(2) {
	background-color: #fff;
}

.hero_alt-layout .pk-button-group a.pk-button:nth-child(1) > span,
.hero_alt-layout .pk-button-group a.pk-button:nth-child(2) > span {
	color: var(--pk-color-secondary);
}

@media (max-width: 991px) {
	.hero_alt-layout {
		aspect-ratio: auto;
		min-height: 360px;
	}

	.hero_alt-layout::before {
		width: 100%;
		clip-path: none;
	}

	/* .hero_alt-layout .pk-col {
		padding: 2rem var(--pk-site-gutter);
		max-width: 100%;
	} */
}

@media (max-width: 767px) {
	.hero_alt-layout {
		flex-direction: column;
		aspect-ratio: auto;
		min-height: auto;
		padding-block: 0;
		padding-inline: 0;
	}

	.hero_alt-layout .pk-hero-bg {
		position: relative;
		height: 250px;
		z-index: 1;
	}

	.hero_alt-layout .hero-bg {
		position: relative;
		inset: auto;
	}

	.hero_alt-layout::before {
		display: none;
	}

	.hero_alt-layout .pk-row {
		z-index: 10;
		background-color: var(--hero-alt-bg);
		flex: 1;
		padding-block: var(--pk-row-spacing);
	}

	.hero_alt-layout .pk-col {
		padding: 0 var(--pk-site-gutter);
		max-width: 100%;
	}

	.hero_alt-layout .pk-module.pk-text {
		font-size: 1.25rem;
	}
}