/**
 * Слой дизайн-системы it-corp.ru (ITC) — серо-оранжевая, современная.
 * Подключается ПОСЛЕДНИМ (includes/header.php), поверх site.css и стилей страниц.
 * Значения — только токены из css/theme.css. Теней, градиентов, синего/зелёного/красного нет.
 * VERSION: 2026.11.13.1
 */

/* ===================== 1. База ===================== */
html { scroll-padding-top: 88px; }
body {
    font-family: var(--font-text);
    font-size: 16px;
    line-height: 1.6;
    color: var(--text);
    background-color: var(--ink-900);
    -webkit-font-smoothing: antialiased;
    padding-top: 72px;
}
.site-main { background-color: #FFFFFF; }
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--font-display);
    color: inherit;
    letter-spacing: -0.02em;
}
h1, .h1 { font-weight: 800; font-size: clamp(30px, 4vw, 44px); line-height: 1.1; }
h2, .h2 { font-weight: 800; font-size: clamp(26px, 3.2vw, 36px); line-height: 1.15; }
h3, .h3 { font-weight: 700; font-size: 22px; line-height: 1.2; letter-spacing: 0; }
h4, .h4 { font-weight: 700; font-size: 18px; line-height: 1.3; letter-spacing: 0; }
.lead { font-size: 19px; line-height: 1.6; font-weight: 400; }
p { max-width: none; }
code, kbd, pre, samp { font-family: var(--font-mono); }

/* Ссылки на светлом: оранжевый текстовый оттенок (контраст ≥ 4.5:1) */
.site-main a:not(.btn):not(.nav-link):not(.home-mp-chip):not(.label):not(.badge):not(.ds-card-link) {
    color: var(--orange-text);
}
.site-main a:not(.btn):not(.nav-link):not(.home-mp-chip):not(.label):not(.badge):not(.ds-card-link):hover {
    color: #8F3900;
}

/* Ссылки на тёмных блоках — светлые, при наведении оранжевые */
.site-main .jumbotron a:not(.btn), .site-main .section-dark a:not(.btn):not(.ds-card-link),
.site-main .ds-dark a:not(.btn):not(.ds-card-link) { color: var(--on-dark-soft) !important; }
.site-main .jumbotron a:not(.btn):hover, .site-main .section-dark a:not(.btn):not(.ds-card-link):hover,
.site-main .ds-dark a:not(.btn):not(.ds-card-link):hover { color: var(--orange) !important; }

/* Фокус всегда виден */
a:focus-visible, button:focus-visible, .btn:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible, summary:focus-visible {
    outline: 2px solid var(--orange) !important;
    outline-offset: 2px !important;
    box-shadow: none !important;
}

/* Метка-эйбро (маркер секции) */
.ds-eyebrow, .hero-eyebrow {
    display: inline-block;
    font-family: var(--font-mono);
    font-weight: 500;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--orange-text);
    margin: 0 0 16px;
}

