.hero-list{padding:80px 0;position:relative}.hero-list__images{grid-column:1 / span 6;position:relative;height:calc(100vh - 64px);position:sticky;top:32px}.hero-list__image-item{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:opacity .5s ease;display:flex;flex-direction:column;z-index:0;pointer-events:none}.hero-list__image-item.is-active{opacity:1;z-index:1;pointer-events:auto}.hero-list__image-wrapper{width:100%;flex:1;position:relative;overflow:hidden}.hero-list__image{width:100%;height:100%;object-fit:cover;display:block}.hero-list__figure-caption{margin-top:8px;display:flex;gap:16px;opacity:.5}.hero-list__content{grid-column:-5 / -1;height:calc(100vh - 64px);position:sticky;top:32px;display:flex;flex-direction:column;justify-content:space-between}.hero-list__header{margin-bottom:32px}.hero-list__title{margin-bottom:24px;text-transform:uppercase}.hero-list__items{display:flex;flex-direction:column;overflow-y:auto;padding-bottom:18px;-ms-overflow-style:none;scrollbar-width:none}.hero-list__items::-webkit-scrollbar{display:none}.hero-list__item{display:flex;gap:16px;cursor:pointer;opacity:.2;align-items:stretch;padding:8px 0;border-top:1px solid rgba(0,0,0,.2);border-bottom:1px solid rgba(0,0,0,.2);position:relative;z-index:0;transition:opacity .3s ease}.hero-list[data-header-color=light] .hero-list__item{border-color:#fff3}.hero-list__item+.hero-list__item{margin-top:-1px}.hero-list__item.is-active{opacity:1;z-index:1}.hero-list__item-image-wrapper{width:80px;aspect-ratio:4 / 5;flex-shrink:0;overflow:hidden;background-color:var(--colour-creme)}.hero-list__thumb{width:100%;height:100%;object-fit:cover;display:block}.hero-list__item-info{display:flex;flex-direction:column;justify-content:space-between;padding:4px 0}.hero-list__item-title{margin:0}.hero-list__item-desc{opacity:.8;margin:0}@media(max-width:768px){.hero-list{padding:40px 0}.hero-list__images{display:none}.hero-list__content{grid-column:1 / -1;height:auto;position:static}.hero-list__item{opacity:1;z-index:1}.hero-list__item+.hero-list__item{margin-top:0;border-top:none}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/hero-list.css.map */