/* Кредит, выкуп, отзывы и статьи в первом варианте оформления.

   🔴 Отдельный файл, а не дописка в styles.css: тот и так на 925 строк,
   и третья часть задания будет его переверстывать. Новое кладём туда,
   где его видно.

   Цвета только переменными темы: --line, --muted, --surface-soft, --brand
   объявлены во всех трёх палитрах (theme-a, theme-b, theme-c). Отступы
   кратны восьми — новый файл должен быть по конституции с первого дня. */

/* --- кредит --- */
.credit-form .field { margin-bottom: 16px; }
.credit-answer { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius-small); background: var(--surface-soft); }
.credit-answer .price { margin: 8px 0 16px; }
.credit-answer .price-list div { padding: 8px 0; border-bottom: 1px solid var(--line); }
.credit-answer .price-list div:last-child { border-bottom: 0; font-weight: 600; }
.credit-answer .text-link { display: inline-flex; align-items: center; min-height: 48px; }

/* --- выкуп --- */
.buyout-section .timeline li { padding-bottom: 24px; }
.buyout-section .timeline strong { display: block; margin-bottom: 8px; }

/* --- отзывы --- */
.reviews-list { display: grid; gap: 24px; max-width: 960px; }
.review-card { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius-small); }
.review-card__head { display: flex; align-items: start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.review-card__head h2 { margin: 0; font-size: 1.25rem; }
.review-card__rating { margin: 0; padding: 8px 16px; border-radius: var(--radius-small); background: var(--surface-soft); white-space: nowrap; }
.review-card p { max-width: 72ch; }
/* Длинный отзыв свёрнут обычным details: он работает без JavaScript */
.review-more summary { display: inline-flex; align-items: center; min-height: 48px; color: var(--brand); cursor: pointer; }
.review-more p { margin-top: 16px; }
/* Два разных снимка отзыва: машина покупателя и он сам */
.review-photo, .review-client-photo { display: block; width: 100%; max-width: 480px; height: auto; margin-top: 16px; border-radius: var(--radius-small); }

/* --- статьи --- */
.article-grid .article-card__image img { display: block; width: 100%; height: auto; aspect-ratio: 1.6; object-fit: cover; }
.article-card h2, .article-card h3 { margin: 8px 0; font-size: 1.25rem; }
.article-card .text-link { display: inline-flex; align-items: center; min-height: 48px; }
.article { max-width: 760px; }
.article__image { display: block; width: 100%; height: auto; margin-bottom: 24px; border-radius: var(--radius-small); }
.article__text { font-size: 1.125rem; line-height: 1.75; }
.article__text p + p { margin-top: 24px; }
.article-next .callout .text-link { display: inline-flex; align-items: center; min-height: 48px; margin-right: 16px; }

@media (max-width: 900px) {
  .reviews-list { gap: 16px; }
  .review-card { padding: 16px; }
  .review-card__head { flex-direction: column; gap: 8px; }
}