/* Фирменная анимация SETUP: «Шеврон наводит порядок».
   Знак бренда — лаймовый шеврон в тёмно-синем квадрате. Подключается только на setup-company.pro (tools/motion/apply.py). */
.sx-chev-i{display:inline-block;flex:none;width:.8em;height:.8em;margin-left:.5em;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.su-btn:hover .sx-chev-i,.lead-form button:hover .sx-chev-i{transform:translateY(-4px)}
.su-btn:active,.lead-form button:active{transform:translateY(1px) scale(.98)}
/* Кнопка формы заявки в цвет бренда (раньше была янтарной, как у ФинОпоры) */
.lead-form[data-site="setup"] button{background:#C8F135;color:#0D1B2E;display:inline-flex;align-items:center;justify-content:center;transition:transform .2s}

/* Полоса прогресса страницы с шевроном на конце (заменяет общую) */
.m-progress{display:none!important}
.sx-prog{position:fixed;left:0;top:0;height:3px;width:0;opacity:0;transition:opacity .3s;z-index:99;background:#C8F135;pointer-events:none;box-shadow:0 0 10px rgba(200,241,53,.6)}
.sx-prog svg{position:absolute;right:-7px;top:2px;width:14px;height:10px}

/* Первый экран главной: заявки → шеврон → воронка → лесенка → логотип */
.sx-fun{width:100%;max-width:520px;justify-self:end;min-width:0}
.sx-fun-box{position:relative;width:100%;aspect-ratio:560/420}
.sx-st{position:absolute;left:0;top:0;width:560px;height:420px;transform-origin:0 0;border-radius:24px;background:#16273F;overflow:hidden;box-shadow:inset 0 0 0 1px #24385A}
.sx-col{position:absolute;top:58px;width:122px;height:340px;border-radius:14px;background:#21344F;opacity:0;transform:translateY(16px);transition:opacity .5s,transform .5s,height .8s cubic-bezier(.2,.8,.2,1),top .8s cubic-bezier(.2,.8,.2,1),background .6s}
.sx-col i{position:absolute;left:12px;top:10px;font:600 11px/1.2 Onest,Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#93A2B8;white-space:nowrap;font-style:normal;transition:opacity .3s}
.sx-col.on{opacity:1;transform:none}
.sx-col.win i{color:#C8F135}
.sx-col.stair i{opacity:0}
.sx-card{position:absolute;left:0;top:0;width:108px;padding:7px 9px;border-radius:9px;background:#fff;color:#0D1B2E;font:500 11.5px/1.25 Onest,Arial,sans-serif;box-shadow:0 8px 20px -10px rgba(0,0,0,.6);transition:transform .9s cubic-bezier(.2,.8,.2,1),background .4s,opacity .5s;will-change:transform}
.sx-card small{display:block;font-size:10px;color:#5A6678}
.sx-card.miss{background:#FFE3DF}
.sx-card.miss small{color:#B23A2C}
.sx-card.done{background:#C8F135}
.sx-card.done small{color:#0D1B2E}
.sx-sweep{position:absolute;left:0;top:0;width:560px;height:420px;pointer-events:none}
.sx-sweep polyline{fill:none;stroke:#C8F135;stroke-width:16;stroke-linecap:square}
.sx-badge{position:absolute;right:16px;top:14px;font:600 12px/1 Onest,Arial,sans-serif;padding:7px 12px;border-radius:999px;background:#2A1E24;color:#FFB4A9;transition:background .4s,color .4s,opacity .4s}
.sx-badge.ok{background:#C8F135;color:#0D1B2E}
.sx-final{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;opacity:0;transition:opacity .6s;pointer-events:none}
.sx-final.on{opacity:1}
.sx-final b{font:700 26px/1.2 Unbounded,Arial,sans-serif;color:#fff}
.sx-final span{color:#C3CCD9;font:500 14px/1.4 Onest,Arial,sans-serif}
@media(max-width:900px){.sx-fun{justify-self:stretch;max-width:none}}

/* Фоновый шеврон в первом экране внутренних страниц */
.sx-mark-host{position:relative;overflow:hidden;isolation:isolate}
.sx-mark{position:absolute;z-index:-1;pointer-events:none;right:-60px;top:50%;width:min(560px,70vw);height:auto;transform:translateY(-45%)}
.sx-mark polyline{fill:none;stroke-width:44;stroke-linecap:square;stroke-dasharray:700;stroke-dashoffset:700;animation:sx-draw 1.6s cubic-bezier(.6,0,.2,1) .3s forwards}
.su-paper .sx-mark polyline,.su-sec .sx-mark polyline{stroke:#2350E6;opacity:.07}
.su-hero .sx-mark polyline{stroke:#C8F135;opacity:.12}
@keyframes sx-draw{to{stroke-dashoffset:0}}

/* «Как мы работаем»: мастер установки */
.sx-inst{background:#0D1B2E;color:#fff;border-radius:18px;padding:18px 22px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.sx-inst b{font:600 14px/1.2 Unbounded,Arial,sans-serif}
.sx-inst .sx-pct{font:700 24px/1 Unbounded,Arial,sans-serif;color:#C8F135;font-variant-numeric:tabular-nums;min-width:3.4em}
.sx-inst .sx-bar{flex:1 1 220px;height:10px;border-radius:5px;background:#21344F;overflow:hidden;position:relative}
.sx-inst .sx-bar i{position:absolute;inset:0 auto 0 0;width:0;background:#C8F135;border-radius:5px;transition:width .35s}
.sx-inst .sx-s{font:500 14px/1.3 Onest,Arial,sans-serif;color:#C3CCD9}
.sx-inst.done .sx-s{color:#C8F135}
.sx-steps>.su-card{transition:border-color .35s,box-shadow .35s,opacity .35s}
.sx-steps>.su-card.sx-wait{opacity:.55}
.sx-steps>.su-card.sx-wait .su-step{background:transparent;box-shadow:inset 0 0 0 2px #C3CCD9;color:#5A6678}
.sx-steps>.su-card.sx-run{border-color:#2350E6;box-shadow:0 0 0 1px #2350E6}
.sx-steps>.su-card.sx-run .su-step{animation:sx-pulse 1.1s ease-in-out infinite}
.sx-steps>.su-card.sx-ok .su-step{background:#C8F135!important;color:#0D1B2E!important;font-size:0}
.sx-steps>.su-card.sx-ok .su-step::after{content:"";width:14px;height:9px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpolyline points='1.5,8 7,2.5 12.5,8' fill='none' stroke='%230D1B2E' stroke-width='3'/%3E%3C/svg%3E") center/contain no-repeat}
@keyframes sx-pulse{50%{box-shadow:0 0 0 6px rgba(35,80,230,.18)}}

/* «Почему SETUP» бенто-сеткой (главная) */
.su .sx-bento{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px}
.sx-bento>.su-card{grid-column:span 3;overflow:hidden;position:relative}
.sx-bento>.su-card:nth-child(1){grid-column:span 2}
.sx-bento>.su-card:nth-child(2){grid-column:span 4}
.sx-viz{margin-top:auto;padding-top:8px;min-height:64px;display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap}
.sx-slot{font:600 13px/1 Onest,Arial,sans-serif;padding:9px 12px;border-radius:10px;background:#F3F5F8;border:1px dashed #C3CCD9;color:#0D1B2E;opacity:0;transform:translateY(14px) scale(.9);transition:opacity .4s,transform .5s cubic-bezier(.2,1.4,.4,1),background .4s,border-color .4s}
.sx-in .sx-slot{opacity:1;transform:none;background:#fff;border:1px solid #D8DEE7}
.sx-in .sx-slot:first-child{background:#C8F135;border-color:#C8F135}
.sx-cert{width:92px;height:62px;border-radius:8px;background:#0D1B2E;color:#C8F135;display:flex;flex-direction:column;align-items:center;justify-content:center;font:700 13px/1.1 Unbounded,Arial,sans-serif;gap:4px;transform:perspective(500px) rotateY(180deg);backface-visibility:hidden;transition:transform 1s cubic-bezier(.2,.8,.2,1) .2s}
.sx-cert small{font:500 9px/1 Onest,Arial,sans-serif;color:#C3CCD9;letter-spacing:.06em;text-transform:uppercase}
.sx-in .sx-cert{transform:perspective(500px) rotateY(0)}
.sx-doc{position:relative;width:70px;height:86px;border-radius:6px;background:#fff;border:1px solid #D8DEE7;padding:10px 9px;display:flex;flex-direction:column;gap:6px}
.sx-doc i{display:block;height:4px;border-radius:2px;background:#D8DEE7}
.sx-doc i:nth-child(2){width:70%}.sx-doc i:nth-child(3){width:85%}
.sx-stamp{position:absolute;right:-18px;bottom:-6px;width:54px;height:54px;border-radius:50%;border:3px solid #2350E6;color:#2350E6;font:700 10px/1.05 Unbounded,Arial,sans-serif;display:flex;align-items:center;justify-content:center;text-align:center;opacity:0;transform:scale(2.4) rotate(-20deg)}
.sx-in .sx-stamp{animation:sx-stamp .7s cubic-bezier(.2,1.6,.4,1) .5s forwards}
@keyframes sx-stamp{to{opacity:1;transform:scale(1) rotate(-12deg)}}
.sx-plan{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font:500 14px/1.2 Onest,Arial,sans-serif;color:#3A4658}
.sx-plan li{display:flex;align-items:center;gap:8px}
.sx-plan li::before{content:"";width:16px;height:16px;border-radius:4px;border:2px solid #C3CCD9;transition:background .3s,border-color .3s}
.sx-in .sx-plan li::before{background:#C8F135;border-color:#C8F135}
.sx-in .sx-plan li:nth-child(1)::before{transition-delay:.3s}.sx-in .sx-plan li:nth-child(2)::before{transition-delay:.6s}.sx-in .sx-plan li:nth-child(3)::before{transition-delay:.9s}
@media(max-width:900px){.su .sx-bento{grid-template-columns:1fr}.sx-bento>.su-card,.sx-bento>.su-card:nth-child(1),.sx-bento>.su-card:nth-child(2){grid-column:auto}}

/* Подвал: крупный шеврон «Всё настроено» */
.sx-ft{border-bottom:1px solid #1C2B41}
.sx-ft .su-w{display:flex;align-items:center;gap:20px;padding-top:40px;padding-bottom:32px;flex-wrap:wrap}
.sx-ft svg{width:72px;height:72px;flex:none;transform:translateY(16px);opacity:.3;transition:transform .9s cubic-bezier(.2,1.4,.4,1),opacity .6s}
.sx-ft.sx-in svg{transform:none;opacity:1}
.sx-ft b{display:block;font:700 clamp(24px,4vw,40px)/1.1 Unbounded,Arial,sans-serif;color:#fff}
.sx-ft span{color:#A9B4C4;font-size:15px}

@media (prefers-reduced-motion:reduce){
  .sx-mark polyline{animation:none;stroke-dashoffset:0}
  .sx-card,.sx-col,.sx-slot,.sx-cert,.sx-ft svg{transition:none!important}
  .sx-steps>.su-card.sx-run .su-step{animation:none}
}
