/* BLS — общий CSS для типовых лендинговых подстраниц услуг: и «Стратегических
   решений» (Внедрение кадрового ЭДО, Управление дистанционными сотрудниками),
   и «Аутсорсинга» (Расчёт заработной платы, ...) — разные разделы верхнего
   меню, но один и тот же мокап-шаблон. Все такие мокапы
   (docs/html-templates/BLS <название> - офлайн.html) используют одну и ту же
   вёрстку/CSS — отличается только контент, который зашит отдельно в
   parts/<slug-страницы>/*.php для каждой страницы.
   Классы .bls-eyebrow / .bls-section-title / .bls-underline / .bls-btn --
   общие с главной, см. bls-home.css. Секция «Контакты» переиспользует
   .bls-about-contacts со страницы «О компании» без своих стилей.

   ── «v2»-волна мокапов (docs/html-templates/new/, 2026-08-11) ──────────────
   Тот же самый CSS (сверено байт-в-байт по всем 15 файлам папки new/), но
   секция PROCESS вместо текстового блока гарантии (.bls-svc-guarantee)
   использует блок-кейс из практики в 3 колонки («Задача клиента / Действие
   BLS / Результат для клиента») — заведён отдельным классом .bls-svc-casestudy
   (см. ниже), .bls-svc-guarantee не трогаем — старые страницы им ещё пользуются.
   Количество карточек в .bls-svc-cases__grid тоже стало плавающим (2/3/4) —
   модификаторы --cols-2/--cols-3, дефолт остался 4. */

.bls-svc-hero, .bls-svc-law, .bls-svc-cases, .bls-svc-hr, .bls-svc-opp,
.bls-svc-project, .bls-svc-why, .bls-svc-quote, .bls-svc-intro {
    font-family: 'Golos Text', system-ui, sans-serif;
}

/* Плавный скролл к якорям саб-меню + отступ под залипающий хедер */
html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 88px; }

