/* Бегущая строка отзывов · Sasha B.B.B
 *
 * Четыре условия, без которых такая строка портит страницу:
 *  1. движение медленное и непрерывное — стык не должен быть виден;
 *  2. под курсором и при переходе клавиатурой строка останавливается,
 *     иначе прочитать её невозможно;
 *  3. при системной настройке «меньше движения» она не двигается вовсе
 *     и превращается в обычный список;
 *  4. никаких звёздочек и иконок — только слова, имя и дата.
 */

.proof{
  --speed: 90s;              /* один полный проход; медленнее = дороже на вид */
  position:relative;
  padding:clamp(2rem,5vw,3.5rem) 0;
  overflow:hidden;
}
.proof__head{
  display:flex;align-items:baseline;gap:.75rem;flex-wrap:wrap;
  max-width:1080px;margin:0 auto clamp(1.2rem,3vw,2rem);padding:0 clamp(1rem,4vw,2rem);
}
.proof__score{
  font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(2rem,5vw,2.8rem);
  line-height:1;color:var(--proof-accent,#8f1220);
}
.proof__count{font-size:.9rem;color:var(--proof-mut,#6b6b6b)}
.proof__src{font-size:.82rem;color:var(--proof-mut,#6b6b6b);margin-left:auto}

/* Дорожка продублирована ровно один раз: вторая копия въезжает,
   когда первая уходит, и стык не читается глазом. */
.proof__track{display:flex;width:max-content;animation:proof-run var(--speed) linear infinite}
.proof:hover .proof__track,
.proof:focus-within .proof__track{animation-play-state:paused}
@keyframes proof-run{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.proof__item{
  flex:0 0 auto;width:min(30rem,82vw);
  margin-right:clamp(1.2rem,3vw,2.2rem);
  padding:clamp(1.1rem,2.5vw,1.6rem);
  background:var(--proof-card,#fff);
  border:1px solid var(--proof-line,#e5e2de);
  border-radius:14px;
}
.proof__text{
  margin:0;font-size:.98rem;line-height:1.6;color:var(--proof-ink,#1a1a1a);
  /* Длинные отзывы обрезаем до пяти строк: строка должна читаться на ходу. */
  display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;
}
.proof__who{
  margin:.9rem 0 0;font-size:.82rem;color:var(--proof-mut,#6b6b6b);
  display:flex;gap:.5rem;flex-wrap:wrap;
}
.proof__who b{font-weight:600;color:var(--proof-ink,#1a1a1a)}

/* Кромки, чтобы карточки уходили в бумагу, а не обрубались краем экрана. */
.proof::before,.proof::after{
  content:"";position:absolute;top:0;bottom:0;width:clamp(2rem,8vw,7rem);z-index:2;pointer-events:none;
}
.proof::before{left:0;background:linear-gradient(90deg,var(--proof-bg,#faf8f6),transparent)}
.proof::after{right:0;background:linear-gradient(270deg,var(--proof-bg,#faf8f6),transparent)}

/* Условие 3. Движения нет вообще — строка становится читаемым списком. */
/* Узкий экран добавлен 30.08.2026: текст, который сам едет под пальцем,
   на телефоне не читают — его пролистывают. Отзыв нужен не чтобы двигаться,
   а чтобы его прочли. Раскладка уже написана для «уменьшить движение» —
   берём её же, а не пишем вторую. */
@media (prefers-reduced-motion: reduce), (max-width: 52rem){
  .proof__track{animation:none;width:auto;flex-wrap:wrap;justify-content:center;
    max-width:1080px;margin:0 auto;padding:0 clamp(1rem,4vw,2rem);gap:1rem}
  .proof__item{margin-right:0;width:min(24rem,100%)}
  .proof__item[data-clone="1"]{display:none}
  /* Двадцать пять карточек подряд — не доказательство, а стена: главная
     выросла с 11,3 до 15,2 экрана. Видимых шесть. Остальные остаются
     В РАЗМЕТКЕ — их читают ответные системы, ради которых блок и
     переписывался. Какие именно шесть — вопрос не ко мне: их подбирают
     по страхам, которые они снимают, и это решает владелец. */
  .proof__item:not([data-clone]):nth-of-type(n+7){display:none}   /* дубли в списке не нужны */
  .proof::before,.proof::after{display:none}
  .proof__text{-webkit-line-clamp:none;display:block;overflow:visible}
}
