/* ═══════════════════════════════════════════════════════════════════════
   Как получить готовый перевод
   ────────────────────────────
   Две колонки: как передать документы и как получить готовый перевод.

   ЭТОТ ФАЙЛ - ДЛЯ ПРАВОК ТОЛЬКО ЭТОГО БЛОКА.

   Заведено 17.08.2026 по решению Павла: «разведи блоки по файлам», чтобы
   над разными блоками можно было работать одновременно и правки не
   затирали друг друга.

   ПРАВИЛА ДЛЯ ТОГО, КТО ПРАВИТ ЭТОТ ФАЙЛ:

   1. Пиши сюда только то, что относится к этому блоку. Общее - карточки,
      тени, ритм между блоками, заголовки разделов - в 00_obshchee.css.
   2. Файл подключается ПОСЛЕ glavnaya.css и guide.css, поэтому перебивает
      их при равной силе селектора. Но эталонные стили (css/etalon/*)
      написаны через [data-h] и [data-b] - против них пиши той же формы
      селектор или сильнее, иначе правило молча проиграет.
   3. Каждой правке - комментарий: что меняем, по чьей команде, и строка
      «Откат: …», чтобы можно было вернуть как было.
   4. Эталонные файлы css/etalon/* не трогать: они заморожены, на них
      ссылается манифест контрольных сумм.
   5. Проверять замером на живой странице, а не на глаз.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 1. Телефон: расстояние после H2 - по общему ритму блока ──────────────

   Диктовка Павла 18.08.2026, пункт 12: «здесь H2, а после H2 не соблюдено
   расстояние».

   Как было устроено. Отступ под заголовком уже равен ритму: правило
   `.galp[data-b] > h2[data-b] { margin-bottom: var(--sp-block) }` из
   glavnaya.css даёт ровно --sp-block. Но первая строка блока начинается не
   сразу: у `.kp-sposob` стоит `padding: 12px 0`, и эти 12px - пустое поле
   без рамки и без фона. Глазом видно расстояние от заголовка до ТЕКСТА, то
   есть --sp-block + 12. Сверху над H2 стоит кнопка «Смотреть все услуги» с
   видимым краем, там ритм честный - отсюда и ощущение перекоса.

   Замер до (375, --sp-block = 50): над H2 - 50, под H2 до коробки блока -
   50, под H2 до первой буквы - 62.
   Замер после: под H2 до первой буквы - 50.

   Число не пишем своё: вычитаем верхнее поле строки из переменной, поэтому
   когда --sp-block станет 35, отступ сам станет 23 + 12 = 35 до текста.

   Сила селектора: идентификатор #gh-3 против `body.mob .galp[data-b] >
   h2[data-b]` - перебивает.

   На компьютере не трогаем: Павел говорил про телефон, и там первая строка
   выровнена по центру своей коробки высотой 96px - пустого поля не видно.

   Откат: удалить правило - вернутся 62px до первой буквы. */
@media (max-width: 760px) {
  body .galp[data-b] > h2#gh-3[data-b] {
    margin-bottom: calc(var(--sp-block) - var(--kp-pole, 12px));
  }
}


/* ── 2-5. Телефон: блок по центру, кегль по плашке «24/7», номера мельче ──

   Диктовка Павла 18.08.2026, пункт 12: «блок не по центру и заголовок
   каждый - тоже не по центру… сделать электронную почту по центру; на
   десктопе у нас слева, здесь делать по центру… на мобильной версии -
   таким же шрифтом, как „24/7“ и „онлайн“. Серые цифры тоже поменьше
   сделаем».

   Образец снят замером с живой страницы (буллеты первого экрана, блок
   .buls.common на 375): номер `.bn` - 16px, начертание 700, по центру;
   подпись `.bt` - 10,8px, начертание 400, по центру.

   Что делаем:
   · заголовок шага - 16px/700 по центру, как `.bn`;
   · пояснение - 10,8px/14,58 по центру, как `.bt`, левый отступ 42px убран
     (он и сдвигал весь блок влево);
   · серый номер и шеврон уходят из потока к краям строки, чтобы заголовок
     стоял ровно посередине, а не «посередине остатка»;
   · номер - 20px вместо 26px: это размер номера плашек на телефоне
     (--fs-num в мобильной шкале), с ним номер перестаёт спорить с
     заголовком.

   Замер до (375): заголовок шага 13,5px/400 слева; пояснение 13,5px/18,225
   слева с отступом 42px; серый номер 26px.
   Замер после (375): заголовок 16px/700 по центру; пояснение
   10,8px/14,58 по центру без отступа; серый номер 20px.

   Поля строки описаны переменной --kp-pole: то же число вычитается из
   отступа под заголовком в разделе 1, и они не разъедутся.

   Откат: удалить раздел 2-5 - вернётся левая раскладка и прежние кегли. */
