/* Велософия: страницы-истории — текст прокручивается, картинка стоит на месте и меняется по шагам. */

.vt-story{--vt-story-top:0px;--vt-story-text:50%;--vt-story-dur:800ms;--vt-story-step:90vh;--vt-story-mh:45vh;position:relative;display:grid;grid-template-columns:minmax(0,var(--vt-story-text)) minmax(0,1fr);grid-template-areas:"steps media";margin:2.5rem 0;color:inherit}
.vt-story--left{grid-template-columns:minmax(0,1fr) minmax(0,var(--vt-story-text));grid-template-areas:"media steps"}
.vt-story[data-vt-story-bleed]{max-width:none!important}
.entry-content>.vt-story:first-child,.vt-story:first-child{margin-top:0}

/* ---------- Картинка ---------- */
.vt-story__media{position:sticky;top:var(--vt-story-top);grid-area:media;align-self:start;height:calc(100vh - var(--vt-story-top));height:calc(100svh - var(--vt-story-top))}
.vt-story__stage{position:absolute;inset:0;overflow:hidden;isolation:isolate;background:#151a20}
.vt-story--card .vt-story__stage{inset:clamp(.75rem,2vw,1.5rem);border-radius:calc(var(--vt-radius,8px) * 2);box-shadow:0 12px 40px rgb(0 0 0 / .18)}
.vt-story__layer{position:absolute;inset:0;overflow:hidden;opacity:0;transition:opacity var(--vt-story-dur) ease,transform var(--vt-story-dur) cubic-bezier(.2,.7,.2,1),filter var(--vt-story-dur) ease,clip-path var(--vt-story-dur) cubic-bezier(.6,0,.2,1);will-change:opacity,transform}
.vt-story__layer.is-active{z-index:3;opacity:1}
.vt-story__layer.is-prev:not(.vt-story__layer--fx-wipe){z-index:2;opacity:1;transform:none;filter:none;transition:none}
.vt-story__img{position:absolute;inset:0;display:block;width:100%!important;max-width:none!important;height:100%!important;margin:0!important;border-radius:0!important;object-fit:cover;filter:blur(var(--vt-blur,0))}
.has-blur>.vt-story__img{transform:scale(1.08)}
.vt-story__shade{position:absolute;inset:0;z-index:1;background:var(--vt-shade-c,#000);opacity:var(--vt-shade,.25);pointer-events:none}

/* Контент поверх картинки — по центру по вертикали */
.vt-story__over{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;padding:clamp(1.25rem,4vw,3.5rem);text-align:center}
.vt-story__over--left{justify-content:flex-start;text-align:left}
.vt-story__over--right{justify-content:flex-end;text-align:right}
.vt-story__over-in{width:100%;max-width:34rem}
.vt-story__over-in>:first-child{margin-top:0}
.vt-story__over-in>:last-child{margin-bottom:0}
.vt-story__over--light{color:#fff;text-shadow:0 1px 3px rgb(0 0 0 / .35)}
.vt-story__over--light :is(h1,h2,h3,h4,h5,h6,a:not(.vt-btn)){color:#fff}
.vt-story__over--dark{color:#111}
.vt-story__over--dark :is(h1,h2,h3,h4,h5,h6,a:not(.vt-btn)){color:#111}
.vt-story__over .vt-btn{text-shadow:none}

/* ---------- Эффекты смены картинки ---------- */
/* fade — плавная смена (база). */
.vt-story__layer--fx-slide{transform:translate3d(0,8%,0)}
.vt-story__layer--fx-slide.is-past{transform:translate3d(0,-8%,0)}
.vt-story__layer--fx-slide-left{transform:translate3d(10%,0,0)}
.vt-story__layer--fx-slide-left.is-past{transform:translate3d(-10%,0,0)}
.vt-story__layer--fx-zoom{transform:scale(1.18)}
.vt-story__layer--fx-zoom.is-past{transform:scale(.94)}
.vt-story__layer--fx-blur{filter:blur(26px) saturate(1.2)}
.vt-story__layer.is-active:is(.vt-story__layer--fx-slide,.vt-story__layer--fx-slide-left,.vt-story__layer--fx-zoom){transform:none}
.vt-story__layer--fx-blur.is-active{filter:none}
/* wipe — новая картинка «наезжает» снизу на предыдущую (при прокрутке назад — уезжает вниз). */
.vt-story__layer--fx-wipe{opacity:1;clip-path:inset(100% 0 0 0)}
.vt-story__layer--fx-wipe.is-past,.vt-story__layer--fx-wipe.is-active{clip-path:inset(0 0 0 0)}
.vt-story__layer--fx-wipe.is-past{z-index:2}
/* kenburns — плавная смена и медленное приближение, пока шаг на экране. */
.vt-story__layer--fx-kenburns.is-active>.vt-story__img{animation:vt-story-kb 14s ease-out both}
@keyframes vt-story-kb{from{transform:scale(1)}to{transform:scale(1.14)}}
.vt-story__layer--fx-kenburns.has-blur.is-active>.vt-story__img{animation-name:vt-story-kb-blur}
@keyframes vt-story-kb-blur{from{transform:scale(1.08)}to{transform:scale(1.2)}}
.vt-story__layer--fx-none{transition:none}

/* ---------- Точки шагов ---------- */
.vt-story__dots{position:absolute;top:50%;right:clamp(.75rem,1.5vw,1.25rem);z-index:5;display:flex;flex-direction:column;gap:.5rem;transform:translateY(-50%)}
.vt-story--left .vt-story__dots{right:auto;left:clamp(.75rem,1.5vw,1.25rem)}
.vt-story--card .vt-story__dots{right:clamp(1.5rem,3vw,2.5rem)}
.vt-story--card.vt-story--left .vt-story__dots{left:clamp(1.5rem,3vw,2.5rem)}
.vt-story__dot{width:.6rem;height:.6rem;margin:0;padding:0;border:0;border-radius:999px;background:rgb(255 255 255 / .55);box-shadow:0 0 0 1px rgb(0 0 0 / .15);cursor:pointer;transition:height .25s ease,background-color .25s ease}
.vt-story__dot:hover{background:rgb(255 255 255 / .85)}
.vt-story__dot.is-active{height:1.6rem;background:#fff}
.vt-story__dot:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* ---------- Текст ---------- */
.vt-story__steps{grid-area:steps;min-width:0;padding:0 clamp(1.25rem,4vw,3.5rem)}
.vt-story__step{display:flex;flex-direction:column;justify-content:center;min-height:var(--vt-story-step);padding:3rem 0}
.vt-story--v-top .vt-story__step{justify-content:flex-start;padding-top:12vh}
.vt-story__text{width:100%;max-width:38rem}
.vt-story--left .vt-story__text{margin-left:auto}
.vt-story__text>:first-child{margin-top:0}
.vt-story__text>:last-child{margin-bottom:0}
.vt-story__text img{max-width:100%;height:auto}
.vt-story.is-js .vt-story__text{opacity:.38;transition:opacity .45s ease}
.vt-story.is-js .vt-story__step.is-active .vt-story__text{opacity:1}

/* ---------- Картинка над текстом шага: без JavaScript и mobile="stack" ---------- */
.vt-story__inline{display:none}
.vt-story:not(.is-js),.vt-story.is-stacked{display:block}
.vt-story:not(.is-js) .vt-story__media,.vt-story.is-stacked .vt-story__media{display:none}
.vt-story:not(.is-js) .vt-story__steps,.vt-story.is-stacked .vt-story__steps{padding:0}
.vt-story:not(.is-js) .vt-story__step,.vt-story.is-stacked .vt-story__step{min-height:0;padding:0 0 2.5rem}
.vt-story:not(.is-js) .vt-story__inline,.vt-story.is-stacked .vt-story__inline{position:relative;display:block;min-height:16rem;aspect-ratio:16/10;margin:0 0 1.25rem;overflow:hidden;border-radius:var(--vt-radius,8px);background:#151a20}
.vt-story:not(.is-js) .vt-story__inline .vt-story__over,.vt-story.is-stacked .vt-story__inline .vt-story__over{padding:1.25rem}
.vt-story:not(.is-js) .vt-story__text,.vt-story.is-stacked .vt-story__text{max-width:none;opacity:1}

/* ---------- Телефон: картинка прилипает сверху, текст проходит под ней ---------- */
.vt-story.is-narrow:not(.is-stacked){display:block}
.vt-story.is-narrow:not(.is-stacked) .vt-story__media{z-index:4;height:var(--vt-story-mh)}
.vt-story.is-narrow:not(.is-stacked) .vt-story--card .vt-story__stage,.vt-story.is-narrow.vt-story--card:not(.is-stacked) .vt-story__stage{inset:.5rem 0}
.vt-story.is-narrow:not(.is-stacked) .vt-story__steps{position:relative;z-index:1;padding:0 1.25rem}
.vt-story.is-narrow:not(.is-stacked) .vt-story__step{min-height:calc((100svh - var(--vt-story-top) - var(--vt-story-mh)) * .9);padding:2rem 0}
.vt-story.is-narrow:not(.is-stacked) .vt-story__text{max-width:none;margin-left:0}
.vt-story.is-narrow .vt-story__dots{top:auto;right:.75rem;bottom:.75rem;left:auto;flex-direction:row;transform:none}
.vt-story.is-narrow .vt-story__dot.is-active{width:1.6rem;height:.6rem}
.vt-story.is-narrow .vt-story__over{padding:1rem 1.25rem}
.vt-story.is-narrow .vt-story__over-in{font-size:.9375rem}

@media (prefers-reduced-motion:reduce){
	.vt-story__layer{transition:opacity .2s linear!important;transform:none!important;filter:none!important}
	.vt-story__layer--fx-wipe{clip-path:none!important;opacity:0}
	.vt-story__layer--fx-wipe.is-active{opacity:1}
	.vt-story__layer>.vt-story__img{animation:none!important}
}
@media print{.vt-story{display:block}.vt-story__media{display:none}.vt-story__inline{display:block!important;position:relative;aspect-ratio:16/10}.vt-story__text{opacity:1!important}}
.vt-story-empty{padding:.5rem .75rem;border-left:3px solid #b3261e;background:#fdecea;color:#5c1a14;font-size:.875rem}
.vt-story.is-stacked .vt-story__steps{padding:0 1.25rem}

/* Никакой горизонтальной прокрутки из-за истории во всю ширину (полоса прокрутки Windows, дробный масштаб,
   эффекты со сдвигом). clip, а не hidden: не создаёт контейнер прокрутки и не ломает прилипающую картинку. */
html:has(.vt-story),body.has-vt-story{overflow-x:clip}
.vt-story{overflow-x:clip;overflow-clip-margin:0}