/* ==== Переменные: брендбук менять только здесь ==== */
:root {
  /* цвет */
  --fon: #f6f7f9;              /* страница */
  --poverhnost: #ffffff;       /* шапка, таблицы, блоки */
  --tekst: #0b1533;            /* основной текст */
  --tekst-priglush: #565d6d;   /* подписи, мелкий текст */
  --oshibka: #a12d24;          /* ошибки формы */
  --liniya: #e2e5ec;           /* тонкие линии */
  --liniya-zhirnaya: #0b1533;  /* верх и низ таблицы, как в расчётном листе */
  --aktsent: #2f45c8;          /* единственный акцент: ссылки и заливка главной кнопки */
  --aktsent-temnyj: #2335a3;   /* ссылка и кнопка при наведении */
  --aktsent-fon: #eef0fb;      /* заливка шапки таблицы и строки при наведении */
  --na-aktsente: #ffffff;      /* текст на акцентном фоне */
  --na-aktsente-priglush: #dfe3fb; /* приглушённый текст на акцентном фоне */
  --podval-fon: #0b1533;       /* подвал */
  --podval-tekst: #c5cad8;     /* текст в подвале */
  --zaglushka: #d5d9e3;        /* плашки вместо скрытых цифр образца */
  --ten: 0 1px 2px rgba(11, 21, 51, .06), 0 4px 16px rgba(11, 21, 51, .05); /* тень карточек */

  /* шрифт: только системные */
  --shrift-tekst: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --shrift-zagolovok: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --razmer-osn: 1.0625rem;
  --razmer-melko: 0.875rem;
  --razmer-rubrika: 0.75rem;
  --razmer-lid: 1.125rem;
  --razmer-h1: 1.5rem;
  --razmer-h2: 1.25rem;
  --razmer-h3: 1.125rem;
  --razmer-bolshaya-cifra: 3.5rem;
  --shrift-cifry: ui-monospace, "Cascadia Mono", Consolas, "Roboto Mono", monospace;
  --interval-tekst: 1.6;
  --interval-zagolovok: 1.25;

  /* отступы */
  --otstup-1: 0.25rem;
  --otstup-2: 0.5rem;
  --otstup-3: 1rem;
  --otstup-4: 1.5rem;
  --otstup-5: 2rem;
  --otstup-6: 3rem;
  --otstup-7: 4.5rem;

  /* сетка */
  --shirina-stranicy: 60rem;
  --shirina-teksta: 42rem;
  --polya: 1rem;               /* боковые поля, на телефоне 16 px */
  --tolschina-polosy: 4px;
  --kasanie: 2.75rem;          /* минимальная высота нажимаемой ссылки */
  --radius: 12px;              /* карточки, документ, полоса */
  --radius-melkij: 8px;        /* кнопки, выноска */
}

@media (min-width: 48rem) {
  :root {
    --razmer-h1: 1.75rem;
    --razmer-h2: 1.375rem;
    --polya: 2rem;
    --razmer-bolshaya-cifra: 5rem;
  }
}

/* ==== Основа ==== */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--fon);
  color: var(--tekst);
  font-family: var(--shrift-tekst);
  font-size: var(--razmer-osn);
  line-height: var(--interval-tekst);
  overflow-wrap: break-word;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.obertka {
  width: 100%;
  max-width: var(--shirina-stranicy);
  margin-inline: auto;
  padding-inline: var(--polya);
}

main.obertka {
  flex: 1 0 auto;
  padding-block: var(--otstup-5) var(--otstup-6);
}

/* ==== Текст ==== */
h1, h2, h3 {
  font-family: var(--shrift-zagolovok);
  font-weight: 700;
  line-height: var(--interval-zagolovok);
  margin: var(--otstup-5) 0 var(--otstup-3);
  max-width: var(--shirina-teksta);
}
h1 { font-size: var(--razmer-h1); margin-top: 0; }
h2 { font-size: var(--razmer-h2); }
h3 { font-size: var(--razmer-h3); }

