/* Homepage hero welcome video (2026-10-11): same phone-shaped card as the poster it replaces; English shows the 16:9 cut on desktop. */
.hv-frame { position: relative; background: #0a0a0d; }
.hv-frame .hv-poster { display: block; width: 100%; height: 100%; object-fit: cover; }
.hv-frame.is-playing .hv-poster { display: none; }
.hv-frame video { display: block; width: 100%; height: 100%; object-fit: cover; background: #0a0a0d; }
.hv-still { position: absolute; inset: 0; z-index: 2; display: block; margin: 0; cursor: pointer; }
.hv-still img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hv-card.is-playing .hv-still { display: none; }
.hv-sound { position: absolute; left: 50%; top: 12px; z-index: 4; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; background: rgba(10, 10, 13, .8); color: #fff; border: 1px solid rgba(255, 255, 255, .25); border-radius: 999px; padding: 8px 14px; font: 600 .85rem/1.1 inherit; cursor: pointer; white-space: nowrap; }
.hv-sound:hover, .hv-sound:focus-visible { background: #ec0017; border-color: #ec0017; }
.hv-sound[hidden] { display: none; }
@media (min-width: 900px) {
  .layout-v3 .hero-grid.video-first.hv-wide { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .layout-v3 .hero-video .video-card.hv-169 { width: 100%; max-width: 560px; }
  .hv-169 .video-frame { aspect-ratio: 16 / 9; width: 100%; }
}