/* ===================== 2. Шапка ===================== */
.navbar.navbar-inverse,
.navbar.navbar-inverse.navbar-fixed-top {
    background: var(--ink-900) !important;
    background-image: none !important;
    border: 0;
    border-bottom: 1px solid var(--ink-700);
    box-shadow: none !important;
    min-height: 72px;
}
.navbar > .container { max-width: 1200px; width: auto; padding-inline: 32px; }
.navbar-header .navbar-brand.ds-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 72px;
    padding: 0;
    margin-left: 0 !important;
    color: var(--on-dark);
}
.ds-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--orange);
    color: var(--text);
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 15px;
    letter-spacing: 0;
}
.ds-brand-caption {
    font-family: var(--font-mono);
    font-weight: 500;
    font-size: 12px;
    letter-spacing: 0.04em;
    color: #AEB6C2;
    white-space: nowrap;
}
.navbar .navbar-nav > li > a.nav-link {
    font-family: var(--font-text);
    font-weight: 500;
    font-size: 15px;
    color: var(--on-dark-soft) !important;
    padding-top: 26px;
    padding-bottom: 26px;
    background: transparent !important;
    transition: color var(--ease);
}
.navbar .navbar-nav > li > a.nav-link:hover,
.navbar .navbar-nav > li > a.nav-link:focus,
.navbar .navbar-nav > li.open > a.nav-link,
.navbar .navbar-nav > li.active > a.nav-link {
    color: var(--orange) !important;
    background: transparent !important;
}
.navbar .navbar-nav > li.active > a::after { background: var(--orange); left: 12px; right: 12px; }
.navbar .navbar-nav > li.dropdown > .dropdown-menu {
    background: var(--ink-900);
    border: 1px solid var(--ink-700);
    border-radius: 14px;
    box-shadow: none;
    padding: 8px;
    min-width: 230px;
}
.navbar .navbar-nav > li.dropdown > .dropdown-menu > li > a {
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 15px;
    color: var(--on-dark-soft);
}
.navbar .navbar-nav > li.dropdown > .dropdown-menu > li > a i { color: var(--on-dark-dim); }
.navbar .navbar-nav > li.dropdown > .dropdown-menu > li > a:hover,
.navbar .navbar-nav > li.dropdown > .dropdown-menu > li > a:focus,
.navbar .navbar-nav > li.dropdown > .dropdown-menu > li.active > a {
    background: var(--ink-800);
    color: var(--orange);
}
.navbar .navbar-nav > li.dropdown > .dropdown-menu > li > a:hover i { color: var(--orange); }
.navbar .navbar-nav > li.dropdown > .dropdown-menu > .divider { background: var(--ink-700); }

/* Кнопки в шапке: «Кабинет» — контурная, «Консультация» — оранжевая таблетка */
.navbar .navbar-nav-lk { display: flex; align-items: center; gap: 8px; height: 72px; }
.navbar .navbar-nav-lk > li > a.nav-lk-btn,
.navbar .navbar-nav-lk > li > a.ds-nav-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    margin: 0 !important;
    padding: 0 18px !important;
    border-radius: var(--r-pill);
    font-weight: 600;
    line-height: 1;
}
.navbar .navbar-nav-lk > li > a.nav-lk-btn {
    border: 1px solid var(--ink-400);
    color: var(--on-dark) !important;
    background: transparent !important;
}
.navbar .navbar-nav-lk > li > a.nav-lk-btn:hover,
.navbar .navbar-nav-lk > li > a.nav-lk-btn:focus { border-color: var(--orange); color: var(--orange) !important; }
.navbar .navbar-nav-lk > li > a.ds-nav-cta {
    background: var(--orange) !important;
    color: var(--text) !important;
    border: 1px solid var(--orange);
}
.navbar .navbar-nav-lk > li > a.ds-nav-cta:hover,
.navbar .navbar-nav-lk > li > a.ds-nav-cta:focus { background: var(--orange-hover) !important; }
.navbar .navbar-nav-lk > li > a::after { display: none !important; }

@media (min-width: 768px) and (max-width: 1199px) {
    .ds-brand-caption { display: none; }
    .navbar > .container { padding-inline: 20px; }
    .navbar .navbar-nav > li > a.nav-link { padding-left: 8px; padding-right: 8px; font-size: 14px; }
    .navbar .navbar-nav-lk > li > a.nav-lk-btn,
    .navbar .navbar-nav-lk > li > a.ds-nav-cta { padding: 0 14px !important; }
    .navbar .navbar-nav-lk .nav-lk-text { display: none; }
}
@media (min-width: 768px) and (max-width: 991px) {
    .navbar .navbar-nav > li > a.nav-link { padding-left: 5px; padding-right: 5px; font-size: 13px; }
    .navbar .navbar-nav-lk > li > a.ds-nav-cta { padding: 0 12px !important; font-size: 13px; }
}
@media (max-width: 767px) {
    .navbar > .container { padding-inline: 20px; }
    .navbar-header { display: flex; align-items: center; justify-content: space-between; }
    .navbar-header .navbar-toggle {
        order: 2; margin: 0; min-width: 44px; min-height: 44px;
        border: 1px solid var(--ink-500); border-radius: 12px; background: transparent !important;
    }
    .navbar-header .navbar-brand.ds-brand { order: 1; }
    .navbar-collapse { background: var(--ink-900); border-top: 1px solid var(--ink-700) !important; max-height: calc(100vh - 72px); }
    .navbar .navbar-nav > li > a.nav-link { padding-top: 14px; padding-bottom: 14px; min-height: 48px; }
    .navbar .navbar-nav > li.dropdown > .dropdown-menu > li > a { min-height: 48px; display: flex; align-items: center; }
    .navbar .navbar-nav-lk { height: auto; flex-wrap: wrap; padding: 8px 0 16px; margin: 0; }
}

