.collections-main { overflow: hidden; }

.collections-intro {
  max-width: 760px;
  padding-block: clamp(58px, 8vw, 104px) clamp(60px, 7vw, 88px);
  text-align: center;
}

.collections-intro h1 {
  max-width: none;
  margin-bottom: 18px;
  font-size: clamp(46px, 5.2vw, 72px);
}

.collections-intro > p:last-child {
  max-width: 620px;
  margin: 0 auto;
  color: #4c504f;
  font-size: 17px;
  line-height: 1.65;
}

.collection-sections { border-top: 1px solid var(--line); }
.collection-section { padding-block: clamp(66px, 8vw, 104px); }
.collection-section:nth-child(even) { background: #f3f0eb; }

.collection-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 38px;
}

.collection-heading h2 { font-size: clamp(33px, 3.2vw, 46px); scroll-margin-top: 96px; }

.product-gallery { position: relative; }
.gallery-stage { position: relative; }

.gallery-viewport {
  width: 100%;
  overflow: hidden;
  padding-block: 20px 24px;
  touch-action: pan-y;
  outline: none;
}

.gallery-viewport:focus-visible { outline: 3px solid var(--teal); outline-offset: -3px; }

.gallery-track {
  width: max-content;
  display: flex;
  align-items: center;
  gap: clamp(18px, 2.2vw, 32px);
  will-change: transform;
  transition: transform 520ms cubic-bezier(.16, 1, .3, 1);
}

.product-item {
  width: clamp(170px, 20vw, 246px);
  flex: 0 0 auto;
  opacity: .58;
  transform: scale(.92);
  transition: opacity 420ms ease, transform 520ms cubic-bezier(.16, 1, .3, 1), filter 420ms ease;
  filter: blur(.35px);
}

.product-item[data-selected="true"] { opacity: 1; transform: scale(1.06); filter: none; }

.product-button {
  width: 100%;
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.product-button:focus-visible { outline: 3px solid var(--teal); outline-offset: 5px; border-radius: 8px; }

.product-image-frame {
  aspect-ratio: 4 / 5;
  display: grid;
  place-items: center;
  overflow: hidden;
  position: relative;
  border-radius: 8px;
  background: #eee9e2;
  box-shadow: 0 9px 24px rgba(73, 61, 49, .09);
  transition: box-shadow 280ms ease, transform 280ms ease;
}

.product-button:hover .product-image-frame { transform: translateY(-3px); box-shadow: 0 15px 32px rgba(73, 61, 49, .14); }
.product-image-frame img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-control {
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  position: absolute;
  top: 50%;
  z-index: 2;
  border: 1px solid rgba(167, 69, 57, .48);
  border-radius: 50%;
  background: rgba(250, 248, 244, .94);
  color: var(--terracotta-dark);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  transform: translateY(-50%);
  transition: background-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.gallery-control:hover:not(:disabled) { background: var(--terracotta-dark); color: #fff; transform: translateY(-50%) scale(1.04); }
.gallery-control:focus-visible { outline: 3px solid var(--teal); outline-offset: 3px; }
.gallery-control:disabled { opacity: .3; cursor: default; }
.gallery-control-prev { left: max(16px, calc((100vw - var(--shell-max)) / 2)); }
.gallery-control-next { right: max(16px, calc((100vw - var(--shell-max)) / 2)); }

.selected-product-info {
  min-height: 128px;
  max-width: 520px;
  margin: 17px auto 0;
  text-align: center;
}

.selected-product-info h3 {
  margin: 0 0 7px;
  color: var(--ink);
  font-family: var(--serif);
  font-size: 23px;
  font-weight: 600;
  letter-spacing: -.02em;
}

.selected-product-info p { margin: 0 auto; color: #505453; font-size: 13px; line-height: 1.6; }

@media (max-width: 980px) {
  .product-item { width: clamp(180px, 30vw, 230px); }
  .gallery-control-prev { left: 20px; }
  .gallery-control-next { right: 20px; }
}

@media (max-width: 620px) {
  .collections-intro { padding-block: 54px 58px; text-align: left; }
  .collections-intro h1 { margin-bottom: 15px; font-size: clamp(41px, 12vw, 54px); }
  .collections-intro > p:last-child { font-size: 16px; }
  .collection-section { padding-block: 62px 68px; }
  .collection-heading { align-items: flex-start; flex-direction: column; gap: 8px; margin-bottom: 25px; }
  .collection-heading h2 { font-size: 34px; }
  .gallery-viewport { padding-block: 16px 21px; }
  .gallery-track { gap: 14px; }
  .product-item { width: min(62vw, 244px); opacity: .5; transform: scale(.9); }
  .product-item[data-selected="true"] { transform: scale(1); }
  .gallery-control { width: 48px; height: 48px; top: calc(50% - 4px); }
  .gallery-control-prev { left: 10px; }
  .gallery-control-next { right: 10px; }
  .selected-product-info { min-height: 142px; max-width: calc(100% - 32px); margin-top: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .gallery-track,
  .product-item { transition-duration: .01ms !important; }
}
