.itlu-hero-slider {
	--itlu-hero-enter-x: 2rem;
	--itlu-hero-control-color: var(--itlu-color-text-on-media);
	--itlu-hero-control-background: color-mix(in srgb, var(--itlu-color-text) 56%, transparent);
	--itlu-hero-control-border: color-mix(in srgb, var(--itlu-color-text-on-media) 48%, transparent);

	position: relative;
	overflow: hidden;
	background: var(--itlu-color-surface-alt);
	isolation: isolate;
}

.itlu-hero-slider[data-carousel-direction="previous"] {
	--itlu-hero-enter-x: -2rem;
}

.itlu-hero-slider__progress {
	position: absolute;
	z-index: 6;
	inset-inline: 0;
	block-size: 0.3rem;
	overflow: hidden;
	background: color-mix(in srgb, var(--itlu-color-text-on-media) 28%, transparent);
	pointer-events: none;
}

.itlu-hero-slider__progress::after {
	position: absolute;
	inset: 0;
	background: var(--itlu-color-primary);
	content: "";
	transform: scaleX(0);
	transform-origin: left;
}

.itlu-hero-slider__progress--top {
	inset-block-start: 0;
}

.itlu-hero-slider__progress--bottom {
	inset-block-end: 0;
}

.itlu-hero-slider.is-autoplaying .itlu-hero-slider__progress::after {
	animation: itlu-hero-slider-progress 7s linear both;
}

.itlu-hero-slider.is-enhanced .itlu-hero-slider__track {
	display: grid;
}

.itlu-hero-slider.is-enhanced .itlu-hero-slider__slide {
	grid-area: 1 / 1;
}

.itlu-hero-slider__slide {
	display: grid;
	position: relative;
	min-block-size: clamp(30rem, 58vw, 45rem);
	overflow: hidden;
	isolation: isolate;
}

.itlu-hero-slider__media,
.itlu-hero-slider__media :where(picture, img) {
	position: absolute;
	z-index: -2;
	inset: 0;
	inline-size: 100%;
	block-size: 100%;
}

.itlu-hero-slider__media img {
	display: block;
	object-fit: cover;
}

/* Only the opt-in panorama mode moves the photograph independently of its text. */
.itlu-hero-slider[data-carousel-animation="pan-zoom"].is-enhanced .itlu-hero-slider__media img {
	animation: itlu-hero-photo-zoom 14s ease-in-out infinite alternate both;
	animation-play-state: paused;
}

.itlu-hero-slider[data-carousel-animation="pan-zoom"].is-enhanced .itlu-hero-slider__slide:nth-child(even) .itlu-hero-slider__media img {
	animation-direction: alternate-reverse;
}

.itlu-hero-slider[data-carousel-animation="pan-zoom"].is-autoplaying .is-current .itlu-hero-slider__media img {
	animation-play-state: running;
}

.itlu-hero-slider[data-carousel-animation="pan-zoom"] .itlu-hero-slider__slide[hidden] .itlu-hero-slider__media img {
	animation: none;
}

.itlu-hero-slider .itlu-hero-slider__pause[hidden] {
	display: none;
}

@keyframes itlu-hero-photo-zoom {
	from {
		transform: scale(1);
	}

	to {
		transform: scale(1.06);
	}
}

.itlu-hero-slider__slide.has-overlay::after {
	position: absolute;
	z-index: -1;
	inset: 0;
	background: var(--itlu-media-overlay);
	content: "";
}

.itlu-hero-slider__content {
	display: grid;
	align-items: center;
	inline-size: 100%;
	padding-block: clamp(var(--itlu-space-7), 8vw, var(--itlu-space-9)) clamp(8rem, 15vw, 10rem);
}

.itlu-hero-slider__content-inner {
	max-inline-size: 46rem;
	padding: clamp(var(--itlu-space-5), 5vw, var(--itlu-space-8));
}

.itlu-hero-slider__content-inner :where(h1, h2) {
	max-inline-size: 16ch;
	margin-block: 0 var(--itlu-space-4);
	font-size: clamp(2.25rem, 5vw, var(--itlu-font-size-display));
	line-height: 1.04;
}

.itlu-hero-slider__text {
	max-inline-size: 38rem;
	font-size: var(--itlu-font-size-lead);
}

.itlu-hero-slider__text > :first-child {
	margin-block-start: 0;
}

.itlu-hero-slider__text > :last-child {
	margin-block-end: 0;
}

.itlu-hero-slider__slide--center .itlu-hero-slider__content-inner {
	justify-self: center;
	text-align: center;
}

.itlu-hero-slider__slide--center .itlu-hero-slider__content-inner :where(h1, h2) {
	margin-inline: auto;
}

.itlu-hero-slider__slide--right .itlu-hero-slider__content-inner {
	justify-self: end;
	text-align: end;
}

.itlu-hero-slider__slide--right .itlu-hero-slider__content-inner :where(h1, h2) {
	margin-inline-start: auto;
}

