.shop-the-look{--look-gap: 2.4rem;--look-cap: none}.shop-the-look__grid{display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--look-gap);row-gap:2.4rem;justify-content:center;align-items:center}.shop-the-look__header{grid-column:1 / -1}.shop-the-look__header:empty{display:none}.shop-the-look .shop-the-look__header .section__header{padding-bottom:0}.shop-the-look__stage{position:relative;width:100%;aspect-ratio:var(--look-ratio-mobile)}.shop-the-look__picture,.shop-the-look__image{display:block;width:100%;height:100%}.shop-the-look__dot{position:absolute;left:clamp(2.2rem,calc(var(--x-mobile, var(--x)) * 1%),calc(100% - 2.2rem));top:clamp(2.2rem,calc(var(--y-mobile, var(--y)) * 1%),calc(100% - 2.2rem));width:4.4rem;height:4.4rem;padding:0;margin:0;border:0;background:none;cursor:pointer;transform:translate(-50%,-50%);-webkit-tap-highlight-color:transparent}.shop-the-look__dot:before{content:"";position:absolute;left:50%;top:50%;box-sizing:border-box;width:12px;height:12px;border:2px solid #222;border-radius:50%;background:#fff;box-shadow:0 1px 5px #00000047;transform:translate(-50%,-50%);transition:width .15s ease,height .15s ease,border-width .15s ease,background-color .15s ease,transform .08s ease}.shop-the-look__dot:hover{z-index:3}.shop-the-look__dot:hover:before{width:14px;height:14px;border-width:3px}.shop-the-look__dot.is-active{z-index:2}.shop-the-look__dot.is-active:before,.shop-the-look__dot:focus-visible:before{width:16px;height:16px;border:3px solid #fff;background:#222}.shop-the-look__dot:active:before{transform:translate(-50%,-50%) scale(.9)}.shop-the-look .shop-the-look__dot:focus,.shop-the-look .shop-the-look__dot:focus-visible{outline:none;box-shadow:none}.shop-the-look__dot:focus-visible{z-index:3}.shop-the-look__dot:focus-visible:before,.shop-the-look__dot.is-editing:before{box-shadow:0 0 0 3px #fff,0 0 0 5px #222}.shop-the-look__panels{display:grid;min-width:0}.shop-the-look__panel{grid-area:1 / 1;min-width:0;opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .12s ease,visibility 0s linear .12s}.shop-the-look__panel.is-active{opacity:1;visibility:visible;transform:none;transition:opacity .18s ease .12s,transform .18s ease .12s,visibility 0s}.shop-the-look__action{margin-top:1.6rem}.shop-the-look__empty{margin:0}@media(max-width:767.98px){.shop-the-look__dot:before{width:14px;height:14px}.shop-the-look__dot.is-active:before{width:20px;height:20px;border-width:4px;box-shadow:0 0 0 1px #00000073,0 1px 6px #0006}.shop-the-look__panel{position:relative;display:grid;grid-template-columns:11rem minmax(0,1fr);grid-template-rows:auto auto;column-gap:1.6rem;align-content:start}.shop-the-look__panel .product-card,.shop-the-look__panel .product-card__wrapper{display:contents}.shop-the-look__panel .product-card__image-wrapper{grid-column:1;grid-row:1 / span 2;align-self:start}.shop-the-look__panel .product-card__info{grid-column:2;grid-row:1;margin-top:0}.shop-the-look .shop-the-look__panel a.shop-the-look__action{position:relative;z-index:3;grid-column:2;grid-row:2;align-self:end;margin-top:.8rem}.shop-the-look__empty{grid-column:1 / -1}}@media(prefers-reduced-motion:reduce){.shop-the-look__dot:before,.shop-the-look__panel,.shop-the-look__panel.is-active{transition:none}}@media(min-width:768px){.shop-the-look{--look-gap: 2.8rem;--look-photo-share: .62;--look-cap: min(72vh, 60rem)}.shop-the-look__grid{--look-photo-width: min(calc((100% - var(--look-gap)) * var(--look-photo-share)), calc(var(--look-cap) * var(--look-ratio)));row-gap:0;grid-template-columns:var(--look-photo-width) max(calc(var(--look-photo-width) * (1 - var(--look-photo-share)) / var(--look-photo-share)),24rem)}.shop-the-look__grid--image-only{grid-template-columns:min(100%,calc(var(--look-cap) * var(--look-ratio)))}.shop-the-look .shop-the-look__header .section__header{padding-bottom:2.4rem}.shop-the-look__stage{aspect-ratio:var(--look-ratio)}.shop-the-look__dot{left:clamp(2.2rem,calc(var(--x) * 1%),calc(100% - 2.2rem));top:clamp(2.2rem,calc(var(--y) * 1%),calc(100% - 2.2rem))}}@media(min-width:1200px){.shop-the-look{--look-gap: 3.2rem;--look-photo-share: .66;--look-cap: min(72vh, 68rem)}.shop-the-look .shop-the-look__header .section__header{padding-bottom:3.2rem}}@media(min-width:1440px){.shop-the-look{--look-gap: 4rem;--look-photo-share: .7;--look-cap: min(72vh, 76rem)}}@media(min-width:1920px){.shop-the-look{--look-gap: 4.8rem;--look-photo-share: .72}}
/*# sourceMappingURL=/cdn/shop/t/26/assets/component-shop-the-look.css.map */
