/* Absolute Image Sliders — replaces Slider Revolution / LayerSlider */

.ais-slider {
	--ais-speed: 1000ms;
	--ais-ease: ease-in-out;
	position: relative;
	overflow: hidden;
	width: 100%;
	-webkit-tap-highlight-color: transparent;
}

.ais-track {
	display: grid;
	aspect-ratio: var(--ais-ratio, 1 / 1);
	width: 100%;
}

/* ---- slides: stacked in one grid cell, faded with opacity ---- */
.ais-slide {
	grid-area: 1 / 1;
	position: relative;
	min-width: 0;
	opacity: 0;
	visibility: hidden;
	z-index: 0;
	transition: opacity var(--ais-speed) var(--ais-ease), visibility 0s linear var(--ais-speed);
}
.ais-slide.is-active {
	opacity: 1;
	visibility: visible;
	z-index: 2;
	transition: opacity var(--ais-speed) var(--ais-ease), visibility 0s;
}
.ais-slide.is-leaving {
	visibility: visible;
	z-index: 1;
}
/* "over": outgoing stays opaque underneath while the incoming fades in on top (no mid-fade dip). */
.ais-fade-over .ais-slide.is-leaving { opacity: 1; transition: none; }

/* No-JS / pre-init: just show the first slide. */
.ais-slider:not(.is-ready) .ais-slide:not(:first-child) { display: none; }

/* <picture> wrapper (breakpoint guard) must not affect layout */
.ais-slider picture.ais-pic { display: contents; }

.ais-slide .ais-img,
.ais-slide > .ais-link {
	display: block;
	width: 100%;
	height: 100%;
}
.ais-slide .ais-img {
	object-fit: cover;
	max-width: none;
}

/* ---- layered (RevSlider-style) stage: grid units → % and container-query units ---- */
.ais-stage { container-type: inline-size; }
.ais-layered .ais-slide { overflow: hidden; }
.ais-layer {
	position: absolute;
	left: calc(var(--x) / var(--gw) * 100%);
	top: calc(var(--y) / var(--gh) * 100%);
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
.ais-layer[style*="--w"] { width: calc(var(--w) / var(--gw) * 100%); }
.ais-layer[style*="--h"] { height: calc(var(--h) / var(--gh) * 100%); }
.ais-layer.ais-bg { inset: 0; width: 100%; height: 100%; }
.ais-layer .ais-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	max-width: none;
}

