.reviews .head { margin-bottom: clamp(28px, 4vw, 48px); }
.review {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; width: min(440px, 84vw);
  padding: clamp(24px, 2.6vw, 38px); border-radius: var(--r-card); background: var(--paper);
  box-shadow: inset 0 0 0 1px var(--line);
}
.review:nth-child(3n + 2) { background: var(--lilac); box-shadow: none; }
.review:nth-child(3n) { background: var(--blush); box-shadow: none; }
.review::before { content: "”"; height: 46px; color: var(--rose); font: italic 500 5.4rem / 1 var(--font-d); }
.review blockquote { margin: 0; }
.review blockquote p { margin-bottom: 14px; color: var(--ink); line-height: 1.6; }
.js .review blockquote p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 7; line-clamp: 7; overflow: hidden; }

@media (max-width: 767px) {
  .reviews .head--row { flex-direction: row; align-items: flex-end; }
}

.reviews-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.reviews-grid .review { width: auto; }
.reviews--grid .head { margin-bottom: clamp(28px, 4vw, 48px); }

@media (max-width: 1023px) {
  .reviews-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .reviews-grid { grid-template-columns: minmax(0, 1fr); }
}
.reviews__note { max-width: 720px; margin: 20px auto 0; color: var(--muted); font-size: .85rem; line-height: 1.5; text-align: center; }