/* iKapitalist 2.0 — общая система анимаций и интерактивных элементов.
   Подключается только на обновлённых русских страницах. Все правила внутри .adv-root,
   глобальные элементы сайта (body, header, nav, section, h1–h3, a) не затрагиваются. */

.adv-root { --adv-navy: #132E48; --adv-blue: #3097F4; --adv-mid: #2C6BA6; --adv-sky: #EAF3FE; --adv-mist: #F4F7F9;
  --adv-line: #E3E8EE; --adv-grey: #505965; --adv-ok: #2FA862; --adv-risk: #1A1A1A;
  --adv-ease: cubic-bezier(.22,.61,.36,1); --adv-shadow: 0 1px 2px rgba(19,46,72,.04), 0 2px 8px rgba(19,46,72,.04);
  --adv-shadow-up: 0 2px 4px rgba(19,46,72,.05), 0 14px 32px rgba(19,46,72,.11); }

/* ---------- раскладка секций ---------- */
.adv-root .adv-wrap { box-sizing: border-box; max-width: 1400px; width: 100%; margin: 0 auto; padding: 0 72px; }
.adv-root .adv-block { margin-top: 120px; }
.adv-root .adv-kicker { font-size: 12px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--adv-blue); }
.adv-root .adv-kicker .adv-brand { text-transform: none; letter-spacing: .04em; }
.adv-root .adv-h2 { margin: 0; font-weight: 400; font-size: 44px; line-height: 1.1; letter-spacing: -.02em; color: var(--adv-navy); }
.adv-root .adv-lead { margin: 0; font-size: 17px; line-height: 1.55; color: var(--adv-grey); max-width: 720px; }
.adv-root .adv-rule { width: 120px; height: 4px; border-radius: 2px; background: var(--adv-mid); }
.adv-root .adv-head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 24px 48px; align-items: end; }
.adv-root .adv-head > div { display: flex; flex-direction: column; gap: 14px; }
.adv-root .adv-note { font-size: 13px; line-height: 1.55; color: var(--adv-grey); }
.adv-root .adv-entity { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; color: var(--adv-mid); }
.adv-root .adv-entity::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--adv-blue); }

/* ---------- кнопки ---------- */
.adv-root .adv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 24px;
  border-radius: 999px; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 1.2; text-decoration: none; white-space: nowrap;
  border: 1px solid var(--adv-blue); background: var(--adv-blue); color: #FFFFFF; cursor: pointer;
  transition: transform .22s var(--adv-ease), box-shadow .22s var(--adv-ease), background-color .22s var(--adv-ease), border-color .22s var(--adv-ease), color .22s var(--adv-ease); }
