/* ═══════════════════════════════════════════════════════════════════════
   Подвал
   ──────
   Колонки ссылок, контакты, реквизиты, карта. Живёт на всех страницах.

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

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

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

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


/* ═══════════════════════════════════════════════════════════════════════
   ПОДВАЛ ОДИН В ОДИН С ДЕЙСТВУЮЩИМ САЙТОМ (задание Павла 18.08.2026)

   «Мы это всё очень долго обрабатывали, согласовывали, подгоняли. Нужно
   сделать так, никак иначе».

   Все числа ниже - замер academperevod.ru в окне 1440x900, 18.08.2026.
   Рядом с каждым разделом написано, что именно замерено.

   ГДЕ ЛЕЖИТ ПОДВАЛ. За пределами «.device», сразу после закрывающих его
   тегов - и в base.html, и в home_page.html. Так сделано по правке Павла
   18.08.2026: «подвал, карта и бегущая строка у нас во всю длину экрана».
   Внутри «.device» этого не добиться: там ширина сайта (1212px) и
   «overflow-x: clip» (shapka.css, раздел 27), который обрезает всё, что
   шире, - проверено снимком.

   Поэтому здесь НЕТ никаких растяжек на 100vw и отрицательных полей:
   подвал - прямой ребёнок «body» и уже занимает всю ширину сам. Во всю
   ширину идут фон, полоса языков и карта; колонки стоят в колонке сайта
   по центру (обёртка .pobolochka).

   ВАЖНО ПРО ПОРЯДОК ФАЙЛОВ. На главной этот файл подключается в base.html
   РАНЬШЕ, чем эталон и glavnaya.css (они идут в extra_css). Поэтому там,
   где эталон бьётся за то же свойство, селектор здесь написан сильнее -
   с приставкой `body` и тегом. Проверено замером на живой странице.

   ПОЛОСКА ФЛАГОВ. Флаги бегущей строки лежат одной картинкой
   home/static/img/podval/flagi.webp: 56 клеток по 40px (на экране 20px),
   порядок клеток записан в KLETKI_FLAGOV в home/models.py. Появится в
   справочнике язык с новым флагом - полоску надо пересобрать и дописать
   его код в KLETKI_FLAGOV; до тех пор язык покажется без флага.

   Откат всего раздела: удалить всё ниже этой рамки и вернуть
   parts/podval.html из git.
   ═══════════════════════════════════════════════════════════════════════ */


/* ── 1. Подвал целиком ──────────────────────────────────────────────────

   Замер: отступ сверху 60px, поля 0 0 50px, фон #333539, ширина - во всю
   ширину экрана.

   Про отступ сверху. Эталонные 60px считаются от содержимого страницы, а
   у «.wrap» снизу остаётся собственное поле 4rem (64px) - оно теперь не
   съедается подвалом, потому что подвал стоит за «.wrap». Отсюда
   calc(60px - 4rem) = -4px: 64 - 4 = ровно 60. Поменяется поле «.wrap» в
   эталоне - поменять и здесь.

   Откат: поставить margin-top: 60px (промежуток станет 124px). */
body footer.podval {
  margin: calc(60px - 4rem) 0 0;
  padding: 0 0 50px;
  background: #333539;
  color: #fff;
  border: 0;
}

/* Обёртка колонок. На действующем сайте это `.container`: 1200px с полями
   по 10px, то есть содержимое ровно в 1180px - ширина сайта. */
body footer.podval .pobolochka {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 10px;
}


/* ── 2. Бегущая строка языков ───────────────────────────────────────────

   Замер: высота 72px, поля 25px сверху и 21px снизу, подложка
   rgba(17,55,129,.05) поверх тёмного фона, обрезка по краям.

   Две ленты одинаковой длины бегут по одной дорожке со сдвигом в
   половину круга: первая идёт от +100% до -100%, вторая от 0 до -200%, у
   второй задержка -100s. Пока одна уходит влево, вторая догоняет справа,
   и разрыва не видно. Круг - 200 секунд, как на действующем сайте.

   `flex: 0 0 auto` держит ленту во всю длину содержимого: без него
   flexbox сжал бы её по ширине дорожки и текст полез бы наружу.

   Языки приходят из справочника кабинета «Языки в подвале».

   Откат: удалить раздел 2 - строка исчезнет вместе с языками. */
