.sz-subnav{--sz-subnav-size: var(--sz-subnav-size-mobile, 76px);--sz-subnav-label: var(--sz-subnav-label-mobile, 12px);--sz-subnav-gap: 14px;--sz-subnav-edge: var(--sz-subnav-edge-mobile, 16px);position:relative}.sz-subnav__title{margin:0 0 12px;padding-inline:var(--sz-subnav-edge);font-size:calc(var(--sz-subnav-label) + 1px);font-weight:600;letter-spacing:.06em;text-transform:uppercase;opacity:.7}.sz-subnav__viewport{position:relative}.sz-subnav__scroller{display:flex;gap:var(--sz-subnav-gap);margin:0;padding-inline:var(--sz-subnav-edge);padding-block:6px 4px;list-style:none;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:var(--sz-subnav-edge);-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.sz-subnav__scroller::-webkit-scrollbar{display:none}.sz-subnav__item{flex:0 0 auto;scroll-snap-align:start}.sz-subnav__link{display:flex;flex-direction:column;align-items:center;gap:8px;width:var(--sz-subnav-size);color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.sz-subnav__media{position:relative;width:var(--sz-subnav-size);height:var(--sz-subnav-size);border-radius:50%;overflow:hidden;background-color:var(--sz-subnav-placeholder, rgb(0 0 0 / 6%));outline:2px solid transparent;outline-offset:3px;transition:outline-color .2s ease,transform .2s ease}.sz-subnav__img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.sz-subnav--contain .sz-subnav__media{background-color:var(--sz-subnav-placeholder, #ffffff)}.sz-subnav--contain .sz-subnav__img{box-sizing:border-box;padding:18%;object-fit:contain}.sz-subnav__initial,.sz-subnav__icon{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}.sz-subnav__initial{font-size:calc(var(--sz-subnav-size) * .34);font-weight:700;line-height:1;opacity:.5}.sz-subnav__icon svg{width:40%;height:40%;opacity:.65}.sz-subnav__label{font-size:var(--sz-subnav-label);line-height:1.25;text-align:center;text-wrap:balance;overflow-wrap:anywhere}.sz-subnav__count{display:block;margin-top:2px;font-size:calc(var(--sz-subnav-label) - 2px);font-weight:400;opacity:.6}@media(hover:hover){.sz-subnav__link:hover .sz-subnav__media{outline-color:var(--sz-subnav-accent, #00a4e1);transform:translateY(-2px)}}.sz-subnav__link[aria-current=page] .sz-subnav__media{outline-color:var(--sz-subnav-accent, #00a4e1)}.sz-subnav__link[aria-current=page] .sz-subnav__label{font-weight:700}.sz-subnav__link:focus-visible{outline:none}.sz-subnav__link:focus-visible .sz-subnav__media{outline:3px solid var(--sz-subnav-accent, #00a4e1);outline-offset:4px}.sz-subnav__viewport:before,.sz-subnav__viewport:after{content:"";position:absolute;top:0;bottom:0;z-index:1;width:44px;opacity:0;pointer-events:none;transition:opacity .2s ease}.sz-subnav__viewport:before{left:0;background:linear-gradient(to right,var(--color-background, #ffffff),transparent)}.sz-subnav__viewport:after{right:0;background:linear-gradient(to left,var(--color-background, #ffffff),transparent)}.sz-subnav[data-overflow-start=true] .sz-subnav__viewport:before,.sz-subnav[data-overflow-end=true] .sz-subnav__viewport:after{opacity:1}.sz-subnav__arrow{position:absolute;top:calc(6px + var(--sz-subnav-size) / 2);z-index:2;display:none;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border:1px solid rgb(0 0 0 / 10%);border-radius:50%;background-color:var(--color-background, #ffffff);color:inherit;cursor:pointer;transform:translateY(-50%);transition:opacity .2s ease}.sz-subnav__arrow--prev{left:4px}.sz-subnav__arrow--next{right:4px}.sz-subnav__arrow svg{width:16px;height:16px}.sz-subnav__arrow[disabled]{opacity:.3;cursor:default}.sz-subnav__arrow:focus-visible{outline:3px solid var(--sz-subnav-accent, #00a4e1);outline-offset:2px}@media(hover:hover)and (pointer:fine){.sz-subnav__arrow:not([hidden]){display:flex}}@media screen and (min-width:750px){.sz-subnav{--sz-subnav-size: var(--sz-subnav-size-tablet, 92px);--sz-subnav-label: var(--sz-subnav-label-tablet, 13px);--sz-subnav-gap: 18px;--sz-subnav-edge: var(--sz-subnav-edge-tablet, 24px)}}@media screen and (min-width:990px){.sz-subnav{--sz-subnav-size: var(--sz-subnav-size-desktop, 104px);--sz-subnav-label: var(--sz-subnav-label-desktop, 13px);--sz-subnav-gap: 22px;--sz-subnav-edge: var(--sz-subnav-edge-desktop, 40px)}}@media(prefers-reduced-motion:reduce){.sz-subnav__media,.sz-subnav__arrow,.sz-subnav__viewport:before,.sz-subnav__viewport:after{transition:none}.sz-subnav__link:hover .sz-subnav__media{transform:none}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/collection-subnav.css.map */
