/* ===========================================================================
   Взгляд Тверь — дизайн-токены
   Из Figma (копия ytd8BJuDTjWTbJolNursnq, UI-Kit 118:116). В MODX — в base.tpl без изменений.
   =========================================================================== */

:root {
  /* Цвета (переменные Figma) */
  --color-brand: #00A3A1;          /* Фирменный цвет */
  --color-brand-text: #007B79;     /* мелкий бирюзовый текст (до 18px): контраст 5,1 на белом и 4,7 на #F1F5F4 вместо 3,1 — WCAG AA (решение 2026-10-18) */
  --color-text: #323232;           /* Цвет темного текста */
  --color-card: #F1F5F4;           /* Цвет фона в карточках */
  --color-inactive: #C7C7C7;       /* Цвет неактивных элементов */
  --color-light: #FFFFFF;          /* Цвет светлого текста */
  --color-line: #BABABA;           /* линии в ответах на вопросы */
  --color-arrow-soft: #E0E0E0;     /* стрелка «назад» в отзывах */
  --color-error: #CD2932;          /* ошибка в поле формы (UI-Kit 172:417) */
  --gradient: linear-gradient(to right, #02A2A3, #0F8BBB);
  --gradient-reverse: linear-gradient(to right, #0F8BBB, #02A2A3);          /* наведение/нажатие малых кнопок */
  --gradient-reverse-large: linear-gradient(to right, #0F8BBC, #01A2A2);    /* наведение/нажатие больших кнопок */
  --shadow-button: drop-shadow(0 4px 2px rgba(44, 94, 92, 0.15));          /* кнопка в шапке при наведении */
  --slide-shade-soft: linear-gradient(to bottom, rgba(0, 163, 161, 0) 3.086%, rgba(11, 111, 151, 0.5));
  --slide-shade: linear-gradient(to bottom, rgba(0, 163, 161, 0) 3.086%, rgba(11, 111, 151, 0.7));

  /* Шрифты (переменные Figma «Десктоп/…») */
  --font-family: 'Inter', sans-serif;
  --font-h1: 700 2.5rem/1.1 var(--font-family);
  --font-h2: 600 1.875rem/normal var(--font-family);
  --font-h3: 600 1.5rem/normal var(--font-family);
  --font-subtitle: 600 1.25rem/normal var(--font-family);
  --font-numbers: 600 3rem/normal var(--font-family);
  --font-accent: 500 1rem/1.4 var(--font-family);        /* Выделенный текст */
  --font-body: 400 0.875rem/1.4 var(--font-family);          /* Основной текст */
  --font-menu: 500 0.875rem/normal var(--font-family);       /* Пункты меню */
  --font-button: 500 0.875rem/normal var(--font-family);     /* Текст в кнопках */
  --font-button-small: 500 0.75rem/normal var(--font-family); /* Текст в мелких кнопках */
  --font-button-hover: 700 0.875rem/normal var(--font-family);  /* Текст в кнопках при наведении */
  --font-button-small-hover: 700 0.75rem/normal var(--font-family); /* Текст в мелких кнопках при наведении */
  --font-small: 400 0.75rem/normal var(--font-family);      /* Мелкий текст */

  /* Шрифты телефона (переменные Figma «Мобильный/…») */
  --font-h1-m: 700 1.625rem/1.2 var(--font-family);
  --font-h2-m: 600 1.375rem/normal var(--font-family);
  --font-h3-m: 600 1.125rem/normal var(--font-family);
  --font-numbers-m: 700 1.875rem/1.1 var(--font-family);
  --font-accent-m: 500 0.875rem/1.2 var(--font-family);      /* Мобильный/Выделенный текст */
  --font-accent-italic-m: italic 500 0.875rem/1.4 var(--font-family);

  /* Сетка */
  --container: 79.5rem;
  --page-pad: 1rem;                                    /* поля страницы: телефон 16, планшет 24, ПК 84 при 1440 */
  --container-fluid: min(var(--container), 100% - 2 * var(--page-pad));
  --container-vw: min(var(--container), 100vw - 2 * var(--page-pad)); /* та же ширина, но от окна — для лент, уходящих за край */
  --radius: 1rem;
  --radius-small: 0.5rem;
}

@media (min-width: 46.5em) {
  :root {
    --page-pad: 1.5rem;
  }
}
