/* 6.4 Video testimonials carousel (LHR_Testimonials). Own classes: vt-*.
   One row height; each video is as wide as its own shape (portrait phone footage or landscape). */
.vt { padding-block: var(--s-6); background: var(--bg); border-top: 1px solid var(--rule); }
.vt__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: var(--s-2) var(--s-4); margin-bottom: var(--s-4); }
.vt__h { font-size: var(--fs-3); }
.vt__lead { color: var(--ink-2); max-width: 44ch; }
.vt__car { position: relative; --vt-h: clamp(300px, 30vw, 440px); }
.vt__track {
	display: flex; gap: var(--s-3); align-items: center;
	overflow-x: auto; overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory; scroll-padding-inline: 0;
	padding-bottom: var(--s-2);
	scrollbar-width: none; -ms-overflow-style: none;
	container-type: inline-size;
}
.vt__track::-webkit-scrollbar { display: none; }
.vt__item { flex: 0 0 auto; scroll-snap-align: start; width: min(calc(var(--vt-h) * var(--vt-ar, 0.5625)), 100cqw); }
.vt__media { position: relative; aspect-ratio: var(--vt-ar, 0.5625); background: var(--c-ink); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.vt__video { display: block; width: 100%; height: 100%; object-fit: cover; background: var(--c-ink); }
.vt__media[data-protect] .vt__video { -webkit-user-drag: none; user-select: none; -webkit-touch-callout: none; }
/* The logo sits in the centre and never gets in the way of the controls. */
.vt__wm { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); height: 11%; width: auto; aspect-ratio: 1200 / 570; background: url("../img/logo-white.png") no-repeat center / contain; opacity: .7; pointer-events: none; filter: drop-shadow(0 1px 6px rgba(0, 0, 0, .45)); }
.vt__media.is-playing .vt__wm { opacity: .5; }
/* Big play button over the poster; gone while playing. */
.vt__play { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; transform: translate(-50%, -50%); border-radius: 50%; border: 0; cursor: pointer; background: var(--c-white); color: var(--c-ink); box-shadow: 0 6px 24px rgba(0, 0, 0, .35); display: grid; place-items: center; transition: transform .2s var(--ease), opacity .2s var(--ease); }
.vt__play::before { content: ""; width: 0; height: 0; border-style: solid; border-width: 11px 0 11px 19px; border-color: transparent transparent transparent currentColor; margin-left: 4px; }
.vt__play:hover { transform: translate(-50%, -50%) scale(1.06); }
.vt__media.is-playing .vt__play, .vt__media.is-started .vt__play { opacity: 0; pointer-events: none; }
.vt__media.is-paused.is-started .vt__play { opacity: 1; pointer-events: auto; }
.vt__nav { display: flex; align-items: center; gap: var(--s-2); margin-top: var(--s-3); }
.vt__btn, .vt__pause { width: 44px; height: 44px; border: 1.5px solid var(--rule); border-radius: 50%; display: grid; place-items: center; color: var(--ink); background: transparent; cursor: pointer; transition: border-color .2s var(--ease); }
.vt__btn:hover, .vt__pause:hover { border-color: var(--ink); }
.vt__btn[disabled] { opacity: .35; cursor: default; }
.vt__btn::before { content: ""; width: 10px; height: 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); margin-left: -3px; }
.vt__btn--prev::before { transform: rotate(135deg); margin-left: 3px; }
.vt__pause { margin-left: auto; width: 36px; height: 36px; }
.vt__pause::before { content: ""; width: 10px; height: 10px; border-left: 3px solid currentColor; border-right: 3px solid currentColor; }
.vt__pause[aria-pressed="true"]::before { width: 0; height: 0; border-style: solid; border-width: 6px 0 6px 10px; border-color: transparent transparent transparent currentColor; margin-left: 2px; }
@media (max-width: 1000px) {
	.vt { padding-block: var(--s-5); }
	.vt__car { --vt-h: min(calc(72vw * 16 / 9), 520px); }
	.vt__track { scroll-padding-inline: 0; }
}
@media (prefers-reduced-motion: reduce) { .vt__play { transition: none; } }
