/* ==========================================================================
   kursy · «Онлайн-курсы и профессии» · base.css
   Сброс, типографика, сетка, шапка и подвал. Подключается после tokens.css, перед components.css.
   Стили пишутся от телефона; медиазапросы только min-width: 768px и min-width: 1200px.
   Заливки сплошные: объёма, размытия и переходов цвета в системе нет (05-design.md, раздел 5).

   ЧТО ЛЕЖИТ В ЭТОМ ФАЙЛЕ
   Сброс и служебное .... [hidden], .ku-sr — скрыто для глаза, .ku-sprite — спрайт иконок, .ku-skip — ссылка «К содержанию», .ku-lock — страница под листом
   Типографика .......... .ku-h1 .ku-h2 .ku-h3 .ku-h4 .ku-lead .ku-caps .ku-num .ku-empty .ku-kicker
   Иконка ............... .ku-icon  --sm --lg
   Сетка ................ .ku-container;  .ku-main;  .ku-section;
                          блок страницы .ku-block  __head __lead __link __foot (__foot--mobile) __note;
                          12 колонок .ku-grid  __main __side
   Шапка ................ .ku-header  __top __search __links __menu;  знак и название .ku-brand  __mark __text __name __sub;
                          строка разделов .ku-nav  __list;  поиск .ku-search, .ku-field  __icon __input;
                          подсказки .ku-suggest  __group __label __i __meta __none;  меню на телефоне .ku-menu  __top __body __list
   Подвал ............... .ku-footer  __top __about __cols __col __h __list __legal
   ========================================================================== */

/* ---------- сброс ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: var(--ku-bg); color: var(--ku-ink); font: var(--ku-fw-regular) var(--ku-fs-body)/var(--ku-lh-body) var(--ku-font-body); }
h1, h2, h3, h4, p, ul, ol, dl, dt, dd, figure, blockquote, table, fieldset, legend { margin: 0; padding: 0; }
ul, ol { list-style: none; }
fieldset { min-width: 0; border: 0; }
a { color: inherit; }
img, svg { display: block; }
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
button { cursor: pointer; }
th { font-weight: inherit; text-align: left; }
[hidden] { display: none !important; }
:focus-visible { outline: var(--ku-outline); outline-offset: var(--ku-outline-offset); }
::selection { background: var(--ku-accent-tint); color: var(--ku-ink); }
/* у Golos Text нет курсива: выделение — насыщенностью */
em, i { font-style: normal; font-weight: var(--ku-fw-semibold); }
b, strong { font-weight: var(--ku-fw-semibold); }

.ku-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ku-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
/* ссылка «К содержанию» — первая на странице, видна только при переходе клавишей Tab */
.ku-skip { position: absolute; left: var(--ku-s-2); top: var(--ku-s-2); z-index: var(--ku-z-overlay); padding: var(--ku-s-2) var(--ku-s-3); background: var(--ku-ink); color: var(--ku-bg); font-size: var(--ku-fs-small); line-height: var(--ku-lh-small); text-decoration: none; clip-path: inset(50%); }
.ku-skip:focus { clip-path: none; }
/* страница под открытым листом (меню, фильтры на телефоне) не прокручивается */
.ku-lock { overflow: hidden; }
/* любая обёртка с прокруткой — опорная для абсолютных потомков, иначе скрытые подписи .ku-sr раздвигают страницу */
.ku-table-wrap, .ku-tablebox, .ku-prose__table, .ku-cmp-wrap, .ku-secstrip, .ku-tabs, .ku-crumbs, .ku-nav__list, .ku-multi__list { position: relative; }