p, ul, ol, blockquote { margin: 0 0 var(--otstup-3); max-width: var(--shirina-teksta); }
ul, ol { padding-left: var(--otstup-4); }
li + li { margin-top: var(--otstup-1); }

a { color: var(--aktsent); text-underline-offset: 0.18em; }
a:hover { color: var(--aktsent-temnyj); }
a:focus-visible { outline: 3px solid var(--aktsent); outline-offset: 2px; }

blockquote {
  padding-left: var(--otstup-3);
  border-left: var(--tolschina-polosy) solid var(--liniya);
  color: var(--tekst-priglush);
}

hr { border: 0; border-top: 1px solid var(--liniya); margin: var(--otstup-5) 0; }

img { max-width: 100%; height: auto; }

/* ==== Шапка и меню ==== */
.shapka { background: var(--poverhnost); border-bottom: 1px solid var(--liniya); }
.shapka .obertka { display: flex; align-items: center; gap: var(--otstup-4); min-height: 3.75rem; }
.logo { font-weight: 800; color: var(--tekst); text-decoration: none; white-space: normal; min-width: 0; flex-shrink: 1; }
.menyu a { display: inline-flex; align-items: center; min-height: var(--kasanie); font-size: var(--razmer-melko); color: var(--tekst); text-decoration: none; white-space: nowrap; }
.menyu a:hover { color: var(--aktsent); }
.shapka .knopka { min-height: 2.5rem; font-size: var(--razmer-melko); padding: 0 var(--otstup-3); white-space: nowrap; flex-shrink: 0; }
/* меню без JS: на ПК строка ссылок, на телефоне и планшете кнопка-«бургер» раскрывает тот же список */
.menyu-pk { display: flex; flex-wrap: wrap; gap: 0 var(--otstup-4); flex: 1; min-width: 0; }
.menyu-tel { display: none; }
.menyu-tel summary { list-style: none; cursor: pointer; display: grid; place-items: center; width: var(--kasanie); height: var(--kasanie); }
.menyu-tel summary::-webkit-details-marker { display: none; }
.menyu-tel summary span, .menyu-tel summary span::before, .menyu-tel summary span::after { display: block; width: 1.375rem; height: 2px; background: var(--tekst); content: ""; }
.menyu-tel summary span { position: relative; }
.menyu-tel summary span::before { position: absolute; top: -7px; }
.menyu-tel summary span::after { position: absolute; top: 7px; }
.menyu-tel[open] summary span { background: transparent; }
.menyu-tel[open] summary span::before { top: 0; transform: rotate(45deg); }
.menyu-tel[open] summary span::after { top: 0; transform: rotate(-45deg); }
.menyu-tel .menyu { position: absolute; left: 0; right: 0; top: 100%; z-index: 10; display: flex; flex-direction: column; padding: 0 var(--polya) var(--otstup-2); background: var(--poverhnost); border-bottom: 1px solid var(--liniya); box-shadow: var(--ten); }
.menyu-tel .menyu a { font-size: var(--razmer-osn); border-top: 1px solid var(--liniya); }
@media (max-width: 59.99rem) {
  .shapka { position: relative; }
  .shapka .obertka { justify-content: space-between; gap: var(--otstup-2); }
  .menyu-pk { display: none; }
  .menyu-tel { display: block; }
  .shapka .obertka > .knopka { margin-left: auto; }
}
@media (max-width: 29.99rem) { .shapka .obertka > .knopka { display: none; } }

/* ==== Подвал ==== */
.podval { margin-top: var(--otstup-6); background: var(--podval-fon); color: var(--podval-tekst); padding-block: var(--otstup-6) var(--otstup-5); font-size: var(--razmer-melko); }
.podval .obertka { display: grid; gap: var(--otstup-4); }
@media (min-width: 48rem) { .podval .obertka { grid-template-columns: 2fr 1fr 1fr; } }
.podval b { display: block; margin-bottom: var(--otstup-2); color: var(--na-aktsente); }
.podval a { display: inline-flex; align-items: center; min-height: 2rem; color: var(--podval-tekst); }
.podval a:hover { color: var(--na-aktsente); }
.podval p { margin-bottom: var(--otstup-1); max-width: none; }

