.hero-banner{position:relative;overflow:hidden}.hero-banner--small .hero-banner__inner{min-height:42rem}.hero-banner--medium .hero-banner__inner{min-height:58rem}.hero-banner--large .hero-banner__inner{min-height:70rem}.hero-banner__media{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.hero-banner__bg-image,.hero-banner__video,.hero-banner__bg-placeholder svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.hero-banner__video-external{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.hero-banner__video-external .hero-banner__video{width:100vw;height:56.25vw;min-height:100%;min-width:177.78vh;top:50%;left:50%;transform:translate(-50%,-50%)}.hero-banner__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#000}.hero-banner__inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:3rem;padding-top:4rem;padding-bottom:4rem}.hero-banner__content{flex:1 1 50%;max-width:60rem}.hero-banner__heading{margin:0;font-family:Saira Condensed,Poppins,sans-serif;font-weight:900;font-style:normal;text-transform:uppercase;line-height:.9;letter-spacing:.005em}.hero-banner__heading p{margin:0}.hero-banner__heading--medium{font-size:clamp(3.4rem,5vw,5.4rem)}.hero-banner__heading--large{font-size:clamp(4rem,6.5vw,7rem)}.hero-banner__heading--xlarge{font-size:clamp(4.6rem,7.5vw,8rem)}.hero-banner__subheading{margin-top:1.6rem;font-size:1.6rem;max-width:44rem;color:rgba(var(--color-foreground),.85)}.hero-banner__button{margin-top:2.4rem}.hero-banner__foreground{flex:1 1 45%;display:flex;justify-content:flex-end;align-items:center}.hero-banner__foreground-image{display:block;width:100%;height:auto;max-height:52rem;object-fit:contain}@media screen and (max-width:989px){.hero-banner--small,.hero-banner--medium,.hero-banner--large{min-height:0}.hero-banner__inner{text-align:left;gap:1.6rem}.hero-banner--large .hero-banner__inner{min-height:50rem}.hero-banner__content{flex-basis:auto;max-width:100%}.hero-banner__foreground{width:100%;justify-content:center}.hero-banner__foreground-image{max-height:34rem}}@media screen and (max-width:749px){.hero-banner__heading--medium,.hero-banner__heading--large,.hero-banner__heading--xlarge{font-size:clamp(3rem,11vw,5.2rem)}.hero-banner--large .hero-banner__inner{min-height:48rem}}
/*# sourceMappingURL=/cdn/shop/t/31/assets/section-hero-banner.css.map */