/* ═══════════════════════════════════════════════════════════
   FLANG.IO — DESIGN TOKENS
   Подключать на каждой новой странице:
   <link rel="stylesheet" href="/css/tokens.css">
   Шрифт DrukTextWideTT подключается отдельно через /css/fonts.css
   ═══════════════════════════════════════════════════════════ */

:root {

  /* ── АКЦЕНТЫ ────────────────────────────────────────────── */
  --coral:       #ff7964;
  --brand-blue:  #4179d5;

  /* ── ГРАДИЕНТ ───────────────────────────────────────────── */
  --grad-start:  #3ad9bc;
  --grad-end:    #48bc20;
  --gradient:    linear-gradient(135deg, var(--grad-start), var(--grad-end));

  /* ── ТЁМНЫЙ ─────────────────────────────────────────────── */
  --navy:        #0a3a4d;

  /* ── ТЕГ-ПИЛЛ ───────────────────────────────────────────── */
  --tag-yellow:  #ffdc70;

  /* ── ТЁПЛЫЕ ФОНЫ ────────────────────────────────────────── */
  --beige-light: #feefcf;
  --beige-warm:  #fee8bf;

  /* ── ТЕКСТ ──────────────────────────────────────────────── */
  --text-primary:   #231f20;
  --text-secondary: #575757;
  --text-muted:     #808080;

  /* ── ФОНЫ ───────────────────────────────────────────────── */
  --bg-page:  #f6f6f8;
  --bg-white: #ffffff;
  --bg-input: #f6f6f6;

  /* ── БОРДЕР ─────────────────────────────────────────────── */
  --border: #e4e4e8;

  /* ── РАДИУСЫ ────────────────────────────────────────────── */
  --radius-pill: 100px;
  --radius-btn:  8px;
  --radius-card: 16px;

  /* ── ШРИФТЫ ─────────────────────────────────────────────── */
  --font-display: 'DrukTextWideTT', 'Barlow Condensed', Arial, sans-serif;
  --font-body:    'Inter', Arial, sans-serif;

  /* ── ТИПОГРАФИЧЕСКАЯ ШКАЛА ──────────────────────────────── */
  /* МИНИМУМ для контента: --text-base. --text-xs/sm только   */
  /* для служебных элементов (теги, футер, даты, метки).      */
  --text-xs:   12px;                       /* теги, метки, копирайт          */
  --text-sm:   13px;                       /* служебный текст, футер, даты   */
  --text-base: 16px;                       /* основной текст карточек, тело  */
  --text-md:   18px;                       /* подзаголовки, intro            */
  --text-lg:   clamp(20px, 1.6vw, 24px);  /* h3                             */
  --text-h2:   clamp(26px, 2.5vw, 38px);  /* заголовки секций               */
  --text-hero: clamp(32px, 3vw, 46px);    /* hero h1                        */

  /* ── СЕКЦИОННЫЕ ОТСТУПЫ ─────────────────────────────────── */
  --space-sm: 60px;
  --space-md: 90px;
  --space-lg: 120px;

  /* ── КОНТЕЙНЕР ──────────────────────────────────────────── */
  --container: 1200px;
  --container-padding: 40px;

}