/* PromPol — дизайн-токены сайта Industrial Power (DESIGN.md).
   Подключать первым. Все цвета, шрифты и размеры берутся отсюда, значения в вёрстку не копировать. */

/* Montserrat лежит на сайте (папка fonts/), с Google Fonts ничего не грузится.
   Один вариативный файл на каждое письмо покрывает все начертания 400–800. Браузер скачивает файл, только если на странице есть его буквы.
   Кириллица: русский текст и №. Латиница: цифры, +, скобки, кавычки-ёлочки, тире.
   Расширенная кириллица: кыргызские ң, ү, ө (и заглавные). Русские страницы этот файл не скачивают: на них нет таких букв */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("fonts/montserrat-cyrillic-ext.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("fonts/montserrat-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("fonts/montserrat-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: light;

  /* Цвет бренда (брендбук, «02 · Цвет, шрифт, элементы.pdf») */
  --color-orange: #F26B21;        /* акцент: знак, главные кнопки, цены, крупная графика */
  --color-navy: #0B2358;          /* текст на оранжевом (только он) */
  --color-slate: #2A3142;
  --color-concrete: #C9CED4;      /* второстепенный текст и линии на графите */
  --color-mist: #EEF0F2;
  --color-white: #FFFFFF;
  --color-orange-text-on-light: #B34608;   /* мелкий оранжевый текст на светлом бетоне, 4,7:1 */
  --color-orange-text-on-dark: #FF7A33;    /* мелкий оранжевый текст на графите, 5:1 */
  --color-orange-hover: #FF7A33;           /* кнопка при наведении, текст Navy остаётся */

  /* Industrial Power: графит (тёмные блоки, шапка, подвал) */
  --ip-graphite: #0E1113;          /* фон тёмных блоков, шапки и подвала */
  --ip-graphite-2: #171B1E;        /* карточки, панели и меню на графите */
  --ip-shade-rgb: 8, 11, 14;       /* затемнение поверх фото: rgba(var(--ip-shade-rgb), α) */
  --ip-line: rgba(255, 255, 255, 0.24);   /* тонкие линии на графите */
  --ip-text: #FFFFFF;
  --ip-text-muted: #D3D7DB;        /* подписи на графите, 12:1 */
  --ip-text-dim: #9A9EA3;          /* мелкие служебные подписи на графите (поля калькулятора), 7:1 */

  /* Industrial Power: светлый бетон (блоки «Работы и цены», гарантия, заявка) */
  --ip-concrete: #E6E6E3;          /* фон светлых блоков, под фактурой бетона */
  --ip-paper: #EFEFEC;             /* светлые панели на бетоне */
  --ip-panel: #F7F7F5;             /* светлые карточки на бетоне: форма заявки, этапы, список объектов, лист документа */
  --ip-ink: #111214;               /* заголовки и текст на светлом */
  --ip-ink-2: #3A3C40;             /* абзацы на светлом */
  --ip-ink-muted: #5F6166;         /* подписи на светлом, 4,9:1 */
  --ip-hair: rgba(17, 18, 20, 0.22);   /* тонкие линии на светлом */
  --ip-strip-line: rgba(17, 18, 20, 0.28); /* разделитель в светлой полосе заказчиков */

  /* Форма Industrial Power */
  --ip-radius: 6px;                /* кнопки, поля, меню: строгие углы */
  --ip-card-radius: 10px;          /* карточки и панели */
  --ip-card-shadow: 0 2px 6px rgba(17, 18, 20, 0.1), 0 22px 44px rgba(17, 18, 20, 0.16);   /* тень графитовых карточек на светлом бетоне */
  --radius-pill: 999px;            /* лунка переключателя языка */

  /* Служебные цвета (не бренд, только состояния форм) */
  --color-error: #B42318;
  --color-success: #1E7B4D;

  /* Шрифт */
  --font-sans: 'Montserrat', Arial, sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  /* Размеры текста (плавно меняются между мобильным и десктопом) */
  --fs-h1: clamp(2.5rem, 1.6rem + 3.6vw, 4.5rem);     /* 40–72 px */
  --fs-h2: clamp(1.75rem, 1.2rem + 2vw, 2.75rem);     /* 28–44 px */
  --fs-h3: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);    /* 20–24 px */
  --fs-body: 1.0625rem;                                /* 17 px */
  --fs-small: 0.875rem;                                /* 14 px */
  --fs-caption: 0.75rem;                               /* 12 px, капитель */
  --tracking-heading: -0.02em;
  --lh-tight: 1.05;
  --lh-heading: 1.15;
  --lh-body: 1.6;
  --tracking-caption: 0.18em;

  /* Отступы: шаг 8 px */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  /* Движение: одна кривая и три длительности */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 200ms;
  --dur-base: 400ms;
  --dur-slow: 800ms;

  /* Сетка: контейнер админки и поля по краям; блоки сайта живут на всю ширину с отступом --ip-pad (industrial.css) */
  --container: 1200px;
  --gutter: 24px;
  /* Высота шапки: 64 px, с 960 px 80 px (base.css). Её учитывают первый экран и закреплённая карусель */
  --header-h: 64px;

  /* Поле ввода и кнопка, фокус */
  --control-height: 52px;
  --focus-ring: 3px solid var(--ip-ink);
  --focus-ring-on-dark: 3px solid var(--color-white);

  /* Админка заявок (admin.css): служебная страница, её светлые цвета */
  --surface: var(--ip-concrete);
  --surface-alt: var(--ip-paper);
  --border: var(--ip-hair);
  --text-secondary: var(--ip-ink-2);
  --text-muted: var(--ip-ink-muted);
  --radius: 14px;
  --shadow-sm: 0 1px 2px rgba(17, 18, 20, 0.06), 0 6px 16px rgba(17, 18, 20, 0.06);
}