/* ==== Таблицы: расчётный лист ==== */
.tablica {
  overflow-x: auto;
  margin: 0 0 var(--otstup-4);
  background: var(--poverhnost);
  border-top: 2px solid var(--liniya-zhirnaya);
  border-bottom: 2px solid var(--liniya-zhirnaya);
}
.tablica table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.tablica th,
.tablica td {
  padding: var(--otstup-2) var(--otstup-3);
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--liniya);
}
.tablica th { background: var(--aktsent-fon); font-weight: 600; white-space: nowrap; }
.tablica tr:last-child td { border-bottom: 0; }
.tablica td.chislo,
.tablica th.chislo { text-align: right; white-space: nowrap; }
/* таблицы из Markdown (---:): Python-Markdown ставит style="text-align: right;" */
.tablica td[style*="text-align: right"],
.tablica th[style*="text-align: right"] { white-space: nowrap; }

/* ==== Подпись статьи, лид ==== */
.lid { font-size: var(--razmer-lid); max-width: var(--shirina-teksta); }
.podpis { margin-top: var(--otstup-4); border-top: 1px solid var(--liniya); padding-top: var(--otstup-3); }

/* ==== Форма проверки тендера ==== */
.forma { max-width: var(--shirina-teksta); margin: var(--otstup-4) 0; }
.pole { margin-bottom: var(--otstup-3); }
.pole label { display: block; font-weight: 600; margin-bottom: var(--otstup-1, 0.25rem); }
.pole input:not([type="checkbox"]), .pole select, .pole textarea {
  display: block;
  width: 100%;
  min-height: var(--kasanie);
  padding: 0 var(--otstup-2);
  font: inherit;
  border: 1px solid var(--liniya-zhirnaya);
  background: var(--poverhnost);
  box-sizing: border-box;
}
.pole textarea { padding-block: var(--otstup-2); }
/* раскрывающийся блок «номера закупки нет»: маркер виден (list-item), высота = касание, текст по центру */
#bez-nomera summary { display: list-item; min-height: var(--kasanie); padding-block: calc((var(--kasanie) - 1.6em) / 2); margin-bottom: var(--otstup-3); font-weight: 600; cursor: pointer; }
.pole-soglasie { display: flex; gap: var(--otstup-2); align-items: flex-start; }
.pole-soglasie label { display: inline; font-weight: 400; }
.pole-soglasie input { width: 1.25rem; height: 1.25rem; flex: none; margin-top: 0.15rem; }
.podskazka { display: block; font-size: var(--razmer-melko); color: var(--tekst-priglush); }
.pole-oshibka input, .pole-oshibka select { border-color: var(--oshibka); }
ul.errorlist { list-style: none; padding: 0; margin: var(--otstup-1, 0.25rem) 0 0; color: var(--oshibka); font-size: var(--razmer-melko); }
.forma-oshibka { color: var(--oshibka); font-weight: 600; }
.forma-zakryta { padding: var(--otstup-3); background: var(--poverhnost); border-top: 1px solid var(--liniya); border-bottom: 1px solid var(--liniya); }
.knopka {
  min-height: var(--kasanie);
  padding: 0 var(--otstup-4);
  font: inherit;
  font-weight: 600;
  color: var(--na-aktsente);
  background: var(--aktsent);
  border: 2px solid var(--aktsent);
  border-radius: var(--radius-melkij);
  cursor: pointer;
}
.knopka:hover { background: var(--aktsent-temnyj); border-color: var(--aktsent-temnyj); }
a.knopka { display: inline-flex; align-items: center; text-decoration: none; }
a.knopka:hover { color: var(--na-aktsente); }

