/*
	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);
}

.ccl-widget.core-cards .widget-header {
	max-width: 1200px;
}

.ccl-widget.core-cards .widget-header-inner {
	border: none;
    padding: unset;
}
.ccl-widget.core-cards .widget-title {
	font-size: var(--text-4xl-half);
	line-height: var(--leading-none);
	text-transform: uppercase;
	letter-spacing: 0.01em;
}

.ccl-widget.core-cards .blog-feed-header,
.ccl-widget.core-cards .slide .slide-footer button.qv-btn,
.ccl-widget.core-cards .mini-date-section {
    display: none;
}

.ccl-widget.core-cards .slides {
	gap: var(--space-8);
	max-width: 1200px;
}

.ccl-widget.core-cards .slide .img-cont {
    margin-bottom: var(--space-2);
}

.ccl-widget.core-cards .slide .content-section {
	gap: var(--space-3);
}
.ccl-widget.core-cards .slide .content-section > .inner {
	gap: var(--space-2);
}

.ccl-widget.core-cards .slide .slide-title {
	font-family: var(--font-body);
	font-size: var(--text-lg);
	letter-spacing: var(--tracking-wide);
	line-height: var(--leading-snug);
}

.ccl-widget.core-cards .slide p {
	font-size: var(--text-lg);
	line-height: var(--leading-normal);
	letter-spacing: var(--tracking-wide);
	font-weight: 400;
}

.ccl-widget.core-cards .slide .slide-footer {
	display: block;
	margin: unset;
}

.ccl-widget.core-cards .slide a.read-more {
	display: inline-block;
	font-size: 1.0625rem;
	line-height: var(--leading-none);
	font-weight: 700;
    background: transparent;
    color: var(--black-22);
	border-bottom: 2px solid var(--light-green);
	padding: 4px 30px 3px 8px;
	min-width: 122px;
	margin: unset;
}

.ccl-widget.core-cards .slide a.read-more::after {
    color: var(--black-22);
	font-size: 19px;
	right: 9px;
}

@media (hover : hover) {
	.ccl-widget.core-cards .slide a.read-more:hover {
		background-color: var(--light-green);
		color: currentColor
	}
}

@media (min-width: 64em) {
	.ccl-widget.core-cards .widget-header {
        margin-bottom: var(--space-8);
    }
    .ccl-widget.core-cards .widget-title {
        font-size: var(--text-6xl);
    }
	.ccl-widget.core-cards .slides {
		gap: 20px;
	}
	.core-cards .slide .slide-title {
		font-size: var(--text-2xl);
	}
	.ccl-widget.core-cards .slide a.read-more {
		font-size: var(--text-2xl);
		padding: 3px 30px 6px 8px;
	}
	.ccl-widget.core-cards .slide a.read-more::after {
		font-size: 24px;
		right: 9px;
	}
}