/* ============================================================
   qa.css — /voprosy «Вопрос эксперту» (этап 4, Task 4, макет 4a:
   строки 367–469 «Главная - варианты.dc.html»). Раскладка/отступы/радиусы —
   из макета; копирайтинг hero/сайдбара — честные замены (см. докблок
   templates/v3/pages/questions/index.php и honesty-and-constraints.md).
   ============================================================ */

.qa-page { padding-top: 20px; padding-bottom: 48px; }

/* ---- крошки (см. .jr-crumbs/.art-crumbs — тот же паттерн) ---- */
.qa-crumbs { font-size: 12.5px; font-weight: 700; color: var(--muted); margin-bottom: 16px; }
.qa-crumbs a:hover { color: var(--ink-2); }
.qa-crumbs__sep { margin: 0 6px; }
.qa-crumbs__current { color: var(--ink-2); }

/* ---- hero: форма вопроса (макет 4a: строки 383–400) ---- */
.qa-hero {
  background: var(--green); border-radius: var(--r-block); color: #fff;
  padding: 34px 40px; margin-bottom: 36px;
  display: grid; grid-template-columns: 1fr .9fr; gap: 36px; align-items: center;
}
.qa-hero__title { font-size: 32px; font-weight: 900; line-height: 1.2; }
.qa-hero__subtitle { font-size: 14.5px; line-height: 1.55; opacity: .92; margin-top: 10px; }
.qa-hero__stats { display: flex; gap: 24px; margin-top: 18px; font-size: 13px; font-weight: 800; flex-wrap: wrap; }

