/* Бегущая строка с фото: пауза при наведении, клик открывает лайтбокс */
.lv-gallery { padding-block: clamp(48px, 7vw, 88px); overflow: hidden; }
.lv-gallery__title { margin: 0 0 28px; text-align: center; font-size: clamp(26px, 3vw, 38px); }

.lv-marquee {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.lv-marquee__track {
	display: flex; width: max-content; margin: 0; padding: 0; list-style: none;
	animation: lv-marquee 48s linear infinite; will-change: transform;
}
.lv-marquee:hover .lv-marquee__track,
.lv-marquee:focus-within .lv-marquee__track,
.lv-gallery.is-paused .lv-marquee__track { animation-play-state: paused; }
@keyframes lv-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.lv-marquee__item { flex: none; margin-right: 20px; }
.lv-marquee__btn {
	display: block; padding: 0; border: 0; background: none; cursor: zoom-in; border-radius: 22px; overflow: hidden;
	box-shadow: 0 10px 26px rgba(30, 95, 58, .14); transition: transform .25s, box-shadow .25s;
}
.lv-marquee__btn:hover, .lv-marquee__btn:focus-visible { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(30, 95, 58, .22); outline: 0; }
.lv-marquee__btn:focus-visible { outline: 3px solid var(--lv-coral); outline-offset: 3px; }
.lv-marquee__btn img { display: block; width: 260px; height: 347px; object-fit: cover; user-select: none; -webkit-user-drag: none; }

@media (max-width: 767px) {
	.lv-marquee__item { margin-right: 14px; }
	.lv-marquee__btn { border-radius: 18px; }
	.lv-marquee__btn img { width: 190px; height: 253px; }
	.lv-marquee__track { animation-duration: 38s; }
}

/* Без анимации: лента листается пальцем / колесом */
@media (prefers-reduced-motion: reduce) {
	.lv-marquee { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
	.lv-marquee__track { animation: none; }
	.lv-marquee__item[aria-hidden="true"] { display: none; }
}

/* Лайтбокс на <dialog> */
.lv-lb { padding: 0; border: 0; background: transparent; max-width: none; max-height: none; width: 100%; height: 100%; margin: 0; color: #fff; overflow: hidden; }
.lv-lb::backdrop { background: rgba(14, 33, 22, .88); }
.lv-lb[open] { display: grid; place-items: center; }
.lv-lb__figure { margin: 0; display: grid; justify-items: center; gap: 12px; padding: 24px 76px; max-width: 100%; box-sizing: border-box; }
.lv-lb__img { display: block; max-width: min(100%, 1000px); max-height: calc(100vh - 110px); width: auto; height: auto; border-radius: 16px; box-shadow: 0 20px 60px rgba(0, 0, 0, .45); background: #222; }
.lv-lb__caption { font: 500 15px/1.4 var(--lv-font-body); color: rgba(255, 255, 255, .85); text-align: center; min-height: 1.4em; }
.lv-lb__btn {
	position: absolute; display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%;
	background: rgba(255, 255, 255, .14); color: #fff; cursor: pointer; transition: background .2s;
}
.lv-lb__btn:hover, .lv-lb__btn:focus-visible { background: rgba(255, 255, 255, .3); outline: 0; }
.lv-lb__btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.lv-lb__close { top: 18px; right: 18px; }
.lv-lb__prev { left: 18px; top: 50%; transform: translateY(-50%); }
.lv-lb__next { right: 18px; top: 50%; transform: translateY(-50%); }
html.lv-lock-lb { overflow: hidden; }

@media (max-width: 767px) {
	.lv-lb__figure { padding: 64px 12px 24px; }
	.lv-lb__img { max-height: calc(100vh - 150px); }
	.lv-lb__prev, .lv-lb__next { top: auto; bottom: 16px; transform: none; }
	.lv-lb__prev { left: calc(50% - 60px); }
	.lv-lb__next { right: calc(50% - 60px); }
}