body footer.podval .pstroka {
  display: flex;
  overflow: hidden;
  padding: 25px 0 21px;
  background: rgba(17, 55, 129, .05);
}

body footer.podval .plenta {
  flex: 0 0 auto;
  white-space: nowrap;
  font-size: 20px;
  line-height: 1.3;
  animation: podval-lenta 200s linear infinite;
  animation-delay: -200s;
}

body footer.podval .plenta2 {
  animation-name: podval-lenta2;
  animation-delay: -100s;
}

@keyframes podval-lenta {
  from { transform: translateX(100%); }
  to   { transform: translateX(-100%); }
}

@keyframes podval-lenta2 {
  from { transform: translateX(0); }
  to   { transform: translateX(-200%); }
}

/* Один язык: поля по 15px, обычное начертание, белый.

   Строчный (inline), а не строчно-блочный: у действующего сайта это
   строчный span, и высота строки выходит ровно 72px. Со строчно-блочным
   и выравниванием по середине строка становилась на пиксель выше. */
body footer.podval .pyaz {
  padding: 0 15px;
  font-size: 20px;
  line-height: 24px;
  font-weight: 400;
  color: #fff;
}

/* Флаг - клетка картинки-полоски, номер клетки приходит из разметки в
   `--f`. Один запрос вместо 59.
   Замер: 20x20, сдвиг вниз на 2px (на действующем сайте это эмодзи,
   которое WordPress подменяет картинкой 20x20 с vertical-align -.1em). */
body footer.podval .pflag {
  display: inline-block;
  width: 20px;
  height: 20px;
  vertical-align: -2px;
  background-image: url("../../../img/podval/flagi.a72b56925d86.webp");
  background-repeat: no-repeat;
  background-size: 1120px 20px;
  background-position: calc(var(--f) * -20px) 0;
}

/* Системная настройка «уменьшить анимацию»: строка стоит.
   Вторая лента при этом стоит за краем дорожки и не мешает - её прячем,
   чтобы список языков не оказался в разметке дважды без пользы.
   Откат: удалить это правило (строка побежит у всех). */
@media (prefers-reduced-motion: reduce) {
  body footer.podval .plenta { animation: none; }
  body footer.podval .plenta2 { display: none; }
}


/* ── 3. Карта Яндекса ───────────────────────────────────────────────────

   Замер: во всю ширину экрана, высота 403px (кадр 400px плюс 3px - на
   действующем сайте кадр лежит в абзаце и снизу остаётся место под
   выносные элементы строки; повторено числом).

   Кадр появляется не сразу: его ставит js/site/podval.js, когда подвал
   показался на экране. До этого видна заглушка цвета карты - страница не
   тянет виджет Яндекса, пока читают верх.

   `pointer-events: none` у кадра - чтобы колесо мыши прокручивало
   страницу, а не масштабировало карту. По щелчку карта оживает.

   Хост карт вписан в политику безопасности (frame-src в
   pilotsite/settings/base.py) - без этого браузер кадр не покажет.

   Откат: удалить раздел 3 и подключение podval.js в base.html. */
body footer.podval .pkarta {
  position: relative;
  height: 403px;
  overflow: hidden;
  cursor: help;
  background: #e9e6e1;
}

body footer.podval .pkarta-kadr {
  display: block;
  width: 100%;
  height: 400px;
  border: 0;
  pointer-events: none;
}

body footer.podval .pkarta-kadr.pkarta-zhivaya {
  pointer-events: auto;
}

/* Подсказка ходит за указателем, пока карта не разбужена. */
body footer.podval .pkarta-podskazka {
  position: absolute;
  z-index: 5;
  display: none;
  padding: 5px 20px;
  border: 1px solid #ccc;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 0 5px rgba(0, 0, 0, .25);
  color: #1b1b1b;
  font-size: 14px;
  line-height: 21px;
  white-space: nowrap;
  pointer-events: none;
}


/* ── 4. Сетка колонок ───────────────────────────────────────────────────

   Замер: grid-template-columns 22% / 23% / 30% / 25%, padding-top 30px.
   Пятая клетка - полоса отзывов, она занимает колонки 1-3 (раздел 7).

   Откат: удалить раздел 4 - колонки встанут друг под другом. */
