.video-hero{position:relative;color:#fff;min-height:max(var(--video-hero-height, 70svh),22rem);display:grid;align-items:center}.video-hero--small{--video-hero-height: 50svh}.video-hero--medium{--video-hero-height: 70svh}.video-hero--large{--video-hero-height: 88svh}.video-hero__media{position:absolute;inset:var(--section-pt, 0) 0 var(--section-pb, 0);background:#111}.video-hero__media>picture{display:block;height:100%}.video-hero__video,.video-hero__poster,.video-hero__placeholder{width:100%;height:100%;object-fit:cover}.video-hero__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,var(--overlay-opacity, .35))}.video-hero__content{position:relative;z-index:1;display:grid;gap:1rem;justify-items:center;text-align:center;max-width:40rem;padding-block:clamp(3rem,10vw,6rem);text-shadow:0 2px 24px rgba(0,0,0,.35)}.video-hero__text{max-width:32rem;color:#ffffffd1}.video-hero__actions{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center}.video-hero__actions .button--secondary{--button-bg: transparent;--button-fg: #fff;--button-border: #fff}.video-hero__desktop{display:none}@media screen and (min-width:750px){.video-hero__mobile{display:none}.video-hero__desktop{display:block}.video-hero--desktop-split{grid-template-columns:minmax(0,1fr) auto;gap:clamp(2rem,5vw,5rem);padding-inline:var(--page-margin, clamp(1.25rem, 4vw, 3rem));color:var(--color-foreground);background:var(--color-background)}.video-hero--desktop-split .video-hero__media{position:relative;inset:auto;grid-column:2;grid-row:1;height:var(--video-hero-height, 70svh);max-height:52rem;aspect-ratio:var(--split-ratio, .5625);max-width:45vw;margin-block:var(--section-pt, 0) var(--section-pb, 0);overflow:hidden}.video-hero--desktop-split .video-hero__overlay{display:none}.video-hero--desktop-split .video-hero__content{grid-column:1;grid-row:1;justify-self:end;justify-items:start;margin:0;text-align:left;text-shadow:none}.video-hero--desktop-split .video-hero__text{color:var(--color-muted)}.video-hero--desktop-split .video-hero__actions{justify-content:flex-start}.video-hero--desktop-split .video-hero__actions .button--secondary{--button-fg: var(--color-foreground);--button-border: var(--color-foreground)}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/section-video-hero.css.map */