/*
	README

	Modify this file as much or as little as needed.

	This file is shared across all CCL widgets in the Slider family. This enables the ability to
	a family of widgets in a single update without touching the structure of the widget and without needing
	to duplicate efforts across several widget-specific CSS files.
*/

.core-hero-image .img-cont:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0) 40%);
	pointer-events: none;
}

.core-hero-image .slide p {
	font-size: var(--text-base);
	font-weight: normal;
}

.core-hero-image .read-more {
	font-weight: 700;
	color: var(--text-color);
}

.ccl-widget.core-hero-image .slide .slide-title {
	font-size: 30px;
	line-height: 38px;
	letter-spacing: 0.015em;
	font-family: var(--font-display);
	max-width: 100%;
}

.ccl-widget.core-hero-image .slide .content-section {
	padding: 18px 13px 18px var(--space-4);
}

.ccl-widget.core-hero-image .slide .img-cont:after {
	bottom: -40%;
	left: -50%;
	width: 140%;
	background: radial-gradient(at 60%, #000000b8, transparent, transparent);
}

@media (min-width: 64em) {
	.ccl-widget.core-hero-image .slide .img-cont:after {
		bottom: -50%;
		left: -50%;
		width: 100%;
		background: radial-gradient(at 60%, #000000b8, transparent, transparent);
	}

	.ccl-widget.core-hero-image .slide .content-section {
		margin-left: 51px;
		max-width: 570px;
	}

	.ccl-widget.core-hero-image .slide .slide-title {
		font-size: 34px;
		letter-spacing: 0.025em;
		line-height: 48px;
	}
}

.ccl-widget.core-hero-image .slide .subtitle {
	display: none;
}

/* Homepage variant */

.ccl-widget.core-hero-image.homepage .slide .subtitle {
	display: block;
	font-family: 'Avenir LT W01_65 Medium1475532';
	color: #fff;
	font-size: 22px;
	letter-spacing: 0.015em;
	line-height: 28px;
}

.ccl-widget.core-hero-image.homepage .slide .content-section {
	position: absolute;
	top: calc(50% - 17px);
	left: 50%;
	transform: translate(-50%, -50%);
	height: max-content;
	text-align: center;
	max-width: 334px;
}

.ccl-widget.core-hero-image.homepage .slide .content-section:after {
	content: "";
	position: absolute;
	bottom: -9px;
	left: 50%;
	transform: translateX(-50%);
	width: 74px;
	height: 4px;
	background: var(--blue);
}

.ccl-widget.core-hero-image.homepage .slide .slide-title a,
.ccl-widget.core-hero-image.homepage .slide .slide-title {
	font-size: 34px;
	line-height: 40px;
	letter-spacing: 0.025em;
	margin-bottom: 10px;
	text-transform: uppercase;
}

.ccl-widget.core-hero-image.homepage .slide .img-cont:after {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 130%;
	background: radial-gradient(at 50% 50%, #0000006b, transparent, transparent);
	height: 130%;
}

@media (min-width: 64em) {
	.ccl-widget.core-hero-image.homepage .slide .content-section {
		margin-left: 0;
		max-width: 700px;
		top: calc(50% + 5px);
	}

	.ccl-widget.core-hero-image.homepage .slide .title-desc-container {
		max-width: initial;
		margin: 0 auto;
	}

	.ccl-widget.core-hero-image.homepage .slide .slide-title {
		font-size: 64px;
		line-height: 62px;
		font-family: var(--font-body);
		font-weight: 100;
		margin-bottom: 13px;
		font-weight: 800;
		letter-spacing: 0.043em;
	}

	.ccl-widget.core-hero-image.homepage .slide .subtitle {
		font-size: 24px;
		line-height: 34px;
		max-width: 440px;
		margin: 0 auto;
	}

	.ccl-widget.core-hero-image.homepage .slide .content-section:after {
		bottom: -10px;
	}
}