body footer.podval .psetka {
  display: grid;
  grid-template-columns: 22% 23% 30% 25%;
  padding-top: 30px;
}

body footer.podval .pkolonka {
  margin-bottom: 13px;
  min-width: 0;
}

/* Заголовок колонки: 16px жирный белый, отступ снизу 20px.
   Высота строки ровно по кеглю (замер действующего сайта: 16px) - иначе
   вся колонка съезжает вниз на три пиксела. */
body footer.podval .pzagolovok {
  margin: 0 0 20px;
  font-size: 16px;
  line-height: 1;
  font-weight: 700;
  color: #fff;
}

/* Ссылки меню: 15px/30px, начертание 500, белые, без подчёркивания.
   Цвет прописан сильным селектором намеренно: в shapka.css есть правило
   `body .podval a, body footer a { color: var(--cvet-bordo) }` - без
   этого ссылки подвала стали бы бордовыми на тёмном фоне. */
body footer.podval .pmenyu {
  margin: 0;
  padding: 0;
  list-style: none;
}

body footer.podval .pmenyu li {
  text-align: left;
  font-size: 15px;
  line-height: 30px;
  font-weight: 500;
}

body footer.podval .pmenyu a,
body footer.podval .pmenyu span {
  color: #fff;
  text-decoration: none;
  transition: color .2s;
}

body footer.podval .pmenyu a:hover,
body footer.podval .pmenyu a:focus-visible {
  color: #afafaf;
}


/* ── 5. Контактная колонка ──────────────────────────────────────────────

   Замер: логотип около 207x55, поля -10px сверху и 15px снизу; описание
   14px/1,2 белым, поле справа 30px, отступ снизу 20px; телефон 20px/30px
   жирный; почта 14px/21px; адрес 14px/21px с полями 12px сверху и снизу;
   «Карта проезда» 14px/21px жирная.

   ЛОГОТИП - СВЕТЛАЯ ВЕРСИЯ НОВОГО ЗНАКА, БЕЗ ПЛАШКИ.

   Как пришли к этому. Павел велел поставить в подвал тот же знак, что в
   шапке. Знак цветной: «Академ» бордовый, «Перевод» синий, обе краски
   тёмные, а файл - белый прямоугольник без прозрачности. На тёмно-сером
   #333539 он либо тонет, либо (если оставить белый фон) выглядит
   заплаткой. Промежуточным решением знак стоял на белой плашке.

   18.08.2026 собрали светлую версию из цветной: img/logotip-svetlyj.webp,
   знак перекрашен в почти белый #F5F6F7, фон прозрачный, края мягкие.
   Плашка стала не нужна - знак лежит прямо на фоне подвала.

   Проверено замером: на #333539 читаются все буквы, засечки и оба
   уголка, в том числе в настоящем размере 207px.

   ПРО РАЗМЕР. Ширина оставлена эталонная - max-width 70% от колонки, то
   есть ровно 207px. Высота при этом выходит 35px, а не 55px, как было со
   старым знаком: у нового другая пропорция (1200x204 против 840x224), и
   одновременно 207 в ширину и 55 в высоту он может быть только
   растянутым. Растягивать знак нельзя.

   Плашки под логотипами площадок отзывов (раздел 7) пока остаются: те
   логотипы цветные, светлых версий у нас нет - это отдельный вопрос.

   Откат: вернуть src на img/logotip.webp в parts/podval.html и дописать
   сюда background:#fff, padding:9px 14px, border-radius:6px,
   box-sizing:border-box. */
/* 19.08.2026. Павел вернул прежний логотип, а у него другая пропорция:
   840:224 = 3,75 против 5,88 у знака, который стоял до этого. Ширина в
   правиле осталась прежней - и высота знака выросла с 42,7 до 66,9, подвал
   поехал. Поэтому теперь задаём ВЫСОТУ, а ширину считает браузер: при смене
   логотипа поедет ширина (её есть куда девать), а не высота строки.
   Откат: вернуть width: 100% и снять height. */
