/*
 * Правки оформления, перенесённые из colormag 2.0.3 и адаптированные
 * под разметку colormag 4.2.1 (2026-08-06).
 *
 * Новая тема переименовала всю шапку на префикс cm-:
 *   #site-title           -> .cm-site-title
 *   #site-description     -> .cm-site-description
 *   #header-text-nav-wrap -> .cm-header-1
 *   #header-left-section  -> #cm-header-1 .cm-header-col-1
 *   #site-navigation      -> .cm-header-2 / #cm-primary-nav
 *   .main-navigation      -> .cm-primary-nav
 *   .entry-title          -> .cm-entry-title
 */

/* --- не зависит от версии темы --- */
a:active { color: #3399ca; }

h2 { font-size: 32px; font-weight: 500; font-family: "Roboto", sans-serif; line-height: 1.2; }
h3 { font-size: 28px; line-height: 1.2; }
h4 { font-size: 24px; line-height: 1.2; }
h5 { font-size: 20px; line-height: 1.2; }
h6 { font-size: 18px; line-height: 1.2; }

/* --- шапка --- */

/* текстовый заголовок сайта скрыт: его роль играет логотип */
.cm-site-title { display: none !important; }

.cm-site-description {
    margin-top: 5px;
    display: inline-block;
    vertical-align: middle;
}

/* логотип и слоган в одну строку, как было в 2.0.3 */
#cm-header-1 .cm-header-col-1 #cm-site-branding {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: nowrap;
}
#cm-header-1 .cm-header-col-1 .custom-logo-link { flex: 0 0 auto; }
#cm-header-1 .cm-header-col-1 #cm-site-info { margin: 0; }

.cm-header-1 { padding: 10px 0 5px; }
#cm-header-1 .cm-header-col-1 { margin-top: 10px; }

/* правая часть шапки: телефон не должен переноситься */
.cm-header-col-2 .tele,
.cm-header-col-2 .tele a { white-space: nowrap; }
.cm-header-col-2 { text-align: right; }
.cm-header-col-2 .napishite { display: inline-block; vertical-align: middle; margin-right: 16px; }

/*
 * Мобильная шапка (≤767px) — как на боевом: логотип по центру, слоган
 * скрыт, кнопка «Свяжитесь» и телефон в один ряд. Десктопные правила выше
 * (флекс «логотип+слоган в ряд, nowrap») на 375px ломались: логотип
 * пропадал, слоган занимал его место, кнопка переносилась.
 */
@media (max-width: 767px) {
    /* слоган на телефоне скрыт — на боевом его в мобильной шапке нет */
    .cm-site-description { display: none !important; }

    /* брендинг: логотип отдельным блоком по центру, не в ряд со слоганом */
    #cm-header-1 .cm-header-col-1 #cm-site-branding {
        display: block;
        flex-wrap: wrap;
        text-align: center;
    }
    #cm-header-1 .cm-header-col-1 {
        margin-top: 0;
        justify-content: center;
        text-align: center;
    }
    #cm-header-1 .cm-header-col-1 .custom-logo-link { display: inline-block; }

    /* контакт: кнопка и телефон по центру, компактнее */
    .cm-header-col-2 { text-align: center; }
    .cm-header-col-2 .napishite { margin-right: 10px; }
    /* кнопка «Свяжитесь с нами» в одну строку, а не в две */
    .cm-header-col-2 .napishite,
    .cm-header-col-2 .napishite a { white-space: nowrap; width: auto; }
}

/* --- навигация: фирменные цвета --- */
.cm-header-2,
#cm-primary-nav,
.cm-primary-nav {
    background-color: #32404d;
}
.cm-header-2 { border-top: 4px solid #ee3623 !important; }

.cm-primary-nav ul li.current_page_item > a,
.cm-primary-nav ul li.current-menu-item > a,
.cm-primary-nav ul li:hover > a,
.cm-primary-nav ul li.focus > a { background-color: #32404d; }

.cm-primary-nav .sub-menu,
.cm-primary-nav .children { background-color: #32404d; }

/* --- содержимое --- */
.cm-entry-title,
#content .post .article-content .entry-title { font-size: 42px; }

/* --- блок «Новости» над содержимым главной --- */
.ruli24-front-news { margin: 0 0 10px; }
.ruli24-front-news .widget-title,
.ruli24-front-news h3 {
    display: inline-block;
    background: #7c7c7c;
    color: #fff;
    font-size: 15px;
    padding: 6px 14px;
    margin: 0 0 6px;
}
.ruli24-front-news ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid #e0e0e0; padding-top: 8px; }
.ruli24-front-news li { margin: 0 0 4px; font-size: 14px; }
.ruli24-front-news .post-date { color: #444; margin-right: 8px; }

@media screen and (max-width: 767px) {
    .cm-header-1 { margin-bottom: 30px; }
    #cm-header-1 .cm-header-col-1 #cm-site-branding { justify-content: center; }
    .cm-header-col-2 { text-align: center; }
}

/* --- стили для страниц с Инструкцией по установке модулей. Не удалять! --- */
.ustanovka-ruli24-gis li { list-style-image: none; }
.ustanovka-ruli24-gis blockquote {
    background-color: ButtonFace;
    color: #444;
    padding: 0;
}
.ustanovka-ruli24-gis blockquote > p::before {
    content: none;
    font-family: Georgia, "Bitstream Charter", serif;
    font-style: italic;
    font-weight: normal;
    margin: 0 3em;
}

.my-class-for-image img { width: 315px; height: 216px; }

.x-news { color: #fff; }
.x-news:hover { color: #fff; opacity: 0.7; }

/* --- заголовок страницы от темы: на страницах Elementor его быть не должно --- */
body.elementor-page .cm-entry-header,
body.elementor-page .cm-entry-title { display: none !important; }

/* --- шапка: логотип и слоган в одну строку --- */
#cm-header-1 .cm-header-col-1 .cm-site-branding,
#cm-header-1 .cm-header-col-1 #cm-site-branding {
    display: flex !important;
    align-items: center;
    gap: 16px;
    flex-wrap: nowrap;
    text-align: left;
}
#cm-header-1 .cm-header-col-1 #cm-site-info { margin: 0 !important; text-align: left; }
#cm-header-1 .cm-header-col-1 .cm-site-description { margin: 0 !important; white-space: nowrap; }
#cm-header-1 .cm-header-col-1 .custom-logo-link { flex: 0 0 auto; margin: 0 !important; }
#cm-header-1 .cm-header-col-1 .custom-logo { display: block; }

/* --- шапка: кнопка и телефон в одну строку --- */
.cm-header-col-2 #header-right-sidebar,
.cm-header-col-2 .widget_custom_html {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 18px;
}
.cm-header-col-2 .textwidget.custom-html-widget {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 18px;
    width: 100%;
}
.cm-header-col-2 .napishite { margin: 0 !important; }

/* --- блок «Новости»: по ширине содержимого, дата перед заголовком --- */
.ruli24-front-news {
    max-width: 1160px;
    margin: 12px auto 0;
    padding: 0 20px;
}
.ruli24-front-news li {
    display: flex;
    gap: 8px;
    align-items: baseline;
}
.ruli24-front-news li .post-date { order: -1; flex: 0 0 auto; }

/* --- шапка: логотип и слоган — соседи внутри cm-header-col-1, а не вложены --- */
#cm-header-1 .cm-header-col-1 {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    flex-wrap: nowrap;
    text-align: left;
}
#cm-header-1 .cm-header-col-1 > #cm-site-branding,
#cm-header-1 .cm-header-col-1 > #cm-site-info { margin: 0 !important; padding: 0 !important; }
#cm-header-1 .cm-header-col-1 > #cm-site-branding { flex: 0 0 auto; }
#cm-header-1 .cm-header-col-1 .cm-site-description { margin: 0 !important; white-space: nowrap; line-height: 1.2; }

@media screen and (max-width: 767px) {
    #cm-header-1 .cm-header-col-1 { flex-wrap: wrap; justify-content: center; }
    #cm-header-1 .cm-header-col-1 .cm-site-description { white-space: normal; }
}

/* --- шапка компактнее, как на боевом --- */
.cm-header-1 { padding: 4px 0 2px !important; }
.cm-header-1 .cm-row { align-items: center; }

/* кнопка «Свяжитесь с нами» сразу за слоганом, телефон прижат вправо */
.cm-header-col-2 .textwidget.custom-html-widget {
    justify-content: space-between !important;
    gap: 12px;
}
.cm-header-col-2 .napishite { margin-right: auto !important; }

/* полоса навигации тоньше */
#cm-header-2 .cm-container { padding-top: 0; padding-bottom: 0; }
#cm-primary-nav ul li a { padding-top: 10px; padding-bottom: 10px; }

/* ==================================================================
 * Перенос правил из Customizer, написанных под colormag 2.0.3.
 * Комментарии авторов сохранены — по ним видно назначение.
 * ================================================================== */

/* «фиксированный хедер» — #header-text-nav-container */
#cm-masthead.cm-header {
    background-color: #ffffff;
    position: fixed;
    width: 100%;
    z-index: 999;
    top: 0;
}
/*
 * Отступ области содержимого. Подобран замером DOM, а не на глаз.
 *
 * Обе темы отодвигают содержимое от фиксированной шапки, но по-разному:
 *
 *   боевой:  body без отступа, `#main { padding: 140px 0 20px }`
 *            → article начинается на y=140
 *   копия:   `body { padding-top: 92px }` (компенсация шапки от colormag
 *            4.2.1), `.cm-content` без верхнего отступа
 *            → article начинается на y=92
 *
 * Не хватает ровно 48px, и это одно и то же число на всех страницах:
 * 140/20 у `#main` на боевом — правило темы, не зависящее от страницы.
 *
 * Раньше здесь стоял 0, а до того я пробовал 30px «по правилу темы
 * colormag 2.0.3» — не подошло, потому что боевое значение переопределено
 * до 140px, и увидеть это по исходникам нельзя, только замером.
 */
body.cm-header-layout-1 #cm-content,
.cm-content-area {
    padding-top: 48px;
    padding-bottom: 20px;
}
/* у колонки содержимого своего отступа сверху на боевом нет */
body #cm-primary { padding-top: 0; }

/* «высота хедер» — #header-text-nav-wrap { padding: 0 } */
.cm-header-1 { padding: 0 !important; }

/* «отступ слева у логотипа» — #header-left-section */
#cm-header-1 .cm-header-col-1 { padding-left: 12px; }

/* «виджет в шапке — напишите мне и телефон» — #header-right-section */
.cm-header-col-2 { float: none; }

/* «шапка мобильная версия — отступы» — #site-description */
.cm-site-description { margin-top: 0 !important; margin-bottom: 0 !important; }

/* «подвал скрытие подписи» — .footer-socket-wrapper .copyright */
.cm-footer-bar__2 .copyright,
.cm-footer-bar .copyright,
.footer-socket-wrapper .copyright { display: none !important; }

/* «подвал полоски между пунктами» — #colophon .widget ul li */
.cm-footer .widget ul li,
.cm-footer-cols .widget ul li { border-bottom: 0 !important; }

/* «блог убираем тень» — #content .post */
.cm-content .post,
.cm-entry,
article.post { box-shadow: none !important; }

/* содержимое не должно уезжать под фиксированную шапку */

/* подвал: скрываем только строку копирайта, колонки со ссылками оставляем */
.cm-footer-cols,
.cm-footer-bar-area .cm-footer-cols { display: block !important; }

/* --- высота шапки: приводим к боевой --- */
.cm-header-1 { padding: 2px 0 !important; }
.cm-header-1 .cm-container { padding-top: 0 !important; padding-bottom: 0 !important; }
#cm-header-1 .cm-header-col-1 .custom-logo { max-height: 30px; width: auto; }

#cm-header-2 { padding: 0 !important; }
#cm-primary-nav ul li a {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    line-height: 1.3;
}
#cm-header-2 .cm-container { padding-top: 0 !important; padding-bottom: 0 !important; }
.cm-header-actions, .cm-header-actions a { padding-top: 6px !important; padding-bottom: 6px !important; }

/* компенсация под фиксированную шапку */

/* --- высота шапки: подогнана по замеру пикселей (боевой: 54 + 38 = 92) --- */
.cm-header-1 {
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center;
}
.cm-header-1 > .cm-container { width: 100%; padding-top: 0 !important; padding-bottom: 0 !important; }
.cm-header-1 .cm-row { align-items: center; margin: 0 !important; }

#cm-header-2 {
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
}
#cm-header-2 > .cm-container { padding-top: 0 !important; padding-bottom: 0 !important; }
#cm-primary-nav > ul > li > a,
#cm-primary-nav ul li a {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 42px !important;
}
#cm-primary-nav ul li ul li a { line-height: 1.6 !important; padding: 6px 14px !important; }

