/* Easy Slideshow — mod_easyslideshow */
.ess {
	--ess-ratio: 16/9;
	--ess-speed: 900ms;
	--ess-interval: 5000ms;
	--ess-accent: #e63946;
	--ess-accent-bg: var(--ess-accent);
	--ess-btn-bg: var(--ess-accent);
	--ess-btn-fg: #fff;
	--ess-progress: var(--ess-accent);
	--ess-shadow: none;
	--ess-bg: #111;
	--ess-overlay: .2;
	--ess-radius: 0px;
	--ess-fit: cover;
	--ess-ease: cubic-bezier(.65, 0, .35, 1);
	position: relative;
	margin: 0 0 1.5rem;
	-webkit-user-select: none;
	user-select: none;
}
.ess *, .ess *::before, .ess *::after { box-sizing: border-box; }

/* ---------- viewport / height modes ---------- */
.ess__viewport {
	position: relative;
	overflow: hidden;
	background: var(--ess-bg);
	border-radius: var(--ess-radius);
	aspect-ratio: var(--ess-ratio);
	max-width: 100%;   /* stops min-height from widening the box through aspect-ratio on phones */
	outline: none;
	touch-action: pan-y;
	isolation: isolate;
	box-shadow: var(--ess-shadow);
}
.ess__viewport:focus-visible { box-shadow: 0 0 0 3px var(--ess-accent), var(--ess-shadow); }

/* shadow presets */
.ess--shadow-soft   { --ess-shadow: 0 4px 14px rgba(15, 20, 35, .12); }
.ess--shadow-medium { --ess-shadow: 0 10px 30px rgba(15, 20, 35, .22); }
.ess--shadow-strong { --ess-shadow: 0 18px 50px rgba(15, 20, 35, .38); }
.ess--shadow-float  { --ess-shadow: 0 30px 40px -24px rgba(15, 20, 35, .55); }
.ess--shadow-glow   { --ess-shadow: 0 0 0 1px color-mix(in srgb, var(--ess-accent) 40%, transparent), 0 8px 34px color-mix(in srgb, var(--ess-accent) 45%, transparent); }
.ess--shadow-inset .ess__viewport::after {
	content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none;
	box-shadow: inset 0 0 70px rgba(0, 0, 0, .55); border-radius: inherit;
}
.ess--shadow-soft, .ess--shadow-medium, .ess--shadow-strong, .ess--shadow-float, .ess--shadow-glow { margin-bottom: 2.25rem; }
.ess--h-fixed .ess__viewport { aspect-ratio: auto; height: var(--ess-h); }
.ess--h-screen .ess__viewport { aspect-ratio: auto; height: 100vh; height: 100svh; }
@media (max-width: 767px) {
	.ess--h-fixed .ess__viewport { height: var(--ess-h-m); }
	.ess--h-ratio .ess__viewport { min-height: 220px; }
}

.ess__track { position: relative; width: 100%; height: 100%; }

/* ---------- slide base ---------- */
.ess__slide { position: absolute; inset: 0; overflow: hidden; }
.ess__media { position: absolute; inset: 0; overflow: hidden; }
.ess__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: var(--ess-fit);
	pointer-events: none;
}
.ess__shade {
	position: absolute; inset: 0;
	background: rgba(0, 0, 0, var(--ess-overlay));
	pointer-events: none;
}
.ess__cover-link { position: absolute; inset: 0; z-index: 2; }

