/* Парфе, 28.08.2026 (вечер). ПОРЯДОК НА ЭКРАНЕ ТЕЛЕФОНА И ПЛАВАЮЩИЕ ЭЛЕМЕНТЫ.

   Требования Романа и Виктории этого вечера:
     • «телефонная версия должна быть попроще, лёгкой, воздушной»;
     • «в шапке всё выглядит ужасно» — шапка была из четырёх строк и лезла на фото;
     • подарок вместо плашки приза, «коробочка, завязанная ленточкой», И ТОЛЬКО СЛЕВА;
     • подарок не должен перекрывать плашку «Скидка 5% за отзыв»;
     • «Перезвоните мне» показывать не сразу, а когда человек пошёл по сайту;
     • спеццена Fotona 4D — убрать с главной («масло масляное»), она живёт в аппаратной.

   Второе мнение по раскладке спросил у двух помощников (tools/nn.py, каналы gpt и or) —
   оба дали то же: подарок карточкой с золотой обводкой и иконкой коробки, звонок по прокрутке,
   отзыв внизу, одновременно на экране не больше двух элементов.

   🔴 Файл барабана /baraban.js НЕ ТРОГАЕМ — механика Виктории. Меняем только вид его
   плашки #pf-plashka и момент показа. Тексты, цены и телефоны не трогаем. */

/* ================== 1. АКЦИЯ FOTONA УХОДИТ С ГЛАВНОЙ ================== */
/* Карточку с таймером прячем только на главной: на /fotona/ и в аппаратной она остаётся. */
body.home .pf-akcia { display: none !important; }

/* Вместо неё — одна спокойная строка-ссылка (её ставит парный JS-сниппет). */
.pf-akcia-mini {
  display: block; margin: 18px auto 26px; max-width: 560px; text-align: center;
  font-size: 15px; line-height: 1.5; color: #8E2B3F; text-decoration: none;
  border: 1px solid #E3D2D7; border-radius: 14px; padding: 13px 18px; background: #fff;
}
.pf-akcia-mini:hover { border-color: #D8A15E; }
.pf-akcia-mini b { color: #421427; }
.pf-akcia-mini span { color: #9C8A8E; text-decoration: line-through; font-weight: 400; }
/* срок — отдельной строкой и мельче: в одну строку с ценой читалось скомканно */
.pf-akcia-mini i {
  display: block; margin-top: 5px;
  font-style: normal; font-size: 12.5px; color: #9C8A8E;
}

/* ================== 2. ПОДАРОК ==================
   Роман, 28.08.2026: «просто коробочка подарочек, человек сам нажмёт», плашка не нужна.
   Виктория просила «красивый упакованный подарок с ленточкой».
   Картинку коробки сгенерировали в Gemini (бордовая коробка, золотая лента и бант),
   белый фон убрали, файл лежит на сервере: /podarok.png (240x240, прозрачный фон).
   Здесь плашка барабана превращается в саму коробку: подложка, рамка и текст убраны.
   Клик остаётся его — открывается рулетка Виктории, /baraban.js не тронут. */
#pf-plashka, #pf-podarok {
  position: fixed;
  z-index: 100000;
  cursor: pointer;
  left: 20px !important; right: auto !important;
  /* 🔴 ОДНА ЛИНИЯ С КНОПКОЙ «Перезвоните мне» — 29.08.2026, разбор Романа на планшете.
     Кнопка задана инлайном: bottom: 92px, height: 60px. Значит и коробке даём РОВНО
     те же 92 и 60 — тогда у них совпадают и низ, и верх, и середина, на любой ширине,
     без единого замера скриптом.
     🔴 ПОЧЕМУ ЗДЕСЬ НЕЛЬЗЯ СЧИТАТЬ СКРИПТОМ (из-за этого коробка и прыгала):
     на сайте живёт чужой сторож cookie-баннера — setInterval(podnyatKnopki, 700).
     Каждые 700 мс он обходит все фиксированные элементы у низа экрана, при первом
     проходе запоминает их bottom в data-pf-bottom и потом СИЛОЙ ставит его обратно
     инлайном с !important. Любое наше значение он затирает через полсекунды —
     получается качели. Поэтому bottom коробки не трогаем ниоткуда: он статичный,
     сторож запомнит 92 и будет возвращать те же 92. */
  bottom: 92px !important;
  width: 68px !important; height: 60px !important; max-width: none !important;
  padding: 0 !important;
  background: url("/podarok.png?v=2") bottom center/contain no-repeat !important;
  border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  filter: drop-shadow(0 10px 18px rgba(66,20,39,.28));
}
/* текст плашки не показываем — говорит сама коробка */
#pf-plashka-t, #pf-plashka-s { display: none !important; }
/* крестик оставляем, чтобы подарок можно было убрать, но делаем его незаметным */
#pf-plashka-x, #pf-podarok-x {
  top: -4px !important; right: -4px !important;
  width: 22px; height: 22px; padding: 0 !important;
  background: rgba(255,255,255,.92) !important; border-radius: 50% !important;
  color: #8E2B3F !important; font-size: 15px !important; line-height: 20px !important;
  box-shadow: 0 2px 6px rgba(66,20,39,.25);
}

/* ================== 3. КТО КОГДА ПОКАЗЫВАЕТСЯ ==================
   подарок  — сразу, слева; уходит, когда человек дошёл до низа;
   звонок   — только после того, как человек пошёл по сайту (класс pf-poehal);
   отзыв    — только внизу страницы (класс pf-vniz), и подарка там уже нет.
   Классы ставит парный JS-сниппет. */
body:not(.pf-poehal) #pf-callback-btn { display: none !important; }
body a[href*="add-review=true"] { display: none !important; }
body.pf-vniz a[href*="add-review=true"] { display: inline-flex !important; }
body.pf-vniz #pf-plashka, body.pf-vniz #pf-podarok { display: none !important; }

/* Пока в кадре карточка акции (страницы, где она осталась) — плавающих плашек нет. */
body.pf-akcia-vidna #pf-callback-btn,
body.pf-akcia-vidna #pf-plashka,
body.pf-akcia-vidna #pf-podarok,
body.pf-akcia-vidna a[href*="add-review=true"] { display: none !important; }

/* ================== 4. ТЕЛЕФОН: ЛЁГКАЯ ШАПКА ================== */
@media (max-width: 480px) {

  /* шапка в одну строку: логотип слева, гамбургер справа */
  #site-header-main-inside {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 10px 16px !important;
  }
  #branding { margin: 0 !important; float: none !important; width: auto !important; flex: 0 0 auto !important; }
  #branding img.custom-logo { margin: 0 !important; max-height: 58px !important; width: auto !important; }
  a#nav-toggle { position: static !important; margin: 0 !important; flex: 0 0 auto !important; }

  /* Фон шапки тема заливает ПОЛУПРОЗРАЧНЫМ белым (rgba(255,255,255,.6) !important),
     а шапка лежит поверх фото — получалась мутная полоса «наполовину белая,
     наполовину коричневая». Селектор берём тот же, что у темы, иначе не перебить. */
  #masthead.cryout #site-header-main { background: #ffffff !important; }

  /* Телефон, адрес, часы и пилюля записи уходят из шапки: их возвращала наша же
     правка от 01.08 на <= 640 px. Номер не потерян — JS ставит его первой строкой
     в мобильное меню, плюс он в контактах, в подвале и в кнопке «Перезвоните мне». */
  body #topbutton-3 { display: none !important; }
  body #masthead { padding-bottom: 0 !important; }
  body #site-header-main { height: auto !important; min-height: 0 !important; padding-bottom: 0 !important; }

  /* высота ровно как у кнопки «Перезвоните мне» (60 px), иначе верхние края
     расходятся на 4 px — замер на 390x844 29.08.2026 */
  #pf-plashka, #pf-podarok { left: 12px !important; width: 68px !important; height: 60px !important; }
  .pf-akcia-mini { font-size: 14px; margin: 14px auto 20px; }
}

/* ================== 5. СТРАНИЦЫ СО СВОЕЙ НИЖНЕЙ КНОПКОЙ ==================
   На посадочных (/inekcii/, /fotona/, /lpg/, /epilyaciya/) внизу висит своя
   фиксированная кнопка «Записаться — консультация бесплатно» во всю ширину.
   Замер на 390 px: наша коробка ложилась ПОВЕРХ её левого края, а «Перезвоните мне»
   накрывала текст карточки с препаратами.
   Разбор с помощниками (Kimi, Qwen, GPT — сошлись все трое):
     • «Перезвоните мне» здесь дубль главной кнопки — убираем, чтобы не спорили;
     • коробку поднимаем НАД кнопкой, а не кладём на неё;
     • контенту даём отступ снизу, чтобы кнопка не резала текст.
   Класс и высоту кнопки считает JS. */
body.pf-nizhnyaya-knopka #pf-callback-btn { display: none !important; }
/* 🔴 Поднимаем коробку над нижней кнопкой ТОЛЬКО трансформом.
   Через bottom нельзя: чужой сторож cookie-баннера возвращает bottom назад каждые
   700 мс (см. пояснение в разделе 2). transform он не трогает — стоит намертво. */
body.pf-nizhnyaya-knopka #pf-plashka,
body.pf-nizhnyaya-knopka #pf-podarok {
  /* max(0px, …): если чужая кнопка ниже нашей линии, коробку не опускаем — только поднимаем */
  transform: translateY(calc(-1 * max(0px, var(--pf-niz, 64px) - 82px))) !important;
}
body.pf-nizhnyaya-knopka { padding-bottom: calc(var(--pf-niz, 64px) + 10px); }

