/* ═══════════════════════════════════════════════════════════════════════
   Закажите в АкадемПеревод
   ────────────────────────
   Призыв к действию, подзаголовки, кнопка заказа, согласие на обработку данных.

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

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

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

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


/* ── 1. Открытая форма заявки в блоке (диктовка Павла 18.08.2026) ───────

   Павел: «иди на действующий сайт, смотри, как там организована форма, и
   переписывай её таким же образом - но чтобы она повторяла ту форму,
   которая у нас сейчас открывается. Чтобы была такая же, но чуть
   компактнее. Та, которая на действующем сайте, практически такая же по
   содержанию, но более компактная - вот такие размеры и возьмём».

   Что снято с действующего сайта (замер, 1440 px):
     · белая коробка 688×395, скругление 16, тень 0 20px 40px rgba(30,31,34,.08),
       поля коробки 20px сверху и 35px по бокам и снизу;
     · сама форма внутри - 618×262;
     · три поля в строку по 199×56, промежуток 10;
     · ниже задача 294×90 и зона документов 300×90 в две колонки;
     · внизу согласие шириной 319 и кнопка 289×46;
     · поля: рамка 1px #E0E0EC, скругление 8, внутренняя тень
       0 3px 12px rgba(132,141,152,.12), шрифт 12px, подписи - плейсхолдерами.

   Что взято у нас иначе:
     · ширина коробки 760, а не 688: наше окно заявки 900, «чуть
       компактнее» - это столько; полей в форме больше (код страны, вторая
       галочка, строка про капчу), и на 688 они вставали слишком плотно;
     · шрифт полей 14px, а не 12px: 12px на нашем сайте - размер сносок,
       в поле ввода он читается плохо;
     · кнопка красная плоская, как остальные красные кнопки сайта
       (#8c1821, скругление 8), а не градиент действующего сайта -
       прямое указание Павла;
     · подложки-картинки нет: Павел просил без неё.

   Откат раздела: удалить его целиком - блок вернётся к заголовку, двум
   строкам и кнопке (вместе с откатом разметки в home_page.html). */

/* 1.1. Коробка формы. Стоит по центру блока; фон блока не трогаем, поэтому
   коробка отделяется от белой страницы рамкой и мягкой тенью, а не своим
   фоном. Откат: удалить правило. */
#zayavka .zkorobka,
.zayavka-blok .zkorobka {
  box-sizing: border-box;
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  padding: 22px 28px 26px;
  border: 1px solid #e6e8ec;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 38px rgba(30, 31, 34, .08);
  text-align: left;
}

/* 1.2. Шапка коробки: зачин и подпись. На действующем сайте это «Оставьте
   заявку» и строка помельче под ним; у нас те же два поля справочника
   («Тексты формы заявки»), только теперь они стоят внутри коробки, а не
   отдельными строками по центру блока. Откат: удалить 1.2. */
#zayavka .zzov,
.zayavka-blok .zzov {
  margin: 0 0 4px;
  font-size: 20px;
  line-height: 1.25;
  font-weight: 700;
  color: #1b1b1b;
}
#zayavka .zpodpis,
.zayavka-blok .zpodpis {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 1.4;
  color: #63676c;
}

/* 1.3. Ряды формы. Раскладка действующего сайта: три поля в строку, ниже
   задача и документы в две колонки, внизу согласия и кнопка.
   Откат: удалить 1.3. */
