.collection-clusters{--cluster-ease: cubic-bezier(.22, .7, .12, 1);--cluster-screen: calc(100svh - 2 * var(--site-frame-inset, 0px) - 2px);color:var(--color-foreground)}html:has(.collection-clusters),.page-wrapper:has(.collection-clusters){scroll-snap-type:y mandatory}.collection-clusters__stage{display:flex;flex-direction:column}.collection-cluster{display:grid;place-items:center;min-height:var(--cluster-screen);padding:48px 12px 48px 70px;box-sizing:border-box;scroll-snap-align:center;scroll-snap-stop:always}.collection-cluster+.collection-cluster{margin-top:calc(var(--cluster-screen) * -.18)}.collection-cluster__link{position:relative;display:flex;flex-direction:column;align-items:center;gap:20px;color:inherit;text-decoration:none;border-radius:var(--site-frame-radius, 12px);opacity:.25;transform:scale(.94);transition:opacity .7s var(--cluster-ease),transform .9s var(--cluster-ease)}.collection-cluster[data-active] .collection-cluster__link,.collection-clusters:not([data-ready]) .collection-cluster__link{opacity:1;transform:none}@media screen and (max-width:749px){.collection-cluster__link{width:100%;min-width:0}}.collection-cluster__link:focus-visible{outline:1px solid currentColor;outline-offset:14px}.collection-cluster__grid{display:grid;grid-template-columns:repeat(var(--cluster-columns, 3),minmax(0,1fr));gap:6px;width:calc(var(--cluster-columns, 3) * var(--cluster-thumb-mobile) + (var(--cluster-columns, 3) - 1) * 6px);max-width:100%}@media screen and (min-width:750px){.collection-cluster__grid{width:calc(var(--cluster-columns, 3) * min(var(--cluster-thumb),(var(--cluster-screen) - 160px) / 3) + (var(--cluster-columns, 3) - 1) * 6px)}}.collection-cluster__item{display:block;aspect-ratio:1;overflow:hidden}.collection-cluster .collection-cluster__image{display:block;width:100%;height:100%;object-fit:contain;border-radius:0;transition:transform 1.2s var(--cluster-ease)}.collection-cluster__placeholder{fill:currentColor;opacity:.15}.collection-cluster__label{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}@media screen and (min-width:750px){.collection-cluster__label{position:absolute;top:50%;left:calc(100% + 48px);align-items:flex-start;text-align:left;white-space:nowrap;transform:translateY(-50%)}}.collection-cluster__title{font-size:12px;font-weight:500;line-height:1.2;letter-spacing:.18em;text-transform:uppercase;transition:color .4s var(--cluster-ease)}.collection-cluster__count{font-size:11px;line-height:1.2;letter-spacing:.08em;opacity:.5}@media(hover:hover){.collection-cluster__link:hover .collection-cluster__title{color:#d0603a}.collection-cluster__link:hover .collection-cluster__image{transform:scale(1.08)}}.cluster-counter{--cc-size: 48px;--cc-gap: 6px;--cc-inset: calc(var(--site-frame-inset, 0px) + 1px + var(--cc-gap));--cc-radius: max(4px, calc(var(--site-frame-radius, 20px) - var(--cc-gap) - 1px));position:fixed;top:50%;left:var(--cc-inset);z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:var(--cc-size);padding:12px 0;box-sizing:border-box;color:#0d0b0a;background:var(--site-frame-color, #ffffff);border:1px solid var(--site-frame-border-color, #d6d6d6);border-radius:var(--cc-radius);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:12px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums;transform:translateY(-50%);transition:opacity .5s var(--cluster-ease)}@media screen and (min-width:750px){.cluster-counter{--cc-size: 52px;--cc-gap: 8px}}.cluster-counter[hidden]{display:flex;opacity:0;pointer-events:none}.cluster-counter__rule{width:12px;height:1px;background:currentColor;opacity:.25}.cluster-counter__total{opacity:.45}.cluster-counter__current{display:block;animation:cluster-tick .5s var(--cluster-ease)}@keyframes cluster-tick{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){html:has(.collection-clusters),.page-wrapper:has(.collection-clusters){scroll-snap-type:none}.collection-cluster__link,.collection-cluster__image,.collection-cluster__title{transition:none}.cluster-counter__current{animation:none}}@media screen and (min-width:750px){.collection-cluster{padding:48px var(--page-margin, 16px)}}@media screen and (max-width:749px){.collection-cluster{padding:70px 12px}.cluster-counter{top:var(--cc-inset);left:calc(var(--cc-inset) + var(--cc-size) + var(--cc-gap));flex-direction:row;gap:8px;width:auto;height:var(--cc-size);padding:0 16px;transform:none}.cluster-counter__rule{width:1px;height:12px}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/collection-clusters.css.map */