/* ==== Оглавление статьи: линии, номера списка видны, ссылки по высоте касания ==== */
nav.soderzhanie {
  margin: 0 0 var(--otstup-4);
  padding-block: var(--otstup-2);
  border-top: 1px solid var(--liniya);
  border-bottom: 1px solid var(--liniya);
}
nav.soderzhanie p { margin-bottom: 0; }
nav.soderzhanie ol { margin-bottom: 0; }
nav.soderzhanie li + li { margin-top: 0; }
nav.soderzhanie a { display: inline-flex; align-items: center; min-height: var(--kasanie); }

/* ==== Общие компоненты вида «ИИ-агент» (образец: .build-idea/dizajn-2026-10-10/glavnaya-ii-agent.html) ==== */
.akcent { color: var(--aktsent); }
.priglush { color: var(--tekst-priglush); }

/* рубрика над заголовком */
.rubrika { display: block; margin-bottom: var(--otstup-2); font-size: var(--razmer-rubrika); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--aktsent); }

/* кнопки-варианты: надеваются вместе с .knopka */
.knopka-kontur { background: transparent; color: var(--aktsent); }
.knopka-kontur:hover,
a.knopka-kontur:hover { background: var(--aktsent-fon); color: var(--aktsent-temnyj); }
.knopka-belaya { background: var(--poverhnost); color: var(--aktsent); border-color: var(--poverhnost); }
.knopka-belaya:hover,
a.knopka-belaya:hover { background: var(--aktsent-fon); border-color: var(--aktsent-fon); color: var(--aktsent-temnyj); }

/* разделы страницы */
.razdel { padding-block: var(--otstup-6); }
.razdel-belyj { background: var(--poverhnost); }
.razdel-zagolovok { max-width: var(--shirina-teksta); margin-bottom: var(--otstup-5); }

/* «документ»: образец ответа, цифры скрыты плашками */
.dokument { background: var(--poverhnost); border: 1px solid var(--liniya); border-radius: var(--radius); box-shadow: var(--ten); overflow: hidden; }
.dokument-shapka { display: flex; justify-content: space-between; gap: var(--otstup-3); padding: var(--otstup-3) var(--otstup-4); border-bottom: 1px solid var(--liniya); font-size: var(--razmer-melko); }
.dokument-shapka b { font-weight: 700; }
.dokument dl { margin: 0; padding: var(--otstup-2) var(--otstup-4); }
.dokument dl div { display: flex; justify-content: space-between; align-items: center; gap: var(--otstup-3); padding-block: var(--otstup-2); border-bottom: 1px solid var(--liniya); }
.dokument dl div:last-child { border-bottom: 0; }
.dokument dt { font-size: var(--razmer-melko); }
.dokument dd { margin: 0; font-family: var(--shrift-cifry); }
.plashka { display: inline-block; height: .75rem; border-radius: 4px; background: var(--zaglushka); vertical-align: middle; }
.plashka-2 { width: 2.5rem; }
.plashka-5 { width: 5rem; }
.plashka-6 { width: 6.5rem; }
.plashka-60 { width: 60%; }
.plashka-75 { width: 75%; }
.plashka-90 { width: 90%; }
.verdikt { display: inline-flex; align-items: center; gap: var(--otstup-2); padding: var(--otstup-1) var(--otstup-2); border-radius: 999px; background: var(--aktsent-fon); color: var(--aktsent); font-family: var(--shrift-tekst); font-size: var(--razmer-melko); font-weight: 600; }
.dopushcheniya { padding: var(--otstup-3) var(--otstup-4); background: var(--fon); border-top: 1px solid var(--liniya); font-size: var(--razmer-melko); }
.dopushcheniya p { margin-bottom: var(--otstup-2); font-weight: 600; }
.dopushcheniya span { display: block; margin-top: var(--otstup-2); }

