/* typography.css — единая шкала типографики (Блок 3).
   Все размеры и семейства берутся только из var(--font-*) и токенов.

   Шкала заголовков:
     .h1 — крупный hero-заголовок (56px desktop, адаптивный)
     .h2 — заголовок раздела (32px desktop / 22px mobile)
     .h3 — заголовок карточки направления (20px)
     .h4 — заголовок карточки статьи (17px → .lg: 22px)
     .h5 — подзаголовок в темой карточке / футере

   Утилиты:
     .text-body  — основной текст 16-17px, line-height 1.65
     .text-mono  — цифровые/технические данные PT Mono
     .text-titan — мелкий второстепенный текст
     .read-column — колонка чтения 680px
     .lead — вводный абзац, 17-18px */

.h1 {
    font-family: var(--font-head);
    font-weight: 600;
    font-size: clamp(34px, 5vw, 64px);
    line-height: 1.08;
    letter-spacing: 0.01em;
    color: var(--brand-primary);
}

.h2 {
    font-family: var(--font-head);
    font-weight: 600;
    font-size: clamp(24px, 3.2vw, 36px);
    line-height: 1.18;
    letter-spacing: 0.01em;
    color: var(--brand-primary);
}

.h3 {
    font-family: var(--font-head);
    font-weight: 600;
    font-size: 20px;
    line-height: 1.3;
    color: var(--brand-primary);
}

.h4 {
    font-family: var(--font-head);
    font-weight: 600;
    font-size: 17px;
    line-height: 1.38;
    color: var(--brand-primary);
}

.h5 {
    font-family: var(--font-head);
    font-weight: 500;
    font-size: 14px;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* Вводный абзац */
.lead {
    font-family: var(--font-body);
    font-size: 17px;
    line-height: 1.60;
    color: var(--brand-gray);
}

.text-body {
    font-family: var(--font-body);
    font-weight: 400;
    font-size: 17px;
    line-height: 1.65;
    color: var(--brand-gray);
}

.text-mono {
    font-family: var(--font-mono);
    font-weight: 400;
    font-size: 12px;
    letter-spacing: 0.06em;
    color: var(--brand-gray);
    opacity: 0.8;
}

.text-titan {
    font-family: var(--font-body);
    font-weight: 400;
    font-size: 14px;
    color: var(--brand-gray);
    opacity: 0.75;
}

/* Колонка чтения */
.read-column { max-width: 680px; }

/* Адаптив заголовков */
@media (max-width: 640px) {
    .h2 { font-size: 22px; }
    .lead { font-size: 16px; }
}