body { padding-top: 92px !important; }
body.admin-bar { padding-top: 124px !important; }

/* полоса навигации: высоту держат вложенные элементы, задаём и им */
#cm-primary-nav,
#cm-primary-nav > ul,
#cm-primary-nav > ul > li {
    height: 42px !important;
    min-height: 42px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
#cm-primary-nav > ul > li { display: inline-block; vertical-align: top; }
#cm-header-2 .cm-row,
#cm-header-2 .cm-header-col-1,
#cm-header-2 .cm-header-col-2 { min-height: 42px !important; height: 42px !important; align-items: center; }
.cm-header-actions,
.cm-header-actions > * { height: 38px !important; line-height: 42px !important; padding-top: 0 !important; padding-bottom: 0 !important; }

/* --- запись блога: миниатюра ---
 * На боевом обёртка миниатюры имеет класс my-class-for-image, и правило
 * из Customizer ужимает картинку до 315x216. colormag 4.2.1 даёт другой
 * класс — cm-featured-image, и картинка растягивалась во всю ширину.
 */
.cm-featured-image { text-align: center; }
.cm-featured-image img,
.featured-image img,
.my-class-for-image img {
    width: 315px !important;
    height: 216px !important;
    object-fit: cover;
    max-width: 100%;
}

/* заголовок записи и страницы — как задаёт тема на боевом */
.type-post .cm-entry-title,
.type-page .cm-entry-title,
h1.cm-entry-title {
    font-size: 42px;
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    line-height: 1.2;
}

/* --- запись блога: заголовок, рубрика --- */
body .cm-entry-title,
body h1.cm-entry-title,
body .type-post .cm-entry-title {
    font-size: 42px !important;
    font-family: "Roboto", sans-serif !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
}

/* «цвет плашки рубрики» — было #content .post .article-content .above-entry-meta .cat-links a */
.cm-entry-meta .cat-links a,
.cm-post-categories a,
.cm-entry-header .cat-links a,
.cm-categories a { background-color: #ff0000 !important; }

/* новая тема переводит служебные подписи в верхний регистр — на боевом их нет */
.cm-entry-meta,
.cm-entry-meta a,
.cm-post-categories,
.cm-post-categories a,
.cm-categories a,
.cm-entry-title { text-transform: none !important; }

/* заголовки таблиц: на боевом обычный регистр */
table th, .tablepress thead th { text-transform: none !important; }

/* --- меню, заменившие виджет Elementor Pro ---
 * Виджет ядра выводит обычный вертикальный список с маркерами.
 * Pro-виджет давал горизонтальную строку — воспроизводим.
 */
.elementor-widget-wp-widget-nav_menu ul.menu {
    display: flex;
    flex-wrap: wrap;
    gap: 26px;
    list-style: none !important;
    margin: 0;
    padding: 0;
    justify-content: flex-start;
    align-items: center;
}
.elementor-widget-wp-widget-nav_menu ul.menu li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border: 0 !important;
}
.elementor-widget-wp-widget-nav_menu ul.menu li::marker { content: none; }
.elementor-widget-wp-widget-nav_menu ul.menu li::before { display: none !important; }
.elementor-widget-wp-widget-nav_menu ul.menu li a { display: inline-block; padding: 0; }
.elementor-widget-wp-widget-nav_menu .widget-title,
.elementor-widget-wp-widget-nav_menu .widgettitle { display: none; }

/* вложенные подменю не разворачиваем в строку */
.elementor-widget-wp-widget-nav_menu ul.menu ul { display: none; }

/* --- подвал следует за содержимым, а не прижат к низу окна ---
 * colormag 4.2.1 делает #page флекс-колонкой с min-height в высоту экрана.
 * На коротких страницах это оставляло до 400px пустоты перед подвалом,
 * тогда как на боевом подвал идёт сразу за содержимым.
 * Замер: #page min-height 1080px, display flex.
 */
#page { min-height: 0 !important; }

/* --- подсветка пунктов меню как на боевом ---
 * Боевой: фон пункта при наведении и у текущего = цвет полосы (#32404d),
 * меняется только цвет текста на белый. Подменю подсвечивается синим #289dcc.
 * Новая тема рисует серую плашку и серую нижнюю границу — убираем.
 */
#cm-primary-nav ul > li > a,
.cm-primary-nav ul > li > a {
    border-bottom-color: transparent !important;
}
#cm-primary-nav ul > li:hover > a,
#cm-primary-nav ul > li.focus > a {
    background-color: #32404d !important;
    color: #ffffff !important;
    border-bottom-color: transparent !important;
}

/* выпадающее подменю: синяя подсветка, как на боевом */
#cm-primary-nav ul li ul li a:hover,
#cm-primary-nav ul li ul li:hover > a,
#cm-primary-nav ul li.current-menu-item ul li a:hover {
    color: #ffffff !important;
    background-color: #289dcc !important;
}

/* плашку рисует не ссылка, а сам пункт или его псевдоэлемент */
/* подсветку ТЕКУЩЕГО пункта тема рисует так же, как боевой, — не трогаем.
   Гасим только подсветку при наведении: на боевом она сливается с полосой. */
#cm-primary-nav ul > li:hover { background: transparent !important; }

#cm-primary-nav ul > li::before,
#cm-primary-nav ul > li::after,
#cm-primary-nav ul > li > a::before,
#cm-primary-nav ul > li > a::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* --- блок комментариев скрыт, как на боевом ---
 * В Customizer есть правило #comments { display: none } с пометкой
 * «скрыть комментарии», но новая тема его перебивает. Дублируем с
 * приоритетом. Сами комментарии закрыты 2026-08-07 по решению владельца.
 */
#comments,
.comments-area { display: none !important; }

/* --- наведение на меню: приводим к боевому ---
 * colormag 4.2.1 при наведении красит пункт синим (--cm-color-1, #207daf)
 * и подчёркивает серым. На боевом фон сливается с полосой, меняется
 * только цвет текста. Подменю на боевом подсвечивается синим #289dcc,
 * новая тема красит серым #777.
 */

/* верхний уровень: никакой плашки и подчёркивания */
#cm-primary-nav ul > li:hover,
#cm-primary-nav ul > li:focus-within,
.cm-layout-2 .cm-primary-nav ul > li:hover { background-color: transparent !important; }

/* на боевом подсветка серая #777 — и при наведении, и у текущего пункта */
#cm-primary-nav ul > li:hover > a,
#cm-primary-nav ul > li.focus > a,
#cm-primary-nav ul > li.current-menu-item > a,
#cm-primary-nav ul > li.current_page_item > a,
#cm-primary-nav ul > li.current-menu-ancestor > a,
#cm-primary-nav ul > li.current_page_ancestor > a,
.cm-layout-2 .cm-primary-nav ul > li:hover > a {
    background-color: #777777 !important;
    color: #ffffff !important;
    border-bottom-color: transparent !important;
}

