/* ══════════════════════════════════════════════════════════════════
   FACETER — THEME (v3, новый дизайн)
   Глобальный слой №1: токены + reset + базовая типографика.
   Источник истины — дизайн-система Виталия (vitaly_test_site/CLAUDE.md).
   Подключается ТОЛЬКО на страницах design="v3" (через BaseLayout).
   Здесь живёт только ОБЩЕЕ для всего сайта. Частное блока — в его компоненте.
═══════════════════════════════════════════════════════════════════ */

/* ══════════════ Reset ══════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  /* Базовый шрифт — Montserrat (как в прототипе): он покрывает веса 100–900, поэтому
     жирные элементы (цены, заголовки, номера) выглядят правильно. Inter (--font-body,
     веса 400–600) применяется ВЫБОРОЧНО к подписям/описаниям — там, где задан явно. */
  font-family:var(--font-head);
  color:var(--black);
  background:#fff;
  -webkit-font-smoothing:antialiased;
}
a{text-decoration:none;color:inherit}
ul{list-style:none}
img,video,svg{display:block;max-width:100%}

/* ══════════════ Tokens ══════════════ */
:root{
  /* ── Цвета (из дизайн-системы Виталия — НЕ менять имена/значения) ── */
  --black:#171818;
  --grey:#6E6E6E;
  --light-grey:#A0A0A8;
  --primary:#0050DF;          /* основной синий */
  --accent-a:#2AC0FF;         /* голубой — начало градиента */
  --accent-b:#1588FF;         /* синий — конец градиента */
  --bg:#F6FAFF;               /* светло-голубой фон блоков */
  --bg-grey:#F4F6FA;          /* серый фон (секция камер) */
  --grad:linear-gradient(315deg,#2AC0FF 0%,#1588FF 100%);

  /* ── Layout (из дизайн-системы Виталия) ── */
  --header-h:72px;
  --promo-h:0px;              /* высота промо-ленты под шапкой; 0 = лента выключена.
                                 Когда лента включена — PromoBar задаёт фолбэк и точную высоту. */
  --section-py:100px;         /* вертикальный padding секций (моб. → 64px, см. ниже) */

  /* ── Дополнено для системы (additive, общее для всех блоков) ── */
  --font-head:'Montserrat',sans-serif;          /* заголовки, кнопки, навигация */
  --font-body:'Inter','Montserrat',sans-serif;  /* параграфы, мелкий текст */
  --container:1280px;         /* макс. ширина контента */
  --container-pad:32px;       /* боковые отступы контейнера */
  --radius-pill:100px;        /* кнопки/пилюли */
  --radius-card:24px;         /* карточки/панели */
}

/* Мобильные секции компактнее (как в прототипе) */
@media (max-width:680px){
  :root{ --section-py:64px; }
}

/* ══════════════ Базовая типографика ══════════════ */
/* Только общие правила. Конкретные размеры заголовков блоков — в компонентах. */
h1,h2,h3,h4,h5,h6{font-family:var(--font-head);line-height:1.1;letter-spacing:-.02em}
strong,b{font-weight:700}