/*
 * Landing pages and the home page
 * Лендинги и главная
 *
 * Отдельный файл через секцию Styles, без правки style.css (решение Р10).
 * Карточки документов и плитки разделов — из catalog-public.css: на
 * лендинге они те же, что на витрине. Вёрстка сначала для телефона: трафик
 * по «ДКП авто» в основном оттуда.
 *
 * Цвета — только токены `--pd-*` из public-theme.css (решение Р3 нового
 * облика): этот файл подключают лишь страницы на `_Layout`, где тема есть.
 */

.landing-page {
    /* Место под закреплённую шапку, как у страниц каталога. */
    padding-top: calc(var(--pd-header-h) + 32px);
}

.landing-section {
    padding: 2.5rem 0;
}

/* Переход по якорю (#formy, #tarify) не должен прятать заголовок блока под
   закреплённую шапку. Высота шапки — переменная темы: над шапкой может
   встать полоса с телефоном, и тогда она выше. */
.landing-page [id] {
    scroll-margin-top: calc(var(--pd-header-h) + 16px);
}

.landing-section-alt {
    background-color: var(--pd-surface);
}

/* Заголовки тематических блоков и служебных страниц — второстепенный H2
   (§3 нового облика): 30px на десктопе. */
.landing-title {
    font-size: 24px;
    line-height: 1.2;
    margin-bottom: 1.25rem;
}

/* ---------- первый экран ---------- */

.landing-hero {
    padding-bottom: 2rem;
}

.landing-h1 {
    font-size: 1.875rem;
    line-height: 1.2;
    margin-bottom: 1rem;
}

.landing-lead {
    font-size: 1.0625rem;
    color: var(--pd-text);
    max-width: 44rem;
    margin-bottom: 1.25rem;
}

/* ---------- заголовок блока со ссылкой «Все» ---------- */

.landing-block-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
}

.landing-block-all {
    white-space: nowrap;
    color: var(--pd-accent);
}

.landing-block-all::after {
    content: " →";
}

/* ---------- три шага ---------- */

/* Заголовок блока, под которым сразу сетка. */
.home-block-title {
    margin-bottom: 40px;
}

.landing-steps {
    display: grid;
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 0;
    margin: 0;
    list-style: none;
}

@media (min-width: 768px) {
    .landing-steps {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 40px;
    }
}

.landing-step {
    padding-top: 20px;
    border-top: 2px solid var(--pd-ink);
}

.landing-step-number {
    display: block;
    margin-bottom: 14px;
    font-family: var(--pd-font-serif);
    font-size: 18px;
    font-weight: 600;
    color: var(--pd-accent);
}

.landing-step-title {
    font-size: 21px;
    margin-bottom: 8px;
}

.landing-step p {
    margin: 0;
    color: var(--pd-text);
}

