/*==============================*/
/*=====----- TEMPLATE -----=====*/
/*==============================*/

.editorial-marquee {
	position: relative;
	container-type: inline-size;
	margin-bottom: 60px;
	color: var(--gray-dark);
}

.editorial-marquee .widget-inner {
	position: relative;
	z-index: 2;
}

.editorial-marquee .template-header {
	padding: 0 15px;
	margin-bottom: 20px;
}

.editorial-marquee .template-title {
	margin: 0;
	font-family: var(--font-barlow-condensed);
	font-weight: bold;
	font-size: 3rem;
	line-height: 1;
	text-transform: uppercase;
	color: inherit;
}

.editorial-marquee .view-all {
	display: block;
	padding: 10px;
	margin: 0;
	font-family: var(--font-display);
	font-weight: bold;
	font-size: var(--text-lg);
	line-height: 1.5;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	text-decoration: none;
	text-align: center;
	color: var(--white);
	background: var(--gray-dark);
	border: none;
}

.editorial-marquee .slides {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 30px;
	align-items: start;
	padding-bottom: 30px;
	background: var(--gray-light);
}

.editorial-marquee .image-slides {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px 11px;
}

.editorial-marquee .text-slides {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 22px;
	padding: 0 15px;
}

/*============================*/
/*=====----- SLIDES -----=====*/
/*============================*/

.editorial-marquee .slide,
.editorial-marquee .img-cont,
.editorial-marquee .slide-img {
	position: relative;
	z-index: 1;
}

.editorial-marquee .slide.primary,
.editorial-marquee .slide.minor {
	grid-column: span 2;
}

.editorial-marquee .img-cont {
	overflow: hidden;
}

.editorial-marquee .img-cont::before {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: block;
	content: '';
	background: radial-gradient(100% 29.6% at 100% 0%, rgba(0, 0, 0, 0.60) 42.34%, rgba(0, 0, 0, 0.00) 100%), linear-gradient(180deg, rgba(0, 0, 0, 0.00) 62.93%, rgba(0, 0, 0, 0.60) 76.8%);
	pointer-events: none;
}

.editorial-marquee .slide-img {
	width: 100%;
	object-fit: cover;
}

.editorial-marquee .logo-overlay {
	position: absolute;
	inset: 20px 20px auto auto;
	z-index: 3;
	width: 150px;
	height: auto;
	pointer-events: none;
}

.editorial-marquee .content-section {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: start;
	justify-items: start;
}

.editorial-marquee .info-flag {
	margin: 0;
}

.editorial-marquee .slide-title {
	margin: 0;
	font-family: var(--font-display);
	font-weight: bold;
	line-height: 1;
	color: inherit;
}

.editorial-marquee .details {
	color: inherit;
}

.editorial-marquee .info-item .icon {
	font-weight: 400;
	color: var(--blue-mid);
}

/*----- primary slide -----*/

.editorial-marquee .slide.primary {
	color: var(--white);
}

.editorial-marquee .slide.primary .content-section {
	position: absolute;
	inset: auto 0 0;
	z-index: 3;
	gap: 15px;
	padding: 20px 15px;
	pointer-events: none;
}

.editorial-marquee .slide.primary .content-section a,
.editorial-marquee .slide.primary .content-section button {
	pointer-events: all;
}

.editorial-marquee .slide.primary .info-flag {
	color: inherit;
	border-color: currentColor;
}

.editorial-marquee .slide.primary .slide-title {
	font-size: 1.875rem;
}

.editorial-marquee .slide.primary .info-item .icon {
	color: inherit;
}

/*----- secondary slides -----*/

.editorial-marquee .slide.secondary {
	padding-left: 15px;
}

.editorial-marquee .slide.secondary > .inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: start;
}

.editorial-marquee .slide.secondary + .slide.secondary {
	padding-left: 0;
	padding-right: 15px;
}

.editorial-marquee .slide.secondary .img-cont {
	margin-bottom: 10px;
}

