/*
 * mkind design tokens — своя палитра/шрифт/шкалы (Л-§3.6, Л-§2: ничего с lemanapro не взято).
 * Цвета владельца: оранжевый #C2410C, плашка #FFF1E6, графит #21282B, тёплый серый #F5F4F1.
 * Производные подобраны на WCAG AA (контраст ≥ 4.5:1 для текста) — проверено scripts/contrast-check.mjs.
 */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("./fonts/inter-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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("./fonts/inter-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: "Inter";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("./fonts/inter-latin-600-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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("./fonts/inter-cyrillic-600-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

:root {
  /* --- Цвет: база владельца --- */
  --mk-orange-700: #9A3412; /* тёмный оранжевый — текст/hover на светлом */
  --mk-orange-600: #C2410C; /* основной бренд-оранжевый */
  --mk-orange-500: #BC4512; /* акцент/hover кнопок — контраст с белым текстом ≥ 4.5:1 */
  --mk-orange-100: #FFF1E6; /* плашка-бейдж (владельца) */
  --mk-orange-50:  #FFF8F2; /* самый светлый фон-подложка */

  --mk-graphite-900: #21282B; /* графит владельца — текст заголовков, подвал */
  --mk-graphite-700: #3A4247;
  --mk-graphite-500: #5C666B;
  --mk-graphite-300: #9AA3A7;

  --mk-warm-gray-100: #F5F4F1; /* тёплый серый владельца — фон секций */
  --mk-warm-gray-50:  #FAF9F7;
  --mk-warm-gray-200: #E7E4DE;
  --mk-warm-gray-300: #D8D3CB;

  --mk-white: #FFFFFF;
  --mk-black: #15181A;

  /* статусы (своя палитра, не lemana) */
  --mk-success-600: #2A6B2D; /* контраст с success-100 ≥ 4.5:1 */
  --mk-success-100: #E7F3E8;
  --mk-danger-600:  #B3261E;
  --mk-danger-100:  #FBE9E7;
  --mk-info-600:    #2663A8;
  --mk-info-100:    #E8F1FA;

  /* --- Семантические токены --- */
  --mk-color-bg:            var(--mk-white);
  --mk-color-bg-muted:      var(--mk-warm-gray-100);
  --mk-color-bg-elevated:   var(--mk-white);
  --mk-color-bg-badge:      var(--mk-orange-100);
  --mk-color-text:          var(--mk-graphite-900);
  --mk-color-text-muted:    var(--mk-graphite-500);
  --mk-color-text-on-brand: var(--mk-white);
  --mk-color-border:        var(--mk-warm-gray-300);
  --mk-color-border-strong: var(--mk-graphite-300);
  --mk-color-brand:         var(--mk-orange-600);
  --mk-color-brand-hover:   var(--mk-orange-500);
  --mk-color-brand-active:  var(--mk-orange-700);
  --mk-color-focus-ring:    #1E6FD6; /* синий фокус-кольцо — не оранжевый/графит, чтобы не путать со статусами */

  /* --- Шрифт --- */
  --mk-font-sans: "Inter", -apple-system, "Segoe UI", Roboto, sans-serif;
  --mk-fw-regular: 400;
  --mk-fw-semibold: 600;

  /* шкала размеров текста (кратна 1.2, округлена) */
  --mk-text-xs:   12px;
  --mk-text-sm:   14px;
  --mk-text-base: 16px;
  --mk-text-md:   18px;
  --mk-text-lg:   22px;
  --mk-text-xl:   28px;
  --mk-text-2xl:  36px;
  --mk-text-3xl:  44px;

  --mk-lh-tight: 1.2;
  --mk-lh-normal: 1.5;
  --mk-lh-loose: 1.7;

  /* --- Роли из замеров SPEC.md (lemana/spec/*.json, script5_spec_measure.py) --- */
  /* размеры и пропорции взяты по факту замера, цвета/шрифт/иконки — свои (Л-§2) */
  --mk-h1-section-size: 35px; --mk-h1-section-lh: 40px; --mk-h1-section-w: var(--mk-fw-semibold); /* раздел-оглавление, section_index.json */
  --mk-h2-section-size: 27px; --mk-h2-section-lh: 32px; --mk-h2-section-w: var(--mk-fw-semibold);
  --mk-h3-section-size: 17px; --mk-h3-section-lh: 24px; --mk-h3-section-w: var(--mk-fw-semibold);
  --mk-body-section-size: 13px; --mk-body-section-lh: 20px;
  --mk-h1-product-size: 17px; --mk-h1-product-lh: 24px; --mk-h1-product-w: var(--mk-fw-semibold); /* карточка товара, product_card.json */
  --mk-h2-product-size: 21px; --mk-h2-product-lh: 26px;
  --mk-h3-product-size: 20px; --mk-h3-product-lh: 26px;
  --mk-body-product-size: 16px; --mk-body-product-lh: 24px;
  --mk-link-size: 14px; --mk-link-w: 500; /* home.json typography.a */
  --mk-button-text-size: 15px; --mk-button-text-lh: 20px; --mk-button-text-w: var(--mk-fw-semibold); /* typography.button */

  /* --- Шкала отступов, 4px-сетка (ориентир lemana: плотный ритм 4/8/12/16/24/32/48/64) --- */
  --mk-space-1: 4px;
  --mk-space-2: 8px;
  --mk-space-3: 12px;
  --mk-space-4: 16px;
  --mk-space-5: 20px;
  --mk-space-6: 24px;
  --mk-space-8: 32px;
  --mk-space-10: 40px;
  --mk-space-12: 48px;
  --mk-space-16: 64px;

  /* --- Радиусы --- */
  --mk-radius-sm: 6px;
  --mk-radius-md: 10px;
  --mk-radius-lg: 16px;
  --mk-radius-pill: 999px;
  --mk-radius-control: 4px; /* замер SPEC: border_radius кнопок/input/ссылок хедера = 4px */

  /* --- Контролы хедера (замер SPEC: input padding 12px 74px 12px 38px, font 16/24 → высота 48px) --- */
  --mk-control-h: 48px;

  /* --- Тени (мягкие, тёплый графит а не чёрный) --- */
  --mk-shadow-sm: 0 1px 2px rgba(33, 40, 43, 0.08);
  --mk-shadow-md: 0 4px 12px rgba(33, 40, 43, 0.10);
  --mk-shadow-lg: 0 12px 32px rgba(33, 40, 43, 0.14);
  --mk-shadow-brand: 0 8px 20px rgba(194, 65, 12, 0.25);

  /* --- Z-индексы --- */
  --mk-z-header: 100;
  --mk-z-megamenu: 110;
  --mk-z-toast: 200;
  --mk-z-modal: 300;

  /* --- Контейнер/сетка (замер SPEC.md §1: контейнер 1180px, боковой отступ ≈122px при вьюпорте 1440) --- */
  --mk-container-max: 1180px;
  --mk-grid-gap: 20px; /* замер grid_container gap */

  /* --- Длительности анимаций (Л-§3.7: только transform/opacity) --- */
  --mk-dur-fast: 120ms;
  --mk-dur-base: 200ms; /* замер SPEC: transition color/background/opacity/border/box-shadow 0.2s ease-out */
  --mk-dur-slow: 420ms;
  --mk-ease-standard: ease-out; /* замер SPEC: везде ease-out, не свой cubic-bezier */
  --mk-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1); /* свои пружинные микро-взаимодействия сверх SPEC */
}

@media (prefers-color-scheme: dark) {
  /* резерв на будущее, сайт B2B работает по умолчанию в светлой теме */
}

/* Л9 17.10.2026 (коорд. п.2): Astra по умолчанию даёт #primary margin-top:4em (60px) —
   сетевой next.css снимает это только для .archive/.search (clamp 14-32px), карточка товара
   (single-product) осталась непокрытой — между хедером и крошками/контентом пустая полоса
   ~60px (поймано на гейте, скрин l9d_card_1440.png). Тот же клэмп здесь, в общем файле токенов
   (грузится на всех страницах превью) — там, где #primary реально есть (товар; на
   .archive/.search значение и так совпадает с сетевым, переопределение идемпотентно). Шаблоны
   tpl-404/tpl-l7-* свой #primary не используют (свой <main> через get_header()+кастомный
   разметка) — их это не касается. */
#primary {
  margin-top: clamp(14px, 2.4vw, 32px) !important; /* Astra грузится после mk-tokens — та же
    специфичность `#primary`, без !important проигрывает по порядку источников (живой замер:
    0 эффекта без него на 1440/1280 десктопе, мобильный Astra и так зануляет через свой media). */
}