@media (max-width: 760px) {
  /* верхнее и нижнее поле строки блока. Живёт на body, а не на самом
     блоке: этим же числом раздел 1 укорачивает отступ под заголовком, а
     заголовок блоку не родитель, а сосед - через .kakpoluchit он значение
     не увидел бы. Имя своё, ни с чем в проекте не пересекается. */
  body {
    --kp-pole: 12px;
  }

  /* заголовок шага: по центру, кегль плашки «24/7» */
  body .kakpoluchit .kp-sposob {
    position: relative;
    justify-content: center;
    padding: var(--kp-pole, 12px) 30px;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 700;
    text-align: center;
  }

  /* серый номер - к левому краю строки, мельче прежнего */
  body .kakpoluchit .kp-sposob::before {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
  }

  /* шеврон - к правому краю; это та «галочка», по которой Павел жмёт */
  body .kakpoluchit .kp-sposob::after {
    position: absolute;
    right: 0;
    top: 50%;
    margin-left: 0;
    transform: translateY(-50%);
  }

  /* пояснение: по центру, кегль подписи плашки, без левого отступа */
  body .kakpoluchit .kp-opisanie {
    justify-content: center;
    padding: var(--kp-pole, 12px) 0;
    font-size: 10.8px;
    line-height: 1.35;
    text-align: center;
  }
}


/* ── 6. Компьютер: кегль заголовка шага - по карточкам услуг ──────────────

   Диктовка Павла 18.08.2026, пункт 12: «Сделаем таким же шрифтом, как
   „Паспорта и удостоверения“, „Свидетельства ЗАГС“» - и отдельно: «это
   касается и десктопа».

   Образец снят замером с живой страницы (карточки .card3 в блоке услуг,
   1440): заголовок 16px, начертание 650, интерлиньяж 20,8px (1,3);
   описание 15px/21,75 начертание 400.

   Описание шага уже совпадает с описанием карточки один в один
   (15px/21,75/400) - его не трогаем, цвет остаётся бордовым: про цвет
   Павел ничего не говорил.

   Замер до (1440): заголовок шага 15px/21,75 начертание 400.
   Замер после (1440): 16px/20,8 начертание 650.

   Откат: удалить правило - заголовок вернётся к 15px/400. */
@media (min-width: 761px) {
  body .kakpoluchit .kp-sposob {
    font-size: 16px;
    line-height: 1.3;
    font-weight: 650;
  }
}


/* ── 7. Счётчик шагов - от самого блока ───────────────────────────────────

   Сейчас `counter-reset: sposob` стоит на списке `.kp-sposoby`. Как только
   разметка станет парами (раздел 8), списка не будет и нумерация начнётся
   с нуля. Заводим счётчик на самом блоке: при нынешней разметке ничего не
   меняется (вложенный сброс в списке перекрывает внешний и даёт те же
   1-2-3-4), при новой - нумерация продолжит работать.

   Откат: удалить правило. */
body .kakpoluchit {
  counter-reset: sposob;
}


