.hero-banner{position:relative;display:flex;flex-direction:column;overflow:hidden;min-height:78svh;background:rgb(var(--color-background));color:rgb(var(--color-foreground))}@media screen and (min-width:750px){.hero-banner{min-height:92svh;max-height:68rem}}.hero-banner__media{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.hero-banner__media img{width:100%;height:100%;object-fit:cover;object-position:center var(--hero-position, center);display:block}.hero-banner__scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,var(--scrim-opacity, .25)),rgba(0,0,0,calc(var(--scrim-opacity, .25) * .45)) 45%,#0000 78%)}.hero-banner__content-wrap{position:relative;z-index:1;display:flex;flex:1;width:100%;padding-top:4rem;padding-bottom:calc(4rem + env(safe-area-inset-bottom,0px))}.hero-banner__content{display:flex;flex-direction:column;gap:1.6rem;max-width:54rem;width:100%;color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.18)}.hero-banner__content--bottom-left{align-self:flex-end;margin-top:auto;text-align:left;align-items:flex-start}.hero-banner__content--bottom-center{align-self:flex-end;margin:auto auto 0;text-align:center;align-items:center}.hero-banner__content--center-center{margin:auto;text-align:center;align-items:center}.hero-banner__eyebrow{color:#fff;opacity:.92}.hero-banner--no-media .hero-banner__content{color:rgb(var(--color-foreground));text-shadow:none}.hero-banner--no-media .hero-banner__eyebrow{color:rgb(var(--color-foreground))}.hero-banner__heading{font-family:var(--font-heading-family);font-style:var(--font-heading-style);font-weight:var(--font-heading-weight);font-size:clamp(3.2rem,2.4rem + 3vw,6rem);line-height:1.05;letter-spacing:.01em;margin:0;text-wrap:balance}.hero-banner__subheading{font-size:1.6rem;line-height:1.5;max-width:44rem;opacity:.96}.hero-banner__subheading p{margin:0}.hero-banner__actions{margin-top:.6rem}.hero-banner__actions .button{min-width:22rem}@media screen and (max-width:749px){.hero-banner__content{max-width:100%}.hero-banner__heading{font-size:clamp(2.8rem,2.2rem + 4vw,3.8rem)}.hero-banner__subheading{font-size:1.4rem}.hero-banner__actions .button{width:100%;min-width:0}}@media(prefers-reduced-motion:no-preference){.hero-banner__content{animation:hero-banner-fade-in .9s cubic-bezier(.2,.6,.2,1) both}}@keyframes hero-banner-fade-in{0%{opacity:0;transform:translateY(1.2rem)}to{opacity:1;transform:translateY(0)}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/section-hero-banner.css.map */
