/**
 * Espy asset carousel — front-end styles.
 * Enqueued as a real stylesheet (not inline) so page optimizers keep it.
 * Horizontal scroll-snap track; transforms/scroll only (no layout thrash).
 *
 * @package EspyBlogCore
 */
.espy-carousel-fig { margin: 1.5rem 0; }
.espy-carousel { --espy-c-ratio: 16/9; --espy-c-accent: #c8552f; position: relative; }
.espy-carousel-viewport {
	overflow-x: auto; overflow-y: hidden;
	scroll-snap-type: x mandatory; scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch; scrollbar-width: none; border-radius: 14px;
}
.espy-carousel-viewport::-webkit-scrollbar { display: none; }
.espy-carousel-track { display: flex; margin: 0; padding: 0; list-style: none; gap: 0; }
.espy-carousel-slide { flex: 0 0 100%; scroll-snap-align: center; min-width: 0; list-style: none; margin: 0; }
.espy-carousel-slide::marker { content: ""; }
.espy-carousel-slide > * { width: 100%; display: block; margin: 0; }
.espy-carousel-slide .espy-asset--image,
.espy-carousel-slide .espy-asset--video,
.espy-carousel-slide .espy-asset--model {
	aspect-ratio: var(--espy-c-ratio); width: 100%; height: auto; object-fit: cover; background: #f4efe9;
}
.espy-carousel-nav {
	position: absolute; top: 50%; transform: translateY(-50%);
	width: 40px; height: 40px; border: none; border-radius: 50%;
	background: rgba(20, 16, 14, .55); color: #fff; font-size: 22px; line-height: 1;
	cursor: pointer; display: flex; align-items: center; justify-content: center;
	transition: background .15s ease, opacity .15s ease; z-index: 2;
}
.espy-carousel-nav:hover { background: var(--espy-c-accent); }
.espy-carousel-nav:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.espy-carousel-prev { left: 10px; }
.espy-carousel-next { right: 10px; }
.espy-carousel-nav[disabled] { opacity: .3; cursor: default; }
.espy-carousel-dots { display: flex; gap: 7px; justify-content: center; margin-top: 10px; padding: 0; list-style: none; }
.espy-carousel-dot { width: 8px; height: 8px; padding: 0; border: none; border-radius: 50%; background: #d9cfc4; cursor: pointer; transition: background .15s ease, transform .15s ease; }
.espy-carousel-dot[aria-selected="true"] { background: var(--espy-c-accent); transform: scale(1.3); }
@media (prefers-reduced-motion: reduce) { .espy-carousel-viewport { scroll-behavior: auto; } }