/* ================== 6. ПЛАНШЕТ И МАЛЫЙ НОУТБУК (801–1099 px) ==================
   Роман 29.08.2026: «сейчас мы работаем с компьютерной планшетной версией, также для ноутбука».
   Что было найдено замерами на 820 и 1024 (главная, браузер 3):
     • Кнопка «ОНЛАЙН-ЗАПИСЬ» на этих ширинах ПРОПАДАЛА совсем — её гасит чужое правило
       @media (min-width:801px) and (max-width:1099px){ .header-book-btn{display:none} }.
       Видимо, потому что в одну строку с меню и контактами она не помещалась.
       Это главная кнопка записи на сайте, и на планшете её не было вообще.
     • На 820 меню ломалось на ДВЕ строки: «…ЦЕНЫ» сверху, «ВАКАНСИИ КОНТАКТЫ» — ниже.
   Решение:
     • блок контактов (телефон · адрес · часы) ставим колонкой и возвращаем кнопку
       под них, к правому краю — по ширине блок остаётся прежним, меню не сжимается;
     • иконки соцсетей 44 → 36 px, чтобы освободить строку;
     • 940–1099: меню чуть мельче, всё влезает в одну строку;
     • 801–939: меню переносим отдельной строкой во всю ширину по центру и красим
       её в белый — иначе полоса меню ложится на фото первого экрана. */
@media (min-width: 801px) and (max-width: 1099px) {
  #sheader.socials a { width: 36px !important; height: 36px !important; }
  p.topbutton-3 { flex-direction: column !important; align-items: flex-end !important; gap: 7px !important; }
  /* селектор из трёх частей намеренно: чужое правило, которое её прячет, объявлено
     тем же весом и НИЖЕ нашего файла — при равной силе побеждало оно (проверено
     живьём на 820: кнопка осталась скрытой). Поднимаем специфичность и выигрываем. */
  #site-header-main p.topbutton-3 a.header-book-btn {
    display: inline-block !important;
    margin: 0 !important; padding: 7px 16px !important; font-size: 12px !important;
  }
}
/* ================== 7. МЕНЮ В ШАПКЕ: ЧЁТКОЕ, А НЕ РАЗМЫТОЕ ==================
   Роман 29.08.2026: «на планшете и на компьютере, где написано ГЛАВНАЯ АКЦИИ УСЛУГИ,
   как-то всё размыто, мелко — надо сделать правильно, контурно прорисовать».

   ЧТО НАШЛОСЬ ЗАМЕРОМ (главная, живая страница):
     • Шрифт меню — Poiret One. У него существует ЕДИНСТВЕННОЕ начертание — волосяное 400
       (в document.fonts загружено только «Poiret One 400 normal»). Тема при этом просит
       у него вес 700. Настоящего жирного нет, и браузер рисует ПОДДЕЛЬНЫЙ: сам обводит
       и без того тончайшие штрихи. Это и читается как «размыто».
     • Размер 13 px при разрядке 1 px — мелко для главного меню.
     • Цвет ни при чём: rgb(66,20,39) на белом даёт контраст 15,43 : 1 при норме 4,5 : 1.

   ПОЧЕМУ ПРОСТО УВЕЛИЧИТЬ ШРИФТ БЫЛО НЕЛЬЗЯ. На компьютере меню зажато между логотипом,
   телефоном, кнопкой записи и иконками — ему достаётся ~440 px. Замер на 1280: семь
   пунктов шрифтом Open Sans не влезают туда даже при 13 px (нужно 451 px), а Poiret One
   помещался только потому, что он неестественно узкий. Отсюда и решение Романа —
   вариант первый: меню уходит на СВОЮ строку, где ширины сколько угодно.

   🔴 ПОПУТНО ПОЧИНЕН ДЕФЕКТ ТЕМЫ. У пунктов с выпадающим списком («О нас», «Услуги»,
   «Цены») стрелка нарисована значком шрифта Elusive через span::after с position:absolute
   и right:9px — но сам span не спозиционирован, поэтому стрелка ложилась ПОВЕРХ букв:
   «О НАС» и «ЦЕНЫ» выглядели перечёркнутыми. Даём span position:relative и место справа. */
@media (min-width: 801px) {
  #access {
    display: block !important; width: 100% !important; clear: both !important; float: none !important;
    padding-top: 2px !important; background: #ffffff !important;
  }
  #access ul#prime_nav { display: flex !important; justify-content: center !important; flex-wrap: nowrap !important; }
  #access ul#prime_nav > li { float: none !important; }
  /* 🔴 Селектор нарочно такой длинный. На сайте живут ТРИ чужих правила, которые жёстко
     ставят меню 11 px: для 801–1099, для 1100–1199 и «html body nav#access ul#prime_nav > li > a»
     для 1024–1365. Их когда-то написали, чтобы семь пунктов влезали в одну строку с логотипом.
     Теперь меню стоит своей строкой, и эти правила только мельчат его. Последнее из них
     сильнее обычного селектора и объявлено ниже нашего файла — поэтому добавляем класс
     .menu-item, чтобы наш вес был выше. Проверено замером: без этого на 1280 и 1024
     меню оставалось 11 px, хотя мы просили 15. */
  html body nav#access ul#prime_nav > li.menu-item > a {
    font-family: "Open Sans", Arial, sans-serif !important;   /* тот же шрифт, что у текста сайта: у него есть настоящий полужирный */
    font-size: 15px !important;
    font-weight: 600 !important;                              /* НАСТОЯЩЕЕ начертание, а не дорисованное браузером */
    letter-spacing: .04em !important;
    color: #421427 !important;
    padding-left: 15px !important; padding-right: 15px !important;
  }
  /* стрелка выпадающего списка — на своё место, а не поверх букв */
  #access ul#prime_nav > li > a > span { position: relative !important; }
  /* 24 px, а не «на глаз»: замерено в браузере — значок стрелки шириной 10 px стоит
     на right:9px, поэтому при отступе 15 он наезжал на последнюю букву на 4 px
     («О НАС» читалось перечёркнутым). Чисто становится с 20 px, берём 24 с запасом
     на более длинные пункты. */
  html body nav#access ul#prime_nav > li.menu-item-has-children > a > span { padding-right: 24px !important; }
}

/* ================== 8. НАВЕДЕНИЕ НА ПУНКТ И ВЫПАДАЮЩИЙ СПИСОК ==================
   Роман 29.08.2026, со скрина планшета: «нажимаешь на пункт — выпадает, и там фиолетовое
   пятно какое-то».
   🔴 ЧЕСТНО: это моя регрессия предыдущей правки. Тема при наведении красит пункт в бордовый
   (`#access > div > ul > li:hover { background: rgb(66,20,39) }`) и делает текст БЕЛЫМ
   (`#access > div > ul > li:hover > a { color: #fff }`). Я задал пунктам цвет #421427
   с !important — и перебил этот белый. Вышло бордовое по бордовому: тёмная плашка,
   на которой текста не видно вовсе. Ровно «пятно».

   Делаем по-другому и мягче: тёмную заливку убираем совсем, при наведении даём светлую
   подложку цвета салона и подчёркивание. Так пункт видно, буквы читаются, и это не спорит
   с белой шапкой. */
@media (min-width: 801px) {
  /* никакой тёмной плашки под пунктом */
  html body nav#access > div > ul#prime_nav > li:hover,
  html body nav#access > div > ul#prime_nav > li.current-menu-item,
  html body nav#access > div > ul#prime_nav > li.current_page_item {
    background-color: transparent !important;
  }
  /* подсветка: светлая подложка + линия снизу */
  html body nav#access ul#prime_nav > li.menu-item:hover > a {
    color: #421427 !important;
    background-color: #F7F0EE !important;
    box-shadow: inset 0 -2px 0 0 #8E2B3F !important;
  }

  /* выпадающий список: белая карточка, буквы того же шрифта, что и меню, а не серый Poiret 12px */
  html body nav#access ul#prime_nav ul.sub-menu {
    background: #ffffff !important;
    border: 1px solid #EFE3E6 !important;
    border-radius: 10px !important;
    padding: 6px 0 !important;
    box-shadow: 0 12px 30px rgba(66,20,39,.16) !important;
  }
  html body nav#access ul#prime_nav ul.sub-menu > li > a {
    font-family: "Open Sans", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: .01em !important;
    color: #421427 !important;
    background: transparent !important;
  }
  html body nav#access ul#prime_nav ul.sub-menu > li > a:hover {
    background: #F7F0EE !important;
    color: #8E2B3F !important;
  }
  html body nav#access ul#prime_nav ul.sub-menu > li:hover {
    background-color: transparent !important;
  }
}

/* ================== 9. ШАПКА ПО СХЕМЕ CASABLANCA, НО СО ВСЕМ НАШИМ ==================
   Роман 29.08.2026, прислал скрин конкурента mycasablanca.ru: «наши элементы нужно разложить
   по их схеме, у нас просто элементов больше — своё всё оставить».

   ИХ ШАПКА, СНЯТАЯ ЗАМЕРОМ С ЖИВОГО САЙТА (1280 px):
     вся шапка 110 px, поля по 40 · верхняя строка 75 px: логотип слева (h48) · адрес и часы
     двумя строками справа · заполненная кнопка «ОНЛАЙН ЗАПИСЬ» 178x45 · контурная «Позвонить»
     145x45 · нижняя строка 35 px: меню во всю ширину, пункты 14 px, разнесены от края до края.

   НАША РАСКЛАДКА ПО ТОЙ ЖЕ СХЕМЕ (ничего своего не потеряли, наоборот):
     логотип · адрес и часы · кнопка «ОНЛАЙН-ЗАПИСЬ» · кнопка с НОМЕРОМ телефона (у них там
     безликое «Позвонить», у нас номер виден сразу) · иконки наших площадок (их у Casablanca
     в шапке нет вовсе) · меню нижней строкой во всю ширину.

   🔴 ДВЕ ЗАСАДЫ, НА КОТОРЫХ ЭТО СОБИРАЛОСЬ (обе пойманы замером, не на глаз):
     1. Номер телефона лежит ВНУТРИ span.header-contact вместе с адресом, а кнопка записи —
        снаружи. Поставить номер после кнопки обычным порядком нельзя. Решает `display: contents`
        у span: обёртка перестаёт быть контейнером, и её дети встают прямо во флекс родителя,
        где им уже можно задать order.
     2. У p.topbutton-3 тема держит ОБРАТНОЕ направление флекса (row-reverse) — из-за этого
        order давал зеркальный результат: телефон уезжал влево, за логотип. Поэтому направление
        задаём явно: flex-direction: row. */
