.cta-banner {
	position: relative;
	color: var(--color-white);
}

.bg-white + .cta-banner--fixed-width {
    margin-top: 0;
}

.cta-banner__overlay {
	position: relative;
}

.cta-banner .cta-banner__overlay:after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.cta-banner--red-bg .cta-banner__overlay:after {
	background: rgba(148, 11, 34, 0.85);
}

.cta-banner--black-bg .cta-banner__overlay:after {
	background: rgba(16, 16, 16, 0.85);
}

.cta-banner__overlay {
	position: relative;
	z-index: 1;
}

.cta-banner--fixed-width .cta-banner__overlay:after {
	display: none;
}

.cta-banner__overlay__text {
	z-index: 2;
	position: relative;
	padding: 65px 0;
}

.cta-banner__bg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cta-banner__overlay__wrapper {
	position: relative;
	margin: 0 -22px;
	padding: 0 24px;
}

.cta-banner--fixed-width .cta-banner__overlay__wrapper:after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.cta-banner--red-bg.cta-banner--fixed-width
	.cta-banner__overlay__wrapper:after {
	background: rgba(148, 11, 34, 0.85);
}

.cta-banner--black-bg.cta-banner--fixed-width
	.cta-banner__overlay__wrapper:after {
	background: rgba(16, 16, 16, 0.85);
}

.cta-banner__overlay
	:is(h2, h3, h4, h5, h6, .h2, .h3, .h4, .h5, .h6, .sub-heading, a) {
	color: var(--color-white);
}

.cta-banner--fixed-width .cta-banner__overlay__text {
	text-align: center;
}

.cta-banner--fixed-width .btn-group {
	justify-content: center;
}

.cta-banner__overlay p {
	line-height: 1.5em;
}

.cta-banner__overlay .btn-primary {
	color: var(--color-black);
	background: var(--color-white);
}

.cta-banner__overlay .btn-secondary {
	color: var(--color-black);

	&:hover {
		color: var(--color-white);
		box-shadow: 0 0 0 2px var(--color-white);
	}
}

.cta-banner__overlay .btn-primary::before {
	background: var(--color-gray-500);
}

.cta-banner__overlay .btn-tertiary {
	color: var(--color-white);
}

.cta-banner__overlay__text p strong {
	font-weight: normal;
	font-family: var(--title-font-family);
}

@media (min-width: 768px) {
	.cta-banner__overlay__wrapper {
		margin: 0;
		padding: 0;
	}

	.cta-banner--fixed-width .cta-banner__overlay__wrapper {
		padding: 0 24px 0 27px;
	}

	.cta-banner__overlay__text {
		padding: 80px 0;
	}

	.cta-banner--fixed-width .cta-banner__overlay__text {
		text-align: left;
	}

	.cta-banner--fixed-width .btn-group {
		justify-content: flex-start;
	}

	.cta-banner--fixed-width {
		margin: 80px 0;
	}
}

@media (min-width: 1200px) {
	.cta-banner__overlay__text {
		padding: 115px 0;
	}

	.cta-banner--full-width .cta-banner__overlay__text {
		max-width: 777px;
		margin: 0 auto;
	}

	.cta-banner--fixed-width .cta-banner__overlay__wrapper {
		padding: 0 133px 0 133px;
	}

	.cta-banner--fixed-width .container {
		max-width: 1574px;
	}

	.cta-banner--fixed-width {
		margin: 115px 0;
	}

	.cta-banner--fixed-width .btn-group {
		width: 293px;
		position: absolute;
		right: 0;
		top: 50%;
		transform: translate(0, -50%);
		margin: 0;
	}

	.cta-banner--fixed-width .cta-banner__overlay__text {
		text-align: left;
		padding: 115px 358px 115px 0;
	}

	.cta-banner__overlay h2 {
		line-height: 1.2em;
		margin: 0 0 15px;
	}

	.cta-banner__overlay p {
		margin: 0;
	}

	.cta-banner__overlay .btn-primary:hover {
		color: var(--color-white);
		background: transparent;
		box-shadow: 0 0 0 2px var(--color-white);
	}

	.cta-banner__overlay .btn-primary:hover::before {
		background: rgba(255, 255, 255, 0.2);
	}

	.cta-banner__overlay .btn-tertiary:hover {
		color: rgba(255, 255, 255, 0.7);
	}
}

@media (min-width: 1500px) {
	.cta-banner--fixed-width .cta-banner__overlay__text {
		padding: 115px 438px 115px 0;
	}
}
