/* Catalogue spacing follows the preceding process module; cards keep their natural height. */
.home-page #products { background: #fafafa; padding: clamp(64px, 7.5vw, 120px) clamp(24px, 4.25vw, 76px); }
.products__heading { display: block; }
.products__heading > div { width: 100%; min-width: 0; }
.home-page #products #productsTitle { margin: 0; max-width: none; }
.home-page #products .products__intro { max-width: 54em; margin-top: clamp(30px, 3.5vw, 52px); text-wrap: balance; }
.product-rail {
  --card-gap: 24px;
  align-items: stretch;
  gap: var(--card-gap);
  margin: 56px -8px 0;
  padding: 8px 8px 14px;
  scroll-padding-inline: 8px;
  touch-action: pan-x pan-y pinch-zoom;
  -webkit-overflow-scrolling: touch;
}
.product-rail .product-card { display: flex; flex: 0 0 calc((100% - 2 * var(--card-gap)) / 3); min-width: 0; margin: 0; }
.product-gallery {
  --image-space: clamp(308px, calc(55svh - 52px), 428px);
  --thumb-size: clamp(44px, 6svh, 56px);
  --thumb-inset: 12px;
  position: relative;
  width: 100%;
  display: grid;
  flex: 1;
  grid-template-rows: var(--image-space) auto;
  overflow: hidden;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,.035), 0 5px 22px rgba(0,0,0,.065);
  isolation: isolate;
}
.product-gallery__views {
  position: relative;
  height: 100%;
  overflow: hidden;
  touch-action: auto;
  cursor: grab;
}
.product-gallery__views::-webkit-scrollbar { display: none; }
.product-rail.is-dragging .product-gallery,
.product-rail.is-dragging .product-gallery__views,
.product-rail.is-dragging .product-gallery__thumbs button { cursor: grabbing; }
.product-gallery__view {
  position: absolute; inset: 0; min-width: 0; width: 100%; height: 100%;
  padding: 14px 16px 10px calc(var(--thumb-size) + 2 * var(--thumb-inset));
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .28s ease, visibility 0s linear .28s;
}
.product-gallery__view.is-active,
.product-gallery__views:not(.is-ready) > .product-gallery__view:first-child {
  opacity: 1; visibility: visible; pointer-events: auto;
  transition-delay: 0s;
}
.product-gallery__views.is-reduced-motion .product-gallery__view { transition: none; }
.product-gallery__view img {
  display: block; width: 100%; height: 100%; object-fit: contain; object-position: center;
  pointer-events: none; user-select: none; -webkit-user-drag: none;
}
.product-card:hover .product-gallery img { transform: none; }
.product-gallery img.product-image--rotated,
.product-card:hover .product-gallery img.product-image--rotated { transform: rotate(180deg); }
.product-card__caption {
  position: relative; z-index: 2; min-width: 0;
  padding: 14px 20px; background: rgba(250,250,250,.7); color: #111; pointer-events: none;
}
.product-card__caption h3 {
  margin: 0; font-size: clamp(18px, 1.5vw, 23px); font-weight: 600; line-height: 1.35;
  white-space: normal; overflow-wrap: anywhere; letter-spacing: -.025em;
}
.product-gallery__thumbs {
  position: absolute; top: 14px; height: calc(var(--image-space) - 24px); left: var(--thumb-inset);
  z-index: 3; display: flex; flex-direction: column; justify-content: center; gap: 7px; width: var(--thumb-size);
}
.product-gallery__thumbs button {
  flex: 0 0 var(--thumb-size); width: var(--thumb-size); height: var(--thumb-size); padding: 3px;
  border: 1px solid #e2e2e2; border-radius: 0; background: #fff; cursor: pointer;
  transition: box-shadow .18s ease;
}
.product-gallery__thumbs img {
  display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none;
  user-select: none; -webkit-user-drag: none;
}
@media (hover: hover) {
  .product-gallery__thumbs button:hover { box-shadow: 0 1px 4px rgba(0,0,0,.10); }
}
.product-gallery__thumbs button[aria-pressed="true"] { box-shadow: 0 2px 6px rgba(0,0,0,.32); }
.product-gallery__views:focus-visible { outline: 2px solid var(--orange); outline-offset: -3px; }
.product-gallery button:focus-visible { outline: none; box-shadow: 0 2px 6px rgba(0,0,0,.38); }
.products__browse {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-top: 22px; padding-right: 72px; min-width: 0;
}
.products__browse .rail-controls { position: static; flex: 0 0 auto; gap: 8px; }
.products__browse .rail-controls button {
  width: 44px; height: 44px; background: #e9e9ec; color: #505055; cursor: pointer;
}
.products__browse .rail-controls button svg { width: 22px; height: 22px; stroke-width: 2.6; }
.products__browse .rail-controls button:hover:not(:disabled) { background: #dddde1; color: #333338; transform: none; }
.products__browse .rail-controls button:disabled { background: #ededf0; color: #b5b5ba; cursor: default; }
.products__browse button:focus-visible { outline: 1px solid #999; outline-offset: 3px; }
.product-rail__progress { display: flex; align-items: center; gap: 6px; min-width: 0; }
.product-rail__progress[hidden] { display: none; }
.product-rail__progress button {
  display: grid; place-items: center; flex: 0 0 auto; width: 24px; height: 44px;
  padding: 0; border: 0; border-radius: 0; background: transparent; cursor: pointer;
  transition: width .18s ease;
}
.product-rail__progress button::before { content: ''; width: 6px; height: 6px; border-radius: 99px; background: #bdbdbd; transition: width .18s ease, background .18s ease; }
.product-rail__progress button[aria-current="true"] { width: 40px; }
.product-rail__progress button[aria-current="true"]::before { width: 30px; background: #111; }
@media (max-width: 1100px) and (min-width: 701px) {
  .product-rail .product-card { flex-basis: calc((100% - var(--card-gap)) / 2); }
}
@media (max-width: 700px) {
  .home-page #products { padding: 64px 23px; }
  .home-page #products .products__intro { margin-top: 32px; }
  .product-rail { --card-gap: 16px; margin-top: 24px; }
  .product-rail .product-card { flex-basis: min(86vw, 515px); }
  .product-gallery { --thumb-size: 48px; --thumb-inset: 10px; --image-space: clamp(308px, calc(48svh - 52px), 368px); }
  .product-gallery__view { padding: 14px 14px 10px calc(var(--thumb-size) + 2 * var(--thumb-inset)); }
  .product-card__caption h3 { font-size: 18px; }
  .products__browse { margin-top: 16px; padding-right: 64px; }
  .product-rail__progress { gap: 4px; }
}
@media (max-width: 374px) {
  .products__browse { flex-wrap: wrap; row-gap: 0; }
  .product-rail__progress { flex-basis: 100%; }
  .products__browse .rail-controls { margin-left: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .product-gallery__view, .product-gallery button, .product-rail__progress button, .product-rail__progress button::before { transition: none; }
}