/* ---------- fade / kenburns / zoom ---------- */
.ess--stack .ess__slide {
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--ess-speed) ease, visibility 0s linear var(--ess-speed);
}
.ess--stack .ess__slide.is-active {
	opacity: 1;
	visibility: visible;
	z-index: 1;
	transition: opacity var(--ess-speed) ease, visibility 0s;
}
/* is-leaving keeps the same animation running while the old slide fades out */
.ess--kenburns .ess__slide:is(.is-active, .is-leaving) .ess__img {
	animation: ess-kb calc(var(--ess-interval) + var(--ess-speed) * 2) linear both;
}
.ess--kenburns .ess__slide.is-leaving { z-index: 0; }
.ess--kenburns .ess__slide:nth-child(4n+1) .ess__img { transform-origin: 0 0; }
.ess--kenburns .ess__slide:nth-child(4n+2) .ess__img { transform-origin: 100% 0; }
.ess--kenburns .ess__slide:nth-child(4n+3) .ess__img { transform-origin: 0 100%; }
.ess--kenburns .ess__slide:nth-child(4n+3):is(.is-active, .is-leaving) .ess__img { animation-name: ess-kb-out; }
.ess--kenburns .ess__slide:nth-child(4n+4) .ess__img { transform-origin: 100% 100%; }
.ess.is-paused.ess--kenburns .ess__img { animation-play-state: paused; }
@keyframes ess-kb { from { transform: scale(1); } to { transform: scale(1.15); } }
@keyframes ess-kb-out { from { transform: scale(1.15); } to { transform: scale(1); } }

.ess--zoom .ess__slide .ess__img { transform: scale(1.12); transition: transform calc(var(--ess-speed) * 1.6) var(--ess-ease); }
.ess--zoom .ess__slide.is-active .ess__img { transform: scale(1); }

/* multi-slide carousel (centre + N each side) — positions set by JS */
.ess--carousel .ess__track { perspective: 1400px; transform-style: preserve-3d; }
.ess--carousel .ess__slide {
	position: absolute;
	top: 0; left: 50%;
	height: 100%;
	width: 56%;
	border-radius: var(--ess-radius);
	overflow: hidden;
	cursor: pointer;
	filter: brightness(calc(1 - var(--ess-dim, 0)));
	box-shadow: 0 12px 30px rgba(0, 0, 0, .35);
	transition: transform var(--ess-speed) var(--ess-ease), opacity var(--ess-speed) ease, filter var(--ess-speed) ease, visibility 0s;
	backface-visibility: hidden;
}
.ess--carousel .ess__slide.is-active { cursor: auto; }
.ess--carousel .ess__slide.is-jump { transition: none !important; }
.ess--carousel .ess__slide:not(.is-active) .ess__caption,
.ess--carousel .ess__slide:not(.is-active) .ess__play { opacity: 0; transition: opacity .25s; }
.ess--carousel .ess__slide:not(.is-active) :is(a, button) { pointer-events: none; }
.ess--carousel .ess__slide:not(.is-active):hover { --ess-dim: 0.1 !important; }
.ess--carousel .ess__viewport { background: var(--ess-bg); }
.ess--carousel.ess--capstyle-gradient .ess__slide::after { border-radius: inherit; }

/* page turn: old slide stays on top and is peeled away by JS (clip-path + folded flap) */
.ess--pageturn .ess__slide { opacity: 1; transition: visibility 0s linear var(--ess-speed); }
.ess--pageturn .ess__slide.is-active { transition: visibility 0s; }
.ess--pageturn .ess__slide.is-leaving { z-index: 2 !important; }
.ess__flap {
	position: absolute; inset: 0; z-index: 3;
	pointer-events: none;
	display: none;
	filter: drop-shadow(-8px 8px 12px rgba(0, 0, 0, .38));
}
.ess__flap.is-on { display: block; }
.ess__flap-page { position: absolute; inset: 0; }

/* the outgoing slide stays visible underneath while the new one arrives */
.ess--stack .ess__slide.is-leaving { visibility: visible; z-index: 0; }

/* cover up: new slide slides up over the old one */
.ess--coverup .ess__slide {
	opacity: 1;
	transform: translate3d(0, 100%, 0);
	transition: transform var(--ess-speed) var(--ess-ease), visibility 0s linear var(--ess-speed);
}
.ess--coverup .ess__slide.is-active { transform: none; transition: transform var(--ess-speed) var(--ess-ease), visibility 0s; }
.ess--coverup .ess__slide.is-leaving { transform: none; transition: none; }

