/* Витрина отзывов из профиля Google. 16-08-2026.
   Заменяет блок «оставьте отзыв» (reviews-20260801): к 16.08 в профиле семь
   отзывов и общая оценка 5,0, а просьба написать отзыв стояла на странице,
   куда приходят те, кто сервис ещё не пробовал.
   Разметки в index.html нет — лендинг SPA, блок дорисовывает reviews-20260816.js.
   Правишь этот файл — меняй метку ?v= в index.html, иначе браузер отдаст старое. */

.bpr-wall{padding:64px 0}
.bpr-wall .container{max-width:1200px; margin:0 auto; padding:0 16px}

/* ── шапка: оценка, звёзды, ссылка на первоисточник ── */
.bpr-wall .bpr-top{
  display:flex; align-items:center; justify-content:center; gap:12px;
  flex-wrap:wrap; margin-bottom:14px;
}
.bpr-wall .bpr-score{
  font-size:2.1rem; font-weight:900; line-height:1; color:#0f172a;
  font-variant-numeric:tabular-nums;
}
.bpr-wall .bpr-stars{display:flex; gap:3px}
.bpr-wall .bpr-src{
  display:inline-flex; align-items:center; gap:7px;
  font-size:.9rem; font-weight:600; color:#475569; text-decoration:none;
  padding:6px 12px; border:1px solid #e2e8f0; border-radius:50px; background:#fff;
  transition:border-color .18s ease, color .18s ease;
}
.bpr-wall .bpr-src:hover{border-color:#cbd5e1; color:#0f172a}
.bpr-wall .bpr-src svg{flex:none}

.bpr-wall .bpr-h{
  margin:0 0 6px; text-align:center;
  font-size:2.1rem; font-weight:900; letter-spacing:-.02em; color:#0f172a;
  text-wrap:balance;
}
.bpr-wall .bpr-sub{
  margin:0 auto 30px; text-align:center; max-width:520px;
  font-size:1.02rem; line-height:1.55; color:#64748b;
}

/* ── карточки ── */
.bpr-wall .bpr-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-bottom:28px;
}
.bpr-wall .bpr-card{
  display:flex; flex-direction:column;
  background:#fff; border:1px solid #e2e8f0; border-radius:16px; padding:22px;
  box-shadow:0 1px 3px rgba(15,23,42,.06);
}
.bpr-wall .bpr-card .bpr-st{display:flex; gap:3px; margin-bottom:12px}
.bpr-wall .bpr-card .bpr-tx{
  margin:0 0 18px; font-size:.95rem; line-height:1.65; color:#334155;
  flex:1 1 auto; white-space:pre-line;      /* в одном отзыве автор сам сделал перенос */
}
.bpr-wall .bpr-who{display:flex; align-items:center; gap:10px}
.bpr-wall .bpr-av{
  width:36px; height:36px; flex:none; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:.9rem; color:#fff;
}
.bpr-wall .bpr-nm{font-weight:700; font-size:.9rem; color:#0f172a; line-height:1.25}

/* ── низ: читать все / написать свой ── */
.bpr-wall .bpr-more{
  display:flex; align-items:center; justify-content:center; gap:10px 18px;
  flex-wrap:wrap; text-align:center;
}
.bpr-wall .bpr-b{
  display:inline-flex; align-items:center; gap:10px; background:#2563eb; color:#fff;
  text-decoration:none; font-weight:700; font-size:.98rem; padding:13px 26px;
  border-radius:50px; transition:background-color .18s ease;
}
.bpr-wall .bpr-b:hover{background:#1d4ed8}
.bpr-wall .bpr-lnk{
  font-size:.92rem; font-weight:600; color:#64748b; text-decoration:none;
  border-bottom:1px solid #cbd5e1; padding-bottom:1px;
  transition:color .18s ease, border-color .18s ease;
}
.bpr-wall .bpr-lnk:hover{color:#0f172a; border-color:#94a3b8}

/* ── телефон: лента с прилипанием вместо семи карточек в столбик ──
   Семь карточек в колонку добавили бы к странице почти два экрана — а она и так
   длинная. Лента показывает одну карточку и приглашает листать вбок. */
@media(max-width:900px){
  .bpr-wall{padding:44px 0}
  .bpr-wall .bpr-h{font-size:1.5rem}
  .bpr-wall .bpr-sub{font-size:.95rem; margin-bottom:22px}
  .bpr-wall .bpr-score{font-size:1.8rem}
  .bpr-wall .bpr-grid{
    display:flex; gap:12px; margin-bottom:20px;
    overflow-x:auto; overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
    /* вылезаем за поля контейнера, чтобы лента начиналась от края экрана */
    margin-inline:-16px; padding:2px 16px 10px;
    scrollbar-width:none;
  }
  .bpr-wall .bpr-grid::-webkit-scrollbar{display:none}
  .bpr-wall .bpr-card{
    flex:0 0 84%; max-width:340px; scroll-snap-align:center; padding:18px;
  }
  .bpr-wall .bpr-card .bpr-tx{font-size:.92rem; margin-bottom:14px}
  /* точки-указатели: сколько карточек и где мы сейчас */
  .bpr-wall .bpr-dots{display:flex; justify-content:center; gap:6px; margin-bottom:18px}
  .bpr-wall .bpr-dot{
    width:6px; height:6px; border-radius:50%; background:#cbd5e1;
    transition:background-color .2s ease, width .2s ease;
  }
  .bpr-wall .bpr-dot.on{background:#2563eb; width:18px; border-radius:3px}
}
@media(min-width:901px){
  .bpr-wall .bpr-dots{display:none}
}
@media(prefers-reduced-motion:reduce){
  .bpr-wall .bpr-grid{scroll-behavior:auto}
  .bpr-wall .bpr-dot{transition:none}
}

/* ── строка в подвале: показываем оценку, а не просим её ставить ── */
.bpr-foot{
  margin:4px 0 18px; padding-top:18px;
  border-top:1px solid rgba(255,255,255,.09); max-width:300px;
}
.bpr-foot .bpr-head{display:flex; align-items:center; gap:9px; margin-bottom:9px}
.bpr-foot .bpr-stars{display:flex; gap:3px}
.bpr-foot .bpr-g{
  display:flex; width:20px; height:20px; flex:none; border-radius:50%;
  background:#fff; align-items:center; justify-content:center;
}
.bpr-foot .bpr-sc{font-weight:800; color:#fff; font-size:.95rem; font-variant-numeric:tabular-nums}
.bpr-foot .bpr-t{
  display:block; font-size:.86rem; line-height:1.5;
  color:rgba(255,255,255,.55); margin-bottom:12px;
}
.bpr-foot .bpr-b{
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 18px; border-radius:50px;
  border:1px solid rgba(255,255,255,.22);
  color:rgba(255,255,255,.92); text-decoration:none;
  font-size:.85rem; font-weight:600; white-space:nowrap;
  transition:background-color .18s ease, border-color .18s ease;
}
.bpr-foot .bpr-b:hover{background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.4)}
@media(max-width:768px){
  .bpr-foot{max-width:none; margin:2px 0 16px}
}