body footer.podval .plogotip {
  display: block;
  width: auto;
  height: 42.7px;
  /* 251px, а не прежние 70% колонки (207px) - решение Павла 18.08.2026.
     Высота считается сама и выходит около 43px: у нового знака пропорция
     1200:204, то есть 5,88 - при ширине 207 он давал всего 35 в высоту и
     смотрелся мелко рядом с текстом. Растягивать нельзя, поэтому крупнее
     он становится только шириной. Откат: вернуть max-width: 70%. */
  max-width: 251px;
  height: auto;
  margin: -10px 0 15px;
}

body footer.podval .popisanie {
  margin: 0 0 20px;
  padding-right: 30px;
  font-size: 14px;
  line-height: 1.2;
  color: #fff;
}

/* Строки контактов. Вид задан по адресу ссылки, а не по её номеру:
   переставят пункты в кабинете - оформление не поедет. */
body footer.podval .pkontakty a,
body footer.podval .pkontakty span {
  display: block;
  color: #fff;
  font-size: 14px;
  line-height: 21px;
  text-decoration: none;
  transition: color .2s;
}

/* Наведение - только при настоящем курсоре (решение Павла 08.09.2026,
   правило 4.5 в bloki/00_obshchee.css: на сенсорном экране :hover не
   отпускает и залипает после касания).

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

   Обход клавишей отделён: он обязан работать на любом устройстве.
   Откат: снять @media. */
body footer.podval .pkontakty a:focus-visible {
  color: #afafaf;
}

@media (hover: hover) and (pointer: fine) {
  body footer.podval .pkontakty a:hover {
    color: #afafaf;
  }
}

body footer.podval .pkontakty .ptelefon {
  margin-bottom: 12px;
  font-size: 20px;
  line-height: 30px;
  font-weight: 700;
}

body footer.podval .pkontakty .ppochta {
  font-weight: 400;
}

body footer.podval .pkontakty .padres {
  margin: 12px 0;
  font-weight: 400;
}

body footer.podval .pkontakty .pproezd {
  font-weight: 700;
}

/* Кнопка «Заказать перевод»: замер 161,8x51,6, поля 15px и 20px, рамка
   1px белая, скругление 5px, фон прозрачный, начертание 500.

   Кегль 14px, а не 15px. В задании стояло 15px - столько написано в
   правиле стилей действующего сайта, но там же кнопке достаётся класс
   popup-btn, и на экране кегль выходит 14px. Взято то, что видно
   глазом: 14px и высота строки 140% дают ровно 51,6px высоты.

   Ширина не закреплена числом: надпись приходит из кабинета, и жёсткие
   162px обрезали бы её, поменяй Павел текст.

   Откат: вернуть font-size 15px. */
body footer.podval .pkontakty .pknopka {
  display: block;
  width: fit-content;
  margin: 12px 0 25px;
  padding: 15px 20px;
  border: 1px solid #fff;
  border-radius: 5px;
  background: none;
  box-shadow: none;
  color: #fff;
  font-size: 14px;
  line-height: 140%;
  font-weight: 500;
  cursor: pointer;
  transition: color .2s, border-color .2s;
}

/* Наведение - только при настоящем курсоре (решение Павла
   08.09.2026, правило 4.5 в bloki/00_obshchee.css: на сенсорном
   экране :hover не отпускает и залипает после касания).
   Откат: снять @media. */
body footer.podval .pkontakty .pknopka:focus-visible {
  color: #afafaf;
  border-color: #afafaf;
}

@media (hover: hover) and (pointer: fine) {
  body footer.podval .pkontakty .pknopka:hover {
    color: #afafaf;
    border-color: #afafaf;
  }
}


/* ── 6. Значки: сети, ISO, оплата ───────────────────────────────────────

   Замер: ВКонтакте и Одноклассники - кнопки 45x45 со скруглением 10px,
   фон #0077FF и #EE8208, значок высотой 35 и 30; знак ISO 50x50 со
   сдвигом (влево 15px, вверх -5px); платёжные значки одной картинкой во
   всю ширину колонки, около 295x23.

   Адреса сетей - поля комплекта контактов в кабинете; поле пустое -
   значка нет вовсе.

   Откат: удалить раздел 6. */
body footer.podval .pdannye {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 20px;
}

body footer.podval .psoc {
  display: flex;
  gap: 10px;
  margin: 15px 0 -5px;
}

body footer.podval .psoc a {
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  border-radius: 10px;
  transition: opacity .3s;
}