/* ---------- типографика ---------- */
.ku-h1 { font: var(--ku-fw-bold) var(--ku-fs-h1)/var(--ku-lh-h1) var(--ku-font-head); letter-spacing: var(--ku-ls-head); }
.ku-h2 { font: var(--ku-fw-semibold) var(--ku-fs-h2)/var(--ku-lh-h2) var(--ku-font-head); letter-spacing: var(--ku-ls-head); }
.ku-h3 { font: var(--ku-fw-semibold) var(--ku-fs-h3)/var(--ku-lh-h3) var(--ku-font-head); }
.ku-h4 { font: var(--ku-fw-semibold) var(--ku-fs-h4)/var(--ku-lh-h4) var(--ku-font-body); }
.ku-lead { max-width: var(--ku-measure); font-size: var(--ku-fs-lead); line-height: var(--ku-lh-lead); color: var(--ku-ink-2); }
/* подпись графы: моноширинный, прописные */
.ku-caps { font: var(--ku-fw-bold) var(--ku-fs-th)/var(--ku-lh-th) var(--ku-font-mono); letter-spacing: var(--ku-ls-caps); text-transform: uppercase; color: var(--ku-ink-2); }
/* число: цена, срок, дата, счётчик */
.ku-num { font-family: var(--ku-font-mono); font-size: var(--ku-fs-num); line-height: var(--ku-lh-num); font-variant-numeric: tabular-nums; white-space: nowrap; }
/* прочерк пустого значения и приглушённое дополнение */
.ku-empty { color: var(--ku-ink-2); }
/* кикер над H1: «Ведомость № 10/2026», тип страницы, рубрика */
.ku-kicker { display: inline-flex; align-items: center; gap: var(--ku-s-2); font: var(--ku-fw-bold) 12px/16px var(--ku-font-mono); letter-spacing: var(--ku-ls-caps); text-transform: uppercase; color: var(--ku-accent-deep); }
.ku-kicker::before { content: ""; flex: none; width: 20px; height: 0; border-top: 2px solid var(--ku-accent); }

/* ---------- иконка: линия 1,5 в сетке 24, прямые торцы ---------- */
.ku-icon { flex: none; width: var(--ku-icon-md); height: var(--ku-icon-md); fill: none; stroke: currentColor; stroke-width: var(--ku-icon-stroke); stroke-linecap: butt; stroke-linejoin: miter; }
.ku-icon--sm { width: var(--ku-icon-sm); height: var(--ku-icon-sm); stroke-width: 2; }
.ku-icon--lg { width: var(--ku-icon-lg); height: var(--ku-icon-lg); }

/* ---------- сетка ---------- */
.ku-container { width: 100%; max-width: var(--ku-container); margin: 0 auto; padding: 0 var(--ku-gutter); }
.ku-main { display: block; min-width: 0; }
.ku-section { margin-top: var(--ku-section-gap); min-width: 0; }
/* блок страницы: двойная линейка, заголовок слева, ссылка справа */
.ku-block__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: var(--ku-s-2) var(--ku-s-5); margin-bottom: var(--ku-block-gap); padding-top: var(--ku-s-3); border-top: var(--ku-rule-double); }
.ku-block__lead { grid-column: 1 / -1; max-width: var(--ku-measure); font-size: var(--ku-fs-ui); line-height: 22px; color: var(--ku-ink-2); }
.ku-block__head .ku-block__link { display: none; }
.ku-block__foot { margin-top: var(--ku-s-4); }
.ku-block__note { margin-top: var(--ku-s-3); max-width: var(--ku-measure); font-size: var(--ku-fs-note); line-height: var(--ku-lh-note); color: var(--ku-ink-2); }
/* 12 колонок: для раскладок «текст и колонка» */
.ku-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ku-s-8) var(--ku-grid-gap); }
.ku-grid > * { min-width: 0; }

/* ---------- шапка ---------- */
.ku-header { position: relative; background: var(--ku-bg); border-bottom: var(--ku-border); }
.ku-header__top { display: flex; align-items: center; gap: var(--ku-s-3); min-height: var(--ku-header-h); }
.ku-brand { display: flex; align-items: center; gap: var(--ku-s-2); margin-right: auto; text-decoration: none; }
.ku-brand__mark { flex: none; }
.ku-brand__text { display: grid; }
.ku-brand__name { font: var(--ku-fw-bold) 22px/24px var(--ku-font-head); letter-spacing: var(--ku-ls-head); }
.ku-brand__sub { display: none; font: var(--ku-fw-regular) 11px/12px var(--ku-font-mono); letter-spacing: var(--ku-ls-caps); text-transform: uppercase; color: var(--ku-ink-2); white-space: nowrap; }
.ku-header__search, .ku-header__links, .ku-nav { display: none; }

