/* ============================================================
   ЛЕЧО · Дизайн-токены
   Источник: брендбук «Руководство по фирстилю» (2025), стр. 15–16.
   Все значения — CSS-переменные. Лендинги тянут отсюда.
   ============================================================ */

:root {
  /* ── Фирменная палитра (брендбук, стр. 15) ──────────────── */
  --lecho-cream:   #F4EDDC; /* Кремовый — основной светлый фон        */
  --lecho-paper:   #D1C5AC; /* Тёплый светло-бежевый — «бумага»       */
  --lecho-red:     #D33C31; /* Яшмовый красный — основной акцент/CTA  */
  --lecho-olive:   #5F5E40; /* Глубокий оливковый — тёмные секции     */
  --lecho-green:   #96AA7D; /* Светло-травянистый — акцент «еда»      */
  --lecho-blue:    #5681A7; /* Небесно-синий — акцент «бар/напитки»   */
  --lecho-black:   #0D0802; /* Классический чёрный — текст            */

  /* ── Производные оттенки (UI-состояния, фоны) ───────────── */
  --lecho-cream-50:  #FBF7EE;
  --lecho-cream-200: #ECE2CC;
  --lecho-red-600:   #BE2F25;
  --lecho-red-700:   #A2271E;
  --lecho-red-100:   #F7DAD6;
  --lecho-olive-700: #4A4932;
  --lecho-olive-900: #353425;
  --lecho-green-700: #738558;
  --lecho-blue-700:  #436A8C;

  /* ── Семантические роли ─────────────────────────────────── */
  --color-bg:          var(--lecho-cream);
  --color-bg-alt:      var(--lecho-paper);
  --color-bg-dark:     var(--lecho-olive);
  --color-surface:     var(--lecho-cream-50);

  --color-text:        var(--lecho-black);
  --color-text-muted:  #6B6552;
  --color-text-invert: var(--lecho-cream);

  --color-primary:        var(--lecho-red);
  --color-primary-hover:  var(--lecho-red-600);
  --color-primary-active: var(--lecho-red-700);
  --color-on-primary:     #FFFFFF;

  --color-accent-food: var(--lecho-green);   /* разделы кухни          */
  --color-accent-bar:  var(--lecho-blue);    /* бар, коктейли, напитки */

  --color-line:        rgba(13, 8, 2, 0.14);
  --color-line-strong: rgba(13, 8, 2, 0.28);

  /* ── Типографика (брендбук, стр. 16) ────────────────────── */
  /* Бренд-шрифты (самостоятельный хостинг, fonts.css) — свободные лицензии:
     Catallina (Free Font EULA, веб-шрифты разрешены) + Mulish (SIL OFL).
     Рукописный акцент — Caveat (SIL OFL); Annabelle убран (только личн. исп.).
     Прочие имена в стеках — graceful-фолбэки на системные шрифты. */
  --font-display: "Catallina", "Playfair Display", Georgia, "Times New Roman", serif;
  --font-script:  "Caveat", "Segoe Script", cursive;
  --font-body:    "Mulish", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Шкала размеров (адаптивная, clamp) */
  --fs-display: clamp(2.75rem, 6.2vw, 5rem);
  --fs-h1:      clamp(2.25rem, 4.6vw, 3.5rem);
  --fs-h2:      clamp(1.75rem, 3.2vw, 2.5rem);
  --fs-h3:      clamp(1.3rem, 2vw, 1.6rem);
  --fs-lead:    clamp(1.1rem, 1.6vw, 1.3rem);
  --fs-body:    1.0625rem;
  --fs-small:   0.875rem;
  --fs-eyebrow: 0.8125rem;

  --lh-tight: 1.06;
  --lh-snug:  1.25;
  --lh-body:  1.65;

  --ls-eyebrow: 0.18em;
  --ls-tight:  -0.01em;

  /* ── Отступы и сетка ────────────────────────────────────── */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.5rem;
  --space-6:  2rem;
  --space-8:  3rem;
  --space-10: 4rem;
  --space-12: 6rem;

  --section-y: clamp(3.5rem, 8vw, 7rem);
  --container:        1180px;
  --container-narrow: 760px;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);

  /* ── Радиусы ────────────────────────────────────────────── */
  --radius-sm:   6px;
  --radius:      14px;
  --radius-lg:   22px;
  --radius-pill: 999px;

  /* ── Тени (тёплые, на оттенке коричневого) ──────────────── */
  --shadow-sm: 0 2px 6px rgba(69, 42, 20, 0.10);
  --shadow:    0 12px 30px -12px rgba(69, 42, 20, 0.28);
  --shadow-lg: 0 28px 60px -20px rgba(69, 42, 20, 0.40);

  /* ── Прочее ─────────────────────────────────────────────── */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --transition: 200ms var(--ease);

  /* Лёгкая «бумажная» зернистость — SVG-шум как data URI.
     Кладётся фоном поверх секции через .paper / utility-класс. */
  --paper-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}