/*
 * «Право и суд» theme on top of engine.css (bundles/seoengine/engine.css): plum accent #5b2a86
 * (nalog indigo #3730a3, kalendar crimson #8c1d3b, okved navy #1e3a5f). Tokens + this site's components only.
 * Mobile first (320 px and up), no fixed widths; wide tables scroll inside .table-wrap, not the page.
 *
 * Contrast (WCAG AA >= 4.5:1): light accent/link #5b2a86 on #fff 9.9:1, white on accent 9.9:1;
 * dark accent #d2b8f0 on the dark card background >= 9:1, #26103d on accent >= 9:1.
 */
:root {
    --c-accent: #5b2a86;
    --c-link: #5b2a86;
    --c-focus: #5b2a86;
    --c-accent-soft: #f3edf8;
    --c-on-accent: #fff;
    --c-error: #b42318;
}

@media (prefers-color-scheme: dark) {
    :root {
        --c-accent: #d2b8f0;
        --c-link: #dcc6f5;
        --c-focus: #dcc6f5;
        --c-accent-soft: #2a1a3d;
        --c-on-accent: #26103d;
        --c-error: #ff9b8f;
    }
}

/* ---------- Header ---------- */
.site-nav { display: flex; flex-wrap: wrap; gap: 0 var(--s-4); margin-left: auto; }
.site-nav a { display: inline-block; min-height: 44px; padding: 11px 0; color: var(--c-text); text-decoration: none; font-size: var(--fs-sm); }
.site-nav a:hover { color: var(--c-link); text-decoration: underline; }

/* Home, section pages and calculator tiles: engine home kit (engine-home.css, docs/engine-home-kit.md); only the plum tokens above are this site's. */

/* Calculator form (.form-grid, .field, .form-actions, date field): packages/engine/public/engine-forms.css */

/* ---------- Result ---------- */
.result { scroll-margin-top: var(--s-4); }
.result-main { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: var(--s-4); margin: 0 0 var(--s-4); }
.result-main dt { font-size: var(--fs-sm); color: var(--c-muted); }
.result-main dd { margin: 0; font-family: var(--font-display); font-size: 1.625rem; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums lining-nums; overflow-wrap: anywhere; }
.result-main dd .unit { font-family: var(--font); font-size: var(--fs-base); font-weight: 600; color: var(--c-muted); }
.result .kv { margin-bottom: var(--s-3); }
.result p.small { margin: var(--s-2) 0 0; }
.result-table { margin: var(--s-4) 0; }
.table caption { padding: var(--s-2) var(--s-3); text-align: left; font-weight: 600; caption-side: top; }
.table td, .result-table th[scope="row"] { font-variant-numeric: tabular-nums lining-nums; }
.result-table td { text-align: right; white-space: nowrap; }
.result-table tfoot th, .result-table tfoot td { font-weight: 700; border-top: 2px solid var(--c-border-strong); }
.caution { margin: 0 0 var(--s-4); font-size: var(--fs-sm); }
.caution p { margin: 0 0 var(--s-1); }
.badge--warn { background: var(--c-warn-soft); border: 1px solid var(--c-warn-border); color: var(--c-text); }

/* ---------- Ads, disclaimers, change log ---------- */
.ad__label { margin: 0 0 var(--s-1); font-size: var(--fs-xs); color: var(--c-muted); text-transform: uppercase; letter-spacing: .04em; }
.disclaimer--before, .disclaimer--after { margin: 0 0 var(--s-3); color: var(--c-muted); }
.disclaimer--after { margin: var(--s-3) 0 0; }
.norm-changes { list-style: none; margin: 0 0 var(--s-5); padding: 0; }
.norm-changes li { padding: var(--s-3) 0; border-bottom: 1px solid var(--c-border); }
.norm-changes h2 { margin: 0 0 var(--s-1); font-size: var(--fs-h3); }

/* ---------- How it is calculated, footer ---------- */
.how ol, .how ul { padding-left: 1.25rem; }
.site-footer .disclaimer { color: var(--c-text); }

/* ---------- Wider screens ---------- */
@media (min-width: 960px) {
    .result-main dd { font-size: 2rem; }
}