/* Правки главной по диктовке Павла 13.08.2026.

   Файл идёт после эталонных стилей и перебивает их точечно. Сам эталон не
   трогаем: он заморожен и на него ссылается манифест контрольных сумм.

   Что здесь:

   1. Плашки первого экрана: цифра по центру, все шесть одной высоты.
   2. Полоса под кнопками: четыре плашки одной высоты, а не вразнобой.
   3. Границы блоков - тенью, как на боевом сайте: фон белый, рамки нет,
      тень падает снизу, слева и справа, а верх сливается с фоном. Образец -
      блок «Услуги нашего бюро переводов с нотариальным заверением» на
      academperevod.ru. */

/* ── 1. Плашки первого экрана ─────────────────────────────────────────── */

/* Цифра по левому краю. Сначала поставил по центру, Павел посмотрел и решил
   иначе: «либо всё слева, либо всё по центру» - и выбрал слева, потому что
   текст под цифрой тоже слева. */
.hero .pl .pnum {
  display: block;
  text-align: left;
}

/* Все шесть плашек одной высоты: сетка растягивает их по строке, а внутри
   содержимое прижато к верху. Иначе высота плашки зависела от длины текста,
   и правая колонка не сходилась с левой. */
.hero .hright {
  align-items: stretch;
}

