

.vh-cover { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  margin: 0; padding: 0; border: 0; border-radius: inherit; cursor: pointer; color: #fff; font: inherit; -webkit-tap-highlight-color: transparent;
  background: linear-gradient(180deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,0) 35%, rgba(0,0,0,.34) 100%); }
.vh-cover[hidden] { display: none; }
.vh-cover-plain { background: radial-gradient(120% 80% at 50% 20%, var(--hero-hi) 0%, var(--hero-bg) 55%, var(--hero-lo) 100%); color: var(--on-hero); }
.vh-cover-play { position: relative; width: 76px; height: 76px; border-radius: 50%; background: rgba(255,255,255,.94); box-shadow: 0 10px 30px rgba(0,0,0,.32), 0 0 0 8px rgba(255,255,255,.18);
  transition: transform .18s ease, box-shadow .18s ease; }
.vh-cover-play::after { content: ''; position: absolute; left: 31px; top: 23px; border-left: 24px solid var(--hero-bg); border-top: 15px solid transparent; border-bottom: 15px solid transparent; }
.vh-cover-text { padding: 6px 14px; border-radius: 999px; background: rgba(0,0,0,.46); color: #fff; font-size: .82rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.vh-cover:hover .vh-cover-play, .vh-cover:focus-visible .vh-cover-play { transform: scale(1.06); box-shadow: 0 12px 34px rgba(0,0,0,.38), 0 0 0 10px rgba(255,255,255,.24); }
.vh-cover:focus-visible { outline: 3px solid #fff; outline-offset: -6px; }
.vh-cover:active .vh-cover-play { transform: scale(.97); }
.vh-player video[poster] { object-fit: cover; }

.vh-still { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.vh-player.vh-has-still video { position: relative; background: transparent; }


.vh-more { position: fixed; left: 50%; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); z-index: 5; transform: translateX(-50%); pointer-events: none;
  display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 7px 14px 9px; border-radius: 999px;
  background: rgba(255,255,255,.92); color: var(--navy); box-shadow: 0 6px 20px rgba(0,0,0,.16); font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.vh-more[hidden] { display: none; }
.vh-more-chev { width: 9px; height: 9px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); animation: vh-more-nudge 1.8s ease-in-out infinite; }
@keyframes vh-more-nudge { 0%, 100% { transform: translateY(-2px) rotate(45deg); opacity: .55; } 50% { transform: translateY(2px) rotate(45deg); opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .vh-more-chev { animation: none; }
  .vh-cover-play { transition: none; }
  .vh-cover:hover .vh-cover-play, .vh-cover:focus-visible .vh-cover-play, .vh-cover:active .vh-cover-play { transform: none; }
}


.vi-play-wrap .vi-cover { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  margin: 0; padding: 0; border: 0; cursor: pointer; font: inherit; color: #fff; -webkit-tap-highlight-color: transparent;
  background: radial-gradient(120% 80% at 50% 20%, var(--navy-800) 0%, var(--navy-950) 70%); }
.vi-cover canvas { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; }
.vi-cover .vh-cover-play, .vi-cover .vh-cover-text { position: relative; }
.vi-cover:focus-visible { outline: 3px solid #fff; outline-offset: -6px; }


.vi-top { min-width: 0; }
.vi-top .vi-kicker { flex: none; }
.vi-top .vi-logo-img { flex: 0 1 auto; min-width: 0; object-fit: contain; object-position: left center; }
.vi-top .vi-logo-text { flex: 0 1 auto; min-width: 0; max-width: none; }
