/*!
 * webmarka.kz — стили сайта 1.8.1
 * Слой темы поверх uikit.min.css 3.25.25: шрифты, цвета, отмена капслока.
 * Отступы, сетка, колонки, карточки — классами UIkit в разметке, здесь их нет.
 * Свои элементы, которых в UIkit нет, — с префиксом tm-.
 */

/* ── 1. Шрифты: IBM Plex Sans и IBM Plex Mono, OFL, свой хостинг ───────── */
/* Plex выбран за прописную I с засечками: «UIkit» не читается как «Ulkit». */

@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 100 700; font-display: swap;
  src: url("../fonts/ibm-plex-sans-cyrillic-wght-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 100 700; font-display: swap;
  src: url("../fonts/ibm-plex-sans-cyrillic-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 100 700; font-display: swap;
  src: url("../fonts/ibm-plex-sans-latin-wght-normal.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: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/ibm-plex-mono-cyrillic-400-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/ibm-plex-mono-latin-400-normal.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: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/ibm-plex-mono-cyrillic-500-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/ibm-plex-mono-latin-500-normal.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; }

/* ── 2. Токены ─────────────────────────────────────────────────────────── */

:root {
  --tm-paper:        #ffffff;
  --tm-paper-alt:    #f4f5f8;   /* UIkit muted #f8f8f8 */
  --tm-line:         #e1e4eb;   /* UIkit border #e5e5e5 */
  --tm-line-strong:  #c9ceda;

  /* Контраст на белом: ink 17,4 : 1; text 8,3 : 1; muted 5,3 : 1 (UIkit #999 — 2,85 : 1) */
  --tm-ink:          #161a24;
  --tm-text:         #474e5f;
  --tm-muted:        #646b7d;

  /* Белый текст на акценте 7,1 : 1 (UIkit #1e87f0 — 3,63 : 1) */
  --tm-primary:       #3346d3;
  --tm-primary-hover: #2a3bb8;
  --tm-primary-press: #24339e;
  --tm-primary-soft:  #eef0fd;

  --tm-success:      #32d296;   /* только фон */
  --tm-success-text: #1b7a52;   /* 5,3 : 1 */
  --tm-danger:       #f0506e;
  --tm-danger-text:  #c2304f;   /* 5,5 : 1 */

  --tm-font: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --tm-font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Consolas, monospace;

  --tm-shadow:       0 1px 2px rgba(22, 26, 36, .05), 0 8px 24px rgba(22, 26, 36, .07);
  --tm-shadow-hover: 0 2px 4px rgba(22, 26, 36, .06), 0 16px 40px rgba(22, 26, 36, .11);
  --tm-radius:       6px;
}

/* ── 3. База: шрифт и цвет ─────────────────────────────────────────────── */

html { font-family: var(--tm-font); line-height: 1.6; color: var(--tm-text); }

h1, h2, h3, h4, h5, h6,
.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6,
.uk-heading-small, .uk-heading-medium, .uk-heading-large, .uk-heading-xlarge,
.uk-logo, .uk-navbar-item, .uk-navbar-nav > li > a, .uk-navbar-toggle {
  font-family: var(--tm-font);
}
h1, h2, h3, h4, h5, h6,
.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6,
.uk-heading-medium, .uk-card-title, .uk-modal-title {
  color: var(--tm-ink);
  font-weight: 600;
  letter-spacing: -0.015em;
}
.uk-heading-medium { font-weight: 700; letter-spacing: -0.028em; line-height: 1.05; }
.uk-heading-small { color: var(--tm-ink); font-weight: 700; letter-spacing: -0.022em; line-height: 1.1; }

strong, b { color: var(--tm-ink); font-weight: 600; }
em { color: inherit; }   /* в UIkit курсив розовый, #f0506e */
.uk-text-emphasis { color: var(--tm-ink) !important; }
/* В инверсных блоках (тёмная секция, синяя карточка, мобильное меню) — белым */
.uk-light strong, .uk-light b, .uk-card-primary strong, .uk-card-secondary strong,
.uk-section-secondary strong, .uk-offcanvas-bar strong, .uk-overlay-primary strong { color: #fff; }

a, .uk-link { color: var(--tm-primary); }
a:hover, .uk-link:hover { color: var(--tm-primary-hover); }
.uk-link-heading:hover, .uk-link-text a:hover { color: var(--tm-primary); }
.uk-link-text a { color: var(--tm-text); }

::selection { background: var(--tm-primary); color: #fff; }
:focus-visible { outline: 2px solid var(--tm-primary); outline-offset: 3px; }

.uk-text-large { font-size: 1.25rem; line-height: 1.55; }
@media (min-width: 960px) { .uk-text-large { font-size: 1.375rem; } }

.uk-text-meta { color: var(--tm-muted); }
.uk-text-muted { color: var(--tm-muted) !important; }   /* в UIkit здесь !important */
.uk-subnav > * > :first-child { color: var(--tm-muted); }
.uk-text-primary { color: var(--tm-primary) !important; }

:not(pre) > code, pre code { font-family: var(--tm-font-mono); }
:not(pre) > code {
  color: var(--tm-ink);
  background: var(--tm-primary-soft);
  padding: .1em .35em;
  border-radius: 3px;
  font-size: .85em;
}

/* ── 4. Без капслока: в UIkit прописными набраны 9 элементов ──────────── */

.uk-button, .uk-navbar-nav > li > a, .uk-subnav > * > :first-child, .uk-tab > * > a,
.uk-label, .uk-nav-header, .uk-table th, .uk-card-badge, .uk-description-list > dt {
  text-transform: none;
}

/* ── 5. Перекраска компонентов UIkit под акцент сайта ─────────────────── */
/* В продакшене чище собрать UIkit из LESS с @global-primary-background:
   тогда этот раздел не нужен. */

.uk-button { font-weight: 550; border-radius: 4px; }
.uk-button-primary { background-color: var(--tm-primary); }
.uk-button-primary:hover { background-color: var(--tm-primary-hover); }
.uk-button-primary:active, .uk-button-primary.uk-active { background-color: var(--tm-primary-press); }
.uk-button-default { color: var(--tm-ink); border-color: var(--tm-line-strong); }
.uk-button-default:hover { color: var(--tm-ink); border-color: var(--tm-ink); }
.uk-button-text { color: var(--tm-primary); }
.uk-button-text:hover { color: var(--tm-primary-hover); }

.uk-section-muted { background: var(--tm-paper-alt); }
.uk-section-secondary { background: var(--tm-ink); }
.uk-tile-primary, .uk-card-primary, .uk-background-primary { background-color: var(--tm-primary); }
.uk-card-primary.uk-card-body .uk-button-default:hover { color: var(--tm-primary); }

.uk-card-default { color: var(--tm-text); box-shadow: var(--tm-shadow); }
.uk-card-hover:not(.uk-card-default):not(.uk-card-primary):not(.uk-card-secondary):hover,
.uk-card-default.uk-card-hover:hover { box-shadow: var(--tm-shadow-hover); }
.uk-card { border-radius: var(--tm-radius); }
.uk-card-media-top { border-radius: var(--tm-radius) var(--tm-radius) 0 0; }

.uk-label, .uk-badge { background-color: var(--tm-primary); }
.uk-label { border-radius: 3px; font-size: .78rem; }
.uk-label-success { background-color: var(--tm-success-text); }
.uk-label-danger { background-color: var(--tm-danger-text); }

.uk-alert-primary { background: var(--tm-primary-soft); color: var(--tm-primary-press); border-radius: var(--tm-radius); }

.uk-table tbody tr.uk-active { background: var(--tm-primary-soft); }
.uk-table-hover tbody tr:hover { background: var(--tm-paper-alt); }
.uk-table-divider > tr:not(:first-child), .uk-table-divider > :not(:first-child) > tr,
.uk-table-divider > :first-child > tr:not(:first-child) { border-top-color: var(--tm-line); }

.uk-tooltip { background: var(--tm-ink); font-size: .8rem; padding: 5px 9px; border-radius: 4px; }
.uk-overlay-primary { background: rgba(22, 26, 36, .86); }

.uk-heading-bullet::before { border-left-color: var(--tm-primary); }

.uk-input, .uk-select, .uk-textarea { color: var(--tm-ink); border-color: var(--tm-line-strong); border-radius: 4px; }
.uk-input:focus, .uk-select:focus, .uk-textarea:focus { color: var(--tm-ink); border-color: var(--tm-primary); }
.uk-form-icon { color: var(--tm-muted); }
.uk-form-label { color: var(--tm-ink); font-weight: 550; }
.uk-checkbox { border-color: var(--tm-line-strong); }
.uk-checkbox:focus { border-color: var(--tm-primary); }
.uk-checkbox:checked { background-color: var(--tm-primary); }
.uk-checkbox:checked:focus { background-color: var(--tm-primary-press); }

.uk-description-list > dt { color: var(--tm-muted); font-size: .85rem; }
.uk-description-list > dd { color: var(--tm-ink); }
.uk-description-list-divider > dt:nth-child(n+2), .uk-list-divider > :nth-child(n+2) { border-top-color: var(--tm-line); }

.uk-dotnav > * > * { border-color: var(--tm-line-strong); }
.uk-dotnav > .uk-active > * { background-color: var(--tm-primary); border-color: var(--tm-primary); }
.uk-subnav-pill > .uk-active > a { background-color: var(--tm-primary); }
.uk-nav-default > li.uk-active > a { color: var(--tm-ink); font-weight: 550; }
.uk-slidenav, .uk-totop, .uk-close { color: var(--tm-muted); }
.uk-slidenav:hover, .uk-totop:hover, .uk-close:hover { color: var(--tm-ink); }

.uk-navbar-container.tm-navbar { background: rgba(255, 255, 255, .95); }
.uk-navbar-container.tm-navbar.uk-navbar-sticky {
  box-shadow: 0 1px 0 var(--tm-line);
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  backdrop-filter: saturate(1.4) blur(10px);
}
.uk-navbar-nav > li > a { color: var(--tm-text); font-weight: 500; }
.uk-navbar-nav > li:hover > a, .uk-navbar-nav > li > a[aria-expanded="true"] { color: var(--tm-ink); }
.uk-navbar-dropdown-nav > li > a, .uk-nav-default > li > a { color: var(--tm-text); }
.uk-navbar-dropdown-nav > li > a:hover { color: var(--tm-primary); }
.uk-navbar-toggle { color: var(--tm-ink); }

.uk-offcanvas-bar { background: var(--tm-ink); }

.uk-notification-message { background: var(--tm-ink); color: #fff; border-radius: var(--tm-radius); box-shadow: var(--tm-shadow-hover); }
.uk-notification-message-success { color: #fff; box-shadow: inset 4px 0 0 var(--tm-success), var(--tm-shadow-hover); }
.uk-notification-message-danger  { color: #fff; box-shadow: inset 4px 0 0 var(--tm-danger), var(--tm-shadow-hover); }
.uk-notification-close { color: rgba(255, 255, 255, .7); }

/* ── 6. Свои элементы, которых в UIkit нет ────────────────────────────── */

/* Логотип из спрайта: цвет берётся из текста, поэтому работает и на тёмном */
.tm-logo { display: block; width: 121px; height: 20px; color: var(--tm-ink); }
.uk-logo:hover .tm-logo { color: var(--tm-primary); }
.uk-light .tm-logo, .uk-offcanvas-bar .tm-logo { color: #fff; }

/* Измеритель строки заголовка: ширину в знаках UIkit не задаёт */
.tm-measure-title { max-width: 23ch; text-wrap: balance; }
@media (max-width: 639px) { .uk-heading-medium.tm-measure-title { font-size: 2.4rem; } }

/* Подсказка в духе инструментов разработчика: включает режим «Разметка» */
.tm-inspect {
  position: relative;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
  padding: 6px 10px;
  border: 0;
  border-radius: 4px;
  background: var(--tm-ink);
  color: #fff;
  font: 500 .8rem/1.4 var(--tm-font-mono);
  text-align: left;
  cursor: pointer;
  transition: background-color .15s ease;
}
.tm-inspect::after {
  content: "";
  position: absolute;
  left: 18px;
  bottom: -5px;
  width: 10px;
  height: 10px;
  background: inherit;
  transform: rotate(45deg);
}
.tm-inspect:hover, .tm-xray .tm-inspect { background: var(--tm-primary); }
.tm-inspect b { color: #a9b1ff; font-weight: 600; }
.tm-inspect-hint { color: rgba(255, 255, 255, .72); font: .78rem var(--tm-font); }

/* Переключатель «Разметка» */
.tm-switch {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
  border: 0;
  background: none;
  color: inherit;
  font: 500 .9rem var(--tm-font);
  text-align: left;
  cursor: pointer;
}
.tm-switch-track {
  position: relative;
  flex: none;
  width: 34px;
  height: 20px;
  border-radius: 10px;
  background: var(--tm-line-strong);
  transition: background-color .2s ease;
}
.tm-switch-track::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(22, 26, 36, .25);
  transition: transform .2s ease;
}
.tm-xray .tm-switch-track { background: var(--tm-primary); }
.tm-xray .tm-switch-track::after { transform: translateX(14px); }

/* Бейдж GitHub в духе shields.io */
.tm-badge {
  display: inline-flex;
  border-radius: 4px;
  overflow: hidden;
  font-size: .85rem;
  line-height: 1;
  text-decoration: none;
  box-shadow: inset 0 0 0 1px var(--tm-ink);
}
.tm-badge-key, .tm-badge-value { display: inline-flex; align-items: center; gap: 7px; padding: 11px 12px; }
.tm-badge-key { background: var(--tm-ink); color: #fff; font-weight: 600; }
.tm-badge-value { color: var(--tm-ink); font: .8rem var(--tm-font-mono); }
.tm-badge:hover { text-decoration: none; box-shadow: inset 0 0 0 1px var(--tm-primary); }
.tm-badge:hover .tm-badge-key { background: var(--tm-primary); }
.tm-badge:hover .tm-badge-value { color: var(--tm-primary); }

/* Карта позиций модулей: Placeholder в компактном виде */
.tm-posmap .uk-placeholder, .tm-posmap-side, .tm-pos-main {
  display: block;
  margin: 0;
  padding: 10px 12px;
  font: 500 .74rem/1.3 var(--tm-font-mono);
  color: var(--tm-ink);
  border-color: var(--tm-line-strong);
  border-radius: 3px;
  overflow-wrap: anywhere;
}
.tm-posmap .uk-placeholder:hover, .tm-posmap-side:hover { border-color: var(--tm-primary); background: var(--tm-primary-soft); }
.tm-pos-main { min-height: 110px; color: #fff; }
.tm-posmap-side { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--tm-muted); }
.tm-posmap-side > span { writing-mode: vertical-rl; }
@media (max-width: 639px) { .tm-posmap-side > span { writing-mode: horizontal-tb; } .tm-posmap .uk-placeholder { padding: 8px 6px; font-size: .66rem; } }

/* Схемы-превью вместо скриншотов шаблонов */
.tm-preview {
  display: grid;
  gap: 6px;
  aspect-ratio: 16 / 10;
  padding: 16px;
  background: var(--tm-paper-alt);
  border-bottom: 1px solid var(--tm-line);
}
.tm-preview i { display: block; border-radius: 2px; background: #dfe2ea; }
.tm-preview i:first-child { background: var(--tm-ink); opacity: .85; }
.tm-preview-landing { grid-template: 10px 1fr 34px 18px / repeat(3, 1fr); }
.tm-preview-landing i:nth-child(1), .tm-preview-landing i:nth-child(2) { grid-column: 1 / -1; }
.tm-preview-landing i:nth-child(2) { background: var(--tm-primary-soft); box-shadow: inset 0 0 0 1px rgba(51, 70, 211, .2); }
.tm-preview-landing i:nth-child(6) { grid-column: 2; background: var(--tm-primary); }
.tm-preview-corporate { grid-template: 10px 1fr 1fr 12px / 1.3fr 1fr 1fr; }
.tm-preview-corporate i:nth-child(1), .tm-preview-corporate i:nth-child(6) { grid-column: 1 / -1; }
.tm-preview-corporate i:nth-child(2) { grid-row: 2 / 4; background: var(--tm-primary-soft); box-shadow: inset 0 0 0 1px rgba(51, 70, 211, .2); }
.tm-preview-portfolio { grid-template: 10px 1fr 1fr / repeat(3, 1fr); }
.tm-preview-portfolio i:nth-child(1) { grid-column: 1 / -1; }
.tm-preview-portfolio i:nth-child(3) { grid-row: span 2; background: var(--tm-primary-soft); box-shadow: inset 0 0 0 1px rgba(51, 70, 211, .2); }
.tm-preview-promo { grid-template: 10px 1fr 22px 22px / repeat(4, 1fr); }
.tm-preview-promo i:nth-child(1), .tm-preview-promo i:nth-child(2), .tm-preview-promo i:nth-child(6) { grid-column: 1 / -1; }
.tm-preview-promo i:nth-child(2) { background: var(--tm-ink); opacity: .85; }
.tm-preview-promo i:nth-child(6) { background: var(--tm-primary); }
.tm-preview-cms { grid-template: 10px 14px 1fr 12px / 2fr 1fr; }
.tm-preview-cms i:nth-child(1), .tm-preview-cms i:nth-child(2), .tm-preview-cms i:nth-child(6) { grid-column: 1 / -1; }
.tm-preview-cms i:nth-child(2), .tm-preview-cms i:nth-child(3) { background: var(--tm-primary-soft); }
.tm-preview-cms i:nth-child(5) { display: none; }

/* Контурная карточка для тёмной секции */
.tm-card-outline { border: 1px solid rgba(255, 255, 255, .16); }

/* Номер шага: Badge крупнее стандартных 18 px */
.uk-badge.tm-step { min-width: 32px; height: 32px; font-size: .9rem; font-weight: 600; }

/* Код в модальных окнах */
.tm-snippet {
  padding: 18px 20px;
  border: 0;
  border-radius: var(--tm-radius);
  background: var(--tm-ink);
  color: #e7e9f2;
  font: .8rem/1.65 var(--tm-font-mono);
  tab-size: 2;
}
.tm-snippet code { color: inherit; }

/* Слайдер с uk-slider-container-offset выступает за контейнер на 25 px:
   на телефоне это давало горизонтальную прокрутку страницы */
.tm-clip-x { overflow-x: clip; }

/* ── 7. Режим «Разметка»: страница показывает свои классы UIkit ────────── */

.tm-xray [data-x] { position: relative; outline: 1px dashed rgba(51, 70, 211, .55); outline-offset: -1px; }
.tm-xray [data-x]::before {
  content: attr(data-x);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 20;
  max-width: calc(100% - 8px);
  padding: 2px 7px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: var(--tm-primary);
  color: #fff;
  font: 500 11px/1.5 var(--tm-font-mono);
  border-radius: 0 0 3px 0;
  pointer-events: none;
}
.tm-xray [data-x-pos="end"]::before { left: auto; right: 0; border-radius: 0 0 0 3px; }
.tm-xray .uk-section-secondary[data-x] { outline-color: rgba(169, 177, 255, .7); }

/* ── 8. Меньше движения — по настройке системы ───────────────────────── */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}

/* Таблица репозитория на телефоне: поля ячеек поуже, чтобы вошла без прокрутки */
@media (max-width: 639px) { .uk-card .uk-table-small td { padding-left: 10px; padding-right: 10px; } }

/* Аватар с инициалами на странице «Обо мне» */
.tm-avatar { display: block; width: 160px; height: 160px; object-fit: cover; box-shadow: var(--tm-shadow); }
@media (max-width: 639px) { .tm-avatar { width: 112px; height: 112px; } }

/* Портрет на главной: квадрат во всю ширину колонки, но не больше 320 px */
.tm-portrait { display: block; width: 100%; max-width: 320px; height: auto; box-shadow: var(--tm-shadow); }

/* Крупная цифра на странице 404 */
.tm-404 { line-height: 1; color: var(--tm-line-strong) !important; }

/* Кейсы: год крупно, факты — контурными метками */
.tm-year { color: var(--tm-primary); font-weight: 700; font-variant-numeric: tabular-nums; }
.uk-label.tm-label-outline { background: transparent; color: var(--tm-text); box-shadow: inset 0 0 0 1px var(--tm-line-strong); margin-bottom: 4px; }

/* Скриншоты кейсов: превью уже обрезано до 16:10, растягиваем на ширину карточки */
.tm-shot { display: block; width: 100%; height: auto; }
.uk-card-media-top img { border-radius: var(--tm-radius) var(--tm-radius) 0 0; }
.uk-card-media-top { border-bottom: 1px solid var(--tm-line); }

/* Логотип заказчика */
.tm-client-logo { display: block; width: 56px; height: 56px; object-fit: contain; background: #fff; box-shadow: 0 0 0 1px var(--tm-line); }

/* Подпись в галерее: светлый текст на тёмной плашке UIkit */
.uk-lightbox-caption { font-size: .95rem; }

/* Обложка материала без картинки: тема крупно */
.tm-topic-cover { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; aspect-ratio: 16 / 10; color: #fff; background: var(--tm-primary); border-radius: var(--tm-radius) var(--tm-radius) 0 0; }
.tm-topic-cover.tm-topic-joomla { background: var(--tm-ink); }
.tm-topic-cover.tm-topic-search { background: var(--tm-primary-soft); color: var(--tm-primary-press); }
.tm-topic-name { font: 600 1.1rem/1 var(--tm-font); letter-spacing: .01em; }

/* Текст материала: мера строки, отступы, картинки, цитаты */
.tm-article-body { font-size: 1.0625rem; line-height: 1.7; color: var(--tm-text); }
.tm-article-body > :first-child { margin-top: 0; }
.tm-article-body h2 { font-size: 1.6rem; margin-top: 2.2em; }
.tm-article-body h3 { font-size: 1.3rem; margin-top: 1.8em; }
.tm-article-body h4 { font-size: 1.1rem; margin-top: 1.6em; }
.tm-article-body img { max-width: 100%; height: auto; border-radius: 4px; }
.tm-article-body .tm-figure { margin: 2em 0; }
.tm-article-body blockquote { margin: 1.6em 0; padding: .2em 0 .2em 1.2em; border-left: 3px solid var(--tm-primary); font-size: 1.1rem; font-style: normal; color: var(--tm-ink); }
.tm-article-body ul, .tm-article-body ol { padding-left: 1.4em; }
.tm-article-body li + li { margin-top: .4em; }
.tm-article-body a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.uk-article-title { font-weight: 700; letter-spacing: -0.02em; line-height: 1.15; color: var(--tm-ink); }
.uk-text-lead { color: var(--tm-ink); }
.uk-alert { background: var(--tm-paper-alt); color: var(--tm-text); border-radius: var(--tm-radius); }
