/* ==========================================================================
   МГИРС им. Ю.В. Рокотова — дизайн-система сайта
   Токены и компоненты перенесены из макета «МГИРС Лендинг.dc.html»
   ========================================================================== */

/* ---------- Шрифты (self-hosted, без запросов к сторонним серверам) ---------- */
@font-face { font-family: 'Golos Text'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/golos-text-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Golos Text'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/golos-text-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Golos Text'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/golos-text-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400 500; font-display: swap; src: url(../fonts/jetbrains-mono-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400 500; font-display: swap; src: url(../fonts/jetbrains-mono-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --bg: #f5f4f1;          /* фон страницы — тёплый серый */
  --surface: #fff;
  --surface-2: #f0eee9;   /* подложка табов, полей */
  --ink: #14181f;         /* основной текст, тёмные плашки */
  --ink-2: #1b222c;       /* hero, тёмные секции */
  --ink-3: #2b3240;
  --muted: #4a4f57;
  --muted-2: #5b6068;
  --muted-3: #7a7e85;
  --line: #dedad2;
  --line-2: #e3e0d9;
  --line-3: #cfcac0;
  --line-dark: #3a4250;
  --blue: #1f56a0;
  --blue-dark: #0f3a75;
  --blue-soft: #e9eef7;
  --blue-ink: #9fb6d9;    /* подписи на тёмном */
  --blue-ink-2: #c9d6ea;
  --focus: #f0b400;
  --ok: #1d7a46;
  --warn: #a35a00;
  --err: #b42318;

  --font: 'Golos Text', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --wrap: 1280px;
  --gutter: 32px;
  --sec: 88px;
  --r: 4px;
  --r-md: 6px;
  --r-lg: 10px;
  --r-xl: 12px;
  --header-h: 85px;
}

/* ---------- База ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); }
html, body { margin: 0; padding: 0; background: var(--bg); }
body { font-family: var(--font); color: var(--ink); -webkit-font-smoothing: antialiased; font-size: 16px; line-height: 1.5; }
img { max-width: 100%; height: auto; }
a { color: var(--blue); text-decoration: none; }
a:hover { color: var(--blue-dark); text-decoration: underline; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
h1, h2, h3, h4 { margin: 0; }
p { margin: 0; }
button { font: inherit; }
main:focus { outline: none; }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 16px; top: -60px; z-index: 100; background: var(--focus); color: var(--ink); padding: 10px 16px; border-radius: var(--r); font-weight: 600; }
.skip:focus { top: 12px; }

.container { max-width: var(--wrap); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }

/* ---------- Типографика ---------- */
.eyebrow { font-family: var(--mono); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); }
.on-dark .eyebrow, .section--dark .eyebrow, .phero .eyebrow, .card--dark .eyebrow, .eyebrow--light { color: var(--blue-ink); }
.phero--light .eyebrow { color: var(--blue); }
.h1 { font-size: clamp(34px, 4vw, 54px); line-height: 1.08; font-weight: 700; letter-spacing: -.02em; text-wrap: balance; }
.h-display { font-size: clamp(32px, 3.6vw, 48px); line-height: 1.08; letter-spacing: -.02em; text-wrap: balance; }
.h2 { font-size: 36px; line-height: 1.15; letter-spacing: -.01em; text-wrap: balance; }
.h3 { font-size: 28px; line-height: 1.2; }
.h4 { font-size: 20px; line-height: 1.3; text-wrap: balance; }
.lead { font-size: 18px; line-height: 1.55; color: var(--muted); text-wrap: pretty; max-width: 720px; }
.text { font-size: 17px; line-height: 1.65; color: var(--muted); text-wrap: pretty; }
.section--dark .text, .on-dark .text, .text--on-dark { color: #d4d8de; }
.small { font-size: 13px; color: var(--muted-2); }
.mono { font-family: var(--mono); }
.num { font-variant-numeric: tabular-nums; }
.prose { display: grid; gap: 18px; font-size: 17px; line-height: 1.65; color: #2d323a; max-width: 760px; }
.prose > :first-child { margin-top: 0; }
.prose h2 { font-size: 28px; line-height: 1.2; color: var(--ink); margin-top: 16px; letter-spacing: -.01em; }
.prose h3 { font-size: 20px; line-height: 1.3; color: var(--ink); margin-top: 8px; }
.prose ul, .prose ol { margin: 0; padding-left: 22px; display: grid; gap: 8px; }
.prose blockquote { margin: 8px 0; padding: 4px 0 4px 24px; border-left: 3px solid var(--blue); font-size: 20px; line-height: 1.5; color: var(--ink); font-weight: 500; }
.prose figure > blockquote { margin: 0; }
.quote figcaption { padding-left: 27px; font-size: 14px; color: var(--muted-2); }
.prose figure { margin: 8px 0; display: grid; gap: 10px; }
.prose figure img { width: 100%; border-radius: var(--r); display: block; }
.prose .article__cover { border-radius: var(--r-md); object-position: center 30%; }
.prose figcaption { font-size: 13px; color: var(--muted-2); }

/* ---------- Кнопки ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 13px 24px; border-radius: var(--r); font-weight: 600; font-size: 16px; line-height: 1.2; text-decoration: none; border: 1.5px solid transparent; cursor: pointer; transition: background .15s, color .15s, border-color .15s, opacity .15s; white-space: nowrap; }
.btn:hover { text-decoration: none; }
.btn--primary { background: var(--blue); color: #fff; }
.btn--primary:hover { background: var(--blue-dark); color: #fff; }
.btn--light { background: #fff; color: var(--ink); }
.btn--light:hover { background: #e6e9ee; color: var(--ink); }
.btn--outline-light { border-color: rgba(255,255,255,.7); color: #fff; }
.btn--outline-light:hover { background: rgba(255,255,255,.1); color: #fff; }
.btn--dark { background: var(--ink); color: #fff; }
.btn--dark:hover { background: var(--ink-3); color: #fff; }
.btn--outline { border-color: var(--ink); color: var(--ink); background: transparent; }
.btn--outline:hover { background: var(--ink); color: #fff; }
.btn--sm { min-height: 40px; padding: 9px 16px; font-size: 15px; }
.btn--block { width: 100%; }
.link-arrow { font-weight: 500; }
.link-arrow::after { content: '\00a0→'; }

/* ---------- Служебная строка ---------- */
.topbar { background: var(--ink); color: #e8e6e1; font-size: 13px; }
.topbar__in { padding-top: 8px; padding-bottom: 8px; display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: center; justify-content: space-between; }
.topbar__group { display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: center; }
.topbar__group--right { gap: 8px 20px; }
.topbar a { color: #e8e6e1; }
.topbar a:hover { color: #fff; }
.topbar__sveden { color: #fff !important; font-weight: 500; }
.topbar__a11y { display: flex; align-items: center; gap: 8px; background: none; border: 0; color: #fff; padding: 5px 0; border-radius: var(--r); font-size: 13px; cursor: pointer; }
.topbar__a11y:hover { color: var(--blue-ink-2); }
.topbar__a11y[aria-pressed="true"] { color: var(--blue-ink-2); text-decoration: underline; text-underline-offset: 3px; }
.eye { display: inline-block; width: 18px; height: 10px; border: 2px solid currentColor; border-radius: 50%; position: relative; }
.eye::after { content: ''; position: absolute; left: 50%; top: 50%; width: 4px; height: 4px; margin: -2px 0 0 -2px; background: currentColor; border-radius: 50%; }
.lang { display: flex; gap: 2px; font-family: var(--mono); font-size: 12px; }
.lang span { background: #fff; color: var(--ink); padding: 2px 6px; border-radius: 3px; }
.lang a { color: #b9b6ae !important; padding: 2px 6px; }

/* ---------- Панель доступности ---------- */
.a11y { background: #fff; border-bottom: 2px solid var(--ink); }
.a11y__in { padding-top: 16px; padding-bottom: 16px; display: flex; flex-wrap: wrap; gap: 16px 40px; align-items: center; font-size: 15px; }
.a11y__grp { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.a11y__lbl { font-weight: 600; }
.a11y button { min-width: 44px; height: 44px; padding: 0 14px; border: 2px solid var(--ink); background: #fff; color: var(--ink); font-weight: 600; border-radius: var(--r); cursor: pointer; }
.a11y button[data-zoom] { padding: 0; font-weight: 700; }
.a11y button[aria-pressed="true"] { background: var(--ink); color: #fff; }
.a11y button[data-scheme][aria-pressed="true"] { border-color: var(--blue); background: #fff; color: var(--ink); box-shadow: inset 0 0 0 2px var(--blue); }
.a11y .a11y__inv { background: #000; color: #fff; }
.a11y .a11y__inv[aria-pressed="true"] { background: #000; color: #fff; }
.a11y .a11y__reset { border: none; background: none; color: var(--blue); text-decoration: underline; margin-left: auto; }

html[data-zoom="1.25"] .page { zoom: 1.25; }
html[data-zoom="1.5"] .page { zoom: 1.5; }
html[data-scheme="bw"] .page { filter: grayscale(1) contrast(1.25); }
html[data-scheme="inverse"] .page { filter: invert(1) grayscale(1) contrast(1.1); }
html[data-spacing] .page { letter-spacing: .06em; word-spacing: .12em; }
html[data-spacing] .page p, html[data-spacing] .page li { line-height: 1.85; }
html[data-noimg] .page .img, html[data-noimg] .page img:not(.logo img) { visibility: hidden; }
html[data-noimg] .page .img-wrap { background: var(--surface-2) !important; }

/* ---------- Шапка ---------- */
.header { background: #fff; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; }
.header__in { padding-top: 12px; padding-bottom: 12px; display: flex; align-items: center; gap: 32px; }
.logo { display: block; width: 252px; height: 60px; overflow: hidden; flex-shrink: 0; }
.logo img { display: block; width: 280px; height: auto; margin: -17px 0 0 -12px; mix-blend-mode: multiply; }
.logo--inv img { filter: invert(1); mix-blend-mode: screen; }
.nav { flex: 1; }
.nav__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 26px; font-size: 15px; font-weight: 500; }
.nav__item { position: relative; }
.nav__link { color: var(--ink); display: inline-block; padding: 8px 0; border-bottom: 2px solid transparent; }
.nav__link:hover { color: var(--blue); text-decoration: none; }
.nav__link[aria-current="page"] { color: var(--blue); border-bottom-color: var(--blue); }
.nav__drop { position: absolute; left: -20px; top: 100%; padding-top: 14px; min-width: 300px; visibility: hidden; opacity: 0; transform: translateY(-4px); transition: opacity .15s, transform .15s, visibility .15s; }
.nav__drop ul { list-style: none; margin: 0; padding: 10px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: 0 18px 40px rgba(20,24,31,.12); display: grid; }
.nav__drop a { display: block; padding: 10px 12px; border-radius: var(--r); color: var(--ink); font-weight: 500; }
.nav__drop a:hover { background: var(--blue-soft); color: var(--blue-dark); text-decoration: none; }
.nav__drop a[aria-current="page"] { color: var(--blue-dark); box-shadow: inset 2px 0 0 var(--blue); }
.nav__item:hover .nav__drop, .nav__item:focus-within .nav__drop { visibility: visible; opacity: 1; transform: none; }
.header__cta { flex-shrink: 0; font-size: 15px; padding: 12px 20px; }
.burger { display: none; width: 48px; height: 48px; border: 1px solid var(--line); background: #fff; border-radius: var(--r); cursor: pointer; position: relative; flex-shrink: 0; }
.burger span, .burger span::before, .burger span::after { position: absolute; left: 13px; width: 20px; height: 2px; background: var(--ink); transition: transform .2s, top .2s, opacity .2s; }
.burger span { top: 23px; }
.burger span::before, .burger span::after { content: ''; left: 0; }
.burger span::before { top: -6px; }
.burger span::after { top: 6px; }
.burger[aria-expanded="true"] span { background: transparent; }
.burger[aria-expanded="true"] span::before { top: 0; transform: rotate(45deg); }
.burger[aria-expanded="true"] span::after { top: 0; transform: rotate(-45deg); }

/* ---------- Хлебные крошки ---------- */
.crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; font-size: 14px; }
.crumbs li { color: var(--muted-2); }
.crumbs li:not(:last-child)::after { content: '/'; margin: 0 10px; color: var(--line-3); }
.phero:not(.phero--light) .crumbs li { color: var(--blue-ink); }
.phero:not(.phero--light) .crumbs li:not(:last-child)::after { color: #4c5566; }
.phero:not(.phero--light) .crumbs a { color: #e6e9ee; }

/* ---------- Секции ---------- */
.section { padding: var(--sec) 0; }
.section--white { background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.section--dark, .on-dark { background: var(--ink-2); color: #fff; }
.section--tight { padding-top: 0; }
.section--flush { padding-bottom: 0; }
.section--flush-top { padding-top: 0; }
.section--compact-top { padding-top: 48px; }
.section--chips { padding-top: 40px; padding-bottom: 0; }
.sec-head { display: flex; flex-wrap: wrap; gap: 16px 48px; justify-content: space-between; align-items: flex-end; margin-bottom: 32px; }
.sec-head__txt { display: grid; gap: 16px; max-width: 760px; }

/* ---------- Hero главной ---------- */
.hero { background: var(--ink-2); color: #fff; }
.hero__media { position: relative; }
.hero__media img { display: block; width: 100%; height: auto; max-height: 760px; object-fit: cover; object-position: 50% 40%; }
.hero__media::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 22%; background: linear-gradient(180deg, rgba(27,34,44,0) 0%, rgba(27,34,44,.7) 60%, #1b222c 100%); pointer-events: none; }
.hero__in { padding-top: 8px; padding-bottom: 72px; display: flex; flex-wrap: wrap; gap: 48px 72px; align-items: flex-end; }
.hero__main { flex: 1 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 28px; }
.hero__main .eyebrow { color: var(--blue-ink-2); }
.hero__lead { font-size: 19px; line-height: 1.5; max-width: 560px; color: #e6e9ee; text-wrap: pretty; }
.hero__side { flex: 1 1 340px; max-width: 460px; min-width: 0; display: grid; border-top: 1px solid var(--line-dark); }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; }
.qlink { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--line-dark); color: #fff; }
.qlink:hover { color: var(--blue-ink-2); text-decoration: none; }
.qlink__t { display: grid; gap: 4px; }
.qlink__k { font-size: 13px; color: var(--blue-ink); }
.qlink__v { font-size: 18px; font-weight: 600; }
.qlink__arr { font-size: 20px; transition: transform .15s; }
.qlink:hover .qlink__arr { transform: translateX(4px); }

/* ---------- Внутренний hero (страницы) ---------- */
.phero { background: var(--ink-2); color: #fff; position: relative; overflow: hidden; }
.phero__in { position: relative; padding-top: 40px; padding-bottom: 64px; display: grid; gap: 24px; }
.phero__in > .crumbs { margin-bottom: 16px; }
.phero h1 { max-width: 920px; }
.phero .lead { color: #d4d8de; max-width: 680px; }
.phero__bg { position: absolute; inset: 0; }
.phero__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .32; }
.phero__bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #1b222c 0%, rgba(27,34,44,.85) 45%, rgba(27,34,44,.4) 100%); }
.phero__meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--line-dark); margin-top: 16px; }
.phero__meta > div { padding: 20px 24px 0 0; display: grid; gap: 4px; align-content: start; }
.phero__meta b { font-size: 28px; line-height: 1.1; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.phero__meta span { font-size: 14px; color: var(--blue-ink); }
.phero--light { background: #fff; color: var(--ink); border-bottom: 1px solid var(--line); }
.phero--light .lead { color: var(--muted); }
.phero--article .phero__in { padding-bottom: 40px; }
.h1--article { font-size: clamp(30px, 3.4vw, 46px); }

/* ---------- Плашка-объявление ---------- */
.notice { background: var(--blue); color: #fff; }
.notice__in { padding-top: 18px; padding-bottom: 18px; display: flex; flex-wrap: wrap; gap: 12px 32px; align-items: center; justify-content: space-between; }
.notice__txt { display: flex; flex-wrap: wrap; gap: 6px 20px; align-items: baseline; }
.notice__txt strong { font-size: 18px; }
.notice__txt span { color: #dbe5f4; }
.notice a { color: #fff; font-weight: 600; text-decoration: underline; }

/* ---------- Плитки «жизнь» ---------- */
.tiles { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 20px; }
.tile { grid-column: span 4; position: relative; min-height: 380px; border-radius: var(--r-md); overflow: hidden; background: var(--ink-2); color: #fff; display: flex; align-items: flex-end; }
.tile--wide { grid-column: span 6; }
.tile--tall { min-height: 440px; }
.tile:hover { color: #fff; text-decoration: none; }
.tile > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.tile:hover > img { transform: scale(1.03); }
.tile__body { position: relative; width: 100%; padding: 96px 28px 28px; background: linear-gradient(180deg, rgba(14,18,24,0) 0%, rgba(14,18,24,.85) 70%); display: grid; gap: 8px; }
.tile__body p { font-size: 16px; line-height: 1.5; color: #e6e9ee; max-width: 460px; }

/* ---------- Табы ---------- */
.tabs { display: flex; flex-wrap: wrap; gap: 4px; background: var(--surface-2); padding: 4px; border-radius: var(--r-md); }
.tabs button { border: none; padding: 10px 16px; min-height: 44px; border-radius: var(--r); font-size: 15px; font-weight: 500; cursor: pointer; background: transparent; color: var(--muted); }
.tabs button:hover { color: var(--ink); }
.tabs button[aria-selected="true"] { background: #fff; color: var(--ink); box-shadow: 0 1px 2px rgba(0,0,0,.12); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { border: 1px solid var(--line); background: #fff; color: var(--ink); padding: 8px 14px; border-radius: 999px; font-size: 14px; font-weight: 500; cursor: pointer; min-height: 40px; }
.chip:hover { border-color: var(--ink); }
.chip[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }

/* ---------- Таблицы ---------- */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
/* подсказка «таблица прокручивается вправо» — класс ставит site.js при переполнении */
.table-wrap.is-scrollable { background: linear-gradient(270deg, rgba(20,24,31,.14), rgba(20,24,31,0)) right top / 28px 100% no-repeat; }
.table-wrap.is-scrollable.is-end { background: none; }
.table-wrap:focus-visible { outline-offset: 4px; }
.table { width: 100%; border-collapse: collapse; font-size: 15px; }
.table--wide { min-width: 720px; }
.table th { text-align: left; color: var(--muted-2); font-size: 13px; font-weight: 500; padding: 12px 16px; border-bottom: 1.5px solid var(--ink); vertical-align: bottom; }
.table td { padding: 18px 16px; border-bottom: 1px solid var(--line-2); vertical-align: top; }
.table th:first-child, .table td:first-child { padding-left: 0; }
.table th:last-child, .table td:last-child { padding-right: 0; }
.table tbody tr:hover { background: #f7f8fb; }
.table .r { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.table .r.wrap { white-space: normal; }
.table .w-code { width: 110px; }
.table .w-time { width: 150px; }
.table .name { font-weight: 500; }
.table .code { font-family: var(--mono); font-size: 14px; color: var(--blue); white-space: nowrap; }
.table .strong { font-weight: 600; }
.table .muted { color: var(--muted); }
.table--kv th { width: 38%; border-bottom: 1px solid var(--line-2); color: var(--muted-2); font-size: 15px; vertical-align: top; padding-top: 16px; padding-bottom: 16px; }
.table--kv td { padding-top: 16px; padding-bottom: 16px; }
.table--kv th, .table--kv td { overflow-wrap: break-word; hyphens: auto; }
.table--compact td { padding-top: 12px; padding-bottom: 12px; }
.table .nowrap, .nowrap { white-space: nowrap; }
.table--on-dark th { color: var(--blue-ink); border-color: var(--line-dark); }
.table--on-dark td { color: #e6e9ee; border-color: var(--line-dark); }
.table--on-dark a { color: #fff; }
h3.small, h2.small { font-weight: 500; }
.table__total td { border-top: 1.5px solid var(--ink); border-bottom: 0; }
.link-btn { display: inline; padding: 0; border: 0; background: none; color: var(--blue); font: inherit; text-decoration: underline; cursor: pointer; }
.link-btn:hover { color: var(--blue-dark); }
.table-legend { margin-top: 16px; }

/* ---------- Цифровые сервисы ---------- */
.promo { display: flex; flex-wrap: wrap; gap: 24px; }
.promo__card { flex: 1 1 480px; min-width: 0; border-radius: var(--r-xl); overflow: hidden; display: flex; flex-direction: column; }
.promo__card--soft { background: var(--blue-soft); color: var(--ink); }
.promo__card--dark { background: var(--ink); color: #fff; }
.promo__card--dark .eyebrow { color: var(--blue-ink); }
.promo__txt { padding: 48px 48px 0; display: grid; gap: 18px; }
.promo__txt h2 { font-size: clamp(28px, 2.8vw, 40px); line-height: 1.1; letter-spacing: -.02em; text-wrap: balance; }
.promo__txt p { font-size: 17px; line-height: 1.6; color: var(--muted); max-width: 440px; text-wrap: pretty; }
.promo__card--dark .promo__txt p { color: #c3c8d0; }
.promo__media { margin-top: auto; padding: 40px 24px 0; display: flex; justify-content: center; align-items: flex-end; }
.promo__media--laptop { padding-bottom: 28px; }
.store { background: var(--ink); color: #fff; padding: 12px 20px; border-radius: var(--r-md); font-weight: 600; font-size: 15px; display: inline-flex; align-items: center; gap: 10px; }
.store:hover { opacity: .88; color: #fff; text-decoration: none; }
.store small { display: block; font-size: 11px; font-weight: 400; opacity: .7; line-height: 1; }
.store b { display: block; line-height: 1.2; }

/* CSS-мокап телефона с интерфейсом приложения */
.phone { width: 252px; height: 420px; background: #0c0f14; border-radius: 40px 40px 0 0; padding: 12px 12px 0; box-shadow: 0 30px 60px rgba(15,58,117,.25), inset 0 0 0 2px #8ba6c9; margin-bottom: -1px; }
.phone__screen { height: 100%; background: #f5f4f1; border-radius: 30px 30px 0 0; overflow: hidden; position: relative; font-size: 11px; color: var(--ink); }
.phone__notch { position: absolute; top: 8px; left: 50%; transform: translateX(-50%); width: 84px; height: 22px; background: #0c0f14; border-radius: 12px; }

/* CSS-мокап ноутбука с личным кабинетом */
.laptop { width: 100%; max-width: 560px; }
.laptop__lid { background: #0c0f14; border-radius: 14px 14px 0 0; padding: 12px 12px 14px; box-shadow: inset 0 0 0 2px #2c333e; }
.laptop__screen { background: #f5f4f1; border-radius: 4px; aspect-ratio: 16/10; overflow: hidden; color: var(--ink); }
.laptop__base { height: 14px; background: linear-gradient(180deg, #c7cbd1, #8e939a); border-radius: 0 0 14px 14px; margin: 0 -24px; position: relative; }
.laptop__base::before { content: ''; position: absolute; left: 50%; top: 0; transform: translateX(-50%); width: 90px; height: 5px; background: #7d828a; border-radius: 0 0 6px 6px; }

/* ---------- История / тёмная статья ---------- */
.bio { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 48px; align-items: start; }
.bio__fig { margin: 0; display: grid; gap: 10px; align-self: start; position: sticky; top: calc(var(--header-h) + 24px); }
.bio__fig img, .bio__body figure img { width: 100%; object-fit: cover; border-radius: var(--r); display: block; }
.bio__fig img { aspect-ratio: 4/5; object-position: 50% 20%; }
.bio figcaption { font-size: 13px; color: #9aa3b0; }
.bio__body { display: flex; flex-direction: column; gap: 22px; max-width: 600px; }
.bio__body h2 { font-size: 40px; line-height: 1.1; letter-spacing: -.01em; text-wrap: balance; }
.bio__sub { font-size: 17px; color: var(--blue-ink-2); }
.bio__lead { font-size: 19px; line-height: 1.55; color: #fff; font-weight: 500; text-wrap: pretty; }
.bio__body p:not(.bio__lead):not(.bio__sub) { font-size: 17px; line-height: 1.65; color: #d4d8de; text-wrap: pretty; }
.bio__body figure { margin: 8px 0; display: grid; gap: 10px; }
.bio__body figure img { aspect-ratio: 4/3; }
.bio__final { padding-top: 22px; border-top: 1px solid #343c48; }
.bio__final strong { color: #fff; }
.bio__body > .btn { align-self: flex-start; }

/* ---------- Шаги ---------- */
.steps { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); border-top: 1px solid var(--line-3); border-left: 1px solid var(--line-3); }
.steps li { background: #fff; padding: 28px 24px 32px; display: grid; gap: 12px; align-content: start; border-right: 1px solid var(--line-3); border-bottom: 1px solid var(--line-3); }
.steps .mono { font-size: 13px; color: var(--blue); }
.steps h3 { font-size: 20px; line-height: 1.3; }
.steps p { font-size: 15px; line-height: 1.5; color: var(--muted); text-wrap: pretty; }
.steps--col { grid-template-columns: minmax(0, 1fr); }

/* ---------- Карточки ---------- */
.grid { display: grid; gap: 20px; }
.grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.grid--2-tight { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--3-tight { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.grid--staff { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.grid--tight { gap: 12px; }
/* карточка — колонка: кнопка/«Подробнее» прижаты к низу, в ряду кнопки на одной высоте */
.card { display: flex; flex-direction: column; gap: 16px; padding: 28px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-md); color: var(--ink); min-width: 0; }
.card > .btn, .card > .btn-row, .card > .link-arrow { margin-top: auto; align-self: flex-start; }
.card--lg { padding: 40px; gap: 20px; }
.card--lg h3, .card--lg .h3 { font-size: 24px; }
.card--sm { padding: 20px; gap: 6px; }
.card--sm h3 { font-size: 17px; }
.card--sm p { font-size: 14px; }
.grid--3-tight .card { padding: 20px; gap: 10px; }
.grid--3-tight .card h3 { font-size: 17px; }
.grid--3-tight .card p { font-size: 14px; }
a.card { transition: border-color .15s; }
a.card:hover { border-color: var(--blue); color: var(--ink); text-decoration: none; }
.card h3 { font-size: 20px; line-height: 1.3; text-wrap: balance; }
.card p { font-size: 15px; line-height: 1.5; color: var(--muted); text-wrap: pretty; }
.card__more { font-size: 14px; font-weight: 600; color: var(--blue); margin-top: auto; align-self: flex-start; }
.card__more::after { content: ' →'; }
.card--soft { background: var(--blue-soft); border-color: transparent; }
.card--dark { background: var(--ink); border-color: var(--ink); color: #fff; }
.card--dark p { color: #c3c8d0; }
.card--dark .tag, .tag--on-dark { background: #2b3240; color: var(--blue-ink-2); }
.section--dark .card--dark { background: #232b37; border-color: #2c333e; }
.card__ico { flex-shrink: 0; width: 44px; height: 44px; border-radius: var(--r-md); background: var(--blue-soft); color: var(--blue); display: grid; place-items: center; font-family: var(--mono); font-weight: 500; font-size: 15px; }
.card--dark .card__ico { background: #2b3240; color: var(--blue-ink-2); }
.deps { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; font-size: 15px; color: var(--muted); line-height: 1.4; }
.deps li { padding-left: 14px; border-left: 2px solid var(--line); }
.tag { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; padding: 5px 10px; border-radius: 999px; background: var(--blue-soft); color: var(--blue-dark); line-height: 1.2; width: fit-content; }
.tag--dark { background: var(--ink); color: #fff; }
.tag--ok { background: #e3f2e9; color: var(--ok); }
.tag--warn { background: #fdf0dc; color: var(--warn); }
a.tag:hover { background: var(--blue); color: #fff; text-decoration: none; }
/* статичные метки (секции, программы) — без hover и курсора-руки */
.tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.tags li { border: 1px solid var(--line); background: #fff; padding: 7px 14px; border-radius: 999px; font-size: 14px; font-weight: 500; }
.partners { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 12px; }
.partners li { display: grid; gap: 4px; align-content: start; padding: 18px 20px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg); }
.partners b { font-size: 16px; line-height: 1.3; }
.partners span { font-size: 13px; color: var(--muted-2); }

/* ---------- Преподаватели ---------- */
.staff { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line-2); border-radius: var(--r-lg); overflow: hidden; color: var(--ink); transition: border-color .2s, box-shadow .2s, transform .2s; }
a.staff:hover { border-color: var(--blue); box-shadow: 0 12px 32px rgba(20,24,31,.10); transform: translateY(-3px); color: var(--ink); text-decoration: none; }
.staff__ph { position: relative; background: linear-gradient(180deg, #eef1f6 0%, #e4e8ef 100%); }
.staff__ph img { display: block; width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: 50% 12%; mix-blend-mode: multiply; }
.staff__deg { position: absolute; left: 12px; bottom: 12px; background: var(--ink); color: #fff; font-size: 12px; font-weight: 600; line-height: 1; padding: 7px 10px; border-radius: 999px; letter-spacing: .01em; }
.staff__body { flex: 1; display: flex; flex-direction: column; gap: 12px; padding: 18px 18px 20px; }
.staff__name { display: grid; gap: 2px; line-height: 1.2; }
.staff__name b { font-size: 19px; font-weight: 700; letter-spacing: -.01em; }
.staff__name span { font-size: 15px; font-weight: 500; color: #3a3f47; }
.staff__role { padding-top: 12px; border-top: 1px solid #eeebe5; font-size: 13px; line-height: 1.45; color: var(--muted-2); text-wrap: pretty; }
.staff__init { display: grid; place-items: center; width: 100%; aspect-ratio: 4/5; font-size: 48px; font-weight: 700; color: #b5bfcf; letter-spacing: -.02em; }

/* ---------- Новости и анонсы ---------- */
.news { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 28px; }
.news-card { display: flex; flex-direction: column; gap: 14px; }
.news-card img { display: block; width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: var(--r); background: #e6e3dc; }
.news-card time, .meta { font-family: var(--mono); font-size: 13px; color: var(--muted-2); }
.news-card h3 { font-size: 20px; line-height: 1.3; font-weight: 600; text-wrap: pretty; }
.news-card h3 a { color: var(--ink); }
.news-card h3 a:hover { color: var(--blue-dark); }
.news-card p { font-size: 15px; line-height: 1.5; color: var(--muted); text-wrap: pretty; }
.news-card__ph { aspect-ratio: 16/10; border-radius: var(--r); display: grid; place-items: center; font-family: var(--mono); font-size: 12px; color: var(--muted-3); background: repeating-linear-gradient(135deg, #e6e3dc 0 10px, #eeebe5 10px 20px); }
.news-card--big { grid-column: span 2; }
.news-card--big h3 { font-size: 28px; line-height: 1.2; }
.news-card__meta { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; font-family: var(--mono); font-size: 13px; color: var(--muted-2); }
.news-card--sm h3 { font-size: 17px; }
/* компактная горизонтальная карточка для боковой колонки */
.news-card--row { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 4px 16px; align-content: start; }
.news-card--row img { grid-row: span 2; aspect-ratio: 4/3; }
.news-card--row h3 { font-size: 16px; line-height: 1.35; }
.events { display: grid; border-top: 1.5px solid var(--ink); }
.events--cont { border-top: 0; }
.event { display: grid; grid-template-columns: minmax(110px, 160px) minmax(0, 1fr) auto; gap: 8px 32px; align-items: baseline; padding: 22px 0; border-bottom: 1px solid var(--line); color: var(--ink); }
a.event:hover { background: #fff; color: var(--blue-dark); text-decoration: none; }
.event__d { font-family: var(--mono); font-size: 15px; color: var(--blue); }
.event__t { font-size: 18px; font-weight: 600; line-height: 1.35; }
.event__p { font-size: 14px; color: var(--muted-2); }

/* ---------- Плашка-CTA ---------- */
.callout { border: 1.5px solid var(--ink); border-radius: var(--r-md); padding: 32px; display: flex; flex-wrap: wrap; gap: 20px 40px; align-items: center; justify-content: space-between; background: #fff; }
.callout > div { max-width: 640px; display: grid; gap: 8px; }
.callout h2, .callout h3 { font-size: 24px; line-height: 1.25; }
.callout p { font-size: 15px; line-height: 1.5; color: var(--muted); }
.callout--blue { background: var(--blue); border-color: var(--blue); color: #fff; }
.callout--blue p { color: #dbe5f4; }

/* ---------- Контакты ---------- */
.contacts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 40px; }
.contacts address { font-style: normal; display: grid; gap: 24px; align-content: start; font-size: 16px; line-height: 1.5; }
.contacts address .small { margin-bottom: 4px; }
.map { min-height: 320px; border-radius: var(--r); background: #ebe8e1; position: relative; overflow: hidden; }
.map__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.map__open { position: absolute; right: 12px; bottom: 12px; background: #fff; padding: 8px 12px; border-radius: var(--r); font-size: 13px; font-weight: 600; box-shadow: 0 2px 8px rgba(0,0,0,.1); }

/* ---------- Раскладка с боковым меню ---------- */
.side-layout { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 56px; align-items: start; }
.side-nav { position: sticky; top: calc(var(--header-h) + 24px); display: grid; gap: 2px; max-height: calc(100vh - var(--header-h) - 48px); overflow: auto; padding-right: 4px; }
.side-nav__t { font-size: 13px; color: var(--muted-2); margin-bottom: 10px; font-family: var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.side-nav a { display: grid; grid-template-columns: 28px 1fr; gap: 6px; padding: 9px 12px 9px 10px; border-left: 2px solid transparent; color: var(--muted); font-size: 14px; line-height: 1.35; border-radius: 0 var(--r) var(--r) 0; }
.side-nav a:hover { color: var(--ink); background: #fff; text-decoration: none; }
.side-nav a.is-active { color: var(--blue-dark); border-left-color: var(--blue); background: #fff; font-weight: 500; }
.side-nav a span { font-family: var(--mono); font-size: 12px; color: var(--muted-3); padding-top: 1px; }
.side-content { display: grid; gap: 72px; grid-template-columns: minmax(0, 1fr); }
.side-content > section { display: grid; gap: 24px; grid-template-columns: minmax(0, 1fr); align-content: start; }
.side-content > section:last-child { min-height: 40vh; }
.side-content h2 { font-size: 30px; line-height: 1.15; letter-spacing: -.01em; }

/* ---------- Документы ---------- */
.docs { display: grid; border-top: 1px solid var(--line); }
.doc { display: grid; grid-template-columns: 44px 1fr auto; gap: 16px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line); color: var(--ink); }
.doc:hover { color: var(--blue-dark); text-decoration: none; }
.doc__ext { width: 44px; height: 52px; border: 1.5px solid var(--line-3); border-radius: 4px 12px 4px 4px; display: grid; place-items: end center; padding-bottom: 6px; font-family: var(--mono); font-size: 10px; font-weight: 500; color: var(--err); background: #fff; }
.doc__ext--doc { color: var(--blue); }
.doc__t { font-size: 16px; font-weight: 500; line-height: 1.4; }
.doc__m { font-size: 13px; color: var(--muted-2); display: block; margin-top: 2px; font-weight: 400; }
.doc__dl { font-size: 14px; font-weight: 600; color: var(--blue); white-space: nowrap; }
.doc-links { display: inline-flex; flex-wrap: nowrap; gap: 4px 12px; justify-content: flex-end; white-space: nowrap; }

/* ---------- Цифры ---------- */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); border-top: 1.5px solid var(--ink); }
/* четыре цифры: 2×2, на широком экране — в ряд (.stats--row) */
.stats:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stats--row:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.stat { padding: 24px 24px 8px 0; display: grid; gap: 6px; align-content: start; }
.stat b { font-size: clamp(36px, 4vw, 52px); line-height: 1; letter-spacing: -.03em; font-weight: 700; font-variant-numeric: tabular-nums; }
.stat span { font-size: 15px; color: var(--muted); line-height: 1.4; max-width: 240px; }
.on-dark .stats, .section--dark .stats { border-top-color: var(--line-dark); }
.on-dark .stat span, .section--dark .stat span { color: var(--blue-ink-2); }
.stat--sm b { font-size: 24px; letter-spacing: -.01em; line-height: 1.2; overflow-wrap: anywhere; }
.section--dark .stat b a, .on-dark .stat b a { color: #fff; }

/* ---------- Таймлайн ---------- */
.timeline { list-style: none; margin: 0; padding: 0; display: grid; }
.timeline li { display: grid; grid-template-columns: 120px 1fr; gap: 32px; padding: 28px 0; border-top: 1px solid var(--line); }
.timeline li:last-child { border-bottom: 1px solid var(--line); }
.timeline .mono { font-size: 22px; color: var(--blue); font-weight: 500; }
.timeline h3 { font-size: 20px; line-height: 1.3; margin-bottom: 6px; }
.timeline p { color: var(--muted); font-size: 16px; line-height: 1.55; max-width: 720px; }
.dates { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0; border-top: 1.5px solid var(--ink); }
.dates li { padding: 22px 24px 22px 0; display: grid; gap: 6px; border-bottom: 1px solid var(--line); position: relative; }
.dates b { font-family: var(--mono); font-size: 15px; color: var(--blue); font-weight: 500; }
.dates span { font-size: 16px; font-weight: 600; line-height: 1.35; }
.dates small { font-size: 14px; color: var(--muted-2); }
.dates li.is-next::before { content: 'Ближайшее'; position: absolute; right: 24px; top: 22px; font-size: 11px; font-weight: 600; background: var(--blue); color: #fff; padding: 3px 8px; border-radius: 999px; }

/* ---------- FAQ ---------- */
.faq { display: grid; border-top: 1.5px solid var(--ink); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; padding: 22px 48px 22px 0; font-size: 18px; font-weight: 600; line-height: 1.4; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; position: absolute; right: 4px; top: 16px; font-size: 28px; font-weight: 400; color: var(--blue); transition: transform .2s; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq summary:hover { color: var(--blue-dark); }
.faq details > div { padding: 0 0 24px; font-size: 16px; line-height: 1.6; color: var(--muted); max-width: 820px; display: grid; gap: 10px; }

/* ---------- Формы ---------- */
.form { display: grid; gap: 20px; }
.form__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; }
.field { display: grid; gap: 8px; }
.field label, .field .label { font-size: 14px; font-weight: 600; }
.field input, .field select, .field textarea { width: 100%; min-height: 48px; padding: 12px 14px; border: 1.5px solid var(--line-3); border-radius: var(--r); background: #fff; font: inherit; font-size: 16px; color: var(--ink); }
.field textarea { min-height: 120px; resize: vertical; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: var(--muted-3); }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31,86,160,.15); }
.field.is-error input, .field.is-error select, .field.is-error textarea { border-color: var(--err); }
.field__err { font-size: 13px; color: var(--err); display: none; }
.field.is-error .field__err { display: block; }
.field__hint { font-size: 13px; color: var(--muted-2); }
.field--select { min-width: 260px; }
.check { display: grid; grid-template-columns: 22px 1fr; gap: 10px; font-size: 14px; line-height: 1.45; color: var(--muted); align-items: start; cursor: pointer; }
.check input { width: 20px; height: 20px; margin: 0; accent-color: var(--blue); }
.check.is-error { color: var(--err); }
.check .field__err { grid-column: 2; }
.check.is-error .field__err { display: block; }
.form__ok { display: none; padding: 20px; border-radius: var(--r-md); background: #e3f2e9; color: var(--ok); font-weight: 500; }
.form.is-sent .form__ok { display: block; }
.form.is-sent .form__body { display: none; }
.search { position: relative; }
.search input { padding-left: 44px; }
.search::before { content: ''; position: absolute; left: 16px; top: 50%; width: 14px; height: 14px; border: 2px solid var(--muted-2); border-radius: 50%; transform: translateY(-60%); }
.search::after { content: ''; position: absolute; left: 29px; top: 29px; width: 7px; height: 2px; background: var(--muted-2); transform: rotate(45deg); }

/* ---------- Чек-лист ---------- */
.checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.checklist li { display: grid; grid-template-columns: 28px 1fr; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--line-2); font-size: 16px; line-height: 1.45; }
.checklist li::before { content: ''; width: 20px; height: 20px; margin-top: 1px; border-radius: 50%; background: var(--blue-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.5l2.5 2.5L14 7.5' fill='none' stroke='%231f56a0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat; }
.checklist small { display: block; color: var(--muted-2); font-size: 14px; margin-top: 2px; }
.checklist li:last-child { border-bottom: 0; }

/* ---------- Статья ---------- */
.article { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 64px; align-items: start; }
.article__cover { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: var(--r-md); display: block; }
.article__aside { position: sticky; top: calc(var(--header-h) + 24px); display: grid; gap: 28px; }
.share { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.share__lbl { font-size: 14px; font-weight: 600; margin-right: 4px; }
.share--divided { padding-top: 24px; border-top: 1px solid var(--line); }
.article__lead { font-size: 20px; line-height: 1.55; color: var(--ink); font-weight: 500; }
.article__related { display: grid; gap: 20px; }

/* ---------- Документ с оглавлением (политика) ---------- */
.doc-layout { display: grid; gap: 32px; grid-template-columns: minmax(0, 1fr); }
.toc { border-top: 1.5px solid var(--ink); padding-top: 16px; }
.toc__t { font-family: var(--mono); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-2); font-weight: 400; margin-bottom: 8px; }
.toc ol { margin: 0; padding-left: 22px; display: grid; gap: 6px; font-size: 15px; line-height: 1.4; }
.toc li::marker { color: var(--muted-3); }
@media (min-width: 1024px) {
  .doc-layout { grid-template-columns: minmax(0, 760px) 280px; justify-content: space-between; gap: 64px; }
  .doc-layout .toc { order: 2; position: sticky; top: calc(var(--header-h) + 24px); align-self: start; }
}

/* ---------- Пустое состояние / 404 ---------- */
.empty { padding: 48px 0; text-align: center; color: var(--muted); display: none; }
.empty.is-on { display: block; }
.e404 { display: grid; gap: 48px 72px; align-items: center; min-height: 50vh; }
.e404__main { display: grid; gap: 24px; align-content: center; }
.e404__links { list-style: none; margin: 0; padding: 0; display: grid; border-top: 1.5px solid var(--ink); }
.e404__links a { display: flex; justify-content: space-between; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--line); color: var(--ink); font-weight: 500; }
.e404__links a::after { content: '→'; color: var(--blue); }
.e404__links a:hover { color: var(--blue-dark); text-decoration: none; }
.e404__code { font-family: var(--mono); font-size: clamp(96px, 16vw, 200px); line-height: .9; color: var(--blue); letter-spacing: -.04em; }

/* ---------- Подвал ---------- */
.footer { background: var(--ink); color: #c9c6bf; font-size: 14px; }
.footer__in { padding-top: 56px; padding-bottom: 32px; display: grid; gap: 40px; }
.footer a { color: #c9c6bf; }
.footer a:hover { color: #fff; }
.footer__top { display: flex; flex-wrap: wrap; gap: 24px 48px; align-items: center; justify-content: space-between; padding-bottom: 32px; border-bottom: 1px solid #2c333e; }
.footer__brand { display: flex; flex-wrap: wrap; gap: 16px 32px; align-items: center; }
.footer__brand address { font-style: normal; line-height: 1.6; color: #e8e6e1; display: grid; gap: 2px; }
.footer__brand address a { color: #e8e6e1; }
.footer__social { display: flex; flex-wrap: wrap; gap: 8px; }
.chip-link { border: 1px solid #3a414d; color: #e8e6e1 !important; padding: 8px 14px; border-radius: var(--r); font-size: 13px; }
.chip-link:hover { border-color: #fff; color: #fff !important; text-decoration: none; }
.footer__cols { display: flex; flex-wrap: wrap; gap: 40px 48px; }
.footer__nav { display: grid; gap: 16px; align-content: start; }
.footer__nav--wide { flex: 2 1 460px; }
.footer__col { flex: 1 1 220px; display: grid; gap: 36px; align-content: start; }
.footer__nav h3 { font-size: 15px; line-height: 1.3; font-weight: 600; color: #fff; padding-bottom: 12px; border-bottom: 2px solid var(--blue); }
.footer__list { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; line-height: 1.4; }
.footer__list--cols { display: block; columns: 2 220px; column-gap: 40px; }
.footer__list--cols li { break-inside: avoid; padding-bottom: 10px; }
.footer__legal { border-top: 1px solid #2c333e; padding-top: 24px; display: grid; gap: 14px; font-size: 13px; color: #a09d96; }
.footer__legal > span a { text-decoration: underline; }
.footer__gov { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.footer__copy { display: flex; flex-wrap: wrap; gap: 8px 32px; justify-content: space-between; }

/* ---------- Наверх ---------- */
.to-top { position: fixed; right: 20px; bottom: 20px; z-index: 30; width: 48px; height: 48px; border-radius: 50%; border: none; background: var(--ink); color: #fff; font-size: 20px; cursor: pointer; box-shadow: 0 8px 24px rgba(20,24,31,.25); }
.to-top:hover { background: var(--blue); }

/* ---------- Утилиты ---------- */
.stack { display: grid; gap: 16px; }
.stack-lg { display: grid; gap: 32px; }
.mt-0 { margin-top: 0 !important; }
.mb-0 { margin-bottom: 0 !important; }
.mb-32 { margin-bottom: 32px; }
.mt-20 { margin-top: 20px; }
.mt-40 { margin-top: 40px; }
.mt-72 { margin-top: 72px; }
.mb-8 { margin-bottom: 8px; }
.stack > .btn, .stack-lg > .btn, .stack > .btn-row, .stack-lg > .btn-row { justify-self: start; }
.white-box--soft { background: var(--blue-soft); border-color: transparent; }
.media-fig { margin: 0; border-radius: var(--r-md); overflow: hidden; background: var(--surface-2); }
.media-fig img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.section--dark .media-fig { background: #2b3240; }
.media-fig--low img { object-position: center 60%; transform: scale(1.01); }
.toolbar { display: flex; flex-wrap: wrap; gap: 16px 24px; align-items: center; justify-content: space-between; }
.toolbar__search { flex: 0 1 340px; min-width: 260px; }
.toolbar--stacked { display: grid; justify-content: stretch; }
.toolbar--stacked .toolbar__search { max-width: 440px; width: 100%; }
.toolbar__lbl { font-size: 14px; font-weight: 600; color: var(--muted-2); align-self: center; margin-right: 4px; }
.muted { color: var(--muted); }
.white-box { background: #fff; border: 1px solid var(--line); border-radius: var(--r-md); padding: 32px; }
.split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 48px; align-items: start; }
.split--wide { grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); }
.split--1-2 { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.split--center { align-items: center; }
.sticky-col { position: sticky; top: calc(var(--header-h) + 24px); }
.badge-row { display: flex; flex-wrap: wrap; gap: 8px; }
.hr { height: 1px; background: var(--line); border: 0; margin: 0; }
[hidden] { display: none !important; }

/* ==========================================================================
   Адаптив
   ========================================================================== */
@media (max-width: 1180px) {
  .nav__list { gap: 4px 20px; font-size: 14.5px; }
  .header__in { gap: 24px; }
}
@media (min-width: 1081px) {
  .stats--row:has(> :nth-child(4):last-child) .stat { padding-right: 24px; }
}
@media (max-width: 1080px) {
  .burger { display: block; }
  .header__in { flex-wrap: nowrap; justify-content: space-between; }
  .header__cta { margin-left: auto; }
  .nav { position: fixed; left: 0; right: 0; top: var(--nav-top, 85px); bottom: 0; background: #fff; overflow: auto; padding: 8px var(--gutter) 40px; border-top: 1px solid var(--line); display: none; z-index: 19; }
  .nav.is-open { display: block; }
  .nav__list { display: grid; gap: 0; font-size: 18px; }
  .nav__item { border-bottom: 1px solid var(--line); }
  .nav__link { padding: 16px 0; border: 0; font-weight: 600; }
  .nav__drop { position: static; visibility: visible; opacity: 1; transform: none; padding: 0 0 12px; min-width: 0; }
  .nav__drop ul { border: 0; box-shadow: none; padding: 0; }
  .nav__drop a { padding: 8px 0; color: var(--muted); font-size: 16px; }
  .nav__drop a:hover { background: none; }
  body.nav-open { overflow: hidden; }
  .side-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .split--wide, .split--1-2 { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .sticky-col { position: static; }
  .side-nav { position: static; max-height: none; display: flex; gap: 6px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin; }
  .side-nav__t { display: none; }
  .side-nav a { display: block; flex-shrink: 0; border: 1px solid var(--line); border-radius: 999px; background: #fff; padding: 8px 14px; white-space: nowrap; }
  .side-nav a.is-active { border-color: var(--blue); }
  .side-nav a span { display: none; }
  .article { grid-template-columns: minmax(0, 1fr); gap: 48px; }
  .article__aside { position: static; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); align-items: start; }
  .phero__meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .phero__meta > div { padding-bottom: 4px; }
  .stats--row:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* 3 карточки на планшете: две в ряд, нечётная последняя — на всю ширину */
  .grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid--3 > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 960px) {
  .bio { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .bio__fig { position: static; max-width: 480px; }
  .bio__body { max-width: none; }
}
@media (max-width: 900px) {
  .contacts { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .grid--3, .grid--3-tight { grid-template-columns: minmax(0, 1fr); }
  .grid--3 > :last-child:nth-child(odd) { grid-column: auto; }
  /* широкие таблицы → карточки: подписи столбцов из data-label (их проставляет build.mjs) */
  .table--stack, .table--stack.table--wide { min-width: 0; }
  .table--stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .table--stack, .table--stack tbody, .table--stack tr, .table--stack td { display: block; }
  .table--stack tr { padding: 14px 0; border-bottom: 1px solid var(--line-2); }
  .table--stack tbody tr:first-child { border-top: 1.5px solid var(--ink); }
  .table--stack tbody tr:hover { background: none; }
  .table.table--stack td { display: grid; grid-template-columns: minmax(96px, 38%) minmax(0, 1fr); gap: 12px; padding: 3px 0 !important; border: 0; text-align: left; white-space: normal; }
  .table--stack .doc-links { justify-content: flex-start; }
  .table--stack td::before { content: attr(data-label); font-size: 13px; color: var(--muted-2); font-weight: 400; font-family: var(--font); line-height: 1.5; }
  .table.table--stack td:first-child { display: block; font-size: 16px; padding-bottom: 6px !important; }
  .table--stack td:first-child::before, .table--stack td[data-label=""]::before { content: none; }
  .table.table--stack td[data-label=""] { display: block; }
  .table--stack .code { font-size: 14px; }
  .table--kv th, .table--kv td { display: block; width: auto; padding-left: 0; padding-right: 0; }
  .table--kv th { padding-bottom: 2px; border-bottom: 0; font-size: 13px; }
  .table--kv td { padding-top: 0; }
  .toolbar__search { flex: 1 1 100%; min-width: 0; }
}
@media (max-width: 760px) {
  :root { --gutter: 16px; --sec: 56px; }
  .topbar__group--right a[href^="mailto"] { display: none; }
  .topbar__sveden { display: none; }
  .logo { width: 196px; height: 47px; }
  .logo img { width: 218px; margin: -13px 0 0 -9px; }
  .header__cta { display: none; }
  .h2 { font-size: 28px; }
  .bio__body h2 { font-size: 32px; }
  .promo__txt { padding: 32px 24px 0; }
  .tile, .tile--tall { min-height: 320px; grid-column: 1 / -1; }
  .event { grid-template-columns: 1fr; gap: 6px; }
  .news-card--big { grid-column: auto; }
  .news-card--big h3 { font-size: 22px; }
  .timeline li { grid-template-columns: 1fr; gap: 8px; }
  .bio__fig { position: static; }
  .callout { padding: 24px; }
  .white-box { padding: 20px; }
  .card { padding: 22px; }
  .a11y__reset { margin-left: 0 !important; }
  .faq summary { font-size: 16px; }
  .doc { grid-template-columns: 36px 1fr; }
  .doc__ext { width: 36px; height: 44px; }
  .doc__dl { display: none; }
  .phero__in { padding-top: 24px; padding-bottom: 48px; }
  .phero__meta b { font-size: 24px; }
  .stat { padding-right: 12px; }
  .stat b { font-size: 32px; }
  .stat--sm b { font-size: 20px; }
  .card--lg { padding: 28px 22px; }
  .grid--staff { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .staff__body { padding: 12px 12px 14px; gap: 8px; }
  .staff__name b { font-size: 16px; }
  .staff__name span { font-size: 14px; }
  .staff__role { font-size: 12px; padding-top: 8px; }
  .staff__deg { left: 8px; bottom: 8px; font-size: 11px; padding: 5px 8px; }
  .staff__init { aspect-ratio: 4/3; font-size: 32px; }
  .media-fig { order: -1; }
  .news-card--row { grid-template-columns: 96px minmax(0, 1fr); }
  .e404__code { font-size: 96px; }
}
@media (max-width: 480px) {
  .laptop__base { margin: 0 -12px; }
}
@media (min-width: 1024px) {
  .e404 { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

@media print {
  .topbar, .a11y, .header, .to-top, .footer__cols, .burger, .skip, .share, .map__open { display: none !important; }
  .section--dark, .hero, .phero, .on-dark { background: #fff !important; color: var(--ink) !important; }
  .card--dark, .section--dark .card--dark, .promo__card--dark, .callout--blue, .notice { background: #fff !important; color: var(--ink) !important; border: 1px solid var(--line) !important; }
  .card--dark p, .section--dark .text, .on-dark .text, .phero .lead, .bio__body p:not(.bio__lead):not(.bio__sub), .bio__lead, .promo__card--dark .promo__txt p, .callout--blue p, .section--dark .stat span, .phero__meta span, .phero .crumbs li { color: var(--muted) !important; }
  .section--dark .stat b a, .on-dark .stat b a, .phero .crumbs a { color: var(--ink) !important; }
  .phero__bg, .hero__media::after { display: none; }
  .table-wrap { overflow: visible; background: none !important; }
  .table--wide { min-width: 0; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  section, article, figure, li, tr { break-inside: avoid; }
}

/* ---------- Реальные скриншоты приложения и личного кабинета в мокапах ---------- */
.phone__screen { background: #e9f1f1; }
.phone__shot { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.laptop__screen { display: block; background: #eef3f2; }
.laptop__shot { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top left; }
html[data-noimg] .page .phone__shot, html[data-noimg] .page .laptop__shot { visibility: hidden; }
/* Ровно две колонки (для чётного числа карточек), на мобиле — одна */
.grid--pairs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 640px) { .grid--pairs { grid-template-columns: minmax(0, 1fr); } }

/* Кнопка «Личный кабинет» внутри мобильного меню — только когда меню свёрнуто в бургер */
.nav__item--cta { display: none; }
@media (max-width: 1080px) { .nav__item--cta { display: block; order: -1; border-bottom: 0 !important; padding: 16px 0 8px; } }
