/* Google review ticker — the "In their words" band on the home page.
   Markup is written by scripts/fetch-reviews.mjs; do not hand-edit the band.

   The page ships one track. reviews.js clones it (aria-hidden and inert, so a
   screen reader hears each review once) and adds .is-moving; the two tracks
   then each slide left by their own width, so the loop has no seam. Motion
   stops on hover, on keyboard focus and from the Pause button. Without the
   script, or for anyone who has asked their device for reduced motion, the
   band is a still row you swipe or scroll sideways. */

.pc-reviews { overflow: hidden; }

.pc-reviews-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px 48px;
  margin-bottom: clamp(32px, 4vw, 56px);
}
.pc-reviews-head .pc-display-section { margin: 0; }

.pc-reviews-rating {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  padding-bottom: 6px;
}
.pc-reviews-score {
  font-family: var(--pc-display);
  font-size: 1.75rem;
  line-height: 1;
  color: var(--pc-ink);
}
.pc-reviews-stars { display: inline-flex; gap: 3px; color: var(--pc-ink); }
.pc-reviews-stars svg { width: 16px; height: 16px; fill: currentColor; }

.pc-reviews-link,
.pc-reviews-toggle {
  font-family: var(--font-montserrat), Montserrat, sans-serif;
  font-weight: 600;
  font-size: 0.75rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--pc-ink);
  text-decoration: none;
  border-bottom: 1px solid rgba(27, 26, 27, 0.4);
  padding: 0 0 3px;
}
.pc-reviews-link:hover,
.pc-reviews-toggle:hover { border-bottom-color: var(--pc-ink); }
.pc-reviews-toggle {
  background: none;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  cursor: pointer;
  color: var(--pc-muted);
}
.pc-reviews-link:focus-visible,
.pc-reviews-toggle:focus-visible { outline: 2px solid var(--pc-ink); outline-offset: 4px; }

/* The moving row. */
.pc-reviews-viewport {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  padding-inline: var(--pc-gutter, 20px);
}
.pc-reviews.is-moving .pc-reviews-viewport {
  overflow: visible;
  scroll-snap-type: none;
  padding-inline: 0;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 120px, #000 calc(100% - 120px), transparent);
          mask-image: linear-gradient(90deg, transparent, #000 120px, #000 calc(100% - 120px), transparent);
}
.pc-reviews-track {
  display: flex;
  flex-shrink: 0;
  gap: 24px;
  padding: 0 24px 0 0;
  margin: 0;
  list-style: none;
}
.pc-reviews.is-moving .pc-reviews-track {
  animation: pc-reviews-scroll var(--reviews-duration, 600s) linear infinite;
}
@keyframes pc-reviews-scroll {
  to { transform: translateX(-100%); }
}
.pc-reviews-viewport:hover .pc-reviews-track,
.pc-reviews-viewport:focus-within .pc-reviews-track,
.pc-reviews[data-paused] .pc-reviews-track { animation-play-state: paused; }

.pc-review {
  width: 400px;
  flex-shrink: 0;
  display: flex;
  scroll-snap-align: start;
}
.pc-review figure {
  margin: 0;
  width: 100%;
  min-height: 300px;
  box-sizing: border-box;
  background: #faf7f2;
  border: 1px solid rgba(27, 26, 27, 0.14);
  padding: 32px 32px 28px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.pc-review-stars { display: flex; gap: 3px; color: var(--pc-metal, #8a8580); }
.pc-review-stars svg { width: 14px; height: 14px; fill: currentColor; }
.pc-review blockquote {
  margin: 0;
  font-family: var(--pc-display);
  font-size: 1.3125rem;
  line-height: 1.48;
  color: var(--pc-ink);
}
.pc-review figcaption {
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 6px 12px;
  border-top: 1px solid rgba(27, 26, 27, 0.14);
  padding-top: 18px;
}
.pc-review-name {
  font-family: var(--font-montserrat), Montserrat, sans-serif;
  font-weight: 600;
  font-size: 0.75rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--pc-ink);
}
.pc-review-meta {
  font-family: var(--font-montserrat), Montserrat, sans-serif;
  font-weight: 500;
  font-size: 0.75rem;
  color: var(--pc-muted);
}

@media (max-width: 719px) {
  .pc-reviews.is-moving .pc-reviews-viewport {
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 20px, #000 calc(100% - 20px), transparent);
            mask-image: linear-gradient(90deg, transparent, #000 20px, #000 calc(100% - 20px), transparent);
  }
  .pc-reviews-track { gap: 16px; padding-right: 16px; }
  .pc-reviews.is-moving .pc-reviews-track { animation-duration: var(--reviews-duration-sm, 450s); }
  .pc-review { width: 300px; }
  .pc-review figure { min-height: 280px; padding: 26px 24px 22px; }
  .pc-review blockquote { font-size: 1.125rem; }
  .pc-review figcaption { flex-direction: column; align-items: flex-start; }
}

/* Belt and braces: reviews.js never starts the motion under reduced motion,
   and if the preference changes mid-visit nothing moves either. */
@media (prefers-reduced-motion: reduce) {
  .pc-reviews.is-moving .pc-reviews-track { animation: none; }
  .pc-reviews.is-moving .pc-reviews-track[aria-hidden="true"],
  .pc-reviews.is-moving .pc-reviews-toggle { display: none; }
  .pc-reviews.is-moving .pc-reviews-viewport {
    overflow-x: auto;
    scroll-snap-type: x proximity;
    padding-inline: var(--pc-gutter, 20px);
    -webkit-mask-image: none;
            mask-image: none;
  }
}