/* большая цифра и столбец сумм */
.cifra-blok { display: grid; gap: var(--otstup-5); align-items: start; }
@media (min-width: 60rem) { .cifra-blok { grid-template-columns: 1fr 1.2fr; gap: var(--otstup-6); } }
.bolshaya-cifra { font-size: var(--razmer-bolshaya-cifra); font-weight: 800; line-height: 1; letter-spacing: -0.03em; color: var(--aktsent); font-variant-numeric: tabular-nums; margin-bottom: var(--otstup-3); }
.stroki { margin: 0; padding: 0; list-style: none; max-width: none; border-top: 2px solid var(--tekst); font-variant-numeric: tabular-nums; }
.stroki li { display: flex; justify-content: space-between; gap: var(--otstup-3); padding-block: var(--otstup-3); border-bottom: 1px solid var(--liniya); }
.stroki li + li { margin-top: 0; }
.stroki li b { white-space: nowrap; }
.stroki li.itog { border-bottom: 2px solid var(--tekst); font-weight: 700; }
.stroki li.itog b { color: var(--aktsent); }

/* сетка и карточки */
.setka { display: grid; gap: var(--otstup-3); }
@media (min-width: 48rem) {
  .setka-3 { grid-template-columns: repeat(3, 1fr); }
  .setka-2 { grid-template-columns: repeat(2, 1fr); }
  .setka-razbory { grid-template-columns: 1fr 1.2fr; }
}
.kartochka { background: var(--poverhnost); border: 1px solid var(--liniya); border-radius: var(--radius); padding: var(--otstup-4); box-shadow: var(--ten); }
.kartochka .nomer { display: block; margin-bottom: var(--otstup-3); font-size: var(--razmer-melko); font-weight: 700; color: var(--aktsent); font-variant-numeric: tabular-nums; }
.kartochka p:last-child { margin-bottom: 0; }