.hero .pl {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.hero .pl .pltog {
  flex: 0 0 auto;
}

/* ── 2. Полоса плашек под кнопками ────────────────────────────────────── */

/* Четыре плашки одной высоты. Было: высота по длине текста, и полоса шла
   ступеньками. */
.buls {
  align-items: stretch;
}

.buls .bul {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.buls .bul .bn {
  flex: 0 0 auto;
}

/* ── 2. Полоса плашек под кнопками: по центру, с отступами и скруглением ── */

/* Полоса выравнивается по центру - и число, и текст. Плашки первого экрана
   при этом остаются слева: там текста больше, и по центру он читается хуже. */
.buls .bul {
  padding: 14px 16px;
  border-radius: var(--rad, 8px);
  text-align: center;
}

.buls .bul .bn,
.buls .bul .bt {
  text-align: center;
}

/* Внутренние отступы были нулевые, и текст лип к левому краю блока. */
.buls .bul .bt div {
  margin: 0;
}

/* ── 2а. Кнопки действий одной длины ──────────────────────────────────── */

/* Обе кнопки одинаковой ширины и высоты, подпись переносится на две строки и
   стоит по центру. Было: ширина по длине подписи, кнопки разного размера. */
.acts {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.acts .act {
  flex: 0 1 clamp(220px, 26vw, 320px);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.2em;
  text-align: center;
  white-space: normal;
}

/* Первый экран на телефоне: длинный текст убирается под плюсик.

   Плюсик мелкий и серый, без рамки - такой же неприметный, как значки
   раскрытия у плашек первого экрана. Первый вариант был в рамке и бросался в
   глаза; Павел посмотрел и попросил убрать. Разметку ставит glavnaya.js. */
.hero .hleft .intro-tog {
  display: none;
}

@media (max-width: 760px) {
  .hero .hleft .intro-tog {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    margin: -6px 0 6px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--muted, #63676c);
    font: inherit;
    font-size: var(--fs-sec, 13px);
    font-weight: 400;
    cursor: pointer;
  }

  .hero .hleft .intro-tog::after {
    content: "+";
    font-size: 1.15em;
    line-height: 1;
    color: var(--muted, #63676c);
  }

  .hero .hleft .intro-tog[aria-expanded="true"]::after {
    content: "-";
  }

  .hero .hleft .intro[hidden] {
    display: none;
  }
}

/* Вторая строка плашки ложится ровно в две строки, а не рвётся как попало:
   строки уравниваются по длине. Просил Павел - «чтобы везде было две». */
.hero .pl .pbold {
  text-wrap: balance;
}

/* ── 3. Границы блоков тенью ──────────────────────────────────────────── */

/* На боевом сайте у блоков нет рамки: фон белый, а край обозначен мягкой
   тенью снизу и с боков. Сверху блок сливается с фоном страницы - будто свет
   падает сверху. Повторяем это.

   Переменная --tenj-bloka вынесена, чтобы панель оформления могла её крутить
   одним движением, не трогая правила. */
:root {
  --tenj-bloka: 0 6px 14px -6px rgba(27, 27, 27, .18),
                -6px 0 12px -10px rgba(27, 27, 27, .10),
                6px 0 12px -10px rgba(27, 27, 27, .10);
}

.hero .pl,
.buls .bul,
.card,
.card3,
.rev,
.case,
.tarif,
.plat {
  border: 0;
  background: #fff;
  box-shadow: var(--tenj-bloka);
}

/* ── 4. Шапка на телефоне ─────────────────────────────────────────────── */

/* Диктовка Павла 13.08.2026: на телефоне шапка другая - кнопок минимум.
   Слева логотип, рядом компактно адрес и часы, справа значок меню. Телефон
   и почта уходят вниз, в липкую панель действий: там до них дотянуться
   пальцем удобнее, чем в шапке.

   Раньше на телефоне было две шапки подряд: полоса с логотипом и бургером,
   а под ней вторая строка со всеми контактами и кнопкой заказа. Она
   занимала два экранных ряда и отодвигала заголовок вниз. */
/* Переехало 21.08.2026 в файл шапки
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\bloki\01_shapka.css
   раздел Т0. Причина: разметку мобильной шапки выводит общий
   parts/shapka.html - она есть на каждой странице, а этот файл
   подключает только шаблон главной и её копий. */

/* ── 5. Липкие шапка и панель действий на телефоне ────────────────────── */

/* Диктовка Павла 13.08.2026: и верхняя шапка, и нижняя панель должны быть
   видны всё время, при любой прокрутке. Раньше обе уезжали вместе с первым
   экраном, и на середине страницы заказать было нечем.

   Верх: логотип, адрес с часами, кнопка «Заказать перевод», значок меню.
   Низ: только значки - телефон, чат, Telegram, WhatsApp, MAX, почта. */
/* Переехало 21.08.2026 в файл шапки
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\bloki\01_shapka.css
   раздел Т0. Причина: разметку мобильной шапки выводит общий
   parts/shapka.html - она есть на каждой странице, а этот файл
   подключает только шаблон главной и её копий. */

/* Переехало 21.08.2026 в файл панели связи
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\panel_svyazi.css
   раздел 2.5. Причина: разметку нижней панели выводит общий
   parts/nizhnyaya_panel.html - она есть на каждой странице, а этот файл
   подключает только шаблон главной и её копий. */

/* ── 6. Площадки отзывов: компактные плашки ───────────────────────────── */

/* Диктовка Павла 13.08.2026: плашки площадок сделаны размашисто, логотипы
   разного размера - Яндекс огромный, Zoon мелкий. Надо: все одинаковые и
   мелкие, слева логотип, справа оценка, снизу число отзывов в две строки.
   На компьютере видно восемь, на телефоне три - остальные прокруткой. */
.plat {
  flex: 0 0 auto;
  width: calc((100% - 7 * 8px) / 8);
  min-width: 118px;
  padding: 8px 10px;
  border-radius: var(--rad, 8px);
}

.plat .platlogo,
.plat img {
  max-width: 60px;
  max-height: 18px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.plat .platrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.plat .stars {
  font-size: 11px;
  letter-spacing: -1px;
  white-space: nowrap;
}

.plat .platcount {
  display: block;
  margin-top: 4px;
  color: var(--muted, #63676c);
  font-size: 10.5px;
  line-height: 1.25;
}

/* ── 7. Отзывы: два в ряд, компактно ──────────────────────────────────── */

/* Было по одному во всю ширину и очень высоко. Стало: два рядом, шрифт
   мельче, отступы меньше. На телефоне один в ряд и текст в три строки с
   раскрытием - иначе отзыв занимает весь экран. */
.strip .rev {
  flex: 0 0 auto;
  width: calc((100% - 12px) / 2);
  min-width: 260px;
  padding: 10px 12px;
  font-size: 13.5px;
  line-height: 1.35;
}

.strip .rev .rtop {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 2px;
}

.strip .rev .rtop img,
.strip .rev .rplat img {
  max-width: 52px;
  max-height: 16px;
}

.strip .rev .rname {
  font-weight: 700;
  font-size: 13.5px;
}

.strip .rev p {
  margin: 4px 0 0;
}

@media (max-width: 760px) {
  .plat {
    width: calc((100% - 2 * 8px) / 3);
    min-width: 96px;
    padding: 6px 8px;
  }

  .plat .platlogo,
  .plat img { max-width: 44px; max-height: 14px; }

  .strip .rev {
    width: 86vw;
    min-width: 0;
  }

  /* текст отзыва - три строки, дальше по кнопке «Ещё» */
  .strip .rev p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .strip .rev.raskryt p {
    display: block;
    overflow: visible;
  }

  .strip .rev .rev-tog {
    margin-top: 4px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--muted, #63676c);
    font: inherit;
    font-size: 12px;
    cursor: pointer;
  }
}

.strip .rev .rev-tog { display: none; }
@media (max-width: 760px) { .strip .rev .rev-tog { display: inline-block; } }

/* ── 8. Плашки площадок и шапка отзыва: точный вид по диктовке ────────── */

/* Плашка площадки: первая строка - логотип и мелкая оценка, вторая - звёзды,
   дальше отзывы и оценки отдельными строками. Высоту блока определяет именно
   это содержимое, ничего лишнего. */
.plat {
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-decoration: none;
}

.plat .platrow {
  display: flex;
  align-items: center;
  gap: 6px;
}

.plat .platlogo,
.plat .platrow img {
  max-width: 54px;
  max-height: 16px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.plat .prat {
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

.plat .pname {
  font-size: 12px;
  font-weight: 700;
}

/* звёзды фирменного цвета площадки */
.stars {
  color: #f7b500;
  letter-spacing: -1px;
}

.stars[data-plat="yell"],
.stars[data-plat="otzovik"] { color: #e2231a; }
.stars[data-plat="flamp"] { color: #1f8ceb; }
.stars[data-plat="zoon"] { color: #ff6b00; }
.stars[data-plat="2gis"],
.stars[data-plat="2-gis"] { color: #19aa1e; }

.plat .stars { font-size: 12px; }

.plat .pcnt {
  display: block;
  color: var(--muted, #63676c);
  font-size: 10.5px;
  line-height: 1.3;
}

/* Шапка отзыва в одну строку: логотип, имя, звёзды. */
.strip .rev .rtop {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
  margin-bottom: 4px;
}

.strip .rev .rtop .rplat {
  flex: 0 0 auto;
  font-size: 12px;
  color: var(--muted, #63676c);
}

.strip .rev .rtop .rplat img {
  max-width: 48px;
  max-height: 15px;
}

.strip .rev .rtop .rname {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
}

.strip .rev .rtop .stars {
  flex: 0 0 auto;
  font-size: 12px;
}

/* ── 9. Плашки площадок: белые с тенью, уже, всё на одной линии ───────── */

/* Диктовка Павла: плашки не серые, а белые с тенью, как полоса 24/7. Селектор
   с [data-b] обязателен - в эталоне фон задан правилом .plat[data-b] и без
   довеска мой цвет проигрывает по силе. */
.plat[data-b] {
  border: 0;
  background: #fff;
  box-shadow: var(--tenj-bloka);
}

/* Оценка стоит вплотную к логотипу, на одной с ним линии - не уезжает к
   правому краю. Плашка за счёт этого становится уже. */
.plat .platrow {
  justify-content: flex-start;
  gap: 8px;
}

/* Все логотипы одного размера: высота фиксированная, ширина по пропорции.
   Иначе Zoon и СПР выпирали, а Яндекс с Google были мельче. */
.plat .platlogo,
.plat .platrow img {
  height: 14px;
  max-height: 14px;
  width: auto;
  max-width: 58px;
}

.plat {
  width: auto;
  min-width: 104px;
  padding: 8px 12px;
}

@media (max-width: 760px) {
  .plat { min-width: 92px; }
}

/* Логотип в шапке отзыва - того же роста, что в плашках. */
.strip .rev .rtop .rplat img {
  height: 14px;
  max-height: 14px;
  width: auto;
  max-width: 58px;
}

/* ── 10. Плюсики у буллетов «компаниям» ───────────────────────────────── */

/* Тот же неприметный серый плюс, что у текста первого экрана на телефоне. */
.buls.seg .bul .bb {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.buls.seg .bul .bul-tog {
  padding: 0;
  border: 0;
  background: none;
  color: var(--muted, #63676c);
  font: inherit;
  font-size: 1.05em;
  line-height: 1;
  cursor: pointer;
}

.buls.seg .bul .bul-tog::after { content: "+"; }
.buls.seg .bul .bul-tog[aria-expanded="true"]::after { content: "-"; }
.buls.seg .bul .bt[hidden] { display: none; }

/* ── 11. Шапка телефона, вторая редакция ──────────────────────────────── */

/* Диктовка Павла 13.08.2026: слева небольшая кнопка «Заказать перевод», по
   центру логотип, справа значок меню. Адреса и часов на телефоне в шапке
   нет - они остаются в подвале и контактах, содержимое страницы для
   поисковика не беднеет. */
/* Переехало 21.08.2026 в файл шапки
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\bloki\01_shapka.css
   раздел Т0. Причина: разметку мобильной шапки выводит общий
   parts/shapka.html - она есть на каждой странице, а этот файл
   подключает только шаблон главной и её копий. */

/* ── 12. Выравнивания в плашках площадок и отзывах ────────────────────── */

/* Оценка на одной линии с логотипом, плашка обрезается под содержимое -
   пустого поля справа нет. */
.plat .platrow {
  align-items: center;
}

.plat .prat {
  margin: 0;
  line-height: 1;
  align-self: center;
}

.plat {
  min-width: 0;
  width: auto;
  padding: 8px 10px;
}

/* Поле логотипа в отзыве - квадратное, без подложки: раньше эталонная
   «пилюля» с фоном обрезала Яндекс и Zoon по краям. */
.strip .rev .rtop .rplat {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  display: inline-flex;
  align-items: center;
}

/* Имя автора на одной линии с логотипом и звёздами. */
.strip .rev .rtop {
  align-items: center;
}

.strip .rev .rtop .rname {
  margin: 0;
  line-height: 1.2;
  align-self: center;
}

/* Zoon и СПР рисуются крупнее остальных из-за полей внутри самих картинок -
   поджимаем их отдельно и в плашках, и в отзывах. */
.plat img[alt*="Zoon" i],
.plat img[alt*="СПР" i],
.strip .rev .rtop .rplat img[alt*="Zoon" i] {
  height: 11px;
  max-height: 11px;
}

/* ── 13. Плашки площадок и шапка отзыва: доводка по замечаниям ────────── */

/* Цифра оценки ровно на линии логотипа. Картинка перестаёт стоять на
   строчной базовой линии (из-за неё цифра и проваливалась вниз), оба
   элемента центрируются друг относительно друга. Селекторы с [data-b] -
   иначе эталонные правила сильнее. */
.plat[data-b] {
  display: flex;
  flex-direction: column;
  gap: 3px;
  width: 9.5rem;              /* все плашки одной ширины, по «Отзывы Москвы» */
  padding: 8px 10px;
}

body.mob .plat[data-b] {
  width: 8rem;
}

.plat .platrow {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
}

.plat .platrow img,
.plat .platlogo {
  display: block;             /* убирает провал по базовой линии текста */
}

.plat .prat[data-b] {
  display: block;
  margin: 0;
  font-size: 13px;
  line-height: 1;
  font-weight: 700;
}

/* Звёзды в отзыве - сразу после имени, а не у правого края. */
.strip .rev .rtop .rname {
  flex: 0 1 auto;
}

/* Поле логотипа в отзыве - строго прямоугольное, ничего не обрезает. */
.rev[data-b] .rplat[data-b],
.strip .rev .rtop .rplat {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  overflow: visible;
}

.rev[data-b] .rplat[data-b] img,
.strip .rev .rtop .rplat img {
  display: block;
  border-radius: 0;
  height: 13px;
  max-height: 13px;
  width: auto;
  max-width: 64px;
  object-fit: contain;
}

/* ── 14. Цифра оценки: по нижней кромке логотипа ──────────────────────── */

/* Центрирование коробок не сработало: у логотипов-слов (Яндекс, Google)
   видимые буквы стоят на нижней кромке картинки, а цифра при центрировании
   висела выше. Павел показал на снимке. Выравниваем по низу - то есть по
   базовой линии букв логотипа - и чуть поджимаем цифру. */
.plat .platrow {
  align-items: flex-end;
}

.plat .prat[data-b] {
  line-height: 0.95;
  padding-bottom: 1px;
}

/* ── 15. Плашки первого экрана: высота по содержимому ─────────────────── */

/* Диктовка Павла 13.08.2026 (вечер): после текста в плашках оставалось место
   ещё на строчку. Причина - у эталонной сетки grid-auto-rows:1fr, обе строки
   равнялись по самой высокой. Строка теперь высотой по своему содержимому;
   внутри строки плашки по-прежнему одной высоты (stretch из раздела 1). */
.hero .hright[data-h] {
  grid-auto-rows: auto;
}

/* ── 16. Воздух между блоками и вокруг разделительных линий ───────────── */

/* Диктовка Павла 13.08: между блоками налеплено, отступы увеличить вдвое.
   Диктовка 14.08 уточнила: у разделительной линии расстояние сверху (до
   предыдущего блока) и снизу (до своего содержимого) должно быть ОДИНАКОВЫМ,
   и эта величина едина для всех блоков страницы.

   Было после 13.08: до линии 68px, после линии 16px - в сумме ~84. Теперь та
   же сумма делится поровну: по 42px с каждой стороны (22px на телефоне).
   Переменная одна на всё - крутится в одном месте. */
:root {
  --sp-block: 42px;
  --vozduh-linii: 42px;
}

body.mob {
  --sp-block: 22px;
  --vozduh-linii: 22px;
}

/* линия каждого раздела: сверху margin (42), снизу padding (42) */
.blk[data-b] {
  margin: var(--vozduh-linii) 0;
  padding-top: var(--vozduh-linii);
}

.podval[data-b] {
  margin-top: var(--vozduh-linii);
  padding-top: var(--vozduh-linii);
}

/* полоса в первом экране: линия между шестью плашками и рядом 24/7.
   Сверху - отступ hero, снизу - внутренний отступ полосы, оба одинаковые. */
.hero[data-h],
body.mob .hero[data-h] {
  margin-bottom: var(--vozduh-linii);
}

.buls[data-h].common,
body.mob .buls[data-h].common {
  margin-top: 0;
  padding-top: var(--vozduh-linii);
  margin-bottom: 1.8rem;
}

.track[data-h] {
  margin-bottom: 2rem;
}

/* ── 17. Тень буллетов не режется дорожкой ────────────────────────────── */

/* У дорожки переключателя overflow:hidden, а высота выставляется ровно по
   активной панели - тень нижнего ряда буллетов срезалась по кромке. Панель
   получает запас снизу и с боков: он входит в offsetHeight, и тень остаётся
   внутри дорожки. */
.segblock[data-h] {
  padding: 0 8px 16px;
}

/* ── 18. Площадки отзывов: логотипы в полтора раза крупнее (компьютер) ── */

/* Диктовка Павла: логотипы в плашках крошечные - увеличить в полтора раза,
   цифру оценки поднять повыше, к уровню логотипа. Телефон не трогаем. */
body:not(.mob) .plat .platrow img,
body:not(.mob) .plat .platlogo {
  height: 21px;
  max-height: 21px;
  max-width: 88px;
}

/* у файлов Zoon и СПР поля внутри самой картинки - им свой размер */
body:not(.mob) .plat img[alt*="Zoon" i],
body:not(.mob) .plat img[alt*="СПР" i] {
  height: 16px;
  max-height: 16px;
}

/* Цифра оценки ростом с логотип (диктовка 14.08: «по высоте как логотипы»).
   Стоит, как и раньше, по нижней кромке логотипа. */
body:not(.mob) .plat .prat[data-b] {
  font-size: 24px;
  padding-bottom: 1px;
}

/* ── 19. Шапка отзыва: логотип крупнее, промежутки одинаковые ─────────── */

/* Логотип площадки в отзыве - тоже в полтора раза крупнее. Промежутки
   «логотип - имя - звёзды» одинаковые и небольшие: половина высоты логотипа. */
body:not(.mob) .strip .rev .rtop .rplat img,
body:not(.mob) .rev[data-b] .rplat[data-b] img {
  height: 20px;
  max-height: 20px;
  max-width: 96px;
}

body:not(.mob) .strip .rev .rtop {
  gap: 10px;
}

/* Логотип, имя и звёзды стоят подряд слева, промежутки между ними равны
   зазору gap. Эталонное space-between растаскивало их по всей ширине:
   имя оказывалось по центру, звёзды у правого края. */
.strip .rev .rtop {
  justify-content: flex-start;
}

/* ── 20. Ленты отзывов: без полосы прокрутки, с кнопками ──────────────── */

/* Диктовка Павла: полосу прокрутки и мелкие стрелочки убрать; вместо них
   полупрозрачные круглые кнопки влево/вправо по центру ленты. Обёртку .lenta
   и кнопки ставит glavnaya.js, прокрутка самой ленты рукой и колесом
   сохраняется - прячется только полоса. */
#otzyvy .strip[data-b] {
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 4px;
}

#otzyvy .strip[data-b]::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

#otzyvy .lenta {
  position: relative;
}

/* воздух между лентой площадок и лентой отзывов - как между верхними блоками */
#otzyvy .lenta + .lenta {
  margin-top: 26px;
}

#otzyvy .lentabtn {
  position: absolute;
  top: 50%;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  transform: translateY(-50%);
  background: rgba(27, 27, 27, .28);
  color: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

/* Наведение - только при настоящем курсоре (решение Павла
   08.09.2026, правило 4.5 в bloki/00_obshchee.css: на сенсорном
   экране :hover не отпускает и залипает после касания).
   Откат: снять @media. */
#otzyvy .lentabtn:focus-visible {
  background: rgba(27, 27, 27, .5);
}

@media (hover: hover) and (pointer: fine) {
  #otzyvy .lentabtn:hover {
    background: rgba(27, 27, 27, .5);
  }
}

#otzyvy .lentabtn.prev { left: 6px; }
#otzyvy .lentabtn.next { right: 6px; }

#otzyvy .lentabtn[hidden] { display: none; }

/* ── 21. Блок отзывов: доводка по диктовке 14.08 ──────────────────────── */

/* Заголовок отзывов раньше был крупнее прочих; с диктовки 25 все
   заголовки разделов одного размера - правило снято (см. раздел 29.1). */

/* Логотипы площадок: ширина ограничена, чтобы рядом всегда влезала цифра
   оценки. Селектор с #otzyvy обязателен: правило гайда
   .blk .strip .plat .platlogo { max-width:100% } сильнее классового и
   позволяло широким логотипам (Отзовик, Справочник Москвы) занимать всю
   плашку - пятёрка не влезала. */
#otzyvy .strip .plat .platlogo,
#otzyvy .strip .plat .platrow img {
  height: 21px;
  max-height: 21px;
  width: auto;
  max-width: 84px;
  object-fit: contain;
  margin-bottom: 0;
}

/* «Справочник Москвы» - широкая тёмная плита, ей отдельный размер поменьше.
   Селектор полной длины: короткий проигрывал общему правилу выше. */
#otzyvy .strip .plat .platrow img[alt*="Справочник" i],
#otzyvy .strip .plat .platrow img[alt*="Отзывы Москвы" i] {
  height: 14px;
  max-height: 14px;
}

/* у файлов Zoon и СПР поля внутри самой картинки - им свой размер */
#otzyvy .strip .plat .platrow img[alt*="Zoon" i],
#otzyvy .strip .plat .platrow img[alt*="СПР" i] {
  height: 16px;
  max-height: 16px;
}

body.mob #otzyvy .strip .plat .platlogo,
body.mob #otzyvy .strip .plat .platrow img {
  height: 14px;
  max-height: 14px;
  max-width: 64px;
}

body.mob #otzyvy .strip .plat .platrow img[alt*="Zoon" i],
body.mob #otzyvy .strip .plat .platrow img[alt*="СПР" i],
body.mob #otzyvy .strip .plat .platrow img[alt*="Справочник" i],
body.mob #otzyvy .strip .plat .platrow img[alt*="Отзывы Москвы" i] {
  height: 11px;
  max-height: 11px;
}

/* Логотипы в шапке отзыва - без серой подложки. Правило гайда
   .blk img { background: var(--soft) } (заглушка на время загрузки)
   просвечивало сквозь прозрачный SVG - Павел увидел «грязный фон»
   у Яндекса и 2ГИС. Логотипу заглушка не нужна: фон чисто белый. */
#otzyvy .rev .rtop .rplat img {
  background: none;
  border-radius: 0;
}

/* Zoon в шапке отзыва крупнее остальных из-за полей в файле - поменьше */
#otzyvy .rev .rtop .rplat img[alt*="Zoon" i] {
  height: 15px;
  max-height: 15px;
}

/* ── 22. Логотип в шапке ──────────────────────────────────────────────── */

/* Диктовка Павла 14.08.2026: в шапке стоит знак (красно-синяя монограмма из
   макета 05, Вебсайт\Логотип) и слово. Примерочный вариант - когда Павел
   пришлёт окончательный файл, меняется одна картинка img/znak_logo.svg.
   Ярко-синий знака вынесен в переменную - им же красятся плюсики. */
:root {
  --cvet-plusa: #1646e8;
}

/* Вид строки 1 (.sitehead, .sitelogo, знак) переехал 21.08.2026 в
   файл шапки css/site/bloki/01_shapka.css, раздел С1. Причина:
   шапка стала общей для всех страниц, а этот файл подключает
   только шаблон главной и её копий. */

/* Переехало 21.08.2026 в файл шапки
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\bloki\01_shapka.css
   раздел Т0. Причина: разметку мобильной шапки выводит общий
   parts/shapka.html - она есть на каждой странице, а этот файл
   подключает только шаблон главной и её копий. */

/* ── 23. Плюсики раскрывашек: единое правило ──────────────────────────── */

/* Диктовка Павла 14.08.2026: плюс, который разворачивает блок, ВСЕГДА стоит
   в правом нижнем углу блока, на одном и том же расстоянии от краёв
   (--plus-otstup), и не участвует в раскладке текста: текст блока
   центруется по самому блоку, а плюс висит в углу поверх. Цвет - ярко-синий
   из логотипа (--cvet-plusa). */
:root {
  --plus-otstup: 8px;
}

/* Плашки первого экрана: плюс из шапки-кнопки уезжает в угол всей плашки.
   Эталон держит .pltog относительным - возвращаем ему обычный поток, чтобы
   угол считался от плашки, а не от кнопки. */
.pl[data-h] {
  position: relative;
}

/* и с довеском body.mob - у эталона мобильное правило той же силы */
.pltog[data-h],
body.mob .pltog[data-h] {
  position: static;
}

/* Один вид на все плюсы (диктовка 12: у плашек плюс был «тухленький» и стоял
   иначе, чем у буллетов). Коробка 24x24 в углу, визуальный отступ глифа от
   краёв ~8px, глиф одного размера и веса везде. */
.chev[data-h],
body.mob .chev[data-h],
.buls.seg .bul .bul-tog,
.fold[data-b] .pl[data-b],
body.mob .fold[data-b] .pl[data-b] {
  position: absolute;
  top: auto;
  left: auto;
  right: calc(var(--plus-otstup) - 6px);
  bottom: calc(var(--plus-otstup) - 6px);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin: 0;
  padding: 0;
  color: var(--cvet-plusa);
}

/* видимость знаков не меняется: на компьютере плашки и карточки раскрыты,
   их плюс спрятан (как в эталоне); тарифы со знаком всегда */
body:not(.mob) .hero .chev[data-h] {
  display: none;
}

body:not(.mob) .fold[data-b]:not(.tarif) .pl[data-b] {
  display: none;
}

.chev[data-h]:before,
body.mob .chev[data-h]:before,
.buls.seg .bul .bul-tog::after,
.fold[data-b] .pl[data-b]:before {
  color: var(--cvet-plusa);
  font-size: 17px;
  font-weight: 600;
  line-height: 1;
}

/* Буллеты «компаниям»: плюс больше не стоит в строке подзаголовка - он в
   углу буллета, подзаголовок центруется по блоку без поправки на плюс. */
.buls.seg .bul {
  position: relative;
}

.buls.seg .bul .bb {
  display: block;
  text-align: center;
}

.buls.seg .bul .bul-tog {
  position: absolute;
  right: calc(var(--plus-otstup) - 6px);
  bottom: calc(var(--plus-otstup) - 6px);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  color: var(--cvet-plusa);
}

/* Карточки услуг, акций и тарифов: знак «+» из заголовка - в угол карточки */
.card3[data-b],
.tarif[data-b] {
  position: relative;
}

/* положение и вид знака у карточек задаёт единое правило выше */

/* Раскрывашка длинного текста на телефоне: плюс тем же синим */
.hero .hleft .intro-tog::after {
  color: var(--cvet-plusa);
}

/* нажимается весь буллет, не только плюс - курсор говорит об этом */
body.mob .buls.seg .bul {
  cursor: pointer;
}

/* Диктовка 17: на компьютере пояснения раскрыты, и знаков (минусов) не
   видно вовсе - тот же принцип, что у плашек первого экрана. */
body:not(.mob) .buls.seg .bul .bul-tog {
  display: none;
}

/* ── 24. Телефон: логотип ровно посередине шапки ──────────────────────── */

/* Диктовка Павла 14.08.2026: логотип занимает центральную часть шапки,
   кнопка «Заказать перевод» и значок меню равномерно по краям. Логотип
   вынут из ряда и прибит к центру - кнопка слева, меню справа. */
/* Переехало 21.08.2026 в файл шапки
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\bloki\01_shapka.css
   раздел Т0. Причина: разметку мобильной шапки выводит общий
   parts/shapka.html - она есть на каждой странице, а этот файл
   подключает только шаблон главной и её копий. */

/* ── 25. Цветовые пробы - диктовка Павла 14.08.2026 (диктовка 13) ─────── */

/* Всё в этом разделе - примерка цвета. ОТКАТ: убрать раздел 25 целиком
   (или отдельную его часть) - и страница вернётся к прежнему виду.
   Данные не трогались, только вёрстка. */

/* 25.1. Цифры плашек первого экрана - красным, как красный логотипа.
   Откат: удалить это правило (или заменить цвет на var(--ink)). */
:root {
  --cvet-cifr: #8c1821;
}

.pnum[data-h],
body.mob .pnum[data-h] {
  color: var(--cvet-cifr);
}

/* 25.2. Полоса 24/7: уголки как скобки логотипа - КРАСНЫЙ в левом верхнем,
   СИНИЙ в правом нижнем (диктовка 14 поправила диктовку 13, где было
   наоборот). Уголки идут ПРЯМО ПО ГРАНИЦЕ карточки, не внутри: линия уголка
   совпадает с краем и повторяет его скругление. Откат: удалить. */
.buls[data-h].common .bul {
  position: relative;
}

/* Диктовка 15: уголок квадратный (ширина = высоте), угол ОСТРЫЙ, хотя сама
   плашка скруглённая; синий правый нижний пока убран - только красный. */
.buls[data-h].common .bul::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 18px;
  height: 18px;
  border-top: 3px solid #8c1821;
  border-left: 3px solid #8c1821;
  pointer-events: none;
}

/* 25.3. Шапка телефона (редакция диктовки 14): одна строка - слева значок
   онлайн-заказа, по центру втрое увеличенный логотип, справа серые полоски
   меню. Кнопки «Заказать перевод» словом больше нет. Логотип держит высоту
   66px, но на узком экране пропорционально ужимается, чтобы значки по бокам
   всегда влезали. Откат: удалить 25.3 (и вернуть кнопку в шаблоне). */
/* Переехало 21.08.2026 в файл шапки
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\bloki\01_shapka.css
   раздел Т0. Причина: разметку мобильной шапки выводит общий
   parts/shapka.html - она есть на каждой странице, а этот файл
   подключает только шаблон главной и её копий. */

/* Переехало 21.08.2026 в файл панели связи
   C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\panel_svyazi.css
   раздел 2.5. Причина: разметку нижней панели выводит общий
   parts/nizhnyaya_panel.html - она есть на каждой странице, а этот файл
   подключает только шаблон главной и её копий. */

/* ── 26. Диктовка 14: цветовые пробы главной ──────────────────────────── */

/* Общесайтовые правила этой диктовки (шрифт, шапка по строкам, меню как на
   боевом, липкий блок меню, крошки) живут в css/site/shapka.css - он
   подключён в base.html на ВСЕХ страницах. Здесь остаётся только то, что
   есть лишь на главной: переключатель аудиторий и кнопки действий. */

/* Раздел «Inter и на главной» снят 24.08.2026. Он повторял правило 26.1 из
   css/site/shapka.css слово в слово и был нужен только затем, чтобы
   перебить эталонный dvizhok.css, который подключается позже. Теперь
   правило 26.1 написано через «html body» и выигрывает у эталона по силе
   селектора на ЛЮБОЙ странице, а не только там, где есть этот файл, -
   повтор стал бессмысленным. Вид главной не изменился: семейство ставится
   то же самое, кегль и интервал ни то ни другое правило не трогает.

   Сверка слепков главной и семи её копий на ширинах 1440, 1280, 768, 414,
   375, 320 - ноль расхождений; слепки и отчёт лежат в папке
   wagtail_pilot/evidence/shrift_inter_2026-08-24.

   Откат: вернуть сюда правило
     body, button, input, select, textarea { font-family: Inter, ... }
   и вернуть селектор «body» в разделе 26.1 shapka.css. */

/* 26.3. Переключатель частным/компаниям: дорожка белая с еле различимой
   серой границей, активная вкладка - красный бегунок с белым текстом,
   неактивная - белая. Откат: удалить 26.3. */
.segbar[data-h] {
  background: #fff;
  border: 1px solid var(--line, #d9dbde);
}

.segbar[data-h] .knob[data-h] {
  background: #8c1821;
}

.segbar[data-h] .segtab[aria-selected="true"],
.segbar[data-h][data-on="private"] .segtab[data-seg="private"],
.segbar[data-h][data-on="corp"] .segtab[data-seg="corp"] {
  color: #fff;
}

/* 26.4. Кнопки «Калькулятор заказа» и «Онлайн заявка» - обе красные с белым
   шрифтом. Откат: удалить 26.4. */
.acts[data-h] .act[data-h],
.acts[data-h] .act[data-h].main,
.acts[data-h] .act[data-h].sec {
  background: #8c1821;
  border-color: #8c1821;
  color: #fff;
}

/* ── 27. Рекомендации корпоративных заказчиков (диктовки 14-17.08) ────── */

/* Карточка один в один с действующим сайтом: слева фотография объекта, в
   центре заголовок проекта, пересказ и подпись с логотипом, справа скан
   письма. Слайдер по одной карточке, круглые стрелки по бокам, скан
   открывается крупно своим зумом. Раздел виден только «Компаниям» -
   видимостью управляет сценарий pisma в glavnaya.js. */
.blk.pisma .pisma-lenta {
  position: relative;
  display: block;
  /* запас по бокам - ровно половина кнопки: она врезана в стенку и не
     должна вылезать за поля страницы */
  margin: 0 21px;
}

/* Фон, скругление и тень - у окна, а не у карточек: карточки стоят в ленте
   вплотную, и тень соседней просвечивала вертикальной серой полосой справа
   от скана письма (Павел поймал это на Сингенте, диктовка 21). */
.blk.pisma .pisma-okno {
  min-width: 0;
  overflow: hidden;
  border-radius: var(--rad, 8px);
  background: #fff;
  box-shadow: var(--tenj-bloka);
}

.blk.pisma .pisma-rail {
  display: flex;
  align-items: stretch;
  transition: transform .3s ease;
}

@media (prefers-reduced-motion: reduce) {
  .blk.pisma .pisma-rail { transition: none; }
}

.blk.pisma .pismo {
  flex: 0 0 100%;
  display: flex;
  align-items: center;   /* фото и скан - ровно по центру текста (диктовка 21) */
  gap: 28px;
  box-sizing: border-box;
  padding: 22px 26px;    /* кнопки врезаны в стенку и места не занимают */
  background: none;      /* фон и тень держит окно ленты */
}

.blk.pisma .pismo-osnova {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 28px;
}

.blk.pisma .pismo-foto {
  flex: 0 0 170px;
  width: 170px;
  height: auto;
  align-self: center;
  object-fit: contain;
}

.blk.pisma .pismo-soderzhanie {
  flex: 1 1 auto;
  min-width: 0;
}

.blk.pisma .pismo-zagolovok {
  margin: 0 0 8px;
  font-size: var(--fs-h3, 16px);
  font-weight: 700;
}

/* Между абзацами - обычный междустрочный интервал, без добавочного
   отступа (диктовка Павла 17.08.2026). */
.blk.pisma .pismo-tekst {
  margin: 0;
  font-size: var(--fs-body, 15px);
  line-height: var(--lh-body, 1.45);
  color: #3d4247;
}

.blk.pisma .pismo-niz {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 12px;
}

.blk.pisma .pismo-imya {
  margin: 0;
  font-weight: 700;
}

.blk.pisma .pismo-dolzhnost {
  margin: 0;
  color: var(--muted, #63676c);
  font-size: var(--fs-sec, 13px);
}

.blk.pisma .pismo-logo {
  flex: 0 0 auto;
  max-height: 44px;
  width: auto;
}

/* скан письма - узкий столбик справа, курсор подсказывает увеличение */
.blk.pisma .pismo-skan {
  flex: 0 0 170px;
  align-self: center;
  padding: 0;
  border: 0;
  background: none;
  cursor: zoom-in;
}

.blk.pisma .pismo-skan img {
  display: block;
  width: 100%;
  height: auto;
}

/* Кнопки листания - как на действующем сайте: белый кружок 42x42 с тонкой
   серой рамкой, знак тёмный. Стоят ВНУТРИ карточки у самого её края и
   являются её частью, а не торчат наружу (диктовка 21). */
.blk.pisma .pismo-strelka {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid #e0e0ec;
  border-radius: 50%;
  background: #fff;
  color: #1e1f22;
  font-size: 22px;
  line-height: 1;
  transform: translateY(-50%);
  cursor: pointer;
}

/* Кнопка врезана в боковую стенку рамки: её центр стоит ровно на линии
   края, половина снаружи, половина внутри - как на действующем сайте
   (замер: left -20px при ширине 42, то есть центр на самой кромке).
   Содержимое карточки при этом идёт во всю ширину. */
.blk.pisma .pismo-strelka.prev { left: -21px; }
.blk.pisma .pismo-strelka.next { right: -21px; }

/* Наведение - только при настоящем курсоре (решение Павла 08.09.2026,
   правило 4.5 в bloki/00_obshchee.css: на сенсорном экране :hover не
   отпускает и залипает после касания). Откат: снять @media. */
@media (hover: hover) and (pointer: fine) {
  .blk.pisma .pismo-strelka:hover {
    border-color: #9aa0a6;
  }
}

/* свой зум скана: подложка осветляет и размывает страницу */
.pismo-zum {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, .72);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  cursor: zoom-out;
}

.pismo-zum img {
  max-width: 92vw;
  max-height: 94vh;
  box-shadow: 0 12px 40px -12px rgba(27, 27, 27, .5);
}

/* телефон: карточка столбиком, фотография объекта прячется (как на
   действующем), скан по центру внизу */
@media (max-width: 760px) {
  .blk.pisma .pismo {
    flex-direction: column;
    gap: 12px;
    padding: 14px 16px;
  }

  .blk.pisma .pismo-osnova {
    flex-direction: column;
    gap: 10px;
  }

  .blk.pisma .pismo-foto {
    display: none;
  }

  .blk.pisma .pismo-niz {
    flex-wrap: wrap;
  }

  .blk.pisma .pismo-skan {
    flex: 0 0 auto;
    width: 170px;
    align-self: center;
  }

  .blk.pisma .pismo-strelka {
    width: 34px;
    height: 34px;
    font-size: 19px;
  }

  .blk.pisma .pisma-lenta {
    margin: 0 17px;
  }

  .blk.pisma .pismo-strelka.prev { left: -17px; }
  .blk.pisma .pismo-strelka.next { right: -17px; }
}

/* ── 28. Карточки четырёх блоков (диктовка Павла 24, 17.08.2026) ───────── */

/* Блоки: услуги частным, отрасли компаниям, преимущества частным, акции.
   «Как получить готовый перевод» намеренно не трогаем - о нём отдельно.

   Общая рамка блока убрана: остаются заголовок по центру и белые карточки
   с еле заметной тенью снизу и с боков (тень уже задана в разделе 3).
   Внутри карточки: картинка по центру сверху, всё остальное по левому
   краю. Картинка вынесена из сворачиваемой части в разметке и поднимается
   наверх порядком (order) - так на телефоне она видна и у свёрнутой
   карточки, а механика плюсиков не сломана. */

/* обёртка галереи: рамка, подложка и внутренние поля сняты */
.galwrap[data-b] {
  border: 0;
  padding: 0;
  background: none;
}

body.mob .galwrap[data-b] {
  padding: 0;
}

/* карточка: столбик, картинка первой */
.card3[data-b] {
  display: flex;
  flex-direction: column;
  text-align: left;
}

.card3[data-b] .cardimg {
  order: -1;
  align-self: center;   /* картинка по центру сверху */
  margin-bottom: 10px;
}

/* картинка ниже прежнего: 96 → 70 точек (диктовка 24) */
.card3[data-b] .cardimg,
.cards3[data-b] .card3[data-b] .cardimg,
.cards4[data-b] .card3[data-b] .cardimg {
  height: 70px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
}

/* ссылки-подписи выравниваются по низу карточки: текст в карточках разной
   длины, и без этого ссылки шли лесенкой */
.card3[data-b] .foldb[data-b] {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
}

.card3[data-b] .go[data-b] {
  margin-top: auto;
}

/* ссылка-подпись: курсив фирменным синим из логотипа */
.card3[data-b] .go[data-b] {
  display: inline-block;
  margin-top: 6px;
  color: var(--cvet-plusa, #1646e8);
  font-style: italic;
  font-weight: 400;
}

/* сетки: услуги и акции по четыре, отрасли по три (6 карточек = два
   ровных ряда, решение Павла) */
.cards3[data-b].kart4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.cards3[data-b].kart3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Раскладка карточек «преимущества частным» задаётся в разделе 31 -
   диктовка 26 вернула их к виду акций (картинка сверху). */

/* телефон: карточки по две в ряд, у свёрнутой картинка не занимает места */
@media (max-width: 760px) {
  .cards3[data-b].kart4,
  .cards3[data-b].kart3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cards3[data-b].ryadom .card3[data-b] {
    column-gap: 8px;
  }

  body.mob .card3[data-b]:not(.open) .cardimg {
    display: none;
  }
}

/* ── 29. Оформление по действующему сайту (диктовка Павла 25, 17.08) ───── */

/* Павел: «идти на сайт и делать ровно так, как у нас на сайте». Всё ниже
   снято замерами с academperevod.ru, а не придумано. */

/* 29.0. ПОЧИНКА: правило выравнивания ссылок (раздел 28) перебивало
   эталонное .foldb[hidden]{display:none} - у карточек и тарифов перестало
   работать сворачивание (Павел поймал на тарифах: «плюс-минус нажимаю, не
   происходит ничего»). Возвращаем скрытие с нужной силой. */
.card3[data-b] .foldb[data-b][hidden],
.tarif[data-b] .foldb[data-b][hidden] {
  display: none;
}

/* 29.1. Заголовки разделов - одного размера ВЕЗДЕ, по центру, с большим
   отступом до содержимого. На действующем сайте academperevod.ru: 40px/700,
   margin 0 0 40px; у нас общий масштаб мельче.

   Было 30px, стало 28px - решение Павла 17.08.2026 («предлагаю всё-таки
   поставить 28, не 30»). Откат: вернуть 30px. */
.blk[data-b] > h2[data-b],
.galp[data-b] > h2[data-b],
.blk.pisma > h2[data-b] {
  font-size: 28px;
  line-height: 1.2;
  font-weight: 700;
  text-align: center;
  margin: 0 0 40px;
}

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: 23px;
  margin-bottom: 26px;
}

/* Подзаголовок под H2. Отступы задаются ниже, в разделе 34 (одно место на
   всё): здесь остаётся только выравнивание по центру колонки. */
.blk[data-b] > .sub[data-b],
.galp[data-b] > .sub[data-b] {
  margin-left: auto;
  margin-right: auto;
}

/* 29.2. Отступы между блоками - одинаковые и втрое больше прежних.
   На боевом секции идут через 60px сверху + 50px снизу. */
:root {
  --sp-block: 96px;
}

body.mob {
  --sp-block: 56px;
}

.blk[data-b] {
  border-top: 0;      /* разделительной линии сверху на боевом нет */
  padding-top: 0;
}

.galwrap[data-b] {
  margin: var(--sp-block) 0;
}

.track[data-b].gal .rail[data-b] {
  gap: var(--sp-block);
}

/* 29.3. Карточки - как на боевом: без рамки, скругление 16px и мягкая тень
   вниз (замер: rgba(21,72,137,.08) 0 10px 20px). Тень видна снизу и с
   боков, сверху её нет - ровно то, что просил Павел. */
:root {
  --tenj-bloka: 0 10px 20px 0 rgba(21, 72, 137, .08);
}

.card3[data-b],
.bul[data-h],
.plat[data-b],
.rev[data-b],
.case[data-b],
.tarif[data-b],
.anketa[data-b],
.pisma-okno,
.hero .pl[data-h] {
  border: 0;
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--tenj-bloka);
}

/* карточкам нужно поле, иначе текст лип к краю */
.card3[data-b] {
  padding: 20px 24px;
}

body.mob .card3[data-b] {
  padding: 14px 16px;
}

/* полоса 24/7 и буллеты аудиторий - те же карточки */
.buls[data-h] .bul[data-h] {
  padding: 16px 18px;
}

/* 29.4. Ссылки-подписи в карточках: фирменный бордовый как на боевом
   (#911A22), курсив, без подчёркивания, и шеврон-стрелка справа. */
.card3[data-b] .go[data-b] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--cvet-bordo, #911a22);
  font-style: italic;
  text-decoration: none;
}

.card3[data-b] .go[data-b]::after {
  content: "";
  width: 16px;
  height: 16px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 5.5 15 12l-6.5 6.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 5.5 15 12l-6.5 6.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* 29.5. Преимущества частным - ЧЕТЫРЕ столбца (три было ошибкой: три
   обсуждали только для отраслей), картинка слева на уровне заголовка. */
.cards3[data-b].ryadom {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* 29.6 отменён диктовкой 26 - единая раскладка карточек в разделе 31. */

/* 29.7. «Как получить готовый перевод» - по образцу действующего сайта:
   две колонки, слева номер + способ + шеврон, справа описание бордовым,
   строки разделены тонкими линиями #E0E0EC (замеры с боевого: колонки
   520+520, отступы 25px, номер 40px цвета #DBDBDB, описание #911A22). */
/* Способ и его описание стоят в ОДНОМ ряду и потому одной высоты: списки
   растворяются (display:contents), а сетка заполняется по колонкам -
   сперва сверху вниз левая, потом правая. Число рядов приходит из шаблона
   переменной --kp-strok. */
.kakpoluchit {
  display: grid;
  grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
  grid-template-rows: repeat(var(--kp-strok, 4), auto);
  grid-auto-flow: column;
  column-gap: 30px;
}

.kp-sposoby,
.kp-opisaniya {
  display: contents;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kp-sposoby {
  counter-reset: sposob;
}

.kp-sposob,
.kp-opisanie {
  display: flex;
  align-items: center;
  min-height: 96px;
  padding: 18px 0;
  border-bottom: 1px solid #e0e0ec;
  font-size: var(--fs-body, 15px);
  line-height: var(--lh-body, 1.45);
}

.kp-sposob {
  gap: 16px;
  counter-increment: sposob;
  color: var(--ink, #1b1b1b);
}

.kp-sposob::before {
  content: counter(sposob);
  flex: 0 0 auto;
  min-width: 26px;
  color: #dbdbdb;
  font-size: 34px;
  font-weight: 700;
  line-height: 1;
}

.kp-sposob::after {
  content: "";
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  margin-left: auto;
  background: #9aa0a6;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 5.5 15 12l-6.5 6.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 5.5 15 12l-6.5 6.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.kp-opisanie {
  padding-left: 15px;
  color: var(--cvet-bordo, #911a22);
}

/* телефон: одна колонка, способ и его описание идут парой */
@media (max-width: 760px) {
  .kakpoluchit {
    grid-template-columns: 1fr;
  }

  .kp-sposob,
  .kp-opisanie {
    min-height: 0;
    padding: 12px 0;
  }

  .kp-sposob::before {
    font-size: 26px;
  }

  .kp-opisanie {
    padding-left: 42px;
    border-bottom: 0;
  }

  /* на телефоне колонка одна, и пары идут подряд: способ - его описание.
     Порядок задаётся вручную по номеру: способ N получает место 2N-1,
     описание N - место 2N. Способов на странице четыре. */
  .kakpoluchit {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-flow: row;
  }

  .kp-sposob:nth-child(1) { order: 1; }
  .kp-opisanie:nth-child(1) { order: 2; }
  .kp-sposob:nth-child(2) { order: 3; }
  .kp-opisanie:nth-child(2) { order: 4; }
  .kp-sposob:nth-child(3) { order: 5; }
  .kp-opisanie:nth-child(3) { order: 6; }
  .kp-sposob:nth-child(4) { order: 7; }
  .kp-opisanie:nth-child(4) { order: 8; }
}

/* 29.8. Вопросы и ответы - как на действующем сайте: блок во всю ширину,
   вопрос слева, справа шеврон фирменного бордового; при раскрытии шеврон
   разворачивается вверх. Ответ - во всю ширину, без узкой колонки. */
#faq .q[data-b] {
  border-bottom: 1px solid #e0e0ec;
  padding: 18px 0;
}

#faq .q[data-b] > summary[data-b] {
  display: flex;
  align-items: center;
  gap: 16px;
  list-style: none;
  font-size: 17px;
  line-height: 1.35;
  font-weight: 650;
}

#faq .q[data-b] > summary[data-b]::-webkit-details-marker {
  display: none;
}

#faq .q[data-b] > summary[data-b]::after {
  content: "";
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-left: auto;
  background: var(--cvet-bordo, #911a22);
  transition: transform .2s ease;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.5 9.5 12 15l5.5-5.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.5 9.5 12 15l5.5-5.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

#faq .q[data-b][open] > summary[data-b]::after {
  transform: rotate(180deg);
}

#faq .q[data-b] p[data-b] {
  max-width: none;   /* ответ во всю ширину, а не узкой колонкой */
  margin-top: 10px;
}

@media (prefers-reduced-motion: reduce) {
  #faq .q[data-b] > summary[data-b]::after { transition: none; }
}

/* ── 30. Воздух и тени (чек-лист Павла, диктовка 26) ──────────────────── */

/* О1а. Тень режется по краям страницы: дорожка галереи обрезает всё, что
   выходит за её границу (overflow:hidden нужен переключателю аудиторий), а
   у карточек запас был 2px при тени с размытием 20px. Даём полосам
   карточек поле 22px с каждой стороны - тень успевает уйти в белое, как у
   полосы 24/7 (эталон Павла, О4а).

   ПРАВКА 17.08.2026. Одно поле съедало ширину: содержимое блоков начиналось
   на 22px правее колонки страницы. Замер при окне 1440: на действующем сайте
   academperevod.ru заголовок раздела начинается с 123-й точки, у нас
   начинался со 145-й, и блок был 1136 вместо 1180. Павел это увидел,
   переключаясь между сайтами в одном окне.

   Теперь запас берётся НАРУЖУ: поле 22px компенсировано таким же
   отрицательным внешним отступом. Содержимое встаёт на ту же линию, что на
   действующем сайте, а место под тени остаётся. За край страницы этот запас
   не вылезет - его подрезает `body .device { overflow-x: clip }`
   (shapka.css, раздел 27). Откат: убрать строку margin-inline. */
.galp[data-b] {
  padding: 0 22px;
  margin-inline: -22px;
}

/* О2а. Тень у верхней кромки карточки бралась от соседнего ряда: промежуток
   между рядами был 10px при размытии тени 20px. Разводим карточки. */
:root {
  --card-gap: 30px;
}

body.mob {
  --card-gap: 18px;
}

.cards3[data-b],
.cards4[data-b] {
  gap: var(--card-gap);
}

body.mob .cards3[data-b],
body.mob .cards4[data-b] {
  gap: var(--card-gap);
}

/* та же беда у полосы буллетов и у плашек первого экрана */
.buls[data-h] {
  gap: 22px;
}

body.mob .buls[data-h] {
  gap: 16px;
}

.hright[data-h] {
  gap: 22px;
}

body.mob .hright[data-h] {
  gap: 14px;
}

/* О3. Расстояние между блоками - ещё вдвое (96 → 190). */
/* ПРАВКА 17.08.2026, диктовка 33: вдвое меньше (190 → 95). Павел: «то
   расстояние, которое сейчас между блоками, нужно, чтобы оно было в два раза
   меньше». Заодно тем же числом задаётся отступ ПОСЛЕ заголовка раздела -
   см. раздел 34 ниже. Откат: вернуть 190/96. */
/* ПРАВКА 18.08.2026, диктовка Павла: «везде поставим не 95, давай 70 -
   семьдесят до и семьдесят после». Меняются ровно два числа - ритм на
   компьютере и на телефоне. Телефон пересчитан пропорционально: было 95/48
   (отношение 1,98), стало 70/35 (отношение 2,0).
   Откат: вернуть 95px и 48px. */
:root {
  --sp-block: 70px;
}

body.mob {
  --sp-block: 35px;
}

/* лента отзывов и полосы с горизонтальной прокруткой тоже режут тень:
   даём им внутренний запас снизу и по бокам */
#otzyvy .strip[data-b] {
  padding: 6px 22px 24px;
  margin: 0 -22px;
}

.strip[data-b].anketi {
  padding-bottom: 24px;
}

/* ── 31. Раскладка карточек (чек-лист Павла, диктовка 26) ─────────────── */

/* Услуги частным, отрасли и преимущества компаниям: первая строка -
   СЛЕВА картинка, СПРАВА заголовок на одной линии; второй строкой текст во
   всю ширину карточки; третьей - ссылка (она есть у услуг и отраслей, у
   преимуществ компаниям её нет). */
.cards3[data-b].kart4 .card3[data-b],
.cards3[data-b].kart3:not(.ryadom) .card3[data-b],
.cards3[data-b].korp .card3[data-b] {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "risunok zagolovok"
    "tekst   tekst";
  align-items: center;
  column-gap: 14px;
  row-gap: 10px;
}

.cards3[data-b].kart4 .card3[data-b] .cardimg,
.cards3[data-b].kart3:not(.ryadom) .card3[data-b] .cardimg,
.cards3[data-b].korp .card3[data-b] .cardimg {
  grid-area: risunok;
  align-self: center;
  justify-self: start;
  margin: 0;
  height: 44px;   /* в узких карточках услуг - мельче, чтобы заголовок влез */
  max-width: 46px;
  object-fit: contain;
}

.cards3[data-b].kart4 .card3[data-b] .foldwrap[data-b],
.cards3[data-b].kart3:not(.ryadom) .card3[data-b] .foldwrap[data-b],
.cards3[data-b].korp .card3[data-b] .foldwrap[data-b] {
  grid-area: zagolovok;
}

.cards3[data-b].kart4 .card3[data-b] .foldb[data-b],
.cards3[data-b].kart3:not(.ryadom) .card3[data-b] .foldb[data-b],
.cards3[data-b].korp .card3[data-b] .foldb[data-b] {
  grid-area: tekst;
}

/* у отраслей и преимуществ компаниям карточки шире - картинке можно быть
   крупнее, как на действующем сайте */
.cards3[data-b].kart3:not(.ryadom) .card3[data-b] .cardimg,
.cards3[data-b].korp .card3[data-b] .cardimg {
  height: 76px;
}

/* Преимущества частным - как в «Акциях»: картинка сверху по центру,
   под ней заголовок, ниже текст. Четыре столбца. */
.cards3[data-b].ryadom {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.cards3[data-b].ryadom .card3[data-b] {
  display: flex;
  flex-direction: column;
}

.cards3[data-b].ryadom .card3[data-b] .cardimg {
  order: -1;
  align-self: center;
  margin-bottom: 10px;
  height: 70px;
}

/* заголовок карточки не должен вылезать за её край - длинные слова
   переносятся («Полная конфиденциальность», «1500+ специализированных») */
.card3[data-b] .foldh[data-b] {
  min-width: 0;
}

/* Слова в заголовке переносятся ЦЕЛИКОМ, по границам слов: разрыв внутри
   слова («удостоверени-я», «Свидетельств-а») недопустим. */
.card3[data-b] .foldh[data-b] > span[data-b]:first-child {
  min-width: 0;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: manual;
}

.card3[data-b] {
  overflow-wrap: normal;
  hyphens: manual;
}

/* телефон: карточки в столбик по две, картинка и заголовок в строке */
@media (max-width: 760px) {
  .cards3[data-b].ryadom {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cards3[data-b].kart4 .card3[data-b] .cardimg,
  .cards3[data-b].kart3:not(.ryadom) .card3[data-b] .cardimg,
  .cards3[data-b].korp .card3[data-b] .cardimg {
    height: 44px;
  }
}

/* ── 32. Кнопка, блок качества, вопросы-ответы (диктовка 26) ──────────── */

/* 32.1. «Смотреть все услуги» - красная кнопка, как на действующем сайте,
   с тем же запасом до блока карточек. */
.vseuslugi-obertka {
  margin: 34px 0 0;
}

.vseuslugi {
  display: inline-block;
  padding: 14px 34px;
  border-radius: 8px;
  background: #8c1821;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
}

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

/* 32.2. «Нам не все равно» - два столбца 30/70: слева визуал, справа текст.
   Пока картинки нет, текст занимает всю ширину (пустой колонки не будет). */
.kachestvo-ryad {
  display: grid;
  grid-template-columns: minmax(0, 30fr) minmax(0, 70fr);
  align-items: start;
  gap: 30px;
}

.kachestvo-ryad:not(:has(.kachestvo-visual)) {
  grid-template-columns: minmax(0, 1fr);
}

.kachestvo-visual img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
}

.kachestvo-tekst .long[data-b] {
  max-width: none;
}

@media (max-width: 760px) {
  .kachestvo-ryad {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
}

/* 32.3. Вопросы и ответы: во всю ширину раздела и каждый вопрос - такая же
   карточка с тенью, как все блоки сайта. */
#faq .q[data-b] {
  border-bottom: 0;
  border-radius: 16px;
  padding: 18px 24px;
  margin-bottom: var(--card-gap, 30px);
  background: #fff;
  box-shadow: var(--tenj-bloka);
}

#faq .q[data-b] p[data-b] {
  max-width: none;
}

body.mob #faq .q[data-b] {
  padding: 14px 16px;
}

/* Вопросы и ответы во всю ширину раздела: guide.css держит их в текстовой
   колонке (52rem) - диктовка 26 требует полной ширины. */
#faq .q[data-b] {
  width: auto;
  max-width: none;
  margin-inline: 0;
}