@media (min-width: 801px) {
  html body #site-header-main-inside {
    display: flex !important; flex-wrap: wrap !important; align-items: center !important;
    justify-content: flex-start !important; gap: 0 !important; padding: 12px 40px 0 !important;
  }
  html body #branding { order: 1 !important; flex: 0 0 auto !important; margin: 0 !important; float: none !important; }
  html body #branding img.custom-logo { height: 74px !important; max-height: 74px !important; width: auto !important; margin: 0 !important; }

  html body #site-header-main-inside > #topbutton-3 { order: 2 !important; flex: 1 1 auto !important; float: none !important; margin: 0 !important; }
  html body p.topbutton-3 {
    display: flex !important; flex-direction: row !important; align-items: center !important;
    justify-content: flex-end !important; gap: 22px !important; margin: 0 !important;
  }
  html body p.topbutton-3 .header-contact { display: contents !important; }
  html body p.topbutton-3 a.header-address {
    order: 1 !important; display: block !important; text-align: right !important;
    font-size: 14px !important; line-height: 1.5 !important; font-weight: 600 !important;
  }
  html body #site-header-main-inside p.topbutton-3 a.header-book-btn {
    order: 2 !important; padding: 13px 26px !important; font-size: 13px !important;
    border-radius: 26px !important; margin: 0 !important;
  }
  html body p.topbutton-3 a.header-phone {
    order: 3 !important; display: inline-block !important;
    border: 1.5px solid #421427 !important; border-radius: 26px !important;
    padding: 12px 22px !important; font-size: 15px !important; font-weight: 700 !important;
    white-space: nowrap !important; color: #421427 !important;
  }
  html body #site-header-main-inside > #sheader.socials {
    order: 4 !important; flex: 0 0 auto !important; float: none !important; margin: 0 0 0 22px !important;
  }
  html body #sheader.socials a { width: 34px !important; height: 34px !important; }

  /* меню — нижней строкой во всю ширину, пункты разнесены от края до края, как у них */
  html body #site-header-main-inside > nav#access { order: 9 !important; flex: 0 0 100% !important; padding-top: 4px !important; }
  html body nav#access ul#prime_nav { justify-content: space-between !important; }
  html body nav#access ul#prime_nav > li.menu-item > a { padding-left: 0 !important; padding-right: 0 !important; }
  html body nav#access ul#prime_nav > li.menu-item:hover > a {
    background: transparent !important; box-shadow: inset 0 -2px 0 0 #8E2B3F !important;
  }

  /* 🔴 Полоска над «ГЛАВНАЯ»: тема метит текущую страницу линией СВЕРХУ
     (border-top: 2px solid #421427). Роман: «полоска осталась». Убираем сверху,
     метку даём снизу — так же, как подсветку при наведении. */
  html body nav#access ul#prime_nav > li.menu-item > a { border-top: 0 !important; }
  html body nav#access ul#prime_nav > li.current-menu-item > a,
  html body nav#access ul#prime_nav > li.current_page_item > a { box-shadow: inset 0 -2px 0 0 #8E2B3F !important; }
}

/* ================== 10. ВЫСОТА ШАПКИ: НЕ ДАЁМ ЕЙ РАСПУХАТЬ ==================
   Роман 29.08.2026: «каждая страница у тебя упала» — после переезда меню на свою строку
   шапка выросла до 174 px, и весь контент, естественно, опустился.
   Жир нашёлся в пунктах меню: тема держит им line-height 68 px — это осталось от времён,
   когда меню стояло В ОДНУ строку с логотипом и должно было тянуться на всю её высоту.
   Своей строке столько не нужно. Ставим 42 и убираем лишние отступы контейнера.
   Замер: было 174 px, стало 138 (у Casablanca, для сравнения, 110 при более мелком меню). */
@media (min-width: 801px) {
  html body #site-header-main-inside { padding-top: 6px !important; padding-bottom: 0 !important; }
  html body #site-header-main-inside > nav#access { padding-top: 0 !important; }
  html body nav#access ul#prime_nav > li.menu-item > a { line-height: 42px !important; }
  html body #masthead { padding-bottom: 0 !important; }
}

/* ================== 11. ВЕРХНИЙ ВОЗДУХ СТРАНИЦ — УБРАТЬ ЛИШНЕЕ ==================
   Роман 29.08.2026: «все страницы кроме первой упавшие, подтянуть под линию».
   Замер на /o-nas/ (1280, чистый контекст, без админки) показал, из чего складывалась дыра
   в 119 px под шапкой:
       наш отступ 92 · .article-inner padding-top 30 · .entry-content padding-top 19,5 ·
       margin-top первого заголовка 45,4
   Наш отступ считает скрипт (по контейнеру #content — величина устойчивая), а собственные
   отступы темы для первого экрана избыточны, их подрезаем здесь.

   🔴 ЧТО УЧТЕНО ИЗ РАЗБОРА С ПОМОЩНИКАМИ (Kimi, GPT, 29.08):
     • у .article-inner отступ НЕ обнуляем в ноль, а оставляем 10 px: обнулив родителя,
       мы бы получили схлопывание margin — отступ заголовка «выпал» бы наружу, и расчёт
       скрипта, сделанный до этого, стал бы неверным;
     • заголовки Elementor не трогаем вовсе: на страницах, где сверху идёт hero-секция или
       слайдер, правило «первому заголовку margin 10» сдвинуло бы совсем не то;
     • правим только разметку темы Fluida (.article-inner / .entry-content), которая и даёт
       лишний воздух на обычных страницах. */
/* 🔴 ПРАВКА 29.08.2026 (v=33), ТЕЛЕФОН. Роман смотрел телефонную версию: под шапкой на всех
   внутренних страницах висела дыра 93–103 px, на компьютере там 18. Причина — этот блок правил
   лежал внутри @media (min-width: 801px) и до телефона не доходил. Замер на 390 px разложил дыру
   по слагаемым: наш воздух 8 · .article-inner 27 · .entry-content 17,55 · h1 margin-top 40,89
   (+ .elementor-widget-wrap 10 на страницах Elementor) = 93,44 и 103,44 px.
   Медиазапрос снят: отступы контента от ширины экрана не зависят, правила одни для всех.
   Ожидаемо после правки: 8 + 10 = 18 px, ровно как на компьютере. */
@media all {
  html body #content .article-inner { padding-top: 10px !important; }
  html body #content .entry-content { padding-top: 0 !important; }
  /* первому элементу содержимого верхний отступ не нужен — он и так первый */
  html body #content .entry-content > *:first-child { margin-top: 0 !important; }

  /* 🔴 Страницы на Elementor (например /vse-akcii/) — отдельный случай: там своя разметка,
     и после первой правки провал остался (проверено глазами: заголовок «Акции и скидки»
     стоял в 90 px от шапки). Разбираем по замеру: .elementor-widget-wrap даёт 10 px,
     а заголовку margin-top 45,4 ставит ТЕМА, а не дизайнер в конструкторе.
     Поэтому снимаем этот отступ ТОЛЬКО у заголовка в САМОЙ ПЕРВОЙ секции страницы —
     ниже по странице всё остаётся как задумано. */
  html body #content .elementor > .elementor-section:first-child .elementor-widget-wrap { padding-top: 0 !important; }
  /* селектор бьёт по ПЕРВОМУ виджету в первой секции: на /uslugi-i-czeny/ заголовок лежит
     в .elementor-widget-wrap > .elementor-element:first-child, и правило с «.elementor-widget»
     мимо него промахивалось — провал в 63 px оставался (проверено глазами) */
  /* 🔴 Ловим заголовок в первом виджете первой секции в ОБОИХ видах: на /vse-akcii/ это
     h1.elementor-heading-title, а на /uslugi-i-czeny/ — голый H1 без классов Elementor.
     Правило только с классом промахивалось, и на «Ценах» провал в 63 px оставался. */
  html body #content .elementor > .elementor-section:first-child .elementor-widget-wrap > .elementor-element:first-child :is(h1, h2, .elementor-heading-title) {
    margin-top: 0 !important;
  }
}

/* ================== 12. ИКОНКИ ПЛОЩАДОК В МОБИЛЬНОМ МЕНЮ — РОВНЫЙ РЯД ==================
   Роман 29.08.2026, по трём скриншотам с планшета: «иконки почему-то по кругу — это так
   специально или косяк?». Круглая форма специальная (сниппет «мрамор с золотом» 23.08),
   а вот РАЗНОБОЙ — косяк, и вот его механика.
   Замер в открытом мобильном меню на 390 px:
       ВКонтакте 44x44 (центр 255) · Дзен 44x44 (центр 255)
       Телеграм  34x34 (центр 262) · 2ГИС 38x38 (центр 264)
   Разброс 10 px по размеру и 9 px по линии — ряд «пляшет».
   Причина: правило в «Дополнительных стилях» темы (блок wp-custom-css, раздел «6. Соцсети
   внизу мобильного меню») писалось 21.08, когда площадок было ДВЕ, и поднимает до 44 только
   .menu-item-4527 (ВК) и .menu-item-4890 (Дзен). Телеграм (.menu-item-4920) остался 34 со своим
   margin-top:12px, 2ГИС (.pf-2gis) — 38. Добавили площадки, а селекторы не дополнили.
   🔴 Чужой блок wp-custom-css стоит в документе НИЖЕ нашего файла (позиция 79 638 против 50 141),
   поэтому при равном весе побеждает он — берём !important, у чужого правила его нет.
   Правим у себя, в чужой блок темы не лезем. */