.landing-step a {
    color: var(--pd-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ---------- чем лучше бланка ---------- */

.compare {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

@media (min-width: 768px) {
    .compare {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
    }
}

.compare-card {
    padding: 28px;
    border: 1px solid var(--pd-line);
    border-radius: 16px;
    background-color: var(--pd-surface-2);
}

.compare-card-brand {
    border: 1.5px solid var(--pd-accent);
    background-color: var(--pd-surface);
}

.compare-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 12px;
    margin-bottom: 18px;
}

.compare-title {
    margin: 0;
    font-size: 22px;
}

.compare-badge {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 0 12px;
    border-radius: 14px;
    font-size: 13px;
    font-weight: 600;
}

.compare-badge-warn {
    background-color: var(--pd-warn-soft);
    color: var(--pd-warn);
}

.compare-badge-ok {
    background-color: var(--pd-ok-soft);
    color: var(--pd-ok);
}

/* Абзац договора — на «листе». */
.compare-card .compare-text {
    margin: 0;
    padding: 16px 18px;
    border: 1px solid var(--pd-line-soft);
    border-radius: 10px;
    background-color: var(--pd-surface);
    font-size: 15px;
    line-height: 1.8;
    color: var(--pd-text);
}

.compare-blank {
    color: var(--pd-muted);
    word-break: break-all;
}

.compare-list {
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
}

.compare-list li {
    position: relative;
    padding-left: 32px;
    color: var(--pd-ink);
}

.compare-list li + li {
    margin-top: 10px;
}

.compare-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 2px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 12px;
}

.compare-list-minus li::before {
    background-color: var(--pd-warn-soft);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6h7' stroke='%239A4A0B' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}

.compare-list-check li::before {
    background-color: var(--pd-ok-soft);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m2.5 6.2 2.3 2.3 4.7-5' fill='none' stroke='%231F6B3E' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Пять преимуществ под сравнением: в один ряд, на телефоне столбиком. */
.landing-features {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
    padding: 0;
    margin: 48px 0 0;
    list-style: none;
}

@media (min-width: 576px) {
    .landing-features {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 992px) {
    .landing-features {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 24px;
    }
}

.landing-feature .pd-icon {
    margin-bottom: 14px;
}

.landing-feature-title {
    font-size: 18px;
    margin-bottom: 6px;
}

.landing-feature p {
    margin: 0;
    font-size: 15px;
    color: var(--pd-text);
}

/* ---------- тематический блок и текст ---------- */

.landing-text {
    max-width: 52rem;
}

.landing-text p,
.landing-text li {
    color: var(--pd-ink);
}

.landing-text ul,
.landing-text ol {
    padding-left: 1.25rem;
}

/* Блоку с таблицей нужна вся ширина контейнера. */
.landing-text-wide {
    max-width: none;
}

.landing-subtitle {
    font-size: 1.125rem;
    margin: 1.5rem 0 .5rem;
}

.landing-text > .landing-subtitle:first-of-type,
.landing-text .row .landing-subtitle,
.landing-compare-card .landing-subtitle {
    margin-top: 0;
}

.landing-note {
    padding: 1rem 1.25rem;
    border-left: 3px solid var(--pd-accent);
    background-color: var(--pd-surface);
}

/* Таблицы тематических блоков (сравнение форм работы у бизнеса) на узком
   экране прокручиваются внутри себя, а не всей страницей. */
.landing-table-wrap {
    overflow-x: auto;
    margin-bottom: 1.25rem;
}

.landing-table {
    background-color: var(--pd-surface);
    margin: 0;
}

.landing-table th,
.landing-table td {
    padding: .75rem;
    vertical-align: top;
}

.landing-table thead th {
    font-size: .9375rem;
}

.landing-table tbody th {
    font-weight: 600;
    width: 22%;
}

/* На телефоне та же таблица — три карточки, по одной на форму работы. */
.landing-compare {
    display: grid;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.landing-compare-card {
    padding: 1.25rem;
    border-radius: .5rem;
    background-color: var(--pd-surface);
    border: 1px solid var(--pd-line);
}

.landing-compare-card dl {
    margin: 0;
}

.landing-compare-card dt {
    font-size: .8125rem;
    font-weight: 400;
    color: var(--pd-muted);
}

.landing-compare-card dd {
    margin-bottom: .625rem;
}

.landing-compare-card dd:last-child {
    margin-bottom: 0;
}

.landing-callout-list {
    margin: .75rem 0 0;
    padding-left: 1.25rem;
}

/* ---------- свой документ ---------- */

.own-doc {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 44px;
    padding: 32px 24px 40px;
}

@media (min-width: 992px) {
    .own-doc {
        grid-template-columns: minmax(0, 1fr) 460px;
        gap: 56px;
        align-items: center;
        padding: 56px;
    }
}

.own-doc-eyebrow {
    margin-bottom: 12px;
    color: var(--pd-marker);
}

.own-doc .pd-h2 {
    margin-bottom: 16px;
}

.own-doc-text p {
    color: var(--pd-dark-text);
}

.own-doc-action {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 20px;
    margin: 28px 0 24px;
}

.own-doc-note {
    font-size: 14px;
    color: var(--pd-dark-muted);
}

.own-doc-text .own-doc-privacy {
    margin: 0;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, .12);
    font-size: 14px;
    color: var(--pd-dark-muted);
}

/* «Лист» с найденными полями: над каждым полем — его метка. */
.own-doc-sheet {
    position: relative;
    padding: 28px 28px 40px;
    border-radius: 12px;
    background-color: var(--pd-surface);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .25);
    font-size: 14px;
    line-height: 2.4;
    color: var(--pd-text);
}

.own-doc-sheet p {
    margin: 0 0 6px;
}

.own-doc-sheet .own-doc-sheet-title {
    margin-bottom: 8px;
    font-family: var(--pd-font-serif);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .06em;
    line-height: 1.4;
    text-align: center;
    text-transform: uppercase;
    color: var(--pd-ink);
}

.own-field {
    position: relative;
    display: inline-block;
    padding: 0 4px;
    border-radius: 3px;
    background-color: var(--pd-accent-soft);
    color: var(--pd-accent);
    line-height: 1.5;
    white-space: nowrap;
}

.own-field-label {
    position: absolute;
    left: 0;
    bottom: 100%;
    margin-bottom: 1px;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .02em;
    white-space: nowrap;
    color: var(--pd-accent);
}

.own-doc-found {
    position: absolute;
    right: 16px;
    bottom: -15px;
    display: inline-flex;
    align-items: center;
    height: 30px;
    padding: 0 14px;
    border-radius: 15px;
    background-color: var(--pd-marker);
    color: var(--pd-ink);
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}

/* Блок «Нет нужного договора?» внутри текста раздела «Бизнесу». */

.landing-callout {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.5rem;
    border-radius: .75rem;
    border: 1px solid var(--pd-accent);
    background-color: var(--pd-accent-soft);
}

.landing-callout .landing-title {
    margin-bottom: .75rem;
}

.landing-callout p {
    margin: 0;
    color: var(--pd-ink);
}

@media (min-width: 992px) {
    .landing-callout {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding: 2rem;
    }

    .landing-callout-button {
        flex-shrink: 0;
    }
}

/* ---------- тарифы ---------- */

.landing-tariffs-head {
    max-width: 680px;
    margin: 0 auto 40px;
    text-align: center;
}

.landing-tariffs-head .pd-lead {
    margin: 12px 0 0;
}

/* Карточек столько, сколько тарифов (--tariffs ставит партиал); по 400px
   на карточку, при двух — 800px, по центру. */
.landing-tariffs {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
    max-width: calc(var(--tariffs, 2) * 400px);
    margin: 0 auto;
}

@media (min-width: 768px) {
    .landing-tariffs {
        grid-template-columns: repeat(var(--tariffs, 2), minmax(0, 1fr));
        gap: 24px;
    }
}

.landing-tariff {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 32px;
    border-radius: 16px;
    background-color: var(--pd-surface);
    border: 1px solid var(--pd-line);
}

.landing-tariff-name {
    font-size: 22px;
    margin-bottom: 12px;
}

.landing-tariff .landing-tariff-price {
    margin-bottom: 12px;
    font-family: var(--pd-font-serif);
    font-size: 40px;
    font-weight: 600;
    line-height: 1.1;
    color: var(--pd-ink);
}

.landing-tariff-note {
    font-family: var(--pd-font-sans);
    font-size: 16px;
    font-weight: 400;
    color: var(--pd-muted);
}

.landing-tariff .landing-tariff-description {
    flex-grow: 1;
    margin-bottom: 24px;
    color: var(--pd-text);
}

.landing-tariff .pd-btn {
    width: 100%;
}

.landing-tariffs-refund,
.landing-tariffs-login {
    margin: 24px 0 0;
    text-align: center;
    font-size: 15px;
    color: var(--pd-muted);
}

.landing-tariffs-section .landing-tariffs-login {
    margin-top: 6px;
}

.landing-tariffs-refund a,
.landing-tariffs-login a {
    color: var(--pd-accent);
}

/* Выделенный тариф (Р9): рамка акцентом и плашка над названием. */
.landing-tariff-featured {
    position: relative;
    border: 2px solid var(--pd-accent);
}

.landing-tariff .landing-tariff-badge {
    position: absolute;
    top: -15px;
    left: 30px;
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    margin: 0;
    padding: 4px 14px;
    border-radius: 15px;
    background-color: var(--pd-accent);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: #fff;
}

.landing-tariffs-sep {
    margin: 0 6px;
}

/* /ceny: цена крупнее, под ней срок, разделитель и список «что входит». */
.landing-tariffs-prices {
    padding-top: 24px;
}

.landing-tariffs-prices .landing-tariff .landing-tariff-price {
    margin-bottom: 4px;
    font-size: 48px;
}

.landing-tariff .landing-tariff-term {
    margin: 0;
    color: var(--pd-muted);
}

.landing-tariff .landing-tariff-features {
    flex-grow: 1;
    width: 100%;
    margin: 20px 0 28px;
    padding-top: 20px;
    border-top: 1px solid var(--pd-line);
}

.landing-tariffs-trust {
    margin: 28px 0 0;
    text-align: center;
    font-size: 15px;
    color: var(--pd-muted);
}

.landing-tariffs-trust a {
    color: var(--pd-accent);
}

@media (max-width: 575.98px) {
    .landing-tariff {
        padding: 28px 22px;
    }

    .landing-tariffs-prices .landing-tariff .landing-tariff-price {
        font-size: 40px;
    }

    /* Строка доверия — столбиком, без точек. */
    .landing-tariffs-trust span {
        display: block;
    }

    .landing-tariffs-trust .landing-tariffs-sep {
        display: none;
    }
}

/* ---------- вопросы ---------- */

/* Две колонки (Р11): слева заголовок и поддержка, справа вопросы. */
.landing-faq-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
}

@media (min-width: 992px) {
    .landing-faq-grid {
        grid-template-columns: 380px minmax(0, 1fr);
        gap: 64px;
        align-items: start;
    }
}

.landing-faq-side .pd-h2 {
    margin-bottom: 12px;
}

.landing-faq-side .landing-faq-help {
    margin-bottom: 20px;
    color: var(--pd-muted);
}

.landing-faq {
    border-top: 1px solid var(--pd-line);
}

.landing-faq-item {
    border-bottom: 1px solid var(--pd-line);
}

.landing-faq-question {
    position: relative;
    padding: 20px 48px 20px 0;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--pd-ink);
    cursor: pointer;
    list-style: none;
}

.landing-faq-question::-webkit-details-marker {
    display: none;
}

.landing-faq-question::after {
    content: "+";
    position: absolute;
    right: 0;
    top: 16px;
    width: 30px;
    height: 30px;
    border: 1px solid var(--pd-line);
    border-radius: 50%;
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    text-align: center;
    color: var(--pd-accent);
}

.landing-faq-item[open] .landing-faq-question::after {
    content: "−";
}

.landing-faq-answer {
    padding: 0 48px 20px 0;
    color: var(--pd-text);
}

/* Все ответы открыты (/ceny): вопрос — заголовок, а не кнопка. */
.landing-faq-open .landing-faq-question {
    margin: 0;
    padding: 20px 0 8px;
    font-family: var(--pd-font-sans);
    cursor: default;
}

.landing-faq-open .landing-faq-question::after {
    content: none;
}

.landing-faq-open .landing-faq-answer {
    padding-right: 0;
}

/* ---------- SEO-текст ---------- */

/* Две колонки абзацев под заголовком во всю ширину (Р11). */
.landing-seo-text {
    color: var(--pd-text);
}

.landing-seo-text h2 {
    max-width: 760px;
    margin-bottom: 24px;
    font-size: 30px;
    line-height: 1.2;
}

.landing-seo-text h3 {
    break-after: avoid;
}

@media (min-width: 768px) {
    .landing-seo-text {
        column-count: 2;
        column-gap: 56px;
    }

    .landing-seo-text h2 {
        column-span: all;
    }
}

@media (max-width: 575.98px) {
    .landing-seo-text h2 {
        font-size: 24px;
    }
}

/* ---------- финальный призыв ---------- */

.landing-cta {
    text-align: center;
    background-color: var(--pd-surface);
}

.landing-cta p {
    color: var(--pd-text);
}

/* ---------- широкий экран ---------- */

@media (min-width: 992px) {
    .landing-section {
        padding: 3.5rem 0;
    }

    .landing-title {
        font-size: 30px;
    }

    .landing-h1 {
        font-size: 2.5rem;
    }
}

/* ---------- служебные страницы: цены, вопросы, контакты, документы ---------- */

/* Разделы на странице вопросов: ссылки-якоря, переносятся на телефоне. */
.info-toc {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: .5rem;
}

.info-toc a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 .875rem;
    border: 1px solid var(--pd-accent);
    border-radius: 22px;
    color: var(--pd-accent);
    text-decoration: none;
}