/* ── 33. Ширина сайта (решение Павла 17.08.2026) ───────────────────────────

   Правила здесь НЕТ намеренно. Ширина задана один раз в shapka.css,
   раздел 27: переменная --shirina-sajta: 1172px (рабочих 1140), и правило
   там написано с приставкой `body`, чтобы бить эталон на всех страницах
   сразу - и на главной, и на внутренних. Дубль в этом файле был бы вторым
   местом, где живёт одно и то же число.

   Если ширину надо поменять - идти в shapka.css, раздел 27, и в
   критический стиль в начале home_page.html (там число написано руками:
   он рисует первый экран до того, как объявлены переменные). */


/* ── 34. Заголовок раздела стоит ровно посередине (диктовка Павла 33) ─────

   Дословно: «от [конца предыдущего блока] до H2 и от H2 до начала блока -
   это расстояние должно быть одинаковым, до H2 и после H2».

   Было несимметрично: сверху 190px, снизу 40px - заголовок липнул к своему
   содержимому и читался как продолжение предыдущего раздела. Теперь сверху и
   снизу одно и то же число - переменная --sp-block (95px на компьютере,
   48px на телефоне).

   Подзаголовок, если он есть (цены, преимущества компаниям), встаёт вплотную
   под заголовок - 14px, - а уже от него отсчитывается тот же отступ до
   содержимого. Отрицательный верхний отступ гасит нижний отступ заголовка:
   считается как 14 минус --sp-block.

   Откат: удалить раздел 34, вернётся 40px после заголовка. */