/* ===================== 3. Кнопки ===================== */
.btn {
    font-family: var(--font-text);
    font-weight: 600;
    border-radius: var(--r-pill) !important;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transition: background-color var(--ease), border-color var(--ease), color var(--ease), transform var(--ease);
}
.btn:not(.btn-xs):not(.btn-sm):not(.btn-link) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    padding: 0 24px;
    font-size: 16px;
    line-height: 1.2;
}
.btn.btn-lg:not(.btn-xs):not(.btn-sm) { min-height: 54px; padding: 0 28px; font-size: 16px; }
.btn:active { transform: translateY(1px); }

/* Основная: оранжевая, текст тёмный */
.btn-accent, .btn.btn-accent, .btn-primary, .btn.btn-primary, .btn-accent-alt,
.hero-actions .btn.btn-accent, .hero-actions .btn.btn-accent-alt {
    background: var(--orange) !important;
    border: 1px solid var(--orange) !important;
    color: var(--text) !important;
}
.btn-accent:hover, .btn-accent:focus, .btn-primary:hover, .btn-primary:focus,
.hero-actions .btn.btn-accent:hover, .hero-actions .btn.btn-accent-alt:hover {
    background: var(--orange-hover) !important;
    border-color: var(--orange-hover) !important;
    color: var(--text) !important;
}
/* Контурная на светлом */
.btn-secondary, .btn.btn-secondary, .btn-default, .btn.btn-default {
    background: transparent !important;
    border: 1px solid var(--ink-900) !important;
    color: var(--text) !important;
}
.btn-secondary:hover, .btn-secondary:focus, .btn-default:hover, .btn-default:focus {
    background: var(--ink-900) !important;
    color: #FFFFFF !important;
}
/* Тёмная на светлом (вместо зелёной/синей) */
.btn-dark, .btn-success, .btn-info {
    background: var(--ink-900) !important;
    border: 1px solid var(--ink-900) !important;
    color: #FFFFFF !important;
}
.btn-dark:hover, .btn-success:hover, .btn-info:hover { background: var(--ink-700) !important; border-color: var(--ink-700) !important; }
.btn-danger, .btn-warning {
    background: transparent !important;
    border: 1px solid var(--orange-text) !important;
    color: var(--orange-text) !important;
}
/* Контурная на тёмном: в hero, тёмных секциях, тёмных карточках, подвале */
.jumbotron .btn:not(.btn-accent):not(.btn-primary):not(.btn-accent-alt),
.section-dark .btn:not(.btn-accent):not(.btn-primary),
.ds-dark .btn:not(.btn-accent):not(.btn-primary),
.price-box .btn:not(.btn-accent):not(.btn-primary),
footer .btn:not(.btn-accent):not(.btn-primary),
.btn-on-dark, .btn-hero-secondary {
    background: transparent !important;
    border: 1px solid var(--ink-400) !important;
    color: #FFFFFF !important;
}
.jumbotron .btn:not(.btn-accent):not(.btn-primary):not(.btn-accent-alt):hover,
.section-dark .btn:not(.btn-accent):not(.btn-primary):hover,
.ds-dark .btn:not(.btn-accent):not(.btn-primary):hover,
.price-box .btn:not(.btn-accent):not(.btn-primary):hover,
.btn-on-dark:hover, .btn-hero-secondary:hover {
    border-color: var(--orange) !important;
    color: var(--orange) !important;
    background: transparent !important;
}