/* 3D flip: old turns away, new turns in */
.ess--flip .ess__track { perspective: 1800px; }
.ess--flip .ess__slide {
	opacity: 1;
	backface-visibility: hidden;
	transform: rotateY(90deg);
	transition: transform calc(var(--ess-speed) / 2) cubic-bezier(.55, 0, 1, .45), visibility 0s linear var(--ess-speed);
}
.ess--flip .ess__slide.is-active {
	transform: rotateY(0);
	transition: transform calc(var(--ess-speed) / 2) cubic-bezier(0, .55, .45, 1) calc(var(--ess-speed) / 2), visibility 0s;
}
.ess--flip .ess__slide.is-leaving { transform: rotateY(-90deg); }

/* blur fade */
.ess--blur .ess__slide {
	filter: blur(24px);
	transform: scale(1.06);
	transition: opacity var(--ess-speed) ease, filter var(--ess-speed) ease, transform var(--ess-speed) var(--ess-ease), visibility 0s linear var(--ess-speed);
}
.ess--blur .ess__slide.is-active {
	filter: blur(0);
	transform: none;
	transition: opacity var(--ess-speed) ease, filter var(--ess-speed) ease, transform var(--ess-speed) var(--ess-ease), visibility 0s;
}
.ess--blur .ess__slide.is-leaving { filter: blur(0); transform: none; opacity: 0; }

/* wipe: reveal left to right */
.ess--wipe .ess__slide {
	opacity: 1;
	clip-path: inset(0 100% 0 0);
	transition: clip-path var(--ess-speed) var(--ess-ease), visibility 0s linear var(--ess-speed);
}
.ess--wipe .ess__slide.is-active { clip-path: inset(0 0 0 0); transition: clip-path var(--ess-speed) var(--ess-ease), visibility 0s; }
.ess--wipe .ess__slide.is-leaving { clip-path: inset(0 0 0 0); transition: none; }

/* circle: grows from the centre */
.ess--circle .ess__slide {
	opacity: 1;
	clip-path: circle(0% at 50% 50%);
	transition: clip-path var(--ess-speed) var(--ess-ease), visibility 0s linear var(--ess-speed);
}
.ess--circle .ess__slide.is-active { clip-path: circle(75% at 50% 50%); transition: clip-path var(--ess-speed) var(--ess-ease), visibility 0s; }
.ess--circle .ess__slide.is-leaving { clip-path: circle(75% at 50% 50%); transition: none; }

/* ---------- slide (horizontal) ---------- */
.ess--slide .ess__track {
	display: flex;
	will-change: transform;
}
.ess--slide .ess__track.is-anim { transition: transform var(--ess-speed) var(--ess-ease); }
.ess--slide .ess__slide { position: relative; inset: auto; flex: 0 0 100%; height: 100%; }

/* ---------- caption ---------- */
.ess__caption {
	position: absolute;
	inset: 0;
	z-index: 3;
	display: flex;
	padding: clamp(1rem, 4vw, 3rem) clamp(1.25rem, 5vw, 4.5rem);
	padding-bottom: clamp(2.5rem, 6vw, 4.5rem);
	pointer-events: none;
	color: #fff;
}
.ess__caption-inner { max-width: min(640px, 100%); pointer-events: auto; }
.ess__caption-inner > * { margin: 0; }
.ess__caption-inner > * + * { margin-top: .6em; }

.ess__title {
	font-size: clamp(1.25rem, 3.2vw, 2.5rem);
	font-weight: 700;
	line-height: 1.2;
	color: inherit;
	letter-spacing: .01em;
}
.ess__desc { font-size: clamp(.9rem, 1.5vw, 1.125rem); line-height: 1.6; opacity: .92; }
.ess__desc a { color: inherit; text-decoration: underline; }
.ess__btn {
	display: inline-block;
	margin-top: 1.1em !important;
	padding: .7em 1.6em;
	border-radius: 999px;
	background: var(--ess-btn-bg);
	color: var(--ess-btn-fg) !important;
	font-weight: 600;
	font-size: .95rem;
	text-decoration: none !important;
	transition: filter .2s, transform .2s;
}
.ess__btn:hover, .ess__btn:focus-visible { filter: brightness(1.12); transform: translateY(-1px); }
.ess__btn:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* position */
.ess--cap-bottom-left   .ess__caption { align-items: flex-end;  justify-content: flex-start; }
.ess--cap-bottom-center .ess__caption { align-items: flex-end;  justify-content: center; text-align: center; }
.ess--cap-bottom-right  .ess__caption { align-items: flex-end;  justify-content: flex-end; text-align: right; }
.ess--cap-center        .ess__caption { align-items: center;    justify-content: center; text-align: center; }
.ess--cap-middle-left   .ess__caption { align-items: center;    justify-content: flex-start; }
.ess--cap-top-left      .ess__caption { align-items: flex-start; justify-content: flex-start; }
.ess--cap-top-right     .ess__caption { align-items: flex-start; justify-content: flex-end; text-align: right; }