.blk[data-b] > h2[data-b],
.galp[data-b] > h2[data-b],
.blk.pisma > h2[data-b] {
  margin-bottom: var(--sp-block);
}

body.mob .blk[data-b] > h2[data-b],
body.mob .galp[data-b] > h2[data-b],
body.mob .blk.pisma > h2[data-b] {
  margin-bottom: var(--sp-block);
}

/* Подзаголовок: сверху прижат к заголовку (14px), снизу - тот же отступ,
   что и до заголовка. Отрицательный верхний отступ гасит нижний отступ
   заголовка, поэтому считается как 14 минус --sp-block.

   ВАЖНО: отрицательный отступ даётся ТОЛЬКО подзаголовку, который стоит
   сразу за заголовком. Раньше правило било по всем .sub в блоке, и в блоке
   заявки строка «Согласие на обработку персональных данных» - она идёт
   ПОСЛЕ кнопки - уезжала на 75px вверх и вставала выше самой кнопки, а
   кнопка вылезала за нижнюю границу блока на 58px. Поймано обмером. */
/* Между заголовком и подзаголовком бывает кнопка «Читать далее»: её
   ставит мобильный сценарий сразу за заголовком, и на компьютере она
   остаётся в дереве скрытой. Соседство «h2 + .sub» при этом ломается, и
   просвет становится полным отступом заголовка вместо 14 (замер
   31.08.2026 на «Техническом переводе»: 70). Правка Павла: «пусть везде
   будет 14». */
