/* Zatonirui Concept — Rules 500 v1.0.26
   Общая типографика внутренних страниц и SP Page Builder.
   Основные параметры меняются в админке шаблона: «Заголовки / Правила 500».
*/

:root {
    --zt500-page-width: 1400px;
    --zt500-text: #151923;
    --zt500-muted: rgba(21, 25, 35, 0.70);
    --zt500-card: rgba(255, 255, 255, 0.92);
    --zt500-border: rgba(21, 25, 35, 0.10);
    --zt500-shadow: 0 22px 62px rgba(17, 24, 39, 0.08);
    --zt500-radius: 22px;
    --zt500-accent: #8f969d;

    --zt500-h1-min: 32px;
    --zt500-h1-max: 50px;
    --zt500-h1-weight: 600;
    --zt500-h2-min: 26px;
    --zt500-h2-max: 42px;
    --zt500-h2-weight: 500;
    --zt500-h3-min: 18px;
    --zt500-h3-max: 24px;
    --zt500-h3-weight: 600;
    --zt500-text-min: 16px;
    --zt500-text-max: 19px;
}

/*
    Страница / фрагмент Правила 500.
    Использование:
    <section class="zt-page500">
        <div class="zt-page500__shell">
            <div class="zt-page500__head"><h1>...</h1></div>
            <section class="zt-page500__section">
                <div class="zt-page500__section-head"><h2>...</h2></div>
            </section>
        </div>
    </section>
*/
body.zt-rules500-enabled .zt-page500 {
    width: 100%;
    max-width: 100%;
    color: var(--zt500-text);
    font-family: inherit;
}

body.zt-rules500-enabled .zt-page500,
body.zt-rules500-enabled .zt-page500 * {
    box-sizing: border-box;
}

body.zt-rules500-enabled .zt-page500__shell {
    width: 100%;
    max-width: var(--zt500-page-width);
    margin: 0 auto;
    padding: clamp(42px, 5vw, 78px) 0;
}

body.zt-rules500-enabled .zt-page500__head,
body.zt-rules500-enabled .zt-page500__section-head {
    width: 100%;
    max-width: var(--zt500-page-width);
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

body.zt-rules500-enabled .zt-page500__head {
    margin-bottom: clamp(28px, 4vw, 46px);
}

body.zt-rules500-enabled .zt-page500__section-head {
    margin-bottom: clamp(18px, 2.8vw, 30px);
}

body.zt-rules500-enabled .zt-page500__head > h1,
body.zt-rules500-enabled .zt-page500 h1.zt-page500__title {
    margin: 0;
    padding: 0;
    color: var(--zt500-text);
    font-family: var(--zt-heading-font-family);
    font-size: clamp(var(--zt500-h1-min), 3.4vw, var(--zt500-h1-max));
    line-height: 1.12;
    font-weight: var(--zt500-h1-weight);
    letter-spacing: -0.045em;
}

body.zt-rules500-enabled .zt-page500__head > h1::after,
body.zt-rules500-enabled .zt-page500 h1.zt-page500__title::after {
    content: "";
    display: block;
    width: 58px;
    height: 2px;
    margin: 24px auto 0;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, var(--zt500-accent), transparent);
    opacity: 0.9;
}

body.zt-rules500-enabled .zt-page500__section-head > h2,
body.zt-rules500-enabled .zt-page500 h2.zt-page500__section-title {
    margin: 0;
    padding: 0;
    color: var(--zt500-text);
    font-family: var(--zt-heading-font-family);
    font-size: clamp(var(--zt500-h2-min), 2.6vw, var(--zt500-h2-max));
    line-height: 1.14;
    font-weight: var(--zt500-h2-weight);
    letter-spacing: -0.04em;
}

body.zt-rules500-enabled .zt-page500 h3,
body.zt-rules500-enabled .zt-page500 .zt-page500__card-title {
    color: var(--zt500-text);
    font-family: var(--zt-heading-font-family);
    font-size: clamp(var(--zt500-h3-min), 1.45vw, var(--zt500-h3-max));
    line-height: 1.22;
    font-weight: var(--zt500-h3-weight);
    letter-spacing: -0.025em;
}