/* styles */
.ess--capstyle-gradient .ess__slide::after {
	content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
	background: linear-gradient(to top, rgba(0,0,0,.72) 0%, rgba(0,0,0,.25) 38%, transparent 62%);
}
.ess--capstyle-gradient.ess--cap-top-left .ess__slide::after,
.ess--capstyle-gradient.ess--cap-top-right .ess__slide::after {
	background: linear-gradient(to bottom, rgba(0,0,0,.7) 0%, transparent 55%);
}
.ess--capstyle-gradient.ess--cap-center .ess__slide::after,
.ess--capstyle-gradient.ess--cap-middle-left .ess__slide::after { background: rgba(0,0,0,.3); }
.ess--capstyle-gradient .ess__title { text-shadow: 0 2px 12px rgba(0,0,0,.35); }

.ess--capstyle-box .ess__caption-inner {
	background: rgba(15, 15, 20, .72);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	padding: 1.25em 1.5em;
	border-left: 4px solid var(--ess-accent);
	border-radius: 4px;
}
.ess--capstyle-box.ess--cap-bottom-right .ess__caption-inner,
.ess--capstyle-box.ess--cap-top-right .ess__caption-inner { border-left: 0; border-right: 4px solid var(--ess-accent); }
.ess--capstyle-box.ess--cap-center .ess__caption-inner,
.ess--capstyle-box.ess--cap-bottom-center .ess__caption-inner { border-left: 0; border-top: 4px solid var(--ess-accent); }