.itlu-hero-slider__slide.has-media .itlu-hero-slider__content-inner,
.itlu-hero-slider__slide.has-media :where(h1, h2, p) {
	color: var(--itlu-color-text-on-media);
}

.itlu-hero-slider__slide:not(.has-media) {
	background: linear-gradient(135deg, var(--itlu-color-primary), var(--itlu-color-secondary));
}

.itlu-hero-slider__slide:not(.has-media) .itlu-hero-slider__content-inner,
.itlu-hero-slider__slide:not(.has-media) :where(h1, h2, p) {
	color: var(--itlu-color-primary-contrast);
}

.itlu-hero-slider__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--itlu-space-3);
	margin-block-start: var(--itlu-space-5);
}

.itlu-hero-slider__slide--center .itlu-hero-slider__actions {
	justify-content: center;
}

.itlu-hero-slider__slide--right .itlu-hero-slider__actions {
	justify-content: end;
}

.itlu-hero-slider__footer {
	display: none;
	position: absolute;
	z-index: 4;
	inset-inline: 0;
	inset-block-end: clamp(var(--itlu-space-4), 4vw, var(--itlu-space-7));
	inline-size: 100%;
}

.itlu-hero-slider.is-enhanced .itlu-hero-slider__footer {
	display: block;
}

.itlu-hero-slider .itlu-hero-slider__controls {
	display: grid;
	grid-template-columns: auto minmax(5rem, 1fr) auto auto;
	align-items: center;
	gap: var(--itlu-space-3);
	margin: 0;
	color: var(--itlu-hero-control-color);
}

.itlu-hero-slider__arrows {
	display: flex;
	gap: var(--itlu-space-2);
}

.itlu-hero-slider :is(.itlu-hero-slider__arrow, .itlu-hero-slider__pause) {
	display: inline-grid;
	place-items: center;
	inline-size: var(--itlu-control-min-height);
	block-size: var(--itlu-control-min-height);
	padding: var(--itlu-space-2);
	border: var(--itlu-border-width) solid var(--itlu-hero-control-border);
	border-radius: var(--itlu-radius-pill);
	color: var(--itlu-hero-control-color);
	background: var(--itlu-hero-control-background);
	box-shadow: none;
	backdrop-filter: blur(0.5rem);
}

.itlu-hero-slider :is(.itlu-hero-slider__arrow, .itlu-hero-slider__pause):hover {
	border-color: var(--itlu-hero-control-color);
	color: var(--itlu-hero-control-color);
	background: color-mix(in srgb, var(--itlu-hero-control-background) 82%, var(--itlu-hero-control-color));
}

.itlu-hero-slider :is(.itlu-hero-slider__arrow, .itlu-hero-slider__pause) svg {
	inline-size: 1.35rem;
	block-size: 1.35rem;
}

.itlu-hero-slider__play-icon,
.itlu-hero-slider__pause[aria-pressed="true"] .itlu-hero-slider__pause-icon {
	display: none;
}

.itlu-hero-slider__pause[aria-pressed="true"] .itlu-hero-slider__play-icon {
	display: block;
}

.itlu-hero-slider__pagination {
	display: flex;
	min-inline-size: 0;
	max-inline-size: 32rem;
}

.itlu-hero-slider .itlu-hero-slider__pagination-item {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: var(--itlu-space-2);
	align-items: end;
	min-inline-size: 2.75rem;
	min-block-size: var(--itlu-control-min-height);
	padding: var(--itlu-space-2);
	border: 0;
	border-radius: 0;
	color: inherit;
	background: transparent;
	box-shadow: none;
	font-size: var(--itlu-font-size-small);
	text-align: start;
}

.itlu-hero-slider .itlu-hero-slider__pagination-item:hover {
	color: inherit;
	background: color-mix(in srgb, var(--itlu-hero-control-background) 70%, transparent);
}

.itlu-hero-slider__pagination-index {
	font-weight: var(--itlu-font-weight-strong);
}

