/* Алпатыч — лендинг. Выгружено с канвы, вариант 3. */
@font-face{font-family:"Golos Text";font-style:normal;font-weight:400 900;font-display:swap;src:url("golos-text.woff2") format("woff2")}
body{margin:0;background:#F5F1E8}
.v3 a{color:#1A1C1E;text-decoration-color:#B08D4A;text-underline-offset:4px;text-decoration-thickness:1.5px}
.v3 a:hover{color:#7C6124}
.v3 .dark a{color:#F5F1E8}
.v3 .dark a:hover{color:#CDB07A}
.v3 a.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 28px;border-radius:12px;font-size:18px;font-weight:700;text-decoration:none;box-sizing:border-box;transition:transform .15s ease,background .15s ease}
.v3 a.btn:hover{transform:translateY(-1px)}
.v3 a.btn-ink{background:#1A1C1E;color:#F5F1E8}
.v3 a.btn-ink:hover{background:#2E3134;color:#F5F1E8}
.v3 a.btn-brass{background:#B08D4A;color:#1A1C1E}
.v3 a.btn-brass:hover{background:#C29E58;color:#1A1C1E}
.v3 a.btn-line{min-height:44px;padding:0 18px;font-size:15px;font-weight:600;background:transparent;color:#1A1C1E;box-shadow:inset 0 0 0 1.5px #1A1C1E}
.v3 a.btn-line:hover{background:#1A1C1E;color:#F5F1E8}
.v3 a.more{display:inline-flex;align-items:center;min-height:44px;font-size:17px;font-weight:600}
.v3 a:focus-visible,.v3 button:focus-visible{outline:3px solid #7C6124;outline-offset:3px}
.v3 .dark a:focus-visible,.v3 .dark button:focus-visible{outline-color:#CDB07A}
.v3 button.pick{transition:background .15s ease,color .15s ease}
.wrap{max-width:1120px;margin:0 auto;box-sizing:border-box;padding:clamp(52px,6.6vw,88px) 24px}
.hero-vis{flex:0 1 500px;min-width:0;margin:0 auto;position:relative;display:flex;justify-content:flex-end}
.hero-note{position:absolute;left:0;bottom:118px;width:196px;z-index:2}
.demo-stage{flex:0 1 620px;min-width:0;display:flex;align-items:center;justify-content:center;gap:16px}
.chaos{display:flex;flex-wrap:wrap;align-items:center;gap:22px 8px}
.steps5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0}
.steps5>div{padding:16px 16px 0 0;border-top:2px solid #1A1C1E}
.flow{display:flex;align-items:center;justify-content:center;--sx:-36px;--sy:0px}
.flow-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:10px}
.flow-outs{flex:1.35 1 0;gap:0}
.flow-pipe{flex:0 0 76px;height:16px;position:relative;background:linear-gradient(#C9C0AC,#C9C0AC) center/100% 2px no-repeat}
.flow-pipe i{position:absolute;top:4px;left:0;width:8px;height:8px;border-radius:50%;background:#B08D4A;opacity:0}
.flow-hub{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.flow-src,.flow-out{transition:opacity .5s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.flow.armed .flow-src{opacity:0;transform:translate(var(--sx),var(--sy))}
.flow.armed .flow-out{opacity:0;transform:translate(var(--sx),var(--sy))}
.flow.on .flow-src:nth-child(2){transition-delay:.1s}
.flow.on .flow-src:nth-child(3){transition-delay:.2s}
.flow.on .flow-src:nth-child(4){transition-delay:.3s}
.flow.on .flow-src:nth-child(5){transition-delay:.4s}
.flow.on .flow-out:nth-child(1){transition-delay:1.8s}
.flow.on .flow-out:nth-child(2){transition-delay:1.92s}
.flow.on .flow-out:nth-child(3){transition-delay:2.04s}
.flow.on .flow-out:nth-child(4){transition-delay:2.16s}
.flow.on .flow-out:nth-child(5){transition-delay:2.28s}
.flow.on .flow-out:nth-child(6){transition-delay:2.4s}
.flow.on .flow-out:nth-child(7){transition-delay:2.52s}
.flow.on .flow-p1 i{animation:flowRunX .8s linear .7s 2 both}
.flow.on .flow-p1 i:nth-child(2){animation-delay:.9s}
.flow.on .flow-p1 i:nth-child(3){animation-delay:1.1s}
.flow.on .flow-p2 i{animation:flowRunX .8s linear 1.5s 2 both}
.flow.on .flow-p2 i:nth-child(2){animation-delay:1.7s}
.flow.on .flow-p2 i:nth-child(3){animation-delay:1.9s}
.flow.on .flow-ring{animation:flowPulse .9s ease-in-out 1s 2}
@keyframes flowRunX{0%{transform:translateX(0);opacity:0} 15%{opacity:1} 85%{opacity:1} 100%{transform:translateX(68px);opacity:0} }
@keyframes flowRunY{0%{transform:translateY(0);opacity:0} 15%{opacity:1} 85%{opacity:1} 100%{transform:translateY(36px);opacity:0} }
@keyframes flowPulse{0%,100%{box-shadow:0 0 0 0 rgba(176,141,74,0),0 8px 24px rgba(26,28,30,.10)} 50%{box-shadow:0 0 0 14px rgba(176,141,74,.22),0 8px 24px rgba(26,28,30,.10)} }
@media (max-width: 860px){
.hero-vis{flex:1 1 100%;flex-direction:column;align-items:center;justify-content:flex-start}
.hero-note{position:relative;left:auto;bottom:auto;width:min(300px,100%);margin-top:-18px}
.demo-stage{flex:1 1 100%;flex-direction:column}
.steps5{grid-template-columns:minmax(0,1fr)}
.steps5>div{padding:12px 0 14px}
.flow{flex-direction:column;align-items:stretch;--sx:0px;--sy:-24px}
.flow-col{flex:0 0 auto}
.flow-pipe{flex:0 0 44px;width:16px;height:44px;align-self:center;background:linear-gradient(#C9C0AC,#C9C0AC) center/2px 100% no-repeat}
.flow-pipe i{top:0;left:4px}
.flow.on .flow-p1 i,.flow.on .flow-p2 i{animation-name:flowRunY}
}
@media (prefers-reduced-motion:reduce){.v3 a.btn,.v3 button.pick{transition:none}.flow *{animation:none!important;transition:none!important} }
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.pv{display:contents}
.pv[hidden]{display:none}
.v3 button.pick{background:#FFFFFF;color:#14171A}
.v3 button.pick[aria-pressed="true"]{background:#14171A;color:#FFFFFF}
.tab.on{background:#E8EAEF;color:#14171A}
.doc a{color:#1A1C1E}