.info-toc a:hover {
    background-color: var(--pd-accent);
    color: #fff;
}

.info-faq-section + .info-faq-section {
    padding-top: 0;
}

.info-contacts {
    margin: 1rem 0 1.5rem;
}

.info-contact {
    margin-bottom: 1rem;
    font-size: 1.125rem;
}

.info-contact-label {
    display: block;
    font-size: .875rem;
    color: var(--pd-muted);
}

.info-requisites {
    background-color: var(--pd-surface);
    margin: 0;
    max-width: 52rem;
}

.info-requisites th {
    width: 35%;
    font-weight: 600;
}

/* Юридический текст: длинный, читается с начала до конца. */
.legal-text {
    max-width: 48rem;
}

.legal-text h2 {
    font-size: 1.25rem;
    margin: 2rem 0 .75rem;
}

.legal-text table {
    display: block;
    overflow-x: auto;
    margin-bottom: 1rem;
    border-collapse: collapse;
}

.legal-text th,
.legal-text td {
    padding: .5rem .75rem;
    border: 1px solid var(--pd-line);
    vertical-align: top;
}

/* Незаполненное место в черновике — его видит только администратор. */
.legal-mark {
    padding: 0 .125rem;
    background-color: var(--pd-marker);
    color: var(--pd-ink);
}

