/* 1. первый экран: сканер процессов */
.h{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:130px 0 60px}
.h>.wrap{width:100%}
.h h1{margin-top:22px}
.h .pod{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;margin-top:40px;align-items:end}
.h .kn{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.ceny-str{display:flex;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:8px}
.ceny-str a{flex:1 1 0;min-width:140px;padding:16px 18px 14px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.ceny-str b{font:800 34px/1 var(--zag)}
.ceny-str span{font-size:14px;color:var(--mute)}
.ceny-str a:hover b{color:var(--acid)}
.skaner{position:relative;margin-top:56px;height:112px;overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.skaner .lenta{position:absolute;left:0;top:22px;display:flex;gap:14px;will-change:transform}
.skaner .uz{flex:none;display:flex;align-items:center;gap:10px;height:64px;padding:0 22px;border-radius:99px;border:1px solid var(--line);background:rgba(18,18,22,.8);font-weight:600;white-space:nowrap;transition:background .4s,color .4s,border-color .4s}
.skaner .uz i{width:10px;height:10px;border-radius:50%;background:var(--mute);transition:background .3s}
.skaner .uz.est{background:var(--acid);color:var(--ink);border-color:var(--acid)}
.skaner .uz.est i{background:var(--ink)}
.skaner .uz.net{color:var(--mute)}
.skaner .luch{position:absolute;left:50%;top:0;bottom:0;width:2px;background:var(--acid);box-shadow:0 0 22px 3px rgba(204,255,0,.6)}
.skaner-podp{display:flex;justify-content:space-between;gap:20px;margin-top:10px}
@media (max-width:860px){.h .pod{grid-template-columns:1fr}.ceny-str a{flex:1 1 45%}}

/* 2. путь компании — стопка */
.stopka{margin-top:56px}
.karta{position:sticky;top:calc(96px + var(--n)*24px);min-height:400px;border-radius:30px;padding:44px;margin-bottom:36px;display:grid;grid-template-columns:1.2fr 1fr;gap:30px;border:1px solid var(--line);background:var(--ink2)}
.karta:nth-child(2){background:linear-gradient(rgba(108,75,255,.14),rgba(108,75,255,.14)),var(--ink2)}
.karta:nth-child(3){background:linear-gradient(rgba(108,75,255,.3),rgba(108,75,255,.3)),var(--ink2)}
.karta:nth-child(4){background:var(--viol)}
.karta .n{font:600 13px var(--tekst);letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.karta:nth-child(4) .n{color:rgba(237,235,230,.75)}
.karta h3{font:800 clamp(40px,4.8vw,72px)/.95 var(--zag);margin-top:16px}
.karta p{margin-top:16px;max-width:38ch;color:rgba(237,235,230,.82)}
.karta .dal{display:inline-flex;margin-top:24px;font-weight:700;border-bottom:2px solid var(--acid);padding:10px 0 4px}
.karta .c{align-self:end;justify-self:end;text-align:right;font:900 clamp(64px,9vw,160px)/.8 var(--zag)}
.karta .c small{display:block;font:400 13px var(--tekst);color:var(--mute);margin-top:12px}
.karta:nth-child(4) .c small{color:rgba(237,235,230,.75)}
.karta:first-child .c{color:var(--acid)}
@media (max-width:760px){.karta{grid-template-columns:1fr;padding:26px;min-height:330px;top:calc(76px + var(--n)*14px)}.karta .c{justify-self:start;text-align:left;font-size:64px}}

/* 3. калькулятор */
.kalk{display:grid;grid-template-columns:1fr 1.15fr;gap:16px;margin-top:56px}
.kalk .vvod{padding:36px;display:grid;gap:26px}
.pole2 label{display:block;font-size:15px;color:var(--mute);margin-bottom:6px}
.pole2 .str2{display:flex;align-items:center;gap:10px;border-bottom:1.5px solid var(--line)}
.pole2 input[type=number]{flex:1;min-width:0;background:none;border:0;font:800 52px/1.1 var(--zag);padding:4px 0;-moz-appearance:textfield}
.pole2 input::-webkit-inner-spin-button{display:none}
.pole2 button{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--line);font-size:24px;flex:none}
.pole2 button:hover{border-color:var(--acid);color:var(--acid)}
.pole2 input[type=range]{width:100%;accent-color:#CCFF00;height:44px}
.pole2 .dolya{font:800 52px/1 var(--zag);color:var(--acid)}
.kalk .itog{padding:36px;display:flex;flex-direction:column;gap:18px}
.kalk .bol{font:900 clamp(64px,8vw,128px)/.8 var(--zag);color:var(--acid)}
.kalk .bol small{font:600 18px var(--tekst);color:var(--bone);display:block;margin-top:14px}
.kalk svg{width:100%;height:auto}
.kalk .formula{font-size:14px;color:var(--mute);border-top:1px solid var(--line);padding-top:14px}
.kalk .formula b{color:var(--bone);font-weight:600}
.otsenka{display:inline-block;align-self:flex-start;border:1.5px solid var(--acid);color:var(--acid);border-radius:99px;padding:4px 12px;font:700 12px var(--tekst);letter-spacing:.14em;text-transform:uppercase}
@media (max-width:860px){.kalk{grid-template-columns:1fr}.kalk .vvod,.kalk .itog{padding:24px}.pole2 input[type=number],.pole2 .dolya{font-size:44px}}

/* 4. пять мест — билеты */
.bilety{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:48px}
.bilet{position:relative;min-height:260px;border-radius:18px;border:1.5px dashed rgba(237,235,230,.28);padding:22px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .5s var(--ease),border-color .3s}
.bilet::before,.bilet::after{content:"";position:absolute;left:-10px;top:62%;width:20px;height:20px;border-radius:50%;background:var(--ink);border:1.5px dashed rgba(237,235,230,.28)}
.bilet::after{left:auto;right:-10px}
.bilet .nom{font:900 76px/.8 var(--zag);color:rgba(237,235,230,.16)}
.bilet .st{font-weight:600}
.bilet .st small{display:block;color:var(--mute);font-weight:400;font-size:14px}
.bilet:hover{transform:translateY(-8px) rotate(-1.5deg);border-color:var(--acid)}
.bilet:hover .nom{color:var(--acid)}
.bil-pod{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:40px}
@media (max-width:860px){.bilety{grid-template-columns:repeat(5,minmax(150px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;padding:10px 4px 16px;margin-left:calc(var(--pole)*-1);margin-right:calc(var(--pole)*-1);padding-left:var(--pole);scrollbar-width:none}.bilet{scroll-snap-align:start;min-height:220px}.bil-pod{grid-template-columns:1fr;gap:16px}}

/* 5. что уходит в модель */
.marsh{display:grid;grid-template-columns:.9fr 1.4fr;gap:40px;margin-top:48px;align-items:center}
.chipy{display:flex;flex-direction:column;gap:10px}
.chipy button{min-height:56px;text-align:left;padding:14px 20px;border-radius:14px;border:1px solid var(--line);background:rgba(18,18,22,.7);font-weight:600;display:flex;justify-content:space-between;gap:12px;transition:background .3s,color .3s}
.chipy button[aria-pressed=true]{background:var(--bone);color:var(--ink)}
.chipy button span{color:var(--mute);font-weight:400}
.marsh svg{width:100%;height:auto}
.marsh .poyasn{margin-top:16px;min-height:3em;font-size:17px}
.cel text{font:700 26px var(--zag);fill:var(--mute);transition:fill .3s}
.cel rect{fill:rgba(18,18,22,.9);stroke:rgba(237,235,230,.14);transition:stroke .3s}
.cel.akt text{fill:var(--ink)}.cel.akt rect{fill:var(--acid);stroke:var(--acid)}
.cel.stop.akt rect{fill:var(--bone);stroke:var(--bone)}
@media (max-width:860px){.marsh{grid-template-columns:1fr}.cel text{font-size:34px}}

/* 6. шкала времени */
.shkala{margin-top:64px;position:relative}
.shkala .ryad{display:grid;grid-template-columns:220px 1fr;gap:24px;align-items:center;padding:22px 0;border-top:1px solid var(--line)}
.shkala .ryad:last-child{border-bottom:1px solid var(--line)}
.shkala h3{font:800 34px/1 var(--zag)}
.shkala .ryad p{font-size:15px;color:var(--mute);margin-top:6px}
.shkala .polosa{height:56px;border-radius:12px;background:rgba(237,235,230,.06);position:relative;overflow:hidden}
.shkala .polosa i{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:12px;background:var(--bone);transition:width 1.4s var(--ease)}
.shkala .polosa i.k{background:var(--acid)}
.shkala .polosa em{position:absolute;right:16px;top:50%;transform:translateY(-50%);font:800 24px var(--zag);font-style:normal;color:var(--mute)}
.shkala.vidno .polosa i{width:var(--w)}
.os{display:flex;justify-content:space-between;margin:10px 0 0 244px;font-size:13px;color:var(--mute)}
@media (max-width:760px){.shkala .ryad{grid-template-columns:1fr;gap:10px}.os{margin-left:0}}

/* 7. где проходят — картинка с переключателем */
.mesto{position:relative;margin-top:48px;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);aspect-ratio:16/8;background:var(--ink2)}
.mesto img{width:100%;height:100%;object-fit:cover;filter:saturate(.7) contrast(1.05);transition:opacity .6s,transform 1.2s var(--ease)}
.mesto.onlajn img{opacity:.22;transform:scale(1.06)}
.mesto .setka-o{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:10px;padding:28px;opacity:0;transition:opacity .6s}
.mesto.onlajn .setka-o{opacity:1}
.mesto .setka-o i{border-radius:14px;border:1px solid rgba(237,235,230,.18);background:rgba(18,18,22,.6);position:relative}
.mesto .setka-o i::after{content:"";position:absolute;left:50%;top:44%;width:26%;aspect-ratio:1;border-radius:50%;background:rgba(237,235,230,.12);transform:translate(-50%,-50%)}
.mesto .setka-o i:nth-child(3){border-color:var(--acid)}
.mesto .podp{position:absolute;left:28px;bottom:26px;right:28px;display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap}
.mesto .podp b{font:800 clamp(34px,4vw,60px)/.95 var(--zag);max-width:16ch;text-shadow:0 2px 30px rgba(8,8,10,.8)}
.pereklyuch{display:inline-flex;border:1.5px solid rgba(237,235,230,.4);border-radius:99px;padding:4px;background:rgba(8,8,10,.7)}
.pereklyuch button{min-height:46px;padding:0 22px;border-radius:99px;font-weight:700}
.pereklyuch button[aria-pressed=true]{background:var(--acid);color:var(--ink)}
@media (max-width:760px){.mesto{aspect-ratio:4/5}.mesto .setka-o{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(4,1fr);padding:16px}.mesto .podp{left:16px;right:16px;bottom:16px}}

/* 8. рынок / мы — переворот */
.flip-shapka{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap}
.flip{margin-top:44px;display:grid;gap:0;perspective:1400px}
.flip .r{display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:center;border-top:1px solid var(--line);padding:6px 0;min-height:110px}
.flip .r:last-child{border-bottom:1px solid var(--line)}
.flip .tema{font:700 13px var(--tekst);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.flip .kub{position:relative;height:96px;transform-style:preserve-3d;transition:transform .9s var(--ease)}
.flip .kub>div{position:absolute;inset:0;display:flex;align-items:center;backface-visibility:hidden;font:800 clamp(26px,2.8vw,42px)/1 var(--zag)}
.flip .kub .my{transform:rotateX(-90deg) translateZ(48px);color:var(--acid)}
.flip .kub .ry{transform:translateZ(48px);color:var(--mute);text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:rgba(237,235,230,.4)}
.flip.my .kub{transform:rotateX(90deg)}
.flip .r:nth-child(2) .kub{transition-delay:.08s}.flip .r:nth-child(3) .kub{transition-delay:.16s}.flip .r:nth-child(4) .kub{transition-delay:.24s}
@media (max-width:760px){.flip .r{grid-template-columns:1fr;gap:4px;padding:16px 0}.flip .kub{height:84px}.flip .kub>div{font-size:26px;line-height:1.05}.flip .kub .my{transform:rotateX(-90deg) translateZ(42px)}.flip .kub .ry{transform:translateZ(42px)}}

/* 9. вопросы и последний призыв */
.voprosy{display:grid;grid-template-columns:1fr 1.6fr;gap:48px;margin-top:20px}
.voprosy details{border-top:1px solid var(--line)}
.voprosy details:last-child{border-bottom:1px solid var(--line)}
.voprosy summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 0;min-height:56px;font:700 clamp(22px,2vw,28px)/1.1 var(--zag)}
.voprosy summary::-webkit-details-marker{display:none}
.voprosy summary::after{content:"+";font:400 32px var(--tekst);color:var(--acid);transition:transform .3s}
.voprosy details[open] summary::after{transform:rotate(45deg)}
.voprosy details p{padding:0 0 24px;color:#d9d7d2;max-width:60ch}
.final{margin-top:110px;border-radius:var(--r);background:var(--acid);color:var(--ink);padding:56px;display:grid;grid-template-columns:1.4fr 1fr;gap:32px;align-items:end;overflow:hidden;position:relative}
.final h2{font:900 clamp(56px,7vw,116px)/.84 var(--zag);text-transform:uppercase}
.final p{font-size:19px;max-width:36ch}
.final .knopka{background:var(--ink);color:var(--acid);margin-top:22px}
@media (max-width:860px){.voprosy{grid-template-columns:1fr;gap:12px}.final{grid-template-columns:1fr;padding:30px}}

.h1-pod{display:block;font:700 clamp(24px,2.3vw,34px)/1.12 var(--zag);text-transform:none;letter-spacing:0;color:var(--bone);margin-top:18px;max-width:34ch}
.tab-obl{overflow-x:auto}
.tab caption{caption-side:top;text-align:left;font:600 13px var(--tekst);letter-spacing:.16em;text-transform:uppercase;color:var(--mute);padding-bottom:12px}
.tab td a{color:var(--bone)}
.tab{width:100%;border-collapse:collapse;font-size:15px}
.tab th,.tab td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--line);vertical-align:top}
.tab th{font-weight:700;color:var(--mute);font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.tab td a{text-decoration:underline;text-decoration-color:rgba(204,255,0,.5);text-underline-offset:3px}
@media (max-width:760px){.tab{font-size:15px}.tab thead{display:none}.tab tr{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:12px 0;border-bottom:1px solid var(--line)}.tab td{border:0;padding:0}.tab td:nth-child(1){font-weight:700;grid-row:1}.tab td:nth-child(4){grid-row:1;grid-column:2;color:var(--acid)}.tab td:nth-child(2),.tab td:nth-child(3){grid-column:1/-1;color:var(--mute)}}