/* xgatespb.ru · W3 «Прибор» — дизайн-токены режима XGate (светлый).
   Правило цвета: графит — текст; зелёный XGate — только действия; маджента — цвет изделия
   (размерные линии, выбранное значение на шкале); золото — «золотая линия» 1 px.
   Цвета высот сняты пипеткой с официальных рендеров XGate (верхушка v-*.webp). */

/* @font-face — в fonts/fonts.css (единый файл шрифтов, подключается до tokens.css) */

:root{
  /* поверхность и текст */
  --paper:#f6f8fa;
  --card:#ffffff;
  --studio-hi:#ffffff;
  --studio-lo:#e3e9ef;
  /* единая студия (сцена главной, плитки каталога, карточка): прожектор сверху + холодный градиент; --fl — уровень пола */
  --studio-light:radial-gradient(60% 56% at 50% 38%,rgba(255,255,255,.96) 0,rgba(255,255,255,.5) 48%,rgba(255,255,255,0) 74%);
  --studio-floor:linear-gradient(180deg,#f4f7f9 0,#e4eaef 22%,#d9e0e7 100%);
  --ink:#2a2e33;          /* графит: 13,9:1 на белом */
  --ink-2:#535960;        /* 7,0:1 на белом, 6,6:1 на --paper */
  --ink-3:#6b7178;        /* 4,9:1 — минимум для мелкого текста */
  --rule:#d5dbe1;
  --rule-2:#e8ecf0;
  --rule-ctl:#868e97;     /* граница интерактива: 3,3:1 на белом, 3,1:1 на --paper (WCAG 1.4.11) */

  /* действие */
  --xg:#5bb65f;           /* заливка кнопок; текст на ней только графитовый (7,4:1) */
  --xg-press:#4fa553;
  --xg-on:#16191c;
  --xg-text:#1e6b40;      /* зелёный для ссылок: 6,6:1 */
  --xg-tint:#eef7f0;

  /* изделие */
  --mag:#8f2a74;          /* маджента корпуса, затемнённая до 7,3:1 для текста и линий */
  --mag-hi:#b2559b;
  --mag-tint:#f7ebf3;

  /* золотая линия */
  --gold:#b08d3c;
  --gold-soft:rgba(176,141,60,.35);

  /* внимание (близнецы платформ) */
  --warn-ink:#6e4a00;
  --warn-bg:#fff5e1;
  --warn-rule:#e7c78a;

  /* цвет верхушки = высота десневой части (рендеры XGate) */
  --h0p5:#c6cad1; --h1:#dcc25e; --h2:#5aaedc; --h3:#dd9fca; --h4:#93cf74; --h5:#16359e;

  /* шкала отступов 4 */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px; --s10:40px; --s12:48px; --s16:64px; --s20:80px;

  /* радиусы — по иерархии: шкалы и чипы почти острые, панели мягче */
  --r1:2px; --r2:6px; --r3:12px;

  /* типографика */
  --f:'StmSym','Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
  --t-xs:12px; --t-s:14px; --t-m:16px; --t-l:19px; --t-xl:24px;
  --t-h1:clamp(28px,1.6vw + 16px,42px);
  --t-hero:clamp(32px,2.6vw + 14px,58px);  /* H1 главной: тонкий + жирный */
  --t-num:clamp(64px,5.2vw + 20px,96px);   /* большие числа результата, Montserrat 300 */
  --t-num-2:clamp(24px,1.2vw + 12px,32px);
  --lh:1.5;

  /* касание и слои */
  --tap:44px;
  --head-h:60px;
  --shadow-1:0 1px 2px rgba(30,40,50,.06),0 1px 1px rgba(30,40,50,.04);
  --shadow-2:0 12px 32px -8px rgba(30,40,50,.18),0 2px 6px rgba(30,40,50,.06);

  /* движение */
  --ez:cubic-bezier(.2,.7,.2,1);
  --ez-in:cubic-bezier(.4,0,1,1);
  --d-1:160ms;   /* смена рендера, наплыв */
  --d-2:280ms;   /* доезд к следующему шагу */
  --d-3:320ms;   /* FLIP «Добавлено» */
  --d-4:600ms;   /* сборка линейки высот (на изделие) */
}
@media (prefers-reduced-motion:reduce){
  :root{--d-1:0ms;--d-2:0ms;--d-3:0ms;--d-4:0ms}
  *,*::before,*::after{animation-duration:0ms!important;animation-delay:0ms!important;transition-duration:0ms!important;scroll-behavior:auto!important}
}
@media (max-width:719px){:root{--head-h:52px}}