/*
	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.
*/
.ccl-widget.core-cards .slides {
	padding: 0 15px;
	gap: 34px;
}
.ccl-widget.core-cards .img-cont {
	margin-bottom: 16px;
}
.ccl-widget.core-cards .img-cont img {
	transition: all ease 0.8s;
}
.ccl-widget.core-cards .content-section,
.ccl-widget.core-cards .content-section > .inner {
	gap: 0;
}
.ccl-widget.core-cards .slide-title,
.ccl-widget.core-cards .slide-title a {
	font-size: 16px;
    font-family: var(--font-display);
    font-weight: 800;
	text-transform: capitalize;
	color: var(--charcoal);
	text-decoration: none;
	line-height: 20px;
    margin-bottom: 5px;
	letter-spacing: 0.02em;
}
.ccl-widget.core-cards p {
	font-size: 14px;
    line-height: 22px;
    letter-spacing: 0.02em;
    color: var(--light-charcoal);
    font-weight: 500;
	margin-bottom: 1px;
	margin-left: -1px;
}
.ccl-widget.core-cards .slide-footer a {
	background: none;
    padding: 0;
    color: var(--charcoal);
    font-size: 11px;
    letter-spacing: 0.036em;
    font-weight: 700;
    font-family: var(--font-body);
	display: flex;
    align-items: center;
	margin-left: 15px;
}
.ccl-widget.core-cards .slide-footer a i {
    font-size: 14.6px;
	background-image: linear-gradient(to top, var(--orange), var(--dark-pink));
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent;
    padding-left: 5px;
	padding-top: 2px;
}

@media (hover: hover) {
	.ccl-widget.core-cards .slide-title:hover,
	.ccl-widget.core-cards .slide-title a:hover {
		color: var(--light-charcoal);
	}
	.ccl-widget.core-cards .slide-footer a:hover {
		background: none;
		color: var(--light-charcoal);
	}

}

@media (min-width: 40em) {
	.ccl-widget.core-cards .inner > h3 {
        font-size: 12px;
    }
	.ccl-widget.core-cards .slide-title,
    .ccl-widget.core-cards .slide-title a {
        font-size: 20px;
        line-height: 30px;
    }
    .ccl-widget.core-cards p {
		font-size: 15px;
		line-height: 25px;
		margin-left: 0;
	}
	.ccl-widget.core-cards .slide-footer a {
		font-size: 14.74px;
		margin-left: 17.3px;
	}
	.ccl-widget.core-cards .slide-footer a i {
		font-size: 21px;
		padding-left: 3px;
		padding-top: 1px;
		transition: all ease 0.8s;
	}
}

@media (min-width: 64em) {
	.ccl-widget.core-cards p {
		font-size: 17px;
		line-height: 29px;
		padding-right: 20px;
	}
	@media (hover:hover) {
		.ccl-widget.core-cards:not(.cards-3-across) .slides .slide:hover .img-cont img {
			transform: scale(1.1);
			transition: all ease 0.8s;
		}
		.ccl-widget.core-cards:not(.cards-3-across) .slides .slide:hover .read-more i {
			transform: translateX(5px);
			transition: all ease 0.8s
		}
	}
}
