/* ============================================================
   rayprism v4 — BOLD BLUE mono (только цвет, layout = прод)
   Подключается ПОСЛЕ style.css?v=47, все правила через body.v4.
   Палитра Clustr: Jet Black фон, Soft White текст,
   Bold Blue заливки, Light Blue акценты. Контрасты усилены.
   Палитра:
     Jet Black      #0D0D0D  тёмный фон
     Soft White     #FAFAFA  светлый фон / текст
     Bold Blue      #1E466B  БРЕНД-заливка
     Light Blue     #67BAF4  БРЕНД-акцент
     Ice            #A9D6F7  светлый конец спектра (производный)
     Apricot/Coral — только семантика warn/err
   ============================================================ */

/* ---------- светлая тема ---------- */
body.v4 {
  --bg: #FAFAFA;
  --bg-soft: #EFF1F4;
  --card: #FFFFFF;
  --ink: #0D0D0D;
  --ink-2: #43484F;
  --ink-3: #767C85;
  --line: #DDE1E7;
  --line-2: #EBEEF2;
  --brand: #1E466B;
  --brand-dark: #2E5C8A;
  --brand-soft: rgba(30,70,107,.10);
  --ok: #0C7A4D;
  --ok-soft: rgba(12,122,77,.12);
  --warn: #B85A12;
  --warn-soft: rgba(255,154,98,.22);
  --err: #C93A46;
  --info: #1E466B;
  --info-soft: rgba(30,70,107,.10);
  --card-glass: rgba(255,255,255,.72);
  --glass-border: rgba(13,13,13,.10);
  --glass-blur: 18px;
  --glass-glow: rgba(30,70,107,.12);
  --grad-brand: linear-gradient(90deg,#1E466B,#2E5C8A);
  --shadow-sm: 0 8px 22px -16px rgba(13,13,13,.22);
  --shadow-md: 0 14px 32px -18px rgba(13,13,13,.30);
  --header-bg1: #0A0A0A;
  --header-bg2: #0D0D0D;
  --header-ink: #FAFAFA;
}

/* ---------- тёмная тема (по умолчанию) ---------- */
html.dark-theme body.v4 {
  --bg: #0D0D0D;
  --bg-soft: #111315;
  --card: #141619;
  --ink: #FAFAFA;
  --ink-2: #B9BEC6;
  --ink-3: #7A828D;
  --line: #26292F;
  --line-2: #1A1D22;
  --brand: #67BAF4;          /* light blue — акценты и текст */
  --brand-dark: #A9D6F7;
  --brand-soft: rgba(103,186,244,.14);
  --ok: #3DDC97;
  --ok-soft: rgba(61,220,151,.14);
  --warn: #FF9A62;
  --warn-soft: rgba(255,154,98,.15);
  --err: #F06D78;
  --info: #67BAF4;
  --info-soft: rgba(103,186,244,.14);
  --card-glass: rgba(20,22,25,.62);
  --glass-border: rgba(250,250,250,.10);
  --glass-glow: rgba(30,70,107,.35);
  --grad-brand: linear-gradient(90deg,#67BAF4,#1E466B);
  --shadow-sm: 0 12px 34px -20px rgba(0,0,0,.75);
  --shadow-md: 0 20px 50px -24px rgba(0,0,0,.85);
  --header-bg1: #080808;
  --header-bg2: #0D0D0D;
}

/* ---------- живой фон ---------- */
body.v4 .blob-brand { background: rgba(30,70,107,.55); }
body.v4 .blob-info { background: rgba(103,186,244,.16); }
body.v4 .blob-sale { background: rgba(30,70,107,.30); }

/* ---------- шапка / лого ---------- */
body.v4 .brand-beta { color: var(--brand); background: var(--brand-soft); }
body.v4 .brand-name {
  background: linear-gradient(92deg,#FAFAFA 0%,#67BAF4 55%,#1E466B 130%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: #67BAF4;
}
body.v4 .top::after {
  background: linear-gradient(90deg,transparent 5%,rgba(30,70,107,.8) 30%,rgba(103,186,244,.55) 55%,rgba(30,70,107,.6) 75%,transparent 95%);
  background-size: 200% 100%;
}
body.v4 .sys-status i { box-shadow: 0 0 8px rgba(61,220,151,.9); }

/* ---------- кнопки второго плана: Bold Blue ---------- */
body.v4 .btn.primary {
  background: linear-gradient(135deg,#2E5C8A 0%,#1E466B 60%,#16344F 100%);
  box-shadow: 0 8px 24px -10px rgba(30,70,107,.8),inset 0 1px 0 rgba(255,255,255,.22);
  animation: gradShift 6s ease infinite; background-size: 200% 200%;
}
html.dark-theme body.v4 .btn.primary {
  box-shadow: 0 8px 24px -10px rgba(0,0,0,.8),0 0 24px -6px rgba(103,186,244,.35),inset 0 1px 0 rgba(255,255,255,.22);
}
body.v4 .btn.primary:hover {
  box-shadow: 0 14px 34px -10px rgba(30,70,107,.9),0 0 0 1px rgba(103,186,244,.45),inset 0 1px 0 rgba(255,255,255,.25);
}
body.v4 .sticky-cta a {
  background: linear-gradient(135deg,#2E5C8A,#1E466B); color: #fff;
  box-shadow: 0 14px 34px -12px rgba(30,70,107,.85);
}

/* ---------- WHITE = цвет действия: hero + финальная CTA ---------- */
body.v4 .hero .btn.primary,
body.v4 .cta-card .btn.primary {
  background: #FAFAFA; color: #0D0D0D;
  box-shadow: 0 10px 28px -10px rgba(0,0,0,.6),0 0 0 1px rgba(103,186,244,.3),inset 0 1px 0 #fff;
  animation: none;
}
body.v4 .hero .btn.primary:hover,
body.v4 .cta-card .btn.primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 40px -10px rgba(103,186,244,.5),0 0 0 1px rgba(103,186,244,.6),inset 0 1px 0 #fff;
}
html:not(.dark-theme) body.v4 .hero .btn.primary,
html:not(.dark-theme) body.v4 .cta-card .btn.primary {
  background: #0D0D0D; color: #FAFAFA;
  box-shadow: 0 10px 28px -10px rgba(13,13,13,.5),inset 0 1px 0 rgba(255,255,255,.15);
}
html:not(.dark-theme) body.v4 .hero .btn.primary:hover,
html:not(.dark-theme) body.v4 .cta-card .btn.primary:hover {
  box-shadow: 0 16px 40px -10px rgba(30,70,107,.55),0 0 0 1px rgba(30,70,107,.45),inset 0 1px 0 rgba(255,255,255,.15);
}
html.dark-theme body.v4 .hero .btn.primary,
html.dark-theme body.v4 .cta-card .btn.primary {
  background: #FAFAFA; color: #0D0D0D;
  animation: none;
  box-shadow: 0 10px 28px -10px rgba(0,0,0,.6),0 0 0 1px rgba(103,186,244,.3),inset 0 1px 0 #fff;
}
html.dark-theme body.v4 .hero .btn.primary:hover,
html.dark-theme body.v4 .cta-card .btn.primary:hover {
  box-shadow: 0 16px 40px -10px rgba(103,186,244,.5),0 0 0 1px rgba(103,186,244,.6),inset 0 1px 0 #fff;
}

/* ---------- hero-бейдж ---------- */
body.v4 .hero-badge {
  background: rgba(103,186,244,.10); color: #A9D6F7;
  border: 1px solid rgba(103,186,244,.4);
}
html:not(.dark-theme) body.v4 .hero-badge {
  background: rgba(30,70,107,.08); color: #1E466B;
  border-color: rgba(30,70,107,.3);
}

/* ---------- hero: синяя аура ---------- */
body.v4 .hero::before {
  background: radial-gradient(closest-side,rgba(30,70,107,.5),rgba(30,70,107,0) 72%);
}
body.v4 .hero::after {
  background-image: radial-gradient(rgba(103,186,244,.13) 1px,transparent 1.4px);
}
body.v4 .cta-sec::before {
  background: radial-gradient(closest-side,rgba(30,70,107,.4),transparent 70%);
}
body.v4 .hero-accent {
  background: linear-gradient(92deg,#67BAF4,#1E466B);
  background-size: 200% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 30px rgba(103,186,244,.4));
}
html:not(.dark-theme) body.v4 .hero-accent {
  background: linear-gradient(92deg,#2E5C8A,#1E466B);
  -webkit-background-clip: text; background-clip: text;
}
body.v4 .kpi-num {
  background: linear-gradient(180deg,#FAFAFA 12%,#67BAF4 88%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
html:not(.dark-theme) body.v4 .kpi-num {
  background: linear-gradient(180deg,#0D0D0D 12%,#1E466B 88%);
  -webkit-background-clip: text; background-clip: text;
}
body.v4 .card.kpi::before { background: linear-gradient(90deg,#1E466B,#67BAF4); }

/* ---------- декор: кресты и луч ---------- */
body.v4 .bg-deco .x { color: rgba(103,186,244,.30); }
body.v4 .bg-deco .x2 { color: rgba(103,186,244,.22); }
body.v4 .bg-deco .beam {
  background: linear-gradient(90deg,transparent,rgba(30,70,107,.5) 45%,rgba(103,186,244,.18) 62%,transparent);
}
body.v4 .prism-line i:nth-child(1) { background: linear-gradient(90deg,rgba(103,186,244,.9),rgba(103,186,244,.05)); }
body.v4 .prism-line i:nth-child(2) { background: linear-gradient(90deg,rgba(103,186,244,.5),transparent); }
body.v4 .prism-line i:nth-child(3) { background: linear-gradient(90deg,rgba(30,70,107,.6),transparent); }
body.v4 .prism-line::before {
  background: linear-gradient(135deg,#67BAF4,#1E466B);
  box-shadow: 0 0 16px rgba(103,186,244,.55);
}

/* ---------- карточки / ховеры ---------- */
body.v4 .card:hover {
  box-shadow: var(--shadow-md),0 0 0 1px rgba(103,186,244,.22),0 16px 38px -18px rgba(30,70,107,.5);
}
body.v4 .flow-node:hover {
  border-color: rgba(103,186,244,.55);
  box-shadow: 0 12px 28px -16px rgba(30,70,107,.6);
}
body.v4 .flow-col .flow-node:hover { box-shadow: 0 0 0 2px var(--brand); }
body.v4 .srv-card:hover .kpi-ic {
  box-shadow: 0 0 0 1px rgba(103,186,244,.4),0 10px 24px -12px rgba(30,70,107,.6);
}
body.v4 .srv-card:hover, body.v4 .case-card:hover, body.v4 .insight-card:hover {
  border-color: rgba(103,186,244,.5);
}
body.v4 .faq-item:hover { border-color: rgba(103,186,244,.45); }
body.v4 .price-card:hover { border-color: rgba(103,186,244,.55); }

/* ---------- разделители секций / прогресс ---------- */
body.v4 .section:not(.hero)::before,
body.v4 .pipeline::before,
body.v4 .pricing::before,
body.v4 .faq-sec::before {
  background: linear-gradient(90deg,transparent,rgba(30,70,107,.45),transparent);
}
body.v4 .read-progress { box-shadow: 0 0 10px rgba(103,186,244,.5); }

/* ---------- тарифы: aurora blue + белая пилюля ---------- */
body.v4 .price-card.featured {
  border: 1.5px solid transparent;
  background:
    linear-gradient(var(--card),var(--card)) padding-box,
    linear-gradient(120deg,#1E466B,#67BAF4,#16344F,#1E466B) border-box;
  background-size: 100% 100%, 220% 220%;
  animation: v4feat 3.2s ease-in-out infinite, gradShift 6s linear infinite;
}
@keyframes v4feat {
  0%, 100% { box-shadow: 0 18px 44px -22px rgba(30,70,107,.6); }
  50% { box-shadow: 0 22px 60px -18px rgba(103,186,244,.4); }
}
body.v4 .price-card.featured::after {
  background: #FAFAFA; color: #0D0D0D;
  box-shadow: 0 6px 16px -8px rgba(0,0,0,.6);
}
body.v4 .cta-card {
  border: 1.5px solid transparent;
  background:
    linear-gradient(var(--card),var(--card)) padding-box,
    linear-gradient(120deg,#1E466B,#67BAF4,#16344F,#1E466B) border-box;
  background-size: 100% 100%, 220% 220%;
  animation: gradShift 7s linear infinite;
}
body.v4 .cta-card::before {
  background: linear-gradient(90deg,transparent,var(--brand) 35%,#67BAF4 70%,transparent);
}
body.v4 .cta-card::after {
  background: radial-gradient(620px 220px at 50% 0%,rgba(30,70,107,.35),transparent 70%);
}
body.v4 .cta-label { color: var(--brand-dark); }
body.v4 .flow-final { border-color: rgba(103,186,244,.55); color: var(--brand); }

/* ---------- футер / скроллбар / фокус / выделение ---------- */
body.v4 .foot-brand::before {
  background: linear-gradient(135deg,#1E466B,#67BAF4);
  box-shadow: 0 0 10px rgba(103,186,244,.5);
}
body.v4 ::-webkit-scrollbar-thumb { background: rgba(103,186,244,.32); }
body.v4 ::-webkit-scrollbar-thumb:hover { background: rgba(103,186,244,.55); }
body.v4 :focus-visible { outline: 2px solid rgba(103,186,244,.65); }
body.v4 ::selection { background: rgba(30,70,107,.5); }

/* ---------- тултип ---------- */
body.v4 .tt::after { background: #141619; }

/* ---------- v4 hero: только верх v2 (центро-заголовок + саб + 2 кнопки) ---------- */
body.v4 .page-head-v2 { max-width: 960px; margin: 0 auto; text-align: center; }
body.v4 .page-head-v2 .hero-badge { margin: 0 auto; }
body.v4 .hero-h1-v2 { font-size: clamp(46px, 8.5vw, 96px); line-height: 1.02; letter-spacing: -.035em; text-wrap: balance; }
body.v4 .page-head-v2 .hero-sub { margin-left: auto; margin-right: auto; }
body.v4 .page-actions-v2 { justify-content: center; }
body.v4 .btn.ghost.big {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 30px; font-size: 15.5px; font-weight: 700;
  border-radius: 999px; border: 1px solid var(--line);
  color: var(--ink); text-decoration: none; background: transparent;
}
body.v4 .btn.ghost.big:hover { background: var(--brand-soft); border-color: rgba(103,186,244,.5); }

@media (max-width: 720px) {
  body.v4 .hero-h1-v2 { font-size: clamp(40px, 12.5vw, 56px); }
  body.v4 .page-actions-v2 .btn { width: 100%; justify-content: center; }
}

/* ---------- светлая тема: прибрать грязь (ауры/сетки/тени тише) ---------- */
html:not(.dark-theme) body.v4 .blob { opacity: .28; }
html:not(.dark-theme) body.v4 .hero::before {
  background: radial-gradient(closest-side, rgba(30,70,107,.12), transparent 72%);
}
html:not(.dark-theme) body.v4 .hero::after {
  background-image: radial-gradient(rgba(30,70,107,.09) 1px, transparent 1.4px);
  opacity: .4;
}
html:not(.dark-theme) body.v4 .cta-sec::before {
  background: radial-gradient(closest-side, rgba(30,70,107,.10), transparent 70%);
}
html:not(.dark-theme) body.v4 .card:hover {
  box-shadow: var(--shadow-md), 0 0 0 1px rgba(30,70,107,.14);
}
html:not(.dark-theme) body.v4 .bg-deco .x { color: rgba(30,70,107,.20); }

/* ---------- служебный бейдж версии (только черновик v4) ---------- */
body.v4.show-badge::after {
  content: "v4 · bold blue";
  position: fixed; right: 14px; bottom: 12px; z-index: 999;
  font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: #FAFAFA; background: #141619;
  border: 1px solid rgba(103,186,244,.5); border-radius: 999px;
  padding: 5px 12px; pointer-events: none;
  box-shadow: 0 6px 18px -8px rgba(0,0,0,.6);
}
html:not(.dark-theme) body.v4.show-badge::after { color: #0D0D0D; background: #FFFFFF; }
@media (prefers-reduced-motion: reduce) {
  body.v4 .hero-h1, body.v4 .hero-accent { animation: none; }
}

/* ---------- яркость + переливы (bold blue, без грязи в светлой) ---------- */
/* «бизнес»: пробегающий блик по градиенту */
body.v4 .hero-accent {
  background: linear-gradient(100deg,#67BAF4 10%,#A9D6F7 32%,#FAFAFA 50%,#67BAF4 68%,#1E466B 95%);
  background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: v4sheen 5.5s ease-in-out infinite alternate;
  filter: drop-shadow(0 0 26px rgba(103,186,244,.5));
}
html:not(.dark-theme) body.v4 .hero-accent {
  background: linear-gradient(100deg,#1E466B 10%,#2E5C8A 35%,#67BAF4 50%,#2E5C8A 65%,#1E466B 95%);
  background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text;
  animation: v4sheen 5.5s ease-in-out infinite alternate;
}
@keyframes v4sheen { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }

/* логотип: покой — медленный sheen, ховер — призма */
body.v4 .brand-name {
  background: linear-gradient(100deg,#FAFAFA 20%,#67BAF4 42%,#FAFAFA 58%,#FAFAFA 80%);
  background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: #67BAF4;
  animation: logoSheen 9s ease-in-out infinite alternate;
}
body.v4 .brand-name:hover {
  background: linear-gradient(100deg,#9D7BFF,#3BC7B1 28%,#67BAF4 48%,#E6C84D 72%,#9D7BFF);
  background-size: 300% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: #67BAF4;
  animation: logoPrism 2.6s linear infinite;
  filter: drop-shadow(0 0 14px rgba(103,186,244,.55));
}
@keyframes logoSheen { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
@keyframes logoPrism { from { background-position: 0% 50%; } to { background-position: 300% 50%; } }

/* общая яркость тёмной */
html.dark-theme body.v4 .blob { opacity: .48; }
html.dark-theme body.v4 .hero::before {
  background: radial-gradient(closest-side,rgba(30,70,107,.68),rgba(30,70,107,0) 72%);
}
html.dark-theme body.v4 .top::after {
  background: linear-gradient(90deg,transparent 5%,rgba(30,70,107,.9) 30%,rgba(103,186,244,.7) 55%,rgba(30,70,107,.65) 75%,transparent 95%);
  background-size: 200% 100%;
}
html.dark-theme body.v4 .btn.primary {
  box-shadow: 0 8px 26px -8px rgba(30,70,107,.9),0 0 28px -6px rgba(103,186,244,.45),inset 0 1px 0 rgba(255,255,255,.25);
}
html.dark-theme body.v4 .card.kpi::before {
  background: linear-gradient(90deg,#1E466B,#67BAF4);
  box-shadow: 0 0 14px rgba(103,186,244,.55);
}
html.dark-theme body.v4 .foot-brand::before {
  box-shadow: 0 0 14px rgba(103,186,244,.7);
}
@media (prefers-reduced-motion: reduce) {
  body.v4 .hero-accent, body.v4 .brand-name { animation: none; }
}