/* ── Wijnen overview page ─────────────────────────────────────────────────── */

.page-wines {
  padding: var(--section-gap) var(--padding-page);
}

.page-wines-header {
  margin-bottom: 64px;
}

.page-wines-title {
  font-family: var(--font-serif);
  font-size: var(--text-page-title);
  font-weight: 400;
  color: var(--ink);
  margin-top: 12px;
}

/* ── Wine type row ───────────────────────────────────────────────────────── */

.wine-type-row {
  margin-bottom: var(--section-gap);
}

.wine-type-row:last-child {
  margin-bottom: 0;
}

.wine-type-row__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  border-bottom: var(--border-fine);
  padding-bottom: 16px;
  margin-bottom: 40px;
}

.wine-type-row__title {
  font-family: var(--font-serif);
  font-size: 44px;
  font-weight: 400;
  color: var(--ink);
}

/* Desktop: flex-wrap grid — 4 cards per row derived from --card-cols */
.wine-type-row__track {
  display: flex;
  flex-wrap: wrap;
  gap: var(--card-gap);
}

.wine-type-row__track .product-card {
  flex: 0 0 calc((100% - (var(--card-cols) - 1) * var(--card-gap)) / var(--card-cols));
  min-width: 0;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
  .page-wines {
    padding: var(--section-gap-mobile) var(--padding-mobile);
  }

  .wine-type-row__header {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .wine-type-row__title {
    font-size: 32px;
  }

  /* Mobile: single-row horizontal scroll with snap */
  .wine-type-row__track {
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-left: var(--slider-peek); /* eerste kaart snapt achter de gutter, niet tegen de rand */
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin: 0 calc(-1 * var(--slider-peek));
    padding: 0 var(--slider-peek);
  }

  .wine-type-row__track::-webkit-scrollbar {
    display: none;
  }

  .wine-type-row__track .product-card {
    flex: 0 0 var(--card-width-mobile);
    scroll-snap-align: start;
  }

  .wine-type-row__track .product-card:last-child {
    margin-right: var(--slider-peek);
  }
}