/* ============================================================================
 * bmod.css — весь кастомный CSS BMOD (не из WP-экспорта).
 * Подключается ПОСЛЕДНИМ на всех страницах (после common.css и <page>.css),
 * поэтому его правила выигрывают каскад без гонки !important.
 * Организация — по слоям ITCSS: settings → base → a11y → components → pages.
 * Единственный источник кастомных стилей; раньше блоки жили в common.css и
 * страничных файлах. Литеральные правки WP-легаси (цвета/URL) остались на месте.
 * ============================================================================ */

/* ======================================================================
 * 01 · SETTINGS — самохостинг шрифтов (Inter, Montserrat)
 * ====================================================================== */

/* ===== BMOD self-hosted Inter (variable 400-700, subset) — perf: убран render-blocking Google Fonts. Откат — удалить блок. 2026-07-06 ===== */
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/inter-var-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/inter-var-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/inter-var-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/inter-var-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
/* ===== /BMOD Inter ===== */

/* ===== BMOD self-hosted Montserrat 700 (subset) — заголовки h1/h2; убран Google WebFontLoader. Откат — удалить блок. 2026-07-06 ===== */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/montserrat-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/montserrat-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/montserrat-700-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/montserrat-700-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
/* ===== /BMOD Montserrat ===== */

/* ======================================================================
 * 02 · BASE — типографика, читаемость, контраст
 * ====================================================================== */

