/* Контакты: "Как добраться" (ct-kak.tpl) - кикер+заголовок, ряд пунктов
   с крупной цифрой. Макет: секция "Как добраться" (I1CKSD/EmJPz десктоп,
   t2w7hy/RN27z телефон) страницы "Контакты".

   Геометрия совпадает до px с pg-kak.css ("Как проходит занятие"
   программ) - это замерено по дампу, не предположение, но блок и файл
   свои (docs/stranicy.md, "Главное правило этой части"): другая страница,
   другой текст, своё поле пунктов. Ряд пунктов - общая сетка .pg-ryad
   (pg.css), здесь только зазор и сама карточка. */

.ct-kak {
  background: var(--paper);
  padding-block: 100px;   /* дамп I1CKSD: padding [100,56] */
}

.ct-kak__wrap {
  display: flex;
  flex-direction: column;
  gap: var(--gap-section);   /* 44 в дампе = токену */
}

/* ─── Заголовок ──────────────────────────────────────────────── */

.ct-kak__head {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.ct-kak__kicker {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--kicker);   /* 12 */
  line-height: 15px;   /* 12 x 1.21 */
  letter-spacing: 3px;
  color: var(--magenta-text);
}

.ct-kak__h2 {
  margin: 0;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: var(--h2-sm);   /* 48 */
  line-height: 55px;   /* 48 x 1.14 */
  letter-spacing: var(--h2-sm-ls);   /* -1.6px */
  color: var(--ink);
}

/* ─── Пункты ─────────────────────────────────────────────────── */

.ct-kak__items {
  gap: 26px;   /* дамп EmJPz: 4 x 312,5 + 3 x 26 = 1328, колонки - .pg-ryad */
}

.ct-kak__item {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.ct-kak__num {
  margin: 0;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 34px;
  line-height: 46px;   /* 34 x 1.36 (метрика Manrope) */
  letter-spacing: -1px;
  color: var(--sun);
}

.ct-kak__item-h3 {
  margin: 0;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 19px;
  line-height: 25px;   /* 19 x 1.3 */
  letter-spacing: var(--h3-ls);   /* -0.4px */
  color: var(--ink);
}

.ct-kak__item-p {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: var(--body-sm);   /* 15 */
  line-height: 26px;   /* дамп: 15 x 1.75 */
  color: var(--muted);
}

@media (max-width: 860px) {
  .ct-kak {
    padding-block: var(--section-y-m);   /* 52 в дампе = токену */
  }

  .ct-kak__kicker {
    font-size: var(--m-kicker);   /* 11 */
    line-height: 13px;   /* 11 x 1.21 */
  }

  .ct-kak__h2 {
    font-size: 30px;
    line-height: 34px;   /* 30 x 1.14 */
    letter-spacing: -0.9px;
  }

  .ct-kak__items {
    gap: 26px;   /* дамп RN27z: тот же зазор, что на десктопе */
  }

  .ct-kak__num {
    font-size: 23px;
    line-height: 31px;   /* 23 x 1.36 */
    letter-spacing: -0.6px;
  }

  .ct-kak__item-h3 {
    font-size: 17px;
    line-height: 22px;   /* 17 x 1.3 */
    letter-spacing: -0.3px;
  }

  .ct-kak__item-p {
    font-size: 14px;
    line-height: 25px;   /* дамп: 14 x 1.75 */
  }
}