/* ── 8. Способы получения как раскрывашки: подсветка и раскрытие ──────────

   Диктовка Павла 18.08.2026, пункт 12: «При клике на галочку открывается
   текст „Отправим готовый перевод, бла-бла-бла“ - давай это сделаем, это
   касается и десктопа… Блоки „Электронная почта“, „Курьерская доставка по
   Москве“, „Самовывоз из офиса“, „Почта России“ при наведении
   подсвечиваются и при нажатии раскрываются».

   ЧТО БЫЛО ПРОВЕРЕНО НА ЖИВОЙ СТРАНИЦЕ ДО ПРАВКИ: в этом блоке механики
   раскрытия нет вообще. Замер: `.kakpoluchit .fold` - 0 штук,
   `.kakpoluchit .foldh` - 0, `.kakpoluchit .raskryvashka` - 0, кнопок
   внутри блока - 0. Разметка - два параллельных списка (ol.kp-sposoby и
   ul.kp-opisaniya), способ и его пояснение стоят в разных списках и
   сводятся в пару только сеткой. Одними стилями раскрытие по нажатию не
   делается: нужна кнопка в документе.

   СЦЕНАРИЙ ДОПИСЫВАТЬ НЕ НАДО. Обе нужные функции берут карточки по
   классу `.fold` без списка имён:
     · home/static/js/etalon/interactive.js, «Общий механизм раскрытия» -
       document.querySelectorAll('.fold'): вешает нажатие, ставит
       aria-expanded и hidden, на телефоне держит открытой одну карточку в
       своей сетке;
     · home/static/js/site/glavnaya.js, aktivnye_bloki() -
       document.querySelectorAll('.fold'): вешает .raskryvashka (подсветка
       при наведении), .tykn (подсветка при касании) и нажатие на всю
       строку, а не только на кнопку.
   Значит, достаточно поправки разметки в
   home/templates/home/home_page.html - она описана в отчёте. Признак
   новой разметки - класс `pary` на самом блоке: пока его нет, весь раздел
   8 молчит и старая раскладка работает как работала.

   Что делает раздел:
   · строки становятся парами `.kp-para`, каждая - отдельная коробка, и её
     целиком красит общая подсветка из 00_obshchee.css (раздел 4.4);
   · на компьютере пара внутри себя держит прежние две колонки 44/56 с
     зазором 30px и боковое поле 12px, на которое заходит подсветка;
     18.08 это поле перестало сниматься минусовым полем блока - его берёт
     на себя собственное поле белой плашки, см. раздел 9;
   · кнопка `.foldh` раздета до вида обычной строки списка;
   · свёрнутое пояснение прячется: у `.kp-opisanie` задан display:flex, а
     он перебивает штатное действие атрибута hidden (та же ловушка, что у
     карточек, см. glavnaya.css, комментарий к строке 1724);
   · серый номер и шеврон на подсветке белеют: свой цвет у них прописан
     отдельно, и общее правило «весь текст белый» их не достаёт.

   Откат: удалить раздел 8 и вернуть в шаблоне два списка. */

/* раскладка пар. Минусовые поля -12px убраны 18.08 - см. раздел 9. */
body .kakpoluchit.pary {
  display: block;
}

body .kakpoluchit.pary .kp-para {
  display: grid;
  grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
  column-gap: 30px;
  padding: 0 12px;
  border-radius: 6px;
}

body .kakpoluchit.pary .foldwrap {
  display: flex;
  margin: 0;
  font: inherit;
}

/* Кнопка выглядит как прежняя строка списка.

   Осторожно с весом. На кнопку падает эталонное правило
   `.fold[data-b] .foldh[data-b]` (css/etalon/glavnaya-b.css) весом (0,4,0):
   оно раздевает её до заголовка карточки - свой кегль (--fs-h3), свои
   поля (0), align-items: flex-start, justify-content: space-between,
   border: 0, min-height: 32px. Обычные `body .kakpoluchit.pary .kp-sposob`
   весят (0,3,1) и проигрывают молча. Поэтому строку собираем заново
   селектором с припиской [data-b] - вес (0,4,1).

   Замер до приписки: border-bottom 0px, кегль эталонный. После: 1px
   solid #E0E0EC и кегли из разделов 2-5 и 6. */
body .kakpoluchit.pary .kp-sposob[data-b] {
  flex: 1 1 auto;
  width: 100%;
  align-items: center;
  justify-content: normal;
  gap: 16px;
  min-height: 96px;
  padding: 18px 0;
  background: none;
  border: 0;
  border-bottom: 1px solid #e0e0ec;
  border-radius: 0;
  font-family: inherit;
  font-size: 16px;
  line-height: 1.3;
  font-weight: 650;
  text-align: left;
  color: inherit;
  cursor: pointer;
}

