/* Общий слой дизайна (14.10.2026): фон, акцентный цвет, типографика текстовых блоков,
   кнопки, финальный CTA и cookie-уведомление. Подключается последним в header.php с ?v=<filemtime>,
   поэтому перекрывает styles.css/style.css без правки старых файлов. */
:root {
    --bg-page: #f6f5f0;
    --bg-card: #fff;
    --line: #e6e8e1;
    --text: #2b2e33;
    --muted: #5f646c;
    --accent: #6f9a2a;
    --accent-dark: #5e8622;
    --accent-soft: #f1f6e6;
    --radius: 14px;
}

body { background-color: var(--bg-page); }

/* ---------- Текстовые блоки на внутренних страницах ---------- */
.ua-page .ua-section h2 {
    font-size: 22px;
    line-height: 1.3;
    font-weight: 600;
    color: var(--text);
    margin: 0 0 12px;
}
.ua-page .ua-section h3 { font-size: 18px; font-weight: 600; color: var(--text); margin: 18px 0 6px; }
.ua-page .ua-section p { margin: 0 0 12px; line-height: 1.65; }
.ua-page .ua-section p:last-child { margin-bottom: 0; }
.ua-page .ua-section ul,
.ua-page .ua-section ol { margin: 0 0 12px; padding-left: 0; list-style: none; }
.ua-page .ua-section ul > li,
.ua-page .ua-section ol > li { position: relative; padding-left: 22px; margin: 0 0 8px; line-height: 1.6; }
.ua-page .ua-section ul > li:before {
    content: ''; position: absolute; left: 4px; top: .62em;
    width: 7px; height: 7px; border-radius: 50%; background: var(--accent);
}
.ua-page .ua-section ol { counter-reset: uiol; }
.ua-page .ua-section ol > li:before {
    counter-increment: uiol; content: counter(uiol) '.'; position: absolute; left: 0; top: 0;
    font-weight: 700; color: var(--accent);
}
.ua-page .ua-section a:not([class]),
.ua-page .ua-hero a:not([class]) { color: var(--accent-dark); text-decoration: underline; text-underline-offset: 2px; }
.ua-page .ua-section a:not([class]):hover { color: var(--accent); }

/* ---------- Кнопки ---------- */
.ui-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 12px 22px; border-radius: 10px; border: 1px solid var(--accent);
    background: var(--accent); color: #fff; font-weight: 600; font-size: 16px;
    text-decoration: none; cursor: pointer; transition: background .15s, color .15s;
}
.ui-btn:hover { background: var(--accent-dark); border-color: var(--accent-dark); color: #fff; }
.ui-btn--ghost { background: #fff; color: var(--accent-dark); border-color: #cfd8bd; }
.ui-btn--ghost:hover { background: var(--accent-soft); color: var(--accent-dark); border-color: var(--accent); }

/* ---------- Страница раздела с боковой колонкой (решения, угрозы) ---------- */
.ui-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 28px; align-items: start; margin-top: 8px; }
.ui-layout > main > .ua-section { margin-top: 0; }
.ui-aside { position: sticky; top: 130px; display: flex; flex-direction: column; gap: 16px; }
.ui-aside__card { background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; }
.ui-aside__card h3 { font-size: 18px; font-weight: 600; margin: 0 0 8px; color: var(--text); }
.ui-aside__card p { font-size: 15px; color: var(--muted); line-height: 1.5; margin: 0 0 14px; }
.ui-aside__card .ui-btn { width: 100%; }
.ui-aside__card ul { margin: 0; padding: 0; list-style: none; }
.ui-aside__card li + li { margin-top: 8px; }
.ui-aside__card li a { color: var(--accent-dark); font-size: 15px; text-decoration: none; }
.ui-aside__card li a:hover { text-decoration: underline; }
.ui-aside__card--accent { background: var(--accent-soft); border-color: #d6e4b8; }

.ua-page .ui-section { background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px 28px; margin: 0 0 18px; line-height: 1.6; font-size: 17px; color: #3a3e44; }
.ui-faq details { border-top: 1px solid var(--line); }
.ui-faq details:first-of-type { border-top: 0; }
.ui-faq summary { cursor: pointer; list-style: none; padding: 14px 36px 14px 0; font-weight: 600; font-size: 17px; position: relative; }
.ui-faq summary::-webkit-details-marker { display: none; }
.ui-faq summary:after { content: '+'; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); color: var(--accent); font-size: 22px; font-weight: 400; }
.ui-faq details[open] summary:after { content: '−'; }
.ui-faq details > p { margin: 0 0 14px; }
.ui-related { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.ua-page .ui-related a.ui-rel { display: block; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; color: var(--text); text-decoration: none; font-weight: 600; background: #fbfcf8; }
.ua-page .ui-related a.ui-rel:hover { border-color: var(--accent); color: var(--accent-dark); }

.ui-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; margin: 24px 0; }
.ui-card { display: flex; flex-direction: column; gap: 6px; background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 22px; color: var(--text); text-decoration: none; transition: border-color .15s, box-shadow .15s; }
a.ui-card:hover { border-color: #95B84D; box-shadow: 0 6px 22px rgba(60, 80, 20, .10); }
.ui-card b { font-size: 17px; font-weight: 600; }
.ui-card span { font-size: 15px; color: var(--muted); line-height: 1.5; }
.ui-card em { margin-top: auto; padding-top: 6px; font-style: normal; font-size: 14px; font-weight: 600; color: var(--accent); }

/* ---------- Финальный CTA перед футером ---------- */
.ui-final { padding: 40px 0; }
.ui-final__box {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px;
    background: #1d1f22; color: #c9cdd3; border-radius: 20px; padding: 34px 40px;
    background-image: radial-gradient(circle at 90% 10%, rgba(149, 184, 77, .25), transparent 45%);
}
.ui-final .ui-final__box p.ui-final__title { color: #fff; font-size: 26px; font-weight: 600; line-height: 1.25; margin: 0 0 8px; }
.ui-final .ui-final__box p { margin: 0; font-size: 16px; line-height: 1.5; max-width: 640px; }
.ui-final__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.ui-final .ui-btn--ghost { background: transparent; color: #fff; border-color: #4a4f57; }
.ui-final .ui-btn--ghost:hover { border-color: #95B84D; color: #fff; background: rgba(255, 255, 255, .05); }

/* ---------- Cookie-уведомление ---------- */
.ui-cookie {
    position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 120; max-width: 720px; margin: 0 auto;
    display: flex; align-items: center; gap: 16px; padding: 14px 18px; border-radius: 14px;
    background: #fff; border: 1px solid var(--line); box-shadow: 0 10px 34px rgba(0, 0, 0, .14);
    font-size: 14px; line-height: 1.45; color: var(--text);
}
.ui-cookie[hidden] { display: none; }
.ui-cookie a { color: var(--accent-dark); }
.ui-cookie .ui-btn { padding: 9px 18px; font-size: 14px; flex: 0 0 auto; }

@media (max-width: 1100px) {
    .ui-layout { grid-template-columns: 1fr; }
    .ui-aside { position: static; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
}
@media (max-width: 767px) {
    .ua-page .ui-section { padding: 18px; font-size: 15.5px; }
    .ua-page .ui-section h2 { font-size: 19px; }
    .ui-final__box { padding: 26px 22px; }
    .ui-final .ui-final__box p.ui-final__title { font-size: 21px; }
    .ui-final__actions, .ui-final__actions .ui-btn { width: 100%; }
    .ui-cookie { flex-direction: column; align-items: stretch; text-align: left; }
}
