hero-banner{display:flex;align-items:center;position:relative;overflow:hidden;transition:background-color .9s cubic-bezier(.4,0,.2,1),color .9s cubic-bezier(.4,0,.2,1);--hero-banner-scheme-button: var(--color-button)}.hero-banner .button{transition:box-shadow var(--duration-short) ease,background-color .9s cubic-bezier(.4,0,.2,1),color .9s cubic-bezier(.4,0,.2,1)}.hero-banner__inner{display:flex;flex-direction:column;align-items:center;gap:4rem;width:100%}@media screen and (max-width:989px){.hero-banner.banner--header-background .hero-banner__inner{margin-top:calc(var(--header-height, 10rem) + 6.4rem);margin-bottom:3.7rem}}.hero-banner--image-left .hero-banner__inner{flex-direction:column-reverse}.hero-banner__content{display:flex;flex-direction:column;align-items:flex-start;gap:1.6rem;width:100%;position:relative;z-index:2}.hero-banner__content--mobile-center{align-items:center;text-align:center}.hero-banner__content--mobile-right{align-items:flex-end;text-align:right}.hero-banner__content .caption-tag{margin-bottom:0}.hero-banner__heading,.hero-banner__text{margin:0;max-width:50rem}.hero-banner__buttons{display:flex;flex-wrap:wrap;gap:1.6rem;margin-top:.8rem}.hero-banner .button--light{--color-button-text: var(--hero-banner-scheme-button)}.hero-banner__visual{position:relative;width:100%;aspect-ratio:var(--feature-highlight-aspect-ratio, 4 / 3);max-width:50rem}.hero-banner .feature-highlight__trigger{bottom:auto;top:50%}.hero-banner__grid{display:none}.hero-banner__visual .feature-highlight__grid-line{top:-100%;width:1px;height:300%;transform:none;right:auto}.hero-banner__visual .feature-highlight__grid-line--left-a{left:26%}.hero-banner__visual .feature-highlight__grid-line--right-a{left:73%}.hero-banner__visual .feature-highlight__grid-line--left-b,.hero-banner__visual .feature-highlight__grid-line--right-b{left:-100vw;width:300vw;height:1px}.hero-banner__visual .feature-highlight__grid-line--left-b{top:26%}.hero-banner__visual .feature-highlight__grid-line--right-b{top:73%}.hero-banner__image-wrap{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:57%;z-index:1}.hero-banner__image{display:block;width:100%;height:auto}.hero-banner__visual .feature-highlight__neon-line{top:calc(100% + 150% * var(--feature-highlight-aspect-ratio, 1.33));left:50%;width:210%;height:4rem;transform-origin:0% 50%;transform:translateY(-50%) rotate(-90deg);clip-path:none;pointer-events:none}hero-banner:not(.hero-banner--hoverable):not(.is-active) .feature-highlight__neon-line-fill{transform:scaleX(0)}hero-banner:not(.hero-banner--hoverable).is-active .feature-highlight__neon-line-fill{transform:scaleX(1)}hero-banner.hero-banner--hoverable:has(.hero-banner__image-wrap:hover) .feature-highlight__neon-line-fill{transform:scaleX(1)}hero-banner.hero-banner--hoverable.is-visible:not(:has(.hero-banner__image-wrap:hover)) .feature-highlight__neon-line-fill{transform:scaleX(0)}@media(prefers-reduced-motion:reduce){hero-banner,.hero-banner .button{transition:none}}@media screen and (min-width:990px){.hero-banner__content:before,.hero-banner__content:after{content:"";flex:1 0 0%}.hero-banner__content:after{flex-grow:3}.hero-banner__grid{display:block}.hero-banner__visual .feature-highlight__neon-line{height:5rem}.hero-banner__inner{flex-direction:row;align-items:center;justify-content:space-between;gap:6rem}.hero-banner--image-left .hero-banner__inner{flex-direction:row-reverse}.hero-banner__content{width:45%;align-self:center;margin-top:6rem}.hero-banner__visual{width:50%;max-width:none}.hero-banner__buttons{position:relative;top:12rem}}@media screen and (max-width:749px){.hero-banner--small:not(.hero-banner--adapt){min-height:var(--banner-height-small-mobile)}.hero-banner--medium:not(.hero-banner--adapt){min-height:var(--banner-height-medium-mobile)}.hero-banner--large:not(.hero-banner--adapt){min-height:var(--banner-height-large-mobile)}.hero-banner--xl:not(.hero-banner--adapt){min-height:var(--banner-height-xl-mobile)}}@media screen and (min-width:750px){.hero-banner--small:not(.hero-banner--adapt){min-height:var(--banner-height-small)}.hero-banner--medium:not(.hero-banner--adapt){min-height:var(--banner-height-medium)}.hero-banner--large:not(.hero-banner--adapt){min-height:var(--banner-height-large)}.hero-banner--xl:not(.hero-banner--adapt){min-height:var(--banner-height-xl)}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/component-hero-banner.css.map */