/* ═══════════════════════════════════════════════════════════════════════
   Шапка сайта
   ───────────
   Логотип, подпись, адрес и часы, телефон и почта, значки мессенджеров, меню и быстрые ссылки. Живёт на всех страницах.

   ЭТОТ ФАЙЛ - ДЛЯ ПРАВОК ТОЛЬКО ЭТОГО БЛОКА.

   Заведено 17.08.2026 по решению Павла: «разведи блоки по файлам», чтобы
   над разными блоками можно было работать одновременно и правки не
   затирали друг друга.

   ПРАВИЛА ДЛЯ ТОГО, КТО ПРАВИТ ЭТОТ ФАЙЛ:

   1. Пиши сюда только то, что относится к этому блоку. Общее - карточки,
      тени, ритм между блоками, заголовки разделов - в 00_obshchee.css.
   2. Файл подключается ПОСЛЕ glavnaya.css и guide.css, поэтому перебивает
      их при равной силе селектора. Но эталонные стили (css/etalon/*)
      написаны через [data-h] и [data-b] - против них пиши той же формы
      селектор или сильнее, иначе правило молча проиграет.
   3. Каждой правке - комментарий: что меняем, по чьей команде, и строка
      «Откат: …», чтобы можно было вернуть как было.
   4. Эталонные файлы css/etalon/* не трогать: они заморожены, на них
      ссылается манифест контрольных сумм.
   5. Проверять замером на живой странице, а не на глаз.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── С1. Строка 1 шапки: перенесено из glavnaya.css (правка 21.08.2026) ───

   ЧТО ПЕРЕНЕСЕНО. Три правила вида строки 1 (раздел 22 «Логотип в шапке»
   файла css/site/glavnaya.css) и правило, прячущее строку 1 на телефоне
   (раздел 4 того же файла).

   ЗАЧЕМ. glavnaya.css подключает ТОЛЬКО шаблон главной и её копий. Пока
   строка 1 жила в шаблоне главной, это было незаметно. С 21.08.2026 обе
   строки шапки выводит общий файл
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\pilotsite\templates\parts\shapka.html
   и шапка есть у КАЖДОГО типа страниц - а оформление строки 1 оставалось
   в файле главной. Цена, услуга, блог, вакансия, юридическая страница и
   404 получали бы строку 1 в эталонном виде: с переносом, чужим зазором и
   без размера логотипа, а на телефоне она не пряталась бы вовсе и лезла бы
   за край экрана. Шапка общая - значит и её оформление живёт в файле
   шапки, подключённом в base.html.

   ПОЧЕМУ ПРИСТАВКА «body» У ПЕРВОГО ПРАВИЛА. Этот файл подключён ДО
   css/etalon/glavnaya-a.css, где то же .sitehead[data-h] задаёт flex-wrap,
   gap, border-bottom, padding-bottom и margin-bottom. При равной силе
   селектора выигрывает тот, кто позже, - то есть эталон. Приставка «body»
   добавляет вес и возвращает победу нашему правилу, как это было в
   glavnaya.css (см. правило 2 в шапке файла). У двух других правил
   соперника в эталоне нет, приставка им не нужна - и добавлять её нельзя:
   `body .sitehead .sitelogo { margin-right: 0 }` из shapka.css (раздел
   30.2) обязан остаться сильнее, иначе логотип снова растянет строку
   резинкой и зазоры перестанут быть равными.

   Откат: вернуть эти правила в css/site/glavnaya.css - разделы 22 и 4, -
   сняв приставку «body», и удалить раздел С1 отсюда. Строка 1 снова
   останется без оформления на всех страницах, кроме главной и её копий. */

