/* ============================================================
   (QA-31) шрифты: текст не мельче 0.8rem (12.8px), плашки и подписи капителью — 0.75rem (12px)
   Отзывы — карточка «заказала → получила», сводка, страница /reviews/.
   Подключается на странице хвоста, главной и /reviews/.
   ============================================================ */
.rv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; align-items: start; }
.rv-card {
  position: relative; background: var(--card, #fff); border: 1px solid var(--border); border-radius: 1rem;
  padding: 1.1rem 1.2rem 1.15rem; display: flex; flex-direction: column; gap: 0.7rem; min-width: 0;
}
.rv-card.rv-this { border-color: var(--accent, #8a5a2b); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent, #8a5a2b) 14%, transparent); }
.rv-ribbon { align-self: flex-start; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: #fff; background: var(--accent, #8a5a2b); padding: 0.2rem 0.6rem; border-radius: 999px; margin-bottom: -0.2rem; }
.rv-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 0.6rem; font-size: 0.88rem; }
.rv-stars { color: #d4a017; letter-spacing: 0.12em; font-size: 0.85rem; }
.rv-verified { font-size: 0.8rem; font-weight: 600; letter-spacing: 0.04em; color: #15803d; background: color-mix(in oklab, #15803d 10%, transparent); border-radius: 999px; padding: 0.15rem 0.55rem; white-space: nowrap; }
.rv-who { color: var(--muted-foreground); }
.rv-who b { color: var(--foreground); font-weight: 600; }
.rv-date { margin-left: auto; color: var(--muted-foreground); font-size: 0.8rem; white-space: nowrap; }

/* Связка «заказала → получила» */
.rv-proof { display: flex; align-items: stretch; gap: 0.6rem; padding: 0.7rem; border-radius: 0.8rem; background: color-mix(in oklab, var(--border) 25%, transparent); }
.rv-proof-item { display: flex; gap: 0.6rem; align-items: center; min-width: 0; flex: 1 1 0; text-decoration: none; color: inherit; }
.rv-proof-item img, .rv-noimg { width: 64px; height: 84px; object-fit: cover; object-position: top; border-radius: 0.5rem; flex-shrink: 0; background: color-mix(in oklab, var(--border) 60%, transparent); display: block; }
.rv-proof-cap { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; font-size: 0.82rem; line-height: 1.3; }
.rv-proof-l { font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted-foreground); }
.rv-proof-cap b { font-family: var(--font-serif); font-size: 1.05rem; }
.rv-proof-cap small { color: var(--muted-foreground); font-size: 0.8rem; }   /* <small> по умолчанию «smaller» — было 10.9px */
.rv-proof-cap em { font-style: normal; color: var(--accent-ink, #8a5a2b); text-decoration: underline; text-underline-offset: 3px; font-size: 0.8rem; }
.rv-proof-item:hover em { text-decoration-thickness: 2px; }
.rv-arrow { align-self: center; color: var(--accent-ink, #8a5a2b); font-size: 1.3rem; flex-shrink: 0; }
.rv-proof-got { display: flex; flex-direction: column; gap: 0.25rem; flex: 1 1 0; min-width: 0; }
.rv-got-grid { display: flex; gap: 0.35rem; }
.rv-got-grid a { display: block; flex: 1 1 0; min-width: 0; max-width: 84px; }
.rv-got-grid img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; border-radius: 0.5rem; }
.rv-got-compact { margin-top: -0.2rem; }
.rv-got-compact a { max-width: 96px; }

.rv-text { margin: 0; font-size: 0.98rem; line-height: 1.55; }
.rv-shot { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; color: var(--muted-foreground); font-size: 0.8rem; }
.rv-shot img { width: 64px; height: 64px; object-fit: cover; object-position: top; border-radius: 0.5rem; border: 1px solid var(--border); }
.rv-video { align-self: flex-start; font-size: 0.85rem; color: var(--accent-ink, #8a5a2b); text-decoration: underline; text-underline-offset: 3px; }
.rv-meta { margin: 0; font-size: 0.8rem; color: var(--muted-foreground); }
.rv-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.3rem; }
.rv-tags a { display: inline-block; font-size: 0.8rem; padding: 0.18rem 0.55rem; border: 1px solid var(--border); border-radius: 999px; color: var(--muted-foreground); text-decoration: none; }
.rv-tags a:hover { border-color: var(--accent, #8a5a2b); color: var(--accent, #8a5a2b); }
.rv-reply { margin-top: 0.2rem; padding: 0.65rem 0.85rem; border-left: 3px solid var(--accent, #8a5a2b); background: color-mix(in oklab, var(--accent, #8a5a2b) 7%, transparent); border-radius: 0 0.6rem 0.6rem 0; font-size: 0.88rem; }
.rv-reply-h { display: flex; gap: 0.5rem; align-items: baseline; margin-bottom: 0.2rem; }
.rv-reply-h span { color: var(--muted-foreground); font-size: 0.8rem; }
.rv-reply p { margin: 0; line-height: 1.5; }

/* Микро-строка у цены / кнопки */
.rv-proof-line { display: inline-block; margin: 0.35rem 0 0; font-size: 0.85rem; color: var(--foreground); text-decoration: none; border-bottom: 1px dashed var(--muted-foreground); }
.rv-proof-line:hover { border-bottom-style: solid; }

/* Сводка */
.rv-summary { margin: 0 0 1.25rem; }
.rv-tiles { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.rv-tile { flex: 1 1 8rem; min-width: 7.5rem; background: var(--card, #fff); border: 1px solid var(--border); border-radius: 0.8rem; padding: 0.7rem 0.9rem; }
.rv-tile b { display: block; font-family: var(--font-serif); font-size: 1.5rem; line-height: 1.1; font-weight: 500; }
.rv-tile span { font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted-foreground); }
.rv-mention { margin-top: 0.8rem; display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.6rem; font-size: 0.85rem; }
.rv-mention-l { color: var(--muted-foreground); }
.rv-mention ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.35rem; }
.rv-mention a { display: inline-block; padding: 0.25rem 0.7rem; border: 1px solid var(--border); border-radius: 999px; text-decoration: none; color: var(--foreground); }
.rv-mention a b { color: var(--muted-foreground); font-weight: 500; }
.rv-mention a:hover { border-color: var(--accent, #8a5a2b); }

/* Секция на странице хвоста / главной */
.rv-section-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.5rem 1rem; margin-bottom: 0.9rem; }
.rv-section-head h2 { margin: 0; }
.rv-all { font-size: 0.9rem; color: var(--accent-ink, #8a5a2b); text-decoration: underline; text-underline-offset: 3px; }

/* На странице счёта: одна колонка, без рамки-«карточки счёта» снаружи */
.rv-grid-1 { grid-template-columns: 1fr; }
.pay-reviews { margin-bottom: 1rem; }
.pay-rv-sub { margin: 0.2rem 0 0.8rem; font-size: 0.9rem; color: var(--muted-foreground); }
.pay-rv-sub a { color: var(--accent-ink, #8a5a2b); }

/* Страница /reviews/ */
.rvp { padding: 2rem 0 4rem; }
.rvp-head { margin-bottom: 1.25rem; max-width: 46rem; }
.rvp-head h1 { font-family: var(--font-serif); font-size: clamp(1.8rem, 4vw, 2.4rem); margin: 0 0 0.5rem; line-height: 1.15; }
.rvp-head p { color: var(--muted-foreground); line-height: 1.55; margin: 0; }
.rvp-filters { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0 0 1.1rem; align-items: center; }
.rvp-filters .rvf-l { font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted-foreground); margin-right: 0.3rem; }
.rvp-filters a { display: inline-block; font-size: 0.85rem; padding: 0.35rem 0.8rem; border: 1px solid var(--border); border-radius: 999px; text-decoration: none; color: var(--foreground); background: var(--card, #fff); }
.rvp-filters a.on { background: var(--primary, #2b2119); border-color: var(--primary, #2b2119); color: var(--primary-foreground, #fff); }
.rvp-filters .rvf-sep { width: 100%; height: 0; }
.rvp-empty { padding: 3rem 1rem; text-align: center; color: var(--muted-foreground); }
.rvp-pager { display: flex; justify-content: center; gap: 0.6rem; margin-top: 1.5rem; }
.rvp-pager a, .rvp-pager span { padding: 0.5rem 1rem; border: 1px solid var(--border); border-radius: 999px; text-decoration: none; color: var(--foreground); }
.rvp-pager span { color: var(--muted-foreground); }
.rvp-cta { margin-top: 2.5rem; text-align: center; }

@media (max-width: 640px) {
  .rv-grid { grid-template-columns: 1fr; }
  .rv-proof { flex-direction: column; }
  .rv-arrow { transform: rotate(90deg); align-self: flex-start; margin: -0.3rem 0 -0.3rem 1.6rem; }
  .rv-got-grid a { max-width: 96px; }
  .rv-tile { flex-basis: 40%; }
}
