.hero-banner{--aspect-ratio: 393 / 660;--aspect-ratio-desktop: 1440 / 835;aspect-ratio:var(--aspect-ratio);display:flex;flex-direction:column;justify-content:end;max-height:var(--max-height-mobile, 660px);overflow:hidden;position:relative;width:100%}.hero-banner--vh-limit{max-height:calc(100svh - var(--header-height))}.hero-banner__media{align-items:center;display:flex;justify-content:center;top:0;right:0;bottom:0;left:0;position:absolute;z-index:-1}.hero-banner__overlay{display:flex;flex-direction:column;height:70%;gap:1.25rem;left:50%;padding-block:var(--spacing-40);padding-inline:var(--container-gutter);position:absolute;transform:translate(-50%);width:100%}.hero-banner__header{align-items:start;display:inline-flex;flex-direction:column;gap:.625rem}.hero-banner__footer{--transition-delay-multiplier: 2;align-items:var(--align-items, start);display:inline-flex;flex-direction:column;gap:var(--spacing-24)}.hero-banner__content{max-width:317px}.hero-banner__buttons{display:flex;justify-content:var(--align-items);gap:1.375rem;flex-wrap:wrap}.hero-banner--stacked{overflow:visible}.hero-banner--stacked .hero-banner__media{aspect-ratio:393 / 307;overflow:hidden;position:static}.hero-banner--stacked .hero-banner__overlay{background-color:var(--stacked-overlay-background, var(--color-accent-blush));height:auto;left:unset;margin-block-start:0;padding-inline:1.6875rem;position:relative;transform:unset}.hero-banner--stacked .hero-banner__overlay:before{background-color:inherit;content:"";display:block;height:10px;left:0;-webkit-mask-image:var(--section-border-url);mask-image:var(--section-border-url);-webkit-mask-repeat:repeat-x;mask-repeat:repeat-x;-webkit-mask-position:left bottom;mask-position:left bottom;position:absolute;top:1px;transform:translateY(-100%);width:100%}.hero-banner__button{font-size:var(--font-size-16)}.hero-banner__thumbnail{--frame-url: var(--product-card-hover-frame-url);--gutter: .4rem;--transition-delay-multiplier: 3;aspect-ratio:300 / 396;position:absolute;top:-60%;right:var(--container-gutter);max-width:173px;transition-property:opacity,top;z-index:1}intersection-state:not(.has-intersected) .hero-banner__thumbnail{opacity:0;top:-55%}@media (min-width: 1024px){.hero-banner--stacked .hero-banner__heading{font-size:3rem}}@media (min-width: 2000px){.hero-banner--stacked .hero-banner__heading{font-size:var(--h2-font-size)}}@media (max-width: 1023px){.hero-banner.hero-banner--stacked{aspect-ratio:unset;max-height:100%}}@media (min-width: 768px){.hero-banner{aspect-ratio:var(--aspect-ratio-desktop);max-height:var(--max-height-desktop, 734px)}.hero-banner__overlay{gap:var(--spacing-24);padding-inline:3.75rem}.hero-banner__buttons{gap:2.875rem}.hero-banner__header{gap:var(--spacing-16)}.hero-banner__footer{gap:var(--spacing-32)}.hero-banner__content{max-width:400px}.hero-banner--vh-limit{max-height:100vh}}@media (min-width: 1024px){.hero-banner--stacked{--overlay-width: 45%;--media-width: 55%;display:grid;grid-template-areas:"left right";grid-template-columns:var(--media-width) var(--overlay-width)}.hero-banner--stacked .hero-banner__media{aspect-ratio:unset;grid-area:left}.hero-banner:not(.hero-banner--flipped):has(.hero-banner__thumbnail) .hero-banner__overlay{padding-inline-start:6rem}.hero-banner--stacked .hero-banner__overlay{grid-area:right;padding-block:var(--spacing-160) 7.5rem}.hero-banner--stacked.hero-banner--flipped{grid-template-columns:var(--overlay-width) var(--media-width)}.hero-banner--stacked.hero-banner--flipped .hero-banner__overlay{grid-area:left}.hero-banner--stacked.hero-banner--flipped .hero-banner__media{grid-area:right}.hero-banner--stacked .hero-banner__header{max-width:400px}.hero-banner--stacked .hero-banner__footer{max-width:362px}.hero-banner--stacked .hero-banner__content{max-width:100%}.hero-banner--stacked .hero-banner__overlay:before{height:100%;-webkit-mask-image:var(--section-border-vertical-url);mask-image:var(--section-border-vertical-url);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:repeat-y;mask-repeat:repeat-y;position:absolute;top:0;left:1px;transform:translate(-100%) rotate(180deg);width:10px}.hero-banner--stacked.hero-banner--flipped .hero-banner__overlay:before{left:unset;right:1px;transform:translate(100%)}.hero-banner__button{font-size:var(--font-size-18)}.hero-banner__thumbnail{--gutter: .5rem;bottom:var(--spacing-16);height:54%;right:90%;top:unset;max-width:100%;transition-property:opacity,bottom;width:auto}.hero-banner--flipped .hero-banner__thumbnail{bottom:var(--spacing-16);left:90%;right:unset}intersection-state:not(.has-intersected) .hero-banner__thumbnail{bottom:0}}@media (min-width: 1328px){.hero-banner__overlay{height:56%}.hero-banner--stacked{--overlay-width: 32.5%;--media-width: 67.5%}.hero-banner--stacked .hero-banner__overlay{padding-inline:15%}.hero-banner:not(.hero-banner--flipped):has(.hero-banner__thumbnail) .hero-banner__overlay{padding-inline-start:6rem}}
/*# sourceMappingURL=/cdn/shop/t/45/assets/hero-banner.css.map */