.hp-collection-banner{--hp-collection-banner-height: 32rem;--hp-collection-banner-height-mobile: 24rem;width:100%}section.collection__wrapper.hp-collection-banner-section{display:block}@media(min-width:1024px){section.collection__wrapper.hp-collection-banner-section{display:block;grid-template-columns:unset;grid-template-areas:unset}}.hp-collection-banner__inner{position:relative;display:flex;align-items:stretch;justify-content:center;width:100%;min-width:0;overflow:hidden;border-radius:inherit}.hp-collection-banner--no-media .hp-collection-banner__inner{flex-direction:column;align-items:stretch;min-height:auto;overflow:visible;background-color:rgb(var(--color-background))}.hp-collection-banner--has-media .hp-collection-banner__inner{min-height:0}.hp-collection-banner--has-media .hp-collection-banner__media{position:relative;z-index:0;width:100%;aspect-ratio:var(--hp-banner-aspect-ratio-mobile)}@media(min-width:768px){.hp-collection-banner--has-media .hp-collection-banner__media{aspect-ratio:var(--hp-banner-aspect-ratio)}}.hp-collection-banner--has-media .hp-collection-banner__picture{display:block;width:100%;height:100%}.hp-collection-banner--has-media .hp-collection-banner__image{width:100%;height:100%;object-fit:cover;object-position:center}.hp-collection-banner__overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.hp-collection-banner--has-media .hp-collection-banner__content{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2}.hp-collection-banner--no-media .hp-collection-banner__content{position:relative;z-index:2;justify-content:flex-start;gap:.65rem;padding-block:1rem 1.2rem;padding-inline:1.6rem}@media(min-width:768px){.hp-collection-banner--no-media .hp-collection-banner__content{padding-block:1.2rem 1.4rem}}.hp-collection-banner--no-media.hp-collection-banner--has-subnav .hp-collection-banner__content{padding-block-end:.75rem}.hp-collection-banner__content{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.2rem;box-sizing:border-box;width:100%;min-width:0;padding-block:2.4rem;padding-inline:1.6rem;text-align:center}.hp-collection-banner--has-subnav.hp-collection-banner--has-media .hp-collection-banner__content{padding-block:2rem 6.2rem}.hp-collection-banner--subs-slider.hp-collection-banner--has-media .hp-collection-banner__content{padding-block-end:6.2rem}@media(min-width:768px){.hp-collection-banner--has-subnav.hp-collection-banner--has-media .hp-collection-banner__content{padding-block:2.4rem 6.8rem}.hp-collection-banner--subs-slider.hp-collection-banner--has-media .hp-collection-banner__content{padding-block-end:7.6rem}}.hp-collection-banner--has-subnav.hp-collection-banner--no-media .hp-collection-banner__inner{padding-block-end:.8rem}.hp-collection-banner__title{margin:0;width:100%;min-width:0;max-width:100%;overflow-wrap:normal;word-break:normal;white-space:normal;text-align:center}.hp-collection-banner__content .breadcrumbs{flex-wrap:wrap;justify-content:center;min-width:0}.hp-collection-banner--has-media .hp-collection-banner__content,.hp-collection-banner--has-media .hp-collection-banner__title,.hp-collection-banner--has-media .hp-collection-banner__content .breadcrumbs a{color:#fff}.hp-collection-banner--has-media .hp-collection-banner__content .breadcrumbs__sep,.hp-collection-banner--has-media .hp-collection-banner__content .breadcrumbs__last{color:#ffffffd9}.hp-collection-banner--no-media .hp-collection-banner__content,.hp-collection-banner--no-media .hp-collection-banner__title,.hp-collection-banner--no-media .hp-collection-banner__content .breadcrumbs a{color:#000}.hp-collection-banner--no-media .hp-collection-banner__content .breadcrumbs__sep,.hp-collection-banner--no-media .hp-collection-banner__content .breadcrumbs__last{color:#000000a6}.hp-collection-banner__subs-bar{position:absolute;z-index:3;inset-inline:0;inset-block-end:0;padding:3.6rem .8rem 1.2rem;background:linear-gradient(180deg,transparent 0%,rgb(0 0 0 / 35%) 38%,rgb(0 0 0 / 72%) 100%);pointer-events:none}.hp-collection-banner--has-media .hp-collection-banner__subs-bar{inset-block-end:0;padding:2.8rem .8rem .85rem}@media(min-width:768px){.hp-collection-banner--has-media .hp-collection-banner__subs-bar{padding:3.2rem 1.2rem 1rem}}.hp-collection-banner--no-media .hp-collection-banner__subs-bar{position:relative;inset:auto;width:100%;margin-top:.35rem;padding:0 1.6rem 1.2rem;background:none;pointer-events:auto}@media(min-width:768px){.hp-collection-banner--no-media .hp-collection-banner__subs-bar{padding-inline:1.6rem}}.hp-collection-banner__subs-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;width:100%;margin:0;padding:0;pointer-events:auto}.hp-collection-banner__subs-grid-item{display:flex;min-width:0}.hp-collection-banner__subs-bar--slider{display:flex;flex-direction:column;align-items:center}.hp-collection-banner__subs-inner{width:min(100%,72rem);max-width:calc(100% - 2.4rem);margin-inline:auto;pointer-events:auto}.hp-collection-banner__subs-scroll{display:flex;gap:.8rem;align-items:stretch;width:100%;margin:0;padding:0 0 .2rem;overflow-x:auto;scroll-snap-type:x proximity;scroll-padding-inline:.2rem;scrollbar-width:none;-webkit-overflow-scrolling:touch}.hp-collection-banner__subs-scroll::-webkit-scrollbar{display:none}.hp-collection-banner__subs-scroll-item{flex:0 0 auto;width:min(72vw,18rem);scroll-snap-align:start}@media(min-width:768px){.hp-collection-banner__subs-scroll{display:none}}.hp-collection-banner__subs-carousel{width:100%}.hp-collection-banner__subs-slider-row{display:flex;align-items:center;gap:.4rem;width:100%}.hp-collection-banner__subs-viewport{overflow:hidden}.hp-collection-banner__subs-slide{display:flex;align-items:stretch;height:auto}.hp-collection-banner__subs-nav{--carousel-button-size: 3.2rem;flex-shrink:0;border:none;color:#ffffffeb;background:transparent;transform:translateY(3px);transition:opacity .2s ease,transform .2s ease}.hp-collection-banner__subs-nav .carousel__button-icon{width:1.6rem;height:1.6rem}.hp-collection-banner__subs-nav:hover:not(.swiper-button-disabled){opacity:1;transform:translateY(3px) scale(1.06)}.hp-collection-banner__subs-nav.swiper-button-disabled{opacity:.35;pointer-events:none}.hp-collection-banner__subs-dots{--carousel-controls-margin-top: 0;justify-content:center;width:100%;margin-block-start:calc(1rem + 5px);pointer-events:auto}.hp-collection-banner__subs-dots .carousel__pagination--bullet{position:static;width:auto}.hp-collection-banner__subs-carousel .swiper-pagination-bullets{display:flex;align-items:center;justify-content:center;gap:.5rem}.hp-collection-banner__subs-carousel .swiper-pagination-bullet{width:.45rem;height:.45rem;margin:0!important;border-radius:999px;background:#ffffff61;opacity:1;transition:width .25s ease,background-color .25s ease,opacity .25s ease}.hp-collection-banner__subs-carousel .swiper-pagination-bullet-active{width:1.8rem;background:#fff}.hp-collection-banner__subs-chip{display:flex;align-items:center;gap:.65rem;width:100%;max-width:100%;min-width:0;min-height:4.4rem;padding:.3rem .75rem .3rem .3rem;border:1px solid rgb(255 255 255 / 18%);border-radius:999px;color:#fffffff5;text-decoration:none;background:#08080847;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px #ffffff14;transition:background-color var(--animation-duration--medium, .25s) var(--animation-easing, ease),border-color var(--animation-duration--medium, .25s) var(--animation-easing, ease),color var(--animation-duration--medium, .25s) var(--animation-easing, ease),transform var(--animation-duration--medium, .25s) var(--animation-easing, ease),box-shadow var(--animation-duration--medium, .25s) var(--animation-easing, ease)}.hp-collection-banner__subs-chip:hover{border-color:#ffffff52;background:#ffffff24;transform:translateY(-1px)}.hp-collection-banner__subs-chip.is-active{border-color:#fffffff2;color:#121212;background:#fff;box-shadow:0 8px 24px #0000002e;transform:none}.hp-collection-banner__subs-chip.is-active .hp-collection-banner__subs-label{font-weight:600}.hp-collection-banner__subs-chip.is-active:hover{background:#fff;transform:none}.hp-collection-banner__subs-thumb{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:3.6rem;height:3.6rem;overflow:hidden;border:none;border-radius:50%;background:#ffffff1a;box-shadow:inset 0 0 0 1px #ffffff38}.hp-collection-banner__subs-chip.is-active .hp-collection-banner__subs-thumb{box-shadow:inset 0 0 0 1px #fff,0 0 0 2px #12a3df}.hp-collection-banner__subs-thumb-image{width:100%;height:100%;object-fit:cover;object-position:center}.hp-collection-banner__subs-thumb-fallback{color:inherit;font-size:1.4rem;font-weight:700;line-height:1;text-transform:uppercase}.hp-collection-banner__subs-label{flex:1;min-width:0;overflow:hidden;font-size:1.15rem;font-weight:500;line-height:1.28;letter-spacing:-.01em;text-align:start;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal}.hp-collection-banner--no-media .hp-collection-banner__subs-chip{border-color:#0000001a;color:#000000c7;background:#ffffffe5;-webkit-backdrop-filter:none;backdrop-filter:none}.hp-collection-banner--no-media .hp-collection-banner__subs-chip.is-active{border-color:#111;color:#fff;background:#111}.hp-collection-banner--no-media .hp-collection-banner__subs-thumb{border-color:#0000001f;background:#0000000d}.hp-collection-banner--no-media .hp-collection-banner__subs-nav{color:#111;background:transparent}.hp-collection-banner--no-media .hp-collection-banner__subs-carousel .swiper-pagination-bullet{--swiper-pagination-bullet-inactive-color: rgb(0 0 0 / 25%);--swiper-pagination-color: #111}@media(max-width:767.98px){.hp-collection-banner__subs-bar--slider .hp-collection-banner__subs-inner{width:100%;max-width:100%;padding-inline:1.2rem}}@media(min-width:768px){.hp-collection-banner__subs-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.hp-collection-banner__subs-bar{padding-inline:1.2rem}.hp-collection-banner__subs-slider-row{gap:.5rem}.hp-collection-banner__subs-nav{--carousel-button-size: 3.4rem}.hp-collection-banner__subs-nav .carousel__button-icon{width:1.8rem;height:1.8rem}.hp-collection-banner__subs-chip{gap:.75rem;min-height:4.6rem;padding-inline-end:.85rem}.hp-collection-banner__subs-label{font-size:1.2rem}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/hp-collection-banner.css.map */