/* =============================================================================
   CyberFAQ, промо-сайт. Все стили в одном файле.

   Значения сняты с прежней вёрстки Elementor: глобальный кит (id 9), шапка
   (41), главная (2), форма (289), подвал (317), мобильное меню (87),
   документы (360), статья (641), база знаний (699). Вместо ~700 КБ css
   темы, Elementor, Pro Elements, The Plus, Font Awesome и Swiper.

   Брейкпоинты те же, что у Elementor: планшет до 1024px, телефон до 767px.
   ========================================================================== */

/* --- Шрифт: Montserrat, раздаётся со своего домена ----------------------
   Вариативные файлы (400–600 одним файлом на подмножество). latin-ext нужен
   ради знака ₽ (U+20BD) в тарифах. */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    src: url('../fonts/montserrat-cyrillic.woff2') format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    src: url('../fonts/montserrat-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    src: url('../fonts/montserrat-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Montserrat';
    font-style: italic;
    font-weight: 400 600;
    font-display: swap;
    src: url('../fonts/montserrat-italic-cyrillic.woff2') format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Montserrat';
    font-style: italic;
    font-weight: 400 600;
    font-display: swap;
    src: url('../fonts/montserrat-italic-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --- Токены: глобальные цвета кита Elementor ---------------------------- */
:root {
    --c-primary: #242424;   /* заголовки */
    --c-text:    #404040;   /* текст */
    --c-accent:  #5373E1;   /* кнопки, ссылки */
    --c-pink:    #C837B1;   /* ссылка при наведении */
    --c-light:   #F2F5FF;   /* карточки, подвал */
    --c-dark:    #242527;   /* кнопка при наведении, иконки */
    --c-border:  #DDE1E5;
    --c-purple:  #420C79;   /* конец градиента */
    --c-muted:   #919396;   /* крошки, меню статей */
    --grad:      linear-gradient(271deg, var(--c-accent) 17%, var(--c-purple) 92%);
    --font:      'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    --hdr-h:     85px;
}

/* --- База ---------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html {
    -webkit-text-size-adjust: 100%;
    /* Якоря (/#prices, оглавление статьи) не прячутся под липкой шапкой. */
    scroll-padding-top: calc(var(--hdr-h) + 20px);
}
@media (prefers-reduced-motion: no-preference) {
    html { scroll-behavior: smooth; }
}

body {
    margin: 0;
    background: #fff;
    color: var(--c-text);
    font-family: var(--font);
    font-size: 18px;
    font-weight: 400;
    /* 1.5em, а не 1.5: так задано в ките Elementor, и значение наследуется
       готовыми 27px. Мелкий текст без своей высоты строки (крошки, подписи)
       в оригинале стоит в 27px, а не в 1.5 от своего кегля. */
    line-height: 1.5em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img { max-width: 100%; height: auto; border: 0; vertical-align: middle; }
svg.ico { display: inline-block; flex-shrink: 0; vertical-align: middle; }

a { color: var(--c-accent); text-decoration: underline; }
a:hover { color: var(--c-pink); text-decoration: none; }

p { margin: 0 0 1.5em; }

h1, h2, h3, h4, h5, h6 { margin: 0; color: var(--c-primary); font-weight: 600; }
h1 { font-size: 50px; line-height: 1.15; }
h2 { font-size: 32px; line-height: 1.2; }
h3 { font-size: 28px; line-height: 1.2; }
h4 { font-size: 24px; line-height: 1.3; }
h5 { font-size: 20px; line-height: 1.4; }
h6 { font-size: 18px; line-height: 1.5; }
b, strong { font-weight: 600; }

button, input, textarea, select { font: inherit; }

.wrap { width: 100%; max-width: 1278px; margin: 0 auto; padding: 0 15px; }

.skip {
    position: absolute; left: 12px; top: -60px; z-index: 3000;
    padding: 10px 16px; border-radius: 8px;
    background: var(--c-dark); color: #fff; text-decoration: none;
}
.skip:focus { top: 12px; color: #fff; }

:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 2px; }

/* --- Кнопки (The Plus, button-style-10) -------------------------------- */
.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 15px 45px;
    border: 0; border-radius: 50px;
    background: var(--c-accent); color: #fff;
    font-family: var(--font); font-size: 16px; font-weight: 500; line-height: 25px; letter-spacing: 0;
    text-align: center; text-decoration: none;
    cursor: pointer;
    transition: all .3s linear;
}
.btn:hover, .btn:focus-visible { background: var(--c-dark); color: #fff; text-decoration: none; }
.btn--hero { padding: 22px 107px; font-size: 18px; }
.btn--xl   { padding: 22px 107px; font-size: 18px; }
.btn--sm   { padding: 12px 45px; }
.btn--card { padding: 12px 30px; }
/* Кнопки на градиенте: тень и белая подложка при наведении. */
.btn--glow { box-shadow: 0 0 25px 0 rgba(0, 0, 0, .35); }
.btn--glow:hover, .btn--glow:focus-visible { background: #fff; color: var(--c-primary); }
.btn--ghost { background: transparent; color: var(--c-accent); box-shadow: inset 0 0 0 1px var(--c-accent); }
.btn--ghost:hover, .btn--ghost:focus-visible { background: var(--c-accent); color: #fff; }

/* --- Шапка (шаблон 41) --------------------------------------------------- */
.hdr {
    position: sticky; top: 0; z-index: 900;
    background: #fff;
    border-bottom: 1px solid var(--c-border);
}
.hdr__in { display: flex; align-items: center; gap: 30px; min-height: var(--hdr-h); }
.hdr__logo { display: block; flex-shrink: 0; line-height: 0; }
.hdr__logo img { width: 203px; }
.hdr__side { display: flex; align-items: center; gap: 24px; margin-left: auto; }

.menu { display: flex; flex-wrap: wrap; align-items: center; margin: 0; padding: 0; list-style: none; }
.menu li { margin: 0; padding: 0; }
.menu__link {
    display: block;
    padding: 5px 20px;
    color: var(--c-primary);
    font-size: 15px; font-weight: 500; line-height: 20px;
    text-decoration: none;
    transition: color .4s;
}
.menu__link:hover, .menu__link:focus-visible, .menu__link.is-current { color: var(--c-accent); }
.hdr .menu li + li .menu__link { margin-left: 15px; }
@media (min-width: 1025px) and (max-width: 1200px) {
    .hdr .menu__link { padding: 5px 12px; }
}

.burger {
    display: none;
    width: 40px; height: 40px; padding: 0;
    border: 0; background: none; color: var(--c-dark);
    cursor: pointer;
}

/* --- Мобильное меню (попап 87) ------------------------------------------ */
.mnav { position: fixed; inset: 0; z-index: 1000; background: rgba(0, 0, 0, .48); }
.mnav[hidden] { display: none; }
.mnav__panel {
    position: absolute; inset: 0;
    overflow-y: auto;
    padding: 15px 30px 30px;
    background: #fff;
    box-shadow: 2px 8px 23px 3px rgba(0, 0, 0, .2);
    transform: translateX(100%);
    transition: transform .5s ease;
}
.mnav.is-open .mnav__panel { transform: none; }
.mnav__close {
    position: absolute; top: 20px; right: 35px;
    width: 34px; height: 34px; padding: 0;
    display: flex; align-items: center; justify-content: center;
    border: 0; background: none; color: var(--c-dark); cursor: pointer;
}
.mnav__logo { display: inline-block; line-height: 0; }
.mnav__logo img { width: 203px; }
.mnav__list {
    margin: 10px 0 20px; padding: 0; list-style: none;
    border-bottom: 1px solid var(--c-border);
}
.mnav__list li { margin: 0; padding: 0; }
.mnav__link {
    display: block; padding: 12px 0;
    color: #33373d; font-size: 15px; font-weight: 500; line-height: 20px;
    text-decoration: none;
}
.mnav__link:hover, .mnav__link.is-current { color: var(--c-accent); }
@media (prefers-reduced-motion: reduce) {
    .mnav__panel { transition: none; }
}
@media (max-width: 600px) {
    .mnav__panel > .btn { display: flex; width: fit-content; margin: 0 auto; }
}

/* --- Общие блоки секций --------------------------------------------------- */
.sec { padding-bottom: 125px; }
.sec--tight { padding-bottom: 31px; }
.sec--pad-top { padding-top: 94px; }
.sec--prices { padding-bottom: 119px; }
.sec--faq { padding-bottom: 90px; }

.sec__title { font-size: 60px; line-height: 1.2; }
.sec__title--gap { margin-bottom: 35px; }
.sec__title--steps { margin-bottom: 60px; }
.sec__title--prices { margin-bottom: 38px; }
.sec__lead { margin: 16px 0 37px; }

.card { background: var(--c-light); border-radius: 30px; padding: 35px; }
.card h4 { margin: 0; }
.card img { display: block; margin: 0 auto; }
.r15 { border-radius: 15px; }
.r20 { border-radius: 20px; }

.grid { display: flex; gap: 30px; }
.grid > * { min-width: 0; }
.grid--3 > * { flex: 1 1 0; }
.grid--1-2 > :first-child, .grid--2-1 > :last-child  { flex: 1 1 0; }
.grid--1-2 > :last-child,  .grid--2-1 > :first-child { flex: 2 1 0; }
.grid--gap-top, .card--gap-top { margin-top: 30px; }

/* Широкая карточка: текст | картинка («Как работает», «Свой промпт») */
.card--wide {
    display: flex; align-items: center; gap: 95px;
    padding: 38px 35px 40px 50px;
}
.card--wide__text, .card--wide__media { flex: 1 1 0; min-width: 0; }
.card--wide__media { text-align: center; }
.card--wide .card__h { margin-bottom: 8px; }

/* Плитка с картинкой сверху и подписью по центру */
.card--tile { text-align: center; }
.card--tile h4 { margin: 30px 0; }
.card--tile-text h4 { margin: 30px 0 8px; }

/* Карточка возможности: заголовок, текст, картинка */
.card--feat { padding: 56px 40px 40px; }
.card--feat > h4, .card--split__text h4 { margin-bottom: 20px; }
.card--split { display: flex; gap: 30px; }
.card--split__text { flex: 45 1 0; min-width: 0; }
.card--split__media { flex: 55 1 0; min-width: 0; }
.card--split__media--100 { padding-top: 100px; }
.card--split__media--142 { padding-top: 142px; }

/* --- Первый экран --------------------------------------------------------- */
.hero { padding: 93px 0 125px; }
.hero__in { display: flex; flex-direction: column; align-items: center; }
.hero__title {
    width: 77%;
    font-size: 69px; line-height: 1.2;
    text-align: center;
}
.hero__lead { margin: 36px 0 1.5em; text-align: center; }
.hero__img { display: block; margin-top: 20px; }

/* --- Градиентный призыв (cta.php) ---------------------------------------- */
.promo-sec { padding-top: 31px; padding-bottom: 31px; }
.promo-sec--help { padding-top: 70px; padding-bottom: 75px; }
.promo-sec--art { padding-top: 31px; padding-bottom: 75px; }
.promo {
    display: flex; align-items: center; gap: 30px;
    padding: 50px;
    border-radius: 30px;
    background: var(--grad);
    color: #fff;
}
.promo__text { flex: 60 1 0; min-width: 0; padding: 35px 0; }
.promo__media { flex: 40 1 0; min-width: 0; text-align: center; }
.promo__title { margin: 0 0 20px; color: #fff; }
.promo p { margin: 0 0 37px; color: #fff; }

/* --- Шаги «Как начать работу?» ------------------------------------------- */
.steps { display: flex; gap: 0 30px; margin: 0; padding: 0; list-style: none; }
.step { flex: 1 1 0; min-width: 0; margin: 0; padding: 0 0 35px; }
.step:last-child { padding-bottom: 0; }
.step__num {
    display: block; margin-bottom: 22px;
    color: var(--c-primary);
    font-size: 145px; font-weight: 600; line-height: 1;
}
.step h4 { margin: 0; }
.step .btn, .step p { margin-top: 16px; }

/* --- Тарифы -------------------------------------------------------------- */
.plans { display: flex; gap: 0 30px; }
.plan {
    flex: 1 1 0; min-width: 0;
    padding: 33px;
    border-radius: 30px;
    background: var(--c-light);
}
.plan__name { margin: 0 0 30px; font-size: 35px; line-height: 1.2; }
.plan__price { margin: 0 0 16px; padding-top: 10px; color: var(--c-primary); font-size: 28px; font-weight: 600; line-height: 1.2; }
.plan--accent .plan__price { color: #fff; }
.plan__per { font-size: 18px; font-weight: 400; }
.plan--accent { background: linear-gradient(180deg, var(--c-accent) 0%, var(--c-purple) 100%); color: #fff; }
.plan--accent .plan__name, .plan--accent p { color: #fff; }
.plan--accent .btn { margin: 10px 0; }
.plans__cta { width: 17%; margin: 65px auto 0; }
.plans__more { margin: 20px 0 0; font-size: 16px; text-align: center; }

/* --- Вопросы и ответы (The Plus accordion) ------------------------------- */
.faq__item { margin-bottom: 12px; }
.faq__item:last-child { margin-bottom: 0; }
.faq__q {
    display: flex; align-items: center;
    padding: 24px 20px 24px 42px;
    border-radius: 15px;
    background: var(--c-light);
    color: var(--c-primary);
    font-size: 22px; font-weight: 600; line-height: 1.2;
    list-style: none;
    cursor: pointer;
    transition: all .2s linear;
}
.faq__q::-webkit-details-marker { display: none; }
.faq__q::marker { content: ''; }
.faq__q span { flex: 1 1 auto; }
.faq__q .ico { margin-left: 5px; }
.faq__q .ico--minus, .faq__item[open] .faq__q .ico--plus { display: none; }
.faq__item[open] .faq__q .ico--minus { display: inline-block; }
.faq__a { padding: 20px 44px 3px 42px; }

/* --- Форма «Напишите нам» (шаблон 289) ------------------------------------ */
.contact-sec { padding: 30px 0 75px; }
.contact {
    padding: 60px 50px 50px;
    border-radius: 30px;
    background: var(--grad);
    color: #fff;
}
.contact__title { margin: 0 0 41px; color: #fff; font-size: 60px; line-height: 1.2; }
.contact__sub { width: 50%; margin: 0 0 38px; color: #fff; }

.cform { position: relative; display: flex; flex-direction: column; width: 60%; }
.cform__field {
    display: block; width: 100%;
    margin: 7px 0;
    padding: 21px 21px 21px 28px;
    border: 1px solid var(--c-light); border-radius: 11px;
    background: var(--c-light);
    color: var(--c-primary);
    font-size: 16px; font-weight: 400; line-height: 1.5;
    outline: 0;
    transition: background .2s, border-color .2s;
}
.cform__field:focus { background: #fff; border-color: var(--c-accent); }
.cform__field::placeholder { color: #8b8f99; opacity: 1; }
textarea.cform__field { resize: vertical; min-height: 120px; }

.cform__consent {
    position: relative;
    display: flex; align-items: center; gap: 15px;
    margin: 7px 0;
    color: #C0C0C0; font-size: 14px; line-height: 1;
    cursor: pointer;
}
.cform__consent a { color: #C0C0C0; text-decoration: underline; }
.cform__consent a:hover { color: #fff; }
/* Настоящий checkbox остаётся в DOM (фокус, клавиатура, required) и
   прячется под нарисованный квадрат. */
.cform__consent input {
    position: absolute; left: 0; top: 50%;
    width: 20px; height: 20px; margin: -10px 0 0;
    opacity: 0; cursor: pointer;
}
.cform__box {
    position: relative; flex: 0 0 20px;
    width: 20px; height: 20px;
    border-radius: 4px; background: #fff;
}
.cform__consent input:checked + .cform__box::after {
    content: ''; position: absolute; left: 7px; top: 3px;
    width: 5px; height: 10px;
    border: solid var(--c-primary); border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.cform__consent input:focus-visible + .cform__box { outline: 2px solid #fff; outline-offset: 2px; }

.cform__submit {
    display: block; width: 100%; max-width: 253px;
    margin: 14px 0 7px; padding: 25px;
    border: 0; border-radius: 50px;
    background: var(--c-accent); color: #fff;
    box-shadow: 0 0 25px 0 rgba(0, 0, 0, .35);
    font-size: 18px; font-weight: 500; line-height: 12px;
    cursor: pointer;
    transition: all .3s linear;
}
.cform__submit:hover, .cform__submit:focus-visible { background: #fff; color: var(--c-primary); }
.cform__submit[disabled] { opacity: .7; cursor: default; }

.cform__status { margin: 7px 0 0; color: #fff; font-size: 14px; }
.cform__status:empty { display: none; }
.cform__status[data-state] { padding: .2em 1em; border: 2px solid; }
.cform__status[data-state="ok"] { border-color: #46b450; }
.cform__status[data-state="error"] { border-color: #ffb900; }

.cform__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* --- Заголовок страниц: документы, база знаний, 404 ---------------------- */
.pagehead__in { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }
/* Как у шаблона 360: крошки (под ними 1.5em абзаца), отступ 70, линия с
   полями по 15 — всё внутри блока высотой 300px, прижатое к низу. */
.pagehead--doc .pagehead__in { min-height: 300px; }
.pagehead--help .pagehead__in { padding-top: 110px; padding-bottom: 105px; }
.pagehead__title { font-size: 69px; line-height: 1.2; text-align: center; }
.pagehead__rule { align-self: stretch; margin: 85px 0 15px; border: 0; border-top: 1px solid var(--c-border); }

.crumbs { margin-top: 10px; font-size: 14px; text-align: center; }
.pagehead .crumbs { margin-bottom: 21px; }
.crumbs a { color: var(--c-muted); text-decoration: none; transition: color .3s linear; }
.crumbs a:hover { color: var(--c-accent); }

.doc { padding-top: 35px; padding-bottom: 70px; }
.doc--center { text-align: center; }
.doc__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 15px; }

/* --- База знаний: список статей ------------------------------------------ */
/* Колонки 25/50/25 с зазорами 30 и полями 15 у оригинала: карточка 50% - 60px. */
.kb { width: calc(50% - 60px); margin: 0 auto; padding: 0; list-style: none; }
.kb > li { margin: 0 0 30px; padding: 0; }
.kb__card {
    display: block;
    padding: 40px 40px 20px;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 4px 30px 0 rgba(189, 179, 179, .3);
    color: var(--c-text);
    text-decoration: none;
    transition: box-shadow .3s, color .3s;
}
.kb__card:hover { color: var(--c-text); box-shadow: 0 4px 30px 0 rgba(189, 179, 179, .55); }
.kb__title {
    display: block; margin-bottom: 15px;
    color: var(--c-primary);
    font-size: 22px; font-weight: 600; line-height: 1.3;
    transition: color .3s;
}
.kb__card:hover .kb__title { color: var(--c-accent); }
.kb__desc { display: block; margin-bottom: 1.5em; }

/* --- Статья базы знаний (шаблон 641) -------------------------------------- */
.art-wrap { padding-top: 30px; padding-left: 0; padding-right: 0; }
.art { display: flex; gap: 30px; }

.art__nav { flex: 20 1 0; min-width: 0; border-right: 1px solid var(--c-border); }
.art__nav-title { margin: 0; padding: 5px 5px 15px; color: var(--c-text); font-size: 16px; font-weight: 600; line-height: 1; }
.art__list { margin: 0; padding: 0; list-style: none; }
.art__list li { margin: 0; padding: 0; }
.art__link {
    display: flex; justify-content: space-between;
    padding: 10px 6px;
    color: var(--c-muted);
    font-size: 14px; font-weight: 500; line-height: 20px;
    text-decoration: none;
}
.art__list li:first-child .art__link { border-radius: 6px 6px 0 0; }
.art__list li:last-child .art__link { border-radius: 0 0 6px 6px; }
.art__link:hover { background: var(--c-light); color: var(--c-primary); }
.art__link.is-current { background: var(--c-light); color: var(--c-accent); }

.art__main { flex: 60 1 0; min-width: 0; padding: 0 15px; }
.crumbs--art { display: flex; align-items: center; gap: 10px; margin: 0; color: var(--c-muted); text-align: left; }
.crumbs--art .ico { color: #BEBEBE; }
.art__title { margin: 30px 0; }
.art__date { margin: 0 0 55px; color: var(--c-primary); font-size: 14px; line-height: 1.5; }

.art__side { flex: 20 1 0; min-width: 0; }
.side-cta { padding: 30px; text-align: center; }
.side-cta__img { display: inline-block; line-height: 0; }
.side-cta__img img { width: 90%; }
.side-cta__title { margin: 0 0 15px; color: var(--c-primary); font-size: 18px; font-weight: 600; line-height: 1.5; }
.side-cta__sub { margin: 0 0 15px; color: #9FA4A8; font-size: 16px; line-height: 1.3; }
.side-cta .btn { margin-bottom: 15px; }

/* Оглавление (виджет table-of-contents) */
.toc {
    border-radius: 25px;
    background: #fff;
    box-shadow: 0 4px 30px hsla(0, 7%, 72%, .25);
    overflow: hidden;
}
.toc__title { margin: 0; padding: 20px 20px 0; color: var(--c-primary); font-size: 20px; font-weight: 600; line-height: 1.4; }
.toc__list, .toc__sub { margin: 0; padding: 0; list-style: none; }
.toc__list { margin-bottom: 1.2em; padding: 20px; font-size: 14px; line-height: 1.3; }
.toc__list li { margin: 10px 0 .5em; padding: 0 0 0 12px; }
.toc__sub { margin: .5em 0 1.2em .5em; }
.toc__link { color: inherit; text-decoration: none; }
.toc__link:hover { color: var(--c-accent); }
.toc__link.is-active { color: var(--c-accent); }
.toc--side { position: sticky; top: 120px; }
.toc--inline { display: none; margin: 0 0 50px; }
.toc--inline .toc__list { font-size: 15px; line-height: 1.35; }
.toc--inline .toc__list li { margin-top: 6px; }

/* --- Текст статей и документов ------------------------------------------ */
.prose h2, .prose h3, .prose h4 { margin: .5rem 0 1rem; }
.prose ul, .prose ol { margin: 0 0 1.2em; }
.prose li { margin: 6px 0; padding-left: 12px; }
.prose img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.prose a.zoom { cursor: zoom-in; }
.prose blockquote {
    margin: 1em 40px;
    padding-left: 2em;
    border-left: 5px solid var(--c-accent);
    font-style: italic;
}
.prose table {
    width: 100%; margin: 0 0 15px;
    border-collapse: collapse; border-spacing: 0;
    font-size: .9em;
}
.prose td, .prose th {
    padding: 15px;
    border: 1px solid hsla(0, 0%, 50%, .502);
    line-height: 1.5; vertical-align: top;
}
.prose tbody > tr:nth-child(odd) > td, .prose tbody > tr:nth-child(odd) > th { background: hsla(0, 0%, 50%, .071); }
.prose tbody tr:hover > td, .prose tbody tr:hover > th { background: hsla(0, 0%, 50%, .102); }
.prose th { color: var(--c-primary); font-weight: 600; text-align: left; }
/* Широкая таблица на телефоне прокручивается внутри, а не раздвигает страницу. */
.table-scroll { margin: 0 0 15px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-scroll table { min-width: 560px; margin: 0; }
.prose .formula { padding: 20px 25px; border-left: 5px solid var(--c-accent); border-radius: 15px; background: var(--c-light); color: var(--c-primary); font-weight: 500; }

/* --- Подвал (шаблон 317) -------------------------------------------------- */
.ftr__top { background: var(--c-light); border-bottom: 1px solid var(--c-border); }
.ftr__bottom { background: var(--c-light); }
.ftr__row { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding-top: 35px; padding-bottom: 35px; }
.ftr__row--bottom { padding-top: 30px; padding-bottom: 40px; }
.ftr__left { display: flex; align-items: center; gap: 30px; flex: 1 1 auto; min-width: 0; }
.ftr__logo { display: block; flex-shrink: 0; line-height: 0; }
.ftr__logo img { width: 203px; }
/* Пять пунктов с отступами шапки не влезали в строку и переносились. */
.ftr__nav .menu__link { padding: 5px 14px; white-space: nowrap; }
.ftr__nav .menu li + li .menu__link { margin-left: 0; }
.ftr__right { display: flex; align-items: center; justify-content: flex-end; gap: 30px; flex: 0 0 auto; }
.ftr__login {
    display: inline-flex; align-items: center; gap: 11px;
    padding: 5px;
    color: var(--c-text);
    font-size: 16px; font-weight: 500; line-height: 25px;
    text-decoration: none;
    transition: color .3s linear;
}
.ftr__login:hover { color: var(--c-accent); }
.ftr__copy { flex: 0 0 20%; margin: 0; color: var(--c-primary); font-size: 16px; line-height: 1; }
.ftr__legal { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0 50px; flex: 0 1 80%; }
.ftr__legal a {
    padding: 5px;
    color: var(--c-text);
    font-size: 14px; font-weight: 500; line-height: 25px;
    text-decoration: none;
    transition: color .3s linear;
}
.ftr__legal a:hover { color: var(--c-accent); }

/* --- Посадочные страницы: блоки inc/blocks.php ---------------------------
   Собраны из тех же токенов, что и главная: светлые карточки со скруглением
   30px, заголовки секций 60/56/30, акцентные кнопки. */
.hero--lp { padding-top: 40px; }
.crumbs--hero { margin: 0 0 30px; }
.hero__title--lp { width: 85%; font-size: 60px; }
.sec__gap { height: 35px; }
.sec__after { margin: 25px 0 0; }
.lp-text { max-width: 900px; }

.feats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.feat { padding: 35px; }
.feat__title { margin: 0 0 12px; font-size: 24px; line-height: 1.3; }

.chat { display: flex; flex-direction: column; gap: 14px; padding: 38px 50px 40px; }
.chat__row { display: flex; flex-direction: column; align-items: flex-start; }
.chat__row--user { align-items: flex-end; }
.chat__who { margin: 0 0 4px; color: var(--c-muted); font-size: 12px; line-height: 1.4; }
.chat__msg {
    max-width: 78%; margin: 0;
    padding: 14px 18px;
    border-radius: 18px 18px 18px 4px;
    background: #fff; color: var(--c-text);
    font-size: 16px; line-height: 1.5;
}
.chat__row--user .chat__msg { border-radius: 18px 18px 4px 18px; background: var(--c-accent); color: #fff; }
.chat__note { margin: 20px 0 0; color: var(--c-muted); font-size: 16px; line-height: 1.5; }

.card--list { display: block; }
.checks { margin: 0; padding: 0; list-style: none; }
.checks li { display: flex; align-items: flex-start; gap: 14px; margin: 0 0 14px; padding: 0; }
.checks li:last-child { margin-bottom: 0; }
.checks .ico { margin-top: 3px; color: var(--c-accent); }

.prompt {
    padding: 38px 50px 40px;
    border-left: 5px solid var(--c-accent);
    border-radius: 30px;
    background: var(--c-light);
    color: var(--c-primary);
    font-size: 17px; line-height: 1.6;
}

.step__title { margin: 0; font-size: 24px; line-height: 1.3; }

.links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin: 0; padding: 0; list-style: none; }
.links > li { margin: 0; padding: 0; }
.links .kb__card { height: 100%; }

/* Хаб «Решения» */
.sol-group + .sol-group { margin-top: 60px; }
.sol-group__title { margin: 0 0 30px; }

/* Таблица сравнения тарифов */
.compare { overflow-x: auto; border-radius: 30px; background: var(--c-light); }
.compare table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: 16px; }
.compare th, .compare td { padding: 16px 20px; border-bottom: 1px solid var(--c-border); text-align: left; vertical-align: top; }
.compare thead th { color: var(--c-primary); font-size: 18px; font-weight: 600; }
.compare tbody tr:last-child td, .compare tbody tr:last-child th { border-bottom: 0; }
.compare tbody th { color: var(--c-primary); font-weight: 500; }
.compare__yes { color: var(--c-accent); font-weight: 600; }
.compare__no { color: var(--c-muted); }

/* --- Лайтбокс ------------------------------------------------------------- */
.lb {
    position: fixed; inset: 0; z-index: 2000;
    display: flex; align-items: center; justify-content: center;
    padding: 50px 20px;
    background: rgba(20, 20, 24, .88);
}
.lb[hidden] { display: none; }
.lb__img { max-width: 100%; max-height: 100%; border-radius: 6px; box-shadow: 0 10px 40px rgba(0, 0, 0, .4); }
.lb__close {
    position: absolute; top: 12px; right: 12px;
    width: 44px; height: 44px; padding: 0;
    display: flex; align-items: center; justify-content: center;
    border: 0; background: none; color: #fff; cursor: pointer;
}

/* =============================================================================
   Планшет: до 1024px
   ========================================================================== */
@media (max-width: 1024px) {
    .hero__title--lp { width: 100%; font-size: 52px; }
    .feats, .links { grid-template-columns: repeat(2, 1fr); }
    .hdr__in { padding-top: 20px; padding-bottom: 20px; padding-left: 20px; padding-right: 20px; min-height: 0; }
    .hdr__nav { display: none; }
    .js .burger { display: inline-flex; align-items: center; justify-content: center; }

    .hero__title { width: 100%; font-size: 60px; }
    .sec__title, .contact__title { font-size: 56px; }
    .pagehead__title { font-size: 60px; }

    .btn--xl { padding: 22px 80px; }

    .steps { flex-wrap: wrap; }
    .step { flex: 0 0 calc(50% - 15px); }

    .plans { flex-wrap: wrap; }
    .plan { flex: 0 0 calc(50% - 15px); margin-bottom: 30px; }
    .plans__cta { width: 30%; margin-top: 35px; }

    .contact__sub, .cform { width: 100%; }

    .pagehead__rule { margin-top: 35px; }
    .kb { width: calc(90% - 85px); }

    .art-wrap { padding: 30px 15px 15px; }
    .art { flex-direction: column; gap: 0; }
    .art__main { order: 1; padding: 0; }
    .art__nav { order: 2; border-right: 0; border-top: 1px solid var(--c-border); border-bottom: 1px solid var(--c-border); }
    .art__side { order: 3; }
    .toc--side { display: none; }
    .toc--inline { display: block; }

    .ftr__row { flex-wrap: wrap; padding: 20px; gap: 0; }
    .ftr__left { flex: 0 0 50%; flex-wrap: wrap; justify-content: space-between; gap: 0; }
    .ftr__logo { margin-bottom: 10px; }
    .ftr__nav .menu li + li .menu__link { margin-left: 0; }
    .ftr__right { flex: 0 0 50%; }
    .ftr__row--bottom { padding: 30px 15px 40px; }
    .ftr__copy { flex-basis: 25%; }
    .ftr__legal { flex-basis: 75%; }
}

/* =============================================================================
   Телефон: до 767px
   ========================================================================== */
@media (max-width: 767px) {
    .hero--lp { padding-top: 25px; }
    .hero__title--lp { font-size: 30px; }
    .feats, .links { grid-template-columns: 1fr; }
    .feat { padding: 25px; }
    .feat__title, .step__title { font-size: 22px; }
    .chat { padding: 25px 20px; }
    .chat__msg { max-width: 92%; }
    .prompt { padding: 25px; }
    .compare { border-radius: 20px; }
    h1 { font-size: 32px; }
    h2 { font-size: 28px; }
    h3 { font-size: 24px; }
    h4 { font-size: 22px; }
    h5 { font-size: 20px; }

    .hdr__login { display: none; }

    .sec { padding-bottom: 63px; }
    .sec--pad-top { padding-top: 74px; }
    .sec--prices { padding-bottom: 63px; }
    .sec--faq { padding-bottom: 30px; }
    .sec__title, .contact__title { font-size: 30px; }
    .sec__title--steps { margin-bottom: 30px; }
    .sec__title--prices { margin-bottom: 30px; }

    .hero { padding-top: 47px; padding-bottom: 63px; }
    .hero__title { font-size: 32px; }
    .btn--hero { padding: 22px 85px; }
    .btn--xl { padding: 22px 42px; }

    .grid, .card--wide, .card--split, .promo { flex-direction: column; }
    .grid > *, .card--wide__text, .card--wide__media, .card--split__text, .card--split__media,
    .promo__text, .promo__media { flex: 0 0 auto; width: 100%; }
    .grid--3 { gap: 0; }
    .grid--3 > .card { margin-bottom: 30px; }
    .card--wide { gap: 0; padding: 35px 25px; }
    .card--feat { padding: 35px 25px; }
    .card--split { gap: 0; }
    .card--split__media--100, .card--split__media--142 { padding-top: 0; }

    .promo { padding: 35px 25px; gap: 0; }
    .promo__text { padding: 10px 0 35px; }

    .steps { flex-direction: column; }
    .step { flex: 0 0 auto; }

    .plans { flex-direction: column; }
    .plan { flex: 0 0 auto; padding: 25px; }
    .plan__name { font-size: 26px; }
    .plan__price { font-size: 24px; }
    .plans__cta { width: auto; margin-top: 25px; }

    .faq__q { padding: 24px 48px 24px 24px; font-size: 18px; }
    .faq__q .ico { margin-left: 6px; }
    .faq__a { padding: 14px 24px 8px; }

    .contact { padding: 45px 25px; }

    .pagehead--doc .pagehead__in { min-height: 230px; }
    .pagehead--help .pagehead__in { padding-top: 47px; padding-bottom: 47px; }
    .pagehead__title { font-size: 28px; }
    .promo-sec--help { padding-top: 60px; }
    .pagehead--help .pagehead__title { font-size: 32px; }
    .doc { padding-bottom: 60px; }
    .kb { width: calc(100% - 30px); }
    .kb__title { font-size: 20px; }

    .art__title { margin-bottom: 15px; }
    .art__date { margin-bottom: 30px; font-size: 12px; }
    .toc--inline { margin-bottom: 30px; }

    .ftr__left { flex: 0 0 100%; }
    .ftr__logo { margin-bottom: 20px; }
    .ftr__nav { margin-bottom: 20px; }
    .ftr__right { flex: 0 0 100%; justify-content: center; }
    .ftr__row--bottom { flex-direction: column-reverse; align-items: flex-start; }
    .ftr__copy { flex-basis: auto; margin: 20px 0 30px; }
    .ftr__legal { flex-basis: auto; justify-content: flex-start; }
}