/* ============================================================
   NETTERA — design tokens v1.0 (2026-07-02)
   Источник: BRANDBOOK.md. Подключать в любой лендинг/страницу.
   Светлая тема — основа. Тёмная — через [data-theme="dark"]
   или @media (prefers-color-scheme: dark) при желании.
   ============================================================ */

:root {
  /* --- цвет: светлая тема (основа) --- */
  --nt-bg:         #F6F8F8;
  --nt-surface:    #FFFFFF;
  --nt-ink:        #101413;
  --nt-ink-2:      #5B6664;
  --nt-line:       #E4E9E8;

  --nt-aqua:       #00E5C0;  /* заливки, графика; НЕ текст на белом */
  --nt-aqua-deep:  #008F76;  /* ссылки, текст-акцент, hover кнопок */
  --nt-coral:      #FF6257;
  --nt-coral-deep: #DE4A40;
  --nt-navy:       #0A1E26;  /* тёмная опора: футер, контраст-блоки */

  /* семантика данных */
  --nt-pos:        #00C29A;  /* прибыль/рост (текст на светлом: aqua-deep) */
  --nt-neg:        #DE4A40;  /* убыток/падение */
  --nt-mute:       #9AA7A5;  /* нет данных */

  /* палитра графиков, по порядку серий */
  --nt-chart-1: #00E5C0;
  --nt-chart-2: #14556B;
  --nt-chart-3: #FF6257;
  --nt-chart-4: #8FD3C7;
  --nt-chart-5: #C7A97B;
  --nt-chart-6: #9AA7A5;

  /* --- типографика --- */
  --nt-font-display: "Inter Tight", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --nt-font-text:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --nt-font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* --- форма --- */
  --nt-r-card:  16px;
  --nt-r-ctrl:  10px;
  --nt-r-hero:  24px;
  --nt-r-chip:  999px;
  --nt-shadow-card: 0 1px 2px rgba(16, 20, 19, .04);
  --nt-glow-aqua: none; /* glow — только в тёмной теме */

  /* --- ритм лендинга --- */
  --nt-content-w: 1200px;
  --nt-section-gap: 120px;
}

/* --- тёмная тема (ночной режим) --- */
[data-theme="dark"] {
  --nt-bg:         #071820;
  --nt-surface:    #0E2530;
  --nt-ink:        #EAF4F2;
  --nt-ink-2:      #8FA6A3;
  --nt-line:       #1C3540;

  --nt-aqua:       #00E5C0;  /* в тёмной теме допустим и как текст */
  --nt-aqua-deep:  #2FE8CA;
  --nt-coral:      #FF7A6E;
  --nt-coral-deep: #FF7A6E;
  --nt-navy:       #04111A;

  --nt-pos:        #2FE8CA;
  --nt-neg:        #FF7A6E;
  --nt-mute:       #5B7370;

  --nt-shadow-card: 0 1px 2px rgba(0, 0, 0, .35);
  --nt-glow-aqua: 0 0 24px rgba(0, 229, 192, .35);
}

/* --- базовые классы (по желанию, можно не использовать) --- */
.nt-body {
  background: var(--nt-bg);
  color: var(--nt-ink);
  font-family: var(--nt-font-text);
  font-size: 17px;
  line-height: 1.6;
}
.nt-display {
  font-family: var(--nt-font-display);
  font-weight: 650;
  letter-spacing: -0.02em;
  line-height: 1.05;
}
.nt-num { font-feature-settings: "tnum" 1; font-variant-numeric: tabular-nums; }

.nt-btn-primary {
  background: var(--nt-ink); color: var(--nt-bg);
  border: none; border-radius: var(--nt-r-ctrl);
  padding: 14px 28px; font: 500 16px var(--nt-font-text); cursor: pointer;
}
.nt-btn-primary:hover { background: var(--nt-aqua-deep); }
[data-theme="dark"] .nt-btn-primary { background: var(--nt-ink); color: var(--nt-bg); }

.nt-btn-acid { /* максимум 1 на экран */
  background: var(--nt-aqua); color: var(--nt-navy);
  border: none; border-radius: var(--nt-r-ctrl);
  padding: 14px 28px; font: 600 16px var(--nt-font-text); cursor: pointer;
  box-shadow: var(--nt-glow-aqua);
}
.nt-card {
  background: var(--nt-surface);
  border: 1px solid var(--nt-line);
  border-radius: var(--nt-r-card);
  box-shadow: var(--nt-shadow-card);
}
.nt-chip {
  display: inline-block; padding: 4px 12px; border-radius: var(--nt-r-chip);
  background: rgba(0, 229, 192, .12); color: var(--nt-aqua-deep);
  font: 500 13px var(--nt-font-text);
}