body .sitehead[data-h] {
  align-items: center;
  flex-wrap: nowrap;
  gap: .2rem 12px;
  border-bottom: 1px solid var(--line, #d9dbde);
  padding: 8px 0;
  margin-bottom: 0;
}

.sitehead .sitelogo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: auto;
  color: var(--ink, #1b1b1b);
  font-size: 17px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

/* На окнах уже 940 строке 1 разрешён перенос - переехало сюда
   21.08.2026 из css/site/shapka.css, пункт 30.6а, дословно.

   ПОЧЕМУ ПЕРЕЕХАЛО ВМЕСТЕ С ПРАВИЛОМ ВЫШЕ. Оба правила -
   `body .sitehead[data-h]`, сила одинаковая, и побеждает тот, что
   идёт позже. Разнеси их по двум файлам - и на окнах 761-940
   строка 1 перестанет переноситься и полезет за край колонки
   (замер в пункте 30.6а: на 768 переполнение 193,9 точки). */
/* Ступень сдвинута 940 -> 965 при переводе сайта на Inter (24.08.2026).

   Порог 940 был замерен системным шрифтом (см. shapka.css, пункт 30.6а).
   Inter шире, и контакты в строке 1 перестают влезать раньше. Замер на
   /ceny/, вылет правого края за коробку строки, в точках:

     ширина    системный    Inter до правки    Inter после правки
       970         0               0                 0 (одна раскладка)
       965         0               0                 0
       960         0             1,9                 0 (перенос)
       950         0            11,9                 0 (перенос)
       941         0            20,9                 0 (перенос)
       940      перенос        перенос               перенос

   Вылет прятал обрез «.device» (overflow-x: clip) - у строки тихо резался
   телефон с почтой. Прятать контакты под обрез нельзя (правило Павла,
   пункт 30.6а).

   Откат: вернуть 965px на 940px. */
@media (max-width: 965px) {
  body .sitehead[data-h] {
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 8px;
  }
}

/* Размер знака в строке 1 задаёт shapka.css (диктовка 17: 80px, до предела
   строки). Здесь только поведение картинки - высоту НЕ ставить: этот файл
   грузится позже shapka.css и молча перебивал её (логотип-«песюлька»). */
.sitehead .sitelogo .znak {
  display: block;
  width: auto;
  background: none;
}

/* Строка 1 на телефоне не показывается: там своя шапка .apphead, а адрес и
   часы стоят в ней. Перенесено из glavnaya.css, раздел 4, дословно.
   Правило одно на весь сайт: на телефоне пять блоков строки 1 в ряд
   (логотип, подпись, адрес, значки, телефон) не помещаются ни при какой
   ширине - строка полезла бы за край экрана на каждой странице. */
@media (max-width: 760px) {
  .sitehead {
    /* важность нужна: критический CSS в шапке документа задаёт .sitehead
       display:flex без условий, и без !important правило не перебивается
       стабильно во всех браузерах */
    display: none !important;
  }
}


/* ── Т0. Шапка телефона: основа. Перенесено из glavnaya.css 21.08.2026 ────

   ЧТО ПЕРЕНЕСЕНО. Все правила мобильной шапки .apphead из файла
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\glavnaya.css
   разделы 4 («Шапка на телефоне»), 5 («Липкие шапка и панель действий»,
   только часть про шапку), 11 («Шапка телефона, вторая редакция»),
   22 («Логотип в шапке», часть про .apphead), 24 («Логотип ровно
   посередине») и 25.3 («Шапка телефона, редакция диктовки 14»).
   Текст правил перенесён ДОСЛОВНО, ни одного числа не изменено.

   ЗАЧЕМ. glavnaya.css подключает только шаблон главной и её копий
   («О компании», «Контакты», «Отзывы и проекты», «Сертификаты»). Разметку
   мобильной шапки с 21.08.2026 выводит общий файл parts/shapka.html - она
   есть на каждой странице, - а всё её оформление оставалось в файле
   главной. На цене, услуге, блоге, вакансии, юридической странице, на
   калькуляторе и на 404 мобильной шапки не было вовсе: элемент .apphead
   в разметку приходил, но лежал скрытым (эталонное правило
   `.mobonly[data-h]{display:none}`), и вместо компактной полосы с бургером
   телефон показывал развёрнутое меню разделов во всю высоту экрана.
   Замер до правки на ширине 375: у главной .apphead 49,98 точки и меню 0,
   у страницы цен .apphead 0 и меню 346,95.

   Вторая половина той же правки - сценарий js/etalon/auto_mob.js, который
   ставит на тело документа класс «mob». Он подключался тоже только
   шаблоном главной; теперь стоит в общей обвязке
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\pilotsite\templates\base.html
   Без него класса «mob» на внутренних страницах не появлялось, и одни
   стили телефона работали, а другие - нет.

   ЧТО НЕ ПЕРЕНЕСЕНО И ПОЧЕМУ. Нижняя панель действий (.bottombar) из
   раздела 5 и `body { padding-bottom: 64px }` при ней остались в
   glavnaya.css: разметка .bottombar лежит в шаблоне главной, на других
   страницах её нет вовсе, а роль «связь под рукой» на всём сайте играет
   плавающая панель .psvyaz (css/site/panel_svyazi.css, подключена в
   base.html и потому общая уже сейчас).

   ПОЧЕМУ СЕЛЕКТОРЫ ОСТАВЛЕНЫ КАК БЫЛИ, БЕЗ ПРИСТАВКИ «body». Этот файл
   подключён РАНЬШЕ эталона и раньше glavnaya.css, поэтому при равной силе
   селектора он теперь проигрывает - и это ровно то, что нужно:
     · эталонные `.apphead[data-h]` (сила 0,2,0) и
       `.apphead[data-h] .logo[data-h]` (0,4,0) и до переноса были сильнее
       здешних `.apphead` (0,1,0) и `.apphead .logo` (0,2,0) - расстановка
       сил не изменилась ни на одном свойстве;
     · приставка «body» здесь НЕ ПОМОГЛА БЫ, и добавлять её нельзя:
       `body .apphead` - это (0,1,1), классов у него по-прежнему один
       против двух у `.apphead[data-h]`, а счёт идёт по классам раньше, чем
       по тегам. Зато против правил РАВНОЙ силы приставка дала бы нашему
       правилу победу, которой у него раньше не было, - и вид принятой
       главной изменился бы;
     · раздел Т1 ниже написан как `body .apphead[data-h]` (0,2,1) и
       `body .apphead .logo` (0,2,1) - он сильнее и продолжает перебивать
       эти правила, как перебивал их, пока они лежали в glavnaya.css.
   Проверено поиском: файлов, где вообще встречается .apphead, в проекте
   два - замороженный etalon/glavnaya-a.css и этот; ни 00_obshchee.css, ни
   оформление отдельных страниц (perenesyonnaya.css, blog.css, usluga.css,
   calculator_page.css, stranica_404.css) к .apphead не обращаются.

   ПОРЯДОК ВНУТРИ РАЗДЕЛА МЕНЯТЬ НЕЛЬЗЯ - он повторяет порядок этих правил
   в glavnaya.css (4 → 5 → 11 → 22 → 24 → 25.3). Правила спорят между собой
   при равной силе, и решает тот, что стоит позже: положение и размер
   логотипа задают друг за другом разделы 4, 11, 22, 24 и 25.3 - переставь
   их, и логотип уедет.

   ВЕСЬ РАЗДЕЛ Т0 ОБЯЗАН СТОЯТЬ ВЫШЕ РАЗДЕЛА Т1. У части правил Т1 сила
   такая же, и побеждает тот, что ниже. Поставь Т0 после Т1 - Т1 перестанет
   работать, и вернётся шапка 66 точек с корзиной слева.

   Откат: вернуть эти правила в glavnaya.css на прежние места (разделы 4,
   5, 11, 22, 24, 25.3), удалить раздел Т0 отсюда и снять подключение
   auto_mob.js из base.html. Мобильная шапка снова останется только у
   главной и её копий. */

/* Т0.1 = раздел 4 файла glavnaya.css, дословно.

   Диктовка Павла 13.08.2026: на телефоне шапка другая - кнопок минимум.
   Слева логотип, рядом компактно адрес и часы, справа значок меню. Телефон
   и почта уходят вниз: до них удобнее дотянуться пальцем не в шапке.

   «display: flex !important» - то самое правило, из-за которого шапка
   телефона показывалась на главной и не показывалась больше нигде:
   важность перебивает эталонное `.mobonly[data-h]{display:none}` вне
   зависимости от класса «mob» на теле документа. Поэтому на окнах
   641-760 точек (класс «mob» ставится только до 640) шапка телефона видна
   вместе с меню компьютера - на главной так было всегда, теперь так же на
   всех страницах. */
@media (max-width: 760px) {
  /* Три колонки - пункт 4 мобильного задания 09.09.2026: «логотип
     оставить строго по центру экрана; кнопку "Наверх" - по центру
     свободного пространства между левым краем страницы и логотипом;
     кнопку меню - по центру свободного пространства между логотипом и
     правым краем. Использовать именно этот вариант размещения, а не
     прижимать кнопки к краям страницы».

     Замер стенда до правки (окно 375, шапка 349 от 13-й до 362-й
     точки): «Наверх» 66..108 (центр 87), логотип 139..309 (центр 224),
     значок меню 340..360 (центр 350) - кнопки у краёв, логотип смещён
     вправо при центре экрана 187,5.

     Средняя колонка `auto` - по ширине логотипа, крайние `1fr` равны
     между собой; кнопка внутри каждой центрируется своей ячейкой
     (правила ниже, раздел Т10).

     «!important» стоял здесь и раньше - им перебивается эталонное
     `.mobonly[data-h]{display:none}`; меняется только вид раскладки. */
  .apphead {
    display: grid !important;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid var(--line, #d9dbde);
  }

  .apphead .logo {
    flex: 0 0 auto;
    font-weight: 700;
    white-space: nowrap;
  }

  .apphead .appkont {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-width: 0;
    color: var(--muted, #63676c);
    font-size: 11px;
    line-height: 1.25;
  }

  .apphead .appkont span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .apphead .burger {
    flex: 0 0 auto;
    padding: 2px 6px;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
  }
}

/* Т0.2 = раздел 5 файла glavnaya.css, часть про шапку, дословно.

   Диктовка Павла 13.08.2026: шапка должна быть видна всё время, при любой
   прокрутке. Раньше она уезжала вместе с первым экраном, и на середине
   страницы заказать было нечем.

   Правила нижней панели .bottombar из того же раздела сюда НЕ перенесены -
   см. пояснение в начале раздела Т0. */
@media (max-width: 760px) {
  .apphead {
    position: sticky;
    top: 0;
    z-index: 60;
    background: #fff;
  }

  .apphead .appzakaz {
    flex: 0 0 auto;
    padding: 6px 10px;
    border-radius: 5px;
    background: var(--accent, #2f3336);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
  }

  /* адрес и часы уступают место кнопке: они справочные, а кнопка продаёт */
  .apphead .appkont {
    font-size: 10.5px;
  }
}

/* Т0.3 = раздел 11 файла glavnaya.css, дословно.

   Диктовка Павла 13.08.2026: слева небольшая кнопка «Заказать перевод», по
   центру логотип, справа значок меню. Адреса и часов на телефоне в шапке
   нет - они остаются в подвале и в блоке контактов, содержимое страницы
   для поисковика не беднеет. */
@media (max-width: 760px) {
  .apphead .appkont {
    display: none;
  }

  .apphead .appzakaz {
    order: -1;
    padding: 5px 8px;
    font-size: 11px;
  }

  .apphead .logo {
    flex: 1 1 auto;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* Т0.4 = раздел 22 файла glavnaya.css, часть про .apphead, дословно.

   Вне медиазапроса - как и было в glavnaya.css. На компьютере .apphead
   скрыт классом mobonly, поэтому вида страницы эти две строки там не
   меняют; переносить их внутрь @media нельзя - изменился бы порядок спора
   с разделами 24 и 25.3 ниже.

   Переменная --cvet-plusa из того же раздела 22 осталась в glavnaya.css:
   ею красятся плюсики раскрывашек главной, к шапке она отношения не
   имеет. */
.apphead .logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.apphead .logo .znak {
  display: block;
  height: 20px;
  width: auto;
  background: none;
}

/* Т0.5 = раздел 24 файла glavnaya.css, дословно.

   Диктовка Павла 14.08.2026: логотип занимает центральную часть шапки,
   кнопка «Заказать перевод» и значок меню равномерно по краям. */
@media (max-width: 760px) {
  .apphead {
    position: relative;
    justify-content: space-between;
  }

  .apphead .logo {
    position: absolute;
    left: 50%;
    top: 50%;
    flex: none;
    max-width: 55vw;
    overflow: hidden;
    transform: translate(-50%, -50%);
  }

  .apphead .logo .znak {
    height: 22px;
  }

  /* кнопка ужата, чтобы не налезала на логотип по центру */
  .apphead .appzakaz {
    padding: 4px 6px;
    font-size: 10px;
  }
}

/* Т0.6 = раздел 25.3 файла glavnaya.css, дословно.

   Шапка телефона в редакции диктовки 14: одна строка - слева значок
   онлайн-заказа, по центру логотип, справа серые полоски меню. Кнопки
   «Заказать перевод» словом больше нет. Раздел отменяет часть раздела 24
   выше (положение логотипа, липкость вместо relative) - поэтому перенесены
   оба и именно в этом порядке. */
@media (max-width: 760px) {
  .apphead {
    justify-content: space-between;
  }

  .apphead .logo {
    position: static;
    transform: none;
    flex: 1 1 auto;
    max-width: none;
    justify-content: center;
    min-width: 0;
  }

  /* высота считается от ширины - новый знак от Павла (17.08.2026) вытянутее
     прежнего (5.88 против 5.0), и при жёсткой высоте 66px он не помещался в
     ширину экрана: object-fit его вписывал, но бокс оставался высотой 66 и
     держал лишнюю пустоту сверху и снизу. Теперь бокс равен картинке. */
  .apphead .logo .znak {
    width: 100%;
    height: auto;
    max-width: calc(100vw - 110px);
  }

  /* диктовка 16: шапка совсем узкая - высота задаётся логотипом */
  .apphead {
    gap: 8px;
    padding: 2px 0;
  }

  .apphead .appzakaz {
    order: -1;
    flex: 0 0 auto;
    padding: 0;
    background: none;
    border-radius: 0;
  }

  /* корзина с красной галочкой */
  .apphead .appzakaz .ai {
    display: block;
    width: 36px;
    height: 36px;
  }

  /* три ровные полоски на уровне логотипа (диктовка 17) */
  .apphead .burger .ai {
    display: block;
    width: 30px;
    height: 30px;
  }

  .apphead .burger {
    padding: 0;
    border: 0;
    background: none;
    font-size: 0;
    line-height: 0;
  }

  /* шапка обязана липнуть; position:relative из ранней редакции 24-го
     раздела перебивал эталонное sticky - Павел это поймал */
  .apphead {
    position: sticky;
    top: 0;
  }
}


/* ── Т1. Шапка телефона: логотип по центру полосы, полоса в обрез ─────── */

/* Диктовка Павла 18.08.2026, пункт 2, дословно: «логотип сделать меньше на
   пятьдесят процентов; поле для логотипа и для меню сделать в обрез, прям
   как можно меньше, чтобы ровно логотип помещался, больше не нужно; не
   нужно много места до логотипа и после логотипа - буквально два
   миллиметра; дурацкую корзинку убрать вообще, непонятно, что это, как бы
   заказать - убрать; полоски оставить, поскольку логотип уменьшишь,
   полоски будут примерно такого же размера, сделать уже».

   Зачем: шапка занимала 66px высоты при логотипе 45px - две трети полосы
   уходило на пустоту и на значок корзины, который читался как непонятная
   иконка. Теперь полоса ровно по логотипу, логотип у самого левого края,
   справа только полоски меню.

   Почему селекторы с приставкой «body»: этот файл подключён в base.html
   ДО css/etalon/* и до css/site/glavnaya.css (те приходят из extra_css
   главной), поэтому при равной силе селектора наши правила проигрывают.
   Приставка «body» добавляет вес и решает это без !important. Там, где
   эталон пишет .apphead[data-h] (это два «класса» по счёту силы), одной
   приставки мало - её пришлось дополнить тем же [data-h] и запасным
   body.mob.

   Всё внутри @media (max-width: 760px): на компьютере .apphead скрыт
   (mobonly), правки его не касаются.

   Откат: удалить раздел Т1 целиком - вернётся шапка 66px с логотипом
   264x45, корзиной 36x36 слева и полосками 30x30 справа. */

/* ПОПРАВКА, диктовка Павла 18.08.2026, пункт 25, дословно: «логотип - ну что
   ты совсем уменьшил. Во-первых, ты совсем уменьшил, во-вторых, расстояние от
   верхнего края до серой линии неравномерно. Увеличь текущий логотип в два
   раза, и чтобы расстояние от серой линии до верха было одинаково, чтобы
   логотип стоял посередине».

   Что было не так. Уменьшение на 50% (пункт 2 той же диктовки) оказалось
   перебором - логотип вернули к исходным 264x45. А неравномерность бралась
   не из шапки: над шапкой лежит верхнее поле страницы .wrap (padding: 1rem,
   то есть 16px), поэтому от верхнего края экрана до логотипа было 16 + 2 =
   18px, а от логотипа до серой линии - 2px. Внутри самой полосы воздух был
   ровный (2 и 2), но глазами видно всю белую область от верха экрана, и
   логотип в ней выглядел прижатым к линии. Отсюда «стоит не посередине».

   Как поправлено: верхнее поле страницы для шапки погашено отрицательным
   margin-top (Т1.1), так что верх полосы совпал с верхним краем экрана, и
   теперь «верх полосы» и «верхний край» - одно и то же место. Воздух 2px
   сверху и 2px снизу до линии - одинаковый в обоих прочтениях. */
@media (max-width: 760px) {

  /* Т1.1. Полоса в обрез: воздух сверху и снизу по 2px вместо 8.8/11.2 из
     эталона, поля слева и справа - 2px вместо 1.6px + значок корзины.

     margin-top: -1rem - поправка 18.08 (пункт 25). Гасит верхнее поле
     страницы .wrap (padding-top: 1rem), из-за которого над логотипом было
     18px, а под ним 2px. Значение в rem, а не в пикселях, чтобы гашение
     осталось точным, если базовый шрифт когда-нибудь изменится. Нижнее поле
     шапки (margin-bottom: .7rem из эталона) не трогаем - отбивка до первого
     блока страницы сохраняется.
     Откат: удалить правило - вернётся padding .55rem .1rem .7rem и верхнее
     поле страницы над шапкой. */
  body .apphead[data-h],
  body.mob .apphead {
    gap: 6px;
    padding: 2px;
    margin-top: -1rem;
  }

  /* Т1.2. Логотип - 264.7x45. Поправка 18.08 (пункт 25): «увеличь текущий
     логотип в два раза» - было 132.34x22.5, стало ровно вдвое больше, то
     есть исходный размер картинки на экране.

     Задана ШИРИНА, а высота считается сама (height: auto) по пропорции
     картинки. Так сделано ради узких экранов: если места не хватает и
     срабатывает max-width, при заданной ширине высота уменьшится
     пропорционально, а при заданной жёсткой высоте картинку бы сплющило.

     Логотип прижат к левому краю: корзины слева больше нет, центровать
     его не от чего, а Павел просил «два миллиметра до логотипа».
     (Отменено правкой Т1.6 - логотип стоит по центру полосы.)

     flex-shrink: 1 и min-width: 0 - страховка от наезда на значок меню на
     узких экранах (320px). Ужимает вёрстка, а не подобранное вручную число
     в max-width: значку меню место достаётся всегда, а логотип отдаёт
     недостающие пиксели, сохраняя пропорцию.
     Откат: удалить оба правила - логотип снова 100% ширины по центру. */
  body .apphead .logo {
    flex: 0 1 auto;
    min-width: 0;
    justify-content: flex-start;
  }

  /* ШИРИНА 169.79px - правка 19.08.2026 (возврат прежнего логотипа).

     Павел: «давай вернём старый логотип... сделай такого же размера, как
     тот, который новый... поставь его так, чтобы текущая высота строки под
     логотипом не изменилась, была бы такая же ровно».

     Вместо знака «Академ» красный + «Перевод» синий (файл 1200x204,
     пропорция 5,88) вернулся знак действующего сайта academperevod.ru -
     бордовые буквы с сургучной печатью (файл 400x106, пропорция 3,77).
     Файл лежит там же:
     C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\
     home\static\img\logotip.webp

     ПОЧЕМУ ЧИСЛО ДРУГОЕ, А ВЫСОТА ТА ЖЕ. Высота полосы шапки держится на
     высоте логотипа: 2 (поле сверху) + логотип + 2 (поле снизу) + 1
     (серая линия) = 49,98. Значит менять можно только ширину. Прежние
     264,7px при новой пропорции дали бы логотип 264,7x70,1 и полосу 75,1
     вместо 49,98 - шапка выросла бы в полтора раза.

     Число посчитано от высоты, а не подобрано: 44,9844 (высота знака до
     правки) × 400/106 = 169,75, и дальше проверено замером в браузере.
     Замер показал, что ровно 169,75 не годится: Chrome округляет размеры
     вниз до 1/64 точки, и высота уходила на 44,9688, а полоса - на 49,97.
     Нужную высоту 44,9844 (полоса 49,98) даёт любая ширина от 169,77 до
     169,81; взята середина 169,79 - от края допуска отступ 0,02 в обе
     стороны, так что мелкая правка соседних чисел её не собьёт.

     ЧИСЛА СВЯЗАНЫ С ФАЙЛОМ. Заменят картинку на другую пропорцию - это
     число пересчитать: ширина = 44,9844 × (ширина файла / высота файла).

     Откат: вернуть width: 264.7px и положить обратно прежний знак из
     C:\Users\Павел\Claude\Projects\Вебсайт\_perenos\fajly\
     logotip_novyj_do_vozvrata_19.08.webp */
  body .apphead .logo .znak {
    width: 169.79px;   /* даёт высоту ровно 44,9844 - см. пояснение выше */
    height: auto;
    max-width: 100%;
    min-width: 0;
  }

  /* Т1.3. Значок корзины («Онлайн-заказ») убран совсем - Павел: «дурацкую
     корзинку убрать вообще». Правка только стилями: разметку шапки
     (C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\
     home\templates\home\home_page.html) правит Павел сам.
     Заказать по-прежнему можно из нижней панели действий и из блока
     заявки, так что действие с телефона не теряется.
     Откат: удалить правило - значок вернётся на место слева. */
  body .apphead .appzakaz {
    display: none;
  }

  /* Т1.4. Полоски меню уже и мельче: было 30x30, стало 20x20. Размер
     оставлен как есть и после возврата логотипа к 45px (пункт 25): Павел
     правил только логотип, про значок меню речи не было.
     Откат: вернуть 30px. */
  body .apphead .burger .ai {
    width: 20px;
    height: 20px;
  }

  /* Т1.5. Значок меню не ужимается. Поправка 18.08 (пункт 25): логотип
     теперь может отдавать пиксели на узких экранах (Т1.2), и без этой
     страховки вёрстка могла бы ужать вместо него значок меню.
     Откат: удалить правило - значок снова сможет ужиматься. */
  body .apphead .burger {
    flex: 0 0 auto;
  }

  /* Т1.6. Логотип строго по центру полосы (диктовка Павла 19.08.2026, п. 33)

     Павел дословно: «логотип в шапке сместить по центру. Собственно говоря,
     место там есть, поэтому проблем быть не должно».

     ПОЧЕМУ ОДНОЙ ВЫКЛЮЧКИ ПО ЦЕНТРУ МАЛО. В полосе два видимых предмета -
     логотип и значок меню 20x20 справа. Любое центрирование содержимого
     (justify-content: center у полосы, text-align: center) ставит логотип в
     середину ОСТАВШЕГОСЯ места, а не полосы: он уезжает влево ровно на
     половину значка плюс половину зазора, то есть на 13 точек при значке 20
     и зазоре 6. Это не «почти центр», это видимая ошибка.

     КАК СДЕЛАНО. Слева добавлен пустой предмет-противовес ровно той же
     ширины, что значок меню. Раскладка осталась прежней - space-between из
     эталона: когда предметов три и крайние одинаковой ширины, средний
     оказывается точно в середине полосы. Это арифметика раскладки, а не
     подобранное число: свободное место space-between делит на два равных
     промежутка, поэтому от левого края до логотипа и от логотипа до правого
     края всегда поровну.

     Полоса шапки симметрична внутри окна - поля страницы по 12,80 слева и
     справа (замер), - поэтому «центр полосы» и «центр окна» здесь одно и то
     же место.

     ШИРИНА ПРОТИВОВЕСА 20px - это ширина значка меню из Т1.4 (замер: у
     .burger ширина ровно 20, полей нет). Числа связаны: меняя одно, менять и
     второе, иначе логотип уедет ровно на половину разницы.

     ВЫСОТУ ПОЛОСЫ НЕ ТРОГАЕТ: противовес пустой и нулевой высоты, высоту
     держит логотип. Замер после правки: логотип 264,69x44,98, воздух 2,00
     сверху и 2,00 снизу до серой линии - как вчера.

     УЗКИЕ ЭКРАНЫ - переписано 19.08.2026 после возврата прежнего логотипа.
     Прежний знак вдвое ýже нового (169,79 против 264,69 при той же высоте),
     поэтому теснота ушла совсем: на 320 в полосе 290,41 точки содержимого, а
     логотипу с противовесом и двумя зазорами нужно 221,79 - остаётся 68,62
     запаса. Логотип стоит в полную величину на всех экранах от 320 и выше,
     flex-shrink из Т1.2 больше не срабатывает (раньше на 320 знак ужимался
     до 238,41x40,51). Ужатие оставлено как страховка на случай ещё более
     узкого окна.

     Если значок «Онлайн-заказ» когда-нибудь вернут (Т1.3 сейчас его прячет),
     противовес надо убрать - слева снова появится настоящий предмет.

     Компьютер не затронут: правка внутри @media (max-width: 760px), а на
     компьютере .apphead скрыт классом mobonly.

     Откат: удалить правило - логотип вернётся к левому краю. */
  body .apphead[data-h]::before,
  body.mob .apphead::before {
    content: "";
    flex: 0 0 auto;
    width: 20px;   /* ровно ширина значка меню из Т1.4 - менять вместе */
    height: 0;
  }
}


/* ── Кегль 13: пункты бургер-меню 15px (диктовка Павла 20.08.2026) ────────

   Правка из книги замера «ШРИФТЫ_МОБИЛЬНЫЕ применить на стр. О компании»,
   три строки: пункт с подменю, простая ссылка, «Заказать перевод».
   Было 15,5px, стало 15px.

   Откуда брались 15,5: shapka.css, @media (max-width: 1080px),
   `body .sitemenu[data-b] { font-size: 15.5px }`. Пункты меню кегль
   наследуют, у «Заказать» своё правило того же файла (вес 0,4,1). Здесь
   вес (0,5,1) и файл подключён позже - перебивает без !important.
   Полный путь источника:
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\shapka.css

   Подпункты выпадающих списков (14px) и второй ряд быстрых ссылок (15px)
   Павел не правил - их не трогаем.

   Шапка одна на весь сайт, поэтому правило живёт здесь и действует на всех
   страницах - как и остальное оформление шапки. Гейт «body.mob» оставляет
   компьютерное меню (19 / 17 / 15,5px по ступеням) нетронутым, а сам
   бургер на компьютере и не показывается.

   Откат: удалить раздел - меню вернётся к 15,5px.
   ─────────────────────────────────────────────────────────────────────── */
body.mob .menublok .sitemenu.open > .navgroup > a,
body.mob .menublok .sitemenu.open > a,
body.mob .menublok .sitemenu.open .mzakaz {
  font-size: 15px;
}


/* ── Мобильное меню окном (правка Павла 06.09.2026, проверка мобильных) ──

   БЫЛО. Меню по бургеру разворачивалось В ПОТОКЕ, внутри .menublok в
   самом верху страницы, и отодвигало вниз всё содержимое. На телефоне
   .menublok не липкий, поэтому если посетитель пролистал вниз и нажал
   бургер, меню раскрывалось за верхним краем экрана - «нажимаю меню, оно
   где-то сверху открывается, но никак не срабатывает» (Павел, диктовка
   06.09.2026).

   СТАЛО, дословно по диктовке:
   · меню открывается ПОВЕРХ текущей страницы всплывающим окном, не
     отодвигая содержимое, - как окна калькуляторов и заявки;
   · у окна очертание полностью по периметру (рамка) и обводка между
     строками (линия под каждым пунктом);
   · закрывается явно выделенным КРЕСТИКОМ (кнопка .mmenu-close в
     pilotsite/templates/parts/shapka.html, ловит её
     home/static/js/etalon/auto_mob.js);
   · всё компактнее: межстрочные интервалы меньше, шрифт немножко меньше
     (14px пункты, 13px подпункты - перебивает 15px из раздела «Кегль 13»
     выше: та правка была от 20.08.2026, эта диктовка новее);
   · состав не меняется: .sitemenu - это и есть верхняя строка меню
     сайта (все услуги, цены, компания, как оплатить, акции, вакансии,
     контакты) плюс кнопка «Заказать перевод».

   position: fixed, а не absolute: окно должно быть видно с ЛЮБОГО места
   прокрутки - в этом и была поломка. z-index 70 - выше липкой шапки
   телефона (у .apphead 60). Окно длиннее экрана прокручивается внутри
   себя (overflow-y: auto).

   Откат: удалить раздел - меню вернётся к развороту в потоке. */

.mmenu-close {
  display: none;
}

/* Тело документа под открытым меню стоит на месте. Класс ставит
   home/static/js/etalon/auto_mob.js, он же запоминает позицию прокрутки
   и возвращает её при закрытии. position: fixed, а не overflow: hidden:
   на телефонах overflow у body прокрутку не держит. */
body.menyu-otkryto {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
  overflow: hidden;
}

/* Правка Павла 07.09.2026 по итогам проверки: окно РОВНО ПО ШИРИНЕ
   ЭКРАНА телефона и во всю высоту, прокрутка строго вниз - вбок ничего
   не ездит. Прежняя редакция оставляла поля по 8 точек и скругление, а
   пункты с white-space: nowrap вылезали вправо на 105 точек (замер) -
   отсюда и был «скрол влево-вправо». */
body.mob .menublok .sitemenu.open {
  position: fixed;
  inset: 0;                  /* верх, право, низ, лево - по краям экрана */
  z-index: 70;
  width: 100%;
  height: 100%;
  overflow-x: hidden;        /* вбок не ездит никогда */
  overflow-y: auto;          /* прокрутка только вниз, внутри меню */
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 44px 16px 24px;   /* сверху место под крестик */
  margin: 0;
  gap: 0;
  /* Выключка по ЛЕВОМУ краю: правило шапки для узких окон ставит
     justify-content: center, и в колоночном меню пункты собирались к
     середине - замечание Павла 07.09.2026 «почему-то взял их в центр». */
  flex-direction: column;
  /* flex-wrap: nowrap ОБЯЗАТЕЛЕН. Правило шапки для окон уже 940 ставит
     меню flex-wrap: wrap - в строке это перенос на вторую строку, а в
     колонке это перенос в СОСЕДНИЙ СТОЛБЕЦ: «Вакансии», «Контакты» и
     кнопка уезжали во второй столбец на 320-488 точек при экране 375, и
     меню ездило вбок (замер 07.09.2026). Теперь пункты идут одной
     колонкой сверху вниз, а длинное меню прокручивается вниз внутри
     себя. */
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  text-align: left;
}

/* Обводка между строками: линия под каждым пунктом верхнего уровня.
   Кнопка заказа сюда НЕ входит - у неё своя канонная отбивка (см. ниже):
   прежняя редакция ловила её как прямого потомка-ссылку, и под кнопкой
   выходили две линии сразу - замечание Павла 07.09.2026 «какая-то
   непонятная, с двумя границами внизу». */
body.mob .menublok .sitemenu.open > a:not(.mzakaz),
body.mob .menublok .sitemenu.open > .navgroup {
  border-bottom: 1px solid var(--line, #d9dbde);
  padding: 8px 2px;
}

/* Компактнее: кегль и межстрочные меньше, чем было (15px / gap 6px).
   Перенос разрешён - иначе длинный пункт уезжает за правый край и
   возвращает горизонтальную прокрутку. */
body.mob .menublok .sitemenu.open > .navgroup > a,
body.mob .menublok .sitemenu.open > a {
  font-size: 14px;
  line-height: 1.35;
  white-space: normal;
  text-align: left;
}

body.mob .menublok .sitemenu.open .navgroup .dropdown {
  padding: 2px 0 2px 14px;
}

body.mob .menublok .sitemenu.open .navgroup .dropdown a {
  font-size: 13px;
  line-height: 1.3;
  padding: 3px 10px 3px 0;
}

/* «Заказать перевод» - обычная канонная кнопка сайта: овал, заливка
   фирменным градиентом, кегль 15 (вид задаёт shapka.css, раздел 29).
   Здесь только место в колонке: отбивка сверху и ширина по содержимому,
   иначе align-items: stretch растянул бы её полосой во всю строку.
   Правка Павла 07.09.2026: «сделай нормально, по канону». */
body.mob .menublok .sitemenu.open .mzakaz {
  align-self: flex-start;
  margin: 16px 0 0;
  border-bottom: 0;
  font-size: 15px;
}

/* Крестик: круглая кнопка в правом верхнем углу окна. Показывается
   только в открытом мобильном меню - на компьютере и в закрытом
   состоянии его нет (правило .mmenu-close выше). */
body.mob .menublok .sitemenu.open .mmenu-close {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 6px;
  right: 6px;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid var(--line, #d9dbde);
  border-radius: 50%;
  background: #fff;
  color: var(--muted, #63676c);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}


/* ── Т9. Кнопка «Наверх» в шапке телефона ───────────────────────────────

   Пункт 2.16 сводного пакета (К2-46), диктовка Павла 08.09.2026:
   «тёмно-серая стрелка вверх - нажал и вернулся наверх, к оглавлению.
   Мобильная: в шапке, слева от логотипа, такого же стиля, как меню».

   Стиль взят у значка меню один в один: кнопка без фона и рамки, значок
   30x30, серая обводка. Отличие только в рисунке - стрелка вместо
   полосок, он лежит в разметке (parts/shapka.html).

   Шапка телефона липкая (position: sticky, top 0), поэтому кнопка
   доступна с любого места страницы - проверено замером 08.09.2026 на
   прокрутке 2500 точек.

   Прокрутку делает js/site/shapka.js по признаку data-naverh.
   Откат: удалить раздел Т9 и кнопку из parts/shapka.html. */
.apphead .naverh {
  flex: 0 0 auto;
  padding: 2px 6px;
  margin: 0;
  background: none;
  border: 0;
  line-height: 1;
  cursor: pointer;
  color: inherit;
}

.apphead .naverh .ai {
  display: block;
  width: 30px;
  height: 30px;
}

/* На компьютере эта кнопка не нужна: там своя, в строке меню. */
body:not(.mob) .apphead .naverh { display: none; }


/* ── Т10. Раскладка шапки телефона: логотип по центру, кнопки по середине
      своих половин ───────────────────────────────────────────────────

   Пункт 4 мобильного задания 09.09.2026, дословно: «логотип
   "Академ-Перевод" оставить строго по центру экрана; кнопку "Наверх"
   расположить по центру свободного пространства между левым краем
   страницы и логотипом; кнопку меню - по центру свободного пространства
   между логотипом и правым краем страницы. Использовать именно этот
   вариант размещения, а не прижимать кнопки к краям страницы».

   Замер стенда до правки (окно 375, шапка 349 от 13-й до 362-й точки):
   «Наверх» 66..108 (центр 87), логотип 139..309 (центр 224), значок меню
   340..360 (центр 350). Логотип был смещён вправо, кнопки прижаты к
   краям - шапка стояла на `justify-content: space-between`.

   Сами три колонки заданы выше, в разделе Т0.1: там у правила уже
   стоит «!important», которым перебивается эталонное
   `.mobonly[data-h]{display:none}`, и добавлять свой ниже нельзя -
   сторож `test_v_perenesyonnyh_razdelah_net_important` следит, чтобы в
   перенесённых разделах важности не было. Здесь остаётся только
   выключка: каждая кнопка встаёт по центру своей ячейки.

   ЧТО ЕЩЁ ЗАТРОНЕТ. Шапка `.apphead` общая для всего сайта, поэтому
   правка видна на каждой мобильной странице - Павел так и просил
   («общая мобильная шапка сайта»). На компьютере шапка другая
   (`.sitehead` и строка меню), её правило не касается: раздел целиком
   в `@media (max-width: 760px)`.

   Откат: удалить раздел Т10 - вернётся `space-between`. */
@media (max-width: 760px) {
  /* Колонки названы явно. Без этого раскладка разъезжалась: замер стенда
     09.09.2026 после первой выкатки показал два ряда вместо одного -
     «Наверх» на 167-й точке, логотип на 215-й, значок меню вообще во
     второй строке. Автоматическая расстановка учитывала и скрытые узлы
     шапки (контакты и кнопка заказа), и ширина логотипа сдвигала
     остальных. С явными номерами ячеек каждый стоит на своём месте. */
  body .apphead .naverh {
    grid-column: 1;
    grid-row: 1;
    justify-self: center;
  }

  body .apphead .logo {
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
  }

  body .apphead .burger {
    grid-column: 3;
    grid-row: 1;
    justify-self: center;
    margin: 0;
  }
}
