/* Hero video (Honolulu pattern): the footage stays clear and dominant; only a neutral left-to-right legibility overlay sits behind the copy. */
.race-hero-media { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; }
.race-hero.has-video { background: var(--vr-navy-hero); }
.race-hero.has-video::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(5, 12, 18, 0.78) 0%, rgba(5, 12, 18, 0.58) 40%, rgba(5, 12, 18, 0.2) 72%, rgba(5, 12, 18, 0.06) 100%); }
.race-hero.has-video > .container { position: relative; z-index: 2; }
@media (max-width: 899px) { .race-hero.has-video::before { background: linear-gradient(180deg, rgba(5, 12, 18, 0.66) 0%, rgba(5, 12, 18, 0.46) 60%, rgba(5, 12, 18, 0.3) 100%); } }
/* The right-hand fact card sits over the brightest part of the footage: a flat dark fill keeps it readable. */
.race-hero.has-video .glance { background: rgba(7, 17, 29, 0.78); }