/* ── Hero ─────────────────────────────────────────────────────────── */
.bls-svc-hero { border-bottom: 1px solid #e6e4e0; }
.bls-svc-hero__inner { max-width: 1240px; margin: 0 auto; padding: 60px 32px 0; }
.bls-svc-hero__crumbs { font-size: 12px; color: #a29a92; letter-spacing: .04em; margin-bottom: 26px; }
.bls-svc-hero__crumbs a { color: #a29a92; }
.bls-svc-hero__badge { display: inline-block; margin: 0 0 20px; padding: 7px 15px; border: 1px solid #d8cfc8; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #6b5d54; }
.bls-svc-hero__title { font-size: 50px; line-height: 1.08; font-weight: 800; letter-spacing: -.01em; margin: 0 0 24px; color: #1a1512; text-wrap: balance; max-width: 860px; }
.bls-svc-hero__lead { font-size: 18px; line-height: 1.55; color: #4a4a4a; margin: 0 0 34px; max-width: 700px; text-wrap: pretty; }
.bls-svc-hero__cta { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 44px; }
.bls-svc-btn-ghost { display: inline-block; border: 1px solid #d8cfc8; color: #2a2320; padding: 15px 30px; font-size: 15px; font-weight: 700; }
.bls-svc-btn-ghost:hover { border-color: #3e1109; color: #3e1109; }
.bls-svc-hero__subnav { display: flex; gap: 4px; flex-wrap: wrap; border-top: 1px solid #eee; }
.bls-svc-hero__subnav a { padding: 18px 20px 18px 0; margin-right: 8px; font-size: 14px; font-weight: 600; color: #2a2320; border-bottom: 2px solid transparent; }
.bls-svc-hero__subnav a:hover { color: #3e1109; border-bottom-color: #3e1109; }

/* Пара ключевых цифр в hero (docs/html-templates/new3/
   BLS Юридические консультации - офлайн.html) — второй lead-абзац помельче
   плюс 2 числа рядом с подписью, перед CTA. */
.bls-svc-hero__lead--sub { font-size: 16px; color: #6b5d54; max-width: 660px; margin-top: -14px; }
.bls-svc-hero__stats { display: flex; gap: 48px; flex-wrap: wrap; margin: 0 0 36px; }
.bls-svc-hero__stat-num { font-size: 44px; font-weight: 800; color: #eb732d; line-height: 1; letter-spacing: -.02em; }
.bls-svc-hero__stat-lbl { font-size: 14px; color: #5a5a5a; margin-top: 10px; max-width: 260px; line-height: 1.5; }

/* ── Цитата ───────────────────────────────────────────────────────── */
.bls-svc-quote { padding: 84px 0; }
.bls-svc-quote__wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.bls-svc-quote__box { background: #271b19; color: #e8e0da; padding: 56px 60px; display: grid; grid-template-columns: auto 1fr; gap: 34px; align-items: start; }
.bls-svc-quote__mark { font: 800 72px/.7 Georgia, serif; color: #c3a55f; }
.bls-svc-quote blockquote { margin: 0; font-size: 24px; line-height: 1.5; color: #fff; font-style: italic; text-wrap: pretty; }
.bls-svc-quote__who { margin-top: 22px; }
.bls-svc-quote__who b { display: block; font-size: 16px; font-weight: 800; color: #fff; }
.bls-svc-quote__who span { font-size: 14px; color: #b7ada6; }

/* ── Вводный блок: заголовок + один крупный абзац, без сетки ──────────
   (docs/html-templates/new3/BLS Юридические консультации - офлайн.html,
   секция #problem) — короче .bls-svc-law__lead, крупнее и без карточек. */
.bls-svc-intro { padding: 84px 0; }
.bls-svc-intro__wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.bls-svc-intro__title { max-width: 920px; }
.bls-svc-intro__lead { font-size: 19px; line-height: 1.6; color: #3a3a3a; margin: 0; max-width: 860px; text-wrap: pretty; }

/* ── Контекст / нормативная база (2 карточки) ─────────────────────── */
.bls-svc-law { padding: 84px 0; }
.bls-svc-law__wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.bls-svc-law__lead { font-size: 16px; line-height: 1.6; color: #6a6a6a; margin: 0 0 50px; max-width: 640px; text-wrap: pretty; }
.bls-svc-law__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.bls-svc-law__card { background: #f4f4f2; padding: 40px; border-top: 4px solid #eb732d; }
.bls-svc-law__head { display: flex; align-items: baseline; gap: 16px; margin-bottom: 6px; }
.bls-svc-law__yr { font-size: 46px; font-weight: 800; color: #1a1512; letter-spacing: -.02em; line-height: 1; }
.bls-svc-law__code { font-size: 16px; font-weight: 800; color: #eb732d; }
.bls-svc-law__status { font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #a29a92; margin: 0 0 18px; }
.bls-svc-law__txt { font-size: 16px; line-height: 1.6; color: #2a2320; margin: 0; text-wrap: pretty; }

/* ── Карточки-преимущества (4 в ряд) ──────────────────────────────── */
.bls-svc-cases { background: #f4f4f2; padding: 84px 0; }
.bls-svc-cases__wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.bls-svc-cases__lead { font-size: 16px; line-height: 1.6; color: #6a6a6a; margin: 0 0 50px; max-width: 640px; text-wrap: pretty; }
.bls-svc-cases__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.bls-svc-cases__grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.bls-svc-cases__grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
.bls-svc-cases__card { background: #fff; padding: 32px 30px; display: flex; flex-direction: column; }
.bls-svc-cases__tag { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #eb732d; margin-bottom: 14px; }
.bls-svc-cases__card h3 { font-size: 20px; font-weight: 800; color: #1a1512; margin: 0 0 14px; line-height: 1.25; text-wrap: balance; }
.bls-svc-cases__card p { font-size: 14px; line-height: 1.6; color: #5a5a5a; margin: 0; text-wrap: pretty; }

/* ── Нумерованные строки (шаги/состав сервиса) ────────────────────── */
.bls-svc-hr { padding: 84px 0; }
.bls-svc-hr__wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.bls-svc-hr__row { display: grid; grid-template-columns: 120px 1fr; gap: 40px; padding: 40px 0; border-top: 1px solid #e6e2dc; align-items: start; }
/* Модификатор: секция без своего lead-txt — первая строка сразу под заголовком, без верхней границы/отступа */
.bls-svc-hr__list--flush .bls-svc-hr__row:first-child { border-top: none; padding-top: 0; }
.bls-svc-hr__n { font-size: 64px; font-weight: 800; color: #e2ddd6; line-height: .9; letter-spacing: -.02em; }
.bls-svc-hr__row h3 { font-size: 22px; font-weight: 800; color: #1a1512; margin: 0 0 16px; }
.bls-svc-hr__row p { font-size: 16px; line-height: 1.65; color: #3a3a3a; margin: 0; text-wrap: pretty; }

/* ── Карточки с левым бордером (3 в ряд) ──────────────────────────── */
.bls-svc-opp { background: #f4f4f2; padding: 84px 0; }
.bls-svc-opp__wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.bls-svc-opp__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.bls-svc-opp__card { background: #fff; padding: 34px 32px; border-left: 3px solid #3e1109; }
.bls-svc-opp__n { display: block; font-size: 22px; font-weight: 800; color: #d8cfc8; margin-bottom: 16px; }
.bls-svc-opp__card h3 { font-size: 20px; font-weight: 800; color: #1a1512; margin: 0 0 14px; }
.bls-svc-opp__card p { font-size: 15px; line-height: 1.6; color: #5a5a5a; margin: 0; text-wrap: pretty; }
.bls-svc-opp__more { display: inline-block; margin-top: 16px; font-size: 14px; font-weight: 700; color: #3e1109; }
.bls-svc-opp__more:hover { color: #eb732d; }

/* ── Этапы работы + блок гарантии ─────────────────────────────────── */
.bls-svc-project { padding: 84px 0; }
.bls-svc-project__wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.bls-svc-project__lead { font-size: 16px; line-height: 1.6; color: #6a6a6a; margin: 0 0 50px; max-width: 640px; text-wrap: pretty; }
.bls-svc-project__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
/* v2-мокапы: 2 колонки даже когда шагов больше двух — лишние просто
   переносятся на следующую строку (так и в самих мокапах, см. docs/html-templates/new/) */
.bls-svc-project__grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.bls-svc-project__card { border: 1px solid #e6e2dc; padding: 34px 30px 38px; display: flex; flex-direction: column; }
.bls-svc-project__n { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; background: #271b19; color: #fff; font-size: 18px; font-weight: 800; margin-bottom: 24px; }
.bls-svc-project__card h3 { font-size: 18px; font-weight: 800; color: #1a1512; margin: 0 0 14px; line-height: 1.3; text-wrap: balance; }
.bls-svc-project__card p { font-size: 14px; line-height: 1.6; color: #5a5a5a; margin: 0; text-wrap: pretty; }
.bls-svc-guarantee { margin-top: 34px; background: #271b19; color: #e8e0da; padding: 46px 48px; display: grid; grid-template-columns: 1fr 1.15fr; gap: 48px; align-items: center; }
.bls-svc-guarantee h3 { font-size: 26px; font-weight: 800; color: #fff; margin: 0; line-height: 1.2; }
.bls-svc-guarantee__lbl { font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: #eb732d; margin: 0 0 14px; }
.bls-svc-guarantee__sub { font-size: 16px; line-height: 1.65; color: #b7ada6; margin: 0; text-wrap: pretty; }

/* ── Кейс из практики (3 колонки: Задача / Действие BLS / Результат) ─────
   v2-мокапы (docs/html-templates/new/): та же тёмная плашка, что и у
   .bls-svc-guarantee, но 3 равные колонки вместо 2 разных и без крупного
   заголовка — только лейбл + текст в каждой. */
.bls-svc-casestudy { margin-top: 34px; background: #271b19; color: #e8e0da; padding: 46px 48px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; align-items: start; }
.bls-svc-casestudy__lbl { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #eb732d; margin: 0 0 12px; }
.bls-svc-casestudy__text { font-size: 14px; line-height: 1.6; color: #b7ada6; margin: 0; text-wrap: pretty; }

/* ── Почему BLS ───────────────────────────────────────────────────── */
.bls-svc-why { background: #f4f4f2; padding: 84px 0; }
.bls-svc-why__wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.bls-svc-why__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.bls-svc-why__card { background: #fff; padding: 36px 32px; text-align: center; }
.bls-svc-why__num { font-size: 40px; font-weight: 800; color: #eb732d; letter-spacing: -.02em; line-height: 1; }
.bls-svc-why__lbl { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #1a1512; margin: 12px 0 10px; }
.bls-svc-why__card p { font-size: 14px; line-height: 1.55; color: #7a7a7a; margin: 0; text-wrap: pretty; }

@media (max-width: 900px) {
    .bls-svc-law__grid, .bls-svc-cases__grid, .bls-svc-opp__grid,
    .bls-svc-project__grid, .bls-svc-why__grid, .bls-svc-guarantee,
    .bls-svc-casestudy { grid-template-columns: 1fr; }
    .bls-svc-hr__row { grid-template-columns: 64px 1fr; gap: 22px; }
    .bls-svc-hr__n { font-size: 44px; }
    .bls-svc-hero__title { font-size: 38px; }
    .bls-svc-quote__box { grid-template-columns: 1fr; gap: 12px; padding: 40px 28px; }
}