/* =========================================================================
   Monolith Grill — дизайн-токены (seed дизайн-системы)
   Извлечено из утверждаемой главной. Единый источник правды: цвета,
   типографику, радиусы и раскладку берём отсюда, а инлайн-стили в разметке
   постепенно мигрируем на эти переменные. Отсюда же питается шаблон Битрикса.
   ========================================================================= */

:root {

  /* -------- Флеймовая (акцентная) гамма -------- */
  --color-accent:        #ED7821;   /* база: ссылки, кнопки */
  --color-accent-hover:  #FF9E4D;   /* ховер, начало градиента */
  --color-accent-light:  #FFB877;   /* светлый акцент */
  --color-accent-mid:    #E25F1D;
  --color-accent-deep:   #C6420A;   /* тёмный акцент, конец градиента */
  --gradient-flame: linear-gradient(120deg, #FF9E4D, #ED7821 55%, #C6420A);

  /* -------- Тёмные поверхности -------- */
  --color-bg:            #17110D;   /* фон страницы */
  --color-bg-deep:       #0E0A07;   /* тёмная секция (видео) */
  --color-bg-footer:     #0B0805;
  --color-surface-dark:  #1A120B;
  --color-ink:           #231A12;   /* тёмный текст на светлом фоне */

  /* -------- Светлые / кремовые поверхности -------- */
  --color-surface-light: #F3EADD;   /* светлая секция (рецепты) */
  --color-cream:         #FBF3E9;   /* заголовки на тёмном */
  --color-cream-2:       #F0E7DA;
  --color-cream-3:       #E8DECF;

  /* -------- Текст -------- */
  --color-text:              #F5ECE2;   /* основной текст на тёмном */
  --color-text-muted:        #B7A793;   /* приглушённый на тёмном */
  --color-text-muted-light:  #6B5C4C;   /* приглушённый на светлом */
  --color-text-muted-2:      #CBB9A5;

  /* -------- Границы / оверлеи -------- */
  --border-hairline-light: rgba(255,255,255,.06);  /* хайрлайн на тёмном */
  --border-hairline-dark:  rgba(80,40,10,.08);     /* хайрлайн на светлом */
  --overlay-dark:          rgba(0,0,0,.6);

  /* -------- Типографика -------- */
  --font-display: 'Oswald', sans-serif;                   /* h1–h3, uppercase */
  --font-heading: 'Wix Madefor Display', sans-serif;      /* подзаголовки */
  --font-body:    'Wix Madefor Text', system-ui, sans-serif;

  --fw-medium:    500;
  --fw-semibold:  600;
  --fw-bold:      700;
  --fw-extrabold: 800;

  /* Кегли заголовков (флюид, clamp) */
  --fs-display: clamp(40px, 5vw,   74px);   /* hero h1 */
  --fs-h2:      clamp(34px, 3.8vw, 56px);
  --fs-h2-sm:   clamp(32px, 3.6vw, 52px);
  --fs-h3:      clamp(30px, 3.4vw, 50px);
  --tracking-tight: -2px;                    /* letter-spacing заголовков */

  /* -------- Радиусы -------- */
  --radius-sm:    8px;    /* унифицирует разнобой 7/8px */
  --radius-md:    12px;   /* карточки */
  --radius-lg:    16px;
  --radius-pill:  999px;
  --radius-round: 50%;

  /* -------- Раскладка -------- */
  --container-max: 1320px;
  --container-pad: 32px;
  --section-py:    104px;

  /* -------- Спейсинг (шкала) -------- */
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 22px;
  --space-lg: 32px;
  --space-xl: 48px;
}