/* Google Reviews carousel: moves continuously from left to right. */
.reviews {
  overflow: hidden;
}

.reviews-intro {
  grid-column: 1;
  grid-row: 1;
}

.review-list {
  display: flex;
  grid-column: 1 / -1;
  grid-row: 2;
  min-width: 0;
  gap: 16px;
  width: max-content;
  max-width: none;
  margin: 0;
  padding: 10px 0;
  background: transparent;
  border: 0;
  animation: review-scroll-right 52s linear infinite;
  will-change: transform;
}

.reviews .text-link {
  grid-column: 1 / -1;
  grid-row: 3;
}

.review-list.is-paused,
.review-list:hover,
.review-list:focus-within {
  animation-play-state: paused;
}

.review {
  display: block;
  flex: 0 0 min(360px, 72vw);
  min-height: 226px;
  padding: 28px 30px;
  border: 1px solid var(--line);
  cursor: pointer;
  outline: none;
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.review:focus-visible,
.review.is-selected {
  border-color: var(--gold);
  box-shadow: 0 0 0 1px var(--gold), 0 20px 40px rgba(0, 0, 0, .4);
  transform: translateY(-8px);
}

@keyframes review-scroll-right {
  from { transform: translateX(calc(-50% - 8px)); }
  to { transform: translateX(0); }
}

@media (prefers-reduced-motion: reduce) {
  .review-list { animation: none; transform: none; }
}

@media (max-width: 850px) {
  .reviews-intro,
  .review-list,
  .reviews .text-link {
    grid-column: auto;
    grid-row: auto;
  }
}