/* ============================================================
   reviews.css — секция 7 (лаванда). Поток, токены. Карусель из 14 карточек.
   Карточка (ТЗ-10 §5.1): фото → цитата → низ [плашка вкуса | 5 звёзд].
   ============================================================ */

.rev { background: var(--c-lav); padding: 40px var(--side) 44px; display: flex; flex-direction: column; align-items: center; text-align: center; }

.rev__eyebrow {
  font-weight: 700; font-size: var(--fs-eyebrow); line-height: var(--lh-cap);
  letter-spacing: 1.2px; text-transform: uppercase; color: var(--c-eyebrow);
}
.rev__h2 {
  margin-top: 10px;
  font-family: var(--ff-head); font-weight: 800; font-size: var(--fs-h2);
  line-height: var(--lh-head); color: var(--c-ink);
}
.rev__sub {
  margin-top: 12px;
  font-size: var(--fs-sub); line-height: var(--lh-sub); color: var(--c-muted);
}

.rev__track {
  margin-top: 24px; width: 100%;
  display: flex; gap: 14px; align-items: stretch;
  overflow-x: auto; scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain; scrollbar-width: none;
}
.rev__track::-webkit-scrollbar { display: none; }

.rev-card {
  flex: 0 0 100%; scroll-snap-align: start;
  background: var(--c-white); border-radius: var(--r-review); box-shadow: var(--sh-card);
  padding: 12px;
  display: flex; flex-direction: column; text-align: left;
}
.rev-card__ph { width: 100%; aspect-ratio: 1.6 / 1; border-radius: var(--r-strip); overflow: hidden; }
.rev-card__ph img { width: 100%; height: 100%; object-fit: cover; }
.rev-card__q {
  margin: 18px 4px 0; flex: 1;
  font-size: var(--fs-body); line-height: var(--lh-body); color: var(--c-ink);
}
.rev-card__foot {
  margin-top: 18px; padding: 0 4px;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
}
.rev-card__tag {
  padding: 7px 14px; border-radius: var(--r-pill);
  background: var(--c-cta); color: var(--c-cta-ink);
  font-weight: 700; font-size: var(--fs-eyebrow); line-height: 1;
  letter-spacing: .4px; text-transform: uppercase;
}
.rev-card__stars { flex: 0 0 auto; display: flex; gap: 2px; color: var(--c-star); }
.rev-card__stars svg { width: 16px; height: 16px; }

.rev__dots {
  margin-top: 20px;
  display: flex; justify-content: center; align-items: center; gap: 6px;
  flex-wrap: wrap; max-width: 300px;
}
.rev__dot { width: 8px; height: 8px; border-radius: var(--r-pill); background: var(--c-lav-2); flex: 0 0 auto; }
.rev__dot.is-on { width: 22px; background: var(--c-cta); }

.rev__cta { margin-top: 24px; }