#zayavka .zryad,
.zayavka-blok .zryad {
  display: grid;
  gap: 12px;
}
#zayavka .zryad--verh,
.zayavka-blok .zryad--verh {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#zayavka .zryad--seredina,
.zayavka-blok .zryad--seredina {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 12px;
}

/* Столбец кнопки - 300px: надпись «Получить расчёт стоимости и сроков»
   должна лечь в одну строку, как на действующем сайте (там кнопка 289
   при чуть более узком шрифте). На 268 она переносилась и кнопка
   вырастала до 58. Откат: вернуть 268px. */
#zayavka .zryad--niz,
.zayavka-blok .zryad--niz {
  grid-template-columns: minmax(0, 1fr) 300px;
  align-items: start;
  gap: 16px;
  margin-top: 14px;
}

/* 1.4. Поля ввода. Оформление один в один с действующим сайтом: рамка
   #E0E0EC, скругление 8, внутренняя тень, плейсхолдер вместо подписи.
   Высота 52 вместо 56 - форма стала выше на строку про капчу и вторую
   галочку. Откат: удалить 1.4. */
#zayavka .zpole,
.zayavka-blok .zpole {
  display: block;
  min-width: 0;
}
#zayavka .zpole input[type="text"],
.zayavka-blok .zpole input[type="text"],
#zayavka .zpole input[type="tel"],
.zayavka-blok .zpole input[type="tel"],
#zayavka .zpole input[type="email"],
.zayavka-blok .zpole input[type="email"],
#zayavka .zpole textarea,
.zayavka-blok .zpole textarea,
#zayavka .zpole--telefon,
.zayavka-blok .zpole--telefon {
  box-sizing: border-box;
  width: 100%;
  font: 400 14px/1.35 Inter, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: #1b1b1b;
  background: #fff;
  border: 1px solid #e0e0ec;
  border-radius: 8px;
  box-shadow: inset 0 3px 12px rgba(132, 141, 152, .12);
}
#zayavka .zpole input[type="text"],
.zayavka-blok .zpole input[type="text"],
#zayavka .zpole input[type="tel"],
.zayavka-blok .zpole input[type="tel"],
#zayavka .zpole input[type="email"],
.zayavka-blok .zpole input[type="email"] {
  height: 52px;
  padding: 0 14px;
}
#zayavka .zpole textarea,
.zayavka-blok .zpole textarea {
  height: 92px;
  padding: 12px 14px;
  resize: vertical;
}
#zayavka .zpole ::placeholder,
.zayavka-blok .zpole ::placeholder {
  color: #8b9096;
  opacity: 1;
}
#zayavka .zpole input:focus,
.zayavka-blok .zpole input:focus,
#zayavka .zpole textarea:focus,
.zayavka-blok .zpole textarea:focus {
  outline: 2px solid #8c1821;
  outline-offset: 1px;
  border-color: #8c1821;
}

/* Поле с ошибкой сервера подсвечивается рамкой - чтобы человек видел, о
   каком из трёх полей строки идёт речь. */
#zayavka .zpole--oshibka input,
.zayavka-blok .zpole--oshibka input,
#zayavka .zpole--oshibka textarea,
.zayavka-blok .zpole--oshibka textarea,
#zayavka .zpole--telefon.zpole--oshibka,
.zayavka-blok .zpole--telefon.zpole--oshibka {
  border-color: #9b2434;
}

/* 1.5. Телефон: код страны и номер в одной коробке. Список стран и маска -
   те же, что в форме окна. Рамка одна на оба поля, поэтому у select и
   input своей рамки нет. Откат: удалить 1.5. */
#zayavka .zpole--telefon,
.zayavka-blok .zpole--telefon {
  display: flex;
  align-items: stretch;
  height: 52px;
  overflow: hidden;
}
#zayavka .zpole--telefon .zkod,
.zayavka-blok .zpole--telefon .zkod {
  flex: 0 0 auto;
  width: 84px;
  padding: 0 4px 0 12px;
  font: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  border-right: 1px solid #e0e0ec;
  border-radius: 0;
  cursor: pointer;
}
#zayavka .zpole--telefon input[type="tel"],
.zayavka-blok .zpole--telefon input[type="tel"] {
  flex: 1 1 auto;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}
#zayavka .zpole--telefon:focus-within,
.zayavka-blok .zpole--telefon:focus-within {
  outline: 2px solid #8c1821;
  outline-offset: 1px;
  border-color: #8c1821;
}
#zayavka .zpole--telefon input[type="tel"]:focus,
.zayavka-blok .zpole--telefon input[type="tel"]:focus,
#zayavka .zpole--telefon .zkod:focus,
.zayavka-blok .zpole--telefon .zkod:focus {
  outline: none;
}

/* 1.6. Зона документов. На действующем сайте это прямоугольник 300×90 со
   светлой заливкой и той же рамкой, что у полей; наш текст - из справочника
   («Прикрепление файлов: подпись»). Само поле ввода спрятано, но остаётся
   в разметке: клик и перетаскивание идут через подпись.
   Откат: удалить 1.6. */
#zayavka .zfajly,
.zayavka-blok .zfajly {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 10px;
  height: 92px;
  padding: 12px 14px;
  border: 1px dashed #d5d7e2;
  border-radius: 8px;
  background: rgba(224, 224, 236, .2);
  cursor: pointer;
}
#zayavka .zfajly--nad,
.zayavka-blok .zfajly--nad {
  border-color: #8c1821;
  background: rgba(140, 24, 33, .05);
}
#zayavka .zfajly-vvod,
.zayavka-blok .zfajly-vvod {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
#zayavka .zfajly-znak,
.zayavka-blok .zfajly-znak {
  flex: 0 0 auto;
  font-size: 18px;
  line-height: 1;
}
#zayavka .zfajly-tekst,
.zayavka-blok .zfajly-tekst {
  display: block;
  min-width: 0;
}
#zayavka .zfajly-tekst strong,
.zayavka-blok .zfajly-tekst strong {
  display: block;
  font-size: 13px;
  line-height: 1.3;
  font-weight: 600;
  color: #1b1b1b;
}
#zayavka .zfajly-tekst small,
.zayavka-blok .zfajly-tekst small {
  display: block;
  margin-top: 3px;
  font-size: 11.5px;
  line-height: 1.3;
  color: #63676c;
}

/* 1.7. Список выбранных документов. Появляется под рядом, пока пустой -
   места не занимает. Откат: удалить 1.7. */
#zayavka .zspisok:empty,
.zayavka-blok .zspisok:empty {
  display: none;
}
#zayavka .zspisok,
.zayavka-blok .zspisok {
  display: grid;
  gap: 4px;
  margin-top: 8px;
}
#zayavka .zstroka-fajla,
.zayavka-blok .zstroka-fajla {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  padding: 5px 10px;
  font-size: 12.5px;
  line-height: 1.3;
  border: 1px solid #eceef0;
  border-radius: 6px;
  background: #f7f8f9;
}
#zayavka .zstroka-fajla-imya,
.zayavka-blok .zstroka-fajla-imya {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#zayavka .zstroka-fajla small,
.zayavka-blok .zstroka-fajla small {
  color: #63676c;
}
#zayavka .zstroka-fajla-ubrat,
.zayavka-blok .zstroka-fajla-ubrat {
  font: inherit;
  font-size: 15px;
  line-height: 1;
  padding: 0 4px;
  color: #63676c;
  background: none;
  border: 0;
  cursor: pointer;
}
#zayavka .zstroka-fajla-ubrat:hover,
.zayavka-blok .zstroka-fajla-ubrat:hover {
  color: #8c1821;
}

/* 1.8. Согласия. Первое обязательное, со ссылкой на страницу «Обработка
   персональных данных» - раньше здесь стояла мёртвая строка без ссылки.
   Второе необязательное, про рассылку. Откат: удалить 1.8. */
#zayavka .zsoglasiya,
.zayavka-blok .zsoglasiya {
  display: grid;
  gap: 8px;
}
#zayavka .zgalka,
.zayavka-blok .zgalka {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12.5px;
  line-height: 1.35;
  color: #3f4347;
  cursor: pointer;
}
#zayavka .zgalka input[type="checkbox"],
.zayavka-blok .zgalka input[type="checkbox"] {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  margin: 1px 0 0;
  accent-color: #8c1821;
}
#zayavka .zgalka a,
.zayavka-blok .zgalka a {
  color: #8c1821;
}
#zayavka .zgalka em,
.zayavka-blok .zgalka em {
  font-style: normal;
  color: #8c1821;
}

/* 1.9. Кнопка отправки. Оформление - как у остальных красных кнопок сайта
   («Смотреть все услуги», «Онлайн заявка»): плоский фирменный #8c1821,
   скругление 8, белый текст. Градиент действующего сайта (#E32836 → #8C1821)
   сюда не переносится - прямое указание Павла. Надпись берётся из
   справочника, поле «Кнопка отправки». Откат: удалить 1.9. */
#zayavka .zknopka,
.zayavka-blok .zknopka {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-height: 46px;
  padding: 12px 14px;
  font: 700 14px/1.2 Inter, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: #fff;
  text-align: center;
  background: #8c1821;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color .2s;
}
/* Наведение - только при настоящем курсоре (решение Павла
   08.09.2026, правило 4.5 в bloki/00_obshchee.css: на сенсорном
   экране :hover не отпускает и залипает после касания).
   Откат: снять @media. */
@media (hover: hover) and (pointer: fine) {
  #zayavka .zknopka:hover,
  .zayavka-blok .zknopka:hover {
    background: #a01c26;
  }
}
#zayavka .zknopka:disabled,
.zayavka-blok .zknopka:disabled {
  opacity: .6;
  cursor: default;
}
/* Вторичная кнопка экрана «заявка принята». Селектор начинается с
   body - иначе канонное правило кнопок (body .zayavka-blok .zknopka,
   css/site/bloki/00_obshchee.css) перебивает его по весу и заливает
   кнопку фирменным градиентом, оставляя бордовый текст на бордовом
   фоне: надпись читалась только при наведении (замечание Павла
   07.09.2026 со снимком). Гасим и градиент, и постамент канона.

   Откат: убрать body из селекторов и три строки background-image,
   box-shadow, border-radius. */
body #zayavka .zknopka--tihaya,
body .zayavka-blok .zknopka--tihaya {
  width: auto;
  min-width: 220px;
  margin: 12px auto 0;
  color: #8c1821;
  background: #fff;
  background-image: none;
  border: 1px solid #8c1821;
  box-shadow: none;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
/* Наведение - только при настоящем курсоре (решение Павла
   08.09.2026, правило 4.5 в bloki/00_obshchee.css: на сенсорном
   экране :hover не отпускает и залипает после касания).
   Откат: снять @media. */
@media (hover: hover) and (pointer: fine) {
  body #zayavka .zknopka--tihaya:hover,
  body .zayavka-blok .zknopka--tihaya:hover {
    color: #fff;
    background: #8c1821;
    background-image: none;
    box-shadow: none;
    transform: none;
  }
}

/* 1.10. Невидимая капча и строка о защите. Виджет места не занимает,
   поэтому строка стоит после него, а не внутри. Откат: удалить 1.10. */
#zayavka .zkapcha,
.zayavka-blok .zkapcha {
  margin-top: 10px;
}
#zayavka .zkapcha[data-invisible],
.zayavka-blok .zkapcha[data-invisible] {
  height: 0;
  min-height: 0;
  margin-top: 0;
  overflow: hidden;
}
#zayavka .zprimechanie,
.zayavka-blok .zprimechanie {
  display: block;
  margin-top: 10px;
  font-size: 11.5px;
  line-height: 1.35;
  color: #7a7f85;
}
#zayavka .zprimechanie a,
.zayavka-blok .zprimechanie a {
  color: inherit;
}
#zayavka .zkapcha[data-state="not-configured"]::after,
.zayavka-blok .zkapcha[data-state="not-configured"]::after,
#zayavka .zkapcha[data-state="local-test"]::after,
.zayavka-blok .zkapcha[data-state="local-test"]::after {
  display: block;
  margin-top: 8px;
  font-size: 11.5px;
  line-height: 1.35;
  color: #7a7f85;
}
#zayavka .zkapcha[data-state="local-test"]::after,
.zayavka-blok .zkapcha[data-state="local-test"]::after {
  content: "Локальный тестовый режим: проверка Yandex SmartCaptcha не выполняется, заявка сохраняется в кабинете.";
}
#zayavka .zkapcha[data-state="not-configured"]::after,
.zayavka-blok .zkapcha[data-state="not-configured"]::after {
  content: "Приём заявок временно закрыт: не настроена проверка Yandex SmartCaptcha.";
}

/* 1.11. Строка ответа сервера. Цвета берутся из общих правил
   «.form-status--ok» и «.form-status--error» (css/site/overlay.css).
   Откат: удалить 1.11. */
#zayavka .zstatus,
.zayavka-blok .zstatus {
  margin: 10px 0 0;
  min-height: 0;
  font-size: 13px;
  line-height: 1.35;
}
#zayavka .zstatus:empty,
.zayavka-blok .zstatus:empty {
  display: none;
}

/* 1.12. Ловушка для роботов. Поля есть в разметке, но человек их не видит
   и не может выбрать клавишей. Откат: удалить 1.12 - поля станут видимыми,
   а не исчезнут. */
#zayavka .ztrap,
.zayavka-blok .ztrap {
  /* display: none, а не увод за край экрана (правка Павла 07.09.2026).
     Поле, уведённое на -9999px, для браузера ВИДИМОЕ - и автозаполнение
     его заполняет. Поймано на живой отправке 07.09 в 14:26:
     Яндекс.Браузер сам вписал значение в скрытое поле, сработала
     ловушка, заявка пропала. Невидимые поля автозаполнение не трогает.

     Откат: вернуть position/left/width/height. */
  display: none;
}

/* 1.13. Экран «заявка принята». Показывается вместо формы после ответа
   сервера - не раньше. Откат: удалить 1.13. */
#zayavka .zkorobka--prinyato .zforma,
.zayavka-blok .zkorobka--prinyato .zforma,
#zayavka .zkorobka--prinyato .zzov,
.zayavka-blok .zkorobka--prinyato .zzov,
#zayavka .zkorobka--prinyato .zpodpis,
.zayavka-blok .zkorobka--prinyato .zpodpis {
  display: none;
}
#zayavka .zuspeh,
.zayavka-blok .zuspeh {
  text-align: center;
}
#zayavka .zuspeh:focus,
.zayavka-blok .zuspeh:focus {
  outline: none;
}
#zayavka .zuspeh-znak,
.zayavka-blok .zuspeh-znak {
  margin: 4px 0 8px;
  font-size: 30px;
  line-height: 1;
  color: #1f7a3d;
}
#zayavka .zuspeh-tekst,
.zayavka-blok .zuspeh-tekst {
  margin: 0;
  font-size: 15px;
  line-height: 1.45;
  color: #1b1b1b;
}

/* 1.14. Телефон и узкие экраны. Ряды складываются в один столбец, коробка
   теряет боковые поля. Откат: удалить 1.14. */
@media (max-width: 760px) {
  #zayavka .zkorobka {
    padding: 18px 16px 20px;
    border-radius: 12px;
  }
#zayavka .zryad--verh,
.zayavka-blok .zryad--verh,
#zayavka .zryad--seredina,
.zayavka-blok .zryad--seredina,
#zayavka .zryad--niz,
.zayavka-blok .zryad--niz {
    grid-template-columns: minmax(0, 1fr);
  }
#zayavka .zzov,
.zayavka-blok .zzov {
    font-size: 17px;
  }
#zayavka .zpodpis,
.zayavka-blok .zpodpis {
    font-size: 13px;
  }
body #zayavka .zknopka--tihaya,
body .zayavka-blok .zknopka--tihaya {
    width: 100%;
    min-width: 0;
  }
}


/* ── Цвета подписей под формой (диктовка Павла 18.08.2026) ───────────────

   Дословно: «согласие на обработку персональных данных - красным шрифтом,
   "использование для обратной связи со мной" - тёмно-серым. Так же и
   "форма защищена Яндекс SmartCaptcha" - тёмно-серым, "условия
   использования" и "политика конфиденциальности" - красным и таким же
   кеглем, как согласие. И "и" между ними - тёмно-серым».

   То есть правило простое: обычный текст - тёмно-серый #3D4247 (тот же,
   которым набраны поясняющие тексты карточек), ссылки - фирменный
   бордовый #8C1821. Кегль у строки про капчу поднят с 11,5 до 12,5 -
   вровень с подписями согласий, как и просил Павел.

   Откат: вернуть .zprimechanie на 11,5px и цвет #7a7f85, а ссылкам -
   color: inherit. */
#zayavka .zprimechanie,
.zayavka-blok .zprimechanie {
  font-size: 12.5px;
  color: var(--tekst-temno-seryj, #3d4247);
}
#zayavka .zprimechanie a,
.zayavka-blok .zprimechanie a {
  color: #8c1821;
}
#zayavka .zprimechanie a:hover,
.zayavka-blok .zprimechanie a:hover {
  text-decoration: underline;
}

/* Подписи согласий - тем же тёмно-серым; ссылка внутри остаётся бордовой
   (правило для неё стоит выше, в разделе 1.8). */
#zayavka .zgalka,
.zayavka-blok .zgalka {
  color: var(--tekst-temno-seryj, #3d4247);
}


/* ── 2. Телефон: блок сжат в один экран (диктовка Павла 18.08.2026) ──────

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

   Замер до правки, окно 375x812: весь раздел #zayavka - 878 px, то есть
   на экран телефона он не влезал (не хватало 66 px, а с адресной строкой
   браузера - около 200).

   Что сжато и на сколько:
     · заголовок раздела 18,5 -> 16 px, отбивка под ним 50 -> 18 px;
     · строка «Пора получать» 17 -> 14 px, подпись 13 -> 12 px;
     · внутренние поля коробки 18/16/20 -> 11/12/12 px (минус 40 %);
     · поля ввода 52 -> 42 px, промежутки рядов 12 -> 8 px;
     · «Опишите задачу» 92 -> 60 px;
     · зона документов 92 px фиксированной высоты -> высота по содержимому
       (около 58) и кегли 13/11,5 -> 11,5/10 px;
     · согласия 12,5 -> 11,5 px, кнопка 46 -> 42 px, строка про капчу
       12,5 -> 11 px.

   Кегль полей ввода оставлен 14 px: меньше 16 px iOS и так приближает
   страницу при вводе, уменьшать дальше смысла нет, а читаемость падает.
   Высота поля 42 px - это предел, ниже палец начинает промахиваться;
   буквальные «минус сорок процентов» дали бы 31 px и в поле было бы не
   попасть, поэтому сорок процентов сняты с полей коробки, а высота полей
   ввода урезана на 19 %, зато сокращены промежутки между ними.

   Ничего из формы не убрано: все поля, обе галочки, строка про капчу и
   ссылка на политику на месте, меняются только размеры и отступы.

   Компьютерный вид не затронут: весь раздел стоит в @media (max-width:
   760px), как и раздел 1.14 выше.

   Откат: удалить раздел 2 целиком - телефон вернётся к 878 px. */
@media (max-width: 760px) {

  /* 2.1. Заголовок раздела. Правило перебивает общий кегль заголовков
     блоков (00_obshchee.css) только внутри #zayavka - остальные блоки
     не трогаются.

     ПРАВКА 19.08.2026: 16 -> 20 px, множитель 1,25 -> 1,2.

     Задание Павла в справочнике кеглей телефонной версии
     (C:\Users\Павел\Claude\Projects\Вебсайт\ШРИФТЫ_МОБИЛЬНЫЕ 2.docx,
     таблица «Услуги», строка «Заголовок раздела (H2)»): «20 px сделать
     так все H2». В сводке того же документа заголовок формы заявки
     назван единственным, выпадающим из ряда: у всех разделов было
     18,5 px, у него 16.

     Множитель приведён к общему: у остальных заголовков 1,2, здесь
     стояло 1,25. Теперь и кегль, и межстрочный совпадают со всеми
     разделами - 20 / 24. Отступ под заголовком 18px оставлен: про него
     речи не было, а он держит компактность формы.

     ВАЖНО. Само число 20 у ОСТАЛЬНЫХ заголовков задаётся не здесь, а в
     C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\bloki\00_obshchee.css,
     раздел 3, правило `body.mob .blk[data-b] > h2[data-b], body.mob
     .galp[data-b] > h2[data-b], body.mob .blk.pisma > h2[data-b]` -
     там стоит font-size: 18.5px и его надо поменять на 20px. Этот файл
     чужой, из него правку не делаю.

     Замер на 375 до: 16 / 20. После: 20 / 24.
     Компьютер не задет: раздел 2 стоит в @media (max-width: 760px), на
     1440 заголовок остаётся 28 / 33,6.

     Откат: вернуть font-size 16px и line-height 1.25. */
  #zayavka > h2[data-b] {
    font-size: 20px;
    line-height: 1.2;
    margin-bottom: 18px;
  }

  /* 2.2. Коробка: поля урезаны на 40 %. Заодно на 8 px шире полезная
     ширина - длинные строки складываются в меньшее число строк.
     Откат: вернуть padding 18px 16px 20px (раздел 1.14). */
#zayavka .zkorobka,
.zayavka-blok .zkorobka {
    padding: 11px 12px 12px;
  }

  /* 2.3. Зачин и подпись коробки. Откат: вернуть 17px и 13px.

     ПРАВКА 19.08.2026: зачин 14 -> 16 px. Задание Павла в справочнике
     кеглей телефонной версии, таблица «Форма заявки», строка «Призыв над
     формой»: «Сделать 16 px». Это крупная строка образца «24/7».
     Множитель 1,3 остаётся: межстрочный 18,2 -> 20,8. Выключку не
     трогаем - Павел назвал только размер, строка как стояла слева, так
     и стоит. Подпись под призывом (11,5 px) не трогаем: про неё речи
     не было.

     Замер на 375 до: 14 / 18,2. После: 16 / 20,8.
     Компьютер не задет: на 1440 зачин остаётся 20 / 25.

     Откат зачина: вернуть font-size 14px. */
#zayavka .zzov,
.zayavka-blok .zzov {
    font-size: 16px;
    line-height: 1.3;
    margin-bottom: 3px;
  }
#zayavka .zpodpis,
.zayavka-blok .zpodpis {
    font-size: 12px;
    line-height: 1.35;
    margin-bottom: 10px;
  }

  /* 2.4. Ряды: промежутки 12 -> 8, отбивки между рядами 12/14 -> 8/10.
     Откат: вернуть gap 12px и margin-top 12px/14px (раздел 1.3). */
#zayavka .zryad,
.zayavka-blok .zryad {
    gap: 8px;
  }
#zayavka .zryad--seredina,
.zayavka-blok .zryad--seredina {
    margin-top: 8px;
  }
#zayavka .zryad--niz,
.zayavka-blok .zryad--niz {
    gap: 10px;
    margin-top: 10px;
  }

  /* 2.5. Поля ввода 52 -> 42. Откат: вернуть height 52px. */
#zayavka .zpole input[type="text"],
.zayavka-blok .zpole input[type="text"],
#zayavka .zpole input[type="tel"],
.zayavka-blok .zpole input[type="tel"],
#zayavka .zpole input[type="email"],
.zayavka-blok .zpole input[type="email"] {
    height: 42px;
    padding: 0 12px;
  }
#zayavka .zpole--telefon,
.zayavka-blok .zpole--telefon {
    height: 42px;
  }

  /* Код страны уже, чтобы номеру осталось место при меньшей высоте.
     Откат: вернуть width 84px. */
#zayavka .zpole--telefon .zkod,
.zayavka-blok .zpole--telefon .zkod {
    width: 74px;
    padding: 0 2px 0 10px;
  }

  /* 2.6. «Опишите задачу»: 92 -> 60. Три строки текста видно, дальше
     поле прокручивается и его можно растянуть за уголок.
     Откат: вернуть height 92px. */
#zayavka .zpole textarea,
.zayavka-blok .zpole textarea {
    height: 60px;
    padding: 8px 12px;
  }

  /* 2.7. Зона документов. Павел: «перетаскивать с телефона всё равно не
     будут, там нажимают Выбрать» - поэтому высота больше не задаётся
     числом, зона садится по своему тексту и получается примерно вдвое
     ниже. Сам ярлык и подпись про форматы остаются: это подсказка, что
     и сколько можно приложить. Откат: вернуть height 92px и кегли
     13px/11,5px/18px (раздел 1.6). */
#zayavka .zfajly,
.zayavka-blok .zfajly {
    height: auto;
    min-height: 0;
    gap: 8px;
    padding: 8px 12px;
  }
#zayavka .zfajly-znak,
.zayavka-blok .zfajly-znak {
    font-size: 15px;
  }
#zayavka .zfajly-tekst strong,
.zayavka-blok .zfajly-tekst strong {
    font-size: 11.5px;
    line-height: 1.25;
  }
#zayavka .zfajly-tekst small,
.zayavka-blok .zfajly-tekst small {
    margin-top: 2px;
    font-size: 10px;
    line-height: 1.2;
  }

  /* 2.8. Список выбранных документов - тем же мелким кеглем.
     Откат: вернуть 12,5px (раздел 1.7). */
#zayavka .zstroka-fajla,
.zayavka-blok .zstroka-fajla {
    padding: 4px 8px;
    font-size: 11.5px;
  }

  /* 2.9. Согласия: кегль 12,5 -> 11,5, промежуток 8 -> 6, галочка 15 ->
     14. Текст согласий и ссылка на политику не тронуты.
     Откат: вернуть 12,5px, gap 8px, галочку 15px (раздел 1.8). */
#zayavka .zsoglasiya,
.zayavka-blok .zsoglasiya {
    gap: 6px;
  }
#zayavka .zgalka,
.zayavka-blok .zgalka {
    gap: 6px;
    font-size: 11.5px;
    line-height: 1.3;
  }
#zayavka .zgalka input[type="checkbox"],
.zayavka-blok .zgalka input[type="checkbox"] {
    width: 14px;
    height: 14px;
  }

  /* 2.10. Кнопка 46 -> 42. Откат: вернуть min-height 46px и 14px. */
#zayavka .zknopka,
.zayavka-blok .zknopka {
    min-height: 42px;
    padding: 10px 12px;
    font-size: 13.5px;
  }

  /* 2.11. Строка про защиту капчей и строка ответа сервера. Строка про
     капчу остаётся на месте, только мельче. Откат: вернуть 12,5px и
     margin-top 10px. */
#zayavka .zprimechanie,
.zayavka-blok .zprimechanie {
    margin-top: 8px;
    font-size: 11px;
    line-height: 1.3;
  }
#zayavka .zstatus,
.zayavka-blok .zstatus {
    margin-top: 8px;
    font-size: 12px;
  }

  /* 2.12. Экран «заявка принята» - в тот же кегль. Откат: удалить. */
#zayavka .zuspeh-znak,
.zayavka-blok .zuspeh-znak {
    margin: 2px 0 6px;
    font-size: 26px;
  }
#zayavka .zuspeh-tekst,
.zayavka-blok .zuspeh-tekst {
    font-size: 13.5px;
  }
}


/* ── 3. Телефон: единый мелкий кегль и защита от приближения экрана
       (диктовка Павла 18.08.2026, пункт 18) ────────────────────────────

   Дословно: «во-первых, я кликаю на поле, чтобы завести, оно у меня
   увеличивается, а дальше не уменьшается. Я кликнул, а дальше мне нужно
   руками его уменьшить. И даже когда я нажимаю галочку, что типа всё
   ввёл, оно не уменьшается - это надо поправить. Во-вторых, текст сделать
   меньше, везде текст для мобильной версии здесь одинаковый. Сейчас "ваше
   имя", "телефон", "имейл", "опишите задачу" - явно больше. Единственный
   текст отличается: "Закажите в АкадемПеревод качественные услуги" и "Пора
   получать действительно качественный перевод". Весь остальной текст сильно
   меньше - как сейчас "я периодически пользуюсь услугами перевода". По цвету
   то, что сейчас есть, всё окей».

   ── Почему страница приближалась и не отъезжала обратно ──

   Это поведение Safari на iPhone, а не ошибка вёрстки: если у поля ввода
   кегль меньше 16 px, при касании поля браузер приближает страницу, чтобы
   буквы стали читаемыми, а обратно сам НЕ отъезжает - ни по галочке, ни по
   уходу из поля. Пока кегль полей был 14 px (раздел 2), приближение
   случалось на каждом поле.

   Из двух лекарств выбрано первое:
     1) поднять кегль полей ввода до 16 px - Safari перестаёт приближать
        вообще, страница не «прыгает», масштабирование двумя пальцами для
        людей со слабым зрением сохраняется;
     2) запретить масштабирование метатегом viewport (maximum-scale=1) -
        это правка шаблона, а не этого файла, и она отбирает у человека
        возможность увеличить страницу руками. Отклонено.

   Из-за этого поля ввода - единственное место формы, где кегль не
   уменьшился, а вырос: 14 -> 16 px. Просьбу «сделать текст меньше» это не
   нарушает - подписи в полях (плейсхолдеры «Ваше имя», «Телефон», «Email»,
   «Опишите задачу») уменьшены до общего мелкого кегля 11,5 px, крупным
   набирается только то, что человек печатает сам. Ровно эти четыре подписи
   Павел и называл «явно больше» - их видно на экране, а 16 px появляются
   лишь под пальцем во время ввода.

   ── Единый мелкий кегль ──

   Образец, который Павел назвал правильным, - строка «Я периодически
   пользуюсь услугами перевода»; замер дал 11,5 px. К этому кеглю приведён
   весь текст формы:
     · подпись под зачином («И мы предложим...»)   12   -> 11,5
     · подписи-плейсхолдеры полей                  14   -> 11,5
     · подпись зоны загрузки, строка про форматы   11,5/10 -> 11,5
     · строки выбранных файлов                     11,5 (уже так)
     · обе галочки согласий                        11,5 (уже так, образец)
     · надпись кнопки                              13,5 -> 11,5
     · строка про Yandex SmartCaptcha              11   -> 11,5
     · ответ сервера и экран «заявка принята»      12/13,5 -> 11,5

   Крупнее остаются только два текста, названные Павлом:
     · «Закажите в АкадемПеревод качественные услуги перевода» - 16 px;
     · «Пора получать действительно профессиональный и качественный
       перевод» - 14 px.

   Значки 📎 и ✓ (aria-hidden) - картинки, а не текст, их размеры не
   трогаем.

   Цвета не тронуты ни в одном правиле: Павел сказал, по цвету всё окей.

   Высота блока при этом не выросла: строка про форматы прибавила пару
   пикселей, но их с запасом отыграли уменьшенные подписи и отбивки.

   Компьютерный вид не затронут: весь раздел стоит в @media (max-width:
   760px).

   Откат: удалить раздел 3 целиком - вернутся кегли раздела 2 (поля 14 px)
   и вместе с ними приближение экрана на iPhone. */
@media (max-width: 760px) {

  /* 3.1. Поля ввода - 16 px против приближения экрана на iPhone. Кегль
     задаётся и контейнеру телефона, чтобы номер и код страны наследовали
     его одинаково. Откат: вернуть 14px (раздел 1.4). */
  #zayavka .zpole input[type="text"],
  #zayavka .zpole input[type="tel"],
  #zayavka .zpole input[type="email"],
  #zayavka .zpole textarea,
  #zayavka .zpole--telefon,
  #zayavka .zpole--telefon .zkod {
    font-size: 16px;
  }

  /* 3.2. Подписи внутри полей - общим мелким кеглем. На приближение это не
     влияет: Safari смотрит на кегль самого поля, а не его подписи.
     Откат: удалить правило - подписи станут 16px вместе с полем. */
#zayavka .zpole ::placeholder,
.zayavka-blok .zpole ::placeholder {
    font-size: 11.5px;
  }

  /* 3.3. Подпись под зачином. Откат: вернуть 12px (раздел 2.3). */
#zayavka .zpodpis,
.zayavka-blok .zpodpis {
    font-size: 11.5px;
  }

  /* 3.4. Зона загрузки: подпись и строка форматов - одним кеглем.
     Межстрочный поджат с 1,25 до 1,2: строка форматов от укрупнения
     сложилась в две строки, и зона стала выше (об этом ниже, в 3.7).
     Откат: вернуть 11,5px/10px и межстрочный 1,25/1,2 (раздел 2.7). */
#zayavka .zfajly-tekst strong,
.zayavka-blok .zfajly-tekst strong,
#zayavka .zfajly-tekst small,
.zayavka-blok .zfajly-tekst small {
    font-size: 11.5px;
    line-height: 1.2;
  }

  /* 3.5. Надпись кнопки. Жирность 700 оставлена: кнопка и так выделена
     красным, кеглем её больше не выделяем. Высота кнопки не меняется -
     она задана min-height 42px в разделе 2.10.
     Откат: вернуть 13,5px (раздел 2.10). */
#zayavka .zknopka,
.zayavka-blok .zknopka {
    font-size: 11.5px;
  }

  /* 3.6. Строка про капчу, ответ сервера и экран «заявка принята».
     Откат: вернуть 11px / 12px / 13,5px (разделы 2.11 и 2.12). */
#zayavka .zprimechanie,
.zayavka-blok .zprimechanie,
#zayavka .zstatus,
.zayavka-blok .zstatus,
#zayavka .zuspeh-tekst,
.zayavka-blok .zuspeh-tekst {
    font-size: 11.5px;
    line-height: 1.3;
  }

  /* 3.7. Возврат высоты. Единый кегль сделал строку форматов («До 10
     файлов: PDF, DOC...») крупнее - 10 -> 11,5 px, и она сложилась в две
     строки: зона загрузки выросла с 61 до 78 px, а весь блок с 630 до
     646 px. Павел просил, чтобы блок не рос, поэтому прибавка снята
     отбивками и внутренними полями, а не кеглями:
       · отбивка под заголовком раздела  18 -> 12 px
       · поля коробки                    11/12 -> 10/10 px по вертикали
       · поля зоны загрузки              8 -> 6 px по вертикали
       · межстрочный в зоне загрузки     1,25 -> 1,2 (правило в 3.4)
       · отбивка над строкой форматов    2 -> 1 px
       · отбивка под подписью коробки    10 -> 8 px
       · отбивка над нижним рядом        10 -> 8 px
     Итог замера: 626 px против 630 px до правки - блок стал ниже, как и
     просил Павел.
     Откат: удалить 3.7 - вернутся значения разделов 2.1-2.11, блок
     станет 646 px. */
#zayavka > h2[data-b],
.zayavka-blok > h2[data-b] {
    margin-bottom: 12px;
  }
#zayavka .zkorobka,
.zayavka-blok .zkorobka {
    padding: 10px 12px;
  }
#zayavka .zpodpis,
.zayavka-blok .zpodpis {
    margin-bottom: 8px;
  }
#zayavka .zryad--niz,
.zayavka-blok .zryad--niz {
    margin-top: 8px;
  }
#zayavka .zfajly,
.zayavka-blok .zfajly {
    padding: 6px 12px;
  }
#zayavka .zfajly-tekst small,
.zayavka-blok .zfajly-tekst small {
    margin-top: 1px;
  }
}


/* ── 4. Дочистка системных цветов (18.08.2026, после контроля) ───────────

   Контроль обошёл страницу и собрал элементы, у которых цвет не задан ни
   одним правилом: вычисленное значение rgb(0,0,0) - это не наш чёрный
   #1B1B1B = rgb(27,27,27), а «цвет по умолчанию». Такой элемент берёт
   цвет у системы: в Chrome на компьютере он чёрный, в Safari на iPhone -
   голубой #007AFF. Из-за этого Павел и видел синие места там, где на
   стенде всё выглядело прилично.

   В форме заявки таких мест два, оба мелкие, но чистим их до конца:

   1. Обе галки согласий. Заливку включённой галки рисует accent-color,
      он уже фирменный (раздел 1.8), а вот color у них не задан - от него
      зависит рамка галки и обводка фокуса. Задаём наш чёрный.
   2. Поля-ловушки для роботов (.ztrap). Человек их не видит: коробка
      уведена за левый край экрана на 9999px и обрезана до 1x1. Цвет им
      задаётся не ради вида, а чтобы обход страницы больше не находил на
      главной ни одного элемента с системным цветом - иначе следующий
      контроль снова остановится на них и придётся разбираться заново.

   Кегль, размеры и accent-color не трогаются - только цвет.

   Откат: удалить раздел 4 - оба места вернутся к цвету по умолчанию. */
#zayavka .zgalka input[type="checkbox"],
.zayavka-blok .zgalka input[type="checkbox"],
#zayavka .ztrap input,
.zayavka-blok .ztrap input {
  color: #1b1b1b;
  border-color: #1b1b1b;
}


/* ═══════════════════════════════════════════════════════════════════════
   Правка 19.08.2026: отбивка под H2 приведена к общему ритму
   ───────────────────────────────────────────────────────────────────────
   Диктовка Павла 19.08.2026: расстояние до H2, после H2 и до верхнего
   края следующего видимого элемента должны быть равны - 35 на телефоне,
   70 на компьютере, и мерить от белого края.

   Здесь на телефоне под заголовком стояло 12 точек. Число не случайное:
   раздел 3.7 выше снимал высоту с отбивок, чтобы блок не вырос после
   укрупнения заголовка до 20px («Павел просил, чтобы блок не рос»).
   Сверху над заголовком при этом честные 35 - от белого края блока «Нам
   не всё равно», - и перекос был виден: сверху 35, снизу 12.

   Замер до (375): сверху 35, снизу 12. После: 35 и 35.
   На компьютере уже было 70/70, там ничего не меняется.

   ВНИМАНИЕ. Блок заявки на телефоне становится выше на 23 точки. Это
   прямое следствие нового правила, а не недосмотр: старые 12 точек и были
   тем самым «расстояние снизу меньше, чем сверху». Если Павел решит, что
   компактность формы важнее равенства, откат - одна строка.

   Откат: вернуть `margin-bottom: 12px` (было в разделе 3.7).
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 760px) {
  #zayavka > h2[data-b] {
    margin-bottom: var(--sp-block);
  }
}


/* ═══════════════════════════════════════════════════════════════════════
   Кегль 13: блок заявки (диктовка Павла 20.08.2026)
   ═══════════════════════════════════════════════════════════════════════

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

/* З1. Мелкие строки блока - 13px. Было 11,5px у подписи и строки форматов
   в зоне загрузки, у галочки согласия и ссылки в ней и у примечания про
   капчу.

   Веса: держали правила разделов 3.4-3.6 этого же файла внутри
   @media (max-width: 760px), вес (1,1,1) и (1,1,0); галочка и ссылка кегль
   наследовали. Здесь (1,2,2) и (1,2,1) - перебивают, !important не нужен.

   КНОПКА ОТПРАВКИ ИЗ ЭТОГО СПИСКА УБРАНА 21.08.2026. Была здесь с 20.08,
   но 21.08 Павел принял вид страницы «О компании» целиком, а там кнопки
   всего сайта приведены к одному размеру: 240 x 51,2, кегль 16, - раздел 6
   файла
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\bloki\00_obshchee.css
   Держать кегль кнопки в двух местах нельзя: 13px отсюда (вес 1,2,1)
   перебивал бы 16px оттуда (вес 1,1,1), и на телефоне кнопка «Получить
   расчёт» осталась бы мельче остальных - замер это и поймал. Одно число,
   одно место: размер кнопки живёт в 00_obshchee.css.

   Откат: вернуть строку «body.mob #zayavka .zknopka,» в список - кнопка
   отправки на телефоне снова станет 13px и уже 240 точек. */
body.mob #zayavka .zfajly-tekst strong,
body.mob .zayavka-blok .zfajly-tekst strong,
body.mob #zayavka .zfajly-tekst small,
body.mob .zayavka-blok .zfajly-tekst small,
body.mob #zayavka .zgalka span,
body.mob .zayavka-blok .zgalka span,
body.mob #zayavka .zgalka a,
body.mob .zayavka-blok .zgalka a,
body.mob #zayavka .zprimechanie,
body.mob .zayavka-blok .zprimechanie {
  font-size: var(--kegl-melkij);
}

/* З2. Подсказки в полях формы - 13px (было 11,5px).

   ВАЖНО: кегль меняется у подсказки (::placeholder), а не у самого поля.
   У поля он намеренно оставлен 16px - на меньшем айфон при постановке
   курсора приближает страницу, и человек проваливается в форму. Об этом
   прямо сказано в шапке той же таблицы книги замера, и Павел правил
   строки «Подсказка в поле …», то есть именно placeholder.

   Вес: раздел 3.2 этого же файла, `#zayavka .zpole ::placeholder` (1,1,1).
   Здесь (1,2,2).

   Откат: удалить З2 - подсказки вернутся к 11,5px. */
body.mob #zayavka .zpole ::placeholder,
body.mob .zayavka-blok .zpole ::placeholder {
  font-size: var(--kegl-melkij);
}

/* З3. Призыв и подпись над формой - ВЕРНУЛИСЬ 07.09.2026.

   БЫЛО (18.08.2026). Обе строки прятались на телефоне: Павел про них
   тогда сказал «убрать этот текст совсем».

   СТАЛО (07.09.2026, разбор блока заявки на юридическом переводе).
   Павел: «на мобильной оставим "Оставьте заявку, и мы подберём
   юридических переводчиков под Ваш проект" - ту, которая непосредственно
   интегрирована в форму». Речь ровно про эти две строки: призыв .zzov
   («Оставьте заявку») и подпись .zpodpis («И мы подберём...»).

   Прежнее правило было тем более вредным, что прятало строки через
   display: none - то есть и от поисковика тоже. У блока остаётся
   заголовок и левый текст, скрытые приёмом visually-hidden (их
   поисковик читает), а вот эти две строки пропадали из мобильной
   версии совсем. Google индексирует сайт по мобильной версии, значит
   текст терялся и в поиске.

   Откат: вернуть display: none - строки снова исчезнут с телефона. */