/* ============================================================
   soboleznovaniya.ru — РЕДИЗАЙН 2026 · дизайн-токены
   Источник: dis/Стиль.dc.html (финальный макет Claude Design)
   Монохром · Onest · жирная тесная типографика · мотив скобок { }
   ============================================================ */
:root{
  /* ---------- Палитра (монохром) ---------- */
  --ink:        #16171A;  /* основной текст, тёмные блоки, кнопки     */
  --graphite:   #46474C;  /* вторичный текст                          */
  --slate:      #3A3B40;  /* крупное тело (лиды)                       */
  --ink-2:      #26272C;  /* текст на светлых карточках                */
  --mute:       #B7B7BB;  /* приглушённый акцент, нумерация            */
  --muted:      #9A9B9F;  /* лейблы, подписи, эйбрау                   */
  --muted-2:    #8A8B90;  /* слоган, мягкие подписи                    */
  --cloud:      #F4F4F5;  /* фон светлых блоков/карточек               */
  --paper:      #FFFFFF;
  --pill-bg:    #F1F1F2;  /* фон плавающих пилюль                      */

  --page:       #FFFFFF;  /* фон контентных страниц                   */
  --page-alt:   #ECECEC;  /* фон стайл/служебных страниц              */

  /* ---------- На тёмном фоне (#16171A) ---------- */
  --on-dark:        #FFFFFF;
  --on-dark-2:      #EDEDEF;
  --on-dark-mute:   #A9AAB0;
  --on-dark-faint:  #7E7F86;
  --on-dark-faint2: #6E6F76;
  --dark-panel:     #202126;  /* вложенный блок (предпросмотр/код)     */
  --dark-panel-2:   #2A2B30;
  --dark-border:    #2C2D32;
  --dark-border-2:  #34353A;

  /* ---------- Hairlines / границы на светлом ---------- */
  --line:    #ECECEE;
  --line-2:  #EAEAEC;
  --line-3:  #E2E2E4;
  --border:  #DDDDDF;
  --border-2:#DCDCDE;
  --border-3:#D7D7DA;

  /* ---------- Семантические акценты (минимально) ---------- */
  --yes: #1F8A5B;  /* «можно» в гайд-блоках   */
  --no:  #C2453B;  /* «нельзя» в гайд-блоках   */

  /* ---------- Типографика ---------- */
  --font: 'Onest', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;
  --fw-extrabold:800;

  --track-tight:   -0.03em;
  --track-tighter: -0.04em;
  --track-display: -0.05em;

  /* масштаб дисплейных заголовков (clamp) */
  --h1-display: clamp(44px, 7vw, 104px);
  --h1:         clamp(24px, 3vw, 40px);
  --h2:         clamp(30px, 3.6vw, 52px);
  --h2-sm:      clamp(26px, 3vw, 40px);
  --h3:         clamp(26px, 2.8vw, 36px);

  /* ---------- Радиусы ---------- */
  --r-pill:    999px;
  --r-footer:  30px;
  --r-panel:   28px;   /* большие панели                 */
  --r-card-lg: 24px;   /* карточки разделов, тёмные блоки */
  --r-card:    20px;   /* карточки текстов, мега-меню     */
  --r-card-sm: 14px;
  --r-chip:    12px;
  --r-tag:     9px;
  --r-xs:      8px;

  /* ---------- Тени ---------- */
  --sh-pill:       0 16px 40px rgba(0,0,0,.07);
  --sh-pill-hover: 0 20px 46px rgba(0,0,0,.12);
  --sh-menu:       0 26px 70px rgba(0,0,0,.13);
  --sh-cookie:     0 24px 70px rgba(0,0,0,.28);

  /* ---------- Контейнер / ритм ---------- */
  --container:      1240px;
  --gutter:         40px;
  --gutter-mobile:  18px;
}