/* ===== БАЗА И АДАПТИВ ИЗ ПРИНЯТОГО МАКЕТА =====
   Селекторы завязаны на data-r и инлайновые стили в шаблонах — не переименовывать. */
body { margin:0; background:#fff; font-family:'Onest',system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
* { box-sizing:border-box; }
a { color:#4569CA; text-decoration:none; }
a:hover { color:#2F478B; }
input, button, select { font-family:inherit; }
summary::-webkit-details-marker { display:none; }
summary::marker { content:''; }
details[open] .plus { transform:rotate(45deg); }
.rev-track { scrollbar-width:none; -ms-overflow-style:none; }
.rev-track::-webkit-scrollbar { display:none; }
/* Ссылка «Перейти к содержимому»: не видна, пока на неё не встали с клавиатуры.
   Родительский класс screen-reader-text прячем тем же способом — Twenty Twenty
   вешает его и на другие служебные подписи, а его стили мы не подключаем. */
.mch-skip, .screen-reader-text {
  position:absolute; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}
.mch-skip:focus, .screen-reader-text:focus {
  position:fixed; top:12px; left:12px; z-index:400;
  width:auto; height:auto; margin:0; padding:14px 22px;
  clip:auto; clip-path:none; overflow:visible;
  background:#fff; color:#4569CA; border-radius:999px;
  font-family:'Unbounded',sans-serif; font-size:13px; font-weight:500;
  box-shadow:0 10px 34px rgba(15,22,51,.24);
}
/* У залогиненного редактора сверху висит панель WordPress — не перекрываем её. */
body.admin-bar .mch-skip:focus, body.admin-bar .screen-reader-text:focus { top:44px }

/* Подпись режима работы в шапке. В макете стояла жёсткая max-width:56px, и слово
   «открыты» рвалось посимвольно из-за overflow-wrap:break-word (§ «общие правила»).
   Ширины хватает на два слова в две строки, перенос внутри слова запрещён. */
.mch-hours-label { max-width:72px; overflow-wrap:normal; word-break:normal; hyphens:none; }

/* Ссылки внутри текста на тёмном фоне. Глобальный цвет ссылки #4569CA даёт на
   синем контраст 1,8:1 — текст практически не читается. Стиль держим здесь, а не
   в тексте поля: клиент правит текст в админке и инлайновый стиль потеряет. */
.mch-on-dark a { color:#fff; text-decoration:underline }
.mch-on-dark a:hover { color:#fff; opacity:.85 }

/* Логотип агентства в подвале — ссылка, поэтому ему нужен ховер. */
.mch-agency { display:block }
.mch-agency:hover img { opacity:1 }

/* ===== АДАПТИВ ===== */

/* Дыра в адаптиве между 1281 и ~1415 px: у корня из макета стоит min-width:1400px,
   а обёртки начинаются от clamp-минимума 1240 px + 64 px отступов = 1304 px.
   Медиазапросы ниже включались только с 1280 px, поэтому весь ноутбучный диапазон
   ехал горизонтально. Снимаем нижний предел и разрешаем обёрткам ужиматься;
   пока ширины хватает, они остаются 1240 px, как в макете. */
@media (max-width:1440px){
  [data-minw],[data-r=root]{min-width:0 !important}
  [data-r=root] [style*="clamp(1240px"]{max-width:100% !important}
}

/* Содержимое шапки (лого + режим + меню + телефон + значки + кнопка) занимает
   около 1282 px. Белый бар держит ширину clamp(1240px,86vw,1560px), то есть до
   1490 px экрана он уже́ содержимого — и кнопка «Личный кабинет» выезжала за
   скруглённый край. Ужимаем отступы, ничего не пряча: прятать начинаем с 1280 px
   в блоке ниже. */
@media (max-width:1490px){
  [data-r=hdrbar]{gap:16px !important;padding-left:20px !important}
  [data-r=nav]{gap:14px !important}
  [data-r=hdrbar] > div:last-child{gap:10px !important}
  [data-r=cabbtn]{padding:13px 18px !important}
}
@media (max-width:1330px){
  [data-r=phone]{font-size:14px !important}
}

@media (max-width:1280px){
  [data-r=root]{min-width:0 !important}
  [data-r=tablewrap]{overflow-x:auto;-webkit-overflow-scrolling:touch}
  [data-r=tablewrap] table{min-width:720px}
  [data-r=root] [style*="clamp(1240px"]{width:100% !important;max-width:100% !important}
  [data-r=wrap]{width:100% !important;padding-left:28px !important;padding-right:28px !important}
  [data-cols="3"],[data-cols="4"],[data-cols="6"]{grid-template-columns:repeat(2,1fr) !important}
  [data-r=arrowL],[data-r=arrowR]{width:34px !important;height:34px !important;font-size:15px !important;top:auto !important;bottom:18px !important;transform:none !important}
  [data-r=arrowL]{left:18px !important}
  [data-r=arrowR]{right:18px !important}
  [data-r=hdrbar]{width:100% !important;gap:14px !important;padding-left:20px !important}
  [data-r=hdrbar] > *{min-width:0 !important}
  [data-r=hours],[data-r=cabbtn]{display:none !important}
  [data-r=cabicon]{display:flex !important}
  /* Обрезку содержимого здесь ставить нельзя: вместе с меню обрезается и
     выпадающая панель подменю — она открывается, но её не видно. Меню и так
     умещается: на 1090 px оно занимает 350 px при свободных 1011 px. */
  [data-r=nav]{gap:14px !important;font-size:11px !important;flex:0 1 auto !important;min-width:0 !important}
}
@media (max-width:1080px){
  [data-r=nav]{display:none !important}
  [data-r=burger]{display:flex !important}
}
@media (max-width:900px){
  [data-r=root] img{max-width:100%}
  [data-r=wrap],[data-r=root] [style*="clamp(1240px"]:not([data-r=hdrbar]){padding-left:22px !important;padding-right:22px !important}
  [data-cols]{grid-template-columns:repeat(2,1fr) !important}
  [data-r=row]{flex-wrap:wrap !important}
  [data-r=h1]{font-size:30px !important;line-height:1.18 !important}
  [data-r=h2]{font-size:24px !important}
  [data-r=h3]{font-size:20px !important}
  [data-r=nav],[data-r=hours],[data-r=cabbtn],[data-r=msgr]{display:none !important}
  [data-r=fieldlabel]{display:block !important}
  /* Подсказка поля адреса не влезает в строку — её рисует отдельный span [data-r=fieldlabel].
     Прячем только этот placeholder: в лид-форме ярлыка нет, и подсказки полей должны быть видны. */
  [data-mch-hero-addr]::placeholder{color:transparent}
  [data-mch-hero-addr]:not(:placeholder-shown) + [data-r=fieldlabel]{display:none !important}
  [data-r=stack] input{padding-top:15px !important;padding-bottom:15px !important;min-height:64px}
  [data-r=bizbtn]{margin-left:0 !important;align-self:flex-start !important}
  [data-r=modaloverlay]{padding:10px !important}
  [data-r=modalcard]{padding:8px !important;width:100% !important}
  [data-r=modalcard] > [style*="position:absolute"]{top:8px !important;right:8px !important}
  [data-r=modaltitle]{font-size:25px !important;padding-right:48px !important}
  [data-r=progwrap]{display:flex !important;align-items:stretch;gap:16px}
  [data-r=prog]{width:3px !important;height:auto !important;flex:none !important;align-self:stretch;margin-top:0 !important}
  [data-r=prog] + [data-cols]{flex:1;min-width:0;margin-top:0 !important}
  [data-r=progfill]{width:3px !important;height:var(--p) !important;background:linear-gradient(180deg,#4569CA,#70E2FF) !important;transition:height .4s cubic-bezier(.4,0,.2,1) !important}
  [data-r=eqcard]{display:block !important}
  [data-r=eqicon]{width:56px !important;height:56px !important;border-radius:16px !important;float:left;margin-right:14px}
  [data-r=eqicon] svg{width:30px !important;height:30px !important}
  [data-r=eqtitle]{font-size:19px !important;margin-top:0 !important;display:flex;align-items:center;min-height:56px}
  [data-r=eqlist]{clear:both}
  [data-r=eqpricebox]{display:contents}
  [data-r=eqfoot]{flex-wrap:wrap !important;padding-top:20px !important;gap:10px 14px !important;align-items:center !important;justify-content:flex-start !important}
  [data-r=eqval]{font-size:21px !important}
  [data-r=eqfoot] button{margin-left:auto !important;padding:14px 26px !important;font-size:13px !important}
  [data-r=eqnote]{order:3;width:100%;margin-top:0 !important}
  [data-r=bizrow]{flex-wrap:wrap !important;gap:12px 14px !important;align-items:center !important}
  [data-r=bizicon]{order:1}
  [data-r=bizval]{order:2;width:auto !important;font-size:19px !important;line-height:1.2}
  [data-r=biztitle]{order:3;width:100% !important;flex:1 1 100% !important;font-size:17px !important}
  [data-r=bizdesc]{order:4;flex:1 1 100% !important;padding-right:0 !important;font-size:15px !important}
  [data-r=leadcard]{padding:8px !important;border-radius:22px !important}
  [data-r=leadcard] > [data-r2=leadtitle]{font-size:25px !important}
  [data-r=leadcard] > p{font-size:15px !important;margin-top:8px !important}
  [data-r=leadcard] > [data-cols]{margin-top:14px !important}
  [data-r=wrap]:has([data-r=leadcard]){padding-left:10px !important;padding-right:10px !important}
  [data-r=swipehint]{display:flex !important}
  [data-r=mtablewrap]{display:block !important}
  [data-r=mtablenotes]{display:flex !important}
  [data-r=swipehint] ~ [data-r=tablewrap]{display:none !important}
  [data-r=caraL],[data-r=caraR]{display:flex !important;width:40px !important;height:40px !important;font-size:17px !important;box-shadow:0 8px 20px rgba(15,22,51,.28) !important}
  [data-r=caraL]{left:4px !important}
  [data-r=caraR]{right:4px !important}
  [data-r=burger],[data-r=cabicon]{display:flex !important}
  [data-r=hdrpad]{padding:12px 16px 0 !important}
  [data-minw]{min-width:0 !important}
  [data-fixflex]{flex:1 1 100% !important}
  [data-hauto]{height:auto !important;min-height:0 !important}
  [data-r=root] input,[data-r=root] button,[data-r=root] textarea,[data-r=root] select{max-width:100% !important}    .rev-track{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .rev-track > div{scroll-snap-align:start}
  #rev-track > div{width:min(360px,78vw) !important}
  #office-track > div{width:min(279px,66vw) !important}
  [data-minw] p,[data-minw] div{max-width:100% !important}
  [data-r=hdrbar]{width:100% !important;gap:12px !important;padding:10px 12px 10px 18px !important}
}
@media (max-width:600px){
  [data-r=wrap],[data-r=root] [style*="clamp(1240px"]:not([data-r=hdrbar]){padding-left:16px !important;padding-right:16px !important}
  [data-cols]{grid-template-columns:1fr !important}
  [data-r=row]{flex-direction:column !important;align-items:stretch !important}
  [data-r=h1]{font-size:24px !important}
  [data-r=h2]{font-size:20px !important}
  [data-r=h3]{font-size:18px !important}
  [data-r=stack]{flex-direction:column !important;align-items:stretch !important}
  [data-r=phone]{display:none !important}
  [data-r=root] span[style*="nowrap"]{white-space:normal !important}
  /* Исключение: мобильная таблица сравнения сама листается вбок, вылезать ей
     некуда. Без него скорость рвалась на «до 60 / Мбит/с», а адрес акции —
     на «переулок Дорожный, / 17А». */
  [data-r=root] [data-r=mtablewrap] span[style*="nowrap"]{white-space:nowrap !important}
  [data-r=root] input,[data-r=root] button,[data-r=root] textarea,[data-r=root] select{max-width:100% !important}
}

/* ===== ХОВЕРЫ ИЗ МАКЕТА =====
   В x-dc они жили атрибутом style-hover. Здесь — обычные классы. */
.mch-hv-link:hover    { color:#2F478B !important }
.mch-hv-dd:hover      { background:#EEF3FF !important; color:#4569CA !important }
.mch-hv-btn:hover     { background:#2F478B !important; color:#fff !important }
.mch-hv-arrow:hover   { background:rgba(255,255,255,.28) !important }
.mch-hv-outline:hover { border-color:#4569CA !important; color:#4569CA !important }
.mch-hv-soft:hover    { background:#eef4ff !important }
.mch-hv-border:hover  { border-color:#4569CA !important }
.mch-hv-shadow:hover  { box-shadow:0 12px 30px rgba(69,105,202,.12) !important }
.mch-hv-pale:hover    { background:#EEF3FF !important }

/* На тач-устройствах ховеров нет — всё работает по тапу, поэтому глушим,
   чтобы «залипший» ховер не оставался после касания. */
@media (hover: none) {
  [class*="mch-hv-"]:hover { background:inherit; color:inherit; border-color:inherit; box-shadow:none }
}

/* ===== СОСТОЯНИЯ, КОТОРЫЕ РАНЬШЕ СЧИТАЛ JS ===== */

/* Выпадающее подменю в шапке */
.mch-dd__panel                  { display:none }
.mch-dd.is-open .mch-dd__panel  { display:block }
.mch-dd.is-open .mch-dd__arrow  { transform:rotate(180deg) }

/* Мобильное меню */
.mch-mob            { display:none }
.mch-mob.is-open    { display:flex }
body.mch-no-scroll  { overflow:hidden }

/* Точки слайдера */
.mch-dot            { background:rgba(255,255,255,.35); transition:background .2s }
.mch-dot.is-active  { background:#ffffff }

/* Карточки «Как подключиться» */
.mch-step              { background:#f4f6fb; border:1px solid #e6eaf4; box-shadow:none }
.mch-step__num         { background:#fff; color:#4569CA }
.mch-step__title       { color:#0f1633 }
.mch-step__text        { color:#5b6480 }
.mch-step.is-active            { background:linear-gradient(180deg,#7C9AE8 0%,#5C7FD8 45%,#4569CA 100%); border-color:transparent; box-shadow:0 18px 40px rgba(69,105,202,.25) }
.mch-step.is-active .mch-step__num   { background:#70E2FF; color:#16225a }
.mch-step.is-active .mch-step__title { color:#ffffff }
.mch-step.is-active .mch-step__text  { color:#EAF2FF }
.mch-step.is-active .mch-step__icon  { filter:brightness(0) invert(1) }
.mch-step__icon        { transition:filter .3s ease }
.mch-step:focus-visible { outline:2px solid #4569CA; outline-offset:3px }

/* Модалка заявки */
.mch-modal          { display:none }
.mch-modal.is-open  { display:flex }

/* ===== ФОРМА ===== */
.mch-form__error {
  display:none; margin:6px 0 0; padding-left:24px;
  font-size:13px; line-height:1.4; color:#E23D3D;
}
.mch-form__error.is-visible { display:block }
.mch-form input.is-invalid,
.mch-form textarea.is-invalid { border-color:#E23D3D !important }
.mch-form__result           { display:none }
.mch-form__result.is-visible{ display:block }
.mch-form__result.is-error  { color:#FFD5D5 !important }
.mch-form button[type=submit][disabled] { opacity:.6; cursor:progress }
/* В модалке ошибки на белом фоне */
.mch-modal .mch-form__result.is-error { color:#E23D3D !important }

/* ===== ОБЩИЕ ПРАВИЛА ВЁРСТКИ (standards-wp.md) ===== */
img { max-width:100%; height:auto }
body { overflow-wrap:break-word; word-wrap:break-word }
:where(a, button, [role=button]):focus-visible { outline:2px solid #4569CA; outline-offset:2px }

/* Тап-зоны не меньше 44px на тач-устройствах */
@media (max-width:900px) {
  .mch-form input, .mch-form textarea { min-height:48px }
  [data-r=root] a[href^="tel:"], [data-r=root] a[href^="mailto:"] { display:inline-block; min-height:44px; line-height:44px }
}

/* ===== ТИПОГРАФИКА ПРОСТЫХ СТРАНИЦ ===== */
.mch-content h2 { font-family:'Unbounded',sans-serif; font-size:26px; line-height:1.25; font-weight:600; margin:44px 0 16px; letter-spacing:-.02em }
.mch-content h3 { font-family:'Unbounded',sans-serif; font-size:21px; line-height:1.3; font-weight:600; margin:34px 0 14px }
.mch-content p  { margin:0 0 16px }
.mch-content ul, .mch-content ol { margin:0 0 16px; padding-left:22px }
.mch-content li { margin-bottom:8px }
.mch-content img { border-radius:18px }

/* ===== ТЕКСТ ВНУТРИ СЕКЦИИ «ТЕКСТОВЫЙ БЛОК» ===== */
.mch-richtext          { color:#414a66; font-size:17px; line-height:1.65 }
.mch-richtext p        { margin:0 0 18px; text-align:justify }
.mch-richtext p:last-child { margin-bottom:0 }
/* Заголовкам нужен свой интерлиньяж: без него они наследуют 1.65 от абзаца
   и выглядят разреженными. В макете 1.25 и 1.3. */
.mch-richtext h3       { font-family:'Unbounded',sans-serif; font-size:21px; line-height:1.3; font-weight:600; margin:34px 0 14px; color:#0f1633 }
.mch-richtext ul,
.mch-richtext ol       { margin:0 0 22px; padding-left:22px }
.mch-richtext li       { margin-bottom:10px }
/* Вводный абзац. Клиент ставит его в редакторе: «Форматы» → «Вводный абзац». */
.mch-richtext p.mch-lead { font-size:19px; line-height:1.65; color:#0f1633; margin:0 0 20px; text-align:left }
/* Примечание в конце страницы: мельче и приглушённее основного текста. */
.mch-richtext p.mch-note { font-size:16px; color:#5b6480; text-align:left }
/* Текст рядом с картой в макете выровнен по левому краю, а не по ширине. */
.mch-richtext--left p { text-align:left }
/* Длинный документ читается с колонкой уже и строкой свободнее — так в макете. */
.mch-side-main .mch-richtext { color:#2c3547; line-height:1.75 }
.mch-richtext img      { border-radius:18px; height:auto }
@media (max-width:900px) {
  .mch-richtext        { font-size:16px; line-height:1.6 }
  .mch-richtext p      { text-align:left }
}

/* ===== СТРАНИЦА С БОКОВЫМ МЕНЮ =====
   Документы и страницы помощи в макете свёрстаны компактнее: заголовок 40 px,
   подзаголовок 17. Класс на body ставит mch_body_class_doc() в functions.php.
   Размеры инлайновые, поэтому !important — иначе правило не перебьёт шаблон. */
body.mch-doc [data-r=h1]     { font-size:40px !important }
body.mch-doc .mch-hero-sub   { font-size:17px !important; max-width:720px !important }
@media (max-width:900px) {
  body.mch-doc [data-r=h1]   { font-size:30px !important }
}
 */
.mch-side-wrap        { display:flex; gap:56px; align-items:flex-start; padding-bottom:0 }
.mch-side-main        { flex:1; min-width:0; max-width:860px }
/* Секции внутри колонки свою ширину и боковые отступы не задают — их держит колонка. */
.mch-side-main [data-r=wrap] { width:100% !important; padding-left:0 !important; padding-right:0 !important }
@media (max-width:900px) {
  .mch-side-wrap      { flex-direction:column; gap:32px }
  .mch-side-main      { max-width:100% }
  .mch-side-nav       { position:static !important; width:100% }
}

/* ===== ОГЛАВЛЕНИЕ СТРАНИЦЫ =====
   Ссылки ведут к разделам той же страницы. Шапка сайта липкая, поэтому у цели
   прыжка оставляем отступ сверху — иначе заголовок раздела уезжает под шапку.

   Список в одну колонку на любой ширине: один пункт — одна строка. В две колонки
   пункты разной длины стояли вразнобой. Номер раздела вынесен в свою колонку —
   вторая строка длинного заголовка встаёт под первую, а не под номер. */
.mch-toc-list > li    { border-top:1px solid rgba(69,105,202,.16) }
.mch-toc-list > li:first-child { border-top:0 }
.mch-toc-link         { display:grid; grid-template-columns:2.6em 1fr; align-items:start; padding:12px 0; font-size:16px; line-height:1.45; color:#4569CA }
.mch-toc-link:hover   { color:#2F478B }
.mch-toc-link:hover .mch-toc-text { text-decoration:underline }
.mch-toc-num          { color:#8b95ae }
.mch-guide[id]        { scroll-margin-top:104px }
.mch-guide[id]:focus  { outline:none }
@media (max-width:900px) {
  .mch-toc-link       { font-size:15px; grid-template-columns:2.8em 1fr }
  .mch-guide[id]      { scroll-margin-top:88px }
}
/* Плавная прокрутка — только тем, кто не просил уменьшить анимацию. */
@media (prefers-reduced-motion:no-preference) {
  html { scroll-behavior:smooth }
}

/* ===== СЕКЦИЯ «ИНСТРУКЦИЯ» ===== */
.mch-guide            { font-size:17px; line-height:1.75; color:#2c3547; max-width:860px }
.mch-guide li         { margin-bottom:12px }
.mch-guide figure img { max-width:100%; height:auto }
.mch-richtext--flat   { color:inherit; font-size:inherit; line-height:inherit }
.mch-richtext--flat p { margin:0 0 10px; text-align:left }
.mch-richtext--flat p:last-child { margin-bottom:0 }
.mch-richtext--flat ul { margin:10px 0 0 }
@media (max-width:900px) {
  .mch-guide          { font-size:16px; line-height:1.6 }
}

/* ===== ТАБЛИЦЫ В ТЕКСТЕ ===== */
/* Таблица из макета: строки-плитки с зазором, скруглённые по краям,
   на светлой подложке. Разделительных линий нет — их роль играет зазор. */
.mch-richtext table   { width:100%; border-collapse:separate; border-spacing:0 8px; margin:0 0 26px; font-size:15px; background:#F7F9FF; border-radius:22px; padding:14px; display:block; overflow-x:auto; -webkit-overflow-scrolling:touch }
.mch-richtext table thead,
.mch-richtext table tbody { display:table; width:100%; min-width:560px }
.mch-richtext th      { background:#4569CA; color:#fff; text-align:left; font-family:'Unbounded',sans-serif; font-size:14px; font-weight:500; padding:16px 14px }
.mch-richtext th:first-child { padding-left:20px; border-radius:14px 0 0 14px }
.mch-richtext th:last-child  { padding-right:20px; border-radius:0 14px 14px 0 }
.mch-richtext td      { padding:16px 14px; background:#fff; color:#2c3d7a; border:0; vertical-align:top }
.mch-richtext td:first-child { padding-left:20px; border-radius:14px 0 0 14px; color:#1f2f7d; font-weight:600 }
.mch-richtext td:last-child  { padding-right:20px; border-radius:0 14px 14px 0 }
.mch-richtext tbody tr:nth-child(even) td { background:#EEF3FF }
.mch-richtext h2      { font-family:'Unbounded',sans-serif; font-size:26px; line-height:1.25; font-weight:600; margin:44px 0 16px; color:#0f1633; letter-spacing:-.02em }
/* H4 в макете идёт основным шрифтом и жирнее — не Unbounded. */
.mch-richtext h4      { font-family:inherit; font-size:18px; line-height:1.3; font-weight:700; margin:32px 0 12px; color:#0f1633 }
.mch-richtext blockquote { margin:28px 0; padding:24px 28px; background:#EEF3FF; border-left:3px solid #4569CA; border-radius:0 18px 18px 0; color:#1f2f7d }
.mch-richtext blockquote p { margin:0; font-size:19px; line-height:1.6; font-style:italic; text-align:left }
.mch-richtext cite    { display:block; margin-top:12px; font-style:normal; font-size:14px; color:#5b6480 }
.mch-richtext hr      { border:0; height:1px; background:#e6eaf4; margin:32px 0 }
@media (max-width:900px) {
  .mch-richtext h2    { font-size:22px }
}

/* ===== ПРОВЕРКА СКОРОСТИ ===== */
.mch-speed-tab[aria-selected="true"] { background:#fff !important; color:#4569CA !important; font-weight:500 }
.mch-hv-glass:hover   { background:rgba(255,255,255,.16) !important }

/* ===== ПОДСКАЗКИ АДРЕСА =====
   Список рисует initAddress() в js/app.js и кладёт его в конец <body>: внутри
   первого экрана его срезало границей секции (там overflow:hidden ради
   скруглённых углов). Координаты и ширину задаёт place() в том же файле. */
.mch-ac {
  display:none; position:fixed; top:0; left:0; z-index:150;
  max-height:320px; overflow-y:auto; padding:6px;
  background:#fff; border-radius:22px; box-shadow:0 22px 50px rgba(15,22,51,.22);
  text-align:left;
}
.mch-ac.is-open { display:block }
.mch-ac__row {
  display:flex; align-items:center; flex-wrap:wrap; gap:4px 10px;
  padding:11px 16px; border-radius:14px; cursor:pointer;
  font-size:15px; line-height:1.3; color:#0f1633;
}
.mch-ac__row:hover, .mch-ac__row.is-active { background:#EEF3FF }
.mch-ac__title { font-weight:500 }
.mch-ac__note  { font-size:13px; color:#8b95ae }
.mch-ac__badge {
  padding:3px 9px; border-radius:999px; background:#E9F7EF; color:#137C3B;
  font-size:12px; font-weight:600;
}
.mch-ac__row--manual { color:#4569CA; font-size:14px }
.mch-ac__empty { padding:11px 16px; font-size:14px; color:#5b6480 }
@media (max-width:600px) {
  /* На узком экране поле и кнопка стоят друг под другом: список не должен
     накрывать кнопку целиком, поэтому он ниже и компактнее. */
  .mch-ac { max-height:260px }
  .mch-ac__row { padding:12px 14px; min-height:44px }
}

/* Ответ в «Частых вопросах»: наследует цвет и размер из инлайнового стиля блока. */
.mch-faq-answer          { font-size:inherit; color:inherit }
.mch-faq-answer p        { margin:0 0 12px; text-align:left }
.mch-faq-answer p:last-child { margin-bottom:0 }
.mch-faq-answer ul,
.mch-faq-answer ol       { margin:0 0 12px; padding-left:22px }