@media (max-width: 760px) {
  body .kakpoluchit.pary .kp-sposob[data-b] {
    position: relative;
    justify-content: center;
    min-height: 0;
    padding: var(--kp-pole, 12px) 30px;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 700;
    text-align: center;
  }
}

body .kakpoluchit.pary .kp-opisanie {
  margin: 0;
}

/* Абзац внутри пояснения берёт кегль у самого пояснения.

   Правка 18.08.2026 после сверки кеглей телефонной версии. В старой
   разметке пояснение было строкой списка, и кегль из раздела 2-5
   (10,8px/14,58 - мелкая строка плашки «24 / 7») стоял прямо на ней. В
   парной разметке текст лежит в абзаце, а у абзаца свой кегль: эталон
   dvizhok.css задаёт `p { font-size: var(--fs-body); line-height:
   var(--lh-body) }`, и он перебивает наследование от родителя. Замер
   показал: коробка `.kp-opisanie` - 10,8px/14,58, а буквы в ней -
   13,5px/18,225.

   Пишем `inherit`, а не число: тогда телефон берёт 10,8/14,58 из раздела
   2-5, компьютер - 15/21,75 из базового правила блока (образец там
   другой - описание карточки «Паспорта и удостоверения»), и одно правило
   закрывает обе ширины.

   Замер до (375): 13,5px / 18,225. После: 10,8px / 14,58.
   Замер до и после (1440): 15px / 21,75 - не меняется.

   Откат: убрать font-size и line-height, оставить margin. */
body .kakpoluchit.pary .kp-opisanie > p {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
}

/* Перечисление внутри пояснения - текст компонента, а не страницы.

   Правка 02.09.2026 по замечанию Павла: «зачем ты делаешь серым шрифтом,
   если у нас в каноне для этого блока красный».

   Описание шага на действующем сайте - перечисление из трёх пунктов, и в
   парную разметку оно переносится списком. Списком же оно попадает под
   СТРАНИЧНОЕ правило текстового блока `body .tp-tekst li` (tehperevod.css,
   раздел 2): оно красит строку серым #3D4247 и ставит свой кегль. Сама
   коробка .kp-opisanie при этом бордовая - поэтому пояснение из абзаца
   выглядело правильно, а из списка серым.

   Канон, раздел 0.2, парный блок шагов: «текст правой колонки наследует
   бордовый цвет общего компонента; страничные правила текстового блока
   не перебивают этот цвет серым».

   Вес здесь (0,4,1) против (0,2,1) у страничного правила - компонент
   выигрывает независимо от порядка подключения файлов.

   Поля списка тоже снимаются: страничное правило даёт `margin: 12px 0`, и
   первая строка пояснения уезжала вниз от названия шага. Просвет между
   пунктами остаётся штатный, 6px.

   Замер до (1440px, «Срочный перевод»): пункт rgb(61,66,71), просвет
   между пунктами 50px. После: rgb(145,26,34) - как у самого пояснения,
   просвет 6px.

   Откат: убрать оба правила - вернётся серый и поля страницы. */
body .kakpoluchit.pary .kp-opisanie ul,
body .kakpoluchit.pary .kp-opisanie ol {
  margin: 0;
}

body .kakpoluchit.pary .kp-opisanie li {
  color: inherit;
  font-size: inherit;
  line-height: inherit;
}

body .kakpoluchit.pary .kp-opisanie[hidden] {
  display: none !important;
}

/* на телефоне пара - просто две строки одна под другой.

   Минусовых полей здесь нет и не было: на телефоне у `.kakpoluchit` стоит
   max-width: 100%, коробка от минусового поля не расширялась, а только
   съезжала влево - замер показывал сдвиг всей строки на 12px, заголовок
   переставал стоять по центру (центр 153,5 при центре колонки 165,5).
   С 18.08 минусовых полей нет и на компьютере - раздел 9. */
@media (max-width: 760px) {
  body .kakpoluchit.pary .kp-para {
    display: block;
  }
}