html body #smobile.socials a {
  width: 44px !important;
  height: 44px !important;
  margin: 0 !important;
}

/* ================== 13. МОБИЛЬНОЕ МЕНЮ: КНОПКА ЗАПИСИ ПО ЦЕНТРУ ==================
   Роман 29.08.2026, скриншот с телефона: «онлайн-запись смещена влево, поставь в середину».
   Замер на 390 px при открытом меню:
       кнопка 186 px, левый край 59, до правого края экрана 146 → центр кнопки 151
       при центре экрана 195, то есть перекос влево на 44 px.
   Причина: кнопка лежит в пункте li.menu-item-1975 меню #mobile-nav. Сам список отцентрован
   (слева 59, справа 58 — ровно), а внутри пункта текст выровнен по левому краю, и кнопка,
   будучи inline-элементом уже списка, прижимается к его левой границе.
   Лечим выравниванием самого пункта: (273 − 186) / 2 = 43,5 px с каждой стороны,
   центр кнопки встаёт на 195 — ровно середина экрана.
   🔴 Селектор только для #mobile-nav: в десктопном #prime_nav этот же пункт трогать нельзя. */
html body #mobile-nav li.menu-item-1975 { text-align: center !important; }

/* ================== 14. ПОДАРОК ПРИ ОТКРЫТОМ МЕНЮ — СПРАВА ==================
   Роман 29.08.2026: «подарок на этой странице переместить, чтоб он был справа —
   тогда никому не мешает». Речь про открытое мобильное меню: там коробка стояла слева
   (left 12) и налезала на кнопку записи и на пункт «Контакты».
   На обычных страницах коробка остаётся СЛЕВА — Роман про неё сказал «стоит нормально,
   не трогай», поэтому правило включается только при открытом меню (тема вешает на body
   класс noscroll).
   Замер: при открытом меню «Перезвоните мне» скрыта (display:none), справа свободно,
   столкнуться не с чем. Двигаем только по горизонтали: bottom не трогаем — его каждые
   700 мс переставляет чужой сторож cookie-баннера, и любое наше значение он затирает. */
html body.noscroll #pf-podarok {
  left: auto !important;
  right: 12px !important;
}

/* ================== 15. ПЛАШКА ЗАПИСИ — ПОДНЯТЬ В СЕРЕДИНУ ПУСТОГО МЕСТА ==================
   Роман 29.08.2026, по своему скриншоту с пометкой: «плашку просто приподнять, плюс-минус
   ровно по центру между иконками и надписью „Главная“ — остальное не трогать».
   🔴 Первая попытка была неверной: я двигал отступы всего меню, и раскладка поехала.
   Вернул её как была и трогаю ТОЛЬКО саму плашку.
   Замер после возврата: низ блока с телефоном и иконками — 310, плашка стоит 418–468
   (высота 50), сразу за ней «Главная». Центр промежутка 310…468 = 389,
   значит верх плашки должен быть 389 − 25 = 364, сдвиг −54 px.
   Отрицательный margin-top поднимает плашку, равный положительный margin-bottom
   возвращает на место всё, что идёт ниже: «Главная» и остальные пункты не сдвигаются.
   Итог: сверху 54 px, снизу 54 px — плашка ровно посередине. */
html body #mobile-nav > li.menu-item-1975 {
  margin-top: -54px !important;
  margin-bottom: 54px !important;
}

/* ================== 16. ЖИВОЙ 3D-ПЕРВЫЙ ЭКРАН ПОСАДОЧНЫХ ==================
   Роман 29.08.2026: «все страницы разные — эталон это первая страница»; «хочу, чтобы картинка
   внутри двигалась, как 3D-презентация». Разбор кадрами показал: у четырёх посадочных
   (/inekcii/, /fotona/, /lpg/, /epilyaciya/) первого экрана нет вообще — сразу бежевый фон
   и заголовок антиквой, фото аппарата мелко в рамке ниже.
   Делаем как на главной: фотография во всю ширину, поверх белый заголовок с тенью и две кнопки.
   Разница в том, что фото здесь ЖИВОЕ — панорама кабинета косметологии из нашего 3D-тура,
   она медленно плывёт сама (krpano autorotate).
   Числа взяты с эталона главной: заголовок Roboto 46 px вес 700 белый с тенью по центру,
   лид 18,5 px вес 500. */
#pf-geroy {
  position: relative;
  width: 100%;
  /* 🔴 29.08.2026, Роман с планшета: «две клавиши упали за линию». Замер на 1024 подтвердил:
     на /uslugi/ низ кнопок был 651 при низе блока 653 — впритык, а на планшете уже за краем.
     Причина: у блока была ЖЁСТКАЯ высота 58vh с потолком 620, а заголовок после правки
     стал в три строки, и содержимое переставало помещаться (overflow: hidden его резал).
     Теперь высота — не меньше 58vh, но растёт под содержимое: кнопки не вылезут никогда. */
  min-height: 58vh;
  height: auto;
  overflow: hidden;
  background: #241B1D;
  margin: 0 0 28px;
}
#pf-geroy .pf-geroy-pano,
#pf-geroy .pf-geroy-foto {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  object-fit: cover;
  pointer-events: none;      /* фон не перехватывает клики и прокрутку страницы */
}
/* затемнение: без него белый заголовок теряется на светлом интерьере */
#pf-geroy .pf-geroy-tma {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(36,27,29,.30) 0%, rgba(36,27,29,.52) 55%, rgba(36,27,29,.66) 100%);
}
#pf-geroy .pf-geroy-text {
  position: relative;
  z-index: 2;
  min-height: 58vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 24px 20px;
  box-sizing: border-box;
}
/* 🔴 Селектор усилен: на страницах Elementor заголовок несёт класс .elementor-heading-title
   и правило темы оказывалось сильнее — на /vse-akcii/ он остался волосяным Poiret One
   (видно кадром). Бьём и по тегу, и по классу, с полным путём html body. */
html body #pf-geroy h1,
html body #pf-geroy h1.elementor-heading-title,
html body #pf-geroy .pf-geroy-text h1 {
  margin: 0 0 14px !important;
  padding: 0 !important;
  max-width: 15em;
  /* 🔴 29.08.2026, скрин Романа с планшета: на /kontakty/ заголовок стоял «как-то с краю».
     Причина — заголовок переносится со страницы ВМЕСТЕ со своим inline-стилем
     `style="text-align: left"` (он лежит в колонке su_column 3/5), и левое выравнивание
     побеждало центрирование контейнера. Задаём центр самому заголовку и лиду. */
  text-align: center !important;
  font-family: Roboto, 'Open Sans', Arial, sans-serif !important;
  font-size: 46px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  color: #fff !important;
  text-shadow: 0 2px 20px rgba(0,0,0,.6), 0 1px 3px rgba(0,0,0,.5);
}
/* 🔴 Вес сбивала ВЛОЖЕННОСТЬ: на /o-nas/ текст заголовка лежит внутри
   <span style="font-weight:400">, и жирность, заданная самому H1, до букв не доходила —
   на кадре заголовок выглядел волосяным. Поэтому веса и цвета задаём и потомкам. */
html body #pf-geroy h1 *,
html body #pf-geroy h1 span,
html body #pf-geroy h1 strong {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  color: inherit !important;
  text-shadow: inherit;
}
html body #pf-geroy p *,
html body #pf-geroy p span {
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
}

html body #pf-geroy p,
html body #pf-geroy .pf-geroy-text p {
  text-align: center !important;
  margin: 0 0 22px !important;
  max-width: 34em;
  font-family: Roboto, 'Open Sans', Arial, sans-serif !important;
  font-size: 18.5px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  color: #FBF3F5 !important;
  text-shadow: 0 1px 14px rgba(0,0,0,.65), 0 1px 3px rgba(0,0,0,.5);
}
#pf-geroy .pf-geroy-knopki { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; }
#pf-geroy .pf-geroy-k1,
#pf-geroy .pf-geroy-k2 {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 52px; padding: 0 30px;
  font-family: 'Open Sans', Arial, sans-serif; font-size: 16px; font-weight: 700;
  border-radius: 999px; text-decoration: none; transition: all .2s ease;
}
#pf-geroy .pf-geroy-k1 { background: #fff; color: #5D1D39; }
/* 31.08.2026: кнопка первого экрана стала <button> (открывает окно записи) — снимаем рамку и ставим курсор */
#pf-geroy button.pf-geroy-k1 { border: 0; cursor: pointer; font: inherit; font-size: 16px; font-weight: 700; }
#pf-geroy .pf-geroy-k1:hover { background: #F7F0EE; }
#pf-geroy .pf-geroy-k2 { background: rgba(255,255,255,.08); color: #fff; box-shadow: inset 0 0 0 2px rgba(255,255,255,.85); }
#pf-geroy .pf-geroy-k2:hover { background: rgba(255,255,255,.2); }

