/*
	README

	Modify this file as much or as little as needed.

	This file is shared across all CCL widgets in the Cards 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-cards {
	margin-bottom: var(--widget-margin-bottom);
	padding-top: var(--widget-padding-top);
	position: relative;
}

.core-cards[data-graphic="true"] {
	margin-top: 60px;
}

.core-cards[data-graphic="true"]:before {
	content: '';
	position: absolute;
	top: -80px;
	left: -15%;
	background-image: url('/includes/public/assets/shared/crystal-salt-lake-scene.svg');
	background-size: cover;
	background-repeat: no-repeat;
	width: 255px;
	height: 267px;
	pointer-events: none;
}

.ccl-widget.core-cards .slides {
	padding: 0 30px;
	gap: var(--space-8);
}

.core-cards .slide .slide-title {
	font-size: 20px;
	color: #363636;
}

.core-cards .slide p {
	font-size: var(--text-lg);
	line-height: var(--leading-tight);
}

.ccl-widget.core-cards .slide .slide-footer a {
	font-size: 14px;
	background: transparent;
	color: #363636;
	font-family: 'pitch-sans-web-bold';
	text-transform: uppercase;
	padding: 20px 46px 20px 0;
	letter-spacing: var(--tracking-tight);
}

.core-cards .slide .slide-footer .line-btn .arrow,
.core-cards .slide .slide-footer .line-btn:before,
.core-cards .slide .slide-footer .line-btn:after {
	background-color: var(--teal);
}

body.blue .core-cards .slide .slide-footer .line-btn .arrow,
body.blue .core-cards .slide .slide-footer .line-btn:before,
body.blue .core-cards .slide .slide-footer .line-btn:after {
	background-color: var(--blue-light);
}

.core-cards .slide .slide-footer .line-btn {
	margin-top: -22px;
}

.ccl-widget.core-cards .slide .content-section .description,
.ccl-widget.core-cards .slide .content-section .description p {
	font-size: 16px;
	line-height: var(--leading-relaxed);
	color: #363636;
}

.ccl-widget.core-cards .slide .img-cont {
	margin-bottom: 14px;
}

.ccl-widget.core-cards .slide.is-dtn .img-cont {
	margin-bottom: 4px;
}

.ccl-widget.core-cards .slide .content-section {
	gap: 10px;
}

.ccl-widget.core-cards .slide .content-section > .inner {
	gap: var(--space-2);
}

.ccl-widget.core-cards .slide .content-section > .inner {
	gap: var(--space-2);
}

.core-cards .slide .sponsored-label {
	color: #999999;
	text-transform: uppercase;
	font-size: 16px;
	font-family: 'pitch-sans-web-bold';
	position: relative;
	top: 12px;
}

@media(hover:hover) {
	.core-cards .slide .slide-title:hover,
	.core-cards .slide .slide-title > a:hover {
		color: #363636;
	}

	.ccl-widget.core-cards .slide .slide-footer a:hover {
		background: transparent;
		color: #363636;
	}

	.dark-panel .core-cards .slide .slide-title:hover,
	.dark-panel .core-cards .slide .slide-title > a:hover {
		color: var(--white);
	}
}

@media(min-width:40em) {
	.core-cards[data-graphic="true"]:before {
		background-image: url('/includes/public/assets/shared/crystal-collections.svg');
		width: 300px;
		height: 290px;
		left: -45px;
		top: -70px;
		transform: rotate(110deg);
	}
}

@media(min-width:64em) {
	.ccl-widget.core-cards .slides {
		max-width: 1393px;
		padding: 0 35px;
	}

	.core-cards .slide .slide-footer .line-btn {
		margin-top: -2px;
	}

	.ccl-widget.core-cards .slide .img-cont {
		margin-bottom: 27px;
	}

	.ccl-widget.core-cards .slide.is-dtn .img-cont {
		margin-bottom: 15px;
	}

	.core-cards .slide .sponsored-label {
		top: 10px;
	}

	.ccl-widget.core-cards .slide .content-section .description,
	.ccl-widget.core-cards .slide .content-section .description p {
		line-height: 1.4;
		margin-top: 10px;
	}

	.ccl-widget.core-cards .slide .content-section {
		gap: 0;
	}

	.core-cards .slide .slide-title {
		font-size: 30px;
		line-height: 1.1;
	}

	.ccl-widget.core-cards .slide .slide-footer a {
		font-size: 20px;
	}
}