/* выпадающее подменю: фон как на боевом */
#cm-primary-nav .sub-menu,
#cm-primary-nav .children,
.cm-header-builder .cm-primary-nav .sub-menu,
.cm-header-builder .cm-primary-nav .children { background-color: #32404d !important; }

/* пункты подменю при наведении: синий, а не серый */
#cm-primary-nav ul li ul li:hover,
#cm-primary-nav ul li ul li:hover > a,
#cm-primary-nav ul li ul li a:hover,
.cm-primary-nav ul li ul li:hover,
.cm-layout-2 .cm-primary-nav ul ul.sub-menu li:hover {
    background-color: #289dcc !important;
    color: #ffffff !important;
    border-color: #289dcc !important;
}

/* --- пункт меню по высоте полосы ---
 * Замер: li был 62px (42 + padding 10px сверху и снизу) при полосе 50px,
 * поэтому плашка при наведении торчала выше и ниже полосы.
 * Высоту несёт ссылка, у пункта отступы обнуляем.
 */
#cm-primary-nav ul > li {
    padding: 0 !important;
    height: 42px !important;
    min-height: 42px !important;
    display: inline-block;
    vertical-align: top;
}
#cm-primary-nav ul > li > a {
    display: block !important;
    height: 42px !important;
    line-height: 42px !important;
    padding: 0 14px !important;
    box-sizing: border-box;
}

/* --- иконка поиска по высоте полосы ---
 * Замер: иконка 48px (padding 8px сверху и снизу) при полосе 50px,
 * начиналась на 10px ниже верха полосы и вылезала снизу.
 * На боевом иконка лежит на полосе без плашки.
 */
#cm-header-2 .cm-header-actions,
#cm-header-2 .cm-top-search {
    height: 42px !important;
    line-height: 42px !important;
    padding: 0 !important;
    background: transparent !important;
    display: flex;
    align-items: center;
}
#cm-header-2 .cm-top-search > a,
#cm-header-2 .cm-top-search > button,
#cm-header-2 .cm-top-search svg,
#cm-header-2 .cm-top-search i {
    height: 42px !important;
    line-height: 42px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
    border: 0 !important;
    vertical-align: middle;
}
#cm-header-2 .cm-top-search svg { height: 18px !important; }

/* --- лупа при наведении синеет, как на боевом ---
 * Боевой: #masthead ... .fa.search-top:hover { color: #06c }
 * Фона при этом нет — только смена цвета. Новая тема красила серым
 * и рисовала плашку; плашку убрали, теперь возвращаем цвет и переход.
 */
#cm-header-2 .cm-top-search a,
#cm-header-2 .cm-top-search svg,
#cm-header-2 .cm-top-search i,
#cm-header-2 .cm-top-search .search-icon {
    transition: color .2s ease, fill .2s ease;
}
#cm-header-2 .cm-top-search:hover a,
#cm-header-2 .cm-top-search:hover i,
#cm-header-2 .cm-top-search:hover .search-icon,
#cm-header-2 .cm-top-search a:hover,
#cm-header-2 .cm-top-search a:hover svg,
#cm-header-2 .cm-top-search:hover svg {
    color: #0066cc !important;
    fill: #0066cc !important;
}
#cm-header-2 .cm-top-search:hover svg path,
#cm-header-2 .cm-top-search a:hover svg path { fill: #0066cc !important; }

/* лупа — шрифтовая иконка .fa.search-top, как и на боевом */
#cm-header-2 .fa.search-top,
#cm-header-2 .search-top {
    transition: color .2s ease;
    cursor: pointer;
}
#cm-header-2 .fa.search-top:hover,
#cm-header-2 .search-top:hover,
#cm-header-2 a:hover > .fa.search-top,
#cm-header-2 .cm-top-search:hover .fa.search-top {
    color: #0066cc !important;
    background: transparent !important;
}


/* ==================================================================
 * Оформление виджетов «меню раздела», потерянное вместе с Elementor Pro.
 *
 * При отказе от Pro виджет `nav-menu` заменён на `wp-widget-nav_menu`
 * из ядра. Идентификаторы элементов уцелели, а настройки Pro — цвет
 * пунктов, шрифт, выравнивание — пропали: подменю разделов стало
 * синими ссылками темы вместо серых Roboto 14.
 *
 * Восстановлено из мета `_ruli24_pro_backup` скриптом
 * site/gen-navmenu-css.php. Правки вручную не вносить — перегенерировать.
 *
 * Переносится не всё:
 *  - значения, у которых в `__globals__` стоит ссылка на глобальный цвет,
 *    на боевом не применяются вовсе (глобал не задан, а ссылка перебивает
 *    локальное значение) — такие пропускаем, иначе копия станет «красивее»
 *    боевого. Так отсеялись фон #E4E4E4 и цвет наведения #313131;
 *  - отступы виджета (margin: 85px 0 -40px -30px и подобные) — см. ниже.
 * ================================================================== */

/* ---- сгенерировано из _ruli24_pro_backup ---- */

