.collection-hero__inner{display:flex;flex-direction:column}.collection-hero--with-image .collection-hero__inner{margin-bottom:0;padding-bottom:2rem}@media screen and (min-width: 750px){.collection-hero.collection-hero--with-image{padding:calc(4rem + var(--page-width-margin)) 0 calc(4rem + var(--page-width-margin));overflow:hidden}.collection-hero--with-image .collection-hero__inner{padding-bottom:0}}.collection-hero__text-wrapper{flex-basis:100%;padding:40px 0 20px}.collection-hero__text-wrapper--center{text-align:center;padding:30px 0}.collection-hero__image-container{width:100%;aspect-ratio:4 / 3;border-radius:20px;overflow:hidden;position:relative;margin-bottom:15px}.collection-hero__image-container img{width:100%;height:100%;object-fit:cover;object-position:center;position:absolute;top:0;right:0;bottom:0;left:0}@media screen and (min-width: 750px){.collection-hero__image-container{width:100%;aspect-ratio:2 / 1;margin-bottom:40px}.collection-hero{padding:0}}.collection-hero__text-overlay-wrapper{position:absolute;width:100%;height:100%;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:flex-end;z-index:2;padding:30px 20px;color:var(--color-foreground)}.collection-hero__title{margin:0}.collection-hero__text-wrapper--center .collection-hero__title{margin-left:auto;margin-right:auto}.collection-hero__title+.collection-hero__description{margin-top:1.5rem;font-size:1.6rem;line-height:calc(1 + .5 / var(--font-body-scale))}@media screen and (min-width: 750px){.collection-hero__title+.collection-hero__description{font-size:1.8rem}.collection-hero__description{max-width:66.67%}.collection-hero__text-wrapper--center .collection-hero__description{margin-left:auto;margin-right:auto}.collection-hero--with-image .collection-hero__description{max-width:100%}.collection-hero__text-wrapper--center .collection-hero__title{font-size:80px;font-style:normal;font-weight:500;line-height:100%;letter-spacing:-1.6px}}.collection-hero--with-image .collection-hero__title{margin:0}.collection-hero--with-image .collection-hero__text-wrapper{padding:5rem 0 4rem}@media screen and (min-width: 750px){.collection-hero__text-wrapper--center{text-align:center;padding:80px 0 40px}.collection-hero__text-overlay-wrapper{padding:60px 40px}}
/*# sourceMappingURL=/cdn/shop/t/642/assets/component-collection-hero.css.map */