.legal-draft-note {
    max-width: 48rem;
    margin-bottom: 1.5rem;
    padding: 1rem 1.25rem;
    border-left: 3px solid var(--pd-warn);
    background-color: var(--pd-warn-soft);
}

/* ---------- цены ---------- */

.prices-hero {
    padding-bottom: 16px;
}

.prices-hero-text {
    max-width: 760px;
    margin: 16px auto 0;
    text-align: center;
}

.prices-hero-text .pd-h1 {
    margin-bottom: 16px;
}

.prices-compare {
    padding-top: 0;
}

.prices-compare-title {
    margin-bottom: 24px;
    text-align: center;
}

.prices-compare .landing-table-wrap {
    max-width: 880px;
    margin: 0 auto;
    border: 1px solid var(--pd-line);
    border-radius: 16px;
    background-color: var(--pd-surface);
}

.prices-table {
    min-width: 560px;
    margin: 0;
    font-size: 15px;
    color: var(--pd-text);
}

.prices-table > :not(caption) > * > * {
    padding: 14px 20px;
    border-bottom-color: var(--pd-line-soft);
    background-color: transparent;
}

.prices-table thead > tr > * {
    background-color: var(--pd-surface-2);
    border-bottom-color: var(--pd-line);
    font-weight: 600;
    color: var(--pd-ink);
}

