@layer pages {
  /* Отзывы (/otzyv/): список карточек, комментарий доктора врезкой, форма «Оставить отзыв» */
  .reviews-page { display: flex; flex-direction: column; gap: 28px; max-width: 860px; min-width: 0; }
  .reviews-list { display: flex; flex-direction: column; gap: 20px; }
  .reviews-empty { display: flex; flex-direction: column; gap: 8px; }

  .review { display: flex; flex-direction: column; gap: 14px; --card-pad: 28px 32px; scroll-margin-top: 24px; }
  .review:target { box-shadow: 0 0 0 3px var(--accent); }
  .review__text { display: flex; flex-direction: column; gap: 12px; font-size: 19px; line-height: 1.6; overflow-wrap: anywhere; }
  .review__text p { margin: 0; }
  .review__meta { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0; color: var(--ink-3); font-size: 16px; }
  .review__author { color: var(--ink-2); font-weight: 600; }
  .review__reply { padding: 18px 20px 18px 56px; font-size: 17px; white-space: pre-line; overflow-wrap: anywhere; }
  .review__reply a { color: var(--accent-ink); text-decoration: underline; }
  .review__reply::before { left: 18px; top: 20px; }

  .reviews-form { display: flex; flex-direction: column; gap: 20px; --card-pad: 36px; scroll-margin-top: 24px; }
  .reviews-form__submit { align-self: flex-start; }
  .reviews-success { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }

  @media (max-width: 820px) {
    .review__text { font-size: 18px; }
    .review__reply { padding: 16px 18px; }
    .reviews-form__submit { align-self: stretch; }
  }
}