.ess--capstyle-light .ess__caption { color: #1a1a1a; }
.ess--capstyle-light .ess__caption-inner {
	background: rgba(255,255,255,.92);
	padding: 1.25em 1.5em;
	border-radius: 6px;
	box-shadow: 0 10px 30px rgba(0,0,0,.15);
}
.ess--capstyle-plain .ess__title { text-shadow: 0 2px 10px rgba(0,0,0,.55); }
.ess--capstyle-plain .ess__desc  { text-shadow: 0 1px 6px rgba(0,0,0,.6); }

/* caption animation */
.ess--capanim .ess__caption-inner > * {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity .5s ease, transform .6s var(--ess-ease);
}
.ess--capanim .ess__slide.is-active .ess__caption-inner > * { opacity: 1; transform: none; }
.ess--capanim .ess__slide.is-active .ess__caption-inner > :nth-child(1) { transition-delay: calc(var(--ess-speed) * .45); }
.ess--capanim .ess__slide.is-active .ess__caption-inner > :nth-child(2) { transition-delay: calc(var(--ess-speed) * .45 + 120ms); }
.ess--capanim .ess__slide.is-active .ess__caption-inner > :nth-child(3) { transition-delay: calc(var(--ess-speed) * .45 + 240ms); }

@media (max-width: 767px) {
	.ess--capmobile-title .ess__desc,
	.ess--capmobile-title .ess__btn { display: none; }
	.ess--capmobile-hide .ess__caption,
	.ess--capmobile-hide .ess__slide::after { display: none; }
	.ess__caption { padding: 1rem 1.1rem 2.4rem; }
	.ess--capstyle-box .ess__caption-inner,
	.ess--capstyle-light .ess__caption-inner { padding: .8em 1em; }
}

/* ---------- arrows ---------- */
.ess__arrow, .ess__toggle {
	position: absolute;
	z-index: 5;
	display: grid;
	place-items: center;
	border: 0;
	margin: 0;
	padding: 0;
	cursor: pointer;
	color: #fff;
	background: rgba(0, 0, 0, .38);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	transition: background .2s, opacity .25s, transform .25s;
}
.ess { --ess-arrow: 48px; }
.ess__arrow {
	width: var(--ess-arrow);
	height: var(--ess-arrow);
	border-radius: 50%;
	transform: translateY(-50%);
	font-size: calc(var(--ess-arrow) * .4);
	line-height: 1;
}
@media (max-width: 767px) {
	.ess__arrow { width: calc(var(--ess-arrow) * .8); height: calc(var(--ess-arrow) * .8); font-size: calc(var(--ess-arrow) * .32); }
}
.ess__arrow svg.ess__ico { width: 45%; height: 45%; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
/* Font Awesome icon inside the arrow (webfont <i> or SVG replacement) */
.ess__arrow i, .ess__arrow .svg-inline--fa { font-size: 1em; line-height: 1; pointer-events: none; }

/* arrow shapes */
.ess--arrow-square .ess__arrow { border-radius: 6px; }
.ess--arrow-rect .ess__arrow {
	width: calc(var(--ess-arrow) * .75);
	height: calc(var(--ess-arrow) * 1.7);
	border-radius: 6px;
}
.ess--arrow-rect .ess__arrow--prev { left: var(--ess-prev-x, 0); border-radius: 0 6px 6px 0; }
.ess--arrow-rect .ess__arrow--next { right: var(--ess-next-x, 0); border-radius: 6px 0 0 6px; }
.ess--arrow-triangle .ess__arrow {
	width: calc(var(--ess-arrow) * 1.1);
	height: calc(var(--ess-arrow) * 1.25);
	border-radius: 0;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	background: rgba(0, 0, 0, .5);
	font-size: calc(var(--ess-arrow) * .32);
}
.ess--arrow-triangle .ess__arrow--prev { clip-path: polygon(0 50%, 100% 0, 100% 100%); padding-left: calc(var(--ess-arrow) * .35); }
.ess--arrow-triangle .ess__arrow--next { clip-path: polygon(100% 50%, 0 0, 0 100%); padding-right: calc(var(--ess-arrow) * .35); }
.ess--arrow-triangle .ess__arrow:focus-visible { background: var(--ess-accent-bg); }
.ess__arrow--prev { left: var(--ess-prev-x, clamp(8px, 2vw, 22px)); top: var(--ess-prev-y, 50%); }
.ess__arrow--next { right: var(--ess-next-x, clamp(8px, 2vw, 22px)); top: var(--ess-next-y, 50%); }
.ess__arrow:hover, .ess__toggle:hover { background: var(--ess-accent-bg); }
.ess__arrow:focus-visible, .ess__toggle:focus-visible, .ess__dot:focus-visible, .ess__thumb:focus-visible {
	outline: 2px solid #fff; outline-offset: 2px;
}
@media (hover: hover) {
	.ess--arrows-hover .ess__arrow { opacity: 0; }
	.ess--arrows-hover .ess__arrow--prev { transform: translate(-8px, -50%); }
	.ess--arrows-hover .ess__arrow--next { transform: translate(8px, -50%); }
	.ess--arrows-hover:hover .ess__arrow,
	.ess--arrows-hover .ess__arrow:focus-visible { opacity: 1; transform: translateY(-50%); }
}

/* ---------- play / pause ---------- */
.ess__toggle {
	top: 12px; right: 12px;
	width: 34px; height: 34px;
	border-radius: 50%;
	opacity: .75;
}
.ess__toggle:hover, .ess__toggle:focus-visible { opacity: 1; }
.ess--togglepos-top-left .ess__toggle     { right: auto; left: 12px; }
.ess--togglepos-bottom-right .ess__toggle { top: auto; bottom: calc(12px + var(--ess-pw, 4px)); }
.ess--togglepos-bottom-left .ess__toggle  { top: auto; right: auto; left: 12px; bottom: calc(12px + var(--ess-pw, 4px)); }
@media (hover: hover) {
	.ess--toggle-hover .ess__toggle { opacity: 0; }
	.ess--toggle-hover:hover .ess__toggle, .ess--toggle-hover .ess__toggle:focus-visible { opacity: .85; }
}
.ess__toggle svg { width: 16px; height: 16px; fill: currentColor; }
.ess__ico-play { display: none; }
.ess.is-paused .ess__ico-play { display: block; }
.ess.is-paused .ess__ico-pause { display: none; }

/* ---------- progress ---------- */
.ess__progress {
	position: absolute; left: 0; right: 0; bottom: 0; z-index: 4;
	height: var(--ess-pw, 4px);
	background: rgba(255,255,255,.18);
}
.ess__progress span {
	display: block; height: 100%; width: 100%;
	background: var(--ess-progress);
	clip-path: inset(0 100% 0 0);
}
.ess__progress span.is-run { animation: ess-progress var(--ess-interval) linear forwards; }
.ess.is-paused .ess__progress span, .ess.is-hold .ess__progress span { animation-play-state: paused; }
@keyframes ess-progress { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }

/* line styles: dashed / striped */
.ess { --ess-dash: calc(var(--ess-pw, 4px) * 3 + 6px); --ess-gap: calc(var(--ess-pw, 4px) + 4px); }
.ess--pline-dashed .ess__progress {
	background: repeating-linear-gradient(90deg, rgba(255,255,255,.2) 0 var(--ess-dash), transparent var(--ess-dash) calc(var(--ess-dash) + var(--ess-gap)));
}
.ess--pline-dashed .ess__progress span {
	background: repeating-linear-gradient(90deg, var(--ess-progress) 0 var(--ess-dash), transparent var(--ess-dash) calc(var(--ess-dash) + var(--ess-gap)));
}
.ess--pline-striped .ess__progress span {
	background: repeating-linear-gradient(-45deg, var(--ess-progress) 0 6px, color-mix(in srgb, var(--ess-progress) 45%, #fff) 6px 12px);
	background-size: 16.97px 100%;
}
.ess--pline-striped .ess__progress span.is-run {
	animation: ess-progress var(--ess-interval) linear forwards, ess-stripes .7s linear infinite;
}
@keyframes ess-stripes { to { background-position: 16.97px 0; } }

/* ---------- progress around the border ---------- */
.ess__ring {
	position: absolute; inset: 0; z-index: 4;
	width: 100%; height: 100%;
	overflow: visible;
	pointer-events: none;
}
.ess__ring path {
	fill: none;
	stroke-width: var(--ess-pw, 4px);
	stroke-linecap: butt;
	stroke-linejoin: round;
}
.ess__ring-track { stroke: rgba(255, 255, 255, .16); }
.ess__ring-mask {
	stroke: #fff;
	stroke-width: calc(var(--ess-pw, 4px) + 4px) !important;
	stroke-dasharray: var(--ess-len, 0px) var(--ess-len, 0px);
	stroke-dashoffset: var(--ess-len, 0px);
}
.ess__ring-mask.is-run { animation: ess-ring var(--ess-interval) linear forwards; }
.ess.is-paused .ess__ring-mask, .ess.is-hold .ess__ring-mask { animation-play-state: paused; }
.ess__ring-fillg { filter: drop-shadow(0 0 3px color-mix(in srgb, var(--ess-progress) 60%, transparent)); }
.ess__ring-fill { stroke: var(--ess-progress); }
.ess__ring-stripe { stroke: none; }
.ess--pline-dashed .ess__ring-fill,
.ess--pline-dashed .ess__ring-track { stroke-dasharray: var(--ess-dash) var(--ess-gap); }
.ess--pline-striped .ess__ring-stripe {
	stroke: color-mix(in srgb, var(--ess-progress) 45%, #fff);
	stroke-dasharray: calc(var(--ess-pw, 4px) + 2px) calc(var(--ess-pw, 4px) + 6px);
}
@keyframes ess-ring { to { stroke-dashoffset: 0; } }
.ess.is-video .ess__ring { opacity: 0; }

/* ---------- pager: dots / bars / numbers ---------- */
.ess__pager {
	position: absolute;
	left: 50%; bottom: 14px;
	z-index: 5;
	display: flex;
	gap: 8px;
	transform: translateX(-50%);
	max-width: calc(100% - 120px);
	flex-wrap: wrap;
	justify-content: center;
}
.ess--cap-bottom-center .ess__pager { bottom: 10px; }
.ess--pagerpos-bottom-left .ess__pager  { left: 18px; transform: none; justify-content: flex-start; }
.ess--pagerpos-bottom-right .ess__pager { left: auto; right: 18px; transform: none; justify-content: flex-end; }
.ess--pagerpos-top-center .ess__pager   { bottom: auto; top: 16px; }
.ess--pagerpos-top-left .ess__pager     { bottom: auto; top: 16px; left: 18px; transform: none; justify-content: flex-start; }
.ess--pagerpos-top-right .ess__pager    { bottom: auto; top: 16px; left: auto; right: 18px; transform: none; justify-content: flex-end; }
.ess--pagerpos-left .ess__pager,
.ess--pagerpos-right .ess__pager {
	bottom: auto; top: 50%;
	flex-direction: column;
	flex-wrap: nowrap;
	max-width: none; max-height: calc(100% - 40px);
	align-items: center;
}
.ess--pagerpos-left .ess__pager  { left: 16px; transform: translateY(-50%); }
.ess--pagerpos-right .ess__pager { left: auto; right: 16px; transform: translateY(-50%); }
.ess--pager-vert.ess--pager-dots .ess__dot.is-active { width: 10px; height: 28px; }
.ess--pager-vert.ess--pager-bars .ess__dot { width: 4px; height: 34px; }
.ess--pagerpos-outside .ess__pager {
	position: static;
	transform: none;
	max-width: 100%;
	margin: 12px auto 0;
}
.ess--pagerpos-outside.ess--pager-dots .ess__dot { background: rgba(120, 120, 130, .35); box-shadow: none; }
.ess--pagerpos-outside.ess--pager-dots .ess__dot.is-active,
.ess--pagerpos-outside.ess--pager-dots .ess__dot:hover { background: var(--ess-accent-bg); }
.ess--pagerpos-outside.ess--pager-bars .ess__dot { background: rgba(120, 120, 130, .3); }
.ess__thumbs:first-child { margin: 0 0 10px; }
.ess__dot {
	border: 0; margin: 0; padding: 0;
	cursor: pointer;
	transition: all .3s var(--ess-ease);
}
.ess--pager-dots .ess__dot {
	width: 10px; height: 10px;
	border-radius: 999px;
	background: rgba(255,255,255,.5);
	box-shadow: 0 0 0 1px rgba(0,0,0,.15);
}
.ess--pager-dots .ess__dot.is-active { width: 28px; background: #fff; }
.ess--pager-dots .ess__dot:hover { background: #fff; }

.ess--pager-bars .ess__dot { width: 34px; height: 4px; border-radius: 2px; background: rgba(255,255,255,.45); }
.ess--pager-bars .ess__dot.is-active { background: var(--ess-accent-bg); }

.ess--pager-numbers .ess__dot {
	min-width: 30px; height: 30px;
	border-radius: 50%;
	background: rgba(0,0,0,.4);
	color: #fff;
	font: 600 13px/30px system-ui, sans-serif;
}
.ess--pager-numbers .ess__dot.is-active { background: var(--ess-accent-bg); }

/* ---------- thumbnails ---------- */
.ess__thumbs {
	display: flex;
	gap: 8px;
	margin-top: 10px;
	overflow-x: auto;
	scrollbar-width: thin;
	padding-bottom: 4px;
	scroll-behavior: smooth;
}
.ess__thumb {
	flex: 0 0 var(--ess-thumb-w);
	height: var(--ess-thumb-h);
	padding: 0; margin: 0;
	border: 0;
	border-radius: 4px;
	overflow: hidden;
	cursor: pointer;
	opacity: .5;
	background: var(--ess-bg);
	box-shadow: inset 0 0 0 0 var(--ess-accent);
	transition: opacity .25s;
	position: relative;
}
.ess__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; max-width: none; }
.ess__thumb::after {
	content: ""; position: absolute; inset: 0; border-radius: 4px;
	box-shadow: inset 0 0 0 3px transparent; transition: box-shadow .25s;
}
.ess__thumb:hover { opacity: .85; }
.ess__thumb.is-active { opacity: 1; }
.ess__thumb.is-active::after { box-shadow: inset 0 0 0 3px var(--ess-accent); }
@media (max-width: 767px) {
	.ess__thumb { flex-basis: calc(var(--ess-thumb-w) * .7); height: calc(var(--ess-thumb-h) * .7); }
}

/* ---------- YouTube video slides ---------- */
.ess__video {
	position: absolute; inset: 0; z-index: 6;
	background: #000;
	opacity: 0; visibility: hidden;
	transition: opacity .35s ease, visibility 0s linear .35s;
}
.ess__video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ess__slide.is-playing .ess__video { opacity: 1; visibility: visible; transition: opacity .35s ease, visibility 0s; }

.ess__play {
	position: absolute; left: 50%; top: 50%; z-index: 4;
	width: clamp(56px, 8vw, 84px); height: clamp(56px, 8vw, 84px);
	margin: 0; padding: 0; border: 0; border-radius: 50%;
	transform: translate(-50%, -50%);
	display: grid; place-items: center;
	background: rgba(0, 0, 0, .5);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	box-shadow: 0 0 0 2px rgba(255, 255, 255, .85);
	color: #fff;
	cursor: pointer;
	transition: background .2s, transform .25s var(--ess-ease);
}
.ess__play svg { width: 42%; height: 42%; fill: currentColor; margin-left: 8%; }
.ess__play:hover, .ess__play:focus-visible { background: var(--ess-accent-bg); transform: translate(-50%, -50%) scale(1.08); }
.ess__play:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.ess__play::before {
	content: ""; position: absolute; inset: -2px; border-radius: 50%;
	box-shadow: 0 0 0 2px rgba(255,255,255,.6);
	animation: ess-pulse 2.2s ease-out infinite;
}
@keyframes ess-pulse { from { transform: scale(1); opacity: .9; } to { transform: scale(1.45); opacity: 0; } }

/* keep centred captions clear of the play button: drop them to the bottom */
.ess--cap-center .ess__slide--video .ess__caption { align-items: flex-end; }
.ess--cap-middle-left .ess__slide--video .ess__play { left: auto; right: 12%; transform: translate(0, -50%); }
.ess--cap-middle-left .ess__slide--video .ess__play:hover { transform: translate(0, -50%) scale(1.08); }

.ess__close {
	position: absolute; top: 12px; right: 54px; z-index: 7;
	width: 34px; height: 34px; margin: 0; padding: 0; border: 0; border-radius: 50%;
	display: none; place-items: center;
	background: rgba(0, 0, 0, .55); color: #fff; cursor: pointer;
}
.ess__close svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.ess__close:hover, .ess__close:focus-visible { background: var(--ess-accent-bg); }
.ess__slide.is-playing .ess__close { display: grid; }
.ess.is-video .ess__close { right: 12px; }

/* while a video plays: hide overlays that would sit on the player */
.ess.is-video .ess__progress,
.ess.is-video .ess__toggle,
.ess.is-video .ess__viewport .ess__pager { opacity: 0; pointer-events: none; }
.ess.is-video .ess__arrow { z-index: 8; }
.ess__slide.is-playing .ess__play { opacity: 0; pointer-events: none; }

.ess__thumb-play {
	position: absolute; left: 50%; top: 50%; z-index: 1;
	width: 26px; height: 26px; border-radius: 50%;
	transform: translate(-50%, -50%);
	background: rgba(0,0,0,.6);
}
.ess__thumb-play::after {
	content: ""; position: absolute; left: 10px; top: 7px;
	border-style: solid; border-width: 6px 0 6px 9px;
	border-color: transparent transparent transparent #fff;
}

/* ---------- misc ---------- */
.ess.is-dragging .ess__viewport { cursor: grabbing; }
.ess.is-single .ess__arrow, .ess.is-single .ess__pager { display: none; }

@media (prefers-reduced-motion: reduce) {
	.ess *, .ess *::before, .ess *::after {
		animation-duration: 1ms !important;
		transition-duration: 1ms !important;
		transition-delay: 0s !important;
	}
}