.qa-hero__widget { background: #fff; border-radius: 20px; padding: 20px 22px; color: var(--ink); }

.qa-ask-success { text-align: center; padding: 12px 4px 6px; }
.qa-ask-success__title { font-weight: 900; font-size: 18px; }
.qa-ask-success__text { font-size: 13.5px; color: var(--ink-3); line-height: 1.5; margin-top: 8px; }

.qa-ask-label { font-weight: 900; font-size: 15px; margin-bottom: 10px; }
.qa-ask-textarea {
  width: 100%; background: var(--terra-bg); border: 0; border-radius: 14px;
  padding: 12px 16px; font-size: 13.5px; min-height: 64px; resize: vertical;
  font-family: inherit; color: var(--ink);
}
.qa-ask-textarea::placeholder { color: #b0a08c; }
.qa-ask-textarea:focus { outline: 2px solid var(--terra); outline-offset: -1px; }

.qa-ask-optional { display: flex; flex-direction: column; gap: 8px; margin: 10px 0; }
.qa-ask-input {
  width: 100%; background: var(--terra-bg); border: 0; border-radius: var(--r-pill);
  padding: 9px 16px; font-size: 13px; font-family: inherit; color: var(--ink);
}
.qa-ask-input::placeholder { color: #b0a08c; }
.qa-ask-input:focus { outline: 2px solid var(--terra); outline-offset: -1px; }

.qa-ask-chips { margin: 12px 0; }
.qa-ask-chips .chip { cursor: pointer; }

/* Honeypot: скрыта визуально и от скринридеров (см. home.php newsletter). */
.qa-ask-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.qa-ask-submit { width: 100%; }
.qa-ask-error { margin-top: 10px; font-size: 12.5px; font-weight: 700; color: var(--terra); text-align: center; }

/* ---- лента + сайдбар (макет 4a: строки 402–464) ---- */
.qa-layout { display: grid; grid-template-columns: 1fr 340px; gap: 40px; align-items: start; }

.qa-filters { margin-bottom: 18px; }

.qa-empty { background: #fff; border-radius: var(--r-card); padding: 40px; text-align: center; color: var(--muted); }

.qa-list { display: flex; flex-direction: column; gap: 14px; }

.qa-card { padding: 22px 26px; }
.qa-card__head { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
.qa-avatar {
  width: 38px; height: 38px; border-radius: var(--r-pill); flex: none;
  display: flex; align-items: center; justify-content: center;
  font-weight: 900; font-size: 15px;
}
.qa-avatar--0 { background: var(--pastel-cream); color: #a5734c; }
.qa-avatar--1 { background: var(--pastel-blue); color: #5b7f91; }
.qa-avatar--2 { background: var(--green-bg); color: var(--green-ink); }
.qa-avatar--3 { background: var(--pastel-lilac); color: #6d5c91; }
.qa-avatar--seed { background: var(--green-bg); font-size: 16px; }

.qa-card__meta { min-width: 0; }
.qa-card__author { font-weight: 800; font-size: 13.5px; }
.qa-card__sub { font-size: 11.5px; color: var(--muted); margin-top: 2px; }

.qa-card__title { font-weight: 900; font-size: 16.5px; line-height: 1.35; }
.qa-card__text { font-size: 14px; line-height: 1.55; color: var(--ink-3); margin-top: 10px; }

.qa-card__answer { margin-top: 14px; background: var(--green-bg-soft); border-radius: 16px; padding: 16px 18px; }
.qa-card__answer-head { display: flex; gap: 10px; align-items: center; margin-bottom: 8px; }
.qa-answer-icon {
  width: 30px; height: 30px; border-radius: var(--r-pill); background: var(--pastel-cream);
  flex: none; display: flex; align-items: center; justify-content: center; font-size: 14px;
}
.qa-card__answer-who { font-size: 12.5px; font-weight: 800; color: var(--green-ink); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.badge--green { background: var(--green); color: #fff; }
.qa-card__answer-text { font-size: 14px; line-height: 1.55; color: #4a5a44; }

.qa-card__footer { display: flex; gap: 18px; margin-top: 12px; font-size: 12.5px; font-weight: 800; color: var(--muted); flex-wrap: wrap; }
.qa-helpful-btn, .qa-share-btn { display: inline-flex; align-items: center; gap: 5px; transition: color .15s; }
.qa-helpful-btn:hover, .qa-share-btn:hover { color: var(--terra); }
.qa-helpful-heart { font-size: 13px; }
.qa-helpful-btn.is-done { color: var(--terra); cursor: default; }
.qa-helpful-btn.is-done .qa-helpful-heart { color: var(--terra); }
.qa-helpful-btn[disabled] { cursor: default; }

.qa-more-wrap { display: flex; justify-content: center; margin-top: 20px; }

/* ---- сайдбар ---- */
.qa-sidebar { display: flex; flex-direction: column; gap: 16px; }
.qa-sidebar__block { padding: 22px 26px; }
.qa-sidebar__block--dark { background: var(--ink); color: #fff; }
.qa-sidebar__block--cream { background: var(--pastel-cream); padding: 20px 24px; }
.qa-sidebar__title { font-weight: 900; font-size: 17px; margin-bottom: 14px; }
.qa-sidebar__title--sm { font-size: 15px; margin-bottom: 8px; }
.qa-sidebar__eyebrow {
  font-size: 12px; font-weight: 800; color: var(--green); text-transform: uppercase;
  letter-spacing: 1px; margin-bottom: 12px;
}

.qa-editorial-list { display: flex; flex-direction: column; gap: 12px; }
.qa-editorial-item { display: flex; gap: 12px; align-items: center; }
.qa-editorial-icon {
  width: 42px; height: 42px; border-radius: var(--r-pill); flex: none;
  background: rgba(255, 255, 255, .12); display: flex; align-items: center;
  justify-content: center; font-size: 18px;
}
.qa-editorial-role { font-weight: 800; font-size: 13.5px; }
.qa-editorial-count { font-size: 11.5px; color: var(--dark-ink-on); }
.qa-editorial-note { font-size: 11.5px; color: var(--dark-ink-on); line-height: 1.45; margin-top: 14px; }

.qa-howto { font-size: 13px; line-height: 1.6; color: var(--ink-3); }
.qa-disclaimer { font-size: 11.5px; color: var(--muted); margin-top: 10px; line-height: 1.45; }

.qa-popular-chips { margin: 0; }

/* ---- планшет: сайдбар под лентой одной колонкой (см. cart.css — тот же
   порог 1023px для авто-сжатых двух колонок) ---- */
@media (max-width: 1023px) {
  .qa-layout { grid-template-columns: 1fr; gap: 24px; }
}

/* ---- мобильная версия ---- */
@media (max-width: 768px) {
  .qa-page { padding-top: 12px; }

  .qa-hero { grid-template-columns: 1fr; padding: 26px 22px; gap: 22px; margin-bottom: 24px; }
  .qa-hero__title { font-size: 24px; }

  .qa-card { padding: 18px 18px; }
  .qa-card__title { font-size: 15px; }

  .qa-sidebar__block { padding: 20px; }
}