/* ==========================================================================
   typo-2026.css — единая шкала шрифта на страницах услуг (04.10.2026)
   --------------------------------------------------------------------------
   Жалоба заказчика: на /service/razrabotka-po-s-ii «всё разными размерами».
   Замер показал 13–17 разных кеглей внутри <main> на каждой странице услуг
   (12, 13, 14, 15, 15.5, 16, 16.5, 17, 18, 19, 20, 21, 22, 28, 31, 34, 38,
   42, 44, 48, 60 px): каждый блок (билд Nuxt, наши блоки 2025–2026) задавал
   кегль сам. Здесь шесть уровней — и всё внутри <main> сводится к ним.

     1. мелкий   — крошки, теги-надзаголовки, чипы, метки, даты, подписи полей
     2. H1       — главный заголовок страницы
     3. H2       — заголовки секций (и всё, что играет их роль)
     4. лид      — подпись под заголовком секции, вводный абзац
     5. H3       — заголовки в тексте и в карточках, вопросы FAQ, этапы
     6. текст    — абзацы, описания карточек, ответы FAQ, списки, таблицы
   Кнопки — 16 (интерфейс). Декор (крупные цифры-акценты) не трогаем.

   Подключается ПОСЛЕДНИМ из ранних css: ssr_page.php и page_loader.php,
   рядом с id='w2-early-brand'. ⚠️ brand.css и css блоков подключаются ещё раз
   ниже по документу, поэтому порядок нам не помогает — берём специфичностью:
   #w2main#w2main (два id, 2,0,0) перебивает любые правила с #__nuxt
   (1 id) и инлайновые стили без !important. <main id="w2main"> открывает
   site2023/menu.php, шапка и подвал вне его — их правила не касаются.

   ⚠️ Исключения пишем через :not(:where(...)) — :where() не добавляет
   специфичности, иначе базовое правило перебило бы правила ролей.
   ⚠️ Иконки FontAwesome (<i>) в базовое правило не входят: им ставит
   размер родитель, а сменить семейство шрифта у <i class="fa-…"> нельзя.
   ========================================================================== */

:root{
    --w2-fs-small: 14px;
    --w2-fs-h1:    48px;
    --w2-fs-h2:    32px;
    --w2-fs-lead:  18px;
    --w2-fs-h3:    20px;
    --w2-fs-text:  16px;
    --w2-fs-btn:   16px;

    --w2-lh-h1:   1.15;
    --w2-lh-h2:   1.2;
    --w2-lh-lead: 1.55;
    --w2-lh-h3:   1.3;
    --w2-lh-text: 1.6;

    /* Вес текста и лида. Раньше почти весь текст был Gilroy 600 (полужирный).
       Вернуть прежний вид — поставить тут 600. */
    --w2-fw-text: 400;
}
@media (max-width: 767px){
    :root{
        --w2-fs-small: 13px;
        --w2-fs-h1:    32px;
        --w2-fs-h2:    26px;
        --w2-fs-lead:  16px;
        --w2-fs-h3:    18px;
        --w2-fs-text:  15px;
    }
}

/* ── 0. База: всё текстовое внутри <main> — уровень «текст» ───────────────── */
#w2main#w2main :is(p, li, dd, td, th, span, a, b, strong, em, label, small, figcaption, blockquote, button):not(:where(
    .w2prc__meter, .w2prc__meter *,
    .w2sv-figures__num, .w2sv-figures b,
    .price-section__price strong,
    .w2-talk, .w2-talk *, .w2-cb, .w2-cb *,
    [class*="fa-"], .fa
)){
    font-size: var(--w2-fs-text) !important;
    font-family: var(--w2-font, "Gilroy w2", sans-serif) !important;
}
#w2main#w2main :is(p, li, dd, td){
    line-height: var(--w2-lh-text) !important;
}
#w2main#w2main :is(p, li, dd, td, th):not(:where(.w2-talk, .w2-cb, .w2-cb *)){
    font-weight: var(--w2-fw-text) !important;
}
/* Строчные выделения и ссылки внутри абзаца — в кегль родителя */
#w2main#w2main :is(p, li, dd, td, h1, h2, h3, h4, h5, h6) :is(span, a, b, strong, em, small, i:not([class*="fa-"])):not(:where(
    .w2prc__meter *, .w2sv-figures__item b, .price-section__price strong
)){
    font-size: inherit !important;
    line-height: inherit !important;
}
#w2main#w2main :is(p, li, dd, td) :is(b, strong){ font-weight: 600 !important; }