.adv-root .adv-btn--ghost { background: transparent; color: var(--adv-blue); }
.adv-root .adv-btn--white { background: #FFFFFF; border-color: #FFFFFF; color: var(--adv-navy); }
.adv-root .adv-btn--line-white { background: transparent; border-color: #FFFFFF; color: #FFFFFF; }
.adv-root .adv-btn .adv-arr { display: inline-block; transition: transform .22s var(--adv-ease); }
.adv-root .adv-link { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 500; color: var(--adv-blue); text-decoration: none; }
.adv-root .adv-link .adv-arr { display: inline-block; transition: transform .22s var(--adv-ease); }

/* ---------- карточки ---------- */
.adv-root .adv-card { position: relative; box-sizing: border-box; border-radius: 14px; background: #FFFFFF; border: 1px solid var(--adv-line);
  box-shadow: var(--adv-shadow); transition: transform .26s var(--adv-ease), box-shadow .26s var(--adv-ease), border-color .26s var(--adv-ease); }
.adv-root .adv-card--mist { background: var(--adv-mist); border-color: transparent; box-shadow: none; }
.adv-root a.adv-card { display: block; color: inherit; text-decoration: none; }

/* наведение — только на устройствах с указателем */
@media (hover: hover) and (pointer: fine) {
  .adv-root .adv-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(48,151,244,.28); background-color: #1F86E6; border-color: #1F86E6; }
  .adv-root .adv-btn--ghost:hover { background-color: var(--adv-sky); color: #1F86E6; box-shadow: 0 10px 22px rgba(19,46,72,.10); }
  .adv-root .adv-btn--white:hover { background-color: #F3F8FE; border-color: #F3F8FE; color: var(--adv-navy); box-shadow: 0 10px 24px rgba(8,30,56,.25); }
  .adv-root .adv-btn--line-white:hover { background-color: rgba(255,255,255,.12); border-color: #FFFFFF; color: #FFFFFF; box-shadow: 0 10px 24px rgba(8,30,56,.22); }
  .adv-root .adv-btn:hover .adv-arr, .adv-root .adv-link:hover .adv-arr, .adv-root a.adv-card:hover .adv-arr { transform: translateX(4px); }
  .adv-root .adv-link:hover { color: #1F86E6; }
  .adv-root a.adv-card:hover, .adv-root .adv-card.adv-lift:hover { transform: translateY(-4px) scale(1.01); box-shadow: var(--adv-shadow-up); border-color: #C9E0FB; }
  .adv-root a.adv-card--mist:hover { background: #FFFFFF; }
}
.adv-root .adv-btn:active, .adv-root a.adv-card:active { transform: translateY(0) scale(.995); box-shadow: var(--adv-shadow); transition-duration: .08s; }

/* клавиатура */
.adv-root .adv-btn:focus-visible, .adv-root .adv-link:focus-visible, .adv-root a.adv-card:focus-visible, .adv-root .adv-tab:focus-visible,
.adv-root .adv-replay:focus-visible { outline: 3px solid #8CC4FA; outline-offset: 3px; }

/* ---------- сцены SVG ---------- */
.adv-root .adv-scene { position: relative; width: 100%; }
.adv-root .adv-scene > svg { display: block; width: 100%; height: auto; overflow: visible; }
/* подписи — обычный HTML поверх SVG, координаты в процентах от сцены */
.adv-root .adv-lbl { position: absolute; transform: translate(-50%, 0); font-size: 13px; line-height: 1.25; font-weight: 500; color: var(--adv-navy);
  text-align: center; white-space: nowrap; pointer-events: none; }
.adv-root .adv-lbl small { display: block; font-size: 11px; font-weight: 400; color: var(--adv-grey); }
.adv-root .adv-lbl--l { transform: none; text-align: left; }
.adv-root .adv-lbl--r { transform: translate(-100%, 0); text-align: right; }
.adv-root .adv-lbl--chip { padding: 5px 10px; border-radius: 999px; background: #FFFFFF; box-shadow: 0 2px 10px rgba(19,46,72,.10); }
.adv-root .adv-lbl--risk { color: #8E2A1F; }

/* шаги сценария рядом со сценой */
.adv-root .adv-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; counter-reset: advs; }
.adv-root .adv-steps li { counter-increment: advs; position: relative; padding: 9px 0 9px 40px; font-size: 15px; line-height: 1.45; color: #8A94A1;
  transition: color .35s var(--adv-ease); }
.adv-root .adv-steps li::before { content: counter(advs, decimal-leading-zero); position: absolute; left: 0; top: 9px; font-size: 12px; font-weight: 500;
  color: #B5C0CC; letter-spacing: .04em; transition: color .35s var(--adv-ease); }
.adv-root .adv-steps li::after { content: ""; position: absolute; left: 26px; top: 14px; width: 6px; height: 6px; border-radius: 50%; background: #D3DCE5;
  transition: background .35s var(--adv-ease), transform .35s var(--adv-ease); }
.adv-root .adv-steps li.is-on { color: var(--adv-navy); }
.adv-root .adv-steps li.is-on::before { color: var(--adv-blue); }
.adv-root .adv-steps li.is-on::after { background: var(--adv-blue); }
.adv-root .adv-steps li.is-now::after { transform: scale(1.6); }

.adv-root .adv-replay { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; background: none; font: inherit; font-size: 13px;
  font-weight: 500; color: var(--adv-blue); cursor: pointer; }
.adv-root .adv-replay svg { width: 14px; height: 14px; transition: transform .4s var(--adv-ease); }
@media (hover: hover) { .adv-root .adv-replay:hover svg { transform: rotate(-180deg); } }

/* ---------- числа ---------- */
.adv-root .adv-num { font-variant-numeric: tabular-nums; }

/* ---------- адаптивность ---------- */
@media (max-width: 1024px) {
  .adv-root .adv-wrap { padding: 0 24px; }
  .adv-root .adv-block { margin-top: 80px; }
  .adv-root .adv-h2 { font-size: 34px; }
  .adv-root .adv-head { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .adv-root .adv-wrap { padding: 0 20px; }
  .adv-root .adv-block { margin-top: 64px; }
  .adv-root .adv-h2 { font-size: 28px; }
  .adv-root .adv-lead { font-size: 16px; }
  .adv-root .adv-btn { min-height: 44px; padding: 0 18px; font-size: 14px; }
  .adv-root .adv-lbl { font-size: 10.5px; }
  .adv-root .adv-lbl small { font-size: 9.5px; }
}

/* ---------- меньше движения ---------- */
@media (prefers-reduced-motion: reduce) {
  html:not(.adv-motion-on) .adv-root .adv-btn, html:not(.adv-motion-on) .adv-root .adv-card,
  html:not(.adv-motion-on) .adv-root .adv-arr { transition: box-shadow .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease !important; transform: none !important; }
}

/* правила сайта ≤ 1024 px добавляют отступы всем section — у новых блоков отступы задаёт .adv-wrap */
@media (max-width: 1024px) {
  .adv-root section.adv-block, .adv-root section.hp-hero { padding-left: 0 !important; padding-right: 0 !important; }
}
.adv-root:not(.adv-js) .adv-replay { display: none; }

/* ---------- цвет: фирменные синий и тёмно-синий + дополнительные акценты ---------- */
.adv-root { --adv-teal: #39C471; --adv-violet: #2C6BA6; --adv-amber: #9CCBFA; --adv-coral: #1A1A1A;
  --adv-teal-l: #E7F7EE; --adv-violet-l: #EAF3FE; --adv-amber-l: #F4F7F9; --adv-coral-l: #FDECEA; }
.adv-root .s-teal { fill: #39C471; } .adv-root .s-violet { fill: #2C6BA6; } .adv-root .s-amber { fill: #9CCBFA; }
.adv-root .s-mid { fill: #39C471; }
.adv-root .adv-rule { background: #3097F4; }
.adv-root .adv-entity::before { background: #2C6BA6; }
.adv-root .adv-steps li:nth-child(6n+1).is-on::after { background: #3097F4; }
.adv-root .adv-steps li:nth-child(6n+2).is-on::after { background: #39C471; }
.adv-root .adv-steps li:nth-child(6n+3).is-on::after { background: #2C6BA6; }
.adv-root .adv-steps li:nth-child(6n+4).is-on::after { background: #9CCBFA; }
.adv-root .adv-steps li:nth-child(6n+5).is-on::after { background: #1A1A1A; }
.adv-root .adv-steps li:nth-child(6n+2).is-on::before { color: #39C471; }
.adv-root .adv-steps li:nth-child(6n+3).is-on::before { color: #2C6BA6; }
.adv-root .adv-steps li:nth-child(6n+4).is-on::before { color: #2C6BA6; }
.adv-root .adv-steps li:nth-child(6n+5).is-on::before { color: #1A1A1A; }

/* узкие телефоны (до 400 px): кнопки переносят текст, подписи схем компактнее */
@media (max-width: 400px) {
  .adv-root .adv-btn { white-space: normal; text-align: center; max-width: 100%; min-height: 44px; height: auto; padding-top: 10px; padding-bottom: 10px; }
  .adv-root .adv-lbl { font-size: 9.5px; }
  .adv-root .adv-lbl small { font-size: 8.5px; }
}
