/* Контакты: первый экран (ct-hero.tpl). Сплит 1328x352: 784 текста +
   480 данных, гуттер 64. Макет: фреймы UgNoM/Y1zTAH (десктоп) и
   txTx3/P9BNjM (телефон) страницы "Контакты". Не общий с pg-hero.css -
   своя геометрия и свой кегль заголовка (таблица docs/stranicy.md). */

.ct-hero {
  background: var(--white);
  padding: 40px 0 80px;   /* дамп UgNoM: padding [40,56,80,56], бока - .wrap */
}

.ct-hero__split {
  display: flex;
  gap: 64px;   /* дамп Y1zTAH */
  align-items: flex-start;
}

/* ─── Текст слева ────────────────────────────────────────────── */

.ct-hero__text {
  flex: 1 1 784px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;   /* дамп vUK8E */
}

.ct-hero__kicker {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 11px;
  line-height: 13px;   /* 11 x 1.21 (метрика Inter) */
  letter-spacing: 2.4px;
  color: var(--magenta-text);
}

/* Кегль заголовка первого экрана у контактов свой - 44/50 на компьютере,
   28/32 на телефоне (таблица docs/stranicy.md, не общий с pg-hero 42/48). */
.ct-hero__h1 {
  margin: 0;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 44px;
  line-height: 50px;   /* 44 x 1.14 */
  letter-spacing: -1.6px;
  color: var(--ink);
}

.ct-hero__p {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 18px;
  line-height: 32px;   /* дамп: 18 x 1.75 */
  color: var(--muted);
}

/* ─── Данные справа ──────────────────────────────────────────── */

.ct-hero__data {
  flex: 0 0 480px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;   /* дамп O23nyH */
}

.ct-hero__row {
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding-bottom: 20px;
  /* Обводка в макете внутренняя (strokeWidth bottom:1), border-bottom
     прибавил бы её к высоте строки - inset-тень не прибавляет. */
  box-shadow: inset 0 -1px 0 0 #16233D14;
}

.ct-hero__lbl {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 11px;
  line-height: 13px;   /* 11 x 1.21 */
  letter-spacing: 2px;
  color: var(--muted);
}

.ct-hero__value {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 18px;
  line-height: 27px;   /* 18 x 1.5 */
  color: var(--ink);
  white-space: pre-line;   /* перевод строки в поле "Адрес" - перевод строки на сайте */
}

.ct-hero__link {
  color: inherit;
  text-decoration: none;
}

.ct-hero__soc {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-top: 20px;
}

.ct-hero__soc-row {
  display: flex;
  gap: 14px;   /* дамп qKFcy */
}

/* .soc-line__item - общий класс чанка soc-line-item.tpl, вид form.css сюда
   не допускаем, весь вид - здесь (тот же приём, что у hm-zayavka.css). */
.ct-hero__soc-row .soc-line__item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ct-hero__soc-row .soc-line__item .ico {
  flex: none;
  width: 19px;
  height: 19px;
  color: var(--magenta-text);
}

.ct-hero__soc-row .soc-line__item span {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 15px;
  line-height: 18px;   /* 15 x 1.21, своего lineHeight в дампе нет */
  color: var(--ink);
}

@media (max-width: 860px) {
  .ct-hero {
    padding: 36px 0 40px;   /* дамп txTx3: padding [36,20,40,20] */
  }

  .ct-hero__split {
    flex-direction: column;
    gap: 20px;   /* дамп P9BNjM */
  }

  .ct-hero__text,
  .ct-hero__data {
    flex-basis: auto;
    width: 100%;
  }

  .ct-hero__kicker {
    font-size: 10px;   /* дамп cddi0 */
    line-height: 12px;   /* 10 x 1.21, забытое мобильное правило держало на 13 (метрике 11px) */
  }

  .ct-hero__h1 {
    font-size: 28px;
    line-height: 32px;   /* 28 x 1.14 */
    letter-spacing: -0.9px;
  }

  .ct-hero__p {
    font-size: 16px;
    line-height: 28px;   /* дамп: 16 x 1.75 */
  }

  .ct-hero__lbl {
    font-size: 10px;   /* дамп PtXmO */
    line-height: 12px;   /* 10 x 1.21, та же забытая мобильная строка, что у кикера */
  }

  .ct-hero__value {
    font-size: 16px;
    line-height: 24px;   /* 16 x 1.5 */
  }

  .ct-hero__soc-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;   /* дамп lWuB3: на телефоне иконки в столбик */
  }

  .ct-hero__soc-row .soc-line__item span {
    font-size: 14px;
    line-height: 17px;   /* 14 x 1.21 */
  }
}
