/* ==========================================================================
   modules/reviews-meo.css — Googleクチコミ抜粋の表示
   この機能を使わないサイトでは、このファイルを配信フォルダから削除する。
   ========================================================================== */

.reviews-track{
  display: flex;
  gap: var(--space-4);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: var(--space-3);
  margin: 0 calc(var(--space-4) * -1);
  padding-inline: var(--space-4);
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.review-card{
  scroll-snap-align: start;
  flex: 0 0 82%;
  padding: var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.review-head{
  display: flex;
  align-items: center;
  gap: var(--space-3);
}
.review-avatar{
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--color-primary-soft);
  color: var(--color-primary-dark);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700;
  font-size: 14px;
  flex-shrink: 0;
}
.review-author{ font-weight: 600; font-size: 14px; }
.review-date{ font-size: 12px; color: var(--color-ink-soft); }
.review-text{
  font-size: 14px;
  color: var(--color-ink-soft);
  line-height: 1.75;
}
.reviews-source-note{
  margin-top: var(--space-4);
  font-size: 12px;
  color: var(--color-ink-soft);
}

@media (min-width: 600px){
  .review-card{ flex-basis: 46%; }
}
@media (min-width: 1024px){
  .reviews-track{
    overflow: visible;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin: 0;
    padding-inline: 0;
  }
  .review-card{ flex-basis: auto; }
}