/* /vrach/ — страница врача: хиро с портретом, направления, образование и опыт, место приёма.
   Данные — со страницы врача на fnkc-fmba.ru (снято 11-10-2026). Общие блоки (.phero, .panel, .check, .tags, .split) — inner.css */

/* ---- Хиро: текст слева, портрет справа на розовой подложке ---- */
.phero .crumbs { margin-bottom: 18px; }
.vhero { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 56px; align-items: center; }
.vhero__col { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.vhero__role { margin-top: -6px; font-size: 17px; font-weight: 500; line-height: normal; color: var(--rose); }
.vhero__photo { border-radius: var(--r-lg); overflow: hidden; aspect-ratio: 585 / 677; background: var(--haze); }
.vhero__photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; }

/* Три факта строкой: число Prata + подпись */
.vfacts { display: flex; flex-wrap: wrap; gap: 14px 40px; padding-block: 6px 2px; }
.vfacts__item { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.vfacts__num { font-family: var(--font-serif); font-size: 22px; line-height: 1.3; color: var(--ink); }
.vfacts__cap { font-size: 13.5px; line-height: 1.4; color: var(--ink-soft); }

/* ---- Направления: карточка-панель, список с галочкой, ссылки на страницы сайта внизу ---- */
.specs { grid-template-columns: repeat(3, minmax(0, 1fr)); } /* три всегда в ряд, без «2 + 1» на планшете */
.spec__list li { font-size: 15px; line-height: 1.55; }
.spec__links { margin-top: auto; padding-top: 6px; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 14.5px; }
.spec__links a {
  color: var(--rose);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(138, 74, 94, .35);
}
.spec__links a:hover { color: var(--rose-dark); text-decoration-color: currentColor; }
.tags .tag { font-size: 14.5px; color: var(--ink); }

/* ---- Образование и опыт: строки «год | что и где» на волосяных линиях ---- */
.cv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 56px; }
.cv__col { min-width: 0; }
.cv__list { list-style: none; padding: 0; border-top: 1px solid var(--haze); }
.cv__item {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 20px;
  padding-block: 18px;
  border-bottom: 1px solid var(--haze);
}
.cv__year { font-family: var(--font-serif); font-size: 17px; line-height: 1.45; color: var(--rose); }
.cv__title { font-weight: 500; font-size: 16px; line-height: 1.5; color: var(--ink); }
.cv__place { margin-top: 2px; font-size: 15px; line-height: 1.5; color: var(--ink-soft); }
.cv__now {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 9px;
  border-radius: var(--r-pill);
  background: var(--sage);
  color: #fff;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  vertical-align: 2px;
}

/* ---- Где принимает: строки «подпись — значение» ---- */
.vplace { display: flex; flex-direction: column; }
.vplace__row { display: flex; flex-direction: column; gap: 3px; padding-block: 14px; border-bottom: 1px solid var(--haze); }
.vplace__row:first-child { padding-top: 0; }
.vplace__row:last-child { padding-bottom: 0; border-bottom: 0; }
.vplace dt { font-size: 13px; line-height: normal; color: var(--ink-mute); }
.vplace dd { font-size: 16px; line-height: 1.5; color: var(--ink); }
.vplace a { color: var(--rose); text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 1024px) {
  .vhero { grid-template-columns: minmax(0, 1fr) 300px; gap: 36px; }
  .cv { gap: 40px 36px; }
  .specs .panel { padding: 22px 20px; }
}
/* Столбцом: фото над именем, кадр 4:3 от макушки — лицо и плечи */
@media (max-width: 900px) {
  .vhero { grid-template-columns: 1fr; gap: 24px; }
  .vhero__photo { order: -1; max-width: 520px; width: 100%; aspect-ratio: 4 / 3; }
  .cv { grid-template-columns: 1fr; }
  .specs { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .vhero__role { font-size: 16px; }
  .vfacts { gap: 12px 28px; }
  .vfacts__num { font-size: 20px; }
}
@media (max-width: 480px) {
  .cv__item { grid-template-columns: 1fr; gap: 4px; padding-block: 16px; }
  .cv__year { font-size: 15px; }
}