/* ── Текст: описания карточек, которые свёрстаны div-ами ─────────────────── */
#w2main#w2main :is(
    [class*="__text"], [class*="--text"], [class*="__desc"], [class*="--desc"],
    [class*="-text "], .w2r__fix-text,
    .service-block__item--desc, .w2-note, .w2-card > span,
    .w2crm-integration__item > span, .w2erpopt-integr__item > span,
    .w2ai-custom__note, .w2sed-custom__note, .w2erp-custom__note,
    .w2ai-portfolio__sub-note, .w2crm-industries__note,
    .faq-section__item--answer, .faq-section__note, .faq-section__sub,
    .top-info__list--item, .top-info__item--name,
    .price-section__price, .why-us__item--info, .w2trust__text,
    .w2-post__line, .w2-case__line
):not(:where(.w2prc__meter, .w2prc__meter *, .w2-talk, .w2-cb, .w2-cb *)){
    font-size: var(--w2-fs-text) !important;
    line-height: var(--w2-lh-text) !important;
    font-weight: var(--w2-fw-text) !important;
    font-family: var(--w2-font, "Gilroy w2", sans-serif) !important;
}

/* ── 2. H1 ──────────────────────────────────────────────────────────────── */
#w2main#w2main :is(h1, .section__title--big, .section__title--64){
    font-size: var(--w2-fs-h1) !important;
    line-height: var(--w2-lh-h1) !important;
    font-weight: 600 !important;
    font-family: var(--w2-font, "Gilroy w2", sans-serif) !important;
}

/* ── 3. H2 и заголовки секций ───────────────────────────────────────────── */
#w2main#w2main :is(
    h2, .section__title, .section__title--new,
    .w2guar__title, .w2-cases__title, .w2-posts__title, .w2q__title,
    .w2s__title, .w2trust__title, .w2erpopt-integr__title, .w2erpopt-article__title,
    .w2sv-figures__title, .w2rel__title, .w2sv-sib__title
):not(h1):not(.section__title--big):not(.section__title--64){
    font-size: var(--w2-fs-h2) !important;
    line-height: var(--w2-lh-h2) !important;
    font-weight: 600 !important;
    font-family: var(--w2-font, "Gilroy w2", sans-serif) !important;
}
/* Всё внутри заголовков — в их кегль («100+ компаний» в span.block и т. п.) */
#w2main#w2main :is(h1, h2, h3, h4, .section__title) *:not([class*="fa-"]){
    font-size: inherit !important;
    line-height: inherit !important;
}

/* ── 4. Лид: подпись под заголовком секции ──────────────────────────────── */
#w2main#w2main :is(
    .section__under-title, .section__under-title > p,
    .w2hero__lead, .top-info__lead, .top-info__lead > p,
    .top-block__right > p, .top-block__right > div,
    .w2r__lead, .w2trust__lead, .w2-cases__lead, .w2s__lead, .w2-posts__lead,
    .w2sv-figures__lead, .w2erpopt-integr__sub, .w2q__lead,
    .form-block__description, .clients-trust__info > p,
    .our-services__top--text, .work-section__sub, .why-us__left--bottom > p,
    .price-section__intro, .price-section__intro > p,
    .w2guar__lead, .w2rel__lead, .w2-lead__lead, .w2cl__lead, .w2s__lead
){
    font-size: var(--w2-fs-lead) !important;
    line-height: var(--w2-lh-lead) !important;
    font-weight: var(--w2-fw-text) !important;
    font-family: var(--w2-font, "Gilroy w2", sans-serif) !important;
}

/* ── 5. H3: заголовки в тексте и в карточках ────────────────────────────── */
#w2main#w2main :is(
    h3, h4, h5,
    .w2q__q,
    .working__item--name, .service-block__item--name, .w2prc__title,
    .w2r__title, .faq-section__item--question, .work-section__item--question,
    .w2-case__name, .w2-post__name, .w2-card > b,
    .advantages-section__item--title, .cms-block__item--title, .features__item--name,
    .our-services__item--title, .w2svc-title, .w2ai-services__card-title,
    .price-section__item--title, .price-section__slide--title,
    .service-target__item--title, .service-target__card--title,
    .types__item--title, .steps__item--title, .why-us__item--name,
    .result-diagram__item--text, .top-block__rice,
    .w2ai-case__name, .w2erp-case__name, .w2sed-case__name,
    .w2s__panel-title, .w2trust__name, .w2guar__card > b,
    .w2crm-compare__title, .w2crm-industry__title, .w2crm-tech__group-name,
    .w2crm-integration__item > b, .w2erpopt-integr__item > b,
    .w2erp-sub__name, .w2sed-sub__name, .w2ai-pf__name, .w2ai-kinds__name,
    .w2erp-pf__name, .w2sed-pf__name, .w2crm-work__name,
    .services__card--name, .w2s__card-name, .w2sv-heronav__item > b,
    .w2sv-figures__item span,
    .w2ai-related__title, .w2crm-related__title, .w2erp-related__title,
    .w2erpopt-related__title, .w2sed-related__title,
    [class*="-final__contact"] > a
){
    font-size: var(--w2-fs-h3) !important;
    line-height: var(--w2-lh-h3) !important;
    font-weight: 600 !important;
    font-family: var(--w2-font, "Gilroy w2", sans-serif) !important;
}
#w2main#w2main :is(h3, h4, .w2r__title, .faq-section__item--question, .w2-case__name, .w2-post__name) *:not([class*="fa-"]){
    font-size: inherit !important;
}