.itlu-hero-slider__pagination-label {
	display: none;
	min-inline-size: 0;
	overflow: hidden;
	font-weight: var(--itlu-font-weight-medium);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.itlu-hero-slider__pagination--thumbnails {
	gap: var(--itlu-space-2);
	max-inline-size: 38rem;
	overflow-x: auto;
	padding: var(--itlu-space-1);
	scrollbar-width: thin;
	scroll-snap-type: x proximity;
}

.itlu-hero-slider .itlu-hero-slider__pagination--thumbnails .itlu-hero-slider__pagination-item {
	flex: 0 0 clamp(6rem, 9vw, 8.5rem);
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	padding: var(--itlu-space-1);
	border: var(--itlu-border-width) solid var(--itlu-hero-control-border);
	border-radius: var(--itlu-radius-sm);
	background: var(--itlu-hero-control-background);
	scroll-snap-align: start;
}

.itlu-hero-slider__thumbnail {
	grid-column: 1 / -1;
	display: block;
	position: relative;
	inline-size: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: calc(var(--itlu-radius-sm) / 2);
	background: var(--itlu-color-surface-alt);
}

.itlu-hero-slider__thumbnail :where(picture, img) {
	display: block;
	inline-size: 100%;
	block-size: 100%;
}

.itlu-hero-slider__thumbnail img {
	object-fit: cover;
}

.itlu-hero-slider__pagination--thumbnails .itlu-hero-slider__pagination-item[aria-current="true"] {
	border-color: currentcolor;
	box-shadow: 0 0 0 var(--itlu-border-width) currentcolor;
}

.itlu-hero-slider__pagination-progress {
	grid-column: 1 / -1;
	position: relative;
	block-size: var(--itlu-border-width-prominent);
	overflow: hidden;
	background: var(--itlu-hero-control-border);
}

.itlu-hero-slider__pagination-progress::after {
	position: absolute;
	inset: 0;
	background: currentcolor;
	content: "";
	transform: scaleX(0);
	transform-origin: left;
}

.itlu-hero-slider__pagination-item[aria-current="true"] .itlu-hero-slider__pagination-progress::after {
	transform: scaleX(1);
}

.itlu-hero-slider.is-autoplaying .itlu-hero-slider__pagination-item[aria-current="true"] .itlu-hero-slider__pagination-progress::after {
	animation: itlu-hero-slider-progress 7s linear both;
}

.itlu-hero-slider.is-autoplaying:is(:hover, :focus-within) .itlu-hero-slider__pagination-item[aria-current="true"] .itlu-hero-slider__pagination-progress::after {
	animation-play-state: paused;
}

.itlu-hero-slider__counter {
	margin: 0;
	font-variant-numeric: tabular-nums;
	font-weight: var(--itlu-font-weight-strong);
	white-space: nowrap;
}

.itlu-hero-slider[data-carousel-animation="slide"]:not([data-carousel-loop="true"]).is-enhanced .itlu-hero-slider__slide:not([hidden]) {
	animation: itlu-hero-slider-slide-in 650ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.itlu-hero-slider[data-carousel-animation="fade"]:not([data-carousel-loop="true"]).is-enhanced .itlu-hero-slider__slide:not([hidden]) {
	animation: itlu-hero-slider-fade-in 600ms ease-out both;
}

.itlu-hero-slider[data-carousel-animation="zoom"]:not([data-carousel-loop="true"]).is-enhanced .itlu-hero-slider__slide:not([hidden]) {
	animation: itlu-hero-slider-zoom-in 700ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.itlu-hero-slider[data-carousel-animation="none"].is-enhanced :is(.itlu-hero-slider__slide, .itlu-hero-slider__media img, .itlu-hero-slider__content-inner) {
	animation: none;
}

.itlu-hero-slider :where(a, button):focus-visible {
	outline: var(--itlu-focus-width) solid var(--itlu-color-focus);
	outline-offset: var(--itlu-focus-offset);
}

@keyframes itlu-hero-slider-slide-in {

	from {
		opacity: 0.55;
		transform: translateX(var(--itlu-hero-enter-x));
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes itlu-hero-slider-fade-in {

	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes itlu-hero-slider-zoom-in {

	from {
		opacity: 0;
		transform: scale(1.035);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes itlu-hero-slider-progress {

	from {
		transform: scaleX(0);
	}

	to {
		transform: scaleX(1);
	}
}

@media (max-width: 48rem) {

	.itlu-hero-slider__pagination--thumbnails {
		max-inline-size: none;
	}

	.itlu-hero-slider .itlu-hero-slider__pagination--thumbnails .itlu-hero-slider__pagination-item {
		flex-basis: 5rem;
	}

	.itlu-hero-slider__pagination--thumbnails .itlu-hero-slider__pagination-label {
		display: none;
	}

	.itlu-hero-slider__slide {
		min-block-size: 38rem;
	}

	.itlu-hero-slider__content {
		padding-block-end: 9rem;
	}

	.itlu-hero-slider__content-inner {
		padding-inline: var(--itlu-space-4);
	}

	.itlu-hero-slider__content-inner :where(h1, h2) {
		font-size: clamp(2rem, 11vw, 3.5rem);
	}

	.itlu-hero-slider .itlu-hero-slider__controls {
		grid-template-columns: auto minmax(4rem, 1fr) auto;
	}

	.itlu-hero-slider__counter {
		display: none;
	}

	.itlu-hero-slider__pagination-item {
		flex: 1;
	}

	.itlu-hero-slider__pagination-index {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {

	.itlu-hero-slider[data-carousel-animation="pan-zoom"].is-enhanced .itlu-hero-slider__media img {
		animation: none;
		transform: none;
	}

	.itlu-hero-slider *,
	.itlu-hero-slider *::before,
	.itlu-hero-slider *::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

@media (forced-colors: active) {

	.itlu-hero-slider :is(.itlu-hero-slider__arrow, .itlu-hero-slider__pause, .itlu-hero-slider__pagination-item) {
		border: var(--itlu-border-width) solid ButtonText;
	}
}
