/* Демо-панель: старое стекло + палитра референса «Northline» (лайм #C6F432, белый).
   v2: светлее и ближе к старому дизайну. Грузится ТОЛЬКО из demo.html поверх styles.css. */

:root,
:root[data-theme='dark'] {
  /* подложка светлее: тёмно-оливковая, не чёрная; шары только лайм и шалфей, без янтаря */
  --bg: #171a10;
  --wash: linear-gradient(160deg, #1f2514 0%, #181b11 42%, #1a1f14 72%, #151a14 100%);
  --orb-1: #c6f4328c;
  --orb-2: #7fd1b94d;
  --orb-3: #c6f43259;
  --orb-4: #9fcf2a59;
  --orb-5: #c6f43238;
  --orb-6: #7fd1b933;
  --band: #ffffff0d;
  --glass: #ffffff17;
  --glass-2: #ffffff1c;
  --glass-3: #ffffff2b;
  --glass-solid: #20241aeb;
  --card: #23271c;
  --muted: #bdbcae;
  --accent: #c6f432;
  --accent-ink: #11130a;
  --accent-soft: #c6f43229;
  --accent-text: #d4f95e;
  --ch-1: #c6f432;
  --good: #c6f432; --good-soft: #c6f43226;
  --em: #c6f432;
  --glow: #c6f43238;
  --serif: 'Playfair Display', 'Times New Roman', serif;
}

:root[data-theme='light'] {
  --accent: #c6f432;
  --accent-ink: #11130a;
  --accent-text: #4d6400;
  --ch-1: #b5e61f;
  --em: #5f7d00;
  --glow: #c6f43266;
  --serif: 'Playfair Display', 'Times New Roman', serif;
}

/* заголовок: засечный шрифт спокойнее, последнее слово — курсивом лаймом */
.phead h1 {
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(32px, 3vw, 46px);
  letter-spacing: -.02em;
  line-height: 1.06;
}
.phead h1 .word:last-child { font-style: italic; color: var(--em); }

/* подписи KPI — мелкие капсы */
.kpi__label { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }

/* акцентная кнопка: плоский лайм со свечением */
.btn--primary {
  background: var(--accent) !important;
  color: var(--accent-ink) !important;
  box-shadow: 0 0 0 1px #c6f43299, 0 8px 24px -8px var(--glow) !important;
}

/* промо-карточка и плавающая кнопка: чистый лайм вместо жёлто-оранжевого градиента */
.promo {
  background: #c6f432 !important;
  box-shadow: 0 0 0 1px #c6f43299, 0 18px 40px -16px var(--glow) !important;
}
.promo::after, .cta-float::after { display: none !important; }
.promo small { color: #1d2606; }
.promo__badge { background: #11130a; color: #c6f432; }
.cta-float { background: #c6f432 !important; box-shadow: 0 0 0 1px #c6f43299, 0 10px 34px -6px var(--glow) !important; }

::selection { background: var(--accent); color: var(--accent-ink); }