/* разбор: миниатюра документа + подпись */
.kartochka-razbor { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.miniatyura { padding: var(--otstup-4); background: var(--fon); border-bottom: 1px solid var(--liniya); font-family: var(--shrift-cifry); font-size: var(--razmer-rubrika); color: var(--tekst-priglush); }
.miniatyura i { font-style: normal; }
.miniatyura span { display: flex; justify-content: space-between; gap: var(--otstup-3); padding-block: var(--otstup-1); border-bottom: 1px dashed var(--liniya); }
.kartochka-razbor .telo { padding: var(--otstup-4); }
.chitat { font-weight: 600; text-decoration: none; }

/* статьи стопкой */
.stopka { display: grid; gap: var(--otstup-3); align-content: start; }
.kartochka-statya { display: flex; justify-content: space-between; align-items: center; gap: var(--otstup-3); padding: var(--otstup-3) var(--otstup-4); color: var(--tekst); text-decoration: none; }
.kartochka-statya b { display: block; line-height: 1.35; }
.kartochka-statya .rubrika { margin-bottom: var(--otstup-1); }
.kartochka-statya .strelka { flex: none; color: var(--aktsent); font-size: 1.25rem; }
.kartochka-statya:hover { border-color: var(--aktsent); color: var(--tekst); }

/* выноска: синяя полоса слева */
.vynoska { background: var(--poverhnost); border: 1px solid var(--liniya); border-left: 4px solid var(--aktsent); border-radius: var(--radius-melkij); padding: var(--otstup-4); max-width: 48rem; }
.vynoska p:last-child { margin-bottom: 0; }

/* частые вопросы без JS */
.voprosy { border-top: 1px solid var(--liniya); max-width: 48rem; }
.voprosy details { border-bottom: 1px solid var(--liniya); }
.voprosy summary { display: flex; justify-content: space-between; align-items: center; gap: var(--otstup-3); min-height: var(--kasanie); padding-block: var(--otstup-3); font-weight: 600; cursor: pointer; list-style: none; }
.voprosy summary::-webkit-details-marker { display: none; }
.voprosy summary::after { content: "+"; font-size: 1.5rem; line-height: 1; color: var(--aktsent); }
.voprosy details[open] summary::after { content: "−"; }
.voprosy details p { color: var(--tekst-priglush); }
.voprosy summary:focus-visible { outline: 3px solid var(--aktsent); outline-offset: 2px; }
/* то же без details: вопрос <h3>, ответ <p> (страницы отраслей и агентов из md) */
.voprosy h3 { margin: 0; padding-top: var(--otstup-3); border-top: 1px solid var(--liniya); }
.voprosy h3:first-child { border-top: 0; }
.voprosy h3 + p { margin: var(--otstup-1) 0 0; padding-bottom: var(--otstup-3); max-width: none; color: var(--tekst-priglush); }

/* синяя полоса с призывом */
.polosa, .blok-proverki { background: var(--aktsent); color: var(--na-aktsente); border-radius: var(--radius); padding: var(--otstup-5) var(--otstup-4); }
@media (min-width: 48rem) { .polosa, .blok-proverki { padding: var(--otstup-6); } }
.polosa h2, .blok-proverki h2 { color: var(--na-aktsente); }
.polosa p, .blok-proverki p { color: var(--na-aktsente-priglush); max-width: var(--shirina-teksta); }
.polosa a:not(.knopka) { color: var(--na-aktsente); }
/* блок «Проверим ваш тендер» в статье и разборе: та же полоса, разметка прежняя, ссылка выглядит белой кнопкой */
.blok-proverki { margin: var(--otstup-5) 0; }
.blok-proverki h2 { margin-top: 0; }
.blok-proverki a { display: inline-flex; align-items: center; min-height: var(--kasanie); padding: 0 var(--otstup-4); background: var(--poverhnost); color: var(--aktsent); font-weight: 600; text-decoration: none; border-radius: var(--radius-melkij); }
.blok-proverki a:hover { background: var(--aktsent-fon); color: var(--aktsent-temnyj); }

/* ==== Главная ==== */
/* разделы главной сами шире страницы (белые полосы на всю ширину), поля и ширину держит внутренний .obertka */
main.obertka:has(> .ekran) { max-width: none; padding: 0; }
.razdel h2, .razdel h3 { margin: 0 0 var(--otstup-3); }
.razdel-vtoroj { margin-top: var(--otstup-6); }

/* первый экран: текст слева, образец ответа справа; ничего не стоит между .lid и кнопками */
.ekran { padding-block: var(--otstup-4) var(--otstup-6); }
.ekran .obertka { display: grid; gap: var(--otstup-5); align-items: center; }
@media (min-width: 60rem) {
  .ekran { padding-block: var(--otstup-5) var(--otstup-6); }
  .ekran .obertka { grid-template-columns: 1.25fr 1fr; gap: var(--otstup-6); }
}
.ekran .lid { color: var(--tekst-priglush); max-width: 36rem; }
.ekran figure { margin: 0; }
.knopki { display: flex; flex-wrap: wrap; gap: var(--otstup-2) var(--otstup-3); margin-top: var(--otstup-4); }
.ssylka-demo { margin: var(--otstup-2) 0 0; }
.ssylka-demo a { display: inline-flex; align-items: center; min-height: var(--kasanie); font-weight: 600; }
.podpis-dokumenta { margin: var(--otstup-2) 0 0; font-size: var(--razmer-melko); color: var(--tekst-priglush); }

/* разбор целиком ссылка: цвет текста и без подчёркивания */
a.kartochka-razbor { color: var(--tekst); text-decoration: none; }
a.kartochka-razbor:hover { color: var(--tekst); border-color: var(--aktsent); }

/* ссылки под карточками: все разборы, все статьи, отрасли */
.ssylki { display: flex; flex-wrap: wrap; gap: 0 var(--otstup-4); max-width: none; margin: var(--otstup-4) 0 0; }
.ssylki a { display: inline-flex; align-items: center; min-height: var(--kasanie); }

/* форма на белой карточке внутри синей полосы: цвета текста возвращаем тёмными */
.polosa .kartochka { margin-top: var(--otstup-4); color: var(--tekst); }
.polosa .kartochka p { color: var(--tekst); max-width: var(--shirina-teksta); }
.polosa .kartochka .podskazka { color: var(--tekst-priglush); }
.polosa .kartochka .forma-oshibka { color: var(--oshibka); }
.polosa .kartochka a:not(.knopka) { color: var(--aktsent); }
.kartochka .forma { margin: 0; }