.prices-table tbody th {
    width: 44%;
    font-weight: 500;
    color: var(--pd-ink);
}

.prices-table tbody tr:last-child > * {
    border-bottom: 0;
}

.prices-yes {
    font-weight: 600;
    color: var(--pd-ok);
}

.prices-no {
    color: var(--pd-muted);
}

/* ---------- лендинг раздела: первый экран ---------- */

.section-hero {
    padding: 0 0 48px;
}

.section-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
}

@media (min-width: 992px) {
    .section-hero {
        padding-bottom: 64px;
    }

    .section-hero-grid {
        grid-template-columns: minmax(0, 1fr) 420px;
        gap: 56px;
        align-items: end;
    }
}

.section-hero-text .pd-h1 {
    margin: 8px 0 16px;
}

.section-hero .section-hero-lead {
    max-width: 44rem;
    margin: 0;
}

.section-search-label {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--pd-ink);
}

/* ---------- лендинг раздела: документы ---------- */

.section-docs {
    padding-top: 0;
}

.section-docs-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
}

@media (min-width: 992px) {
    .section-docs-grid {
        grid-template-columns: 260px minmax(0, 1fr);
        gap: 32px;
        align-items: start;
    }

    /* Левая колонка липнет под шапкой. */
    .section-aside {
        position: sticky;
        top: calc(var(--pd-header-h) + 24px);
    }
}

.section-nav-title {
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--pd-muted);
}

.section-nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.section-nav-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 12px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--pd-text);
    text-decoration: none;
}

.section-nav-link:hover {
    background-color: var(--pd-surface);
    color: var(--pd-ink);
}

/* «Все договоры» — активный пункт, тёмный. */
.section-nav-link-all,
.section-nav-link-all:hover {
    background-color: var(--pd-ink);
    color: #fff;
}

.section-nav-count {
    font-size: 13px;
    color: var(--pd-muted);
}

.section-own {
    margin-top: 20px;
    padding: 20px;
    font-size: 15px;
}

.section-own p {
    margin-bottom: 10px;
    color: var(--pd-text);
}

.section-own .section-own-title {
    margin-bottom: 4px;
    font-family: var(--pd-font-serif);
    font-size: 18px;
    font-weight: 600;
    color: var(--pd-ink);
}

.section-blocks {
    display: grid;
    gap: 20px;
}

.section-block {
    padding: 8px 24px 12px;
}

.section-block-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 4px 16px;
    padding: 18px 0 14px;
    border-bottom: 1px solid var(--pd-line);
}

.section-block-title {
    margin: 0;
    font-size: 24px;
}

.section-block-all {
    font-size: 15px;
    white-space: nowrap;
}

/* ---------- строка документа (Р8) ---------- */

.doc-rows {
    margin: 0;
    padding: 0;
    list-style: none;
}

.doc-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 0;
}

.doc-row + .doc-row {
    border-top: 1px solid var(--pd-line-soft);
}

.doc-row-text {
    min-width: 0;
}

.doc-row-title {
    font-weight: 600;
    line-height: 1.35;
    color: var(--pd-ink);
    text-decoration: none;
}

.doc-row-title:hover {
    color: var(--pd-accent);
}

.doc-row .doc-row-note {
    margin: 2px 0 0;
    font-size: 14px;
    line-height: 1.45;
    color: var(--pd-muted);
}

.doc-row-fill {
    flex: 0 0 auto;
}

.section-empty {
    padding: 32px;
    text-align: center;
}

.section-empty p {
    margin: 0;
    font-size: 17px;
    color: var(--pd-ink);
}

/* Телефон: навигация — полоса чипов, прокручивается вбок; «Нет нужного?»
   уходит под список; кнопка «Заполнить» — под названием. */
