/* Письмо Санте. Макет: xC3jj (1440) и DhP61 (390).

   Фон секции тёмный - fill #07130F совпадает с --bg-deep, в разметке
   класс .hw-sec--deep из prazdnik.css, свой цвет здесь не нужен.
   Надстрочник и заголовок - общие .hw-kicker/.hw-h2, размеры совпадают
   с токенами один в один (как в hw-vocab.css). Межстрочный лида в
   макете 1.8 (780 -> 31px), а не общий 1.75 у .hw-lead (30px), поэтому
   высота строки переопределена - тот же приём, что в hw-vocab.css.

   Бумага бланка - готовые токены --paper-h/--paper-ink/--paper-red,
   заведённые под письмо и форму. Пропуск ребёнка - всегда --paper-red
   полужирным (600), остальной текст бланка - --paper-ink обычным. */

.ch-letter__wrap {
  display: flex;
  flex-direction: column;
  gap: 46px;
}

.ch-letter__head {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ch-letter__lead {
  max-width: 780px;
  line-height: 31px;   /* 17 x 1.8 = 30.6 */
}

.ch-letter__body {
  display: flex;
  gap: 36px;
}

/* Бланк - бумага с пропусками. */
.ch-letter__paper {
  flex: none;
  width: 620px;
  padding: 44px;
  background: var(--paper-h);
  border-radius: 6px;
}

.ch-letter__salute {
  margin: 0 0 22px;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 26px;
  line-height: 36px;   /* по замеру макета, у Manrope 800 здесь не метрика по умолчанию */
  letter-spacing: -.6px;
  color: var(--paper-ink);
}

.ch-letter__lines {
  display: flex;
  flex-direction: column;
}

.ch-letter__line {
  margin: 0;
  padding-block: 9px;
  font-family: var(--font-body);
  font-size: 19px;
  line-height: 30px;   /* 19 x 1.6 = 30.4 */
  color: var(--paper-ink);
}

.ch-letter__blank {
  font-weight: 600;
  color: var(--paper-red);
}

.ch-letter__signoff {
  margin: 18px 0 0;
  font-family: var(--font-body);
  font-size: 19px;
  line-height: 23px;   /* 19 x 1.21 */
  color: var(--paper-ink);
}

.ch-letter__signoff-blank {
  margin: 0;
  font-family: var(--font-body);
  font-size: 19px;
  line-height: 23px;   /* 19 x 1.21 */
  font-weight: 600;
  color: var(--paper-red);
}

/* Подсказки родителям. */
.ch-letter__hints {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.ch-letter__hint {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.ch-letter__hint-h {
  margin: 0;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 18px;
  line-height: 24px;   /* 18 x 1.35 = 24.3 */
  color: var(--accent-text);
}

.ch-letter__hint-p {
  margin: 0;
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 26px;   /* 15 x 1.75 = 26.25 */
  color: var(--text-2);
}

@media (max-width: 860px) {
  .ch-letter__body {
    flex-direction: column;
    gap: 28px;
  }

  .ch-letter__lead {
    font-size: 15px;   /* не общий --m-lead 16px, в макете 15 */
    line-height: 27px;   /* 15 x 1.8 = 27 */
  }

  .ch-letter__paper {
    width: 100%;
    padding: 28px 20px;
  }

  .ch-letter__salute {
    margin-bottom: 4px;
    letter-spacing: -.4px;
  }

  .ch-letter__line {
    font-size: 18px;
    line-height: 29px;   /* 18 x 1.6 = 28.8 */
  }

  .ch-letter__signoff {
    margin-top: 4px;
    font-size: 18px;
    line-height: 22px;   /* 18 x 1.21 = 21.78 */
  }

  .ch-letter__signoff-blank {
    font-size: 18px;
    line-height: 22px;
  }

  .ch-letter__hint-h {
    font-size: 16px;
    line-height: 22px;   /* 16 x 1.35 = 21.6 */
  }

  .ch-letter__hint-p {
    font-size: 14px;
    line-height: 25px;   /* 14 x 1.75 = 24.5 */
  }
}