/* Native horizontal scrolling; card styling stays in the homepage stylesheet. */
.wv-projects__grid.wv-projects__track {
  --project-gap: clamp(1.25rem, 3vw, 2rem);
  grid-template-columns: none;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - var(--project-gap) - var(--project-gap)) / 3);
  gap: var(--project-gap);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 8px;
  scrollbar-width: thin;
  scrollbar-color: var(--wv-line) transparent;
  margin: -8px;
  padding: 8px 8px 16px;
}
.wv-projects__track > .wv-project-card {
  grid-column: auto;
  max-width: none;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
}
.wv-projects__track .wv-project-card__image { flex-shrink: 0; }
.wv-projects__track .wv-project-card__body { display: flex; flex-direction: column; flex: 1; }
.wv-projects__track .wv-project-card__body > .wv-action-link { margin-top: auto; align-self: flex-start; }
.wv-projects__controls { display: flex; justify-content: flex-end; gap: .65rem; margin-top: 1.25rem; }
.wv-projects__controls[hidden] { display: none; }
.wv-projects__arrow {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--wv-line);
  border-radius: 50%;
  background: transparent;
  color: var(--wv-ink);
  cursor: pointer;
  transition: background-color var(--wv-motion-control), border-color var(--wv-motion-control), opacity var(--wv-motion-control);
}
.wv-projects__arrow svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.wv-projects__arrow:hover:not([aria-disabled="true"]) { background: var(--wv-green); border-color: var(--wv-ink); }
.wv-projects__arrow[aria-disabled="true"] { opacity: .35; cursor: default; }

@media (max-width: 900px) {
  .wv-projects__grid.wv-projects__track { grid-auto-columns: calc((100% - var(--project-gap)) / 2); }
}
@media (max-width: 620px) {
  .wv-projects__grid.wv-projects__track { grid-auto-columns: calc(100% - 1.25rem); }
  .wv-projects__controls { justify-content: space-between; }
}
@media (prefers-reduced-motion: reduce) {
  .wv-projects__arrow { transition: none; }
}
