/* =========================================================
   Отзывы (светлая секция) и оценки по темам
   ========================================================= */
.reviews { padding: var(--section) 0; background: var(--linen-2); }
.reviews__head { display: flex; justify-content: space-between; align-items: center; gap: 30px; flex-wrap: wrap; margin-bottom: 40px; }
.reviews .h2 { margin-bottom: 0; }
.score { display: flex; align-items: center; gap: 16px; }
.score b { font: 600 70px/1 var(--display); color: var(--emerald); }
.score > span { font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.score .stars { display: block; color: #b88a3d; }

/* шкалы: доля положительных отзывов по темам (Яндекс Карты) */
.aspects { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 40px; margin-bottom: 48px; padding: 26px 30px; background: var(--linen); border: 1px solid rgba(154, 116, 40, .2); }
.aspect { display: grid; grid-template-columns: auto 1fr auto; grid-template-areas: "name . val" "bar bar bar"; align-items: baseline; gap: 6px 10px; }
.aspect span { grid-area: name; font: 700 17px/1.2 var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--emerald); }
.aspect b { grid-area: val; font: 600 22px/1 var(--display); color: var(--gold-dark); }
.aspect i { grid-area: bar; position: relative; height: 4px; background: rgba(23, 35, 29, .1); overflow: hidden; }
.aspect i::after { content: ""; position: absolute; inset: 0; width: var(--v); background: linear-gradient(90deg, var(--emerald), var(--gold)); transform-origin: left; transform: scaleX(0); transition: transform 1.4s var(--ease) .2s; }
.aspects.is-in .aspect i::after, html:not(.js) .aspect i::after { transform: none; }

.quotes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.q { display: flex; flex-direction: column; justify-content: space-between; gap: 24px; padding: 30px 28px; background: var(--linen); }
.q blockquote p { margin: 0; font-size: 16.5px; line-height: 1.6; color: var(--text); }
.q figcaption { font-size: 13px; color: var(--muted); }
.quotes .reveal:nth-child(3) { transition-delay: .12s; }
.quotes .reveal:nth-child(4) { transition-delay: .24s; }

@media (max-width: 900px) {
  .quotes { grid-template-columns: 1fr; }
  .aspects { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .score b { font-size: 56px; }
  .aspects { grid-template-columns: 1fr; padding: 22px 20px; }
}