@media (max-width: 991.98px) {
    .section-aside {
        display: contents;
    }

    .section-nav {
        order: 1;
        min-width: 0;
    }

    .section-blocks {
        order: 2;
    }

    .section-own {
        order: 3;
        margin-top: 0;
    }

    .section-nav-title {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }

    .section-nav ul {
        display: flex;
        gap: 8px;
        margin: 0 -12px;
        padding: 2px 12px 6px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .section-nav ul::-webkit-scrollbar {
        display: none;
    }

    .section-nav li {
        flex: 0 0 auto;
    }

    .section-nav-link {
        min-height: 44px;
        padding: 0 16px;
        border: 1px solid var(--pd-line);
        border-radius: 22px;
        background-color: var(--pd-surface);
        white-space: nowrap;
    }

    .section-nav-link-all {
        border-color: var(--pd-ink);
    }
}

@media (max-width: 575.98px) {
    /* Отдельно стоящие ссылки-стрелки — с высотой под палец. */
    .landing-block-head .pd-link,
    .landing-block-all,
    .section-block-all,
    .section-own .pd-link,
    .section-empty .pd-link {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }

    .section-block {
        padding: 4px 16px 8px;
    }

    .section-block-title {
        font-size: 21px;
    }

    .doc-row {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .doc-row-fill {
        align-self: flex-start;
    }
}

/* ---------- лендинг раздела: полоса преимуществ ---------- */

.section-values-wrap {
    padding-top: 0;
}

.section-values {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    margin: 0;
    padding: 28px;
    list-style: none;
}

@media (min-width: 768px) {
    .section-values {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 32px;
        padding: 32px 36px;
    }

    .section-values li + li {
        padding-left: 32px;
        border-left: 1px solid var(--pd-line-soft);
    }
}

.section-value-title {
    margin-bottom: 6px;
    font-size: 19px;
}

.section-values p {
    margin: 0;
    font-size: 15px;
    color: var(--pd-text);
}

/* ---------- лендинг раздела: чек-лист «Недвижимости» ---------- */

.section-checklist {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
}

@media (min-width: 992px) {
    .section-checklist {
        grid-template-columns: 420px minmax(0, 1fr);
        gap: 56px;
    }
}

.section-checklist-intro .pd-h2-sm {
    margin-bottom: 14px;
}

.section-checklist-intro p {
    color: var(--pd-text);
}

.section-checklist-list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: checklist;
}

@media (min-width: 768px) {
    .section-checklist-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Нечётный последний пункт — во всю ширину. */
    .section-checklist-list li:last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }
}

.section-checklist-list li {
    position: relative;
    padding: 20px 20px 20px 64px;
    border: 1px solid var(--pd-line);
    border-radius: 14px;
    background-color: var(--pd-surface-2);
    color: var(--pd-text);
    counter-increment: checklist;
}

.section-checklist-list li::before {
    content: counter(checklist, decimal-leading-zero);
    position: absolute;
    left: 20px;
    top: 19px;
    font-family: var(--pd-font-serif);
    font-size: 18px;
    font-weight: 600;
    color: var(--pd-accent);
}

.section-checklist-list strong {
    color: var(--pd-ink);
}

/* ---------- лендинг раздела: SEO-текст и FAQ ---------- */

.section-seo-faq {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 48px;
}

@media (min-width: 992px) {
    .section-seo-faq-two {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 64px;
        align-items: start;
    }
}

/* В колонке рядом с FAQ SEO-текст идёт одной колонкой. */
.landing-seo-text.landing-seo-text-column {
    column-count: 1;
}

.landing-faq-column .pd-h2-sm {
    margin-bottom: 20px;
}

/* ---------- лендинг раздела: компактные тарифы ---------- */

.tariffs-strip {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    padding: 32px 24px;
}

@media (min-width: 992px) {
    .tariffs-strip {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 40px;
        padding: 40px 48px;
    }
}

.tariffs-strip .pd-h2-sm {
    margin-bottom: 10px;
}

.tariffs-strip .tariffs-strip-prices {
    margin: 0;
    color: var(--pd-dark-text);
}

.tariffs-strip-price {
    white-space: nowrap;
}

.tariffs-strip-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

@media (max-width: 575.98px) {
    .tariffs-strip-sep {
        display: none;
    }

    .tariffs-strip-price {
        display: block;
        white-space: normal;
    }

    .tariffs-strip-actions .pd-btn {
        flex: 1 1 auto;
    }
}

/* ---------- главная: первый экран ---------- */

/* У главной свой первый экран без крошек: отступ — ровно под шапку. */
.landing-page-home {
    padding-top: var(--pd-header-h);
}

.home-hero {
    padding: 40px 0 56px;
}

.home-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 48px;
    align-items: center;
}

@media (min-width: 992px) {
    .home-hero {
        padding: 72px 0 96px;
    }

    .home-hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 40px;
    }
}

@media (min-width: 1200px) {
    .home-hero-grid {
        grid-template-columns: 540px minmax(0, 1fr);
        gap: 64px;
    }
}

