/*
 * tokens.css — основа кита «Инссмарт, b2c-главная», разложенная один к одному на MUI-тему.
 * Имена — те же, что MUI выдаёт CSS-переменными при createTheme({ cssVariables: true }):
 * --mui-palette-<цвет>-<оттенок>, --mui-font-<вариант типографики>, --mui-shadows-<n>, --mui-spacing,
 * --mui-shape-borderRadius, --mui-zIndex-<слой>. Сам объект темы — foundations/theme.ts (те же значения).
 * Значения сняты со скринов source/home-desktop.png и source/home-mobile.png (пипетка, разметка);
 * чего в материале нет — «достроено» (foundations/*.md, theme.ts).
 * Ниже --kit-* — то, чего в теме MUI нет как переменной: размеры контролов, иконки, линии, отклик,
 * длительности (в MUI — theme.transitions, в CSS-переменные не выходят), градиенты, сетка страницы.
 * Атомы, молекулы, организмы и страницы используют только эти переменные.
 */
:root {
  /* КАСКО: ступени с присланного десктопного материала, независимые от главной. */
  --kit-kasko-font-h1: 800 48px/1.08 var(--kit-font-family);
  --kit-kasko-font-h2: 750 36px/1.15 var(--kit-font-family);
  --kit-kasko-font-h3: 700 24px/1.2 var(--kit-font-family);
  --kit-kasko-font-title: 650 16px/1.35 var(--kit-font-family);
  --kit-kasko-font-lead: 400 16px/1.5 var(--kit-font-family);
  --kit-kasko-calculator-columns: minmax(0, 0.29fr) minmax(0, 0.71fr);
  --kit-kasko-article-columns: minmax(0, 0.235fr) minmax(0, 0.765fr);
  --kit-kasko-chat-columns: minmax(0, 2fr) minmax(0, 1fr);
  --kit-kasko-faq-columns: minmax(0, 0.7fr) minmax(0, 0.3fr);
  --kit-kasko-expert-columns: 110px minmax(0, 1fr) auto;
  --kit-kasko-hero-width: 620px;
  --kit-kasko-lead-width: 700px;
  --kit-kasko-stats-height: 96px;
  --kit-kasko-review-height: 250px;
  /* ═══ palette ═══ */
  /* primary — тёмная основная кнопка, отмеченные контролы, активная вкладка */
  --mui-palette-primary-main: #17181a;
  --mui-palette-primary-light: #3a3b40;        /* достроено */
  --mui-palette-primary-dark: #2c2d31;         /* наведение тёмной кнопки — светлее main (достроено) */
  --mui-palette-primary-lighter: #f5f5f5;      /* подложка «мягкого» варианта = grey-100 */
  --mui-palette-primary-contrastText: #ffffff;
  /* secondary — розовый акцент бренда (Д 2206 «экономия», Д 7734 «Показать все», Д 11094 кнопка) */
  --mui-palette-secondary-main: #f7699a;
  --mui-palette-secondary-light: #f6d9e5;      /* М 1838 аватар-инициалы */
  --mui-palette-secondary-dark: #ba3f6e;       /* Д 10916 «ВЫ — КЛИЕНТ», М 101 бейдж; наведение */
  --mui-palette-secondary-lighter: #fdebf1;    /* Д 990 плитка, карточка клиента */
  --mui-palette-secondary-contrastText: #ffffff;
  /* info — синий: ссылка-акцент, «в работе», контурная кнопка агентов, синяя кнопка */
  --mui-palette-info-main: #0095ff;
  --mui-palette-info-light: #a0d7ff;           /* Д 38 светлая кромка контурной кнопки */
  --mui-palette-info-dark: #256fae;            /* Д 1256 текст на голубой подложке; наведение */
  --mui-palette-info-lighter: #e7f1fb;         /* Д 1440 плитка, Д 1934 «в работе» */
  --mui-palette-info-contrastText: #ffffff;
  /* success — галки, «возврат денег», кружок-стрелка, шаг «готово», переключатель */
  --mui-palette-success-main: #2b8a63;
  --mui-palette-success-light: #7fbfa3;        /* достроено */
  --mui-palette-success-dark: #1f6b4c;         /* достроено */
  --mui-palette-success-lighter: #e7f3ed;      /* Д 3583 подложка «возврат денег» */
  --mui-palette-success-contrastText: #ffffff;
  /* warning — звёзды рейтинга (Д 553); как статус — достроено */
  --mui-palette-warning-main: #e2a838;
  --mui-palette-warning-light: #f0cd85;        /* достроено */
  --mui-palette-warning-dark: #a87414;         /* достроено */
  --mui-palette-warning-lighter: #fbf1dc;      /* достроено */
  --mui-palette-warning-contrastText: #17181a;
  /* error — красного в материале нет, всё достроено */
  --mui-palette-error-main: #e5484d;
  --mui-palette-error-light: #f19a9d;
  --mui-palette-error-dark: #b8282d;
  --mui-palette-error-lighter: #fdecec;
  --mui-palette-error-contrastText: #ffffff;
  /* white, neutral — свои цвета палитры (palette augmentation): белая кнопка на тёмном, пилюли на тёмном */
  --mui-palette-white-main: #ffffff;
  --mui-palette-white-dark: #f5f5f5;
  --mui-palette-white-contrastText: #17181a;
  --mui-palette-neutral-main: #232427;         /* Д 8270 пилюли страховых на тёмном */
  --mui-palette-neutral-dark: #2c2d31;
  --mui-palette-neutral-contrastText: #ffffff;

  --mui-palette-text-primary: #17181a;         /* Д 150 заголовок */
  --mui-palette-text-secondary: #6e7075;       /* Д 270 абзац */
  --mui-palette-text-disabled: #9b9ca0;        /* Д 593 мелкое пояснение, плейсхолдер */
  --mui-palette-divider: #e0e3e6;              /* Д 79 линия, рамки карточек */
  --mui-palette-background-default: #ffffff;
  --mui-palette-background-paper: #ffffff;
  --mui-palette-common-white: #ffffff;
  --mui-palette-common-black: #17181a;
  --mui-palette-common-onDarkSecondary: #9b9ca0;        /* вторичный текст на тёмном */
  --mui-palette-common-onDarkDivider: rgba(255, 255, 255, 0.12);
  --mui-palette-common-backdrop: rgba(23, 24, 26, 0.48); /* подложка диалога — достроено */

  --mui-palette-grey-50: #fbfbfb;              /* Д 4672 строка калькулятора */
  --mui-palette-grey-100: #f5f5f5;             /* Д 505 чип, серые секции */
  --mui-palette-grey-200: #e0e3e6;             /* = divider */
  --mui-palette-grey-500: #9b9ca0;
  --mui-palette-grey-700: #6e7075;
  --mui-palette-grey-800: #232427;
  --mui-palette-grey-900: #17181a;

  --mui-palette-action-active: #17181a;
  --mui-palette-action-hover: rgba(23, 24, 26, 0.04);     /* достроено */
  --mui-palette-action-selected: rgba(23, 24, 26, 0.08);  /* достроено */
  --mui-palette-action-disabled: #9b9ca0;
  --mui-palette-action-disabledBackground: #f5f5f5;
  --mui-palette-action-focus: rgba(0, 149, 255, 0.35);    /* достроено: цвет кольца фокуса */

  /* section — свои цвета секций страницы */
  --mui-palette-section-pink: #fff0f5;         /* Д 3760, Д 6400 */
  --mui-palette-section-lavender: #f4f5fb;     /* Д 1870 */
  --mui-palette-section-grey: #f5f5f5;         /* Д 7200, М 880 */
  --mui-palette-section-dark: #17181a;         /* Д 7900, подвал */
  --mui-palette-section-navy: #2d4864;         /* Д 4650 навигатор оценки */
  --mui-palette-section-navyText: #9db2c7;     /* подпись на навигаторе, М 10600 телефон */
  --mui-palette-section-warm: #fbfbf7;         /* М 370 подложка иллюстраций */
  --mui-palette-brand-logoWord: #32312e;       /* Д 38 слово логотипа */

  /* ═══ typography: --mui-font-<вариант> = weight size/lineHeight family (как выдаёт MUI) ═══ */
  --kit-font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --kit-font-family-system: system-ui, sans-serif; /* достроено: переносимая системная замена без внешних шрифтов */
  --mui-font-h1: 800 56px/1 var(--kit-font-family);          /* Д 140 «Любая финансовая задача», Д 4690 «34 700 ₽» */
  --mui-font-h2: 800 40px/1.08 var(--kit-font-family);       /* Д 437 заголовки секций, Д 8182 «105 000» */
  --mui-font-h3: 700 28px/1.15 var(--kit-font-family);       /* Д 10950 «Найдите выгодную страховку…» */
  --mui-font-h4: 600 24px/1.2 var(--kit-font-family);        /* Д 684 «2,5 млн», Д 3045 «ОСАГО» */
  --mui-font-h5: 600 20px/1.3 var(--kit-font-family);        /* Д 10172 «Не нашли свой вопрос?», Д 10299 */
  --mui-font-h6: 600 18px/1.3 var(--kit-font-family);        /* Д 1050 «Страховка без переплат» */
  --mui-font-subtitle1: 400 18px/1.4 var(--kit-font-family); /* Д 280 лид hero */
  --mui-font-subtitle2: 600 15px/1.35 var(--kit-font-family);/* Д 10180 вопрос FAQ, Д 1444 «105 000 агентов…» */
  --mui-font-body1: 400 16px/1.45 var(--kit-font-family);    /* Д 1493 абзац */
  --mui-font-body2: 400 14px/1.45 var(--kit-font-family);    /* Д 1085 текст карточки */
  --mui-font-caption: 400 12px/1.35 var(--kit-font-family);  /* Д 713 подпись показателя */
  --mui-font-overline: 700 11px/1.2 var(--kit-font-family);  /* Д 934 «ЗАДАЧА · №4812» */
  --mui-font-button: 600 15px/1 var(--kit-font-family);      /* Д 38 «Поставить задачу» */
  /* letterSpacing (в шорткат font не входит) */
  --kit-ls-h1: -0.035em; --kit-ls-h2: -0.03em; --kit-ls-h3: -0.02em; --kit-ls-h4: -0.01em; --kit-ls-overline: 0.04em;
  /* размеры шрифта компонентов — в теме это components.<Mui…>.styleOverrides, не ступени typography */
  --kit-font-chip: 500 13px/1 var(--kit-font-family);        /* MuiChip label (у MUI по умолчанию тоже 13) */
  --kit-font-chip-small: 600 10px/1 var(--kit-font-family);  /* MuiChip size=small: Д 3015 «Авто · ОСАГО», Д 9748 «Загрузите в» */
  /* typography.fontWeight* */
  --kit-fw-regular: 400; --kit-fw-medium: 500; --kit-fw-semibold: 600; --kit-fw-bold: 700;
  /* размеры текста внутри компонентов (styleOverrides): с материала, не ступени typography */
  --kit-fs-control: 15px;   /* поле, пункт навигации, подпись чекбокса — Д 414, Д 38 */
  --kit-fs-dense: 14px;     /* кнопка small, подпись поля, ссылка-стрелка, вкладка-пилюля — Д 1297 */
  --kit-fs-list: 13px;      /* ссылки списков и подвала, подпись показателя на тёмном — Д 4180, Д 8222 */
  --kit-fs-store: 16px;     /* «App Store» — Д 9755 */
  --kit-fs-micro: 11px;     /* витрина: подписи образцов (kit.css) */
  --kit-fs-code: 12px;      /* витрина: код в таблицах (kit.css) */

  /* ═══ spacing: theme.spacing(n) = n × 8px ═══ */
  --mui-spacing: 8px;
  --kit-sp-1: calc(var(--mui-spacing) * 0.5);   /* 4  */
  --kit-sp-2: var(--mui-spacing);               /* 8  */
  --kit-sp-3: calc(var(--mui-spacing) * 1.5);   /* 12 */
  --kit-sp-4: calc(var(--mui-spacing) * 2);     /* 16 */
  --kit-sp-5: calc(var(--mui-spacing) * 2.5);   /* 20 */
  --kit-sp-6: calc(var(--mui-spacing) * 3);     /* 24 */
  --kit-sp-8: calc(var(--mui-spacing) * 4);     /* 32 */
  --kit-sp-10: calc(var(--mui-spacing) * 5);    /* 40 */
  --kit-sp-12: calc(var(--mui-spacing) * 6);    /* 48 */
  --kit-sp-16: calc(var(--mui-spacing) * 8);    /* 64 */
  --kit-sp-24: calc(var(--mui-spacing) * 12);   /* 96 */

  /* ═══ shape: borderRadius = кнопка, поле (Д 38); остальное — свои ключи shape ═══ */
  --mui-shape-borderRadius: 12px;
  --mui-shape-radiusXs: 6px;         /* Д 3015 метка-категория */
  --mui-shape-radiusSm: 10px;        /* Д 1456 плитка, строка калькулятора */
  --mui-shape-radiusField: 20px;     /* Д 414 поле запроса hero */
  --mui-shape-radiusCard: 20px;      /* карточки */
  --mui-shape-radiusCardLg: 24px;    /* иллюстрации, навигатор, тёмная карточка */
  --mui-shape-radiusPill: 999px;     /* чипы, метки, круглые кнопки */
  --mui-shape-radiusCheckbox: 4px;   /* достроено */

  /* ═══ shadows 0–24: снятые ступени + промежуточные достроены (theme.ts) ═══ */
  --mui-shadows-0: none;
  --mui-shadows-1: 0 1px 2px rgba(23, 24, 26, 0.06);                                  /* достроено: наведение */
  --mui-shadows-4: 0 6px 18px rgba(23, 24, 26, 0.12), 0 1px 0 rgba(23, 24, 26, 0.04);  /* Д 414 поле hero */
  --mui-shadows-8: 0 14px 34px rgba(23, 24, 26, 0.16);                                 /* Д 1895 карточка задачи */
  --mui-shadows-24: 0 24px 60px rgba(23, 24, 26, 0.24);                                /* достроено: диалог, снэкбар, меню */
  --kit-focus-ring: 0 0 0 3px var(--mui-palette-action-focus);
  --kit-focus-ring-inset: inset 0 0 0 2px rgba(0, 149, 255, 0.6);

  /* ═══ zIndex (значения MUI) ═══ */
  --mui-zIndex-appBar: 1100; --mui-zIndex-drawer: 1200; --mui-zIndex-modal: 1300;
  --mui-zIndex-snackbar: 1400; --mui-zIndex-tooltip: 1500;

  /* ═══ transitions (theme.transitions; движения в материале нет — значения MUI) ═══ */
  --kit-duration-shortest: 150ms; --kit-duration-shorter: 200ms; --kit-duration-standard: 300ms;
  --kit-duration-spin: 700ms;
  --kit-duration-indeterminate: 1400ms;
  --kit-easing-easeInOut: cubic-bezier(0.4, 0, 0.2, 1);
  --kit-easing-easeOut: cubic-bezier(0, 0, 0.2, 1);

  /* ═══ размеры компонентов (components.*.styleOverrides) ═══ */
  --kit-size-small: 36px;            /* Button/Chip/TextField small: М 29 «Задача» */
  --kit-size-medium: 44px;           /* medium: кнопка, поле */
  --kit-size-large: 48px;            /* large: Д 414 «Решить задачу» */
  --kit-size-store: 56px;            /* значок магазина */
  --kit-size-label: 28px;            /* Chip small-метка статуса */
  --kit-size-label-small: 20px;      /* метка-категория, длительность */
  --kit-size-check: 18px;            /* Checkbox/Radio, спиннер, галка шага */
  --kit-size-dot: 8px;               /* Badge dot, точка радио */
  --kit-box-xs: 24px; --kit-box-s: 32px; --kit-box-m: 40px; --kit-box-l: 48px; /* Avatar, StepIcon, IconButton */
  --kit-switch-w: 40px; --kit-switch-h: 24px; --kit-switch-knob: 18px; --kit-switch-pad: 3px; /* достроено */
  --kit-inset-action: 8px;           /* кнопка внутри поля: одинаково со всех сторон (Д 6785) */
  --kit-inset-hero: 16px;            /* то же в поле hero (Д 414, М 645) */
  --kit-w-select: 220px; --kit-w-tooltip: 240px; --kit-w-snackbar: 360px; --kit-w-dialog: 480px; --kit-w-stat-label: 200px;
  --kit-h-textarea-min: 88px; --kit-h-textarea-max: 240px;

  /* ═══ иконки ═══ */
  --kit-icon-2xs: 12px; --kit-icon-xs: 14px; --kit-icon-sm: 16px; --kit-icon-md: 20px; --kit-icon-lg: 24px;
  --kit-icon-stroke: 1.75;

  /* ═══ линии и отклик ═══ */
  --kit-bw: 1px; --kit-bw-strong: 1.5px; --kit-bw-2: 2px;
  --kit-width-inspector: 320px; /* достроено: панель инспектора компонентов */
  --kit-shift-hover: 3px; --kit-press-scale: 0.98; --kit-press-scale-s: 0.94;
  --kit-halo-hover: 4px; --kit-halo-press: 6px; --kit-tip-arrow: 5px;

  /* ═══ градиенты ═══ */
  --kit-gradient-night: radial-gradient(60% 80% at 50% 0%, rgba(160, 80, 140, 0.28), transparent 70%), linear-gradient(180deg, #233351 0%, #263e5d 100%); /* Д 8930 */
  --kit-gradient-progress: linear-gradient(90deg, #0594fd 0%, #9d7fd0 55%, #f36a9c 100%);   /* Д 2005 */
  --kit-gradient-brand: linear-gradient(135deg, #f0508c 0%, #b678c8 50%, #3da8f0 100%);     /* Д 38 знак */
  --kit-gradient-fade: linear-gradient(180deg, #fbeef4 0%, #e8f0fb 100%);                   /* Д 10700 */

  /* ═══ сетка страницы (MUI Grid/Container; breakpoints Инссмарт, components-ui theme.tsx: xs 480 · sm 600 · md 840 · lg 1280 · xl 1600) ═══ */
  --kit-container: 1320px;           /* Container maxWidth — Д: контент 60…1380 при 1440 (Container lg с 1280, maxWidth переопределён материалом) */
  --kit-gutter: 60px;                /* поля Container на lg+ — Д 60 */
  --kit-columns: 12;                 /* колонки Grid: 4 xs · 8 sm · 12 md+ (Material Design) */
  --kit-gap: 16px;                   /* промежуток Grid (spacing 2) — Д 3184 ряд карточек; одинаков на всех ширинах */
  --kit-section-y: 64px;             /* вертикальные поля секции — Д 1840→1900, Д 3730→3795 */
  --kit-faq-space-y: var(--kit-sp-16);
  --kit-measure: 640px;              /* ширина строки центрированного лида — Д 888 */
  --kit-w-section-head: 760px;      /* заголовок секции с лидом — Д 586 */
  --kit-h-product-body: 180px;      /* тело малой карточки продукта — Д 3335–3515 */
  --kit-quote-photo: 200px;         /* фото в цитате — Д 7895 */
  --kit-w-qr: 380px; --kit-qr: 72px; /* блок QR — Д 9795 */
  --kit-w-hero-lead: 560px;         /* лид hero — Д 280 */
  --kit-w-cta-field: 720px;         /* поле на градиенте — Д 9110 */
  --kit-scroller-item: 240px;        /* карточка в ленте на узком экране — М 2790 */
}

:root { --kit-demo-opacity: .6; --kit-osago-title: 800 48px/1.06 var(--kit-font-family); --kit-osago-heading: 750 34px/1.15 var(--kit-font-family); }

/* xs темы ниже 480 — мобильные ступени типографики М (theme.ts: breakpoints.down('xs')) */
@media (max-width: 479.98px) {
  :root {
    --mui-font-h1: 800 34px/1.08 var(--kit-font-family);   /* М 140 */
    --mui-font-h2: 800 28px/1.12 var(--kit-font-family);   /* М 1085 */
    --mui-font-h3: 700 22px/1.2 var(--kit-font-family);    /* М 8870 */
    --mui-font-h4: 600 20px/1.2 var(--kit-font-family);    /* М 890 «25 компаний» */
    --mui-font-h5: 600 18px/1.3 var(--kit-font-family);    /* М 10512 */
    --mui-font-subtitle1: 400 16px/1.4 var(--kit-font-family); /* М 270 */
  }
}
/* раскладка xs (0–599): 4 колонки, поля и радиусы М */
@media (max-width: 599.98px) {
  :root {
    --kit-gutter: 20px;              /* М 20 */
    --kit-columns: 4;
    --kit-section-y: 40px;           /* М 1640→1680 */
    --kit-faq-space-y: var(--kit-sp-10);
    --mui-shape-radiusCard: 16px;
    --mui-shape-radiusField: 16px;
  }
}
/* типографика планшета 480–839 (xs…md) — достроено */
@media (min-width: 480px) and (max-width: 839.98px) {
  :root {
    --mui-font-h1: 800 44px/1.04 var(--kit-font-family);
    --mui-font-h2: 800 32px/1.1 var(--kit-font-family);
    --mui-font-h3: 700 24px/1.15 var(--kit-font-family);
  }
}
/* sm (600–839): планшет портрет — достроено по Material Design (8 колонок, поля 32) */
@media (min-width: 600px) and (max-width: 839.98px) {
  :root {
    --kit-gutter: 32px;
    --kit-columns: 8;
    --kit-section-y: 48px;
    --kit-faq-space-y: var(--kit-sp-12);
  }
}
/* md (840–1279): планшет альбом / малый ноутбук — достроено (12 колонок, поля 40) */
@media (min-width: 840px) and (max-width: 1279.98px) {
  :root {
    --mui-font-h1: 800 48px/1.02 var(--kit-font-family);
    --mui-font-h2: 800 36px/1.1 var(--kit-font-family);
    --kit-gutter: 40px;
    --kit-section-y: 56px;
    --kit-faq-space-y: calc(var(--mui-spacing) * 7);
  }
}