/* reviews — отзывы. Общее: .rev-ava (круглое фото автора). */
.rev-ava { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; margin-bottom: 12px; }
.rev-cards { margin-top: 24px; }
.rev-cards b { color: var(--s-text); }

/* quote — по одному крупному отзыву, листаются вбок (scroll-snap); следующий слайд выглядывает */
.rev-track {
  display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
  padding: 24px 5% 18px; scroll-padding-left: 5%; scrollbar-width: thin;
}
@media (min-width: 1300px) { .rev-track { padding-left: calc((100% - 1200px) / 2 + 60px); scroll-padding-left: calc((100% - 1200px) / 2 + 60px); } }
.rev-slide {
  flex: 0 0 84%; max-width: 720px; scroll-snap-align: start; margin: 0;
  background: var(--s-surface); border: 1px solid var(--s-line); border-radius: var(--radius);
  padding: 36px 36px 30px; display: flex; flex-direction: column; justify-content: space-between; gap: 24px;
}
.rev-slide blockquote { font-family: var(--font-head); font-size: clamp(18px, 2.4vw, 26px); line-height: 1.4; overflow-wrap: anywhere; }
.rev-slide blockquote::before { content: "“"; display: block; font-size: 64px; line-height: .6; color: var(--s-accent); opacity: .5; margin-bottom: 8px; }
.rev-slide figcaption, .rev-note figcaption { display: flex; align-items: center; gap: 12px; color: var(--s-text); }
.rev-slide .rev-ava, .rev-note .rev-ava { margin: 0; flex: none; }
@media (max-width: 560px) { .rev-slide { flex-basis: 88%; padding: 26px 22px 22px; } }

/* wall — стена: CSS columns, карточки разной высоты */
.rev-wall { column-count: 3; column-gap: 20px; margin-top: 24px; }
.rev-note {
  break-inside: avoid; margin: 0 0 20px; background: var(--s-surface); border: 1px solid var(--s-line);
  border-radius: var(--radius); padding: 24px; display: flex; flex-direction: column; gap: 16px;
}
.rev-note blockquote { font-size: 15px; color: var(--s-muted); overflow-wrap: anywhere; }
.rev-note:nth-child(3n+2) blockquote { font-size: 16px; color: var(--s-text); }
@media (max-width: 900px) { .rev-wall { column-count: 2; } }
@media (max-width: 560px) { .rev-wall { column-count: 1; } }