/* поиск и подсказки */
.ku-search { position: relative; min-width: 0; }
.ku-field { position: relative; display: flex; align-items: center; }
.ku-field__icon { position: absolute; left: 10px; color: var(--ku-ink-2); pointer-events: none; }
.ku-field__input { width: 100%; height: var(--ku-h-md); padding: 0 var(--ku-s-3) 0 38px; background: var(--ku-surface); border: var(--ku-border-control); border-radius: var(--ku-radius-1); font-size: var(--ku-fs-small); transition: border-color var(--ku-dur) var(--ku-ease); }
.ku-field__input::placeholder { color: var(--ku-ink-2); opacity: 1; }
.ku-field__input:hover { border-color: var(--ku-ink); }
.ku-field__input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.ku-suggest { position: absolute; top: calc(100% + var(--ku-s-1)); left: 0; right: 0; z-index: calc(var(--ku-z-sticky) + 1); max-height: 70vh; overflow-y: auto; background: var(--ku-surface); border: var(--ku-border); }
.ku-suggest__label { padding: var(--ku-s-2) var(--ku-s-3) var(--ku-s-1); background: var(--ku-surface-2); border-bottom: var(--ku-border-hair); }
.ku-suggest__group + .ku-suggest__group .ku-suggest__label { border-top: var(--ku-border-hair); }
.ku-suggest__i { display: flex; align-items: center; gap: var(--ku-s-2); min-height: var(--ku-h-md); padding: var(--ku-s-1) var(--ku-s-3); font-size: var(--ku-fs-small); line-height: var(--ku-lh-small); text-decoration: none; }
.ku-suggest__i:hover, .ku-suggest__i.is-active { background: var(--ku-surface-2); }
.ku-suggest__i:focus-visible { outline-offset: -2px; }
.ku-suggest__meta { margin-left: auto; padding-left: var(--ku-s-2); font: var(--ku-fw-regular) 13px/16px var(--ku-font-mono); color: var(--ku-ink-2); white-space: nowrap; }
.ku-suggest__none { padding: var(--ku-s-3); font-size: var(--ku-fs-small); line-height: var(--ku-lh-small); color: var(--ku-ink-2); }

/* мобильное меню: лист на весь экран */
.ku-menu { position: fixed; inset: 0; z-index: var(--ku-z-overlay); overflow-y: auto; overscroll-behavior: contain; background: var(--ku-bg); }
.ku-menu__top { display: flex; align-items: center; gap: var(--ku-s-3); min-height: var(--ku-header-h); border-bottom: var(--ku-border); }
.ku-menu__body { display: grid; gap: var(--ku-s-4); padding-top: var(--ku-s-4); padding-bottom: var(--ku-s-8); }
.ku-menu .ku-field__input { height: var(--ku-tap); font-size: var(--ku-fs-body); }
.ku-menu .ku-suggest { position: static; max-height: none; margin-top: var(--ku-s-1); }
.ku-menu__list { border-top: var(--ku-border); }
.ku-menu__list li { border-bottom: var(--ku-border-hair); }
.ku-menu__list a { display: flex; align-items: baseline; gap: var(--ku-s-2); min-height: var(--ku-s-12); padding: 14px 0; font-size: var(--ku-fs-body); line-height: 20px; font-weight: var(--ku-fw-medium); text-decoration: none; }
.ku-menu__list a:hover { background: var(--ku-surface-2); }
.ku-menu__list a[aria-current] { font-weight: var(--ku-fw-semibold); border-left: var(--ku-bw-mark) solid var(--ku-accent); padding-left: var(--ku-s-3); }

/* ---------- подвал: зелёная доска ---------- */
.ku-footer { margin-top: var(--ku-section-gap); background: var(--ku-accent2); color: var(--ku-on-accent2); border-top: 4px solid var(--ku-ink); }
.ku-disclosure + .ku-footer, .ku-main:has(> .ku-disclosure:last-child) + .ku-footer { margin-top: var(--ku-s-6); }
.ku-footer :focus-visible { outline-color: var(--ku-focus-on-dark); }
.ku-footer__top { display: grid; gap: var(--ku-s-2); padding: var(--ku-s-8) 0 var(--ku-s-5); border-bottom: 1px solid var(--ku-board-line); }
.ku-footer .ku-brand { margin-right: 0; justify-self: start; }
.ku-footer .ku-brand__name { color: var(--ku-on-accent2); }
.ku-footer .ku-brand__sub { color: var(--ku-board-muted); }
.ku-footer__about { max-width: 60ch; font-size: var(--ku-fs-small); line-height: 22px; color: var(--ku-board-muted); }
.ku-footer__cols { display: grid; grid-template-columns: minmax(0, 1fr); }
.ku-footer__col { min-width: 0; padding: var(--ku-s-5) 0; border-bottom: 1px solid var(--ku-board-line); }
.ku-footer__h { font: var(--ku-fw-bold) 12px/16px var(--ku-font-mono); letter-spacing: var(--ku-ls-caps); text-transform: uppercase; color: var(--ku-board-muted); }
.ku-footer__list { margin-top: var(--ku-s-2); }
.ku-footer__list a { display: inline-flex; align-items: center; min-height: 36px; font-size: var(--ku-fs-ui); line-height: var(--ku-lh-ui); text-decoration: none; }
.ku-footer__list a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ku-footer__legal { display: grid; gap: var(--ku-s-3); padding: var(--ku-s-5) 0 var(--ku-s-8); font-size: var(--ku-fs-note); line-height: 20px; color: var(--ku-board-muted); }
.ku-footer__legal p { max-width: 80ch; }
.ku-footer__legal a { color: var(--ku-on-accent2); text-underline-offset: 3px; }
.ku-footer__legal .ku-num { font-size: var(--ku-fs-note); }

