/* Investviz - живые рисунки и пояснения страниц (надстройка ivanim-pages).
   Работает только вместе с ivanim-pages.js: все правила ниже включаются классом html.ivap-on,
   который ставит скрипт. В редакторе сайта (CMS) и при «уменьшить движение» класса нет - страница как была.
   Цвета - только цвета сайта (зелёный #1BA84E / #29C564), без новых цветов. */

/* ---------- 1. рисунок при наведении: чуть крупнее, «в разработке» - чёрно-белый до наведения ---------- */
html.ivap-on svg.ivap-fig{transform-origin:50% 50%;transition:transform .5s cubic-bezier(.2,.7,.2,1),filter .4s ease}
html.ivap-on svg.ivap-fig.ivap-hov{transform:scale(1.04)}
html.ivap-on svg.ivap-fig.ivap-ico.ivap-hov{transform:scale(1.1)}
html.ivap-on svg.ivap-dev,html.ivap-rm svg.ivap-dev{filter:grayscale(1);transition:filter .4s ease}
html.ivap-on svg.ivap-dev.ivap-hov,html.ivap-rm svg.ivap-dev.ivap-hov{filter:none}
/* рисунок в скрытом блоке ждёт раскрытия; если скрипт не успел - через 1,4 с показывается сам */
html.ivap-on svg.ivap-wait{opacity:0;animation:ivapLate .3s ease 1.4s forwards}
@keyframes ivapLate{to{opacity:1}}
/* бегущий огонёк по линии - не мешает щелчкам и подсказкам */
html.ivap-on .ivap-mk{pointer-events:none}

/* ---------- 2. пояснения появляются при прокрутке (один раз) ---------- */
html.ivap-on .ivap-pre{opacity:0;translate:0 16px}
html.ivap-on .ivap-pre.ivap-seen{opacity:1;translate:0 0;transition:opacity .6s ease,translate .75s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--ivap-i,0) * 80ms)}
/* строки расчёта - по очереди, итоговая строка подсвечивается зелёной чертой */
html.ivap-on .calc.ivap-pre > .calc-row{opacity:0}
html.ivap-on .calc.ivap-seen > .calc-row{animation:ivapRow .5s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--ivap-i,0) * 80ms + .15s)}
html.ivap-on .calc.ivap-seen > .calc-row:nth-child(2){animation-delay:calc(var(--ivap-i,0) * 80ms + .23s)}
html.ivap-on .calc.ivap-seen > .calc-row:nth-child(3){animation-delay:calc(var(--ivap-i,0) * 80ms + .31s)}
html.ivap-on .calc.ivap-seen > .calc-row:nth-child(4){animation-delay:calc(var(--ivap-i,0) * 80ms + .39s)}
html.ivap-on .calc.ivap-seen > .calc-row:nth-child(5){animation-delay:calc(var(--ivap-i,0) * 80ms + .47s)}
html.ivap-on .calc.ivap-seen > .calc-row:nth-child(6){animation-delay:calc(var(--ivap-i,0) * 80ms + .55s)}
html.ivap-on .calc.ivap-seen > .calc-row:nth-child(n+7){animation-delay:calc(var(--ivap-i,0) * 80ms + .63s)}
html.ivap-on .calc.ivap-seen > .calc-row.hero{animation-name:ivapRow,ivapHero;animation-duration:.5s,1.8s;animation-timing-function:cubic-bezier(.2,.7,.2,1),ease-out}
@keyframes ivapRow{from{opacity:0;translate:-8px 0}to{opacity:1;translate:0 0}}
@keyframes ivapHero{0%,30%{box-shadow:inset 0 -2px 0 rgba(27,168,78,0)}55%{box-shadow:inset 0 -2px 0 #1BA84E}100%{box-shadow:inset 0 -2px 0 rgba(27,168,78,0)}}
html.ivap-on:not(.theme-light) .calc.ivap-seen > .calc-row.hero{animation-name:ivapRow,ivapHeroD}
@keyframes ivapHeroD{0%,30%{box-shadow:inset 0 -2px 0 rgba(41,197,100,0)}55%{box-shadow:inset 0 -2px 0 #29C564}100%{box-shadow:inset 0 -2px 0 rgba(41,197,100,0)}}
/* плитки «Научной программы» - волной при первом показе */
html.ivap-on .np-tiles.ivap-pre > *{opacity:0}
html.ivap-on .np-tiles.ivap-seen > *{animation:ivapTile .45s cubic-bezier(.2,.7,.2,1.3) both;animation-delay:calc(var(--ivap-t,0) * 14ms + .1s)}
@keyframes ivapTile{from{opacity:0;scale:.7}to{opacity:1;scale:1}}

/* ---------- 3. раскрытие блоков: содержимое выезжает сверху вниз по очереди ---------- */
html.ivap-on .np-card.open > .np-more > *,
html.ivap-on .nov details[open] > :not(summary),
html.ivap-on details.nov-ex[open] > :not(summary),
html.ivap-on .ivz-body:not([hidden]){animation:ivapOpen .55s cubic-bezier(.2,.7,.2,1) both}
html.ivap-on .np-card.open > .np-more > :nth-child(2){animation-delay:.05s}
html.ivap-on .np-card.open > .np-more > :nth-child(3){animation-delay:.1s}
html.ivap-on .np-card.open > .np-more > :nth-child(4){animation-delay:.15s}
html.ivap-on .np-card.open > .np-more > :nth-child(5){animation-delay:.2s}
html.ivap-on .np-card.open > .np-more > :nth-child(6){animation-delay:.25s}
html.ivap-on .np-card.open > .np-more > :nth-child(n+7){animation-delay:.3s}
html.ivap-on .nov details[open] > .nov-body > *{animation:ivapOpen .55s cubic-bezier(.2,.7,.2,1) both}
html.ivap-on .nov details[open] > .nov-body > :nth-child(2){animation-delay:.08s}
html.ivap-on .nov details[open] > .nov-body > :nth-child(3){animation-delay:.16s}
html.ivap-on .nov details[open] > .nov-body > :nth-child(n+4){animation-delay:.24s}
@keyframes ivapOpen{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}

/* ---------- 4. закрытые полоски раскрытия: стрелки в кружках изредка «кивают» вниз - приглашают открыть ---------- */
html.ivap-on .ivx:not(.open) > .ivx-row .ivx-chev,
html.ivap-on .ivv:not(.open) > .ivx-row .ivx-chev,
html.ivap-on .ivz-row[aria-expanded="false"] .ivz-chev,
html.ivap-on .nov details:not([open]) > summary .nov-ar,
html.ivap-on details.nov-ex:not([open]) > summary .nov-ex-ar{animation:ivapNod 4.2s ease-in-out infinite}
html.ivap-on .ivx-row:hover .ivx-chev,html.ivap-on .ivz-row:hover .ivz-chev,
html.ivap-on summary:hover .nov-ar,html.ivap-on summary:hover .nov-ex-ar{animation-duration:1.6s}
@keyframes ivapNod{0%,70%,100%{translate:0 0}78%{translate:0 2px}86%{translate:0 -1px}92%{translate:0 1px}}

/* печать - без движения */
@media print{html.ivap-on .ivap-pre,html.ivap-on .ivap-pre *{opacity:1 !important;translate:none !important;animation:none !important}html.ivap-on svg.ivap-fig{transform:none !important}}