/* ===== BMOD-PREMIUM 2026-07-06: читаемость + контраст (премиум-инспекция). Откат — удалить блок. ===== */
/* 1. Кнопки-мессенджеры: белый текст до AA + цвета чуть глубже (премиальнее). Токены переопределены site-wide через !important (важное custom-property бьёт страничный :root). */
:root{--telegram:#16769F!important;--whatsapp:#0E7A3D!important;--viber:#6A4EE0!important}
/* 2. Звёзды рейтинга: глубже золото (было бледно-жёлтое #D99500/#D99500 = 1.7:1, выцветшее). */
.g-stars,.hp-stars,.stars{color:#D99500!important}
/* 3. Ширина текста — комфортная колонка (было 90–126 симв/строку; норма 65–75). Левое выравнивание SEO-текста сохранено (margin не трогаем). */
.content-block>p{max-width:68ch!important}
.faq-a,.faq-a p,.bmw-faq-content>p,.honest-note,.stage-req>p{max-width:74ch!important}
.cta-hint,.signature-quote{max-width:60ch!important;margin-left:auto!important;margin-right:auto!important}
/* ===== /BMOD-PREMIUM ===== */

/* ===== BMOD-PREMIUM caps 2026-07-06: снять тотальный UPPERCASE с заголовков (было h1,h2{uppercase} в common) — sentence case читается премиальнее. Откат — удалить строку. ===== */
h1,h2,.entry-content :where(h1),.entry-content :where(h2){text-transform:none!important}
/* ===== /BMOD-PREMIUM caps ===== */

/* ======================================================================
 * 03 · A11Y — фокус-кольца, тактильный отклик, reduced-motion
 * ====================================================================== */

/* ===== BMOD-A11Y & interaction polish — redesign-skill audit 2026-07-06 ===== */
/* Аддитивно: вид при наведении мышью НЕ меняется. Откат — удалить весь блок. */
/* 1. Видимое on-brand фокус-кольцо для клавиатуры (Astra по умолчанию рисует
      тонкий dotted цвета inherit — на синих кнопках почти не виден). */
.hero-cta:focus-visible,.cta-btn:focus-visible,.btn-primary:focus-visible,
.btn-secondary:focus-visible,.hero-prices-link:focus-visible,.faq-q:focus-visible,
.menu-link:focus-visible,.cta-btn--tg:focus-visible,.cta-btn--wa:focus-visible,
.cta-btn--vb:focus-visible{
  outline:3px solid var(--primary-blue,#0B4FD1);outline-offset:3px;border-radius:6px;
}
/* На залитых цветом CTA — белое кольцо в синем ореоле для контраста поверх заливки. */
.hero-cta:focus-visible,.cta-btn:focus-visible,.btn-primary:focus-visible{
  outline-color:#fff;box-shadow:0 0 0 6px rgba(11, 79, 209,.55);
}
/* 2. Тактильный отклик на нажатие (pressed) — раньше у кнопок был только :hover. */
.hero-cta:active,.cta-btn:active,.btn-primary:active,.btn-secondary:active,
.cta-btn--tg:active,.cta-btn--wa:active,.cta-btn--vb:active{transform:translateY(1px) scale(.98)}
/* 3. Уважать prefers-reduced-motion для transform-состояний. */
@media (prefers-reduced-motion:reduce){
  .hero-cta:active,.cta-btn:active,.btn-primary:active,.btn-secondary:active,
  .cta-btn--tg:active,.cta-btn--wa:active,.cta-btn--vb:active{transform:none}
}
/* ===== /BMOD-A11Y ===== */

/* ======================================================================
 * 04 · COMPONENTS — переиспользуемые блоки (price-trust, тап-таргеты)
 * ====================================================================== */

/* ===== BMOD-FLOW 2026-07-06: strip доверия у прайса (fseries/gseries) — реассуранс в точке решения ===== */
.price-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px;margin:0 0 22px;padding:15px 20px;background:var(--primary-blue-light);border-radius:14px}
.price-trust__item{font-size:14px;color:var(--text-body)}
.price-trust__item strong{color:var(--text-dark);font-weight:700}
.price-trust__g{color:#D99500!important}
@media (max-width:600px){.price-trust{gap:8px 16px}.price-trust__item{font-size:13px}}
/* ===== /BMOD-FLOW ===== */

/* ===== BMOD-FLOW: увеличение тап-таргетов вторичных ссылок (мобайл ≥44px удобнее) ===== */
.footer-col a{padding:6px 0;margin-bottom:2px}
.hero-alt{font-size:15px;line-height:1.85}
/* ⚠️ FIX 2026-07-18: inline-block+padding сажали border-bottom-подчёркивание
   на низ бокса → линия «отъезжала» на 7px под текст («съехавший текст» в hero
   на всех страницах). Убираем оторванный border, подчёркивание — text-decoration
   (липнет к тексту), тап-таргет-padding сохраняем. */
.hero-alt a{padding:7px 2px;display:inline-block;border-bottom:0!important;text-decoration:underline!important;text-decoration-color:rgba(74,85,104,.4);text-underline-offset:3px}
.hero-prices-link{padding:8px 4px;display:inline-block;border-bottom:0!important;text-decoration:underline!important;text-decoration-color:rgba(74,85,104,.4);text-underline-offset:3px}
/* ⚠️ FIX 2026-07-18: строки под CTA (.hero-cta-note/.hero-alt/.hero-urgency) имели
   max-width, но margin-left:0 → прижимались влево, тогда как H1/.lead/.subheadline
   и кнопка отцентрированы. Из-за этого текст «смещён вбок относительно CTA» на всех
   страницах. Возвращаем горизонтальную авто-центровку (вертикальные отступы не трогаем). */
.hero-cta-note,.hero-alt,.hero-urgency{margin-left:auto!important;margin-right:auto!important}
/* ===== /BMOD-FLOW ===== */

/* ======================================================================
 * 06 · UI-FIXES 2026-07-11 — переполнение кнопок и редизайн липкого бара
 * ====================================================================== */

/* --- Кнопки: длинный текст ПЕРЕНОСИТСЯ, а не вылазит (было white-space:nowrap → обрезка) --- */
.hero-cta,.cta-btn,.series-btn,.btn,.social-btn{
  white-space:normal!important;
  height:auto!important;min-height:56px;
  line-height:1.25;
  text-align:center;
  align-items:center!important;
  overflow-wrap:anywhere;
}
.hero-cta{padding:12px 22px!important;gap:10px!important}
.hero-cta svg,.cta-btn svg{flex:0 0 auto}

/* --- Липкий мобильный бар быстрых контактов: чистая подложка + когезивные кнопки --- */
@media (max-width:921px){
  .m-cta{
    left:12px!important;right:12px!important;bottom:12px!important;transform:none!important;
    display:flex!important;align-items:stretch!important;gap:8px!important;
    padding:8px!important;width:auto!important;max-width:520px!important;margin:0 auto!important;
    background:rgba(255,255,255,.94)!important;
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
    border:1px solid rgba(15,23,42,.08)!important;
    border-radius:18px!important;
    box-shadow:0 10px 30px rgba(11,79,209,.16),0 2px 8px rgba(15,23,42,.08)!important;
  }
  .m-cta__call{
    flex:1 1 auto!important;display:flex!important;align-items:center!important;justify-content:center!important;
    gap:8px!important;height:54px!important;padding:0 16px!important;
    background:var(--primary-blue,#0B4FD1)!important;color:#fff!important;
    font-weight:700!important;font-size:16px!important;border-radius:999px!important;
    text-decoration:none!important;white-space:nowrap!important;
  }
  .m-cta__call svg{width:20px!important;height:20px!important;fill:#fff!important}
  /* мессенджеры — КРУГИ, цвета из палитры сайта, белый глиф по центру */
  .m-cta__ico{
    flex:0 0 auto!important;width:54px!important;height:54px!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
    border-radius:50%!important;text-decoration:none!important;
  }
  .m-cta__ico svg{width:27px!important;height:27px!important;fill:#fff!important;color:#fff!important}
  .m-cta__tg{background:var(--telegram,#16769F)!important}
  .m-cta__wa{background:var(--whatsapp,#0E7A3D)!important}
  .m-cta__vb{background:var(--viber,#6A4EE0)!important}
}

/* ======================================================================
 * 07 · MOTION POLISH 2026-07-11 — ревью по emil-design-eng (animations.dev)
 *     Правки централизованы здесь; страничные файлы не трогаем. Откат —
 *     удалить всю секцию 07.
 * ====================================================================== */

/* --- Кастомная ease-out кривая: сильнее встроенной ease, отклик «дороже».
       Та же длительность → воспринимается быстрее (immediate movement). --- */
:root{--ease-out:cubic-bezier(.23,1,.32,1)}

/* --- FAQ-аккордеон: max-height → grid-template-rows.
       Было: transition:all .3s + max-height:0→600px — не по GPU, easing «перелетал»
       (контент долетал раньше конца), заодно анимировался padding.
       Стало: grid-rows 0fr→1fr раскрывается по реальной высоте контента;
       анимируются только grid-template-rows + opacity. Переопределяет
       страничные fseries/gseries (bmod.css грузится последним). --- */
.faq-a{
  max-height:none;                       /* снять страничный max-height:0 */
  display:grid;grid-template-rows:0fr;
  overflow:hidden;opacity:0;
  transition:grid-template-rows .3s var(--ease-out),opacity .22s ease;
  padding:0 22px;margin-top:0;
}
.faq-a>*{min-height:0;overflow:hidden;margin:0}
.faq-item.active .faq-a{grid-template-rows:1fr;opacity:1;max-height:none}
.faq-item.active .faq-a>:last-child{padding-bottom:20px}
@media (prefers-reduced-motion:reduce){
  .faq-a{transition:opacity .2s ease}    /* без анимации высоты — только фейд */
}

/* --- CTA: та же длительность, но кастомная ease-out (было — дефолтная ease).
       Только transform+box-shadow, hover-цвет и прочее не задеты. --- */
.hero-cta,.cta-btn{transition:transform .16s var(--ease-out),box-shadow .18s ease}

/* --- Sticky-CTA (правый нижний угол): усилить кривую и убрать «залипший»
       hover на тач-экранах (hover срабатывает по тапу). --- */
#bmod-sticky-cta{transition:transform .18s var(--ease-out),box-shadow .18s ease,opacity .3s ease}
@media (hover:none){
  #bmod-sticky-cta:hover{transform:translateY(0);box-shadow:0 10px 30px rgba(11,79,209,.35)}
}
/* ===== /07 MOTION POLISH ===== */

/* ======================================================================
 * 08 · HARD-AUDIT FIXES 2026-07-11 — кнопки, тач, появления, view-transitions.
 *     Всё аддитивно, только bmod.css. Откат — удалить всю секцию 08.
 * ====================================================================== */

/* --- 8.1 Тач-гейт для hover-лифтов: на тач-экранах не «залипают» приподнятыми,
        но press-feedback (:active) сохраняется благодаря :not(:active).
        Заодно единый лифт -2px (было -3px у hero-cta / -2px у social). --- */
@media (hover:hover) and (pointer:fine){
  .hero-cta:hover:not(:active),
  .social-btn:hover:not(:active){transform:translateY(-2px)}
}
@media (hover:none){
  .hero-cta:hover:not(:active),.cta-btn:hover:not(:active),
  .btn-primary:hover:not(:active),.btn-secondary:hover:not(:active),
  .social-btn:hover:not(:active),.series-btn:hover:not(:active){transform:none}
}

/* --- 8.2 Press-feedback там, где его не было (series/social/opt/faq-q),
        + плавный transform (у series-btn был только background/color). --- */
.series-btn,.social-btn,.opt{
  transition:transform .16s var(--ease-out),background .2s ease,color .2s ease,box-shadow .18s ease;
}
.series-btn:active,.social-btn:active,.opt:active{transform:translateY(1px) scale(.98)}

.faq-q{transition:color .18s ease,transform .12s var(--ease-out)}
.faq-q:hover{color:var(--primary-blue)}     /* affordance: вопрос реагирует на мышь */
.faq-q:active{transform:scale(.99)}         /* тактильный отклик на нажатие */

@media (prefers-reduced-motion:reduce){
  .series-btn:active,.social-btn:active,.opt:active,.faq-q:active{transform:none}
}

/* --- 8.3 View Transitions ОТКЛЮЧЕНЫ 2026-07-18: кросс-фейд всей страницы при
        навигации вместе с лениво-загружаемым фоном hero давал «мигание/странную
        прогрузку шапки» при переходах. Навигация теперь мгновенная и стабильная.
        Откат — вернуть `@view-transition{navigation:auto}`. --- */
/* @view-transition{navigation:auto} */

/* --- 8.4 Scroll-reveal секций и карточек. Обёрнуто в @supports → на браузерах
        без scroll-timeline opacity:0 не применяется вовсе (0 риска FOUC).
        Hero исключён — первый экран должен появляться мгновенно. --- */
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .content-block:not(.hero){
      animation:bmod-reveal linear both;
      animation-timeline:view();
      animation-range:entry 0% entry 55%;
    }
    .opt{
      animation:bmod-reveal linear both;
      animation-timeline:view();
      animation-range:entry 5% cover 18%;
    }
  }
}
@keyframes bmod-reveal{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* ===== /08 HARD-AUDIT FIXES ===== */

/* ======================================================================
 * 09 · MOBILE CTA REVEAL 2026-07-11 — панель контактов появляется «когда надо»
 *     (когда геро с основным CTA ушло с экрана), а не по слепому таймеру 1.5с.
 *     Классами управляет bmod.js: .m-cta--managed (JS взял контроль) →
 *     .m-cta--in (показать) → .m-cta--seen (стаггер уже отыгран).
 *     ФОЛБЭК: если JS не отработал, класса --managed нет и панель
 *     показывается по старой схеме (контакты не пропадут).
 * ====================================================================== */

/* Скрытое исходное состояние — ТОЛЬКО под управлением JS. */
.m-cta.m-cta--managed{
  animation:none!important;                        /* отключить инжектнутый m-cta-in */
  opacity:0;transform:translateY(14px)!important;
  pointer-events:none;
  transition:opacity .28s var(--ease-out),transform .28s var(--ease-out);
}
.m-cta.m-cta--managed.m-cta--in{opacity:1;transform:translateY(0)!important;pointer-events:auto}

/* Покнопочный стаггер — только opacity/scale, БЕЗ сдвига раскладки:
   тап-цели стоят на финальных местах, палец не промахивается. */
.m-cta--managed>*{
  opacity:0;transform:translateY(8px) scale(.96);
  transition:opacity .26s var(--ease-out),transform .26s var(--ease-out);
}
.m-cta--managed.m-cta--in>*{opacity:1;transform:none}
.m-cta--managed.m-cta--in .m-cta__call{transition-delay:.02s}  /* «Позвонить» — первой */
.m-cta--managed.m-cta--in .m-cta__tg{transition-delay:.09s}
.m-cta--managed.m-cta--in .m-cta__wa{transition-delay:.14s}
.m-cta--managed.m-cta--in .m-cta__vb{transition-delay:.19s}

/* После первого показа стаггер не пересобираем — повторное появление это просто фейд. */
.m-cta--seen>*{transition-delay:0s!important}

@media (prefers-reduced-motion:reduce){
  .m-cta--managed,.m-cta--managed>*{transform:none!important;transition-duration:.16s!important}
  .m-cta--managed.m-cta--in .m-cta__call,.m-cta--managed.m-cta--in .m-cta__tg,
  .m-cta--managed.m-cta--in .m-cta__wa,.m-cta--managed.m-cta--in .m-cta__vb{transition-delay:0s!important}
}
/* ===== /09 MOBILE CTA REVEAL ===== */

/* ======================================================================
 * 11 · LANG SWITCHER 2026-07-11 — переключатель Рус/Укр (инжектит bmod.js).
 *     Белая пилюля-подложка → виден на тёмном герое; активный сегмент —
 *     залитый синим, неактивный кликабелен.
 * ====================================================================== */
.bmod-lang{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;margin-left:16px;
  font-size:14px;font-weight:600;line-height:1;color:#334155}          /* база (белая шапка): slate */
.bmod-lang__a{color:currentColor;opacity:.5;text-decoration:none;letter-spacing:.01em;
  transition:opacity .18s var(--ease-out,ease),color .18s ease}
.bmod-lang__a.is-active{opacity:1;font-weight:700;color:var(--primary-blue,#0B4FD1);pointer-events:none;cursor:default}
@media (hover:hover){.bmod-lang__a:hover{opacity:.9}}
.bmod-lang__sep{opacity:.3;font-weight:400}
/* десктоп (тёмный герой): в потоке центрированной группы (лого+меню+язык вместе) */
.bmod-lang--desk{align-self:center;margin-left:24px;font-size:15px;color:#fff}
.bmod-lang--desk .bmod-lang__a.is-active{color:#fff}
/* мобайл: компактно слева от кнопки «МЕНЮ», в верхней строке */
.bmod-lang--mob{align-self:center;margin-right:12px;font-size:13px}
.bmod-lang--float{position:fixed;top:12px;right:12px;z-index:9998;color:#334155}
/* ===== /11 LANG SWITCHER ===== */

/* ======================================================================
 * 12 · DESKTOP DROPDOWN FIX 2026-07-11 — у Astra sub-menu был прозрачный фон
 *     и белый текст: нижние пункты (напр. «Ключи») свисали на белый контент
 *     и становились невидимыми. Даём подменю сплошную белую подложку.
 *     Только десктоп (≥922px) — на мобиле меню-аккордеон, наложения нет.
 * ====================================================================== */
@media (min-width:922px){
  #masthead .sub-menu,#masthead ul.sub-menu{
    background:#fff!important;box-shadow:0 14px 34px rgba(15,23,42,.16);
    border-radius:12px;padding:6px 0;border:1px solid rgba(15,23,42,.06);
  }
  #masthead .sub-menu a,#masthead .sub-menu .menu-link{color:#1e293b!important}
  #masthead .sub-menu a:hover,#masthead .sub-menu .menu-link:hover{
    color:var(--primary-blue,#0B4FD1)!important;background:var(--primary-blue-light,rgba(11,79,209,.07))
  }
}
/* ===== /12 DESKTOP DROPDOWN FIX ===== */

/* ======================================================================
 * 13 · MOBILE MENU CARD 2026-07-12 — раскрытый бургер оформлен скруглённой
 *     карточкой (как остальные блоки сайта), а не полосой во всю ширину.
 *     .ast-mobile-header-content виден только при открытом меню → безопасно.
 * ====================================================================== */
@media (max-width:921px){
  .ast-mobile-header-content{
    border-radius:18px;overflow:hidden;
    box-shadow:0 14px 34px rgba(15,23,42,.14);
    border:1px solid rgba(15,23,42,.06);
    margin:6px 4px 12px;
  }
}
/* ===== /13 MOBILE MENU CARD ===== */

/* ======================================================================
 * 14 · DESKTOP CTA-GROUP 2026-07-18 — кнопки мессенджеров в ряд, а не во всю
 *     ширину. На мобиле common.min.css задаёт .cta-group .cta-btn{width:100%}
 *     (это ок), но на ПК из-за этого 3 кнопки растягивались на всю колонку
 *     (~1070px) и вставали столбиком. .cta-group уже flex+center+wrap —
 *     здесь просто снимаем width:100% на десктопе. Только bmod.css.
 * ====================================================================== */
@media (min-width:768px){
  .cta-group .cta-btn{
    width:auto!important;
    flex:0 1 240px;
    min-width:200px;
    max-width:300px;
    padding-left:26px;padding-right:26px;
  }
}
/* ===== /14 DESKTOP CTA-GROUP ===== */