/* Наведение - только при настоящем курсоре (решение Павла 08.09.2026,
   правило 4.5 в bloki/00_obshchee.css: на сенсорном экране :hover не
   отпускает и залипает после касания). Откат: снять @media. */
@media (hover: hover) and (pointer: fine) {
  body footer.podval .psoc a:hover {
    opacity: .9;
  }
}

body footer.podval .psoc-vk { background: #0077ff; }
body footer.podval .psoc-ok { background: #ee8208; }

body footer.podval .psoc a svg {
  display: block;
  width: auto;
  height: 35px;
}

/* Знак Одноклассников ниже знака ВКонтакте: в самом контуре меньше
   свободных полей. Селектор с тегом `a` намеренно - иначе правило выше
   («a svg») оказывается сильнее и высота остаётся 35px. */
body footer.podval .psoc a.psoc-ok svg {
  height: 30px;
}

body footer.podval .piso {
  width: 50px;
  height: 50px;
  margin-left: 15px;
  margin-top: -5px;
}

/* `min-width: 0` - иначе картинка своей шириной 506px не даёт колонке
   сжаться на узком окне и внизу страницы появляется горизонтальная
   прокрутка. */
body footer.podval .poplata {
  width: 100%;
  min-width: 0;
  height: auto;
  margin-bottom: -20px;
}


/* ── 7. Полоса «Отзывы клиентов» ────────────────────────────────────────

   Замер: пятая клетка сетки, занимает колонки 1-3 (835px), отступ сверху
   -60px и поле справа 50px. Подпись 14px жирная по центру, отступ снизу
   5px. Площадки в строку с промежутком 40px: логотип высотой 25px, под
   ним оценка 14px жирная.

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

   Размер логотипа последней площадки отдельным правилом больше не
   задаётся: на действующем сайте это была особенность одного файла, а у
   нас набор берётся из кабинета и может меняться.

   `min-width: 0` обязателен. Клетка сетки по умолчанию не даёт сжать
   себя уже содержимого, а внутри - логотипы в строку. На узком окне
   полоса распирала колонку и внизу появлялась горизонтальная прокрутка
   (поймано замером при окне 375).

   Откат: удалить раздел 7. */
body footer.podval .potzyvy {
  grid-column: 1 / 4;
  margin-top: -60px;
  margin-right: 50px;
  min-width: 0;
}

body footer.podval .potzyvy-podpis {
  display: block;
  margin-bottom: 5px;
  color: #fff;
  text-align: center;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}

body footer.podval .potzyvy-ryad {
  display: flex;
  flex-wrap: nowrap;
  gap: 40px;
  justify-content: space-between;
  align-items: flex-end;
}

/* Высота строки по кеглю: логотип стоит на базовой линии, и лишний
   межстрочный запас поднимал бы полосу. */
body footer.podval .potzyvy-punkt {
  min-width: 0;
  line-height: 1;
  text-align: center;
}

/* ЛОГОТИПЫ ПЛОЩАДОК СТОЯТ НА БЕЛЫХ ПЛАШКАХ.

   Причина. На действующем сайте в подвале лежали отдельные белые версии
   логотипов - специально нарисованные под тёмный фон. Павел велел брать
   логотипы из кабинета, те же, что наверху главной, а они цветные и
   рассчитаны на белый фон блока отзывов: «Яндекс», «2ГИС», «ZOON» и
   «Справочник Москвы» на тёмно-сером почти не читаются (проверено
   снимком).

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

   Другой вариант - попросить у Павла белые версии логотипов площадок и
   класть их прямо на тёмное, как было на действующем сайте. Тогда
   плашки убрать.

   Откат: удалить background/padding/border-radius у картинки. */
body footer.podval .potzyvy-punkt img {
  display: block;
  box-sizing: content-box;
  width: 100%;
  height: 25px;
  max-height: 50px;
  padding: 6px 10px;
  border-radius: 5px;
  background: #fff;
  object-fit: contain;
}

/* У файлов Zoon и СПР поля внутри самой картинки - им свой размер.
   Так же сделано в блоке отзывов наверху главной (glavnaya.css, 18). */
body footer.podval .potzyvy-punkt img[alt*="Zoon" i],
body footer.podval .potzyvy-punkt img[alt*="СПР" i] {
  height: 19px;
  padding: 9px 10px;
}

body footer.podval .potzyvy-imya {
  display: block;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}

body footer.podval .potzyvy-ocenka {
  display: block;
  margin-top: 6px;
  color: #fff;
  text-align: center;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}


/* ── 8. Нижняя строка ───────────────────────────────────────────────────

   Замер: линия сверху 1px белая, отступ сверху 25px, поле сверху 50px,
   текст по центру белый 16px.

   Откат: удалить раздел 8. */
body footer.podval .pniz {
  margin-top: 50px;
  padding-top: 25px;
  border-top: 1px solid #fff;
  color: #fff;
  text-align: center;
  font-size: 16px;
  line-height: 1;
}


/* ── 9. Телефон и узкие окна ────────────────────────────────────────────

   Задание: «на телефоне подвал складывается в одну колонку и не
   ломается». Отдельную мобильную вёрстку Павел отложил (18.08.2026:
   «мобильное меню потом посмотрим, давай сначала десктоп до конца
   доработаем») - здесь ровно столько, чтобы ничего не разъезжалось.

   `body.mob` - это рамка телефона на стенде: окно широкое, а сайт внутри
   узкий, и медиазапрос по ширине окна там не срабатывает. Поэтому оба
   селектора идут вместе.

   Откат: удалить раздел 9. */
@media (max-width: 992px) {
  body footer.podval {
    margin-top: calc(30px - 4rem);
    padding: 20px 0;
  }

  body footer.podval .psetka {
    grid-template-columns: minmax(0, 1fr);
    padding-top: 0;
  }

  body footer.podval .pkontaktnaya { order: 1; }
  body footer.podval .pkolonka:not(.pkontaktnaya) { order: 3; }
  body footer.podval .potzyvy { order: 2; }

  /* Карта на узких окнах. Здесь стояло `display: none` - карту спрятали,
     когда собирали подвал, и на телефоне её не осталось совсем. Павел
     18.08.2026: «карты я не вижу в мобильной версии - карту Яндекса тоже
     обязательно добавить». Размеры подобраны в разделе 10.
     Откат: вернуть `body footer.podval .pkarta { display: none; }`. */

  body footer.podval .pstroka {
    margin-bottom: 20px;
    border-bottom: 1px solid #fff;
  }

  body footer.podval .pyaz {
    font-size: 16px;
    line-height: 16px;
  }

  body footer.podval .plenta {
    font-size: 16px;
  }

  body footer.podval .plogotip {
    /* на телефоне высота была 36,2 - держим её тем же способом, что и на
       компьютере (см. разбор выше). Откат: вернуть max-width: 60%. */
    width: auto;
    height: 36.2px;
    max-width: 100%;
    margin: 10px 0 15px;
  }

  body footer.podval .pmenyu li {
    font-size: 14px;
    line-height: 25px;
  }

  body footer.podval .pdannye {
    margin-top: 40px;
  }

  body footer.podval .psoc {
    margin: 0;
  }

  body footer.podval .psoc a {
    width: 40px;
    height: 40px;
  }

  body footer.podval .psoc a.psoc-vk svg { height: 28px; }
  body footer.podval .psoc a.psoc-ok svg { height: 23px; }

  /* Полоса отзывов: логотипы в узкое окно в строку не влезают - едут
     вбок пальцем, как на действующем сайте. */
  body footer.podval .potzyvy {
    grid-column: auto;
    margin: 30px 0 10px;
  }

  body footer.podval .potzyvy-ryad {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 12px;
    margin-bottom: -12px;
  }

  body footer.podval .potzyvy-punkt {
    flex: 0 0 22%;
  }

  body footer.podval .pniz {
    margin-top: 30px;
    padding: 10px 0 0;
    font-size: 14px;
  }
}

/* Рамка телефона на стенде. Подвал стоит за «.device», то есть за рамкой
   телефона, и во всю ширину окна - так и надо: на настоящем телефоне
   рамки нет, а полоса языков и карта идут во всю ширину экрана. */
body.mob footer.podval {
  margin-top: 30px;
  padding: 20px 0;
}

body.mob footer.podval .psetka {
  grid-template-columns: minmax(0, 1fr);
  padding-top: 0;
}

body.mob footer.podval .pkontaktnaya { order: 1; }
body.mob footer.podval .pkolonka:not(.pkontaktnaya) { order: 3; }
body.mob footer.podval .potzyvy {
  order: 2;
  grid-column: auto;
  margin: 30px 0 10px;
}

/* Здесь тоже стояло `display: none` для карты - убрано по той же диктовке
   Павла 18.08.2026, размеры в разделе 10.
   Откат: вернуть `body.mob footer.podval .pkarta { display: none; }`. */

body.mob footer.podval .potzyvy-ryad {
  overflow-x: auto;
  padding-bottom: 12px;
  margin-bottom: -12px;
}

body.mob footer.podval .potzyvy-punkt { flex: 0 0 22%; }

body.mob footer.podval .pyaz {
  font-size: 16px;
  line-height: 16px;
}

/* Лента бегущей строки длиннее экрана - так и задумано, её подрезает
   дорожка. Но в режиме телефона эталонный dvizhok.css ставит всему
   внутри «.wrap» ограничение `max-width: 100%`; подвал теперь стоит за
   «.wrap», и правило его не задевает - но оставлено на случай, если
   подвал когда-нибудь вернут внутрь.
   Откат: удалить правило. */
body.mob footer.podval .plenta {
  max-width: none;
  font-size: 16px;
}

body.mob footer.podval .pniz {
  margin-top: 30px;
  padding: 10px 0 0;
  font-size: 14px;
}


/* ── 10. Телефон: лента языков и карта (диктовка Павла 18.08.2026) ───────

   Дословно: «Лента языков для мобильной версии - существенно меньше. И
   карты я не вижу в мобильной версии - карту Яндекса тоже обязательно
   добавить».

   ЛЕНТА ЯЗЫКОВ. Замер до правки, окно 375: дорожка 70 px высотой, поля
   25 сверху и 21 снизу, язык 16 px. На телефоне это широкая полоса ради
   одной строки бегущего текста. Стало: язык 12 px, флаг 15x15, поля по
   9 и 8 px - дорожка около 36 px, то есть вдвое ниже. Сама анимация,
   обе ленты и порядок языков не тронуты.

   КАРТА. Это был дефект: карту спрятали на телефоне двумя правилами
   `display: none` (раздел 9 и блок «рамка телефона на стенде») - оба
   убраны выше, с пометками. Ленивая загрузка кадра сохранена как была:
   кадр ставит js/site/podval.js, когда до подвала долистали
   (IntersectionObserver, запас 300px), файл не менялся вовсе.

   Высота кадра на телефоне 200 px вместо 400: на экране 812 px кадр в
   400 занял бы ровно половину, 200 - четверть, и на такой карте видно
   и точку офиса, и соседние улицы. Коробка карты 200 px вместо 403:
   лишние 3 px на действующем сайте были запасом под выносные элементы
   строки, здесь кадр стоит блоком и запас не нужен.

   Компьютерный вид не затронут: раздел стоит в @media (max-width: 992px),
   плюс те же числа продублированы для «body.mob» - рамки телефона на
   стенде, где окно широкое, а сайт внутри узкий, и медиазапрос по ширине
   окна не срабатывает (так же устроен раздел 9).

   Откат: удалить раздел 10 и вернуть два `display: none` для .pkarta -
   лента станет прежней, карта снова исчезнет с телефона. */
@media (max-width: 992px) {

  /* 10.1. Дорожка языков ниже: поля 25/21 -> 9/8.
     Откат: вернуть padding 25px 0 21px (раздел 2). */
  body footer.podval .pstroka {
    padding: 9px 0 8px;
  }

  /* 10.2. Язык мельче: 16 -> 12 px, поля по бокам 15 -> 10 px.
     Откат: вернуть font-size 16px, line-height 16px, padding 0 15px. */
  body footer.podval .pyaz {
    padding: 0 10px;
    font-size: 12px;
    line-height: 18px;
  }

  body footer.podval .plenta {
    font-size: 12px;
    line-height: 18px;
  }

  /* Флаг вслед за кеглем: 20 -> 15. Полоска флагов одна на все языки,
     поэтому меняется и её масштаб, и шаг клетки.
     Откат: вернуть 20x20, background-size 1120px 20px и шаг -20px. */
  body footer.podval .pflag {
    width: 15px;
    height: 15px;
    vertical-align: -2px;
    background-size: 840px 15px;
    background-position: calc(var(--f) * -15px) 0;
  }

  /* 10.3. Карта: кадр 400 -> 200, коробка 403 -> 200.
     Откат: удалить эти два правила - вернутся 403 и 400 из раздела 3. */
  body footer.podval .pkarta {
    height: 200px;
  }

  body footer.podval .pkarta-kadr {
    height: 200px;
  }
}

/* 10.4. Те же числа для рамки телефона на стенде. Откат: удалить 10.4. */
body.mob footer.podval .pstroka {
  padding: 9px 0 8px;
}

body.mob footer.podval .pyaz {
  padding: 0 10px;
  font-size: 12px;
  line-height: 18px;
}

body.mob footer.podval .plenta {
  font-size: 12px;
  line-height: 18px;
}

body.mob footer.podval .pflag {
  width: 15px;
  height: 15px;
  background-size: 840px 15px;
  background-position: calc(var(--f) * -15px) 0;
}

body.mob footer.podval .pkarta {
  height: 200px;
}

body.mob footer.podval .pkarta-kadr {
  height: 200px;
}

/* ── 10.5. Телефон: названия языков в бегущей строке мельче ────────────

   Правка Павла 08.09.2026, замечание 30: «бегущую строку с языками
   (финский, французский, хорватский) сделать в два раза меньше. Флаги
   можно оставить как есть, а названия языков - в два раза меньше».

   Флаги оставлены прежними - 15×15, как и просил Павел.

   Про «в два раза». Названия были 12 точек (замер 08.09.2026 на телефоне
   375). Ровно вдвое - это 6 точек: рядом с флагом 15 точек такая подпись
   уже не читается, это не мельче, а неразборчиво. Поставлено 9 точек -
   заметно мельче прежнего (строка языка стала 15 точек в высоту вместо
   18), но название ещё читается. Если Павел решит, что нужно ровно
   вдвое, здесь меняется одно число.

   Откат: удалить раздел - вернутся 12 точек. */
body.mob footer.podval .pyaz {
  font-size: 9px;
  line-height: 15px;
}

body.mob footer.podval .plenta {
  font-size: 9px;
  line-height: 15px;
}

/* ── 10.6. Карта под заглушкой «Открыть карту» ─────────────────────────

   Правка Павла 08.09.2026, замечание 29: «сделаем заглушку "Открыть
   карту": человек кликает - загружается карта, и карта двигается здесь
   же, на нашем сайте».

   Заглушку рисует js/site/podval.js. Пока её не нажали, чужой виджет не
   грузится вовсе - это 15 запросов и 721 КБ на каждой странице (замер
   08.09.2026, телефон, медленный 4G).

   Открытая карта сразу рабочая: прежняя пара «сначала показать, потом
   разбудить нажатием» больше не нужна, и подсказка «Нажмите на карту,
   чтобы её активировать» уходит вместе с ней.

   Откат: удалить раздел и вернуть прежний podval.js - карта снова будет
   грузиться сама при появлении подвала на экране. */
body footer.podval .pkarta-zaglushka {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: #e9e6e1;
  text-align: center;
}

body footer.podval .pkarta-podpis {
  margin: 0;
  font-size: 15px;
  line-height: 1.3;
  color: #54595f;
}

body footer.podval .pkarta-knopka {
  font: 650 15px/1.2 Inter, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: #fff;
  background: #8c1821;
  border: 0;
  border-radius: 8px;
  padding: 12px 24px;
  cursor: pointer;
  box-shadow: 0 3px 0 0 #6d131a;
}

/* Наведение - только при настоящем курсоре (решение Павла
   08.09.2026, правило 4.5 в bloki/00_obshchee.css: на сенсорном
   экране :hover не отпускает и залипает после касания).
   Откат: снять @media. */
@media (hover: hover) and (pointer: fine) {
  body footer.podval .pkarta-knopka:hover {
    filter: brightness(1.1);
  }
}

body footer.podval .pkarta-knopka:focus-visible {
  outline: 2px solid #8c1821;
  outline-offset: 3px;
}

/* Гнездо больше не подсказывает «нажмите на карту» - нажимают кнопку. */
body footer.podval .pkarta {
  cursor: default;
}

body.mob footer.podval .pkarta-knopka {
  font-size: 14px;
  padding: 10px 20px;
}