/* Existing collection cards, presented as a quietly moving ribbon. */
.collection-carousel { position: relative; }
.collection-carousel [hidden] { display: none; }
.collection-carousel.is-carousel { --collection-count: 4; --collection-gap: 26px; }
.collection-carousel.is-carousel .collection-viewport { overflow: hidden; padding: 10px 2px 26px; margin: -10px -2px -26px; touch-action: pan-y; }
.collections .collection-carousel.is-carousel .collection-grid { display: flex; gap: var(--collection-gap); align-items: stretch; grid-template-columns: none; }
.collections .collection-carousel.is-carousel .collection-card { flex: 0 0 calc((100% - (var(--collection-count) - 1) * var(--collection-gap)) / var(--collection-count)); min-width: 0; }
.collections .collection-carousel.is-carousel .collection-number::before { content: attr(data-number); }
.collection-nav { position: absolute; z-index: 4; top: 42%; width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 1px solid #bba06c; border-radius: 50%; background: #fcf8eeed; color: #506146; box-shadow: inset 0 1px 0 #fff,0 4px 12px #5943211c; cursor: pointer; transition: background .2s,color .2s,box-shadow .2s; }
.collection-prev { left: -22px; }
.collection-next { right: -22px; }
.collection-prev svg { transform: rotate(180deg); }
.collection-nav svg { width: 21px; height: 21px; }
.collection-nav:hover { background: #2b4732; color: #efdbac; box-shadow: 0 5px 14px #26392130; }
.collection-nav:focus-visible { outline: 2px solid #947136; outline-offset: 4px; }
@media(max-width:1100px) { .collection-carousel.is-carousel { --collection-count: 2; } }
@media(max-width:600px) {
 .collection-carousel.is-carousel { --collection-gap: 12px; }
 .collection-prev { left: -13px; }
 .collection-next { right: -13px; }
 .collection-nav { width: 38px; height: 44px; top: 35%; }
 .collection-nav svg { width: 18px; height: 18px; }
}
@media(prefers-reduced-motion:reduce) { .collection-carousel * { transition: none !important; } }