.hiac-carousel {
	box-sizing: border-box;
	position: relative;
	width: min(100%, var(--hiac-width));
	margin-inline: auto;
	font-family: inherit;
}

.hiac-carousel *,
.hiac-carousel *::before,
.hiac-carousel *::after { box-sizing: border-box; }

.hiac-stage { position: relative; }

.hiac-viewport {
	position: relative;
	width: 100%;
	aspect-ratio: var(--hiac-ratio);
	overflow: hidden;
	background: transparent;
}

.hiac-slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.hiac-slide.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	z-index: 1;
}

.hiac-slide.is-leaving {
	opacity: 1;
	visibility: visible;
	z-index: 1;
}

.hiac-slide.is-entering-from-right { animation: hiac-in-from-right 450ms ease both; }
.hiac-slide.is-entering-from-left { animation: hiac-in-from-left 450ms ease both; }
.hiac-slide.is-leaving-to-left { animation: hiac-out-to-left 450ms ease both; }
.hiac-slide.is-leaving-to-right { animation: hiac-out-to-right 450ms ease both; }

@keyframes hiac-in-from-right { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes hiac-in-from-left { from { transform: translateX(-100%); } to { transform: translateX(0); } }
@keyframes hiac-out-to-left { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@keyframes hiac-out-to-right { from { transform: translateX(0); } to { transform: translateX(100%); } }

.hiac-slide iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	pointer-events: none;
	user-select: none;
}

.hiac-arrow {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(0, 0, 0, .68);
	color: #fff;
	font: 32px/1 Arial, sans-serif;
	cursor: pointer;
	transform: translateY(-50%);
}

.hiac-arrow:hover { background: rgba(0, 0, 0, .88); }
.hiac-arrow:focus-visible,
.hiac-dot:focus-visible { outline: 3px solid #2271b1; outline-offset: 2px; }
.hiac-prev { left: -44px; }
.hiac-next { right: -44px; }

.hiac-controls {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 30px;
	padding-top: 8px;
}

.hiac-dots { display: flex; align-items: center; gap: 7px; }
.hiac-dot {
	width: 10px;
	height: 10px;
	padding: 0;
	border: 1px solid #333;
	border-radius: 50%;
	background: transparent;
	cursor: pointer;
}
.hiac-carousel .hiac-dot.is-active,
.hiac-carousel .hiac-dot[aria-current="true"] {
	background: #333;
	box-shadow: 0 0 0 2px #fff, 0 0 0 3px #333;
}
.hiac-notice { padding: 8px 12px; border-left: 4px solid #dba617; background: #fff8e5; }

@media (prefers-reduced-motion: reduce) {
	.hiac-slide.is-entering-from-right,
	.hiac-slide.is-entering-from-left,
	.hiac-slide.is-leaving-to-left,
	.hiac-slide.is-leaving-to-right { animation: none; }
	.hiac-slide.is-leaving { visibility: hidden; }
}
