.hop-look{padding-block:4.8rem 3.2rem}.hop-look__inner.page-width{max-width:none;padding-inline:3.2rem}@media screen and (max-width:749px){.hop-look__inner.page-width{padding-inline:1.6rem}}.hop-look__head{text-align:center;margin-block-end:2.4rem}.hop-look__title{margin:0;font-family:HOP Wordmark,Georgia,serif;font-weight:400;font-size:clamp(2.4rem,2vw,3.2rem);letter-spacing:0;text-transform:none}.hop-look__head .hop-meta{margin:.6rem 0 0}.hop-look__rail{position:relative}.hop-look__grid{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3.2rem) / 3);gap:1.6rem;margin:0;padding:0;list-style:none;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.hop-look__grid::-webkit-scrollbar{display:none}.hop-look__tile{position:relative;aspect-ratio:1 / 1;scroll-snap-align:start}.hop-look__clip{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;background:rgba(var(--color-foreground),.04)}.hop-look__frame{position:absolute;left:0;top:50%;width:100%;aspect-ratio:var(--hop-look-ratio);transform:translateY(-50%)}.hop-look__tile--wide .hop-look__frame{top:0;left:50%;width:auto;height:100%;transform:translate(-50%)}.hop-look__img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.hop-look__tile:hover .hop-look__img{transform:scale(1.02)}.hop-look__frame--spots{pointer-events:none;z-index:1}.hop-look__spot{position:absolute;pointer-events:auto;transform:translate(-50%,-50%);text-decoration:none;color:rgb(var(--color-foreground))}.hop-look__dot{display:block;width:2.6rem;height:2.6rem;border-radius:50%;background:#ffffffeb;box-shadow:0 .2rem .8rem #00000040;position:relative}.hop-look__dot:after{content:"";position:absolute;top:.85rem;right:.85rem;bottom:.85rem;left:.85rem;border-radius:50%;background:#1a1a1a}.hop-look__dot:before{content:"";position:absolute;top:-.4rem;right:-.4rem;bottom:-.4rem;left:-.4rem;border-radius:50%;border:.2rem solid rgba(255,255,255,.8);animation:hop-look-pulse 2.4s ease-out infinite}.hop-look__spot.is-current .hop-look__dot:after{background:#e85d26}@keyframes hop-look-pulse{0%{transform:scale(.8);opacity:1}to{transform:scale(1.6);opacity:0}}@media(prefers-reduced-motion:reduce){.hop-look__dot:before{animation:none;opacity:0}.hop-look__img{transition:none}}.hop-look__card{position:absolute;bottom:calc(100% + .8rem);left:50%;transform:translate(-50%,.4rem);display:flex;align-items:center;gap:1rem;padding:.8rem 1.2rem;background:rgb(var(--color-background));border:var(--hop-rule-width-fine, .1rem) solid rgba(var(--color-foreground),.85);white-space:nowrap;font-family:var(--font-body-family);font-size:1.3rem;line-height:1.3;opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease,visibility .18s}.hop-look__spot--below .hop-look__card{bottom:auto;top:calc(100% + .8rem);transform:translate(-50%,-.4rem)}.hop-look__spot--start .hop-look__card{left:-.6rem;transform:translateY(.4rem)}.hop-look__spot--end .hop-look__card{left:auto;right:-.6rem;transform:translateY(.4rem)}.hop-look__spot--below.hop-look__spot--start .hop-look__card,.hop-look__spot--below.hop-look__spot--end .hop-look__card{transform:translateY(-.4rem)}.hop-look__spot:hover .hop-look__card,.hop-look__spot:focus-visible .hop-look__card{opacity:1;visibility:visible;transform:translate(-50%)}.hop-look__spot--start:hover .hop-look__card,.hop-look__spot--end:hover .hop-look__card,.hop-look__spot--start:focus-visible .hop-look__card,.hop-look__spot--end:focus-visible .hop-look__card{transform:translate(0)}.hop-look__spot:hover,.hop-look__spot:focus-visible{z-index:2}.hop-look__name{font-weight:var(--font-body-weight-bold)}.hop-look__price{color:rgba(var(--color-foreground),.7)}.hop-look__go{color:#e85d26}.hop-look__caption{position:absolute;top:calc(100% + .6rem);margin:0}.hop-look__arrow{position:absolute;top:50%;z-index:3;transform:translateY(-50%);width:4.4rem;height:4.4rem;display:flex;align-items:center;justify-content:center;border:var(--hop-rule-width-fine, .1rem) solid rgb(var(--color-foreground));background:rgb(var(--color-background));color:rgb(var(--color-foreground));font-size:2.6rem;line-height:1;cursor:pointer}.hop-look__arrow[hidden]{display:none}.hop-look__arrow:hover{background:rgb(var(--color-foreground));color:rgb(var(--color-background))}.hop-look__arrow--prev{left:1.2rem}.hop-look__arrow--next{right:1.2rem}@media screen and (max-width:989px){.hop-look__grid{grid-auto-columns:82%}.hop-look__arrow{display:none}}@media screen and (max-width:749px){.hop-look{padding-block:3.2rem 2.4rem}.hop-look__dot{width:2.2rem;height:2.2rem}.hop-look__dot:after{top:.7rem;right:.7rem;bottom:.7rem;left:.7rem}}
/*# sourceMappingURL=/cdn/shop/t/32/assets/hop-shop-the-look.css.map */