.blk[data-b] > h2[data-b] + .sub[data-b],
.galp[data-b] > h2[data-b] + .sub[data-b],
.blk[data-b] > h2[data-b] + .tp-readmore + .sub[data-b],
.galp[data-b] > h2[data-b] + .tp-readmore + .sub[data-b],
.blk[data-b] > h2[data-b] + .readmore + .sub[data-b],
.galp[data-b] > h2[data-b] + .readmore + .sub[data-b] {
  margin-top: calc(14px - var(--sp-block));
}

.blk[data-b] > .sub[data-b],
.galp[data-b] > .sub[data-b] {
  margin-bottom: var(--sp-block);
}

/* Подзаголовков может идти несколько подряд - в блоке заявки их три: зачин,
   пояснение и согласие на обработку данных. Между собой они стоят тесно, по
   8px: верхний отступ второго и следующих гасит нижний отступ предыдущего.
   Отступ до содержимого при этом сохраняется - его даёт последний из них.

   Через `:has(+ :not(.sub))` не вышло: браузер такой относительный селектор
   с соседним комбинатором не сопоставил, проверено на живой странице. */
.blk[data-b] > .sub[data-b] + .sub[data-b],
.galp[data-b] > .sub[data-b] + .sub[data-b] {
  margin-top: calc(8px - var(--sp-block));
}