/* ceny */
.elementor-4980 .elementor-element.elementor-element-77784b18 .menu a { color: #7A7A7A; font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-4980 .elementor-element.elementor-element-77784b18 .menu { text-align: center; }

/* blog */

/* blog */

/* avtomatizacia-predpiyatia */
.elementor-19921 .elementor-element.elementor-element-32d9261 .menu a { color: #7A7A7A; font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-19921 .elementor-element.elementor-element-32d9261 .menu { text-align: center; }

/* %d0%b1%d0%bb%d0%b0%d0%b1%d0%bb%d0%b0 */

/* %d0%b1%d0%bb%d0%b0%d0%b1%d0%bb%d0%b0 */

/* %d0%bf%d1%80%d0%be%d1%84%d0%b8_0225 */
.elementor-20927 .elementor-element.elementor-element-5e8fbc4f .menu a { color: #7A7A7A; font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }

/* avtomatizaciy-deyatelnosti */
.elementor-20930 .elementor-element.elementor-element-fe7c2bb .menu a { color: #7A7A7A; font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-20930 .elementor-element.elementor-element-fe7c2bb .menu { text-align: center; }

/* %d1%81%d0%b8%d1%81%d1%82%d0%b5%d0%bc%d0%b0_210226 */
.elementor-20995 .elementor-element.elementor-element-3e1737b .menu a { font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-20995 .elementor-element.elementor-element-3e1737b .menu { text-align: center; }

/* %d0%be%d1%82%d1%80%d0%b0%d1%81%d0%bb%d0%b8_210226 */
.elementor-21001 .elementor-element.elementor-element-14c248f6 .menu a { font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-21001 .elementor-element.elementor-element-14c248f6 .menu { text-align: center; }

/* %d0%bf%d1%80%d0%be%d1%84%d0%b8_210226 */
.elementor-21004 .elementor-element.elementor-element-5d978eff .menu a { color: #7A7A7A; font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }

/* sistema */
.elementor-21007 .elementor-element.elementor-element-5b60021 .menu a { color: #7A7A7A; font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-21007 .elementor-element.elementor-element-5b60021 .menu { text-align: center; }

/* %d1%81%d0%b8%d1%81%d1%82%d0%b5%d0%bc%d0%b020210304 */
.elementor-21554 .elementor-element.elementor-element-57bbe232 .menu a { font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-21554 .elementor-element.elementor-element-57bbe232 .menu { text-align: center; }

/* %d0%be%d1%82%d1%80%d0%b0%d1%81%d0%bb%d0%b820210304 */
.elementor-21557 .elementor-element.elementor-element-288c9414 .menu a { font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-21557 .elementor-element.elementor-element-288c9414 .menu { text-align: center; }

/* %d0%bf%d1%80%d0%be%d1%84%d0%b820210304 */
.elementor-21566 .elementor-element.elementor-element-6284ec2a .menu a { color: #7A7A7A; font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }

/* %d0%ba%d0%be%d1%80%d0%be%d0%b1%d0%ba%d0%b020210304 */
.elementor-21572 .elementor-element.elementor-element-bdafff2 .menu a { font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-21572 .elementor-element.elementor-element-bdafff2 .menu { text-align: center; }

/* %d1%86%d0%b5%d0%bd%d1%8b20210304 */
.elementor-21575 .elementor-element.elementor-element-58fc9c48 .menu a { font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-21575 .elementor-element.elementor-element-58fc9c48 .menu { text-align: center; }

/* %d0%b1%d0%bb%d0%be%d0%b3 */

/* %d0%b1%d0%bb%d0%be%d0%b3 */

/* korobka */
.elementor-22239 .elementor-element.elementor-element-87282ee .menu a { color: #7A7A7A; font-family: "Roboto", sans-serif; font-size: 14px; font-weight: 400; }
.elementor-22239 .elementor-element.elementor-element-87282ee .menu { text-align: center; }

/*
 * Прилегание якорного подменю к шапке (замечание владельца 2026-08-08).
 *
 * На боевом у `.elementor` этих страниц стоит `margin-top: -140px` (в паре
 * с margin-top: 85px у виджета) — весь контент Elementor подтянут вверх под
 * фиксированную шапку, и ряд якорей «Настройки/Процессы/…» сидит вплотную
 * под меню. На копии эта пара НЕ перенесена, поэтому ряд висел на ~55px ниже
 * с большим белым провалом над ним.
 *
 * Прежний вывод в этом файле («без правок строка стоит там же») ОШИБОЧЕН —
 * замер 2026-08-09 показал провал 60px: `.cm-content` padding-top 48px +
 * `.cm-entry-summary` margin-top 12px, которые на боевом гасит тот самый
 * -140px. Прямой перенос -140px промахивался: шапка colormag 4.2.1 — 94px,
 * а не 140px, поэтому -140 утаскивало ряд ПОД шапку.
 *
 * Лечим по образцу боевого, но на выверенную под новую тему величину:
 * подтягиваем контент Elementor вверх на 55px. Значение подобрано по снимкам
 * (боевой vs копия): ряд якорей и секция под ним совмещаются с боевым.
 * Трогаем только якорные страницы — по id их Elementor-контейнера, чтобы не
 * задеть общий вертикальный сдвиг, выверенный для остальных страниц.
 */
/* Планшет и десктоп: после нормализации шапка имеет высоту 94px уже с 768px.
 * На телефоне остаётся отдельная шапка 124px и своя компенсация ниже. */
@media (min-width: 768px) {
    .elementor-21007 { margin-top: -55px; }   /* sistema */
    .elementor-19921 { margin-top: -55px; }   /* otrasli — /avtomatizacia-predpiyatia/ */
    .elementor-22239 { margin-top: -55px; }   /* korobka */
    .elementor-4980  { margin-top: -55px; }   /* ceny */
}

/* Якорное подменю скрыто на телефоне — как на боевом.
 * На боевом у Pro-виджета nav-menu стоит класс `elementor-hidden-phone`
 * (проверено: sistema, ceny, avtomatizacia, korobka). При конвертации
 * в виджет ядра `wp-widget-nav_menu` этот класс потерялся, и на копии
 * меню показывалось на телефоне. Возвращаем скрытие тем же брейкпоинтом
 * Elementor (≤767px). Селектор ограничен контентом каждой якорной
 * страницы — в шапке/подвале меню не трогаем (там своё nav-menu). */
@media (max-width: 767px) {
    .elementor-21007 .elementor-widget-wp-widget-nav_menu,
    .elementor-4980  .elementor-widget-wp-widget-nav_menu,
    .elementor-19921 .elementor-widget-wp-widget-nav_menu,
    .elementor-22239 .elementor-widget-wp-widget-nav_menu {
        display: none !important;
    }
}

/*
 * /ceny/, /sistema/ и /korobka/: закрепляем меню разделов сразу под фиксированной
 * шапкой. `overflow: hidden` у body превращал его в контейнер прокрутки
 * и не давал `position: sticky` работать, поэтому на этих трёх страницах
 * по горизонтали используем `clip`, а вертикальный overflow освобождаем.
 *
 * Высота шапки — 94px, меню — 40.8px; 145px у якорей оставляет ещё
 * небольшой зазор и не даёт заголовку раздела уйти под обе полосы.
 */
@media (min-width: 768px) {
    body.page-id-4980,
    body.page-id-21007,
    body.page-id-22239 {
        overflow-x: clip !important;
        overflow-y: visible !important;
    }

    .elementor-4980 > .elementor-element.elementor-element-50f4d445,
    .elementor-21007 > .elementor-element.elementor-element-07dbd4b,
    .elementor-22239 > .elementor-element.elementor-element-1fec341 {
        position: sticky !important;
        top: 94px !important;
        left: auto !important;
        width: 100vw !important;
        max-width: none !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
        z-index: 998 !important;
        background: #ffffff !important;
    }

    .elementor-22239 > .elementor-element.elementor-element-1fec341 {
        border-bottom: 1px solid #e1e5e8;
        box-shadow: 0 3px 8px rgba(50, 64, 77, 0.12);
    }

    .elementor-22239 > .elementor-element.elementor-element-1fec341 > .elementor-container {
        width: 100%;
        max-width: none;
    }

    .elementor-22239 .elementor-element.elementor-element-1fec341 .elementor-widget-container {
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .elementor-22239 .elementor-element.elementor-element-1fec341 ul.menu {
        width: max-content;
        min-width: 100%;
        flex-wrap: nowrap;
        justify-content: center;
    }

    .elementor-22239 .elementor-element.elementor-element-87282ee .menu a {
        color: #32404d;
        font-weight: 500;
        white-space: nowrap;
    }

    /* -20px у баннера и прежние 10px у карточек давали перекрытие 10px. */
    .elementor-22239 > .elementor-element.elementor-element-fa29422 {
        margin-top: 30px !important;
    }

    .elementor-4980 .elementor-menu-anchor,
    .elementor-21007 .elementor-menu-anchor {
        scroll-margin-top: 145px;
    }
}

/*
 * /ceny/: центрируем фоновый баннер с ноутбуком в десктопной секции.
 * В данных Elementor он задан как `center right`, поэтому при
 * `background-size: contain` изображение прижималось к правому краю
 * растянутой на весь экран секции. Селектор повторяет оба варианта,
 * которые генерирует Elementor: фон самой секции и motion-effects layer.
 */
.elementor-4980 .elementor-element.elementor-element-783d85ad:not(.elementor-motion-effects-element-type-background),
.elementor-4980 .elementor-element.elementor-element-783d85ad
  > .elementor-motion-effects-container
  > .elementor-motion-effects-layer {
    background-position: center center;
}


/* ==================================================================
 * Размер текста внутри блоков Elementor.
 *
 * colormag 4.2.1 задаёт `.cm-entry-summary p { font-size: 1.4rem }` —
 * селектор бьёт прямо по абзацу и перебивает размер, который Elementor
 * задаёт на самом виджете (там он наследуется). На боевом такого правила
 * нет, и размер из Elementor доходит до текста.
 *
 * Видно было на /ceny/: 18px из Elementor превращались в 14px, абзацы
 * укладывались в меньшее число строк, секция становилась на 70px ниже —
 * а вместе с ней ужимался фон `background-size: contain` и картинка
 * с ноутбуком уезжала правее на 170px.
 *
 * `inherit` возвращает наследование от виджета: где Elementor размер
 * задал — он и применится, где нет — сработает шрифт страницы.
 * Отступ абзаца — 15px, как `p { margin-bottom: 15px }` в colormag 2.0.3.
 * ================================================================== */

.cm-entry-summary .elementor p {
    font-size: inherit;
    margin-bottom: 15px;
}


/* ==================================================================
 * Глобальные цвета Elementor — НЕ гасить. Проверено 2026-08-07.
 *
 * Была попытка погасить их через `initial`: на копии голубели заголовки,
 * и я решил, что боевой файл набора не подключает вовсе. Это неверно.
 *
 * На боевом системные глобальные цвета работают: вкладки на главной
 * («Подсистема Настройка» и далее) там #6EC1E4 шрифтом Roboto 600.
 * После гашения они стали серыми Open Sans — это была моя поломка.
 *
 * Голубые заголовки берутся из другого: на боевом у таких заголовков
 * в правиле стоит ссылка на пользовательский цвет, которого в наборе
 * нет (`var(--e-global-color-816a4e7)`). Объявление становится
 * недействительным, и цвет наследуется — получается тёмный. Elementor 4
 * при пересборке такие ссылки просто выбрасывает, правило остаётся без
 * цвета, и до заголовка добирается умолчание виджета — голубое.
 *
 * Лечится это точечно, для конкретных элементов, а не гашением набора.
 * ================================================================== */


/* ==================================================================
 * Межстрочный интервал в списках.
 *
 * colormag 2.0.3 задаёт `.entry-content li { line-height: 1.3 }`,
 * colormag 4.2.1 — только общее `li { line-height: 1.8 }`. На копии
 * списки разъезжались: при том же кегле 18px шаг строк был 32px вместо
 * боевых 23px, из-за чего страницы вроде /sistema-upravleniia/
 * вытягивались вниз.
 *
 * Обёртка содержимого в новой теме называется `.cm-entry-summary`
 * (в 2.0.3 было `.entry-content`) — селектор переписан под неё.
 * ================================================================== */

.cm-entry-summary li { line-height: 1.3; }

/*
 * В двух верхних баннерах Elementor задан увеличенный шаг строк, но
 * общее правило выше его перебивало. Возвращаем интервал, близкий к
 * главной странице, только этим двум спискам.
 */
.elementor-21007 .elementor-element-a9f527f li,
.elementor-19921 .elementor-element-3c88c269 li {
    line-height: 1.9;
}

/* маркеры списков: в 2.0.3 `.entry-content ul { list-style: square }` */
.cm-entry-summary ul { list-style: square; }


/* ==================================================================
 * Ширина колонок в секциях Elementor.
 *
 * Elementor 3.0 держал внутри `.elementor-container` ещё одну обёртку
 * `.elementor-row`. При обычном зазоре колонок она была на 20px шире
 * контейнера и сдвинута на -10px — ровно настолько, насколько колонки
 * потом добирали внутренним отступом 10px. Итог: содержимое колонок
 * вставало вровень с краями контейнера 1140px.
 *
 * Elementor 4 обёртку убрал, колонки лежат в контейнере напрямую,
 * компенсации нет. Замер DOM на /sistema-upravleniia/:
 *   боевой:  ряд 1160px, колонка 696px, заголовок 661px
 *   копия:   ряд отсутствует, колонка 684px, заголовок 649px
 * Содержимое колонок оказывалось на 10px правее и на 20px уже — из-за
 * этого, например, заголовок «Система управления предприятием это»
 * переставал помещаться в строку и переносился.
 *
 * Возвращаем компенсацию самому контейнеру. Только для обычного зазора
 * (`column-gap-default`): для остальных значений отступы другие,
 * и переносить их вслепую нельзя.
 * ================================================================== */

/*
 * Случая два, и лечатся они по-разному.
 *
 * Секция во всю ширину: контейнер шире родителя быть не обязан, он сам
 * центрируется автополями — достаточно поднять предел ширины.
 *
 * Обычная секция: она сама шириной с колонку содержимого (1140px),
 * поэтому контейнер приходится расширять и вытягивать отрицательными
 * полями. Задавать эти поля растянутой секции нельзя — они перебивают
 * `margin: auto` и содержимое уезжает к левому краю (проверено
 * 2026-08-07 на /korobka/: заголовок оказался на x=30 вместо 392).
 */

/* секция во всю ширину: контейнер центрируется автополями сам */
.elementor-section.elementor-section-stretched.elementor-section-boxed
  > .elementor-container.elementor-column-gap-default {
    max-width: 1160px;
}

/*
 * Верхняя секция обычной ширины: она сама шириной с колонку содержимого,
 * поэтому контейнер расширяем и вытягиваем отрицательными полями.
 */
.elementor-top-section.elementor-section-boxed:not(.elementor-section-stretched)
  > .elementor-container.elementor-column-gap-default {
    width: calc(100% + 20px);
    max-width: calc(100% + 20px);
    margin-left: -10px;
    margin-right: -10px;
}

/*
 * Вложенная секция: её родитель бывает шире 1140px, и тогда предел ширины
 * обязателен. Первая версия правила задавала здесь `max-width: calc(100% + 20px)`
 * и снимала ограничение вовсе — блок «Рули — от малого бизнеса к крупному
 * предприятию» на главной расползался на все 1845px вместо 1140.
 * Отрицательные поля тут не годятся: контейнер должен центрироваться.
 */
.elementor-inner-section.elementor-section-boxed
  > .elementor-container.elementor-column-gap-default {
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 1024px) {
    .elementor-section.elementor-section-stretched.elementor-section-boxed
      > .elementor-container.elementor-column-gap-default,
    .elementor-inner-section.elementor-section-boxed
      > .elementor-container.elementor-column-gap-default { max-width: 1044px; }
}

/*
 * Мобильный (≤767px): десктопная компенсация ширины колонок здесь ВРЕДНА.
 * Прежнее правило задавало `max-width: 787px` — это больше телефона,
 * поэтому не ограничивало ширину; обычная секция с `width: calc(100%+20px)`
 * и отрицательными полями вообще не переопределялась, и контейнеры
 * оставались ~572px, а контент вылезал за экран (замер 2026-08-09 на
 * главной: bodyScroll 578 при вьюпорте 375). Сбрасываем все три типа
 * контейнеров в полную ширину без отрицательных полей — тогда работает
 * штатное сжатие/стекирование колонок Elementor на мобильном.
 */
@media (max-width: 767px) {
    .elementor-section.elementor-section-stretched.elementor-section-boxed
      > .elementor-container.elementor-column-gap-default,
    .elementor-top-section.elementor-section-boxed:not(.elementor-section-stretched)
      > .elementor-container.elementor-column-gap-default,
    .elementor-inner-section.elementor-section-boxed
      > .elementor-container.elementor-column-gap-default {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    /* Перенос длинных неразрывных строк на телефоне. Без этого буллеты
     * вроде «Рули24=ERP+MES+WMS+SCM+CPM+EPM+CRM+BPM+PM+CM» (нет пробелов,
     * браузер не переносит) распирали контент до 572px и всю страницу
     * выносило за экран (замер 2026-08-09: bodyScroll 588→391 при вьюпорте
     * 375). Действует только когда слово реально не влезает. */
    .cm-entry-summary {
        overflow-wrap: break-word;
        word-break: break-word;
    }

    /* картинки не шире экрана (защита от жёсткой ширины в разметке) */
    .cm-entry-summary img {
        max-width: 100%;
        height: auto;
    }

    /* Поле страницы на телефоне под боевой: colormag 4.2.1 даёт
     * `.cm-container` 16px, из-за чего колонка текста на ~8px с каждой
     * стороны уже боевого (~26px против ~18px эффективных), текст
     * переносится раньше и вся страница едет вниз. 8px совмещает ширину
     * текста с боевым (замер 2026-08-09: абзац 301→~340px). */
    .cm-container {
        padding-left: 8px;
        padding-right: 8px;
    }
}


/* ==================================================================
 * Маркеры списков на страницах, где Elementor Pro нёс свой CSS.
 *
 * У темы маркеры квадратные, а этот блок делал их круглыми красными.
 * Лежал он в custom_css виджетов — и не только меню, но и текстовых
 * блоков, поэтому первый проход его на большинстве страниц не нашёл.
 * Правило было написано без привязки и действовало на всю страницу,
 * здесь привязано к ней явно.
 *
 * Идёт последним: у него та же специфичность, что у общего правила
 * темы выше, и побеждает оно только порядком следования.
 * ================================================================== */

/* ceny */
.elementor-4980 ul { list-style: disc; }
.elementor-4980 ::marker { color: #FF0000; }
.elementor-4980 .seri::marker { color: #9B9B9B; }
/* avtomatizacia-predpiyatia */
.elementor-19921 ul { list-style: disc; }
.elementor-19921 ::marker { color: #FF0000; }
.elementor-19921 .seri::marker { color: #9B9B9B; }
/* %d0%bf%d1%80%d0%be%d1%84%d0%b8_0225 */
.elementor-20927 ul { list-style: disc; }
.elementor-20927 ::marker { color: #FF0000; }
.elementor-20927 .seri::marker { color: #9B9B9B; }
/* avtomatizaciy-deyatelnosti */
.elementor-20930 ul { list-style: disc; }
.elementor-20930 ::marker { color: #FF0000; }
.elementor-20930 .seri::marker { color: #9B9B9B; }
/* %d1%81%d0%b8%d1%81%d1%82%d0%b5%d0%bc%d0%b0_210226 */
.elementor-20995 ul { list-style: disc; }
.elementor-20995 ::marker { color: #FF0000; }
.elementor-20995 .seri::marker { color: #9B9B9B; }
/* %d0%be%d1%82%d1%80%d0%b0%d1%81%d0%bb%d0%b8_210226 */
.elementor-21001 ul { list-style: disc; }
.elementor-21001 ::marker { color: #FF0000; }
.elementor-21001 .seri::marker { color: #9B9B9B; }
/* %d0%bf%d1%80%d0%be%d1%84%d0%b8_210226 */
.elementor-21004 ul { list-style: disc; }
.elementor-21004 ::marker { color: #FF0000; }
.elementor-21004 .seri::marker { color: #9B9B9B; }
/* sistema */
.elementor-21007 ul { list-style: disc; }
.elementor-21007 ::marker { color: #FF0000; }
.elementor-21007 .seri::marker { color: #9B9B9B; }
/* %d1%81%d0%b8%d1%81%d1%82%d0%b5%d0%bc%d0%b020210304 */
.elementor-21554 ul { list-style: disc; }
.elementor-21554 ::marker { color: #FF0000; }
.elementor-21554 .seri::marker { color: #9B9B9B; }
/* %d0%be%d1%82%d1%80%d0%b0%d1%81%d0%bb%d0%b820210304 */
.elementor-21557 ul { list-style: disc; }
.elementor-21557 ::marker { color: #FF0000; }
.elementor-21557 .seri::marker { color: #9B9B9B; }
/* %d0%bf%d1%80%d0%be%d1%84%d0%b820210304 */
.elementor-21566 ul { list-style: disc; }
.elementor-21566 ::marker { color: #FF0000; }
.elementor-21566 .seri::marker { color: #9B9B9B; }
/* %d0%ba%d0%be%d1%80%d0%be%d0%b1%d0%ba%d0%b020210304 */
.elementor-21572 ul { list-style: disc; }
.elementor-21572 ::marker { color: #FF0000; }
.elementor-21572 .seri::marker { color: #9B9B9B; }
/* %d1%86%d0%b5%d0%bd%d1%8b20210304 */
.elementor-21575 ul { list-style: disc; }
.elementor-21575 ::marker { color: #FF0000; }
.elementor-21575 .seri::marker { color: #9B9B9B; }
/* korobka */
.elementor-22239 ul { list-style: disc; }
.elementor-22239 ::marker { color: #FF0000; }
.elementor-22239 .seri::marker { color: #9B9B9B; }


/* ==================================================================
 * Таблицы в содержимом.
 *
 * colormag 2.0.3:
 *     table { border-collapse: collapse; }
 *     th, td { border: 1px solid #eaeaea; padding: 6px 10px; }
 *     th { font-weight: bold; }
 *
 * colormag 4.2.1 переписала это под свой вид: `border-collapse: separate`,
 * шапка с заливкой #F4F8FB и заглавными буквами, а у ячеек остаётся одна
 * нижняя граница `1px solid #27272a` — сетка таблицы пропадает. Видно
 * на главной, в таблице модулей внутри вкладок: на боевом каждая ячейка
 * в рамке, на копии только горизонтальные линии.
 * ================================================================== */

.cm-entry-summary table {
    border-collapse: collapse;
    border-spacing: 0;
}

.cm-entry-summary table th,
.cm-entry-summary table td {
    border: 1px solid #eaeaea;
    padding: 6px 10px;
}

.cm-entry-summary table thead { background-color: transparent; }

.cm-entry-summary table th {
    font-weight: bold;
    text-transform: none;
}

/* ------------------------------------------------------------------
 * Межстрочный интервал страницы. На боевом 1.6, в colormag 4.2.1 — 1.8.
 * Заметно везде, где текст не внутри виджета Elementor со своим
 * интервалом: в таблицах строки становятся выше на 3px каждая.
 * ------------------------------------------------------------------ */

body { line-height: 1.6; }


/*
 * «Прилигание к верху» — НЕ переносится. Проверено дважды.
 *
 * На боевом в custom_css виджета лежит `.elementor { margin-top: -140px }`
 * — ровно на столько же `#main` отодвигает содержимое от шапки, то есть
 * на этих страницах отступ гасится полностью.
 *
 * Попытка 1 (база 92px): -140px утаскивал подменю под шапку, оно пропадало.
 * Попытка 2 (база сведена к 140px): подменю на месте, но по цифрам стало
 * хуже везде — /ceny/ 0.166 → 0.174, /sistema/ 0.189 → 0.207,
 * /korobka/ 0.141 → 0.176, контрольная /doc/ без изменений.
 *
 * Значит на боевом эти -140px чем-то компенсируются, и переносить их
 * в отрыве от компенсации нельзя. Что именно компенсирует — не выяснено.
 */


/* ==================================================================
 * Записи блога и новостей.
 *
 * Замер DOM на /izmeneniya-v-module-rabota-s-klientam/:
 *   боевой:  абзац 16px / 25.6px, отступ снизу 15px,
 *            `.article-content { padding: 15px }` → текст с x=397.5, ширина 1110
 *   копия:   абзац 14px / 22.4px, отступ снизу 21px,
 *            `.cm-post-content { padding: 20px }` → текст с x=410, ширина 1100
 *
 * Мельче текст — это опять `.cm-entry-summary p { font-size: 1.4rem }`
 * из colormag 4.2.1. Раньше я снял его только внутри блоков Elementor
 * (`.cm-entry-summary .elementor p`), а записи блога через Elementor
 * не идут — там правило темы так и работало. Записи занимают верх
 * списка худших страниц именно из-за этого.
 * ================================================================== */

.cm-entry-summary p {
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 15px;
}

/* внутренний отступ карточки записи — на боевом 15px */
.cm-post-content { padding: 15px; }


/* ==================================================================
 * Отступ под картинками в содержимом.
 *
 * Замер DOM на /partners/: на боевом у картинки `margin-bottom: 18px`
 * (figure высотой 72 при картинке 54), на копии margin нулевой и figure
 * ровно по картинке. Из-за этого ряды логотипов на копии стояли плотнее
 * боевых на 18px каждый.
 *
 * На страницах, где Elementor Pro нёс свой CSS, этот отступ обнулялся
 * строкой `img { margin-bottom: 0px }` — те же 14 страниц, что и с
 * красными маркерами списков. Ниже возвращаем и общее правило,
 * и это исключение.
 * ================================================================== */

.cm-entry-summary img { margin-bottom: 18px; }

.elementor-4980 img,  .elementor-19921 img, .elementor-20927 img,
.elementor-20930 img, .elementor-20995 img, .elementor-21001 img,
.elementor-21004 img, .elementor-21007 img, .elementor-21554 img,
.elementor-21557 img, .elementor-21566 img, .elementor-21572 img,
.elementor-21575 img, .elementor-22239 img { margin-bottom: 0; }


/* ==================================================================
 * Ссылки «предыдущая / следующая запись» под записью.
 *
 * colormag 2.0.3:
 *     .default-wp-page .previous { float: left;  padding: 30px 0; }
 *     .default-wp-page .next     { float: right; padding: 30px 0; }
 * Длинный заголовок соседней записи при этом не помещается рядом
 * и переносится на свою строку — так на боевом.
 *
 * colormag 4.2.1 сделала из этого флекс-строку с `flex: 1` у обеих
 * ссылок: они всегда стоят рядом, а длинный заголовок ломается пополам
 * в узкой колонке. Возвращаем плавающие блоки.
 * ================================================================== */

.cm-entry-summary ~ .default-wp-page,
.default-wp-page {
    display: block;
    gap: 0;
}

.default-wp-page .previous,
.default-wp-page .next {
    flex: none;
    padding: 30px 0;
}

.default-wp-page .previous { float: left; }
.default-wp-page .next     { float: right; text-align: left; }

/* плашка рубрики над заголовком записи: на боевом без отступа снизу */
.cm-entry-header-meta { margin-bottom: 0; }

/* заголовок записи: на боевом #333333, в новой теме #27272a */
.cm-entry-title,
.cm-entry-title a { color: #333333; }

/* заголовок записи: в 2.0.3 `.entry-title { padding: 5px 0 0 }` */
.cm-post-content .cm-entry-title { padding-top: 5px; }


/* ==================================================================
 * Фон страницы за пределами содержимого.
 *
 * На боевом это #EAEAEA (умолчание colormag 2.0.3), в colormag 4.2.1 —
 * белый. Заметно на коротких страницах, где подвал не достаёт до низа
 * экрана: у `/activity/` и её четырёх подстраниц серая полоса под
 * подвалом занимала треть кадра, и все пять давали одинаковые 0.210.
 *
 * Область содержимого свой белый фон задаёт сама (`.cm-content`),
 * так что видно это только снаружи — как на боевом.
 * ================================================================== */

body { background-color: #eaeaea; }

/*
 * Заголовок страницы: на боевом `padding-bottom: 18px` без внешнего
 * отступа, в colormag 4.2.1 — `margin-bottom: 12px` без внутреннего.
 * У записей отступ другой (`padding: 5px 0 0`, см. правило выше),
 * поэтому разделяем по классу body, который ставит WordPress.
 */
body.page .cm-entry-title {
    padding-bottom: 18px;
    margin-bottom: 0;
}


/* ==================================================================
 * Главная, первый экран: текст не должен заезжать на монитор.
 *
 * НАМЕРЕННОЕ отступление от боевого — по просьбе владельца.
 * На боевом та же беда: фон секции `fon-gl.jpg` (1920×500) прижат
 * к правому краю, монитор занимает правые ~40% картинки, а текстовая
 * колонка шириной 1100px наезжает на него примерно на 300px. Последняя
 * строка списка и хвост заголовка оказываются на тёмном экране монитора
 * и не читаются. На узких экранах становится хуже.
 *
 * Ограничиваем текст светлой частью картинки: 62% ширины контейнера.
 * При 67% список подходил к монитору вплотную, 62% даёт запас ~50px. Доля, а не пиксели, потому что фон масштабируется
 * вместе с секцией. Текст сохранён целиком, переносится по словам.
 *
 * Расхождение с боевым по этой странице от правки вырастет — так и надо.
 * ================================================================== */

.elementor-element-72decdd4 .elementor-widget-heading .elementor-widget-container,
.elementor-element-72decdd4 .elementor-widget-text-editor .elementor-widget-container {
    max-width: 62%;
}

@media (max-width: 1024px) {
    /* на планшете монитор занимает больше доли кадра */
    .elementor-element-72decdd4 .elementor-widget-heading .elementor-widget-container,
    .elementor-element-72decdd4 .elementor-widget-text-editor .elementor-widget-container {
        max-width: 60%;
    }
}

@media (max-width: 767px) {
    /* на телефоне фон уже не мешает — возвращаем полную ширину */
    .elementor-element-72decdd4 .elementor-widget-heading .elementor-widget-container,
    .elementor-element-72decdd4 .elementor-widget-text-editor .elementor-widget-container {
        max-width: none;
    }
}

/*
 * Первый экран главной, доводка по замечаниям владельца:
 *  - формула «Рули24=ERP+MES+…+CM» рвалась посреди слова («…+C» / «M»):
 *    это одна длинная лексема без пробелов, и при 62% ей не хватало
 *    места. Даём 66% и запрещаем разрыв внутри слова — до монитора
 *    по-прежнему остаётся запас;
 *  - строки списка стояли слишком плотно, разрежены до 1.9.
 */
.elementor-element-72decdd4 .elementor-widget-heading .elementor-widget-container,
.elementor-element-72decdd4 .elementor-widget-text-editor .elementor-widget-container {
    max-width: 66%;
}

.elementor-element-72decdd4 li {
    line-height: 1.9;
    overflow-wrap: normal;
    word-break: normal;
}


/* ==================================================================
 * Мобильная доводка после общего аудита (2026-08-10).
 *
 * Правила ниже идут последними намеренно: ранние mobile-правила шапки
 * перебивались поздними desktop-правилами с !important. Здесь собраны
 * только измеренные повторяющиеся дефекты новой темы/Elementor 4.
 * ================================================================== */

@media (max-width: 767px) {
    /* Поздние desktop-правила первого экрана главной не должны снова
     * сужать текст до 66% и запрещать перенос длинной ERP-формулы. */
    body.home .elementor-element-72decdd4 .elementor-widget-heading .elementor-widget-container,
    body.home .elementor-element-72decdd4 .elementor-widget-text-editor .elementor-widget-container {
        max-width: 100% !important;
    }

    body.home .elementor-element-72decdd4 li {
        overflow-wrap: anywhere;
        word-break: normal;
    }

    /* В новой теме строка шапки получила 24px padding и 10px gap, но сама
     * шапка осталась жёстко высотой 44px. В результате логотип уходил на
     * y=-21px. Компактно размещаем логотип и контакты в двух строках,
     * сохраняя прежнюю общую высоту masthead 124px. */
    .cm-header-1 {
        height: 74px !important;
        min-height: 74px !important;
        margin-bottom: 0 !important;
    }

    #cm-header-1 > .cm-container,
    #cm-header-1 .cm-row {
        height: 74px !important;
        min-height: 74px !important;
        box-sizing: border-box !important;
    }

    #cm-header-1 > .cm-container {
        width: 100% !important;
        max-width: 100% !important;
    }

    #cm-header-1 .cm-row {
        padding-top: 4px !important;
        padding-bottom: 4px !important;
        gap: 0 !important;
    }

    #cm-header-1 .cm-header-col-2 {
        width: 100%;
        min-width: 0;
    }

    #cm-header-1 .cm-header-col-2 .widget_custom_html,
    #cm-header-1 .cm-header-col-2 .textwidget.custom-html-widget {
        width: 100%;
        min-width: 0;
    }

    .cm-header-col-2 .tele {
        font-size: 18px !important;
        padding-top: 3px !important;
        padding-bottom: 3px !important;
    }

    /* На главной заголовок «Новости» начинался под fixed-шапкой. */
    body.home .ruli24-front-news { margin-top: 32px; }

    /* Elementor-контейнер главной был шире родителя на 8px. */
    body.home article#post-21016 {
        width: auto !important;
        max-width: 100% !important;
    }

    body.home .cm-posts {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    /* Плавающая кнопка звонка приходила почти в центр экрана и закрывала
     * текст. Оставляем её у правого края, как на десктопе. */
    a.callbackkiller.cbk-phone.envy-not-scalling {
        left: auto !important;
        right: 16px !important;
        bottom: 80px !important;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    /* На планшетной границе тема возвращает горизонтальную шапку, но
     * оставляет строке 24px вертикальных полей внутри 44px. Убираем поля
     * и компактно размещаем контакты, не переводя планшет в phone-layout. */
    #cm-header-1 > .cm-container {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #cm-header-1 .cm-row {
        height: 44px !important;
        min-height: 44px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        gap: 0 !important;
        box-sizing: border-box !important;
        align-items: center !important;
    }

    #cm-header-1 .cm-header-col-1 {
        min-width: 0;
        margin-top: 0 !important;
        flex-wrap: nowrap;
    }

    #cm-header-1 .cm-header-col-2,
    #cm-header-1 .cm-header-col-2 #header-right-sidebar,
    #cm-header-1 .cm-header-col-2 .widget_custom_html,
    #cm-header-1 .cm-header-col-2 .textwidget.custom-html-widget {
        min-width: 0;
        align-items: center;
    }

    .cm-header-col-2 .napishite {
        font-size: 12px !important;
        line-height: 20px !important;
        padding: 4px 10px !important;
    }

    .cm-header-col-2 .tele {
        font-size: 22px !important;
        line-height: 1.2 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}

@media (min-width: 768px) and (max-width: 899px) {
    /* В портретном планшете слоган упирается в блок контактов; оставляем
     * его на широком планшете и десктопе, а здесь показываем чистый логотип. */
    #cm-header-1 .cm-site-description { display: none !important; }
}

@media (max-width: 340px) {
    /* На самых узких телефонах полный номер и кнопка всё ещё не помещались
     * в одну строку; уменьшаем только их внутренний интервал и кегль. */
    #cm-header-1 .cm-header-col-2 .textwidget.custom-html-widget {
        gap: 4px !important;
    }

    .cm-header-col-2 .tele { font-size: 16px !important; }
    .cm-header-col-2 .napishite {
        font-size: 11px !important;
        padding-left: 6px !important;
        padding-right: 6px !important;
    }
}

@media (max-width: 767px) {
    /* Эти 140px были парой к старому `.elementor { margin-top:-140px }`.
     * После переноса парное правило исчезло, а пустые поля остались. */
    .elementor-4980  .elementor-element.elementor-element-0617651,
    .elementor-21007 .elementor-element.elementor-element-37b4a636,
    .elementor-19921 .elementor-element.elementor-element-5fdbd67f,
    .elementor-19921 .elementor-element.elementor-element-718b156,
    .elementor-20930 .elementor-element.elementor-element-40bcfe25,
    .elementor-22239 .elementor-element.elementor-element-28d851c1 {
        margin-top: 0 !important;
    }

    /* Мобильный первый экран /avtomatizacia-predpiyatia/ был шестым
     * top-level блоком, поэтому страница начиналась с «Отраслевых решений». */
    .elementor-19921 {
        display: flex;
        flex-direction: column;
    }

    .elementor-19921 > .elementor-element.elementor-element-718b156 {
        order: -1;
    }

    /* На /biznes/ два мобильных CTA имели белый текст на белом фоне. */
    .elementor-8492 .elementor-element.elementor-element-07f6b5d .elementor-button,
    .elementor-8492 .elementor-element.elementor-element-036de7e .elementor-button {
        color: #313131 !important;
        fill: #313131 !important;
        border-color: #df0000 !important;
    }

    .elementor-8492 .elementor-element.elementor-element-07f6b5d .elementor-button:hover,
    .elementor-8492 .elementor-element.elementor-element-07f6b5d .elementor-button:focus {
        color: #ffffff !important;
        fill: #ffffff !important;
    }

    /* Боковые поля 69–75px оставляли тексту около половины телефона. */
    .elementor-8492 .elementor-element.elementor-element-6770f88 > .elementor-widget-container,
    .elementor-8492 .elementor-element.elementor-element-892abac > .elementor-widget-container {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Кнопки заказа в узких ячейках таблицы не должны разрывать слово. */
    .elementor-4980 a.knp { white-space: nowrap; }

    /* В старом HTML /korobka/ остались пустой пункт №5, семь NBSP-разделителей
     * и пустой завершающий div. На телефоне они выглядели как «5.» и тире между ссылками. */
    body.elementor-page-22239
    .elementor-element.elementor-element-4f238106
    > .elementor-widget-container > ol > li:nth-child(5),
    body.elementor-page-22239
    .elementor-element.elementor-element-4f238106
    > .elementor-widget-container > p,
    body.elementor-page-22239
    .elementor-element.elementor-element-4f238106
    > .elementor-widget-container > div:last-child {
        display: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Старые Dzen/VK-вставки имеют жёсткие 480px и раздвигают телефон. */
    .cm-entry-summary iframe[src*="dzen.ru/embed/"],
    .cm-entry-summary iframe[src*="vk.com/video_ext"] {
        display: block;
        width: 100% !important;
        max-width: 100%;
        height: auto !important;
        aspect-ratio: 16 / 9;
    }

    /* Фиксированные таблицы из старого редактора сохраняют читаемую ширину,
     * но прокручиваются внутри своего блока, а не раздвигают всю страницу. */
    .elementor-26979 .elementor-element.elementor-element-324fca2,
    .elementor-24866 .elementor-element.elementor-element-380f4f7,
    .elementor-21016 .elementor-element.elementor-element-99bfe0f,
    .elementor-20555 .elementor-element.elementor-element-00746e6,
    .elementor-20611 .elementor-element.elementor-element-7317a82,
    .elementor-20616 .elementor-element.elementor-element-b79b6fa,
    .elementor-20632 .elementor-element.elementor-element-c0521da,
    .elementor-20746 .elementor-element.elementor-element-433115c,
    .elementor-20770 .elementor-element.elementor-element-9925b83 {
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .elementor-24866 .elementor-element.elementor-element-380f4f7,
    .elementor-24866 .elementor-element.elementor-element-380f4f7 table,
    .elementor-24866 .elementor-element.elementor-element-380f4f7 td {
        line-height: 1.3 !important;
    }
}

/* На телефоне и планшете меню разделов остаются видимыми и прокручиваются
 * горизонтально одной строкой. Это выполняет то же требование, что desktop
 * sticky, не заставляя девять пунктов «Системы» складываться в 3–4 ряда. */
@media (max-width: 1024px) {
    .elementor-4980  .elementor-element.elementor-element-50f4d445 .elementor-widget-container,
    .elementor-21007 .elementor-element.elementor-element-07dbd4b .elementor-widget-container,
    .elementor-22239 .elementor-element.elementor-element-1fec341 .elementor-widget-container {
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .elementor-4980  .elementor-element.elementor-element-50f4d445 ul.menu,
    .elementor-21007 .elementor-element.elementor-element-07dbd4b ul.menu,
    .elementor-22239 .elementor-element.elementor-element-1fec341 ul.menu {
        width: max-content;
        min-width: 100%;
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 20px;
        padding: 10px 8px;
    }

    .elementor-4980  .elementor-element.elementor-element-50f4d445 ul.menu li,
    .elementor-21007 .elementor-element.elementor-element-07dbd4b ul.menu li,
    .elementor-22239 .elementor-element.elementor-element-1fec341 ul.menu li {
        flex: 0 0 auto;
    }

    .elementor-4980  .elementor-element.elementor-element-50f4d445 ul.menu a,
    .elementor-21007 .elementor-element.elementor-element-07dbd4b ul.menu a,
    .elementor-22239 .elementor-element.elementor-element-1fec341 ul.menu a {
        white-space: nowrap;
    }

    .elementor-4980 .elementor-menu-anchor,
    .elementor-21007 .elementor-menu-anchor {
        scroll-margin-top: 200px;
    }
}

@media (max-width: 767px) {
    body.page-id-4980,
    body.page-id-21007 {
        overflow-x: clip !important;
        overflow-y: visible !important;
    }

    .elementor-4980 .elementor-widget-wp-widget-nav_menu,
    .elementor-21007 .elementor-widget-wp-widget-nav_menu {
        display: block !important;
        width: 100%;
        max-width: 100%;
    }

    .elementor-4980 > .elementor-element.elementor-element-50f4d445,
    .elementor-21007 > .elementor-element.elementor-element-07dbd4b {
        position: sticky !important;
        top: 124px !important;
        left: auto !important;
        width: 100vw !important;
        max-width: none !important;
        margin-top: -28px !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
        z-index: 998 !important;
        background: #ffffff !important;
    }
}

/* Две таблицы были скрыты и на телефоне, и на планшете без мобильной
 * копии. TablePress уже даёт им собственную горизонтальную прокрутку. */
@media (max-width: 1024px) {
    .elementor-4980  .elementor-element.elementor-element-92d3bf6,
    .elementor-25364 .elementor-element.elementor-element-318a8e8 {
        display: block !important;
    }
}

/* На главной иконки преимуществ были абсолютно привязаны к верху карточки
 * и заходили в заголовок, когда тот менял высоту. Раскладываем содержимое
 * карточки в две строки: заголовок сверху, затем иконка и текст рядом. */
body.home .elementor-21016
:is(.elementor-element-efd2e30, .elementor-element-261ec2cc)
> .elementor-container > .elementor-column > .elementor-widget-wrap {
    display: grid !important;
    grid-template-columns: 68px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 12px;
    row-gap: 20px;
    align-content: start;
}

body.home .elementor-21016
:is(.elementor-element-efd2e30, .elementor-element-261ec2cc)
> .elementor-container > .elementor-column > .elementor-widget-wrap
> .elementor-widget-heading {
    grid-column: 1 / -1;
    grid-row: 1;
    margin: 0 !important;
}

body.home .elementor-21016
:is(.elementor-element-efd2e30, .elementor-element-261ec2cc)
> .elementor-container > .elementor-column > .elementor-widget-wrap
> .elementor-widget-image {
    position: static !important;
    inset: auto !important;
    grid-column: 1;
    grid-row: 2;
    width: 68px !important;
    max-width: 68px !important;
    margin: 0 !important;
    align-self: start;
    transform: translateX(-20px);
}

body.home .elementor-21016
:is(.elementor-element-efd2e30, .elementor-element-261ec2cc)
> .elementor-container > .elementor-column > .elementor-widget-wrap
> .elementor-widget-image > .elementor-widget-container {
    margin: 0 !important;
}

body.home .elementor-21016
:is(.elementor-element-efd2e30, .elementor-element-261ec2cc)
> .elementor-container > .elementor-column > .elementor-widget-wrap
> .elementor-widget-text-editor {
    grid-column: 2;
    grid-row: 2;
    width: auto !important;
    max-width: none !important;
    min-width: 0;
    margin: 0 !important;
}

body.home .elementor-21016
:is(.elementor-element-efd2e30, .elementor-element-261ec2cc)
> .elementor-container > .elementor-column > .elementor-widget-wrap
> .elementor-widget-text-editor > .elementor-widget-container {
    margin: 0 !important;
}

/* Envybox deliberately positions its desktop exit-intent window at the cursor
 * exit point. Keep that variant centred without changing the normal callback
 * modal, floating phone button, or full-screen mobile window. */
@media (min-width: 768px) {
    body .callbackkiller.cbk-window.cbk-window-onexit:not(.callbackkiller-mobile) {
        position: fixed !important;
        top: 50% !important;
        left: 50% !important;
        right: auto !important;
        bottom: auto !important;
        margin: 0 !important;
        transform: translate(-50%, -50%) !important;
        max-width: calc(100vw - 32px) !important;
        max-height: calc(100vh - 32px) !important;
        max-height: calc(100dvh - 32px) !important;
        overflow-y: auto !important;
    }
}

/* Homepage product comparison: keep the source as a real semantic table for
 * search engines, AI crawlers, assistive technology, and CSS-free clients. */
body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison {
    width: 100%;
    color: #4f5963;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__method {
    max-width: 940px;
    margin: 0 0 14px;
    color: #5b6570;
    font-size: 15px;
    line-height: 1.5;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__hint {
    display: none;
    margin: 0 0 8px;
    color: #666666;
    font-size: 14px;
    line-height: 1.4;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__scroll:focus-visible {
    outline: 3px solid rgba(223, 1, 0, 0.35);
    outline-offset: 3px;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table {
    width: 100%;
    min-width: 1060px;
    margin: 0;
    border: 0;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    color: #4f4f4f;
    font: inherit;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__feature-column {
    width: 29%;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__product-column {
    width: 11.833%;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table caption {
    padding: 0 0 16px;
    color: #202020;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.3;
    text-align: left;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table th,
body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table td {
    height: auto;
    border: 0;
    box-sizing: border-box;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table thead th {
    padding: 12px 10px 14px;
    background: #ffffff;
    color: #202020;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    vertical-align: bottom;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table thead th:first-child {
    text-align: left;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table tbody th,
body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table tbody td {
    padding: 8px 12px;
    line-height: 1.2;
    vertical-align: middle;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table tbody th {
    font-weight: 400;
    text-align: left;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table tbody td {
    text-align: center;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table tbody tr:nth-child(odd) > * {
    background: #f4f4f4;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table tbody tr:nth-child(even) > * {
    background: #ffffff;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__status {
    display: inline-flex;
    gap: 5px;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__status--yes {
    color: #4f4f4f;
    font-weight: 600;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__status--yes > [aria-hidden="true"] {
    color: #f04b23;
    font-size: 21px;
    line-height: 1;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__status--no {
    color: #777777;
    font-weight: 400;
}

body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__status--no > [aria-hidden="true"] {
    color: #aaaaaa;
}

@media (max-width: 767px) {
    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__method {
        font-size: 14px;
    }

    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__hint {
        display: block;
    }

    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table {
        min-width: 960px;
        font-size: 14px;
    }

    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__feature-column {
        width: 250px;
    }

    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table caption {
        font-size: 19px;
    }

    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table thead th,
    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table tbody th,
    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table tbody td {
        padding: 9px 10px;
    }

    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table thead th:first-child,
    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table tbody th[scope="row"] {
        position: sticky;
        left: 0;
        z-index: 2;
        box-shadow: 5px 0 8px -8px rgba(0, 0, 0, 0.6);
    }

    body.home .elementor-21016 .elementor-element-7975cb6 .ruli24-comparison__table thead th:first-child {
        z-index: 3;
    }
}

/* ==================================================================
 * Homepage semantic hero.
 *
 * One Elementor source now serves every breakpoint: a single descriptive H1,
 * the official explanatory copy, facts, media and one CTA. The desktop keeps
 * the original background; tablet and phone use the existing inline product
 * image instead of duplicating the text in DOM.
 * ================================================================== */

body.home .elementor-21016 .elementor-element.elementor-element-72decdd4,
body.home .elementor-21016 .elementor-element.elementor-element-72decdd4 * {
    box-sizing: border-box;
}

body.home .elementor-21016 .elementor-element.elementor-element-3c73e4f9 {
    margin-bottom: 0 !important;
    font-size: 19px !important;
    line-height: 1.52 !important;
}

body.home .elementor-21016
.elementor-element.elementor-element-3c73e4f9
> .elementor-widget-container {
    max-width: 66% !important;
    padding-top: 22px !important;
}

body.home .elementor-21016 .ruli24-hero-copy .hero-title {
    margin: 0 0 14px;
    color: #4f555a;
    font-family: Roboto, sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.15;
    overflow-wrap: normal;
    text-wrap: balance;
    white-space: normal;
    word-break: normal;
}

body.home .elementor-21016 .ruli24-hero-copy p {
    margin: 0 0 12px;
    font-size: 17px;
    line-height: 1.55;
    overflow-wrap: break-word;
    word-break: normal;
}

@media (min-width: 1200px) {
    body.home .elementor-21016
    .ruli24-hero-copy > p:not(.ruli24-hero-lead) {
        max-width: 620px;
    }
}

body.home .elementor-21016 .ruli24-hero-facts {
    margin: 4px 0 8px !important;
    padding-left: 24px;
    font-size: 18px;
    line-height: 1.55;
}

body.home .elementor-21016 .ruli24-hero-facts li {
    line-height: inherit;
    overflow-wrap: break-word;
    word-break: normal;
}

body.home .elementor-21016 .ruli24-hero-facts li::marker {
    color: #df0000;
}

body.home .elementor-21016 .ruli24-hero-mobile-image img {
    display: block;
    width: min(394px, 100%);
    height: auto;
    margin-inline: auto;
}

@media (min-width: 1025px) and (max-width: 1199px) {
    body.home .elementor-21016 .ruli24-hero-copy .hero-title {
        font-size: 28px;
        line-height: 1.18;
    }

    body.home .elementor-21016
    .ruli24-hero-copy > p:not(.ruli24-hero-lead) {
        max-width: 520px;
    }

    body.home .elementor-21016 .ruli24-hero-facts {
        font-size: 17px;
    }
}

@media (max-width: 1024px) {
    body.home .elementor-21016 .elementor-element.elementor-element-72decdd4 {
        margin-top: 0 !important;
        background-image: none !important;
        background-color: #ffffff;
    }

    body.home .elementor-21016
    .elementor-element.elementor-element-3c73e4f9
    > .elementor-widget-container {
        max-width: 100% !important;
        padding-top: 0 !important;
        padding-right: 0 !important;
    }

    body.home .elementor-21016 .ruli24-hero-copy .hero-title {
        font-size: 30px;
        line-height: 1.18;
    }

    body.home .elementor-21016 .ruli24-hero-facts {
        font-size: 17px;
        line-height: 1.6;
    }

    body.home .elementor-21016 .ruli24-hero-mobile-image {
        margin: 22px 0 0 !important;
    }

    body.home .elementor-21016 .elementor-element.elementor-element-4d9ca7e7 {
        margin-top: 18px !important;
    }
}

@media (max-width: 767px) {
    body.home a.callbackkiller.cbk-phone {
        position: fixed !important;
        top: auto !important;
        left: auto !important;
        right: 16px !important;
        bottom: 80px !important;
    }

    body.home .elementor-21016 .ruli24-hero-copy .hero-title {
        font-size: 27px;
        line-height: 1.2;
        text-wrap: pretty;
    }

    body.home .elementor-21016 .ruli24-hero-facts {
        padding-left: 22px;
    }

    body.home .elementor-21016 .elementor-element.elementor-element-4d9ca7e7 {
        padding-bottom: 84px !important;
    }
}

/* Homepage hero: a small desktop gap after News and proportional image zoom. */
@media (min-width: 1025px) {
    body.home .ruli24-front-news {
        margin-bottom: 16px !important;
    }
}

@media (min-width: 1200px) {
    body.home .elementor-21016
    .elementor-element.elementor-element-72decdd4:not(.elementor-motion-effects-element-type-background),
    body.home .elementor-21016
    .elementor-element.elementor-element-72decdd4
    > .elementor-motion-effects-container
    > .elementor-motion-effects-layer {
        background-size: 104% auto !important;
        background-position: calc(100% + 32px) center !important;
    }
}