.home-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    margin-bottom: 24px;
    padding: 4px 14px;
    border: 1px solid var(--pd-line);
    border-radius: 16px;
    background-color: var(--pd-surface);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--pd-ink);
}

.home-hero-dot {
    flex: 0 0 auto;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--pd-ok);
    box-shadow: 0 0 0 3px var(--pd-ok-soft);
}

.home-hero-title {
    margin-bottom: 20px;
}

/* Маркер в H1. Межстрочный у заголовка 1.06, а фон строчного элемента
   занимает всю высоту шрифта — больше строки, и маркер следующей строки
   закрыл бы низ предыдущей. Поэтому в заголовке маркер — полоса в пределах
   своей строки. */
.home-hero-title .pd-mark {
    padding: 0 .08em;
    border-radius: 0;
    background: linear-gradient(transparent 16%, var(--pd-marker) 16%, var(--pd-marker) 92%, transparent 92%);
}

.home-hero .home-hero-lead {
    max-width: 34rem;
    margin-bottom: 28px;
}

.home-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    margin-top: 20px;
}

.home-chips ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.home-chips-label {
    font-size: 14px;
    color: var(--pd-muted);
}

.home-hero .home-hero-own {
    margin: 24px 0 0;
    font-size: 15px;
}

@media (max-width: 991.98px) {
    .home-hero-demo {
        max-width: 640px;
    }
}

/* ---------- крупный поиск ---------- */

/* Тот же _CatalogSearch, что на витрине, — крупнее: высота 60, лупа
   слева, «Найти» внутри поля. Партиал не меняется: вид задаёт обёртка. */
.pd-search-lg .catalog-search {
    position: relative;
    max-width: none;
    margin: 0;
}

.pd-search-lg .catalog-search::before {
    content: "";
    position: absolute;
    left: 20px;
    top: 50%;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A5F6B' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
    pointer-events: none;
}

.pd-search-lg .catalog-search-input {
    height: 60px;
    padding: 0 120px 0 52px;
    border: 1.5px solid var(--pd-ghost-line);
    border-radius: 12px;
    background-color: var(--pd-surface);
    font-size: 17px;
    color: var(--pd-ink);
    text-overflow: ellipsis;
}

.pd-search-lg .catalog-search-input::placeholder {
    color: var(--pd-muted);
}

.pd-search-lg .catalog-search-input:focus {
    border-color: var(--pd-accent);
}

.pd-search-lg .catalog-search .btn {
    position: absolute;
    top: 6px;
    right: 6px;
    height: 48px;
    padding: 0 22px;
    border-radius: 9px;
    font-size: 16px;
    font-weight: 600;
}

@media (max-width: 575.98px) {
    /* 16px, чтобы iOS не увеличивал страницу при фокусе. */
    .pd-search-lg .catalog-search-input {
        padding-right: 100px;
        font-size: 16px;
    }

    .pd-search-lg .catalog-search .btn {
        padding: 0 16px;
    }
}

/* ---------- главная: демо заполнения ---------- */

.hero-demo {
    position: relative;
    border: 1px solid var(--pd-line);
    border-radius: 18px;
    background-color: var(--pd-surface);
    box-shadow: 0 24px 60px rgba(21, 23, 28, .10), 0 2px 6px rgba(21, 23, 28, .04);
}

.hero-demo-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: baseline;
    gap: 4px 16px;
    padding: 20px 24px 18px;
    border-bottom: 1px solid var(--pd-line-soft);
}

.hero-demo .hero-demo-title {
    margin: 0;
    font-family: var(--pd-font-serif);
    font-size: 17px;
    font-weight: 600;
    color: var(--pd-ink);
}

.hero-demo .hero-demo-count {
    margin: 0;
    font-size: 13px;
    color: var(--pd-muted);
    white-space: nowrap;
}

.hero-demo-progress {
    grid-column: 1 / -1;
    height: 6px;
    margin-top: 10px;
    border-radius: 3px;
    background-color: var(--pd-line-soft);
    overflow: hidden;
}

.hero-demo-progress span {
    display: block;
    height: 100%;
    border-radius: 3px;
    background-color: var(--pd-accent);
}

.hero-demo-body {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
}

.hero-demo-form {
    padding: 20px 20px 24px 24px;
    border-right: 1px solid var(--pd-line-soft);
    border-bottom-left-radius: 18px;
    background-color: var(--pd-surface-2);
}

.hero-demo-field {
    display: block;
    margin: 0 0 14px;
}

.hero-demo-label {
    display: block;
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 600;
    color: var(--pd-muted);
}