/* ── 35. Правки Павла из ШРИФТЫ_САЙТА_3.docx (17.08.2026) ─────────────────

   Принцип, заданный Павлом дословно: «менять только ту сущность, которую я
   пометил. Если написал поменять на 15, а было 13 - просто сделать 15. Всё
   остальное - цвет, жирность - оставляем как было».

   Поэтому ниже у каждого правила ровно одно-два свойства, а не полный набор.

   «Тёмно-серый» - #3d4247. Это не новый цвет: им на сайте уже набраны вводный
   абзац первого экрана и пересказ письма, так что палитра не расширяется.

   Откат: удалить раздел 35 целиком. */
:root {
  --tekst-temno-seryj: #3d4247;
}

/* 2. Заголовок страницы: 31 → 40.
   Приписка [data-h] обязательна: эталонный glavnaya-a.css задаёт
   h1[data-h], и селектор с атрибутом сильнее простого `body h1`. */
body h1[data-h] {
  font-size: 40px;
}

/* 4. Оценка площадки: 24 → 20.
   Прежнее значение стояло в разделе 13 с селектором body:not(.mob) - он
   сильнее, поэтому повторяем его форму. */
body:not(.mob) .plat[data-b] .prat[data-b] {
  font-size: 20px;
}

/* 5. Звёзды площадки: 12 → 15 (цвета площадок не трогаем) */
.plat[data-b] .stars[data-b] {
  font-size: 15px;
}