@media (max-width: 800px) {
  #pf-geroy { min-height: 66vh; height: auto; }
  #pf-geroy .pf-geroy-text { min-height: 66vh; }
  /* 🔴 29.08.2026: заголовки стали длиннее (связка «клуб … салон красоты»), и на 390
     «Контакты клуба красоты «Парфе» — салон красоты в Балтийской жемчужине» вставал в семь
     строк и съедал весь первый экран. Кегль на телефоне уменьшен — проверено кадром. */
  html body #pf-geroy h1,
  html body #pf-geroy h1.elementor-heading-title,
  html body #pf-geroy .pf-geroy-text h1 { font-size: 26px !important; }
  #pf-geroy p { font-size: 16px !important; }
  #pf-geroy .pf-geroy-k1, #pf-geroy .pf-geroy-k2 { min-height: 48px; padding: 0 22px; font-size: 15px; }
  /* 🔴 29.08.2026, кадр на 390: на /uslugi/ лид в семь строк выдавил заголовок под шапку,
     а кнопки — за нижний край экрана. На телефоне лид держим в три строки, остальное
     человек читает в самом тексте страницы — он никуда не делся, лид только переносится. */
  #pf-geroy .pf-geroy-text p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}

/* Узкие телефоны: заголовок ещё компактнее, иначе связка «клуб … салон красоты»
   не помещается в первый экран (замер на 390 — семь строк до правки). */
@media (max-width: 430px) {
  html body #pf-geroy h1,
  html body #pf-geroy h1.elementor-heading-title,
  html body #pf-geroy .pf-geroy-text h1 { font-size: 24px !important; }
}

/* ===== ШИРОКИЙ СЛАЙДЕР РАЗДЕЛОВ (29.08.2026) =====
   Заменил шесть мелких картинок-плиток на странице цен: один широкий кадр,
   стрелки по бокам, подпись по центру — как большой баннер на главной. */
/* Роман 29.08: слайдер во ВСЮ ширину экрана, как большой баннер главной.
   Ширину берём из --pf-okno (её ставит JS по clientWidth — это ширина БЕЗ полосы прокрутки,
   поэтому 100vw и лишняя горизонтальная прокрутка нам не нужны). */
.pf-slajder{position:relative;overflow:hidden;border-radius:0;margin:34px 0 38px;
  width:var(--pf-okno,100vw);max-width:var(--pf-okno,100vw);
  margin-left:calc(50% - var(--pf-okno,100vw)/2);margin-right:calc(50% - var(--pf-okno,100vw)/2);
  background:#f3efec;box-shadow:0 6px 26px rgba(90,60,70,.13)}
.pf-slajd{display:none}
.pf-slajd.pf-akt{display:block;animation:pfProyav .55s ease}
@keyframes pfProyav{from{opacity:.25}to{opacity:1}}
.pf-slajd > a{display:block;position:relative;text-decoration:none}
.pf-slajd img{display:block;width:100%;height:560px;object-fit:cover;margin:0}
/* Роман 29.08: посередине кадра надписи быть не должно — название зала снизу карточки */
.pf-slajd-podpis{position:absolute;left:0;right:0;bottom:0;top:auto;transform:none;
  background:linear-gradient(to top, rgba(58,24,34,.82) 0%, rgba(58,24,34,.55) 55%, rgba(58,24,34,0) 100%);
  padding:46px 18px 16px;text-align:center;
  font-size:24px;line-height:1.2;letter-spacing:.03em;color:#fff}
.pf-strelka{position:absolute;top:50%;transform:translateY(-50%);z-index:5;
  width:52px;height:64px;border:0;cursor:pointer;background:rgba(107,43,63,.55);
  color:#fff;font-size:28px;line-height:1;transition:background .2s}
.pf-strelka:hover{background:rgba(107,43,63,.85)}
.pf-strelka-nazad{left:0;border-radius:0 6px 6px 0}
.pf-strelka-vpered{right:0;border-radius:6px 0 0 6px}
.pf-tochki{position:absolute;right:14px;bottom:14px;z-index:6;text-align:right}
.pf-tochka{display:inline-block;width:10px;height:10px;margin:0 5px;border-radius:50%;
  border:0;padding:0;cursor:pointer;background:rgba(255,255,255,.6)}
.pf-tochka.pf-akt{background:#6b2b3f}
@media (max-width:1024px){ .pf-slajd img{height:420px} .pf-slajd-podpis{font-size:21px;padding:40px 16px 14px} }
@media (max-width:800px){ .pf-slajd img{height:320px}
  /* подпись не должна залезать под стрелки — оставляем им поля по бокам */
  .pf-slajd-podpis{font-size:18px;padding:34px 56px 12px}
  .pf-strelka{width:40px;height:52px;font-size:22px} }
@media (max-width:430px){ .pf-slajd img{height:240px}
  .pf-slajd-podpis{font-size:15px;line-height:1.25;padding:28px 44px 10px}
  .pf-strelka{width:34px;height:46px;font-size:18px}
  /* на телефоне точки наезжали на название зала — листаем стрелками и пальцем */
  .pf-tochki{display:none} }

/* Слайдер аппаратов на «О нас»: подпись в две строки — марка со страной, описание и ссылка
   на сайт производителя (Роман 29.08: «не просто название, а описание, до страна производства»,
   «напротив каждого названия ставить ссылку производителя»). */
/* Кадры аппаратов вертикальные: в полноширинном баннере contain оставлял пустые поля,
   поэтому берём cover и смещаем фокус к экрану аппарата. */
.pf-slajder-appar .pf-slajd img{height:560px;object-fit:cover;object-position:center 42%;background:#fbf8f7}
.pf-slajd-podpis b{display:block;font-size:1.06em;margin-bottom:3px;letter-spacing:.02em}
.pf-slajd-podpis a{color:#fff;text-decoration:underline;white-space:nowrap}
.pf-slajd-podpis a:hover{opacity:.85}
.pf-slajder-appar .pf-slajd-podpis{font-size:17px;line-height:1.35;padding:52px 20px 18px}
@media (max-width:1024px){ .pf-slajder-appar .pf-slajd img{height:440px}
  .pf-slajder-appar .pf-slajd-podpis{font-size:16px} }
@media (max-width:800px){ .pf-slajder-appar .pf-slajd img{height:330px}
  .pf-slajder-appar .pf-slajd-podpis{font-size:14px;padding:40px 56px 14px} }
@media (max-width:430px){ .pf-slajder-appar .pf-slajd img{height:250px}
  .pf-slajder-appar .pf-slajd-podpis{font-size:13px;padding:34px 44px 12px} }

/* Подпись разработчика в подвале (Роман 29.08). Скромно, не спорит с контактами клуба. */
.pf-avtor{margin:18px auto 10px;padding:14px 16px 4px;text-align:center;
  font-size:13px;line-height:1.5;color:#8b7c80;border-top:1px solid rgba(139,124,128,.22);max-width:1100px}
.pf-avtor a{color:#6b2b3f;text-decoration:none;border-bottom:1px solid rgba(107,43,63,.35)}
.pf-avtor a:hover{border-bottom-color:#6b2b3f}
@media (max-width:430px){ .pf-avtor{font-size:12px;padding:12px 14px 4px} }

/* У аппаратов подпись длинная: точки уводим наверх, ссылку — на свою строку,
   иначе точки садятся прямо на «сайт производителя». */
.pf-slajder-appar .pf-tochki{top:14px;bottom:auto}
.pf-slajder-appar .pf-tochka{background:rgba(107,43,63,.35)}
.pf-slajder-appar .pf-tochka.pf-akt{background:#6b2b3f}
.pf-slajder-appar .pf-slajd-podpis a{display:inline-block;margin-top:6px;white-space:normal}

/* ================== 12. ТЕЛЕФОН: ЧИТАЕМОСТЬ И ПАЛЕЦ (30.08.2026) ==================
   Повод — прогон ВСЕХ 84 живых страниц на 390 px в ночь на 30.08 (mob_vse.mjs):
     • базовый font-size у body = 13.5 px, от него наследуется весь контент;
     • 4492 текстовых блока из 6429 (70%) мельче 14 px;
     • 1955 кнопок и ссылок из 2776 (70%) ниже 44 px — палец не попадает;
     • телефон и планшет дают 468 визитов из 766 за 30 дней (61%), Метрика 110447729;
     • Яндекс Вебмастер 28.08 поднял NOT_MOBILE_FRIENDLY — единственная активная проблема.
   🔴 Разбор плана с Kimi (30.08), что он завернул и почему:
     • !important на font-size перебил бы осознанно мелкие сноски и дисклеймеры;
     • смена display у .elementor-button рвёт круглые стрелки слайдера и flex-колонки;
     • таблицы прайсов от увеличения кегля дают горизонтальный вылет.
   Поэтому бьём ТОЧНО в контейнер контента .entry-content (цепочка предков проверена:
   p.wp-block-paragraph → div.entry-content → div.article-inner → article), а не по тегам. */
@media (max-width: 800px) {

  /* 1. Основной текст страниц и статей: 13.5 → 16 px. */
  body .entry-content { font-size: 16px; line-height: 1.62; }
  body .entry-content p,
  body .entry-content li,
  body .entry-content .elementor-widget-container p,
  body .entry-content .elementor-widget-container li { font-size: 16px; line-height: 1.62; }

  /* 2. Сноски и юридическая мелочь остаются мелкими — они такие осознанно.
        Правило стоит ПОСЛЕ общего и перебивает его порядком, без !important. */
  body .entry-content small,
  body .entry-content sup,
  body .entry-content sub { font-size: 13px; line-height: 1.45; }

  /* 3. Таблицы прайсов: 15 px, а прокрутка — внутри своей рамки, а не всей страницей. */
  body .entry-content table,
  body .entry-content td,
  body .entry-content th { font-size: 15px; line-height: 1.45; }
  body .entry-content figure.wp-block-table,
  body .entry-content .wp-block-table { overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* 4. Длинные названия препаратов и адреса после укрупнения кегля
        не должны разрывать страницу вбок. */
  /* 🔴 Kimi советовал anywhere, GPT возразил: anywhere рвёт слова агрессивно и портит
     чтение. Взял break-word — он рвёт только то, что физически не влезает.
     Замер показал 0 страниц с горизонтальным вылетом, значит жёсткая защита не нужна. */
  body .entry-content p,
  body .entry-content li,
  body .entry-content td,
  body .entry-content th { overflow-wrap: break-word; }

  /* 5. Палец: настоящим кнопкам — 48 px высоты.
        🔴 display НЕ трогаем (Kimi: у потомка flex-колонки Elementor смена display
        меняет раскладку, а круглым стрелкам слайдера рвёт форму) — только min-height.
        🔴 Ссылки внутри абзацев НЕ трогаем: min-height они игнорируют,
        а padding на inline-элементе разъезжается по межстрочью. */
  body .entry-content a.elementor-button,
  body .entry-content .elementor-button-link,
  body .entry-content a.pf-card-l,
  body a.pf-knopka {
    min-height: 48px; padding-top: 12px; padding-bottom: 12px;
  }
}

/* ================== 13. ЗАГОЛОВОК ПОВЕРХ ФОТОГРАФИИ (30.08.2026) ==================
   Замер на 84 страницах: на девяти H1 цветом rgb(66,20,39) лежит на фоновом снимке.
   Контраст к тёмным участкам кадра — 1.02:1 при норме WCAG 3.0:1 для крупного текста;
   на кадре 390 px заголовок «Fotona 4D» физически сливается с волосами модели.
   🔴 Kimi: одной тени мало, WCAG её не засчитывает — нужен затемняющий слой.
   Слой кладём НЕ через ::before (z-index спорил бы с колонками Elementor),
   а вторым фоном поверх той же картинки — это делает JS, функция zagolovkiNaFoto.
   Страницы: frakcionnoe-omolozhenie, inekczionnaya-kosmetologiya, lazernaya-kosmetologiya-fotona,
   lazernoe-omolozhenie-4d, lechenie-shramov-rastyazhek-rubcov, polirovka-kozhi,
   skulpturirovanie-konturov-tela-tight-sculpting, udalenie-novoobrazovanij…, udalenie-sosudov… */
h1.pf-h1-na-foto {
  color: #ffffff !important;
  text-shadow: 0 2px 14px rgba(30,10,18,.55), 0 1px 3px rgba(30,10,18,.45);
}

/* ================== 14. ЗВОНОК В ШАПКЕ НА ТЕЛЕФОНЕ (30.08.2026) ==================
   Кнопку вставляет JS (zvonokVShapke) между логотипом и гамбургером — там 204 px
   свободных, замерено на 390 px. Показываем только на телефоне: на компьютере
   номер и так стоит в шапке (#topbutton-3), а на планшете шапка своя.
   Цвет — бордовый сайта, высота 44 px: минимум, при котором палец попадает. */
#pf-tel-shapka { display: none; }
@media (max-width: 800px) {
  #pf-tel-shapka {
    display: inline-flex !important;
    align-items: center; gap: 7px;
    flex: 0 0 auto; margin: 0 8px 0 auto;
    height: 44px; padding: 0 16px;
    border-radius: 22px;
    background: #6b2b3f; color: #fff !important;
    font-size: 15px; font-weight: 600; line-height: 1; letter-spacing: .01em;
    text-decoration: none !important; white-space: nowrap;
    box-shadow: 0 3px 10px rgba(107,43,63,.28);
  }
  #pf-tel-shapka:hover, #pf-tel-shapka:focus { background: #571f30; color: #fff !important; }
  #pf-tel-shapka svg { flex: 0 0 auto; }
  /* Узкие телефоны (iPhone SE, 360 px и уже): оставляем одну трубку без слова —
     иначе кнопка отжимает гамбургер за край. */
  @media (max-width: 374px) {
    #pf-tel-shapka { padding: 0 13px; }
    #pf-tel-shapka span { display: none; }
  }
}

/* ================== 15. ЧИТАЕМОСТЬ ВНЕ КОНТЕНТА: МЕНЮ, ПОДВАЛ, КАРТОЧКИ (30.08.2026) ==
   Первая порция правил (раздел 12) подняла текст внутри .entry-content и убрала
   1436 мелких блоков из 4492. Осталось 3056 — они лежат ВНЕ контента.
   Замер цепочек предков показал, где именно:
     • ul#prime_nav и вложенные ul.sub-menu — пункты мобильного меню, 10.8 px.
       Это самый мелкий текст на сайте и его читают в первую очередь;
     • div#colophon-inside — подвал: лицензия, режим работы, адрес, 13.5 px;
     • наши собственные карточки цен (#pf-ceny .pf-card) и мастеров (a.pf-m), 13 px.
   🔴 Что НЕ трогаем сознательно:
     • «Skip to content» (154 шт) — служебная ссылка для скринридеров, её не видно;
     • «Сертификат для новых гостей…» 11.5 px — это барабан Виктории, чужая механика;
     • подзаголовок логотипа 12.2 px — часть фирменного знака, не текст. */
@media (max-width: 800px) {

  /* Меню: 10.8 → 15 px. Строки разводим по вертикали, чтобы палец не попадал в соседний пункт. */
  body ul#prime_nav li.menu-item > a,
  body ul#prime_nav ul.sub-menu li.menu-item > a {
    font-size: 15px; line-height: 1.45;
    padding-top: 11px; padding-bottom: 11px; min-height: 44px;
  }

  /* Подвал: лицензия, режим работы, адрес, ссылки на площадки. */
  body #colophon-inside .textwidget,
  body #colophon-inside .textwidget p,
  body #colophon-inside .textwidget div,
  body #colophon-inside .textwidget li { font-size: 15px; line-height: 1.55; }

  /* Наши карточки цен и мастеров — их собирает наш же код, размеры знаем точно. */
  body #pf-ceny .pf-card-d,
  body #pf-ceny .pf-card-l,
  body .pf-mgrid a.pf-m,
  body .pf-mgrid .pf-m-r,
  body .parfe-soc__note { font-size: 15px; line-height: 1.5; }
}


/* ================== 16. «ПОЗВОНИТЬ» В ШАПКЕ ПК И ПЛАНШЕТА (30.08.2026) ==================
   Пилюля уже была (раздел 12, min-width 801px): контур #421427, радиус 26 px, padding 12/22.
   Здесь только выравниваем трубку со словом. Цвет и рамку не трогаем — иерархия
   «Онлайн-запись» (заполненная) → «Позвонить» (контурная) остаётся. */
@media (min-width: 801px) {
  html body p.topbutton-3 a.header-phone[data-pf-pozvonit] {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
  }
  html body p.topbutton-3 a.header-phone[data-pf-pozvonit] svg { flex: 0 0 auto; }
}


/* ================== 17. ДОКАЗАТЕЛЬСТВА ПОД ЗАГОЛОВКОМ (30.08.2026) ==================
   Ставится сразу под H1 на страницах услуг и статьях, где нет первого экрана.
   Кнопка — заполненная бордовая, доказательства — спокойные, чтобы не спорить с ней. */
#pf-dok {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
  margin: 14px 0 22px; padding: 14px 16px;
  border: 1px solid #EADFE3; border-radius: 14px; background: #FDF9FA;
  font-size: 15px; line-height: 1.4;
}
#pf-dok .pf-dok-r { display: inline-flex; align-items: center; gap: 7px; text-decoration: none; color: #421427; }
#pf-dok .pf-dok-r b { font-size: 20px; font-weight: 700; }
#pf-dok .pf-dok-zv { color: #D8A15E; letter-spacing: 1px; font-size: 13px; }
#pf-dok .pf-dok-t { color: #6E5F60; font-size: 14px; text-decoration: underline; text-underline-offset: 2px; }
#pf-dok .pf-dok-p { color: #6E5F60; font-size: 14px; }
#pf-dok .pf-dok-p::before { content: "· "; color: #C9B6BC; }
/* 30.08.2026 — по умолчанию показываем ПОЛНЫЙ текст, короткий прячем.
   Без этой строки на широком экране выводились обе версии подряд
   и получалось «медицинская лицензиямедлицензия». Правило для узких
   экранов ниже, в медиазапросе, переворачивает их обратно. */
#pf-dok .pf-hd-dl { display: inline; }
#pf-dok .pf-hd-kr { display: none; }
#pf-dok .pf-dok-k {
  margin-left: auto; flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  height: 46px; padding: 0 26px; border-radius: 24px;
  background: #6b2b3f; color: #fff !important; text-decoration: none !important;
  font-size: 15px; font-weight: 600; white-space: nowrap;
  box-shadow: 0 3px 10px rgba(107,43,63,.26);
}
#pf-dok .pf-dok-k:hover, #pf-dok .pf-dok-k:focus { background: #571f30; }
@media (max-width: 640px) {
  #pf-dok { gap: 6px 10px; padding: 11px 13px; font-size: 14px; }
  #pf-dok .pf-dok-k { margin-left: 0; width: 100%; height: 44px; }
  #pf-dok .pf-dok-r b { font-size: 18px; }
  #pf-dok .pf-hd-dl { display: none; }
  #pf-dok .pf-hd-kr { display: inline; }
}


/* ================== 18-19. СПЕЦЦЕНА НА УСЛУГАХ И ОГЛАВЛЕНИЕ ЦЕН (30.08.2026) ========== */
#pf-spec {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px;
  margin: 30px 0 10px; padding: 18px 20px; border-radius: 16px;
  background: linear-gradient(135deg,#8E2B3F 0%,#5d1a2a 100%);
  color: #fff !important; text-decoration: none !important;
}
#pf-spec .pf-spec-n { flex: 0 0 100%; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; opacity: .85; }
#pf-spec .pf-spec-u { font-size: 17px; font-weight: 600; }
#pf-spec .pf-spec-c b { font-size: 24px; font-weight: 700; }
#pf-spec .pf-spec-c s { margin-left: 10px; font-size: 15px; opacity: .7; }
#pf-spec .pf-spec-s { margin-left: auto; font-size: 15px; text-decoration: underline; text-underline-offset: 3px; }
#pf-spec:hover { filter: brightness(1.06); }
@media (max-width: 640px) {
  #pf-spec { gap: 6px 12px; padding: 16px; }
  #pf-spec .pf-spec-s { margin-left: 0; flex: 0 0 100%; }
}

#pf-ogl {
  margin: 6px 0 24px; padding: 14px 18px;
  border: 1px solid #EADFE3; border-radius: 14px; background: #fff;
}
#pf-ogl .pf-ogl-z { display: block; margin-bottom: 8px; font-size: 13px; letter-spacing: .06em;
  text-transform: uppercase; color: #9C8A8E; }
#pf-ogl ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px 10px; }
#pf-ogl li { margin: 0; }
#pf-ogl a {
  display: inline-block; padding: 7px 14px; border-radius: 20px;
  border: 1px solid #E3D3D8; background: #FDF9FA;
  color: #421427 !important; text-decoration: none !important; font-size: 14px; line-height: 1.3;
}
#pf-ogl a:hover { border-color: #D8A15E; background: #fff; }


/* ================== 20. ДОКАЗАТЕЛЬСТВА НА ПЕРВОМ ЭКРАНЕ ГЛАВНОЙ (30.08.2026) =========
   Одна строка поверх фото: белым, мелко, без рамок и плашек — чтобы не утяжелять
   экран и не спорить с кнопками. Высота строки 22 px, отступы 14/16. */
#pf-hero-dok {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 6px 14px; margin: 14px 0 16px;
  font-size: 14px; line-height: 1.35; color: rgba(255,255,255,.92);
  text-shadow: 0 1px 6px rgba(30,10,18,.5);
}
#pf-hero-dok a { display: inline-flex; align-items: center; gap: 6px; color: #fff !important;
  text-decoration: none !important; }
#pf-hero-dok a:hover span { text-decoration: underline; text-underline-offset: 2px; }
#pf-hero-dok b { font-size: 17px; font-weight: 700; letter-spacing: .01em; }
#pf-hero-dok i { font-style: normal; color: #E9C079; font-size: 14px; }
#pf-hero-dok .pf-hd-p { position: relative; padding-left: 15px; opacity: .9; }
#pf-hero-dok .pf-hd-p::before { content: ""; position: absolute; left: 0; top: 50%;
  width: 4px; height: 4px; margin-top: -2px; border-radius: 50%; background: rgba(255,255,255,.55); }
#pf-hero-dok .pf-hd-kr { display: none; }
@media (max-width: 640px) {
  #pf-hero-dok { gap: 3px 10px; margin: 12px 0 14px; font-size: 13px; }
  #pf-hero-dok b { font-size: 15px; }
  #pf-hero-dok .pf-hd-p { padding-left: 12px; }
  /* короткие подписи: строка укладывается в ОДИН ряд.
     Замер 390 px: полный текст давал 65 px (три ряда), сокращённый — 41 px (два).
     Поэтому на телефоне оставляем два главных факта: оценка с отзывами и лицензия.
     «Хорошее место» уходит — оно приятное, но лицензии нет ни у одного из восьми
     конкурентов, а знак Яндекса есть у многих. */
  #pf-hero-dok .pf-hd-dl { display: none; }
  #pf-hero-dok .pf-hd-kr { display: inline; }
  #pf-hero-dok .pf-hd-p:first-of-type { display: none; }
}


/* ================== 21. ПАЛЕЦ ДОЛЖЕН ПОПАДАТЬ (30.08.2026, техаудит) =================
   Яндекс Вебмастер 28.08.2026 держит на сайте метку NOT_MOBILE_FRIENDLY.
   Замер на 390 px показал причину: ссылки ниже 44 px — от 39% на главной
   до 78% на «Наших мастерах». Горизонтальной прокрутки нет, viewport на месте,
   скорость 0,04–0,52 с — остаются только размеры целей нажатия.

   Кто именно мелкий (замер на /kontakty/): ссылки подвала 38–39 px, соцсети 38,
   кнопка поиска 41, логотип 30. Это не кнопки записи — те давно 44+, — но Яндекс
   считает все ссылки подряд.

   Поднимаем до 44 px только НАВИГАЦИОННЫЕ ссылки: подвал, меню, соцсети, поиск.
   Ссылки внутри текста абзацев не трогаем — от вертикальных отступов поехала бы
   вёрстка статей. */
@media (max-width: 800px) {
  #colophon a,
  .pf-legal-footer a,
  #footer-widgets a,
  #site-footer a,
  nav#mobile-menu a,
  #prime_nav a,
  #sheader.socials a,
  .socials a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
  /* поиск в подвале — кнопка должна попадать под палец */
  .searchform .searchsubmit,
  .searchform input[type="submit"] { min-height: 44px !important; }
  /* логотип в шапке: 30 px было мало для нажатия */
  .custom-logo-link { display: inline-flex !important; align-items: center; min-height: 44px; }
  /* строка доказательств — это ссылка внутри текста, ей высота кнопки не нужна,
     но дадим запас по вертикали, чтобы палец не промахивался мимо рейтинга */
  #pf-hero-dok a, #pf-dok .pf-dok-r { padding: 4px 0; }
}

/* Посадочные (/fotona/, /epilyaciya/, /lpg/, /inekcii/) собраны своим HTML, селекторы
   подвала темы к ним не подходят. Здесь поднимаем только ДЕЙСТВИЯ: телефон 24 px,
   ссылку на отзывы 20 px. Текстовые ссылки внутри абзацев («медицинской лицензии»,
   «Политика», «Агентство 178») намеренно оставляем как есть: дать им 44 px — значит
   разорвать строку абзаца. Яндекс считает их наравне с кнопками, но читаемость важнее. */
@media (max-width: 800px) {
  a.tel, .contacts a[href^="tel:"], .hero a[href^="tel:"] {
    min-height: 44px; display: inline-flex; align-items: center;
  }
  .trust a, a[href*="maps/org/parfe"] { min-height: 44px; display: inline-flex; align-items: center; }
}


/* ================== 22. ПЕРВЫЙ ЭКРАН СТРАНИЦ УСЛУГ (30.08.2026) ==================
   Замер 30.08: на странице «Имиджевый зал» слайдер Smart Slider занимал 756 px
   при ширине окна 1008 и 907 px при ширине 1440 — заголовок уходил на 1168 px,
   то есть человек видел только фотографию, без единого слова о деле.
   Метрика за месяц: вход из поиска 3 визита, выходов 20 — уходили именно отсюда.

   Режем вводный слайдер до полосы. Заголовок, строка доказательств и кнопка
   «Записаться» поднимаются в первый экран: при окне 1440x820 H1 встаёт на 580 px,
   доказательства на 662 px — оба видны без прокрутки (проверено в браузере).

   🔴 30.08, вечер: сузили до body.parent-pageid-26 — это подстраницы раздела
   «Услуги и цены». Прежний селектор body:not(.home) задевал и страницу «О нас»,
   а там в слайдере ГАЛЕРЕЯ из 22 снимков интерьера 1600x1067 — их сплющило
   в полосу 320 px, от кресел и залов осталась верхняя треть. На страницах услуг
   в слайдере ровно один кадр, поэтому обрезка там уместна, а в галерее — нет.
   Телефон не трогаем тоже: на 390 px слайдер сам сжимается до 246 px, и заголовок
   уже виден — правило начинается с 801 px. */
@media (min-width: 801px) {
  /* 🔴 Обрезать ОДИН внешний контейнер оказалось мало: внутренние слои слайдера
     остаются 907 px, и в полосу попадает только верхняя треть кадра — на замере
     это были часы и потолок вместо рабочей зоны. Поэтому высоту задаём ВСЕЙ цепочке,
     а саму фотографию вписываем через object-fit: тогда виден центр кадра. */
  /* 🔴 Слоёв больше, чем кажется. Фон слайда лежит на глубине пяти вложений:
     .n2-ss-slider-N > .n2-ss-slide-backgrounds > .n2-ss-slide-background >
     .n2-ss-slide-background-image > picture > img. Пока высоту не получил КАЖДЫЙ,
     картинка оставалась 907 px и в полосу попадал потолок с люстрой.
     Плагин ставит свои размеры скриптом, поэтому здесь !important. */
  body.parent-pageid-26 .entry-content .n2-section-smartslider,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-align,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-padding,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-slider,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-slider > div,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-slide-backgrounds,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-slide-background,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-slide-background-image,
  body.parent-pageid-26 .entry-content .n2-section-smartslider picture {
    height: 320px !important;
    max-height: 320px !important;
    overflow: hidden !important;
  }
  body.parent-pageid-26 .entry-content .n2-section-smartslider { border-radius: 14px; }
  body.parent-pageid-26 .entry-content .n2-section-smartslider img {
    /* 🔴 height:100% не работает: прямой родитель картинки внутри слайдера
       остаётся 907 px, и в полосу попадал потолок с люстрой. Ставим высоту
       в пикселях — тогда object-fit показывает центр кадра, а не верх. */
    height: 320px !important;
    width: 100% !important;
    object-fit: cover !important;
    /* 58%, а не центр: в наших кадрах интерьера низ информативнее — там кресла,
       стеллажи и рабочие места, а верх это потолок и лепнина */
    object-position: center 58%;
  }
  /* пустые абзацы, которые редактор оставил между слайдером и заголовком:
     на замере они давали лишние 90 px пустоты ровно там, где ценнее всего место */
  body.parent-pageid-26 .entry-content .n2-section-smartslider + p:empty,
  body.parent-pageid-26 .entry-content .n2-section-smartslider + p > br:only-child { display: none; }
  body.parent-pageid-26 .entry-content .n2-section-smartslider { margin-bottom: 18px; }
  body:not(.home) .entry-content h1 { margin-top: 10px; }
}
@media (min-width: 801px) and (max-width: 1200px) {
  body.parent-pageid-26 .entry-content .n2-section-smartslider,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-align,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-padding,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-slider,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-slider > div,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-slide-backgrounds,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-slide-background,
  body.parent-pageid-26 .entry-content .n2-section-smartslider .n2-ss-slide-background-image,
  body.parent-pageid-26 .entry-content .n2-section-smartslider picture {
    height: 260px !important; max-height: 260px !important;
  }
  body.parent-pageid-26 .entry-content .n2-section-smartslider img { height: 260px !important; }
}


/* ================== 25. ТАБЛИЦЫ ПРАЙСА НА ПОСАДОЧНЫХ (30.08.2026) ==================
   Замер: у класса .pf-dva-praysa не было НИ ОДНОГО правила — ни в общем файле,
   ни внутри самих страниц. Ячейки шли вплотную, и на снимке страницы /lpg/
   «3 100 ₽ 13 500 ₽» читалось как одно число, а шапка «Разово Абонемент 5 процедур»
   слипалась в строку. Человек не понимал, где разовая цена, а где абонемент.
   Даём отступы, разделители строк и выравнивание цен вправо. */
.pf-dva-praysa { overflow-x: auto; margin: 14px 0 10px; }
.pf-dva-praysa table {
  width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.5;
}
.pf-dva-praysa thead th {
  text-align: left; padding: 10px 14px 10px 0;
  border-bottom: 2px solid #EADFE3; font-weight: 600; white-space: nowrap;
}
.pf-dva-praysa thead th + th, .pf-dva-praysa tbody td + td { text-align: right; padding-left: 22px; }
.pf-dva-praysa tbody td {
  padding: 9px 14px 9px 0; border-bottom: 1px solid #F1E7E9; vertical-align: top;
}
.pf-dva-praysa tbody tr:last-child td { border-bottom: none; }
.pf-dva-praysa tbody td + td { white-space: nowrap; font-variant-numeric: tabular-nums; }
.pf-praysy-note { margin-top: 10px; font-size: 14px; line-height: 1.6; color: #6E5F60; }
@media (max-width: 640px) {
  .pf-dva-praysa table { font-size: 14px; }
  .pf-dva-praysa thead th, .pf-dva-praysa tbody td { padding-right: 8px; }
  .pf-dva-praysa thead th + th, .pf-dva-praysa tbody td + td { padding-left: 12px; }
}


/* ================== 26. СТРОКА ДОКАЗАТЕЛЬСТВ — ПО ЦЕНТРУ (30.08.2026) ==================
   Роман увидел на главной: рейтинг с отзывами прижат к левому краю, кнопка «Записаться»
   улетела в правый, между ними дыра. Замер на 1440 px: блок шириной 1120, текст кончается
   на 798, кнопка начинается на 1124 — 326 px пустоты посередине.
   Причина: у блока justify-content по умолчанию (слева), а у кнопки margin-left:auto,
   который отжимает её в край. Рядом заголовок и «Онлайн-запись» стоят по центру,
   поэтому строка выбивалась из общего ряда.
   Собираем содержимое в центр и ставим кнопку сразу за текстом. */
@media (min-width: 641px) {
  #pf-dok { justify-content: center; }
  #pf-dok .pf-dok-k { margin-left: 10px; }
}

/* ==========================================================================
   31.08.2026 — мобильная пригодность. Вебмастер с 28.08 держит на сайте метку
   «страницы не оптимизированы для мобильных», а мобильных у нас 55 % визитов
   (496 из 901 за август) и именно они дают записи: 12,1 % против 5,2 % у ПК.
   Замер на 390 px нашёл мелкий текст (10,5 и 12,5 px) и кнопки высотой 39 px
   при рекомендованных 44. Правим только телефон, десктоп не трогаем.
   🔴 Барабан Виктории (.pf-baraban*, плашка «Сертификат…») не трогаем — правило.
   ========================================================================== */
@media (max-width: 800px) {
  /* адрес в подвале был 10,5 px — inline-стиль 0.7em, поэтому !important */
  .textwidget [itemprop="streetAddress"] { font-size: 14px !important; }
  /* подпись срока акции на главной */
  .pf-akcia-mini i { font-size: 13.5px; }
  /* сноски под ценами и ссылки правового подвала */
  /* специфичность выше, чем у inline-стиля сниппета 4939, иначе остаётся 13 px */
  .pf-sell .pf-note { font-size: 14px; }
  #pf-legal-footer a { font-size: 14px; }
  /* пальцем в кнопку: 39 px → 44 px */
  .pf-kalk-pol button,
  .pf-why-i a,
  .pf-kalk-sbros { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
}

/* ==========================================================================
   31.08.2026 — плашка звонка на телефоне закрывала текст.
   Замер на 390 px глазами (страница «О нас», вид обычного гостя): плашка
   «Перезвоните мне» 230×60 px справа и подарок барабана слева вместе съедали
   нижнюю треть экрана — первые строки абзаца читались из-под них.
   Барабан не трогаем (правило), поэтому ужимаем СВОЮ плашку до круглой кнопки
   56×56: подпись прячем через font-size:0, иконка задана атрибутами svg и
   остаётся видимой. Площадь перекрытия падает с 13 800 до 3 136 px², в 4,4 раза.
   Канал заявок сохраняется: кнопка на месте, aria-label «Перезвоните мне» тоже.
   ========================================================================== */
@media (max-width: 480px) {
  #pf-callback-btn {
    font-size: 0 !important;
    gap: 0 !important;
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    justify-content: center !important;
  }
}


/* ================== 27. ТЕЛЕФОН: ЗАГОЛОВОК И ТАБЛИЦЫ ПРАЙСА (09.09.2026) ==================
   Замер на 360 / 390 / 414 px, страница /uslugi-i-czeny/nogtevoj-servis/:
   • H1 темы fluida стоит 3.029em = 48,46 px на любой ширине. На 360 слово
     «Красносельском» физически не влезает и рвётся посреди («Красносельск / ом районе»),
     заголовок съедает 252 px — треть первого экрана.
   • Таблицы TablePress идут БЕЗ обёртки: <table class="tablepress"> лежит прямо
     в .entry-content. Правило раздела 12 ловит только .wp-block-table (Гутенберг),
     до них не доходит. Замер: 219 вылетает за экран на +52 px при 360, 214 на +14;
     горизонтальной прокрутки у страницы нет, значит колонка «I кат.» просто обрезана —
     цена мастера первой категории не видна вообще.
   🔴 display:block превращает саму таблицу в область прокрутки, обёртка не нужна:
   так правка остаётся чисто стилевой и не трогает разметку страниц. */
/* Заголовок. У сайта УЖЕ есть принятая телефонная типографика H1 —
   clamp(28px, 4.4vw, 44px) / line-height 1.18, она живёт в дополнительных стилях темы
   («4. Заголовок статьи блога») и держит 24 страницы, свёрстанные блоками Гутенберга.
   Остальные страницы под её селектор article:has(.wp-block-paragraph) не подпадают
   и остаются на теменном 3.029em. Поэтому не выдумываем третий кегль, а подтягиваем
   их к тому же значению — типографика по сайту становится одна.
   🔴 Селектор берём по контейнеру #content, а не по .entry-content: на /o-nas/3d-tur/
   заголовок лежит в своей вёрстке div.tour_wrapper, и до него .entry-content не достаёт
   (там базовый кегль темы 13,5 px и H1 выходил 40,89 px вместо 48,46).
   🔴 Заголовки-герои не задеваются: у #pf-geroy своё правило с !important и с ID —
   оно выигрывает и по важности, и по специфичности. Замер это подтвердил.
   Порог 800 px — тот же, что у разделов 12 и 14: это «телефон» в понимании сайта. */
@media (max-width: 800px) {
  body #content h1 { font-size: clamp(28px, 4.4vw, 44px); line-height: 1.18; }

  /* 🔴 ДОБАВЛЕНО 09.09 после замера ВСЕЙ шкалы, а не одного H1.
     Тема даёт h2 2.678em = 42,85 px и h3 2.327em = 37,23 px, и на телефоне они
     не уменьшаются. Пока H1 стоял 48,46 — иерархия ещё держалась; после того как
     H1 стал 28, подзаголовок оказался КРУПНЕЕ заголовка. Замер по 67 страницам:
     H2 больше H1 было на 33 страницах (болезнь старая), стало на 52 — 19 страниц
     сломала именно правка H1. Поэтому задаём всю шкалу целиком, а не один уровень:
     H1 28 → H2 22 → H3 19. После правки страниц с перевёрнутой иерархией: 0 из 67. */
  body #content h2 { font-size: 22px; line-height: 1.25; }
  body #content h3 { font-size: 19px; line-height: 1.3; }
}
@media (max-width: 800px) {
  body .entry-content table.tablepress {
    display: block; width: 100%;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
  /* Подсказка о прокрутке — её ставит JS (tablicyProkrutka) только тем таблицам,
     которые реально шире экрана. Без неё человек не догадается листнуть вбок. */
  .pf-tabl-podskazka {
    display: block; margin: 0 0 6px;
    font-size: 13px; line-height: 1.4; color: #8a6a76;
    letter-spacing: .01em;
  }
}
@media (min-width: 801px) { .pf-tabl-podskazka { display: none; } }


/* ================== 28. ЗАГОЛОВОК ТАМ, ГДЕ ЕГО НЕ ВИДНО (09.09.2026) ==================
   Тема стоит в режиме «скрывать заголовок страницы» (класс body fluida-hide-page-title),
   поэтому шаблонный h1.entry-title на ВСЁМ сайте идёт с display:none. На большинстве
   страниц это незаметно: там есть свой H1 внутри контента. Но на 11 страницах своего нет —
   вся папка /nashi-mastera/ (9 страниц), /lazernaya-epilyaciya/ и /uhod-za-licom-posle-leta/.
   Итог: человек не видит заголовка вообще (первым идёт блок рейтинга), а в коде H1 есть,
   но скрыт — поисковики скрытый текст обесценивают.
   🔴 Показываем ТОЛЬКО там, где своего заголовка в контенте нет — через :has().
   Иначе на остальных 56 страницах стало бы по два видимых H1.
   Замер по всем 67 страницам: заголовок появился на 11, двойных H1 — 0, без H1 — 0.
   Текст не выдумываем: берём тот, что уже стоит в теге. */
#content:not(:has(.entry-content h1)) header h1.entry-title {
  display: block !important;
  font-size: clamp(28px, 4.4vw, 44px);
  line-height: 1.18;
  color: #333;
  margin: 0 0 22px;
}