/* номер и шеврон на подсветке - белые */
@media (hover: hover) and (pointer: fine) {
  body .kakpoluchit.pary .kp-para:hover .kp-sposob::before {
    color: var(--podsvet-tekst, #fff) !important;
  }

  body .kakpoluchit.pary .kp-para:hover .kp-sposob::after {
    background: var(--podsvet-tekst, #fff) !important;
  }
}

body .kakpoluchit.pary .kp-para.tykn .kp-sposob::before {
  color: var(--podsvet-tekst, #fff) !important;
}

body .kakpoluchit.pary .kp-para.tykn .kp-sposob::after {
  background: var(--podsvet-tekst, #fff) !important;
}


/* ── 9. Блок - белая плашка со скруглением, как остальные карточки ────────

   Диктовка Павла 18.08.2026, пункт 29: «сейчас такие вещи, как таблицы
   языков, прозрачная, потому что дальше „как получить готовый перевод“ тоже
   прозрачная - так не должно быть, они должны быть на белом фоне,
   соответственно с закруглёнными полями».

   Что случилось. 18.08 под страницу легла подложка - вращающийся земной шар
   (home/static/css/site/fon_podlozhka.css). Она лежит слоем -1, то есть выше
   белого фона окна и ниже содержимого, и расчёт был на то, что «белые
   плашки, карточки и полосы фактов перекрывают её собой» - так и написано в
   комментарии к подложке. У этого блока своего фона не было никогда: на
   действующем сайте он стоит на белом листе и обходится линиями. С
   подложкой он поплыл - замер показал background-color rgba(0,0,0,0) и на
   1440, и на 375, а на снимке сквозь строки видны материки.

   Образец фона снят замером с живых карточек на этой же странице (1440):
   .card3, .bul, .anketa, тариф и вопрос #faq .q - у всех одно и то же:
   background #fff, border-radius 16px, box-shadow rgba(21,72,137,.08) 0 10px
   20px 0. Тень берём переменной --tenj-bloka (объявлена в glavnaya.css,
   раздел 29.3), чтобы блок менялся вместе с остальными.

   Поле плашки - 12px по бокам, и это ровно то число, которым вчера
   расширялась подсветка. Раньше строка вылезала на 12px ЗА текстовую
   колонку минусовым полем блока; теперь она на 12px заходит ВНУТРЬ плашки.
   Воздух между текстом и краем подсветки тот же самый, но блок перестал
   торчать за колонку.

   Замер до (1440): блок 118…1322 при колонке 130…1310 - на 12px шире
   колонки с каждой стороны, шире заголовка H2, шире карточек услуг и
   вопросов, у всех у которых край ровно 130 и 1310.
   Замер после (1440): блок 130…1310 - край в край с H2, .cards3 и #faq .q.

   ЧТО ЭТО СТОИЛО. Колонки внутри строки сузились: было 506/644, стало
   485/617 (пропорция 44/56 и зазор 30px не тронуты). Иначе никак: колонки
   держали 1180px ровно потому, что у блока не было ни одного бокового поля,
   а плашка без полей - это текст, влипший в край. Если Павел решит, что 21px
   ширины важнее выравнивания по колонке, вернуть 506/644 можно одной
   строкой - см. «Откат» ниже, - но тогда белая плашка снова будет на 12px
   шире всего остального на странице.

   Откат: удалить раздел 9 - вернётся прозрачный блок; чтобы вернуть заодно
   и прежнюю ширину колонок, дописать в раздел 8 к `body .kakpoluchit.pary`
   строки margin-left: -12px и margin-right: -12px. */
body .kakpoluchit.pary {
  padding: 8px 12px;
  background: #fff;
  border-radius: 16px;
  box-shadow: var(--tenj-bloka, 0 10px 20px 0 rgba(21, 72, 137, .08));
}

/* Линия под последней строкой убрана: между строками она разделитель, а под
   последней - черта у самого низа плашки, из-за которой карточка выглядит
   обрезанной. Линии МЕЖДУ строками остаются на месте.

   Строка `.kp-sposob` держит линию правилом с приписью [data-b] весом
   (0,4,1) - здесь вес (0,6,1), перебивает. У `.kp-opisanie` линия приходит
   из glavnaya.css весом (0,1,0), её перебивает любой наш селектор.

   Откат: удалить это правило - линия вернётся. */
body .kakpoluchit.pary .kp-para:last-child .kp-sposob[data-b],
body .kakpoluchit.pary .kp-para:last-child .kp-opisanie {
  border-bottom: 0;
}


/* ── 10. Телефон: воздух по бокам строки и симметрия номер / шеврон ───────

   Диктовка Павла 18.08.2026, пункт 28: «от левого края до единицы и от
   стрелки до правого края разное расстояние. Отодвинь, пожалуйста, от левого
   края и от правого края эти блоки: когда чёрным на белом - нормально
   смотрится, когда наводишь красным, то единица прямо вообще впритык
   располагается, поэтому отодвинуть нужно чуть-чуть».

   Замер подтвердил обе жалобы (375, снимок ×4, чернила считаны по столбцам
   пикселей, отсчёт от края подсвечиваемой строки):
     · слева до чернил цифры - 21,5px у «1» и 19,6px у «2», «3», «4»;
     · справа от чернил шеврона до края - 16,9px.
   Коробки при этом стояли ровно: и номер, и шеврон отбиты от края строки
   ровно на 12px. Разъезжаются не коробки, а чернила. У цифры свой боковой
   пробел внутри буквы (~8px из 26px коробки номера, у единицы ~9,5px), а у
   шеврона внутри его картинки-маски 14×14 пустое поле ~4,9px: путь
   нарисован от 8,5 до 15 по сетке 24, остальное - воздух. Разница
   8 - 4,9 ≈ 3px и есть тот перекос, который Павел увидел.

   Лечим двумя числами:
   · боковое поле строки 12 → 16px. Плюс 12px поля самой плашки (раздел 9) -
     и подсветка теперь начинается не у края экрана, а с отступом, а номер
     отодвинут от края подсветки на 25,5px вместо 21,5px;
   · шеврон сдвинут внутрь на 3px - ровно на разницу пустых полей. Правку
     кладём на шеврон, а не на поле строки: поле сдвинуло бы и заголовок, а
     он должен стоять точно по центру (пункт 12 той же диктовки).

   Замер после (375): слева 25,5 у «1» и 23,7 у «2»-«4», справа 23,9.
   Расхождение в пределах 1,6px - это меньше пробела внутри самой буквы.

   Заголовок остаётся по центру: поле симметричное, центр строки 165,5
   совпадает с центром колонки.

   На компьютере не трогаем: там шеврон стоит не у края плашки, а в конце
   левой колонки (замер: 636 при плашке до 1298), и стыка с краем нет.

   Откат: удалить раздел 10 - вернутся поле 12px и шеврон вплотную. */
@media (max-width: 760px) {
  body .kakpoluchit.pary .kp-para {
    padding: 0 16px;
  }

  body .kakpoluchit.pary .kp-sposob::after {
    right: 3px;
  }
}


/* ── 11. Телефон: полоса блока стоит не по центру ─────────────────────────

   Диктовка Павла 18.08.2026, пункт 28: «получается, что у нас от левого
   края до единицы и от стрелки до правого края разное расстояние».

   Раздел 10 выровнял номер и шеврон ВНУТРИ строки, но сама полоса блока
   стояла криво, и перекос оставался. Замер на 375 до этой правки: белая
   плашка 13 … 59 от краёв окна при ширине 305, тогда как у соседних
   разделов («Преимущества для частных», «Акции») содержимое стоит 35 … 37.

   Причина - общее правило `.galp { padding: 0 22px; margin-inline: -22px }`
   из glavnaya.css. На компьютере отрицательное поле честно расширяет полосу
   галереи. На телефоне ширину полосы задаёт колонка сетки-дорожки, поэтому
   расшириться она не может: минусовое поле просто сдвигает её влево на 22
   точки. Замер родителя это и показал: полоса .galp стоит -9 … 37.

   Тот же дефект и то же лечение - в блоках 05, 06, 08 и 09 (разбор с
   числами: 05_uslugi.css, раздел 05.4). Здесь повторено для своей полосы:
   привязка по aria-labelledby, потому что класс .galp один на все полосы
   галереи, а править надо только эту. gh-3 - «Как получить».

   max-width у заголовка обязателен вместе с отрицательным полем: в
   dvizhok.css стоит страховка `body.mob .wrap * { max-width: 100% }`, и без
   её отмены заголовок от минусового поля только сдвигается влево, а не
   расширяется.

   Откат: удалить раздел 11 - полоса снова уедет влево на 22 точки. */
body.mob .galp[data-b][aria-labelledby="gh-3"] {
  margin-inline: 0;
}

body.mob .galp[data-b][aria-labelledby="gh-3"] > h2[data-b] {
  margin-inline: -22px;
  max-width: none;
}


/* ═══════════════════════════════════════════════════════════════════════
   Правка 19.08.2026: отбивка под H2 вернулась к общему ритму
   ───────────────────────────────────────────────────────────────────────
   Раздел 1 этого файла вычитал из отбивки 12 точек - пустое верхнее поле
   строки `.kp-sposob`. Тогда это было верно: под заголовком начинался
   голый текст без рамки и фона, и глаз мерил расстояние до первой буквы.

   С тех пор разметка сменилась: пары «способ - описание» собраны в белую
   карточку .kakpoluchit.pary с тенью (раздел 8 этого файла). Теперь под
   заголовком стоит видимый белый край, и по правилу Павла от 19.08.2026
   расстояние меряется до него: «до верхней границы следующего видимого
   элемента».

   Замер до (375): от H2 «Как получить готовый перевод» до белого края
   карточки 23 при положенных 35. Замер после: 35.

   Компьютера правка не касается: там вычитания и не было.

   Откат: вернуть строку `margin-bottom: calc(var(--sp-block) -
   var(--kp-pole, 12px))` в разделе 1 - вернутся 23 точки.
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 760px) {
  body .galp[data-b] > h2#gh-3[data-b] {
    margin-bottom: var(--sp-block);
  }
}


/* ── Кегль 13: как получить готовый перевод (диктовка Павла 20.08.2026) ───

   Правка из книги замера «ШРИФТЫ_МОБИЛЬНЫЕ применить на стр. О компании»:
   описание способа получения. Было 10,8px, стало 13px.
   Число кегля - переменная --kegl-melkij, задана в
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\bloki\00_obshchee.css

   Размер тут приходил наследованием: у абзаца в разделе выше по файлу
   стоит `font-size: inherit`, а 10,8px задавала коробка .kp-opisanie.
   Ставим кегль самому абзацу - вес (0,4,2) против (0,3,2) у правила с
   inherit, файл тот же, правило ниже. !important не нужен.

   Выключку по центру Павел здесь не правил: центруются карточки галереи
   (.card3), а пара «способ - описание» карточкой не является.

   Откат: удалить раздел - описание вернётся к 10,8px.
   ─────────────────────────────────────────────────────────────────────── */
body.mob .kakpoluchit.pary .kp-para .kp-opisanie > p {
  font-size: var(--kegl-melkij);
}


/* ── Пункт 3 мобильного задания 09.09.2026: список в раскрытом шаге - ──
      по левому краю вместе с маркерами

   Дословно: «если раскрывающийся текст оформлен маркированным или
   нумерованным списком, выровнять по левому краю весь список вместе с
   маркерами или номерами. Нельзя оставлять маркеры слева, а текст
   пунктов располагать по центру». И там же: «менять только
   раскрывающийся список; заголовки шагов, цифры 1, 2, 3 и видимую часть
   до раскрытия сохранять в существующем оформлении; обычный
   раскрывающийся текст без списка под это требование не подпадает».

   Замер стенда 09.09.2026 («Нотариальный перевод», шаг «Направить нам
   заявку…»): пояснение и список внутри - text-align: center, маркеры
   снаружи с отступом 22 точки. Отсюда и жалоба: маркеры слева, строки
   по центру.

   ПОЧЕМУ СПИСОК СТРАНИЦ, А НЕ ОДИН КЛАСС. Компонент `.kakpoluchit`
   стоит на многих страницах сайта, а Павел в том же задании (общее
   требование 9) прямо запретил менять неотмеченные блоки: «на других
   страницах такие блоки ни в коем случае не менять, иначе у нас будет
   бесконечная приёмка». Поэтому правило адресовано ровно тем
   двенадцати страницам, которые названы в постраничных задачах 2, 6, 7,
   8, 9, 10, 11, 12, 13, 23 и 24.

   Ширина 100 % нужна, чтобы список перестал зависеть от
   `justify-content: center` у пояснения: как блок он занимает всю
   ширину, а строки внутри выключены влево.

   Откат: удалить раздел - списки снова встанут по центру. */
@media (max-width: 760px) {
  body.stranica-notarialnyj-perevod .kakpoluchit .kp-opisanie ul,
  body.stranica-notarialnyj-perevod .kakpoluchit .kp-opisanie ol,
  body.stranica-notarialnyj-perevod-doverennosti .kakpoluchit .kp-opisanie ul,
  body.stranica-notarialnyj-perevod-doverennosti .kakpoluchit .kp-opisanie ol,
  body.stranica-perevod-lichnyh-dokumentov .kakpoluchit .kp-opisanie ul,
  body.stranica-perevod-lichnyh-dokumentov .kakpoluchit .kp-opisanie ol,
  body.stranica-perevod-diploma .kakpoluchit .kp-opisanie ul,
  body.stranica-perevod-diploma .kakpoluchit .kp-opisanie ol,
  body.stranica-perevod-spravok .kakpoluchit .kp-opisanie ul,
  body.stranica-perevod-spravok .kakpoluchit .kp-opisanie ol,
  body.stranica-perevod-pasporta .kakpoluchit .kp-opisanie ul,
  body.stranica-perevod-pasporta .kakpoluchit .kp-opisanie ol,
  body.stranica-perevod-diploma-na-nemetskiy .kakpoluchit .kp-opisanie ul,
  body.stranica-perevod-diploma-na-nemetskiy .kakpoluchit .kp-opisanie ol,
  body.stranica-perevod-documentov-na-nemetskii .kakpoluchit .kp-opisanie ul,
  body.stranica-perevod-documentov-na-nemetskii .kakpoluchit .kp-opisanie ol,
  body.stranica-perevod-svidetelstva-o-rozdenii .kakpoluchit .kp-opisanie ul,
  body.stranica-perevod-svidetelstva-o-rozdenii .kakpoluchit .kp-opisanie ol,
  body.stranica-perevod-ukrainskogo-diploma .kakpoluchit .kp-opisanie ul,
  body.stranica-perevod-ukrainskogo-diploma .kakpoluchit .kp-opisanie ol,
  body.stranica-srochnyj-perevod .kakpoluchit .kp-opisanie ul,
  body.stranica-srochnyj-perevod .kakpoluchit .kp-opisanie ol,
  body.stranica-perevod-nositelem-yazyka .kakpoluchit .kp-opisanie ul,
  body.stranica-perevod-nositelem-yazyka .kakpoluchit .kp-opisanie ol {
    width: 100%;
    margin: 0;
    padding-left: 20px;
    text-align: left;
  }

  body.stranica-notarialnyj-perevod .kakpoluchit .kp-opisanie li,
  body.stranica-notarialnyj-perevod-doverennosti .kakpoluchit .kp-opisanie li,
  body.stranica-perevod-lichnyh-dokumentov .kakpoluchit .kp-opisanie li,
  body.stranica-perevod-diploma .kakpoluchit .kp-opisanie li,
  body.stranica-perevod-spravok .kakpoluchit .kp-opisanie li,
  body.stranica-perevod-pasporta .kakpoluchit .kp-opisanie li,
  body.stranica-perevod-diploma-na-nemetskiy .kakpoluchit .kp-opisanie li,
  body.stranica-perevod-documentov-na-nemetskii .kakpoluchit .kp-opisanie li,
  body.stranica-perevod-svidetelstva-o-rozdenii .kakpoluchit .kp-opisanie li,
  body.stranica-perevod-ukrainskogo-diploma .kakpoluchit .kp-opisanie li,
  body.stranica-srochnyj-perevod .kakpoluchit .kp-opisanie li,
  body.stranica-perevod-nositelem-yazyka .kakpoluchit .kp-opisanie li {
    text-align: left;
  }
}