/* ==========================================================================
   Аритин.Аналитика — локальные переопределения общих стилей.
   Подключается в site.php → headStyles ПОСЛЕ common/assets/css/style.css,
   поэтому значения переменных ниже перебивают базовые.

   Тёмная тема не затрагивается: правило html[data-theme="dark"] в style.css
   имеет более высокую специфичность (элемент + атрибут) и задаёт свой
   --glass-bg.
   ========================================================================== */

:root {
  /* Фон чуть темнее базового #f8fafc — блоки с белым фоном читаются контрастнее */
  --bg: #e8edf3;
  /* «Стеклянные» блоки: плотнее базового #ffffff38, контент читается лучше */
  --glass-bg: #ffffffc2;
}

/* ---------- Аватары источников в макете hero ----------
   В style.css есть только wa / tg / tgb / mx (мессенджеры). Здесь —
   источники данных Аритин.Аналитики. */
.avatar.amo { background: rgba(76, 139, 245, .14); color: #4c8bf5; }
.avatar.b24 { background: rgba(47, 199, 247, .16); color: var(--bitrix24); }
.avatar.mtr { background: rgba(224, 50, 43, .13);  color: #e0322b; }
.avatar.dir { background: rgba(242, 161, 0, .16);  color: #d98d00; }
.avatar.tel { background: rgba(34, 197, 94, .14);  color: #16a34a; }
.avatar.web { background: var(--accent-soft);      color: var(--accent-ink); }

/* Иконки внутри аватаров — того же размера, что и картинки мессенджеров. */
.avatar > i { font-size: 15px; }

/* ---------- Отступ после блока «шаги» ----------
   `#how` — .steps-bg (белый фон + рамка снизу). Следующая секция с
   .section-flush-top имеет padding-top: 0, из-за чего её заголовок
   прилипает к границе белого блока. Возвращаем отступ. */
.steps-bg + .section-flush-top { padding-top: 88px; }