/* ===================== 4. Первый экран (тёмный, с сеткой 56px) ===================== */
.jumbotron {
    background-color: var(--ink-900) !important;
    background-image:
        linear-gradient(var(--grid-line) 1px, transparent 1px),
        linear-gradient(90deg, var(--grid-line) 1px, transparent 1px) !important;
    background-size: 56px 56px !important;
    background-position: -1px -1px;
    color: var(--on-dark-soft);
    padding: clamp(56px, 7vw, 96px) 0;
    margin-bottom: 0;
    border-bottom: 1px solid var(--ink-700);
}
.jumbotron.jumbotron-compact { padding: clamp(40px, 5vw, 64px) 0; }
.jumbotron > .container { max-width: 1200px; width: auto; padding-inline: 32px; }
.jumbotron h1 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: clamp(32px, 4.4vw, 56px);
    line-height: 1.06;
    letter-spacing: -0.03em;
    color: var(--on-dark);
    margin-top: 0;
}
.jumbotron h1 i.fa { color: var(--orange); }
.jumbotron .lead, .jumbotron p { color: var(--on-dark-muted); max-width: 620px; }
.jumbotron .lead { font-size: 19px; }
.jumbotron a:not(.btn) { color: var(--on-dark-soft); }
.jumbotron a:not(.btn):hover { color: var(--orange); }
.jumbotron .hero-eyebrow, .jumbotron .ds-eyebrow {
    color: var(--orange);
    border: 1px solid var(--ink-500);
    border-radius: var(--r-pill);
    padding: 8px 14px;
}
.mpl-breadcrumb { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.04em; color: var(--on-dark-dim); opacity: 1; }
.jumbotron .mpl-breadcrumb a { color: var(--on-dark-soft) !important; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-pill, .hero-pills .hero-pill {
    background: var(--chip-dark) !important;
    border: 0 !important;
    border-radius: var(--r-pill) !important;
    color: var(--on-dark-soft) !important;
    font-size: 13px;
    padding: 6px 14px;
}
.hero-pill i { color: var(--orange); }
.hero-mp-links a { color: var(--on-dark-soft) !important; border-bottom: 1px solid var(--ink-500); text-decoration: none !important; }
.hero-mp-links a:hover { color: var(--orange) !important; border-color: var(--orange); }

/* ===================== 5. Секции и контейнер ===================== */
.site-main > .container, .mpl-page, .section-block > .container, .section-dark > .container {
    max-width: 1200px;
    width: auto;
    padding-inline: 32px;
}
.section-block { background: #FFFFFF; padding: var(--space-section) 0; }
.section-block.section-gray, .section-gray { background: var(--gray-50); }
.section-dark, .ds-dark {
    background: var(--ink-900) !important;
    color: var(--on-dark-soft);
    padding: var(--space-section) 0;
}
.section-dark h2, .section-dark h3, .ds-dark h2, .ds-dark h3 { color: var(--on-dark); }
.section-dark p, .ds-dark p { color: var(--on-dark-muted); }
.page-header { border-bottom: 0; padding-bottom: 0; margin: 0 0 24px; }
.page-header h2 { font-family: var(--font-display); font-weight: 800; color: var(--text); }
.page-header h2 i.fa, .marketplace-box h2 i.fa, .marketplace-box h3 i.fa { color: var(--orange-text); }
.page-header .lead { color: var(--text-muted); }

/* ===================== 6. Карточки ===================== */
.marketplace-box, .ui-card, .mpl-page .marketplace-box {
    background: #FFFFFF;
    border: 1px solid var(--gray-200);
    border-radius: var(--r-tool);
    box-shadow: none !important;
    padding: 32px;
}
.marketplace-box:hover, .ui-card:hover { box-shadow: none !important; }
a.ui-card:hover, a.ui-card-link:hover, a.marketplace-box:hover, .ds-card-link:hover { border-color: var(--orange); }
.panel { border-radius: 16px; border-color: var(--gray-200); box-shadow: none; }
/* Финальный тёмный блок (CTA) */
.price-box {
    background: var(--ink-900) !important;
    background-image: none !important;
    border: 1px solid var(--ink-700);
    border-radius: var(--r-card) !important;
    color: var(--on-dark-soft);
    box-shadow: none !important;
}
.price-box h2, .price-box h3 { color: var(--on-dark) !important; }
.price-box p { color: var(--on-dark-muted); }
.price-box a:not(.btn) { color: var(--orange) !important; }
/* Чипы */
.home-mp-chip {
    border: 1px solid var(--gray-200) !important;
    background: #FFFFFF !important;
    border-radius: var(--r-pill) !important;
    color: var(--text) !important;
    box-shadow: none !important;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    transition: border-color var(--ease), color var(--ease);
}
.home-mp-chip:hover { border-color: var(--orange) !important; color: var(--orange-text) !important; }
.home-mp-chip-more { border-color: var(--ink-900) !important; }
/* Галочки и статусы — оранжевый текстовый оттенок вместо зелёного/синего/красного */
.text-success, .text-info, .text-primary { color: var(--orange-text) !important; }
.text-danger, .text-warning { color: var(--orange-text) !important; }
.text-accent { color: var(--orange-text) !important; }

/* ===================== 7. Таблицы ===================== */
.table > thead.table-head-brand > tr > th,
.table-head-brand, .table-head-brand > tr > th {
    background: var(--ink-900) !important;
    color: #FFFFFF !important;
    border-color: var(--ink-700) !important;
    font-family: var(--font-text);
    font-weight: 600;
}
.table-bordered, .table-bordered > thead > tr > th, .table-bordered > tbody > tr > td,
.table-bordered > tbody > tr > th, .table > tbody > tr > td, .table > tbody > tr > th { border-color: var(--gray-200); }
/* Таблица возможностей: тёмная шапка — белый текст */
.mpp-table > thead > tr > th, .mpp-table thead .mpp-mp a { color: #FFFFFF !important; }
.mpp-chip.is-active { background: var(--ink-900) !important; border-color: var(--ink-900) !important; color: #FFFFFF !important; }
.mpp-preset.is-active { background: var(--orange) !important; border-color: var(--orange) !important; color: var(--text) !important; }
.mpp-preset, .mpp-chip { border-radius: var(--r-pill) !important; min-height: 36px; }
.mpp-scroll { border-color: var(--gray-200) !important; border-radius: 16px !important; }
.mpp-stat { border-radius: 16px; border-left-color: var(--orange) !important; }

/* ===================== 8. Формы ===================== */
.form-control {
    height: 52px;
    border-radius: var(--r-field) !important;
    border: 1px solid var(--gray-300);
    background: #FFFFFF;
    color: var(--text);
    font-size: 16px;
    padding: 12px 16px;
    box-shadow: none !important;
    transition: border-color var(--ease);
}
textarea.form-control { height: auto; min-height: 120px; }
.form-control:focus { border-color: var(--orange) !important; outline: 2px solid var(--orange); outline-offset: 0; }
label, .control-label { font-weight: 500; font-size: 14px; }
.input-group .form-control { border-radius: var(--r-field) 0 0 var(--r-field) !important; }
.input-group-btn .btn { border-radius: 0 var(--r-pill) var(--r-pill) 0 !important; min-height: 52px !important; }
.input-group-lg .form-control { height: 54px; }
/* Формы на тёмном */
.ds-dark .form-control, .section-dark .form-control, .jumbotron .form-control {
    background: var(--ink-900);
    border-color: var(--ink-500);
    color: #FFFFFF;
}
.ds-dark .form-control::placeholder, .jumbotron .form-control::placeholder { color: var(--on-dark-dim); }
.ds-dark label, .ds-dark .control-label { color: var(--on-dark-soft); }

/* ===================== 9. Уведомления ===================== */
.alert { border-radius: 16px; box-shadow: none; border: 1px solid var(--gray-300); background: var(--gray-50); color: var(--text); }
.alert-info, .alert-success { background: var(--gray-50) !important; border-color: var(--gray-300) !important; border-left: 4px solid var(--ink-700) !important; color: var(--text) !important; }
.alert-warning, .alert-danger { background: var(--orange-tint) !important; border-color: var(--orange) !important; border-left: 4px solid var(--orange) !important; color: var(--text) !important; }
.alert h4 { color: var(--text) !important; }
.alert i.fa { color: var(--orange-text); }
.label-success, .label-info, .label-primary, .badge-success { background: var(--ink-900) !important; color: #FFFFFF !important; }
.label-danger, .label-warning { background: var(--orange) !important; color: var(--text) !important; }

/* ===================== 10. Подвал ===================== */
footer {
    background: var(--ink-950) !important;
    background-image: none !important;
    color: var(--on-dark-muted);
    padding: 64px 0 32px;
    border-top: 1px solid var(--ink-700);
}
footer > .container { max-width: 1200px; width: auto; padding-inline: 32px; }
footer h4, footer h5 { color: var(--on-dark); font-family: var(--font-display); font-weight: 700; }
footer h4 i.fa, footer h5 i.fa { color: var(--orange); }
footer p { color: var(--on-dark-muted); }
footer a { color: var(--on-dark-muted) !important; }
footer a:hover, footer a:focus { color: var(--orange) !important; text-decoration: none; }
footer .itc-footer-col li { font-size: 14px; }
footer .itc-footer-col li a i.fa { color: var(--ink-400); }
footer .itc-footer-payments { border-top: 1px solid var(--ink-700); margin-top: 32px; padding-top: 24px; }
footer .site-typo-hint { color: var(--on-dark-dim); font-size: 12px; }
footer .keyButton { border: 1px solid var(--ink-600); border-radius: 8px; background: transparent; color: var(--on-dark-soft); }

/* ===================== 11. Cookies ===================== */
#cookie-notice {
    background: var(--ink-900) !important;
    background-image: none !important;
    border-top: 1px solid var(--ink-700);
    box-shadow: none !important;
    color: var(--on-dark-soft);
}
#cookie-notice p { color: var(--on-dark-muted); font-size: 14px; }
#cookie-notice i.fa-info-circle { color: var(--orange); }
#cookie-notice .link-accent { color: var(--orange) !important; }
#cookie-notice .btn-accept {
    background: var(--orange) !important;
    color: var(--text) !important;
    border: 0;
    border-radius: var(--r-pill);
    min-height: 44px;
    padding: 0 24px;
    font-weight: 600;
    box-shadow: none !important;
}
#cookie-notice .btn-accept:hover { background: var(--orange-hover) !important; }

/* ===================== 12. Адаптивность и движение ===================== */
@media (max-width: 767px) {
    .site-main > .container, .mpl-page, .section-block > .container, .section-dark > .container,
    .jumbotron > .container, footer > .container { padding-inline: 20px; }
    .marketplace-box, .ui-card, .mpl-page .marketplace-box { padding: 24px; }
    .lead, .jumbotron .lead { font-size: 17px; }
}
.ds-reveal { opacity: 0; transform: translateY(12px); transition: opacity 300ms ease, transform 300ms ease; }
.ds-reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition-duration: 0ms !important; animation-duration: 0ms !important; scroll-behavior: auto !important; }
    .ds-reveal { opacity: 1; transform: none; }
}

/* Контент сразу после первого экрана не «прилипает» к нему (2026.11.13) */
.jumbotron + .container:not(.mpl-page),
.jumbotron + div:not(.mpl-page):not(.code-app):not(.container-fluid) > .container:first-child { padding-top: clamp(32px, 4vw, 48px); }
.jumbotron + .container.mpl-page { padding-top: 16px; }