/* ── 1. Мелкий: крошки, теги, метки, даты, чипы, подписи полей ──────────── */
#w2main#w2main :is(
    .tag, .section__tag, [class*="__tag"]:not([class*="__tags"]), .navigation-back, .navigation-back a,
    .w2-crumbs, .w2-crumbs *, nav ol, nav ol li, nav ol li *,
    .w2r__num, .w2r__fix-label, .w2prc__step, .w2prc__term,
    dt, th, th *, .w2ai-pf__type, .w2erp-pf__type, .w2erp-pf__year, .w2sed-pf__type, .w2crm-work__year,
    [class*="-final__contact"] > span,
    .w2ai-case__num, .w2erp-case__num, .w2sed-case__num,
    .steps__item--num, .advantages-section__item--number,
    .w2-post__date, .w2-promise, .w2-agree__text, .w2-agree__text a,
    .form__checkbox--text, .form__checkbox--text a, .text-counter,
    .w2q__count, .w2q__hint,
    .w2sv-heroside__title, .w2sv-heronav__item > span,
    .w2hero__cases, .w2hero__cases a, .w2hero__more a, .w2hero__facts span,
    [class*="-related__hint"],
    .w2erp-pf__img--stub span, .w2sed-pf__img--stub span,
    .cms-block__item--list__item, .w2crm-tech__chips span, .w2crm-tech__chips i,
    .w2sv-figures__item i,
    .price-services__end-text, [class*="price__note"]
):not(:where([class*="fa-"])){
    font-size: var(--w2-fs-small) !important;
    line-height: 1.4 !important;
    font-family: var(--w2-font, "Gilroy w2", sans-serif) !important;
}

/* ── Кнопки: 16, это интерфейс ──────────────────────────────────────────── */
#w2main#w2main :is(
    button, .btn, .btn_style, a.btn_style, .w2q-herolink,
    .w2s__tab, .w2sv-tab, .w2q__opt, .w2q__next, .w2q__back
):not(:where(.w2-talk, .w2-cb, .w2-cb *)){
    font-size: var(--w2-fs-btn) !important;
    font-family: var(--w2-font, "Gilroy w2", sans-serif) !important;
}
#w2main#w2main :is(button, .btn, .btn_style, .w2q-herolink) *:not([class*="fa-"]){
    font-size: inherit !important;
}

/* --- Цвет и отступы заголовков секций — единые (04.10.2026) ---
   Замер на ИИ/CRM/hosting: H2 были трёх цветов (#131727, #121212, серый #56566a),
   подписи под ними — шести оттенков серого, а отступ «заголовок → подпись»
   0, 12 или 40 px в зависимости от блока. Первый экран не трогаем. */
#w2main#w2main :is(h2, .section__title):not(:where(.w2hero *, .top-block *, .top-info *, .text-white)){
    color: #131727 !important;
}
#w2main#w2main :is(.section__under-title, [class*="__lead"], .w2ai-portfolio__sub, [class*="-sub--"]):not(:where(.w2hero *, .top-block *, .top-info *, .text-white)){
    color: #56566a !important;
}
#w2main#w2main :is(h2, .section__title):has(+ :is(.section__under-title, [class*="__lead"], .w2ai-portfolio__sub, [class*="-sub--"])){
    margin-bottom: 0 !important;
}
#w2main#w2main :is(h2, .section__title) + :is(.section__under-title, [class*="__lead"], .w2ai-portfolio__sub, [class*="-sub--"]){
    margin-top: 12px !important;
}
#w2main#w2main :is(h2, .section__title):has(+ :is(div, ul, ol, table, form)):not(:where(.w2hero *, .top-block *, .top-info *)){
    margin-bottom: var(--w2-lead-gap, 36px) !important;
}

/* Заголовки блоков перелинковки «Смотрите также» / «По направлениям» — уровень h3 */
#w2main#w2main [class$="-related__title"]{ font-size: var(--w2-fs-h3) !important; line-height: 1.3 !important; font-weight: 600 !important; }

/* Тёмные секции (блок «Преимущества» .features на странице ИС): заголовок и подпись светлые.
   Общее правило выше красит заголовки секций в #131727 — на тёмном фоне его не видно. */
#w2main#w2main .features :is(h2, .section__title, .text-primary_dark){ color: #fff !important; }
#w2main#w2main .features :is(.section__under-title, [class*="__lead"]){ color: rgba(255,255,255,.72) !important; }