body.zt-rules500-enabled .zt-page500 p,
body.zt-rules500-enabled .zt-page500 li,
body.zt-rules500-enabled .zt-page500 td,
body.zt-rules500-enabled .zt-page500 th {
    font-size: clamp(var(--zt500-text-min), 1.1vw, var(--zt500-text-max));
    line-height: 1.6;
}

body.zt-rules500-enabled .zt-page500__card {
    width: 100%;
    overflow: hidden;
    border: 1px solid var(--zt500-border);
    border-radius: var(--zt500-radius);
    background:
        radial-gradient(circle at 10% 0%, rgba(255,255,255,0.98), rgba(255,255,255,0) 42%),
        var(--zt500-card);
    box-shadow: var(--zt500-shadow);
    backdrop-filter: blur(12px);
}

/*
    Глобальный режим для SP Page Builder.
    Inline-стили SP и более специальные классы самого блока остаются приоритетнее.
    Чтобы отключить на секции SP, добавьте класс zt-rules500-off или zt500-off.
*/
body.zt-rules500-enabled.zt-rules500-sp-global .zt-content .sppb-section:not(.zt-rules500-off):not(.zt500-off) h1,
body.zt-rules500-enabled.zt-rules500-sp-global .zt-content .sppb-section:not(.zt-rules500-off):not(.zt500-off) .sppb-addon-title.sppb-h1 {
    color: var(--zt500-text);
    font-family: var(--zt-heading-font-family);
    font-size: clamp(var(--zt500-h1-min), 3.4vw, var(--zt500-h1-max));
    line-height: 1.12;
    font-weight: var(--zt500-h1-weight);
    letter-spacing: -0.045em;
}

body.zt-rules500-enabled.zt-rules500-sp-global .zt-content .sppb-section:not(.zt-rules500-off):not(.zt500-off) h2,
body.zt-rules500-enabled.zt-rules500-sp-global .zt-content .sppb-section:not(.zt-rules500-off):not(.zt500-off) .sppb-section-title .sppb-title-heading,
body.zt-rules500-enabled.zt-rules500-sp-global .zt-content .sppb-section:not(.zt-rules500-off):not(.zt500-off) .sppb-addon-title {
    color: var(--zt500-text);
    font-family: var(--zt-heading-font-family);
    font-size: clamp(var(--zt500-h2-min), 2.6vw, var(--zt500-h2-max));
    line-height: 1.14;
    font-weight: var(--zt500-h2-weight);
    letter-spacing: -0.04em;
}

body.zt-rules500-enabled.zt-rules500-sp-global .zt-content .sppb-section:not(.zt-rules500-off):not(.zt500-off) h3 {
    color: var(--zt500-text);
    font-family: var(--zt-heading-font-family);
    font-size: clamp(var(--zt500-h3-min), 1.45vw, var(--zt500-h3-max));
    line-height: 1.22;
    font-weight: var(--zt500-h3-weight);
    letter-spacing: -0.025em;
}

body.zt-rules500-enabled.zt-rules500-sp-global .zt-content .sppb-section:not(.zt-rules500-off):not(.zt500-off) p,
body.zt-rules500-enabled.zt-rules500-sp-global .zt-content .sppb-section:not(.zt-rules500-off):not(.zt500-off) li,
body.zt-rules500-enabled.zt-rules500-sp-global .zt-content .sppb-section:not(.zt-rules500-off):not(.zt500-off) td,
body.zt-rules500-enabled.zt-rules500-sp-global .zt-content .sppb-section:not(.zt-rules500-off):not(.zt500-off) th {
    font-size: clamp(var(--zt500-text-min), 1.1vw, var(--zt500-text-max));
    line-height: 1.6;
}

@media (max-width: 760px) {
    body.zt-rules500-enabled .zt-page500__shell {
        padding: 38px 0 52px;
    }

    body.zt-rules500-enabled .zt-page500__head,
    body.zt-rules500-enabled .zt-page500__section-head {
        text-align: left;
    }

    body.zt-rules500-enabled .zt-page500__head > h1::after,
    body.zt-rules500-enabled .zt-page500 h1.zt-page500__title::after {
        margin-left: 0;
        margin-right: 0;
    }
}