.video-testimonial .video-cover { aspect-ratio: 9 / 16; background: #182129; }
.video-cover video { display: block; width: 100%; height: 100%; object-fit: contain; }
.video-start { position: absolute; inset: 0; display: grid; place-items: center; width: 100%; border: 0; border-radius: inherit; cursor: pointer; color: #fff; background: linear-gradient(transparent 65%, #0005); }
.video-start svg { width: 64px; height: 64px; padding: 17px; border-radius: 50%; background: #fff; fill: #192c40; box-shadow: 0 4px 24px #0002; transition: transform .15s; }
.video-start:hover svg { transform: scale(1.08); }
.video-start:focus-visible { outline: 3px solid var(--blue, #266ac7); outline-offset: -5px; }
.video-duration { position: absolute; right: 14px; bottom: 14px; padding: 3px 8px; border-radius: 6px; background: #0009; color: #fff; font-size: 14px; pointer-events: none; }
.video-error { position: absolute; inset: 0; padding: 24px; display: flex; flex-direction: column; justify-content: center; gap: 16px; background: #182129ee; color: #fff; text-align: center; }
.video-error button, .video-error a { color: inherit; font: inherit; }
.video-error button { border: 1px solid #fff; border-radius: 8px; padding: 10px; background: transparent; cursor: pointer; }
.video-start[hidden], .video-duration[hidden], .video-error[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .video-start svg { transition: none; } }