.ais-t {
	font-family: 'Open Sans', sans-serif;
	font-size: calc(var(--fs) / var(--gw) * 100cqw);
	line-height: calc(var(--lh) / var(--gw) * 100cqw);
	font-weight: 400;
	text-align: left;
	white-space: normal;
}
.ais-t-nowrap { white-space: nowrap; }
.ais-t-roboto { font-family: Roboto, 'Open Sans', sans-serif; }
.ais-t-title  { font-weight: 600; color: #8e8e8e; text-transform: uppercase; letter-spacing: calc(10 / 2560 * 100cqw); }
.ais-t-title2 { font-weight: 600; color: #999; letter-spacing: calc(2 / 2560 * 100cqw); }
.ais-t-sub    { color: #999; letter-spacing: calc(2 / 2560 * 100cqw); }
.ais-t-blue   { color: #4c76a2; }
.ais-t-body   { color: #617fa3; }

.ais-quote {
	color: #e40b0b;
	/* RevSlider scaled these to ~11px at 1100px wide; keep them legible. */
	font-size: max(11px, calc(var(--fs) / var(--gw) * 100cqw));
	line-height: 1.38;
	border: 0;
	quotes: none;
}
.ais-quote::before, .ais-quote::after { content: none; }
.ais-quote p { margin: 0 0 1.38em; font: inherit; color: inherit; }
.ais-quote footer { font: inherit; color: inherit; }
.ais-quote em { display: block; }

.ais-rule { background: rgba(204, 204, 204, .5); }

.ais-btn {
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-size: calc(var(--fs) / var(--gw) * 100cqw);
	line-height: calc(var(--lh) / var(--gw) * 100cqw);
	letter-spacing: calc(1 / 2560 * 100cqw);
	color: #fff !important;
	text-decoration: none !important;
	white-space: nowrap;
	padding: calc(24 / 2560 * 100cqw) calc(50 / 2560 * 100cqw);
	background: linear-gradient(180deg, #ff9500 0%, #ff5e3a 100%);
	border-radius: 0;
	box-shadow: 0 calc(10 / 2560 * 100cqw) calc(20 / 2560 * 100cqw) rgba(0, 0, 0, .25);
	transition: border-radius .3s ease-in-out;
}
.ais-btn:hover, .ais-btn:focus-visible { border-radius: 5px; color: #fff; }

/* In-slide image sequence on slide 1 (book cover → angled spread → straight spread), timed to a 14s slide. */
.ais-slide.is-active .ais-seq-1, .ais-slide.is-leaving .ais-seq-1 { animation: ais-seq-1 var(--dur) both; }
.ais-slide.is-active .ais-seq-2, .ais-slide.is-leaving .ais-seq-2 { animation: ais-seq-2 var(--dur) both; }
.ais-slide.is-active .ais-seq-3, .ais-slide.is-leaving .ais-seq-3 { animation: ais-seq-3 var(--dur) both; }
.ais-seq { opacity: 0; }
.ais-slide:first-child .ais-seq-1 { opacity: 1; } /* before JS runs */

@keyframes ais-seq-1 { /* visible 0–4s, fades out 4–6s */
	0%, 28.57% { opacity: 1; animation-timing-function: cubic-bezier(.65,0,.35,1); }
	42.86%, 100% { opacity: 0; }
}
@keyframes ais-seq-2 { /* fades in 4–6s, out 8–10s */
	0%, 28.57% { opacity: 0; animation-timing-function: cubic-bezier(.65,0,.35,1); }
	42.86%, 57.14% { opacity: 1; animation-timing-function: cubic-bezier(.65,0,.35,1); }
	71.43%, 100% { opacity: 0; }
}
@keyframes ais-seq-3 { /* fades in 8–10s, holds until the slide fades out */
	0%, 57.14% { opacity: 0; animation-timing-function: cubic-bezier(.65,0,.35,1); }
	71.43%, 100% { opacity: 1; }
}

/* Paused (hover / focus / pause button / offscreen): freeze in-slide animations too. */
.ais-slider.is-held .ais-slide *,
.ais-slide.is-leaving * { animation-play-state: paused !important; }

/* ---- controls ----
 * Class-level reset (specificity 0,2,0) so theme "button {…}" styles can't leak in;
 * the rules after it have equal specificity and win by source order. */
.ais-slider .ais-arrow,
.ais-slider .ais-pause,
.ais-slider .ais-dot {
	all: unset;
	box-sizing: border-box;
	cursor: pointer;
	position: absolute;
	z-index: 5;
	display: grid;
	place-items: center;
	color: #fff;
	-webkit-tap-highlight-color: transparent;
}
.ais-slider .ais-arrow:focus-visible,
.ais-slider .ais-pause:focus-visible,
.ais-slider .ais-dot:focus-visible { outline: 2px solid #4c76a2; outline-offset: 2px; }

.ais-slider .ais-arrow {
	top: 50%;
	width: 50px;
	height: 50px;
	margin-top: -25px;
	filter: drop-shadow(0 0 3px rgba(0, 0, 0, .35));
	transition: opacity .3s;
}
.ais-slider .ais-arrow svg { width: 40px; height: 40px; display: block; }
.ais-slider .ais-arrow:hover { opacity: .75; }
.ais-slider .ais-prev { left: 30px; }
.ais-slider .ais-next { right: 30px; }
.ais-slider .ais-next svg { transform: scaleX(-1); }

.ais-slider .ais-pause {
	left: 12px;
	bottom: 12px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(0, 0, 0, .28);
	opacity: .55;
	transition: opacity .3s;
}
.ais-slider .ais-pause svg { display: block; }
.ais-slider:hover .ais-pause, .ais-slider .ais-pause:focus-visible, .ais-slider.is-paused .ais-pause { opacity: 1; }
.ais-slider .ais-pause .ais-i-play { display: none; }
.ais-slider.is-paused .ais-pause .ais-i-play { display: block; }
.ais-slider.is-paused .ais-pause .ais-i-pause { display: none; }

.ais-dots { position: absolute; z-index: 5; left: 0; right: 0; bottom: 12px; display: flex; justify-content: center; gap: 8px; }
.ais-slider .ais-dot { position: static; width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.5); }
.ais-slider .ais-dot[aria-current="true"] { background: #fff; }

.ais-slider .screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	white-space: nowrap;
}

@media (max-width: 767px) {
	.ais-slider .ais-arrow { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.ais-slide, .ais-slide.is-active { transition: none; }
	.ais-seq { animation: none !important; opacity: 0; }
	.ais-seq-1 { opacity: 1; }
}
