/* ==========================================================================
   Дизайн-токены «Планетакасс»
   --------------------------------------------------------------------------
   Визуальный язык построен вокруг чековой ленты: тёплая бумага, термопечать,
   табличные цифры, пунктир и перфорация. Все пары «текст/фон» проверены
   на контраст по WCAG 2.1 AA, значение указано в комментарии.
   ========================================================================== */

:root {
  /* --- Тёмные поверхности ------------------------------------------- */
  --c-ink:        #0e1622;  /* основной тёмный фон */
  --c-ink-2:      #17233a;  /* приподнятая карточка на тёмном */
  --c-ink-3:      #26344f;  /* бордеры и разделители на тёмном */
  --c-ink-4:      #37486a;  /* активные бордеры на тёмном */

  /* --- Светлые поверхности ------------------------------------------ */
  --c-paper:      #f4f2ec;  /* бумага чековой ленты */
  --c-paper-2:    #eceae2;  /* второй уровень на бумаге */
  --c-white:      #ffffff;  /* свежая лента: карточки и прайс */
  --c-line:       #e0ddd3;  /* бордеры на светлом */
  --c-line-soft:  #ebe8e0;

  /* --- Текст --------------------------------------------------------- */
  --c-text:       #14181f;  /* 15.9:1 на бумаге */
  --c-muted:      #6e6c66;  /*  4.7:1 на бумаге */
  --c-on-ink:     #ffffff;
  --c-muted-ink:  #98a6bd;  /*  7.1:1 на тёмном */

  /* --- Акцент: приглушённый сине-зелёный ------------------------------
     Крупные заливки держим на тёмном графите, акцент работает точечно:
     ссылки, активные состояния, мелкие метки. -------------------------- */
  --c-accent:        #0f5f73;  /* заливки на светлом, белый текст — 7.2:1 */
  --c-accent-hover:  #0d5162;
  --c-accent-ink:    #0f5f73;  /* текст и ссылки на светлом — 6.5:1 на бумаге */
  --c-accent-bright: #5ec8dd;  /* акцент на тёмном — 9.3:1 */
  --c-accent-soft:   #eaf3f6;
  --c-accent-line:   #c4dde4;

  /* --- Подтверждение: «чек ушёл в ОФД» -------------------------------- */
  --c-ok:         #0b7c69;  /* 4.6:1 на бумаге */
  --c-ok-bright:  #19c3a6;  /* 8.1:1 на тёмном */
  --c-ok-soft:    #e3f5f1;

  --c-warn:       #9a6300;
  --c-danger:     #c02626;

  /* --- Интерактив ---------------------------------------------------- */
  --c-link:        var(--c-accent-ink);
  --c-link-hover:  #0a4757;
  --c-link-ink:    var(--c-accent-bright);   /* ссылка на тёмном фоне */
  --c-focus:       #0f5f73;
  --c-selection:   #cfe8ef;

  /* --- Типографика --------------------------------------------------- */
  --font-sans: "Golos Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  /* Модульная шкала 1.25 с плавным сжатием на узких экранах */
  --fs-display: clamp(2.5rem, 1.35rem + 4vw, 4rem);
  --fs-h1:      clamp(2.1rem, 1.45rem + 2.6vw, 3.375rem);
  --fs-h2:      clamp(1.75rem, 1.3rem + 1.9vw, 2.625rem);
  --fs-h3:      clamp(1.3125rem, 1.15rem + 0.7vw, 1.625rem);
  --fs-h4:      1.125rem;
  --fs-lead:    clamp(1.0625rem, 1rem + 0.35vw, 1.1875rem);
  --fs-body:    1rem;
  --fs-sm:      0.9375rem;
  --fs-xs:      0.8125rem;
  --fs-label:   0.6875rem;   /* надзаголовки моноширинным капслоком */

  --lh-tight:   1.05;
  --lh-heading: 1.18;
  --lh-body:    1.62;

  --ls-display: -0.035em;
  --ls-heading: -0.02em;
  --ls-label:   0.12em;

  --measure:      62ch;   /* комфортная длина строки */
  --measure-wide: 68ch;

  /* --- Ритм ---------------------------------------------------------- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;
  --sp-9: 6rem;

  --section-py: clamp(3.5rem, 2rem + 5.5vw, 6.5rem);
  --container:  1220px;
  --gutter:     clamp(1.125rem, 0.5rem + 2vw, 2.5rem);

  --r-sm:   6px;
  --r-md:   12px;
  --r-lg:   18px;
  --r-xl:   26px;
  --r-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(20, 24, 31, .05), 0 2px 6px rgba(20, 24, 31, .04);
  --shadow-md: 0 2px 8px rgba(20, 24, 31, .06), 0 14px 34px rgba(20, 24, 31, .07);
  --shadow-lg: 0 24px 64px rgba(14, 22, 34, .18);

  --header-h: 72px;
  --ease: cubic-bezier(.4, 0, .2, 1);
  --dur: .2s;
}