/* 6. Имя автора отзыва: 13 → 15 */
.rev[data-b] .rname[data-b] {
  font-size: 15px;
}

/* 7. Текст отзыва: цвет → тёмно-серый */
.rev[data-b] > p[data-b] {
  color: var(--tekst-temno-seryj);
}

/* 8. Должность подписанта письма: 13 → 15, цвет → тёмно-серый.
   Прежнее значение задано в разделе 27 через .blk.pisma - повторяем эту же
   форму, иначе не перебить. */
.blk.pisma .pismo-dolzhnost {
  font-size: 15px;
  color: var(--tekst-temno-seryj);
}

/* 9-13. Поясняющий текст карточек - услуги, отрасли, преимущества частным и
   компаниям, условия акций: цвет → тёмно-серый. Размер 15 остаётся. */
.card3[data-b] .foldb[data-b] p[data-b] {
  color: var(--tekst-temno-seryj);
}

/* 14-15. Кнопки видов перевода: 13 → 15; невыбранной добавлено полужирное
   начертание (выбранная и так полужирная). Цвета не трогаем. */
.tabsrow[data-b] .pt[data-b] {
  font-size: 15px;
  font-weight: 650;
}

/* 17. Цитата клиента в тарифе: цвет → тёмно-серый (курсив остаётся) */
.tarif[data-b] .quote[data-b] {
  color: var(--tekst-temno-seryj);
}