.hero-demo-input {
    display: block;
    width: 100%;
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--pd-line);
    border-radius: 8px;
    background-color: var(--pd-surface);
    font: inherit;
    font-size: 14px;
    color: var(--pd-ink);
    pointer-events: none;
}

.hero-demo-field-active .hero-demo-label {
    color: var(--pd-accent);
}

.hero-demo-field-active .hero-demo-input {
    border: 1.5px solid var(--pd-accent);
    box-shadow: 0 0 0 3px var(--pd-accent-soft);
}

.hero-demo-sheet {
    padding: 24px 24px 48px;
    font-size: 14px;
    line-height: 1.75;
    color: var(--pd-text);
}

.hero-demo-sheet p {
    margin: 0 0 12px;
}

.hero-demo .hero-demo-note {
    position: absolute;
    right: 20px;
    bottom: -16px;
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    margin: 0;
    padding: 6px 16px;
    border-radius: 17px;
    background-color: var(--pd-ink);
    box-shadow: 0 8px 20px rgba(21, 23, 28, .18);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: #fff;
}

/* 992–1199: колонка демо узкая — поля над текстом, в две колонки. */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .hero-demo-body {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-demo-form {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 12px;
        border-right: 0;
        border-bottom: 1px solid var(--pd-line-soft);
        border-radius: 0;
    }
}

/* Телефон: компактная версия — поле «Покупатель» и абзац 2.2. */
@media (max-width: 575.98px) {
    .hero-demo-extra {
        display: none;
    }

    .hero-demo-body {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-demo-form {
        padding: 16px 16px 4px;
        border-right: 0;
        border-bottom: 1px solid var(--pd-line-soft);
        border-radius: 0;
    }

    .hero-demo-head {
        padding: 16px 16px 14px;
    }

    .hero-demo-sheet {
        padding: 16px 16px 40px;
    }

    .hero-demo .hero-demo-note {
        right: 12px;
        left: 12px;
        justify-content: center;
        font-size: 12px;
    }
}

/* ---------- главная: каталог договоров ---------- */

.home-catalog .landing-block-head {
    flex-wrap: wrap;
    margin-bottom: 36px;
}

.home-sections {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (min-width: 768px) {
    .home-sections {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1200px) {
    .home-sections {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.home-section {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 24px;
    border: 1px solid var(--pd-line);
    border-radius: 16px;
    background-color: var(--pd-surface-2);
}

.home-section .pd-icon {
    margin-bottom: 18px;
}

.home-section-name {
    margin-bottom: 6px;
    font-size: 22px;
}

.home-section-name a {
    color: var(--pd-ink);
    text-decoration: none;
}

.home-section-name a:hover {
    color: var(--pd-accent);
}

.home-section .home-section-summary {
    margin: 0;
    font-size: 14px;
    color: var(--pd-muted);
}

.home-section-chevron {
    display: none;
}

.home-section-docs {
    margin: 18px 0 0;
    padding: 14px 0 0;
    border-top: 1px solid var(--pd-line-soft);
    list-style: none;
}

.home-section-docs li + li {
    margin-top: 8px;
}

.home-section-docs a {
    position: relative;
    display: block;
    padding-left: 16px;
    font-size: 15px;
    line-height: 1.4;
    color: var(--pd-text);
    text-decoration: none;
}

.home-section-docs a::before {
    content: "›";
    position: absolute;
    left: 0;
    top: 0;
    font-weight: 600;
    color: var(--pd-accent);
}

.home-section-docs a:hover {
    color: var(--pd-accent);
}

/* «Все договоры раздела» — у низа карточки, есть документы или нет. */
.home-section-all {
    margin-top: auto;
    padding-top: 20px;
    font-size: 15px;
}

/* Телефон: список разделов строками, без документов; строка — ссылка. */
@media (max-width: 575.98px) {
    .home-sections {
        gap: 0;
        border-top: 1px solid var(--pd-line);
    }

    .home-section {
        flex-direction: row;
        align-items: center;
        gap: 14px;
        padding: 16px 0;
        border: 0;
        border-bottom: 1px solid var(--pd-line);
        border-radius: 0;
        background: none;
    }

    .home-section .pd-icon {
        margin: 0;
    }

    .home-section-text {
        flex: 1 1 auto;
        min-width: 0;
    }

    .home-section-name {
        margin-bottom: 2px;
        font-size: 18px;
    }

    .home-section-name a::after {
        content: "";
        position: absolute;
        inset: 0;
    }

    .home-section-docs,
    .home-section-all {
        display: none;
    }

    .home-section-chevron {
        display: block;
        font-size: 26px;
        line-height: 1;
        color: var(--pd-muted);
    }

    .home-block-title {
        margin-bottom: 24px;
    }

    .home-catalog .landing-block-head {
        margin-bottom: 20px;
    }
}