/* ====================== от 768px ====================== */
@media (min-width: 768px) {
  .ku-block__head .ku-block__link { display: inline-flex; }
  .ku-block__foot--mobile { display: none; }

  .ku-header__top { gap: var(--ku-s-5); }
  .ku-brand__sub { display: block; }
  .ku-brand__name { line-height: 26px; }
  .ku-header__search { display: block; flex: 1 1 auto; max-width: 420px; }
  .ku-header__links { display: flex; gap: var(--ku-s-5); font-size: var(--ku-fs-ui); line-height: var(--ku-lh-ui); font-weight: var(--ku-fw-medium); }
  .ku-header__links a { padding: 6px 0; border-bottom: 2px solid transparent; text-decoration: none; white-space: nowrap; transition: border-color var(--ku-dur) var(--ku-ease); }
  .ku-header__links a:hover { border-bottom-color: var(--ku-accent); }
  .ku-header__links a[aria-current] { border-bottom-color: var(--ku-ink); }
  .ku-header .ku-header__menu, .ku-menu { display: none; }
  /* строка разделов */
  .ku-nav { display: block; background: var(--ku-surface-2); border-top: var(--ku-border-hair); }
  .ku-nav__list { display: flex; overflow-x: auto; scrollbar-width: none; }
  .ku-nav__list::-webkit-scrollbar { display: none; }
  .ku-nav__list a { display: flex; align-items: center; height: var(--ku-nav-h); padding: 0 var(--ku-s-4); border-right: var(--ku-border-hair); border-top: var(--ku-bw-mark) solid transparent; border-bottom: var(--ku-bw-mark) solid transparent; font-size: var(--ku-fs-small); font-weight: var(--ku-fw-medium); white-space: nowrap; text-decoration: none; transition: background-color var(--ku-dur) var(--ku-ease), border-color var(--ku-dur) var(--ku-ease); }
  .ku-nav__list li:first-child a { border-left: var(--ku-border-hair); }
  .ku-nav__list a:hover { background: var(--ku-surface); border-bottom-color: var(--ku-ink); }
  .ku-nav__list a[aria-current] { background: var(--ku-bg); border-bottom-color: var(--ku-accent); font-weight: var(--ku-fw-semibold); }
  .ku-nav__list a:focus-visible { outline-offset: -2px; }

  .ku-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--ku-grid-gap); }
}

/* 768–1199: строка разделов плотнее — на 1024 все семь разделов видны целиком, без скрытой прокрутки (14.10) */
@media (min-width: 768px) and (max-width: 1199px) {
  .ku-nav__list a { padding: 0 10px; }
  .ku-nav__list li { flex: 1 0 auto; }
  .ku-nav__list a { justify-content: center; }
}

/* ====================== от 1200px ====================== */
@media (min-width: 1200px) {
  .ku-header__top { gap: var(--ku-s-6); }
  .ku-brand__name { font-size: 24px; line-height: 28px; } /* 28px: нижние выносные «р», «у» не задевают подпись «ведомость онлайн-школ» (14.10) */

  .ku-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .ku-grid > * { grid-column: 1 / -1; }
  .ku-grid > .ku-grid__main { grid-column: span 8; }
  .ku-grid > .ku-grid__side { grid-column: span 4; }

  .ku-footer__cols { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ku-footer__col { padding: var(--ku-s-8) 0; border-bottom: 0; }
  .ku-footer__legal { grid-template-columns: minmax(0, 1fr) auto; align-items: start; border-top: 1px solid var(--ku-board-line); }
}