/* 18. Пояснение к цене: цвет → тёмно-серый */
.tarif[data-b] .tprice[data-b] span[data-b] {
  color: var(--tekst-temno-seryj);
}

/* 19. Подзаголовок «Что входит»: цвет → тёмно-серый (жирное остаётся) */
.tarif[data-b] .vhod[data-b] {
  color: var(--tekst-temno-seryj);
}

/* 20. Пункты «что входит»: цвет → тёмно-серый */
.tarif[data-b] li[data-b] {
  color: var(--tekst-temno-seryj);
}

/* 21-28. Таблицы цен: весь мелкий текст 13 → 15. Начертания и цвета
   сохранены, у направления («с языка» / «на язык») дополнительно
   тёмно-серый. */
.blk[data-b] table[data-b] th[data-b],
.blk[data-b] table[data-b] td[data-b],
.blk[data-b] .showall[data-b] {
  font-size: 15px;
}

.blk[data-b] table[data-b] th.napr[data-b] {
  color: var(--tekst-temno-seryj);
}

/* 29. Текст про работу с графикой: цвет → тёмно-серый */
#ceny .blk[data-b] > p[data-b],
#ceny > p[data-b] {
  color: var(--tekst-temno-seryj);
}

/* 30. Текст блока «Нам не всё равно»: цвет → тёмно-серый */
.kachestvo-tekst p[data-b],
p.long[data-b] {
  color: var(--tekst-temno-seryj);
}

/* 31. Вопрос в блоке вопросов: 17 → 15 */
#faq .q[data-b] > summary[data-b] {
  font-size: 15px;
}

/* 32. Ответ: цвет → тёмно-серый */
#faq .q[data-b] p[data-b] {
  color: var(--tekst-temno-seryj);
}