/* Третий цвет (приглушённый фиолетовый) для страниц в вёрстке главной: index, kosultacii, podpiska_osvk.
   Те же правила, что в site-club.css: кнопки, меню и основные заголовки бирюзовые,
   фиолетовые подписи-«таблетки», метки карточек, цены, крупные цифры, галочки, звёзды и номера шагов. 29.09.2026 */
:root { --violet:#9787c6; --violet-soft:#c8bee1; --violet-dark:#6f5fa2; --violet-light:#b3a7d7; --on-violet:#ffffff; --violet-glow:rgba(151,135,198,.17); }
html[data-theme="light"] { --violet:#6c5ca3; --violet-soft:#605296; --violet-dark:#4e417e; --violet-light:#9185be; --violet-glow:rgba(108,92,163,.12); }

/* подписи над заголовками и метки карточек */
.pill { background:rgba(151,135,198,.08); border-color:rgba(151,135,198,.32); color:var(--violet); }
.pill.dot::before { background:var(--violet); box-shadow:0 0 8px var(--violet); }
.el .tag, .inc .lbl { background:rgba(151,135,198,.1); color:var(--violet); }

/* цены и крупные цифры: градиент сверху вниз */
.pay .price, .price-box b, .plan-price, .mini b, .kbstats b {
  background:linear-gradient(180deg,var(--violet-soft) 0%,var(--violet) 55%,var(--violet-dark) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.price-box { background:var(--violet-glow); border-color:rgba(151,135,198,.45); box-shadow:0 0 60px var(--violet-glow); }

/* галочки, звёзды, номера шагов */
.checks li::before { background:linear-gradient(135deg,var(--violet-light) 0%,var(--violet) 50%,var(--violet-dark) 100%); color:var(--on-violet); }
.rev .stars { background:linear-gradient(90deg,var(--violet-soft) 0%,var(--violet) 60%,var(--violet-dark) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.step .n, html[data-theme="light"] .step .n { background:linear-gradient(135deg,var(--violet-light) 0%,var(--violet) 50%,var(--violet-dark) 100%);
  color:var(--on-violet); box-shadow:0 0 30px var(--violet-glow); }
.steps::before { border-top-color:rgba(151,135,198,.35); }

/* выбранный тариф на ОСВК */
.plan:has(input:checked) { border-color:var(--violet); background:var(--violet-glow); }
.plan input[type=radio] { accent-color:var(--violet); }
