/* Программа: "Другие программы" - три ссылки на смежные программы.
   Макет: фреймы d2Yya (десктоп, 1440x330) и DbtPT (телефон, 390x426).
   Полосу 1440 с отступами 56/20 даёт сайтовый .wrap (base.css), раскладку
   ряда в три колонки - .pg-ryad (pg.css); здесь только своя геометрия и
   типографика блока. */

.pg-drugie {
  background: var(--white);
  /* Дамп: padding-block 72 - свой, меньший отступ блока, не токен
     --section-y (110). */
  padding-block: 72px;
}

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

.pg-drugie__head {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.pg-drugie__kicker {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--kicker);          /* 12 */
  line-height: 15px;                 /* 12 x 1.21 (метрика Inter) */
  letter-spacing: var(--kicker-ls);  /* 3px */
  text-transform: uppercase;
  color: var(--magenta-text);
}

.pg-drugie__h2 {
  margin: 0;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 38px;
  line-height: 43px;   /* 38 x 1.14 = 43.32, в макете строка 43 */
  letter-spacing: -1.6px;
  color: var(--ink);
}

/* Ширину колонки (416) и раскладку в три даёт .pg-ryad, здесь - только
   зазор ряда (в дампе 40 на десктопе, 26 между карточками в столбик на
   телефоне). */
.pg-drugie__row {
  gap: 40px;
}

.pg-drugie__item {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 20px;
  /* Обводка в макете внутренняя (strokeAlignment: inner) - border добавил
     бы высоту (+2px на карточку, в дампе не было бы), поэтому inset-тень.
     Цвет - чернила 8% альфы, как такая же линия в header.css. */
  box-shadow: inset 0 2px 0 0 #16233D14;
  text-decoration: none;
}

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

.pg-drugie__item-adres {
  display: block;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;   /* 12 x 1.21 (метрика Inter) */
  color: var(--magenta-text);
}

@media (max-width: 860px) {
  .pg-drugie {
    padding-block: 40px;   /* дамп DbtPT, не токен --section-y-m (52) */
  }

  .pg-drugie__row {
    gap: 26px;
  }

  .pg-drugie__kicker {
    font-size: var(--m-kicker);   /* 11 */
    line-height: 13px;            /* 11 x 1.21 */
    letter-spacing: 3px;          /* дамп DbtPT, не токен --m-kicker-ls (2.4) */
  }

  .pg-drugie__h2 {
    font-size: 25px;
    line-height: 28px;   /* 25 x 1.14 = 28.5, по замеру макета строка 28 */
    letter-spacing: -0.9px;
  }

  .pg-drugie__item-h3 {
    font-size: 17px;
    line-height: 22px;   /* 17 x 1.3 = 22.1 */
    letter-spacing: -0.3px;
  }

  .pg-drugie__item-adres {
    font-size: 11px;
    line-height: 13px;   /* 11 x 1.21 */
  }
}