.editorial-marquee .slide.secondary .info-flag {
	position: absolute;
	inset: auto auto 10px 8px;
	z-index: 2;
	max-width: calc(100% - 16px);
	color: var(--white);
	border-color: currentColor;
	pointer-events: none;
}

.editorial-marquee .slide.secondary .content-section {
	gap: 10px;
	order: 1;
}

.editorial-marquee .slide.secondary .slide-title {
	font-size: 1.3125rem;
}

/*----- minor slides -----*/

.editorial-marquee .slide.minor {
	padding-bottom: 20px;
	border-bottom: 1px solid var(--gray-mid-light);
}

.editorial-marquee .slide.minor:last-child {
	padding-bottom: 0;
	border-bottom: none;
}

.editorial-marquee .slide.minor .content-section {
	gap: 10px;
}

.editorial-marquee .slide.minor .slide-title {
	font-size: var(--text-lg);
}

/*===================================*/
/*=====----- MEDIA QUERIES -----=====*/
/*===================================*/

@container (min-width: 40em) {
	.editorial-marquee .image-slides {
		grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
		gap: 20px;
	}

	.editorial-marquee .text-slides {
		padding: 0 20px;
	}

	.editorial-marquee .slide.primary {
		grid-column: unset;
		grid-row: span 2;
	}

	.editorial-marquee .slide.primary > .inner,
	.editorial-marquee .slide.primary .img-cont,
	.editorial-marquee .slide.primary .slide-img {
		width: 100%;
		height: 100%;
	}

	.editorial-marquee .slide.secondary,
	.editorial-marquee .slide.secondary + .slide.secondary {
		padding: 0;
	}
	
	.editorial-marquee .slide.secondary {
		grid-column: 2;
		margin-right: 20px;
	}
}

@container (min-width: 64em) {
	.editorial-marquee.no-title .widget-inner {
		padding-top: 87px;
	}

	.editorial-marquee .widget-inner::before {
		position: absolute;
		inset: 60px 0 40px 40%;
		z-index: -1;
		display: block;
		content: '';
		background: var(--gray-light);
		pointer-events: none;
	}

	.editorial-marquee.no-title .widget-inner::before {
		top: 0;
	}

	.editorial-marquee .template-header {
		padding: 0 46px;
		margin-bottom: 27px;
	}

	.editorial-marquee .template-title {
		font-size: 7.5rem;
	}

	.editorial-marquee .template-footer {
		width: 60%;
		margin: 45px 0 0 auto;
	}

	.editorial-marquee .view-all {
		padding: 18px;
	}

	.editorial-marquee .slides {
		grid-template-columns: 75.18% minmax(0, 1fr);
		gap: 60px;
		padding-right: 50px;
		background: none;
	}
	
	.editorial-marquee .image-slides {
		grid-template-columns: 67% minmax(0, 1fr);
		gap: 40px 60px;
		align-items: start;
	}

	.editorial-marquee .text-slides {
		gap: 30px;
		padding: 0;
	}

	.editorial-marquee .logo-overlay {
		inset: 40px 40px auto auto;
		width: 280px;
	}

	/*----- primary slide -----*/

	.editorial-marquee .slide.primary .content-section {
		padding: 40px;
	}

	.editorial-marquee .slide.primary .slide-title {
		font-size: 3.125rem;
	}

	/*----- secondary slides -----*/

	.editorial-marquee .slide.secondary {
		margin: 0;
	}

	.editorial-marquee .slide.secondary .info-flag {
		inset: auto auto 20px 20px;
		max-width: calc(100% - 40px);
	}

	.editorial-marquee .slide.secondary .content-section {
		gap: 15px;
	}

	.editorial-marquee .slide.secondary .slide-title {
		font-size: 1.8125rem;
	}

	/*----- minor slides -----*/

	.editorial-marquee .slide.minor .slide-title {
		font-size: 1.5rem;
	}
}

@media (min-width: 64em) {
	.editorial-marquee {
		margin-bottom: 90px;
	}
}