/* Only these two buyer-journey clips: the main VSL is unaffected. */
.scenario-video { min-width: 0; width: 100%; overflow: hidden; border: 1px solid rgb(11 13 18 / 16%); border-radius: 10px; background: #0e0e10; box-shadow: 0 18px 48px rgb(11 13 18 / 10%); }
.scenario-video-stage { position: relative; width: 100%; aspect-ratio: var(--scenario-video-ratio, 8 / 5); }
.scenario-video mux-player { position: absolute; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; --controls: none; --top-controls: none; --center-controls: none; --bottom-controls: none; --title-display: none; --media-object-fit: contain; }
.scenario-video-toggle { position: absolute; inset: 0; display: grid; place-items: center; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; color: #fff; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.scenario-video-toggle:disabled { cursor: wait; }
.scenario-video-icon { display: grid; place-items: center; width: clamp(48px, 6vw, 64px); height: clamp(48px, 6vw, 64px); border: 1px solid rgb(255 255 255 / 40%); border-radius: 50%; background: rgb(0 0 0 / 48%); box-shadow: 0 4px 18px rgb(0 0 0 / 15%); transition: opacity 180ms, background 180ms; }
.scenario-video-icon svg { width: 28px; height: 28px; fill: currentColor; }
.scenario-video-pause, .scenario-video.is-playing .scenario-video-play { display: none; }
.scenario-video.is-playing .scenario-video-pause { display: block; }
@media (hover: hover) {
  .scenario-video.is-playing .scenario-video-icon { opacity: 0; }
  .scenario-video.is-playing:hover .scenario-video-icon,
  .scenario-video-toggle:focus-visible .scenario-video-icon { opacity: 1; }
}
.scenario-video-toggle:focus-visible { outline: 2px solid #ff5a00; outline-offset: -4px; }
.scenario-video-progress { padding: 0 12px; }
.scenario-video-progress input { display: block; appearance: none; -webkit-appearance: none; width: 100%; height: 30px; margin: 0; border: 0; background: transparent; cursor: pointer; touch-action: pan-y; }
.scenario-video-progress input::-webkit-slider-runnable-track { height: 3px; border-radius: 9px; background: linear-gradient(to right, #ff5a00 0 var(--played, 0%), #444448 var(--played, 0%) 100%); }
.scenario-video-progress input::-moz-range-track { height: 3px; border-radius: 9px; background: #444448; }
.scenario-video-progress input::-moz-range-progress { height: 3px; background: #ff5a00; }
.scenario-video-progress input::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: 11px; height: 11px; margin-top: -4px; border: 0; border-radius: 50%; background: #fff; }
.scenario-video-progress input::-moz-range-thumb { width: 11px; height: 11px; border: 0; border-radius: 50%; background: #fff; }
.scenario-video-progress input:focus-visible { outline: 2px solid #ff5a00; outline-offset: 0; }
.scenario-video-progress input:disabled { opacity: .45; cursor: default; }
.scenario-video-error { margin: 0; padding: 0 12px 12px; color: #ebe8e0; font-size: .8125rem; }
.scenario-video-error[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .scenario-video-icon { transition: none; } }
