/* RUN365 — дизайн-токены редизайна
   Источник: Run365 Redesign.dc.html, режим accent='teal', light=false (тёмная)
   Сверено с системой Александра (Пример карточки товара v3, Пояснения, концепт v6)

   ПРАВИЛО АКЦЕНТА
   #4FE8DC работает ТОЛЬКО заливкой: контраст к фону странице 1,37:1 — как текст нечитаем.
   Чёрный текст на нём — 13,9:1. Для акцентного ТЕКСТА на светлом есть отдельный
   тёмный тон --accent-ink (#0E7A6E, 4,7:1 к фону страницы — AA для обычного текста).
   Это два разных токена, не оттенки одного. Не подменять.
*/

:root {
  /* ---- поверхность страницы: не зависит от темы ---- */
  --page:        #f4f4f2;  /* фон страницы */
  --surface:     #ffffff;  /* карточки, плитки */
  --border:      #e2e0da;  /* рамка карточки */
  --hairline:    #eeece6;  /* разделитель внутри карточки */
  --rule:        #c9c7c0;  /* подчёркивание ссылок-стрелок */
  --rule-soft:   #cfcdc6;
  --text:        #0b0b0b;
  --text-mut:    #6d6d66;  /* описания */
  --text-lab:    #8a8a82;  /* мелкие подписи, счётчики */
  --text-hover:  #4b4b46;

  /* ---- акцент ---- */
  --accent:      #4FE8DC;  /* ТОЛЬКО заливка */
  --accent-fg:   #0b0b0b;  /* текст поверх заливки */
  --accent-ink:  #0E7A6E;  /* акцент как ТЕКСТ на светлом (= --accent-on-light в макете) */

  /* ---- статус наличия (из системы Александра, в главной B не используется,
         нужен на карточке товара и в каталоге) ---- */
  --stock:       #23A455;  /* залитая точка — со склада ИМ */
  --stock-lite:  #7BD44A;  /* он же на выбранной чёрной плашке */
  --dead:        #C9C7C0;  /* нет нигде */
  --sale:        #C2410C;  /* только пункт «Скидки» */

  /* ---- радиусы ---- */
  --r-sm: 18px;  /* мелкие плитки: «Детям», «Аксессуары», серии */
  --r-md: 20px;  /* карточка товара */
  --r-lg: 22px;  /* карточки магазинов, блога, покрытий */
  --r-xl: 24px;  /* hero, промо-плитки, AI-полоса */

  /* ---- сетка ---- */
  --wrap:   1360px;
  --gutter: clamp(16px, 3cqi, 40px);
  --sec-gap: 60px;   /* отступ между секциями */

  /* ---- тёмные блоки (hero, AI-полоса, кнопка подбора) — режим «Тёмная» ---- */
  --ink:       #0b0b0b;
  --ink-fg:    #ffffff;
  --ink-mut:   rgba(255, 255, 255, .72);
  --ink-lab:   rgba(255, 255, 255, .62);
  --ink-line:  rgba(255, 255, 255, .18);
  --ink-bord:  #0b0b0b;
  --btn:       #0b0b0b;
  --btn-fg:    #ffffff;
  --accent-text: #5FF0E4;  /* акцентный текст ПОВЕРХ тёмного блока */
}

/* Режим «Светлая»: тёмные блоки становятся белыми, кнопка — бирюзовой.
   В макете переключается тумблером; на проде выбираем один режим и второй удаляем. */
:root[data-r365-theme="light"] {
  --ink:       #ffffff;
  --ink-fg:    #0b0b0b;
  --ink-mut:   #4b4b46;
  --ink-lab:   #6d6d66;
  --ink-line:  #e6e4de;
  --ink-bord:  #e2e0da;
  --btn:       #4FE8DC;
  --btn-fg:    #0b0b0b;
  --accent-text: #0E7A6E;
}

/* ---- типографика ----
   РЕШЕНО: один Inter 400–800 на всю страницу.
   Archivo и Jost из прототипа отброшены — у обоих нет кириллицы, русский текст
   уходил бы на системный фолбэк. Одна гарнитура вместо двух также убирает
   вторую загрузку шрифта.
   На проде грузим локально (152-ФЗ), а не с Google CDN. */
:root {
  --font: Inter, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}

html, body { margin: 0; padding: 0; background: var(--page); }
body {
  font-family: var(--font);
  color: var(--text);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
a { color: var(--text); text-decoration: none; }
a:hover { color: var(--text-hover); }
::selection { background: var(--accent); color: var(--accent-fg); }
