:root{--bg:#080809;--surface:#111113;--surface-2:#161618;--line:#26262a;--line-2:#3b3b3f;--ink:#f0eff1;--soft:#bebec4;--muted:#a4a4aa;--dim:#909098;--cta:#ecebef;--sage:#b7c59e;--amber:#e0a96d;--ice:#8fb3e8;--grad:linear-gradient(90deg,#c9d6b3,#e8bb85);--g:32px;--hh:68px}
*{box-sizing:border-box}
html{scroll-behavior:auto;-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.7 Manrope,system-ui,sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg,canvas{display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3,h4,h5,h6,p,ul{margin:0}ul{padding:0;list-style:none}
:focus-visible{outline:2px solid #dce4ba;outline-offset:3px;border-radius:6px}
.mono{font-family:inherit}
.wrap{width:100%;max-width:1312px;margin:0 auto;padding:0 var(--g)}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--cta);color:#151518;padding:8px 14px;border-radius:6px}.skip:focus{left:8px}
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");}
@keyframes gr{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,3%)}80%{transform:translate(3%,1%)}}

/* кнопки */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 26px;border-radius:6px;font-weight:600;font-size:15px;line-height:1.2;border:1px solid transparent;transition:background .25s,border-color .25s,transform .25s,box-shadow .25s;will-change:transform;white-space:nowrap}
.btn-main{background:var(--cta);color:#151518}
.btn-main:hover{background:#fff;box-shadow:0 10px 40px -10px rgba(232,187,133,.55)}
.btn-ghost{border-color:var(--line-2);color:var(--ink);background:rgba(255,255,255,.02)}
.btn-ghost:hover{border-color:var(--soft);background:rgba(255,255,255,.06)}
.btn-s{padding:11px 18px;font-size:14px}.btn-l{padding:18px 28px;font-size:16px;width:100%}
.ico-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;font-size:21px;color:var(--soft);transition:.25s;flex:none}
.ico-btn:hover{color:#10110e;background:var(--sage);border-color:var(--sage)}
.ico-btn[data-messenger=whatsapp]:hover{background:#9fd3b0;border-color:#9fd3b0}

/* шапка */
.hdr{position:fixed;top:0;left:0;right:0;z-index:60;padding:12px var(--g);transition:transform .45s cubic-bezier(.3,.7,.2,1)}
.hdr.hide{transform:translateY(-110%)}
.hdr-in{max-width:1312px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 12px 10px 20px;border-radius:10px;border:1px solid transparent;transition:background .3s,border-color .3s,backdrop-filter .3s}
.hdr.glass .hdr-in{background:rgba(14,14,16,.62);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border-color:var(--line)}
.logo{font-weight:650;font-size:21px;letter-spacing:-.02em}
.logo span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.menu{display:flex;gap:6px}
.menu a{padding:8px 14px;border-radius:99px;font-size:14px;color:var(--soft);transition:.25s}
.menu a:hover{color:var(--ink)}.menu a.on{color:var(--ink);background:rgba(255,255,255,.07)}
.hdr-r{display:flex;align-items:center;gap:10px}
.burger{display:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);background:transparent;font-size:22px;place-items:center}
.mnav{position:fixed;inset:0;z-index:55;background:rgba(8,8,9,.97);backdrop-filter:blur(16px);padding:100px var(--g) 28px;display:flex;flex-direction:column;justify-content:space-between;opacity:0;visibility:hidden;transition:.35s}
.mnav.open{opacity:1;visibility:visible}
.mnav nav{display:flex;flex-direction:column;gap:6px}
.mnav nav a{font-size:40px;font-weight:300;letter-spacing:-.02em;padding:6px 0;border-bottom:1px solid var(--line)}
.mnav-b{display:flex;flex-direction:column;gap:16px}.msgs{display:flex;gap:10px}.mnav-b .btn{width:100%}

/* заголовки */
:root{--sp:clamp(72px,9vw,120px)}
.sec{padding:var(--sp) 0;position:relative}
.sec-h{margin-bottom:clamp(32px,4vw,56px);max-width:980px}
.kick{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:18px}
.hd{font-weight:300;letter-spacing:-.02em;font-size:clamp(34px,4.2vw,60px);line-height:1.08}
.hd .ln{display:block;overflow:hidden;padding-bottom:.14em;margin-bottom:-.14em}
.hd .li{display:inline-block}
.js .hd .li{transform:translateY(112%);transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.js .hd.in .li{transform:none}.js .hd.in .ln:nth-child(2) .li{transition-delay:.12s}
.acc{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:1.08em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.1em}
.sub{color:var(--muted);font-size:17px;max-width:620px;margin-top:22px;line-height:1.75}
.fine{font-size:12px;color:var(--dim);margin-top:26px;letter-spacing:.02em;line-height:1.6}
.more{margin-top:34px}.more a{color:var(--soft);display:inline-flex;gap:8px;align-items:center;border-bottom:1px solid var(--line-2);padding-bottom:3px}.more a.btn{border-bottom:1px solid var(--line-2);padding:15px 26px}
.js .rv{opacity:0;transform:translateY(32px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--rd,0)*90ms)}
.js .rv.in{opacity:1;transform:none}

/* первый экран */
.hero{position:relative;min-height:max(100svh,760px);display:flex;align-items:center;padding:110px 0 120px;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 520px at 74% 52%,rgba(143,179,232,.09),transparent 70%),radial-gradient(500px 400px at 60% 90%,rgba(224,169,109,.08),transparent 70%)}
#stage{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y;cursor:grab}#stage.grab{cursor:grabbing}
.no-webgl #stage{display:none}
.stage-fb{display:none;position:absolute;right:2%;top:12%;width:40%;height:66%;z-index:1}
.no-webgl .stage-fb{display:block}
.stage-fb img{position:absolute;width:62%;border-radius:14px;box-shadow:0 30px 80px -20px #000;border:1px solid var(--line-2)}
.stage-fb img:nth-child(1){right:0;top:4%;transform:rotate(5deg)}.stage-fb img:nth-child(2){left:6%;top:30%;transform:rotate(-6deg);z-index:2}.stage-fb img:nth-child(3){right:10%;bottom:0;transform:rotate(2deg);z-index:3}
.hero-grid{pointer-events:none}
.hero-txt{max-width:700px;pointer-events:none;position:relative;z-index:2}.hero-txt a,.hero-txt .offer{pointer-events:auto}
.eyebrow{font-size:13px;letter-spacing:.04em;color:var(--dim);margin-bottom:26px}.eyebrow b{color:var(--ink);font-weight:600}
.h1{font-weight:300;letter-spacing:-.02em;line-height:1.08;font-size:clamp(40px,3.8vw,62px)}
.hl{display:block;white-space:nowrap}
.swap{display:inline-block;overflow:hidden;vertical-align:bottom;padding:0 .02em .14em 0;margin-bottom:-.14em}
.swap em{display:inline-block;font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:1.1em;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.04em;transition:transform .6s cubic-bezier(.6,0,.2,1),opacity .5s}
.swap em.out{transform:translateY(-110%);opacity:0}.swap em.pre{transform:translateY(110%);opacity:0;transition:none}
.scrib{position:relative;display:inline-block}
.scrib svg{position:absolute;left:0;bottom:-.16em;width:100%;height:.22em;overflow:visible}
.scrib path{fill:none;stroke:url(#none);stroke:var(--amber);stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;vector-effect:non-scaling-stroke}
.js .scrib path{animation:draw 1.2s .9s cubic-bezier(.5,0,.2,1) forwards}.scrib path{stroke-dashoffset:0}.js .scrib path{stroke-dashoffset:1}
@keyframes draw{to{stroke-dashoffset:0}}
.lead{color:var(--soft);font-size:clamp(16px,1.25vw,19px);max-width:560px;margin:30px 0 34px;line-height:1.7}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}
.offer{display:inline-flex;gap:0;border:1px solid var(--line);border-radius:12px;background:rgba(14,14,16,.55);backdrop-filter:blur(8px)}
.offer li{display:flex;align-items:center;gap:9px;padding:12px 18px;font-size:13.5px;color:var(--soft);white-space:nowrap}
.offer li+li{border-left:1px solid var(--line)}.offer i{color:var(--sage);font-size:19px}
.hero-bar{position:absolute;z-index:3;bottom:26px;right:max(var(--g),calc((100vw - 1312px)/2 + var(--g)));width:min(560px,50vw);display:grid;grid-template-columns:auto auto 1fr auto;gap:14px;align-items:center;pointer-events:auto}
.hero-bar .cnt{font-size:13px;color:var(--dim)}.hero-bar .cnt b{color:var(--ink);font-weight:500;font-size:20px}
.arr{width:38px;height:38px;border-radius:50%;border:1px solid var(--line-2);background:rgba(14,14,16,.6);display:grid;place-items:center;font-size:15px;transition:.25s}.arr:hover{border-color:var(--sage);color:var(--sage)}
.cname small{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);line-height:1.2}.cname span{font-size:18px;font-weight:500;display:inline-block;transition:opacity .3s}
.dots{display:flex;gap:6px;grid-column:1/-1;margin-top:-4px}
.dots button{flex:1;height:18px;padding:0;border:0;background:none;position:relative}.dots button::after{content:"";position:absolute;left:0;right:0;top:8px;height:2px;border-radius:2px;background:var(--line-2);transition:.3s}.dots button.on::after{background:var(--grad);height:3px;top:7.5px}
.hint{grid-column:1/-1;font-size:12px;color:var(--dim);text-align:left}

/* бегущая строка */
.marq{overflow:hidden;border-block:1px solid var(--line);padding:22px 0;background:#0a0a0b}
.marq-t{display:flex;width:max-content;will-change:transform;font-size:clamp(34px,5vw,64px);font-weight:300;letter-spacing:-.02em;white-space:nowrap}
.marq-t span{padding:0 .4em}.marq-t .o{color:transparent;-webkit-text-stroke:1px #6c6c74}.marq-t .s{color:var(--sage);font-size:.5em;vertical-align:middle}

/* как работаем */
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;padding-top:34px}
.line{position:absolute;top:0;left:0;right:0;height:2px;background:var(--line-2);border-radius:2px}
.line i{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--ice),var(--sage),var(--amber));box-shadow:0 0 14px rgba(183,197,158,.6)}
.step{position:relative}
.step::before{content:"";position:absolute;top:-38px;left:0;width:10px;height:10px;border-radius:50%;background:var(--bg);border:2px solid var(--line-2);transition:.5s}
.step.dot::before{border-color:var(--sage);background:var(--sage);box-shadow:0 0 14px var(--sage)}
.step-art{height:276px;border:1px solid var(--line);background:linear-gradient(160deg,var(--surface-2),var(--surface));border-radius:16px;position:relative;overflow:hidden;display:grid;place-items:center;margin-bottom:22px}
.step .n{font-size:12px;color:var(--dim);display:block;margin-bottom:6px}
.step h3{font-size:21px;font-weight:500;letter-spacing:-.01em;line-height:1.25;margin-bottom:10px}
.step p{color:var(--muted);font-size:15px;line-height:1.7}
.tag{position:absolute;top:12px;right:12px;font:500 12px inherit;padding:4px 10px;border-radius:99px;border:1px solid var(--amber);color:var(--amber);background:rgba(224,169,109,.1)}
.step *,.step *::before{animation-play-state:paused}.step.live *,.step.live *::before{animation-play-state:running}
.model-foot{margin-top:60px;display:flex;justify-content:space-between;gap:24px;align-items:center;flex-wrap:wrap;padding:26px 30px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(120deg,rgba(183,197,158,.07),transparent 60%)}
.model-foot p{display:flex;gap:12px;align-items:center;font-size:18px;color:var(--soft);max-width:600px}.model-foot i{color:var(--sage);font-size:26px;flex:none}

/* услуги */
.stack{position:relative}
.svc{position:sticky;top:calc(88px + var(--i)*16px);display:grid;grid-template-columns:1fr 1.05fr;gap:36px;padding:44px;min-height:470px;margin-bottom:34px;border:1px solid var(--line);border-radius:30px;overflow:hidden;background:radial-gradient(640px 340px at 100% 0,color-mix(in srgb,var(--c) 15%,transparent),transparent 70%),var(--surface);box-shadow:0 -24px 60px -30px #000}
.svc .geo{position:absolute;right:-60px;bottom:-60px;width:360px;height:360px;pointer-events:none}
.svc .geo i{position:absolute;inset:0;border-radius:28%;border:1px solid color-mix(in srgb,var(--c) 40%,transparent);transform:rotate(calc(var(--k)*14deg)) scale(calc(1 - var(--k)*.16));animation:gs 20s linear infinite}
.svc .geo i:nth-child(1){--k:0}.svc .geo i:nth-child(2){--k:1;animation-direction:reverse}.svc .geo i:nth-child(3){--k:2}
@keyframes gs{to{rotate:360deg}}
.svc .big{position:absolute;right:30px;top:6px;font-size:clamp(90px,12vw,170px);line-height:1;color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--c) 45%,transparent);pointer-events:none;font-weight:500}
.svc-t{position:relative;display:flex;flex-direction:column;justify-content:center;gap:16px;z-index:2}
.svc-t .kick{color:var(--c);margin:0}
.svc-t h3{font-size:clamp(26px,2.6vw,38px);font-weight:300;letter-spacing:-.02em;line-height:1.15}
.svc-t>p{color:var(--muted);font-size:16px}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chips span{padding:6px 14px;border:1px solid var(--line-2);border-radius:99px;font-size:13px;color:var(--soft)}
.svc-f{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:8px}
.price{font-size:26px;font-weight:300;letter-spacing:-.01em}.price small{font-size:13px;color:var(--dim);margin-left:4px}
.svc-v{position:relative;z-index:2;display:grid;place-items:center;min-height:340px}
.ex{position:absolute;right:12px;bottom:8px;font-size:11px;color:var(--dim);letter-spacing:.04em}
.live-el *,.live-el *::before{animation-play-state:paused}.live-el.on *,.live-el.on *::before{animation-play-state:running}
/* сайт */
.mu-site{width:100%;max-width:480px;border:1px solid var(--line-2);border-radius:14px;background:#0c0c0e;overflow:hidden;position:relative;box-shadow:0 30px 60px -30px #000}
.mu-site .bar{display:flex;gap:6px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--line)}.mu-site .bar i{width:9px;height:9px;border-radius:50%;background:var(--line-2)}.mu-site .bar span{margin-left:10px;font:12px inherit;color:var(--dim)}
.mu-site .pg{position:relative;height:270px;padding:20px}
.mu-site .skel,.mu-site .built{position:absolute;inset:20px}
.mu-site .skel{animation:skf2 8s infinite}
.mu-site .skel b{display:block;width:50%;height:22px;border-radius:6px;background:linear-gradient(90deg,#222,#33333a,#222);background-size:200%;animation:sh 1.4s linear infinite;margin-bottom:12px}.mu-site .skel u{display:block;width:80%;height:12px;border-radius:5px;background:#222;margin-bottom:8px}.mu-site .skel s{display:block;width:30%;height:34px;border-radius:7px;background:#2a2a30;margin-top:18px}
.mu-site .built{animation:bu 8s infinite}
.mu-site .built h6{font-size:28px;font-weight:300;letter-spacing:-.02em;margin-bottom:6px}.mu-site .built p{color:var(--muted);font-size:14px}
.mu-site .bt{display:inline-block;margin-top:16px;padding:10px 20px;border-radius:6px;background:var(--cta);color:#151518;font-weight:600;font-size:13px;animation:btn 8s infinite}
.mu-site .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:20px}.mu-site .cards i{height:58px;border-radius:8px;background:linear-gradient(160deg,#1c1c20,#141416);border:1px solid var(--line)}
.mu-site .cur{position:absolute;left:30%;top:70%;animation:cu 8s infinite;filter:drop-shadow(0 4px 6px #0008)}
@keyframes skf2{0%,25%{opacity:1}40%,92%{opacity:0}100%{opacity:1}}@keyframes bu{0%,25%{opacity:0;transform:translateY(8px)}40%,92%{opacity:1;transform:none}100%{opacity:0}}
@keyframes btn{0%,66%,76%,100%{transform:scale(1);box-shadow:none}70%{transform:scale(.93);box-shadow:0 0 0 10px rgba(143,179,232,.25)}}
@keyframes cu{0%{left:78%;top:90%}35%{left:78%;top:90%}60%{left:22%;top:50%}70%{left:20%;top:49%}76%{left:20%;top:49%}95%,100%{left:78%;top:90%}}
/* чат */
.mu-chat{width:100%;max-width:400px;border:1px solid var(--line-2);border-radius:18px;background:#0e0e10;overflow:hidden;box-shadow:0 30px 60px -30px #000;position:relative}
.chat-h{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);font-weight:500}.chat-h i{color:var(--sage);font-size:22px}.chat-h small{margin-left:auto;color:var(--dim);font-size:11px}
.chat-b{height:310px;padding:14px;display:flex;flex-direction:column;gap:9px;justify-content:flex-end;overflow:hidden}
.msg-b{max-width:82%;padding:10px 14px;border-radius:16px;font-size:14px;line-height:1.45;animation:pop .4s cubic-bezier(.2,.9,.3,1.2)}
.msg-b.u{align-self:flex-end;background:var(--cta);color:#151518;border-bottom-right-radius:4px}.msg-b.b{align-self:flex-start;background:#1d1d21;border-bottom-left-radius:4px}
.msg-b.ok{align-self:stretch;max-width:100%;background:rgba(183,197,158,.12);border:1px solid rgba(183,197,158,.4);color:var(--sage);display:flex;gap:8px;align-items:center}
.msg-b.typ{display:flex;gap:4px;padding:14px}.msg-b.typ i{width:6px;height:6px;border-radius:50%;background:var(--dim);animation:ty 1s infinite}.msg-b.typ i:nth-child(2){animation-delay:.15s}.msg-b.typ i:nth-child(3){animation-delay:.3s}
@keyframes ty{50%{transform:translateY(-4px);background:var(--ink)}}@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.95)}}
/* канбан */
.mu-kan{width:100%;max-width:500px;position:relative;padding:16px 16px 26px;border:1px solid var(--line-2);border-radius:16px;background:#0e0e10;box-shadow:0 30px 60px -30px #000}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.col{background:#131316;border-radius:10px;padding:10px;min-height:260px;display:flex;flex-direction:column;gap:8px}
.col h6{font-size:12px;color:var(--muted);font-weight:500;display:flex;justify-content:space-between;margin-bottom:2px}.col h6 b{font-family:inherit;color:var(--amber);font-weight:500}
.kc{padding:10px;border-radius:8px;background:#1c1c20;border:1px solid var(--line);font-size:12px;line-height:1.35;animation:pop .45s}.kc small{display:block;color:var(--dim);font-size:11px}
.kc.hot{border-color:var(--amber);box-shadow:0 0 18px -6px var(--amber)}
/* чек-лист */
.mu-chk{width:100%;max-width:440px;position:relative;padding:22px 22px 30px;border:1px solid var(--line-2);border-radius:16px;background:#0e0e10;box-shadow:0 30px 60px -30px #000}
.mu-chk li{display:flex;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:15px;transition:color .4s}
.mu-chk li::before{content:"";width:20px;height:20px;border-radius:50%;border:1.5px solid var(--line-2);flex:none;transition:.4s;background:center/12px no-repeat}
.mu-chk li.done{color:var(--ink)}.mu-chk li.done::before{background-color:var(--sage);border-color:var(--sage);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2 6.5l2.6 2.5L10 3.5' stroke='%2310110e' stroke-width='2' fill='none' stroke-linecap='round'/></svg>")}
.prog{height:3px;background:var(--line);border-radius:3px;margin-top:18px;overflow:hidden}.prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--ice),var(--sage),var(--amber));transition:width .6s}
/* телефон-игра */
.phone{width:230px;height:400px;border:8px solid #26262a;border-radius:38px;background:#0b0b0d;position:relative;box-shadow:0 40px 70px -30px #000,0 0 0 1px #3b3b3f;overflow:hidden}
.notch{position:absolute;top:6px;left:50%;width:70px;height:18px;margin-left:-35px;background:#000;border-radius:12px;z-index:3}
.scr{position:absolute;inset:0;padding:34px 12px 12px;display:flex;flex-direction:column;gap:10px}
.g-h{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.g-h b{color:var(--ink);font-family:inherit;font-weight:500}
.g-f{flex:1;position:relative;border-radius:14px;background:radial-gradient(circle at 50% 40%,#17171b,#0d0d10);border:1px solid var(--line);overflow:hidden;user-select:none;touch-action:manipulation}
.g-start{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:12px 22px;border-radius:99px;border:0;background:var(--cta);color:#151518;font-weight:600}
.g-t{position:absolute;width:52px;height:52px;border-radius:50%;border:0;padding:0;background:radial-gradient(circle at 35% 30%,#f3e1c3,var(--amber) 55%,#a8742f);box-shadow:0 0 22px rgba(224,169,109,.55);animation:gt .22s ease-out}
.g-t.pop{animation:gp .25s forwards}
@keyframes gt{from{transform:scale(.2);opacity:0}}@keyframes gp{to{transform:scale(1.6);opacity:0}}
.g-over{position:absolute;inset:0;display:grid;place-content:center;text-align:center;background:rgba(8,8,9,.82);gap:10px;font-size:15px}.g-over b{font-size:34px;font-weight:300;color:var(--sage)}

/* портфолио */

/* сравнение */

/* путь клиента */
.flow{position:relative;display:grid;grid-template-columns:1fr 190px 1fr;gap:clamp(24px,6vw,110px);align-items:center;padding:34px;border:1px solid var(--line);border-radius:24px;background:radial-gradient(500px 300px at 50% 50%,rgba(143,179,232,.07),transparent 70%),var(--surface)}
.flow-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.flow-svg path{fill:none;stroke:var(--line-2);stroke-width:1.5}.flow-svg path.hot{stroke:url(#fg);stroke-width:2.5;filter:drop-shadow(0 0 6px rgba(183,197,158,.8))}
.chan{display:grid;gap:12px;position:relative;z-index:2}
.chan li{display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid var(--line-2);border-radius:12px;background:var(--surface-2);font-size:14.5px;color:var(--soft);transition:.35s}
.chan li i{font-size:20px;color:var(--dim);transition:.35s}.chan li.hot{border-color:var(--sage);color:var(--ink);box-shadow:0 0 28px -8px var(--sage);transform:translateX(6px)}.chan li.hot i{color:var(--sage)}
.node{position:relative;z-index:2;width:170px;height:170px;border-radius:50%;display:grid;place-content:center;text-align:center;background:radial-gradient(circle at 35% 30%,#2a2a30,#111113);border:1px solid var(--line-2);margin:auto;transition:box-shadow .3s,border-color .3s}
.node b{font-weight:500;font-size:17px}.node small{color:var(--dim);font:11px inherit}
.node .pulse{position:absolute;inset:-1px;border-radius:50%;border:2px solid var(--sage);opacity:0}
.node.flash{border-color:var(--sage);box-shadow:0 0 60px -6px rgba(183,197,158,.7)}.node.flash .pulse{animation:np .9s ease-out}
@keyframes np{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.5)}}
.leads{position:relative;z-index:2;border:1px solid var(--line-2);border-radius:16px;background:var(--surface-2);padding:18px;min-height:340px;overflow:hidden}
.leads h6{font-size:13px;font-weight:500;margin-bottom:12px;color:var(--soft)}.leads h6 small{color:var(--dim);margin-left:6px}
.leads li{display:flex;justify-content:space-between;gap:10px;padding:12px;border-radius:10px;background:#1c1c20;border:1px solid var(--line);margin-bottom:8px;font-size:13.5px;animation:drop .7s cubic-bezier(.2,.9,.3,1.1)}
.leads li small{color:var(--dim);display:block;font-size:12px}.leads li span:last-child{color:var(--sage);font:11px inherit;align-self:center}
@keyframes drop{from{opacity:0;transform:translateY(-40px) scale(.96)}}

/* о студии */
.about{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(30px,6vw,90px);align-items:center}
.photo{aspect-ratio:4/5;border-radius:24px;padding:1.5px;background:linear-gradient(160deg,var(--ice),var(--sage),var(--amber));max-width:480px;width:100%}
.ph-in{height:100%;border-radius:23px;background:radial-gradient(400px 300px at 30% 20%,rgba(224,169,109,.18),transparent 70%),repeating-linear-gradient(135deg,#131316 0 14px,#101012 14px 28px);display:grid;place-content:center;text-align:center;gap:6px;color:var(--soft)}
.ph-in i{font-size:46px;color:var(--amber);justify-self:center}.ph-in small{color:var(--dim)}
.who{font-size:20px;margin-top:26px;color:var(--soft)}.who b{color:var(--ink);font-weight:600}
.nums{display:flex;gap:44px;margin:34px 0;flex-wrap:wrap}.nums>div{display:grid}.big-n{font-size:clamp(48px,6vw,84px);font-weight:300;letter-spacing:-.03em;line-height:1}.nums>div>span{color:var(--muted);font-size:14px;margin-top:6px}
.pts{display:grid;gap:12px;margin-bottom:34px}.pts li{display:flex;gap:12px;align-items:center;color:var(--soft)}.pts i{color:var(--sage);font-size:22px}

/* цены */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
.tab{padding:11px 20px;border-radius:99px;border:1px solid var(--line-2);background:transparent;font-size:14.5px;color:var(--soft);transition:.3s}.tab:hover{border-color:var(--soft)}.tab.on{background:var(--cta);color:#151518;border-color:var(--cta);font-weight:600}
.pstack{display:grid}.pstack>.pp{grid-area:1/1;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;opacity:0;visibility:hidden;transform:translateY(16px);transition:opacity .45s,transform .45s,visibility .45s}.pstack>.pp.on{opacity:1;visibility:visible;transform:none}
.pc{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:18px;background:var(--surface);overflow:hidden;transition:transform .35s,border-color .35s}
.pc:hover{transform:translateY(-6px);border-color:var(--line-2)}
.pc.rec{border-color:transparent;background:linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(160deg,var(--ice),var(--sage),var(--amber)) border-box;border:1.5px solid transparent}
.pc .rb{position:absolute;top:14px;right:14px;font-size:11px;padding:4px 10px;border-radius:99px;background:var(--sage);color:#10110e;font-weight:600;z-index:2}
.pc-art{height:130px;position:relative;overflow:hidden;background:radial-gradient(260px 160px at 80% 0,color-mix(in srgb,var(--c) 22%,transparent),transparent 70%),var(--surface-2);border-bottom:1px solid var(--line)}
.pc-art i{position:absolute;border:1px solid color-mix(in srgb,var(--c) 55%,transparent);border-radius:22%;width:90px;height:90px;right:calc(14px + var(--k)*34px);top:calc(20px + var(--k)*10px);background:color-mix(in srgb,var(--c) calc(var(--k)*5%),transparent);transition:transform .6s}
.pc:hover .pc-art i{transform:rotate(calc(var(--k)*12deg + 8deg)) translateY(-4px)}
.pc-art i:nth-child(1){--k:0}.pc-art i:nth-child(2){--k:1}.pc-art i:nth-child(3){--k:2}
.pc-b{padding:24px;display:flex;flex-direction:column;gap:14px;flex:1}
.pc h3{font-size:20px;font-weight:500;line-height:1.3;padding-right:60px}
.pc .pp-price{font-size:38px;font-weight:300;letter-spacing:-.02em;line-height:1}.pc .pp-price small{font-size:14px;color:var(--dim);margin-right:6px}
.pc .term{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:14px}.pc .term i{color:var(--c)}
.pc ul{display:grid;gap:9px;margin:4px 0 8px;flex:1}.pc li{display:flex;gap:10px;font-size:14px;color:var(--soft);line-height:1.5}.pc li i{color:var(--sage);margin-top:3px;flex:none}
.pc .btn{width:100%}

/* вопросы */
.faq-w{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(30px,6vw,90px);align-items:start}
.faq-w .sec-h{margin-bottom:34px}
.tg-card{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:22px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}.tg-card>i{font-size:34px;color:var(--ice)}.tg-card>div{flex:1;min-width:160px;display:grid}.tg-card span{color:var(--muted);font-size:14px}
.fq{border-bottom:1px solid var(--line)}.fq:first-child{border-top:1px solid var(--line)}
.fq button{all:unset;box-sizing:border-box;width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0;cursor:pointer;font-size:clamp(18px,1.6vw,22px);font-weight:400;letter-spacing:-.01em}
.fq button:focus-visible{outline:2px solid #dce4ba}
.fq button i{width:36px;height:36px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;font-size:16px;flex:none;transition:.4s}.fq.open button i{transform:rotate(45deg);background:var(--cta);color:#151518}
.fa{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s cubic-bezier(.2,.8,.2,1)}.fq.open .fa{grid-template-rows:1fr}.fa>div{overflow:hidden}.fa p{color:var(--muted);padding:0 56px 26px 0;font-size:16px}

/* финал */
.final{position:relative;padding-top:var(--sp);background:var(--bg);overflow:hidden;border-top:1px solid var(--line)}
#relief{position:absolute;left:0;right:0;bottom:0;width:100%;height:100%;opacity:.95}
.fin-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,6vw,90px);align-items:start;padding-bottom:var(--sp)}
.hd.big{font-size:clamp(36px,4.8vw,70px)}
.msgr{display:grid;gap:10px;margin-top:36px;max-width:420px}
.msg{display:flex;gap:16px;align-items:center;padding:14px 18px;border:1px solid var(--line-2);border-radius:14px;background:rgba(14,14,16,.7);backdrop-filter:blur(8px);transition:.3s}
.msg:hover{border-color:var(--sage);transform:translateX(6px)}.msg.wa:hover{border-color:#9fd3b0}
.msg>i{font-size:28px;color:var(--sage)}.msg.wa>i{color:#9fd3b0}.msg:first-child>i{color:var(--ice)}.msg span{display:grid;font-weight:500;line-height:1.3}.msg small{color:var(--muted);font-weight:400;font-size:13.5px}
.form{position:relative;padding:30px;border:1px solid var(--line-2);border-radius:22px;background:rgba(14,14,16,.82);backdrop-filter:blur(18px);display:grid;gap:18px;box-shadow:0 40px 90px -40px #000}
.f{display:grid;gap:8px;position:relative}.f>span{font-size:13px;color:var(--soft);font-weight:500}
.f input{width:100%;padding:15px 16px;border-radius:8px;border:1px solid var(--line-2);background:#0b0b0d;color:var(--ink);font:inherit;font-size:16px;transition:.25s}
.f input::placeholder{color:#767680}.f input:hover{border-color:var(--dim)}.f input:focus{outline:none;border-color:var(--sage);box-shadow:0 0 0 3px rgba(183,197,158,.18)}
.f.bad input{border-color:var(--amber)}.err{font-style:normal;font-size:13px;color:var(--amber);min-height:0;display:none}.f.bad .err,.chk.bad .err{display:flex;gap:6px;align-items:center}
.hp{position:absolute!important;left:-9999px;opacity:0}
.chk{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;font-size:13.5px;color:var(--muted);cursor:pointer;position:relative}
.chk input{position:absolute;opacity:0}.chk>i{width:22px;height:22px;border-radius:6px;border:1.5px solid var(--line-2);display:grid;place-items:center;font-size:14px;color:transparent;transition:.25s}.chk input:checked+i{background:var(--sage);border-color:var(--sage);color:#10110e}.chk input:focus-visible+i{outline:2px solid #dce4ba;outline-offset:2px}.chk.bad>i{border-color:var(--amber)}.chk.bad>span{color:var(--amber)}
.note{font-size:13px;color:var(--dim);text-align:center}
.res{display:none;padding:16px 18px;border-radius:12px;border:1px solid var(--amber);background:rgba(224,169,109,.1);color:var(--ink);font-size:15px;line-height:1.5}.res.show{display:flex;gap:12px;align-items:flex-start;animation:pop .4s}.res b{color:var(--amber);font-weight:600}
.btn.loading .bl::after{content:"…"}
.foot{position:relative;z-index:2;border-top:1px solid var(--line);background:linear-gradient(180deg,rgba(8,8,9,.5),rgba(8,8,9,.92))}
.foot-in{padding-top:46px;overflow:hidden}
.foot-top{display:grid;grid-template-columns:auto 1fr auto auto;gap:34px;align-items:center}
.foot nav{display:flex;gap:22px;flex-wrap:wrap;color:var(--soft);font-size:14.5px}.foot nav a:hover,.fc a:hover{color:var(--sage)}
.fc{display:grid;font-size:14.5px;color:var(--soft);text-align:right}
.up{display:inline-flex;gap:8px;align-items:center;padding:11px 18px;border:1px solid var(--line-2);border-radius:99px;font-size:14px;color:var(--soft);transition:.3s}.up:hover{border-color:var(--sage);color:var(--sage)}
.legal{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:34px;padding-top:22px;border-top:1px solid var(--line);font-size:13px;color:var(--dim)}.legal a{text-decoration:underline;text-underline-offset:3px}
.giant{font-size:clamp(70px,19.5vw,300px);font-weight:700;letter-spacing:-.05em;line-height:.9;text-align:center;margin-top:30px;margin-bottom:-.12em;color:transparent;-webkit-text-stroke:1px #35353b;background:linear-gradient(100deg,transparent 38%,rgba(240,239,241,.28) 50%,transparent 62%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;animation:sheen 7s linear infinite;user-select:none}
@keyframes sheen{from{background-position:120% 0}to{background-position:-120% 0}}

.msticky{position:fixed;left:0;right:0;bottom:0;z-index:50;display:none;gap:10px;padding:12px var(--g) calc(12px + env(safe-area-inset-bottom));background:linear-gradient(0deg,rgba(8,8,9,.95),rgba(8,8,9,.7));backdrop-filter:blur(10px);transform:translateY(130%);transition:transform .4s}
.msticky .btn{flex:1}.msticky.show{transform:none}

/* адаптив */
@media (max-width:1100px){
  :root{--g:28px}
  .menu{display:none}.burger{display:grid}.hdr-r .ico-btn,.hdr-r .btn{display:none}.hdr-in{padding:8px 8px 8px 18px}
  .steps{grid-template-columns:repeat(2,1fr);row-gap:44px}.steps .line{display:none}.step::before{display:none}
  .svc{grid-template-columns:1fr;padding:34px}.svc-v{min-height:320px}
  .about,.faq-w,.fin-grid{grid-template-columns:1fr}
  .photo{max-width:380px}
  .pstack>.pp{grid-template-columns:1fr 1fr}.pstack>.pp>.pc:last-child{grid-column:1/-1}
  .hero-bar{width:min(520px,60vw)}
  .foot-top{grid-template-columns:1fr 1fr}.fc{text-align:left}
}
@media (max-width:800px){
  :root{--g:16px}
  body{font-size:15.5px}
  .hero{display:block;min-height:0;padding:96px 0 0}
  .hero::before{background:radial-gradient(400px 360px at 50% 85%,rgba(143,179,232,.1),transparent 70%)}
  #stage{top:auto;bottom:70px;height:430px;inset:auto 0 70px 0}
  .hero-grid{padding-bottom:540px}
  .hl{white-space:normal}
  .h1{font-size:clamp(34px,10.4vw,48px)}
  .hero-cta .btn{flex:1;min-width:150px;padding:15px 16px}
  .offer{flex-direction:column;width:100%}.offer li+li{border-left:0;border-top:1px solid var(--line)}
  .hero-bar{left:var(--g);right:var(--g);width:auto;bottom:14px;grid-template-columns:auto 1fr auto auto;gap:10px}
  .hero-bar .cnt{order:0}.hint{display:none}
  .stage-fb{position:absolute;inset:auto 0 70px 0;width:auto;height:400px;right:auto;top:auto}
  .steps{grid-template-columns:1fr;position:relative;padding-left:26px;row-gap:34px;padding-top:0}.steps .line{display:block;top:0;bottom:0;left:0;right:auto;width:2px;height:auto}.line i{transform-origin:50% 0}
  .step::before{display:block;left:-31px;top:6px}
  .model-foot{padding:22px}.model-foot .btn{width:100%}
  .svc{position:relative;top:auto;padding:26px 20px;border-radius:24px;min-height:0;margin-bottom:20px}.svc .big{font-size:60px;right:16px;top:12px;opacity:.55}.svc-t h3{padding-right:56px}
  .svc-f .btn{flex:1}
  .mu-kan .cols{gap:6px}.col{padding:7px;min-height:230px}.kc{font-size:11px;padding:8px}
  .flow{grid-template-columns:1fr;padding:20px;gap:22px}.flow-svg{display:none}.chan{grid-template-columns:1fr 1fr}.chan li{padding:10px 12px;font-size:13px}.node{width:130px;height:130px}.node::before{content:"";position:absolute;top:-24px;left:50%;height:20px;border-left:2px dashed var(--line-2)}.node::after{content:"";position:absolute;bottom:-24px;left:50%;height:20px;border-left:2px dashed var(--line-2)}.leads{min-height:280px}
  .pstack>.pp{grid-template-columns:1fr}.pstack>.pp>.pc:last-child{grid-column:auto}
  .fa p{padding-right:0}
  .form{padding:22px 18px}
  .foot-top{grid-template-columns:1fr}.legal{flex-direction:column}
  .msticky{display:flex}
  .nums{gap:30px}
}
@media (max-width:420px){.hero-bar .cname span{font-size:15px}.tab{padding:10px 14px;font-size:14px}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv,.js .hd .li{opacity:1;transform:none}.js .scrib path{stroke-dashoffset:0}.grain{display:none}
}

/* ===== круг 2: против «нейросетевого» вида ===== */
:root{--paper:#ece8df;--ink-d:#151518;--sh:0 1px 2px rgba(0,0,0,.5),0 10px 24px -6px rgba(0,0,0,.55),0 36px 70px -24px rgba(0,0,0,.75)}
.mono{font-variant-numeric:tabular-nums;letter-spacing:.08em}
.warm{background:#141210}
.acc{font-family:inherit;font-style:normal;font-weight:300;font-size:1em;background:none;-webkit-text-fill-color:currentColor;color:var(--dim);padding:0}
.acc.g,.swap em{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500}
.acc.g{font-size:1.08em;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;padding-right:.1em}
.btn-main:hover{background:#fff;box-shadow:0 10px 24px -10px rgba(0,0,0,.8)}
.hero::before{background:radial-gradient(900px 600px at 76% 62%,rgba(255,255,255,.045),transparent 70%)}
.dots button.on::after{background:var(--ink)}
/* заголовки-вариации */
.sec-h.split{display:flex;justify-content:space-between;align-items:flex-end;gap:12px 48px;flex-wrap:wrap;max-width:none}.sec-h.split .sub{margin:0;max-width:360px;font-size:15.5px}
.sec-h.narrow{max-width:700px}
/* появления */
.js [data-rv]{transition:opacity 1s cubic-bezier(.2,.8,.2,1),transform 1s cubic-bezier(.2,.8,.2,1),clip-path 1.1s cubic-bezier(.7,0,.2,1)}
.js [data-rv=wipe]{clip-path:inset(0 100% 0 0)}.js [data-rv=wipe].in{clip-path:inset(0 -40px -60px 0)}
.js [data-rv=left]{opacity:0;transform:translateX(-64px)}.js [data-rv=left].in{opacity:1;transform:none}
.js .step:nth-of-type(2){transition-delay:.1s}.js .step:nth-of-type(3){transition-delay:.2s}.js .step:nth-of-type(4){transition-delay:.3s}
.js .rv{opacity:1;transform:none}
.par,[data-par],[data-parx],[data-mouse]{translate:calc(var(--px,0px) + var(--mx,0px)) calc(var(--py,0px) + var(--my,0px))}
/* убрать свечения */
.line i{box-shadow:none;background:var(--sage)}.step.dot::before{box-shadow:none}
.chan li.hot{box-shadow:none}.flow-svg path.hot{filter:none}.kc.hot{box-shadow:none}.g-t{box-shadow:0 8px 14px -4px #000}
.step-art{box-shadow:var(--sh);background:#1a1816}
.tag{background:#2a2218}
/* услуги */
.svc{background:var(--surface);box-shadow:var(--sh)}
.svc .big,.svc .geo{display:none}
.svc-t .kick{color:var(--soft)}
.slab{position:absolute;inset:6% 2% 0 16%;border-radius:20px;background:color-mix(in srgb,var(--c) 26%,#17171a);z-index:0}
.svc-v{min-height:400px}
.mu-site{max-width:520px;border:0;border-radius:10px;background:#000;box-shadow:var(--sh);z-index:1;margin-right:40px}
.mu-site .bar{background:#1c1c1f;border:0}
.mu-site .pgr{height:auto}.mu-site .cs{border-radius:0;font-size:11.5px}
.mu-site .cs .m-hero{padding:1em 1.4em 1.4em}.mu-site .cs .m-hero h4{font-size:2.6em}.mu-site .cs .m-menu{margin-bottom:1.2em}
.mu-site .toast{position:absolute;left:14px;top:56px;background:#151518;color:#fff;font-weight:600;font-size:13px;padding:9px 14px;border-radius:8px;opacity:0;box-shadow:var(--sh);animation:ts 8s infinite}
@keyframes ts{0%,66%{opacity:0;transform:translateY(-6px)}72%,92%{opacity:1;transform:none}100%{opacity:0}}
.mu-site .m-btn{animation:bt2 8s infinite}@keyframes bt2{0%,60%,76%,100%{transform:scale(1)}66%{transform:scale(.92)}}
.mu-site .cur{left:0;top:0;animation:cu2 8s infinite;z-index:3}
@keyframes cu2{0%{transform:translate(70%,360px)}8%{transform:translate(70%,360px)}58%,68%{transform:translate(var(--tx,400px),var(--ty,24px))}82%,100%{transform:translate(70%,360px)}}
.phone-front{position:absolute;right:-6px;bottom:-14px;width:210px;background:var(--paper);color:var(--ink-d);border-radius:22px;padding:12px 14px 14px;box-shadow:var(--sh);z-index:4;font-size:13px;line-height:1.4;animation:pfn 8s infinite;animation-play-state:paused}
.svc:has(.mu-site.on) .phone-front{animation-play-state:running}
@keyframes pfn{0%,68%{opacity:.0;transform:translateY(24px) scale(.96)}74%,94%{opacity:1;transform:none}100%{opacity:0}}
.pf-h{display:flex;align-items:center;gap:7px;font-size:12px;color:#55524b;margin-bottom:8px}.pf-h i{color:#2a7fd0;font-size:18px}.pf-h small{margin-left:auto}
.pf-b b{display:block;font-size:14px}.pf-b small{display:block;color:#7a766d;font-size:11px;margin-top:6px}
.mu-chat,.mu-kan,.mu-chk{box-shadow:var(--sh);border:0}
.msg-b.b{background:#26262b}
.phone{box-shadow:var(--sh)}
/* портфолио: сплошные названия */
/* сравнение: плотная таблица */
/* ноль */
.zero{position:relative;padding:var(--sp) 0;overflow:hidden;display:flex;align-items:center}
.zero-n{position:absolute;right:-4vw;top:50%;margin-top:-.52em;font-size:clamp(200px,32vw,520px);line-height:1;font-weight:700;letter-spacing:-.06em;color:var(--ink);white-space:nowrap;user-select:none;pointer-events:none}
.zero .wrap{position:relative;z-index:2}
.paper{max-width:420px;background:var(--paper);color:var(--ink-d);padding:28px 30px;border-radius:6px;box-shadow:var(--sh);display:grid;gap:14px;justify-items:start}
.paper .pl{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:#6a665c;font-weight:600}
.paper p:not(.pl){font-size:19px;line-height:1.5;font-weight:500}
.paper .btn-main{background:var(--ink-d);color:#fff}
/* путь клиента */
.flow{border:0;background:none;padding:0;border-radius:0}
.chan li{background:#1a1a1d;border-color:#2a2a2e;box-shadow:0 8px 18px -10px #000}
.node{box-shadow:var(--sh)}
.leads{background:var(--paper);border:0;border-radius:6px;box-shadow:var(--sh);color:var(--ink-d);transform:rotate(1.2deg)}
.leads h6{color:#55524b}.leads li{background:#fff;border-color:#e0dbd0;color:var(--ink-d)}.leads li small{color:#7a766d}.leads li span:last-child{color:#2f6f45}
/* о студии */
.about{grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px)}
.photo-w{position:relative;margin-left:calc(-1*var(--g) - max(0px,(100vw - 1312px)/2))}
.photo{padding:0;background:none;max-width:none;aspect-ratio:4/5;border-radius:0 28px 28px 0;overflow:hidden;box-shadow:var(--sh)}.ph-in{border-radius:0}
.bubble{position:absolute;right:-8%;bottom:9%;width:min(290px,70%);background:var(--paper);color:var(--ink-d);padding:16px 18px;border-radius:16px 16px 16px 4px;box-shadow:var(--sh);font-size:15px;line-height:1.45;z-index:2}
.bubble b{display:block;margin-bottom:3px}.bubble small{display:block;margin-top:8px;color:#7a766d;font-size:12px}
/* цены */
.pc{border-radius:8px;box-shadow:var(--sh);border-color:#222}
.pc.rec{background:#1a1816;border:1.5px solid var(--ink)}
.pc:hover{transform:translateY(-4px)}
.pc-art{height:156px;padding:14px;background:#1d1c1a;display:flex;flex-direction:column;justify-content:center;gap:6px;border-bottom:0}
.pc-art img{width:100%;height:100%;object-fit:cover;border-radius:6px;box-shadow:0 10px 20px -8px #000}
.pa-m{display:block;max-width:82%;padding:8px 12px;border-radius:12px;font-size:12.5px;line-height:1.35;background:#2a2a2e}.pa-m.me{margin-left:auto;background:var(--cta);color:#151518}
.pa-r{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;padding:9px 11px;background:#2a2826;border-radius:6px}.pa-r b{font-weight:600;color:var(--sage)}
.pa-a{background:var(--paper);color:var(--ink-d);border-radius:12px;padding:12px 14px;font-size:13px;line-height:1.4;box-shadow:0 10px 20px -8px #000}.pa-a b{display:block;font-size:15px}
.tg-card{border-radius:4px;box-shadow:var(--sh);border:0;background:#17171a}
.form{border-radius:10px;box-shadow:var(--sh)}
@media (max-width:1100px){.about{grid-template-columns:1fr}.photo-w{margin-left:calc(-1*var(--g));max-width:520px}.bubble{right:4%}.step:nth-of-type(even) .step-art{margin-top:0}}
@media (max-width:800px){.zero-n{font-size:62vw;right:-6vw;top:34%}.svc-v{min-height:380px}.mu-site{margin-right:0}.phone-front{right:0;width:180px}.leads{transform:none}}
.svc-t h3,.hd{text-wrap:balance}.zero-n{right:-1vw}
.about-t .sub{margin-bottom:26px}.pc .rb{top:170px}

/* ===== портфолио: экран с живым сайтом ===== */
.pf{display:grid;grid-template-columns:320px 1fr;gap:clamp(24px,4vw,56px);align-items:start;margin-bottom:34px}
.pf-list{display:grid}
.pr{all:unset;box-sizing:border-box;position:relative;display:grid;gap:3px;width:100%;padding:15px 4px 17px;border-bottom:1px solid #222;cursor:pointer;opacity:.5;transition:opacity .3s,padding .3s}
.pr:hover{opacity:.85}.pr.on{opacity:1;padding-left:16px}
.pr:focus-visible{outline:2px solid #dce4ba;outline-offset:2px}
.pn{font-size:32px;line-height:1.1;color:var(--nc)}
.pk{font-size:13.5px;color:var(--muted)}
.tm{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--nc)}
.pr.run .tm{animation:pftm 6s linear forwards}
.pf:hover .tm,.pf.off .tm{animation-play-state:paused}
@keyframes pftm{to{width:100%}}
.pf-stage{position:relative;padding-bottom:26px}
.pf-screen{border-radius:12px;overflow:hidden;background:#000;box-shadow:var(--sh)}
.pf-bar{display:flex;gap:6px;align-items:center;padding:10px 14px;background:#1c1c1f}.pf-bar i{width:9px;height:9px;border-radius:50%;background:#3b3b3f}.pf-bar span{margin-left:10px;font-size:12px;color:var(--dim)}.pf-bar em{margin-left:auto;font-style:normal;font-size:11px;color:var(--amber)}
.pf-view{position:relative;height:500px;overflow:hidden}
.pf-slide{position:absolute;inset:0;overflow:hidden;visibility:hidden;clip-path:inset(0 0 0 100%);transition:clip-path .8s cubic-bezier(.7,0,.2,1)}
.pf-slide.on{visibility:visible}
.pf-slide .cs{border-radius:0;min-height:100%}
.pf-slide.on .cs{animation:pfs 18s ease-in-out 1s infinite alternate}
@keyframes pfs{to{transform:translateY(var(--sc,0px))}}
.pf-card{position:absolute;right:-18px;bottom:0;width:290px;background:var(--paper);color:var(--ink-d);padding:18px 20px 20px;border-radius:6px;box-shadow:var(--sh);display:grid;gap:8px;animation:cardIn .6s cubic-bezier(.2,.8,.2,1)}
@keyframes cardIn{from{opacity:0;transform:translateX(30px)}}
.pf-card h4{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#6a665c;font-weight:600}
.pf-card p{font-size:14.5px;line-height:1.45}
.pf-card ul{display:grid;gap:5px;font-size:13.5px;line-height:1.4;color:#33312c;padding-left:16px;list-style:disc}
.pf-card .btn{background:var(--ink-d);color:#fff;margin-top:6px;justify-self:start}
@media (max-width:1100px){.pf{grid-template-columns:240px 1fr}.pn{font-size:26px}.pf-card{right:0;width:250px}}
@media (max-width:800px){
  .pf{grid-template-columns:1fr;gap:16px}
  .pf-stage{order:1;padding-bottom:0}.pf-list{order:2;display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
  .pf-list li{flex:none}.pr{opacity:.7;border:1px solid #2a2a2e;border-radius:99px;padding:10px 18px;width:auto;overflow:hidden}.pr.on{padding-left:18px;border-color:var(--nc)}.pn{font-size:20px}.pk{display:none}
  .pf-view{height:400px}.pf-card{position:static;width:auto;margin-top:14px;animation:none}
}

/* ===== сравнение ===== */
.cmp{position:relative}
.cmp-seg{display:none}
.cmp-grid{position:relative;display:grid;grid-template-columns:minmax(150px,1.1fr) 1.2fr 1.2fr 1.5fr;grid-template-rows:repeat(10,auto);padding:26px 0}
.cmp-card{position:absolute;grid-column:4;grid-row:1/-1;top:-26px;bottom:-26px;left:0;right:0;border-radius:18px;background:linear-gradient(165deg,#2b3022 0%,#302b20 55%,#3d2d19 100%);box-shadow:0 2px 3px rgba(0,0,0,.4),0 24px 50px -12px rgba(0,0,0,.75),0 60px 90px -40px rgba(0,0,0,.8);z-index:0}
.cmp-grid>div{position:relative;z-index:1;display:flex;align-items:center;gap:12px;padding:15px 20px;border-bottom:1px solid #1d1d20;font-size:14.5px;line-height:1.35;transition:background .25s,transform .25s}
.cmp-grid>.cmp-card{position:absolute;padding:0;border:0;display:block}
.cmp-grid>.l{color:var(--ink);font-weight:500;padding-left:4px}.l i{color:var(--dim);font-size:19px}
.cmp-grid>.c{color:#74747c}
.cmp-grid>.h{color:#c9c7cd;border-bottom-color:#2a2a2e}
.cmp-grid>.hh{padding-top:24px;padding-bottom:22px;border-bottom-color:rgba(255,255,255,.12);flex-wrap:wrap;gap:10px}
.cmp-grid>.hf{color:#f4f1e8;border-bottom-color:rgba(255,255,255,.08);padding-inline:26px}
.cmp-grid>.h.hdr{font-size:13px;letter-spacing:.04em;text-transform:uppercase;font-weight:600}
.hh .logo{font-size:21px}.pill{font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:99px;background:var(--sage);color:#10110e}
.cmp-grid>.hov:not(.hf){background:rgba(255,255,255,.045)}
.cmp-grid>.hf.hov{background:rgba(255,255,255,.07);transform:translateY(-2px)}
.ic{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:14px}
.ic.ok{background:#4f7a3f;color:#fff}.ic.mid{background:conic-gradient(from 90deg,#d9a35c 0 50%,transparent 0);border:2px solid #d9a35c}.ic.no{background:#8c4a42;color:#fff;font-size:12px}
.hf .ic{transition:transform .4s cubic-bezier(.3,1.6,.5,1),opacity .3s}
.js .hf:not(.lit) .ic{transform:scale(0);opacity:0}.js .hf:not(.lit){color:#a09d92}
.cmp-grid>.ft{flex-direction:column;align-items:stretch;border-bottom:0;padding-top:20px;padding-bottom:26px;gap:12px}
.cmp-count{display:grid;gap:6px;font-size:12.5px;color:#c9c5b6}.cmp-count i{display:block;height:3px;border-radius:3px;background:rgba(255,255,255,.14);overflow:hidden}.cmp-count i b{display:block;height:100%;width:0;background:var(--sage);transition:width .4s}
.cmp-grid .btn-main{width:100%}
.cmp-grid>.ft0{border-bottom:0}
@media (max-width:800px){
  .cmp-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;border-radius:99px;background:#17171a;margin-bottom:16px}
  .cmp-seg button{border:0;background:none;color:var(--muted);padding:10px 4px;border-radius:99px;font-size:13px;font-weight:500}.cmp-seg button.on{background:var(--cta);color:#151518}
  .cmp-grid{grid-template-columns:1fr 1.3fr;grid-template-rows:none;padding:0}.cmp-grid>.cmp-card{display:none}
  .cmp-grid>.c,.cmp-grid>.hf,.cmp-grid>.hh,.cmp-grid>.ft,.cmp-grid>.ft0{display:none}
  .cmp[data-sel="1"] .c1,.cmp[data-sel="2"] .c2,.cmp[data-sel="3"] .hf,.cmp[data-sel="3"] .ft,.cmp[data-sel="3"] .hh{display:flex}
  .cmp[data-sel="3"] .ft{grid-column:1/-1}.cmp[data-sel="3"] .hf{background:linear-gradient(165deg,#2b3022,#3d2d19)}
  .cmp-grid>.hh.lab,.cmp-grid>.h.hdr{display:none}.cmp[data-sel="3"] .hh.hf{grid-column:1/-1}
  .cmp[data-sel] .c{color:#a8a8b0}
  .cmp-grid>div{padding:14px 12px}
  .js .hf:not(.lit) .ic{transform:none;opacity:1}
}

/* ===== шаги: одна высота, крупные иллюстрации ===== */
.steps{align-items:stretch}
.step{display:flex;flex-direction:column}.step-art{flex:none}
.sa{width:84%;background:#f2efe8;color:#151518;border-radius:8px;box-shadow:0 18px 34px -12px #000;font-size:13px;line-height:1.4;overflow:hidden}
.sa h6{font-size:17px;font-weight:600;letter-spacing:-.01em}.sa small{font-size:11px;color:#7a766d;font-weight:400}
.ex{position:absolute;left:14px;bottom:10px;font-size:11px;color:var(--dim)}
.sa-bar{display:flex;gap:5px;padding:8px 10px;background:#e0dbd0}.sa-bar i{width:7px;height:7px;border-radius:50%;background:#b9b3a6}
.s1b{padding:12px 16px 16px;display:grid;gap:5px;justify-items:start}.s1n{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#6a665c}
.s1b h6{font-size:20px;line-height:1.15}.s1b p{color:#55524b}
.sbtn{background:#151518;color:#fff;font-weight:600;font-size:12px;padding:7px 13px;border-radius:4px;margin:4px 0}
.s1c{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}.s1c em{font-style:normal;font-weight:600;background:#fff;border-radius:6px;padding:8px 10px;display:grid}
.s1b>*{animation:up 8s infinite}.s1b>*:nth-child(2){animation-delay:.25s}.s1b>*:nth-child(3){animation-delay:.5s}.s1b>*:nth-child(4){animation-delay:.75s}.s1b>*:nth-child(5){animation-delay:1s}
@keyframes up{0%{opacity:0;transform:translateY(8px)}10%,90%{opacity:1;transform:none}100%{opacity:0}}
.s2{padding:16px 18px;display:grid;gap:10px}.s2 h6{display:flex;justify-content:space-between;align-items:baseline}
.s2 ul{display:grid;gap:8px}.s2 li{display:flex;gap:10px;align-items:center}
.s2 li::before{content:"";width:16px;height:16px;border-radius:4px;border:1.5px solid #9d978a;flex:none;background:center/10px no-repeat;animation:ck 8s infinite}
.s2 li:nth-child(2)::before{animation-delay:.6s}.s2 li:nth-child(3)::before{animation-delay:1.2s}.s2 li:nth-child(4)::before{animation-delay:1.8s}
@keyframes ck{0%,8%{background-color:transparent;border-color:#9d978a;background-image:none}14%,90%{background-color:#4f7a3f;border-color:#4f7a3f;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2 6.5l2.6 2.5L10 3.5' stroke='white' stroke-width='2' fill='none' stroke-linecap='round'/></svg>")}100%{background-color:transparent;background-image:none}}
.sum{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid #d6d0c4;padding-top:10px}.sum b{font-size:20px}
.s3{padding:14px;display:grid;gap:10px}
.s3 .st{display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:500}
.s3 .st b{display:inline-flex;gap:4px;align-items:center;font-size:12px;background:#4f7a3f;color:#fff;padding:3px 10px;border-radius:99px;animation:acc 8s infinite}
.inv{background:#151518;color:#f0eff1;border-radius:6px;padding:12px 14px;display:grid;gap:8px;animation:inv 8s infinite}
.inv-h{display:flex;gap:8px;align-items:center;font-size:12.5px}.inv-h small{margin-left:auto;color:#9a9aa2}.inv-h i{color:var(--amber);font-size:18px}
.inv-s{display:flex;justify-content:space-between;align-items:baseline}.inv-s span{color:#a4a4aa}.inv-s b{font-size:22px;font-weight:600}
.inv-b{background:var(--amber);color:#1d1408;font-weight:700;text-align:center;border-radius:4px;padding:8px}
@keyframes acc{0%,10%{opacity:0;transform:scale(.7)}18%,92%{opacity:1;transform:none}100%{opacity:0}}@keyframes inv{0%,24%{opacity:0;transform:translateY(14px)}38%,92%{opacity:1;transform:none}100%{opacity:0}}
.s4{background:#151518;color:#f0eff1;padding:14px;display:grid;gap:12px;box-shadow:0 18px 34px -12px #000,0 0 0 1px #2a2a2e}
.s4 .url{display:flex;gap:8px;align-items:center;padding:9px 12px;border-radius:99px;background:#232327;font-size:14px}.s4 .url i{color:var(--sage);font-size:16px}
.s4 .pub{display:flex;gap:8px;align-items:center;color:var(--sage)}.s4 .pub i{width:8px;height:8px;border-radius:50%;background:var(--sage)}
.s4 .key{display:flex;gap:12px;align-items:center;padding:11px 12px;border-radius:8px;background:#f2efe8;color:#151518;animation:up 8s infinite;animation-delay:.8s}.s4 .key i{font-size:24px;color:#a8742f}.s4 .key span{display:grid;line-height:1.3;font-weight:600}.s4 .key small{font-weight:400}
.s4 .url,.s4 .pub{animation:up 8s infinite}.s4 .pub{animation-delay:.4s}

/* ===== полировка ===== */
.hero{padding-bottom:clamp(100px,12vw,130px)}
.btn-main{box-shadow:0 0 0 1px rgba(255,255,255,.35),0 14px 30px -12px rgba(0,0,0,.9)}
.hero-cta{margin-bottom:18px}.offer{margin-bottom:26px}
.micro{font-size:13.5px;color:var(--muted);margin-top:-2px;pointer-events:auto}.micro a{color:var(--ink);border-bottom:1px solid var(--line-2)}.micro a:hover{border-color:var(--sage)}
.lead{margin:26px 0 24px}
.paper{max-width:480px}
.free{display:grid;gap:10px}.free li{display:flex;gap:10px;align-items:center;font-size:15px;color:#33312c}.free i{font-size:22px;color:#4f7a3f;flex:none}
.photo .ph-in{background:radial-gradient(circle at 50% 46%,#2a261f 0 26%,transparent 26.3%),radial-gradient(circle at 50% 46%,#1d1b17 0 44%,transparent 44.3%),#141412;gap:4px;align-content:center}
.mono-e{font-size:clamp(120px,16vw,220px);line-height:1;font-weight:300;color:#6e6759;letter-spacing:-.04em;justify-self:center;margin-bottom:14px}
.ph-in span{font-size:15px;color:var(--soft)}
.leads{min-height:0;align-self:center}
.leads li{align-items:center}.leads li b{font-weight:600;display:block}.leads li span:last-child{text-align:right;font-size:12px;font-weight:600;color:#6a665c}.leads li span:last-child small{display:block;font-weight:400;color:#8a857a;font-size:11.5px}.leads li span.new{color:#2f6f45}
.ft0.l{grid-column:1/4;align-items:flex-end}.note-in{font-size:12.5px;color:var(--dim)}
.cmp-note{display:none}
@media (max-width:800px){.cmp-note{display:block}}
@media (max-width:1180px){
  .hero{display:block;min-height:0;padding:96px 0 0}
  #stage{top:auto;bottom:70px;height:520px;inset:auto 0 70px 0}
  .hero-grid{padding-bottom:620px}
  .hero-txt{max-width:640px}.hl{white-space:normal}.h1{font-size:clamp(36px,6vw,56px)}
  .hero-bar{left:var(--g);right:var(--g);width:auto;bottom:14px;grid-template-columns:auto auto 1fr auto}
  .hint{display:none}
  .stage-fb{position:absolute;inset:auto 0 70px 0;width:auto;height:480px;right:auto;top:auto}
}
@media (max-width:800px){#stage{height:430px}.hero-grid{padding-bottom:540px}.h1{font-size:clamp(34px,10.4vw,48px)}}
.s1b{padding:12px 16px 14px}.s1b h6{font-size:18px}.ex{left:auto;right:14px}
@media (max-width:1180px){#stage{-webkit-mask-image:linear-gradient(transparent,#000 14%,#000 84%,transparent);mask-image:linear-gradient(transparent,#000 14%,#000 84%,transparent)}}

/* лёгкость: бесконечные циклы только на экране */
.giant{animation-play-state:paused}.final.vis .giant{animation-play-state:running}
.pf.off .cs,.pf.off .cs *{animation-play-state:paused!important}

/* ===== первый экран: читаемость ===== */
.hero-txt::before{content:"";position:absolute;z-index:-1;inset:-70px -140px -70px -90px;background:radial-gradient(ellipse at 38% 50%,rgba(8,8,9,.88) 0,rgba(8,8,9,.7) 38%,rgba(8,8,9,0) 72%);pointer-events:none}
.eyebrow{color:#c0c0c8}
.swap em{font-weight:600;background:linear-gradient(90deg,#f3ffd9,#ffd9a3);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.lead{color:#dcdce2;font-size:clamp(17px,1.4vw,20px);line-height:1.75}
.offer{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.22)}
.offer li{color:#ececf0;font-size:14px}.offer li+li{border-left-color:rgba(255,255,255,.18)}
.micro{color:#cacad1;font-size:14px}.micro a{border-bottom-color:rgba(255,255,255,.5)}
.btn-ghost{border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.06);color:#fff}
.btn-ghost:hover{border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.13)}
.cname small{font-size:12px;color:#b0b0b8}.hint{color:#a8a8b0;font-size:12.5px}.hero-bar .cnt{color:#b0b0b8}

/* ===== Этап 1 · типографика =====
   Смена пары шрифтов = замена двух переменных ниже (варианты — fonts.html).
   Ширину H1 подгоняет app.js (fitH1), отдельно настраивать размер не нужно. */
:root{--font-display:'Unbounded',system-ui,sans-serif;--font-text:'Onest',system-ui,sans-serif}
body{font-family:var(--font-text);font-synthesis:none}
.h1,.hd,.big-n,.giant,.zero-n,.logo,.mnav nav a,.svc-t h3,.price,.pp-price,.mono-e,.hero-bar .cnt b{font-family:var(--font-display)}
.h1{font-size:calc(clamp(40px,3.8vw,62px)*var(--fit,1));letter-spacing:-.025em;line-height:1.1}
.hd{letter-spacing:-.025em;line-height:1.1}
.swap em,.acc.g{font-family:var(--font-display);font-style:normal;font-weight:600;font-size:1em;padding-right:.02em}
.acc.g{background:linear-gradient(90deg,#dfe9c6,#f0c48e);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
@media (max-width:1180px){.h1{font-size:calc(clamp(36px,6vw,56px)*var(--fit,1))}}
@media (max-width:800px){.h1{font-size:calc(clamp(32px,9.6vw,46px)*var(--fit,1))}}

/* ===== Этап 1 · шапка-капсула ===== */
.hdr{padding:14px var(--g);pointer-events:none;transition:none}
.hdr.hide{transform:none}
.hdr-in{pointer-events:auto;position:relative;max-width:1240px;gap:14px;padding:7px 7px 7px 22px;border-radius:99px;background:rgba(16,16,19,.38);border:1px solid rgba(255,255,255,.09);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 1px 0 rgba(255,255,255,.05) inset;transition:max-width .7s cubic-bezier(.3,.8,.2,1),padding .5s,background .4s,box-shadow .4s,border-color .4s}
.hdr.glass .hdr-in{max-width:980px;padding:5px 5px 5px 20px;background:rgba(13,13,15,.84);border-color:rgba(255,255,255,.1);box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 18px 40px -18px rgba(0,0,0,.9)}
.logo{font-size:18px;font-weight:600;letter-spacing:-.03em;white-space:nowrap}
.menu{position:relative;gap:0;padding:4px;border-radius:99px}
.menu a{position:relative;z-index:1;padding:8px 15px;font-size:14px;color:#b4b4bc;transition:color .3s}
.menu a.on,.menu a:hover{background:none;color:var(--ink)}
.menu-ind{position:absolute;z-index:0;top:4px;bottom:4px;left:0;right:100%;border-radius:99px;background:rgba(255,255,255,.085);box-shadow:0 0 0 1px rgba(255,255,255,.07) inset;opacity:0;transition:left .45s cubic-bezier(.3,1.25,.4,1),right .45s cubic-bezier(.3,1.25,.4,1),opacity .3s}
.menu-ind.vis{opacity:1}
.hdr-prog{position:absolute;left:24px;right:24px;bottom:-1px;height:1px;border-radius:2px;background:rgba(239,233,220,.48);transform-origin:left;transform:scaleX(var(--p,0));opacity:.72;pointer-events:none}
.hdr-r{gap:6px}
.hdr .ico-btn{width:38px;height:38px;font-size:18px;border-color:transparent;background:rgba(255,255,255,.05)}
.hdr .ico-btn:hover{color:#10110e}
.snd{width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.05);color:var(--soft);display:grid;place-items:center;font-size:17px;transition:.25s;flex:none;position:relative}
.snd:hover{background:rgba(255,255,255,.1);color:var(--ink)}
.snd[aria-pressed=false]{color:#7c7c84}
.snd .bars{display:flex;gap:2px;align-items:flex-end;height:14px}
.snd .bars i{width:2px;border-radius:1px;background:currentColor;height:4px;transition:height .3s}
.snd[aria-pressed=true] .bars i:nth-child(1){height:7px}.snd[aria-pressed=true] .bars i:nth-child(2){height:13px}.snd[aria-pressed=true] .bars i:nth-child(3){height:9px}.snd[aria-pressed=true] .bars i:nth-child(4){height:5px}
.header-sound i{font-size:18px}.header-sound .sound-on{display:none}.header-sound[aria-pressed=true] .sound-on{display:block}.header-sound[aria-pressed=true] .sound-off{display:none}
.hdr .btn-main{border-radius:99px;padding:11px 20px}
/* главная кнопка: живой свет по контуру (только transform — дешево для CPU) */
.btn-live{position:relative;isolation:isolate;overflow:hidden;background:transparent!important}
.btn-live::before{content:"";position:absolute;z-index:-2;left:50%;top:50%;width:260px;height:260px;margin:-130px 0 0 -130px;background:conic-gradient(from 0deg,rgba(255,255,255,.25) 0 62%,#8fb3e8 72%,#fff 78%,#e0a96d 86%,rgba(255,255,255,.25) 96%);animation:live 4.2s linear infinite}
.btn-live::after{content:"";position:absolute;z-index:-1;inset:1.5px;border-radius:inherit;background:var(--cta);transition:background .25s}
.btn-live:hover::after{background:#fff}.btn-live:hover::before{animation-duration:1.6s}
@keyframes live{to{transform:rotate(1turn)}}
.hdr-cur{display:none}
.mnav nav a{font-family:var(--font-display);display:flex;align-items:baseline;gap:14px;font-size:clamp(30px,8.4vw,40px);opacity:0;transform:translateY(18px);transition:opacity .45s,transform .55s cubic-bezier(.2,.8,.2,1),color .3s;color:#cfcfd5}
.mnav nav a small{font-family:var(--font-text);font-size:12px;color:var(--dim);letter-spacing:.08em;min-width:22px}
.mnav nav a.on{color:var(--ink)}.mnav nav a.on small{color:var(--amber)}
.mnav.open nav a{opacity:1;transform:none}
.mnav.open nav a:nth-child(2){transition-delay:.04s}.mnav.open nav a:nth-child(3){transition-delay:.08s}.mnav.open nav a:nth-child(4){transition-delay:.12s}.mnav.open nav a:nth-child(5){transition-delay:.16s}
@media (max-width:1100px){
  .hdr{padding:10px 12px}
  .hdr-in,.hdr.glass .hdr-in{max-width:none;padding:5px 5px 5px 18px}
  .hdr-r .snd{display:grid}.hdr-r .ico-btn[data-messenger=telegram]{display:grid}
  .hdr-cur{display:block;flex:1;min-width:0;font-size:13px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .3s}
  .hdr-cur::before{content:"/ ";color:#55555c}
  .burger{width:38px;height:38px;font-size:19px;border:0;background:var(--cta);color:#151518}
  .hdr-prog{left:20px;right:20px}
}
@media (max-width:380px){.hdr-r .ico-btn[data-messenger=telegram]{display:none}}
@media (prefers-reduced-motion:reduce){.btn-live::before{animation:none}.menu-ind{transition:opacity .3s}}

/* ===== Этап 1 · фон плавно меняет тон по скроллу ===== */
body{transition:none}
.warm,.final,.marq{background:transparent}
.final{border-top-color:transparent}

/* ===== Этап 1 · тонкая лента сфер ===== */
.marq{position:relative;padding:8px 0;border-block:1px solid rgba(255,255,255,.06)}
.marq-t{font-size:15px;font-weight:400;letter-spacing:0;align-items:center;font-family:var(--font-display)}
.mq{display:flex;align-items:center;gap:12px;padding:0 22px 0 0;color:#c9c9cf;perspective:300px}
.mq .th{display:block;width:54px;height:34px;border-radius:5px;overflow:hidden;transform:rotateY(-24deg) rotateX(6deg);box-shadow:-6px 8px 14px -6px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.12);background:#1a1a1d;flex:none}
.mq .th img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.mq:nth-child(even) .th{transform:rotateY(22deg) rotateX(-4deg)}
.mq b{font-weight:400;white-space:nowrap}
.mq i{width:4px;height:4px;border-radius:50%;background:#55555c;margin-left:10px;flex:none}
.marq-l{position:absolute;z-index:2;left:0;top:0;bottom:0;display:flex;align-items:center;padding:0 90px 0 var(--g);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);background:linear-gradient(90deg,var(--tone,#080809) 58%,transparent);pointer-events:none}
@media (max-width:800px){.marq{padding:9px 0}.mq .th{width:50px;height:31px}.marq-t{font-size:14px}.marq-l{display:none}}
.hdr-cur:empty::before{content:none}
@media (max-width:800px){.h1{font-size:calc(clamp(30px,8.6vw,42px)*var(--fit,1))}}
@media (min-width:1181px){#top .h1{max-width:640px}}

/* ===== Этап 2 · первый экран: слово-табло, стеклянная подложка, пульт на столе ===== */
/* слово сферы: сплошной тёплый цвет (градиент ломается на анимируемых буквах), буквы катятся по одной */
.swap{position:relative}
.swap em{background:none;-webkit-text-fill-color:currentColor;color:#efd8b2;position:relative;white-space:nowrap}
.swap .sl{display:inline-block}
.swap .sw-o{position:absolute;left:0;top:0;white-space:nowrap}
/* стеклянная подложка под текстом, подсвеченная тем же тёплым ключом, что и сцена (свет сверху слева) */
@media (min-width:1181px){
  .hero-txt::before{inset:-46px -52px -42px -54px;border-radius:30px;
    background:radial-gradient(130% 85% at 0% 0%,rgba(255,222,184,.085),rgba(255,222,184,0) 58%),linear-gradient(180deg,rgba(24,22,20,.5),rgba(12,11,11,.62));
    border:1px solid rgba(255,236,214,.075);
    box-shadow:inset 0 1px 0 rgba(255,244,230,.08),inset 1px 0 0 rgba(255,244,230,.03),0 60px 100px -60px rgba(0,0,0,.85);
    -webkit-backdrop-filter:blur(18px) saturate(1.12);backdrop-filter:blur(18px) saturate(1.12)}
  .hero-txt::after{content:"";position:absolute;z-index:-2;left:-30%;top:-40%;width:110%;height:120%;pointer-events:none;
    background:radial-gradient(closest-side,rgba(255,214,168,.07),rgba(255,214,168,0))}
}
/* с 3D: счётчик, название и стрелки показывает пульт на столе; в DOM они остаются для чтения с экрана и клавиатуры */
.has-3d .hero-bar .cnt,.has-3d .hero-bar .cname,.has-3d .hero-bar .arr:not(:focus-visible){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.has-3d .hero-bar{grid-template-columns:1fr;gap:6px;width:min(420px,40vw)}
.has-3d .hero-bar .arr:focus-visible{position:static}
@media (max-width:1180px){.has-3d .hero-bar{width:auto}}
/* без WebGL на узких экранах: карточки концептов занимают всю ширину под текстом */
@media (max-width:1180px){.stage-fb{left:var(--g);right:var(--g);width:auto;max-width:720px;margin:0 auto}}
@media (max-width:800px){.no-webgl .stage-fb{bottom:100px;height:370px}}
@media (min-width:1181px){
  .hero-txt{max-width:650px}
  /* кромка стола видна, а его торец мягко растворяется в фоне страницы — без шва */
  #stage{-webkit-mask-image:linear-gradient(#000 0,#000 83%,transparent 99%);mask-image:linear-gradient(#000 0,#000 83%,transparent 99%)}
}
/* на 1181–1419 подложке не хватает поля слева: прижимаем её к краю экрана, скругляем только справа */
@media (min-width:1181px) and (max-width:1419px){
  .hero-txt::before{left:calc(-1 * max(var(--g), (100vw - 1312px) / 2 + var(--g)));border-radius:0 30px 30px 0;border-left:0}
}
/* стол уходит за нижний край кадра и мягко гаснет; полоски прогресса лежат на этом затухании, без пустой полосы */
@media (min-width:1181px){
  #stage{-webkit-mask-image:linear-gradient(#000 0,#000 70%,transparent 100%);mask-image:linear-gradient(#000 0,#000 70%,transparent 100%)}
  .has-3d .hero-bar{bottom:30px}
  .has-3d .hint{margin-top:2px;color:#8f8f97}
}

/* ===== Phase 3: «Как работаем» с бегущей биркой + лента «Что мы делаем» ===== */
#model.pm,#services.sv{padding:0}
.pm-pin,.sv-pin{padding:var(--sp) 0}
.pm-run.pinned .pm-pin{position:sticky;top:0;height:100vh;height:100svh;padding:76px 0 24px;display:flex;align-items:center}
.pm-run.pinned .pm-pin>.wrap{width:100%}
.pm-h{display:flex;justify-content:space-between;align-items:flex-end;gap:20px 56px;flex-wrap:wrap;margin-bottom:clamp(18px,3vh,40px)}
.pm-h .hd,.sv-head .hd{font-weight:500;font-size:clamp(30px,3.5vw,52px);letter-spacing:-.03em;line-height:1.08;margin:0}
.pm-h .hd{max-width:800px}.pm-h2{color:#a39c90}
.pm-side{display:grid;gap:14px;justify-items:start;max-width:360px}
.pm-fact{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.5;color:var(--soft)}.pm-fact i{color:var(--sage);font-size:20px;flex:none;margin-top:1px}
.pm-track{position:relative;padding-top:100px}
.pm-rail{position:absolute;left:0;right:0;top:0;height:100px;pointer-events:none}
.pm-line{position:absolute;top:10px;left:var(--x0,12%);width:calc(var(--x3,88%) - var(--x0,12%));height:2px;background:#3d3832;border-radius:2px;overflow:hidden}
.pm-line b{display:block;height:100%;background:var(--sage);transform-origin:0 50%;transform:scaleX(0)}
.pm-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;list-style:none;margin:0;padding:0}
.pm-step{position:relative}
.pm-step::before{content:"";position:absolute;left:50%;top:-95px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:#171513;border:2px solid #4c463f;transition:background .4s,border-color .4s}
.pm-step.on::before,.pm-step.done::before{background:var(--sage);border-color:var(--sage)}
.pm-vis{position:relative;height:clamp(200px,31vh,290px);border-radius:18px;background:linear-gradient(165deg,#221f1b,#181614);box-shadow:var(--sh);overflow:hidden;margin-bottom:18px;isolation:isolate;transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1)}
.pm-run.pinned .pm-step:not(.on) .pm-vis{opacity:.55}.pm-run.pinned .pm-step.on .pm-vis{transform:translateY(-6px)}
.pm-vis .fb,.sv-vis .fb{position:absolute;inset:0}
.pm-vis img.gen,.sv-vis img.gen{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.has-img>.fb{display:none}
.pm-n{font:500 13px/1 var(--font-display);color:#8b8478;display:block;margin-bottom:8px;transition:color .4s}.pm-step.on .pm-n{color:var(--sage)}
.pm-step h3{font:500 clamp(17px,1.4vw,20px)/1.2 var(--font-display);letter-spacing:-.02em;margin-bottom:6px}
.pm-step p{font-size:15px;line-height:1.5;color:var(--muted)}
/* бирка */
.pm-tag{position:absolute;top:28px;left:-64px;width:128px;height:76px;z-index:6;perspective:700px;transform-origin:50% -17px;transition:transform .35s cubic-bezier(.2,.8,.3,1);filter:drop-shadow(0 12px 14px rgba(0,0,0,.5)) drop-shadow(0 2px 2px rgba(0,0,0,.35));pointer-events:none}
.pm-str{position:absolute;left:50%;top:-18px;width:1.5px;height:30px;margin-left:-.75px;background:linear-gradient(#d8cfbd,#8d8576);z-index:2}
.pm-tag-in{position:absolute;inset:0;z-index:1;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,1.45,.45,1)}
.pm-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:grid;place-content:center;justify-items:center;padding-top:14px;color:#191714;background:#efe9dc linear-gradient(180deg,rgba(255,255,255,.45),transparent 45%);clip-path:polygon(20px 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%,0 20px);-webkit-mask:radial-gradient(circle 5px at 50% 11px,#0000 95%,#000 100%);mask:radial-gradient(circle 5px at 50% 11px,#0000 95%,#000 100%);transition:background-color .4s}
.pm-face b{font:600 23px/1.05 var(--font-display);letter-spacing:-.03em;white-space:nowrap}
.pm-face small{font-size:11.5px;color:#6a645a;margin-top:5px}
.pm-b{transform:rotateY(180deg);background-color:#e9bf86}.pm-b b{font-size:14px;letter-spacing:-.01em}.pm-b small{color:#6b4d23}
.pm-tag.own .pm-f{background-color:#d6e1bf}.pm-tag.own .pm-f b{font-size:16px}.pm-tag.own .pm-f small{color:#4b5a3c}
/* мини-сцены шагов */
.pm-vis .fb{font-size:12px;line-height:1.35;color:#1a1815}
.pv-win{position:absolute;left:8%;top:11%;right:-16%;bottom:-12%;background:#f4f0e8;border-radius:10px;box-shadow:0 18px 40px -14px #000;overflow:hidden}
.pv-bar{display:flex;gap:5px;align-items:center;padding:7px 10px;background:#e2dccf}.pv-bar i{width:7px;height:7px;border-radius:50%;background:#b6ae9f}.pv-bar span{margin-left:8px;font-size:10.5px;color:#6f685c}
.pv-site{padding:11px 14px;display:grid;gap:6px;justify-items:start}
.pv-nav{display:flex;gap:12px;align-items:center;width:100%;font-size:10.5px;color:#6f685c;margin-bottom:4px}.pv-nav b{font:700 13px var(--font-display);color:#1a1815;margin-right:auto}.pv-nav em{font-style:normal;background:#2e5e46;color:#fff;padding:4px 9px;border-radius:5px;font-weight:600}
.pv-site small{font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:#8a8275}
.pv-site h6{font:600 17px/1.12 var(--font-display);letter-spacing:-.02em;max-width:14em}
.pv-chips{display:flex;gap:6px;margin-top:2px}.pv-chips span{background:#fff;border-radius:7px;padding:5px 9px;display:grid;font-size:10.5px;color:#6f685c}.pv-chips b{font-size:12px;color:#1a1815}
.pv-msg{position:absolute;left:5%;bottom:8%;width:min(78%,250px);display:flex;gap:9px;align-items:flex-start;background:#2a2622;color:#efe9dc;padding:10px 12px;border-radius:14px 14px 14px 4px;box-shadow:var(--sh);font-size:12.5px;line-height:1.4;z-index:2;animation:pvMsg 7s infinite}
.pv-msg b{display:block;font-size:12px;color:#d9d2c4}.pv-msg b small{color:#8b8478;font-weight:400;margin-left:4px}
.pv-av{flex:none;width:28px;height:28px;border-radius:50%;background:var(--sage);color:#1a1815;display:grid;place-items:center;font:600 12px var(--font-display)}
@keyframes pvMsg{0%,8%{opacity:0;transform:translateY(12px) scale(.96)}16%,100%{opacity:1;transform:none}}
.pv-doc{position:absolute;left:8%;top:10%;width:74%;bottom:-10%;background:#f4f0e8;border-radius:6px;padding:14px 16px;box-shadow:0 18px 40px -14px #000;transform:rotate(-2deg)}
.pv-dh{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:10px}.pv-dh b{font:600 13px var(--font-display)}.pv-dh small{font-size:10px;color:#8a8275}
.pv-doc ul{list-style:none;display:grid;gap:7px;padding:0;margin:0 0 11px}.pv-doc li{display:flex;gap:8px;align-items:center;font-size:12px}
.pv-doc li::before{content:"";flex:none;width:14px;height:14px;border-radius:4px;border:1.5px solid #9d978a;background:center/9px no-repeat;animation:pvCk 7s infinite}
.pv-doc li:nth-child(2)::before{animation-delay:.5s}.pv-doc li:nth-child(3)::before{animation-delay:1s}.pv-doc li:nth-child(4)::before{animation-delay:1.5s}
@keyframes pvCk{0%,10%{background-color:transparent;background-image:none}18%,100%{background-color:#2e5e46;border-color:#2e5e46;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2 6.5l2.6 2.5L10 3.5' stroke='white' stroke-width='2' fill='none'/></svg>")}}
.pv-sum{display:flex;justify-content:space-between;align-items:baseline;border-top:1px dashed #b9b0a0;padding-top:9px;font-size:11px;color:#6f685c}.pv-sum b{font:600 15px var(--font-display);color:#1a1815}
.pv-note{position:absolute;right:5%;top:16%;width:108px;background:#f1d082;color:#3a2f12;padding:10px 11px 12px;font-size:11.5px;line-height:1.3;transform:rotate(5deg);box-shadow:0 12px 22px -8px rgba(0,0,0,.6);z-index:2}.pv-note b{display:block;font:600 14px var(--font-display);margin-top:4px}
.pv3,.pv4{display:grid;align-content:center;gap:9px;padding:0 8%}
.pv-stage{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#2c2824;color:#efe9dc;padding:9px 12px;border-radius:10px;font-size:12.5px}.pv-stage b{display:inline-flex;gap:4px;align-items:center;background:#4f7a3f;color:#fff;font-size:11px;padding:3px 9px;border-radius:99px;font-weight:600}
.pv-inv{background:#f4f0e8;border-radius:10px;padding:11px 13px;display:grid;gap:7px;box-shadow:0 18px 36px -14px #000}
.pv-ih{display:flex;gap:7px;align-items:center;font-size:12px;font-weight:600}.pv-ih i{color:#a8742f;font-size:16px}.pv-ih small{margin-left:auto;font-weight:400;color:#8a8275;font-size:10px}
.pv-is{display:flex;justify-content:space-between;align-items:baseline;font-size:11.5px;color:#6f685c}.pv-is b{font:600 20px var(--font-display);color:#1a1815;letter-spacing:-.02em}
.pv-pay{background:#1a1815;color:#f4f0e8;text-align:center;border-radius:7px;padding:7px;font-weight:600;font-size:12px;animation:pvPay 7s infinite}
@keyframes pvPay{0%,58%,70%,100%{transform:none}63%{transform:scale(.95)}}
.pv-steps{display:flex;gap:6px}.pv-steps span{flex:1;text-align:center;font-size:10.5px;padding:5px 0;border-radius:6px;background:#2c2824;color:#8b8478}.pv-steps .ok{background:#3c4a33;color:#d7e2c0}
.pv-url{display:flex;gap:7px;align-items:center;background:#2c2824;color:#efe9dc;border-radius:99px;padding:9px 13px;font-size:12.5px}.pv-url>i{color:var(--sage)}.pv-url em{margin-left:auto;font-style:normal;font-size:10.5px;color:var(--sage);display:flex;gap:5px;align-items:center}.pv-url em i{width:7px;height:7px;border-radius:50%;background:var(--sage)}
.pv-lead{display:flex;gap:10px;align-items:center;background:#f4f0e8;border-radius:10px;padding:10px 12px;box-shadow:0 14px 30px -12px #000;font-size:11.5px;color:#6f685c;animation:pvMsg 7s infinite}.pv-lead>i{font-size:18px;color:#a8742f}.pv-lead span{display:grid;flex:1}.pv-lead b{color:#1a1815;font-size:12.5px}.pv-lead small{font-size:10px;color:#8a8275}
.pv-key{display:flex;gap:10px;align-items:center;background:#d6e1bf;border-radius:10px;padding:11px 12px;font-size:11.5px;color:#3c4a33}.pv-key i{font-size:22px;color:#2e5e46}.pv-key span{display:grid}.pv-key b{font:600 13.5px var(--font-display);color:#1a1815}
.pm-vis *{animation-play-state:paused}.pm-vis.live *{animation-play-state:running}
/* без закрепления: узкие экраны — бирка липнет к низу экрана */
.pm-track[data-mode=stack]{padding-top:0}
.pm-track[data-mode=stack] .pm-rail,.pm-track[data-mode=stack] .pm-str,.pm-track[data-mode=stack] .pm-step::before{display:none}
.pm-track[data-mode=stack] .pm-steps{grid-template-columns:repeat(2,1fr);gap:34px 20px}
.pm-track[data-mode=stack] .pm-tag{position:sticky;top:calc(100vh - 190px);top:calc(100svh - 190px);left:auto;margin:0 6px -76px auto;transform:none!important}
@media (max-width:620px){.pm-track[data-mode=stack] .pm-steps{grid-template-columns:1fr}.pm-vis{height:230px}}

/* лента услуг */
.sv-run.pinned .sv-pin{position:sticky;top:0;height:100vh;height:100svh;padding:76px 0 20px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.sv-head{display:flex;align-items:flex-end;gap:14px 40px;flex-wrap:wrap;margin-bottom:clamp(18px,3.2vh,40px)}
.sv-sub{color:var(--muted);font-size:15px;line-height:1.5;max-width:340px;margin:0 auto 4px 0}
.sv-prog{display:flex;align-items:center;gap:12px;font:500 13px/1 var(--font-display);color:var(--dim);margin-bottom:8px}.sv-prog #svNum{color:var(--ink)}
.sv-prog i{width:120px;height:2px;background:var(--line-2);border-radius:2px;overflow:hidden}.sv-prog b{display:block;height:100%;background:var(--ink);transform-origin:0 50%;transform:scaleX(.2);transition:transform .25s}
.sv-vp{overflow:hidden}
.sv-track{display:flex;gap:20px;width:max-content;padding:0 max(var(--g),calc((100vw - 1312px)/2 + var(--g)));will-change:transform}
.sv-card{flex:none;width:clamp(290px,28vw,400px);display:flex;flex-direction:column;background:var(--surface);border-radius:24px;box-shadow:var(--sh);overflow:hidden}
.sv-vis{position:relative;height:clamp(230px,39vh,340px);overflow:hidden;background:radial-gradient(120% 90% at 70% 0%,color-mix(in srgb,var(--c) 20%,#17171a),#111113 72%)}
.sv-vis .fb{display:grid;place-items:center}
.sv-body{padding:18px 22px 22px;display:grid;gap:10px;flex:1;align-content:start}
.sv-body h3{font:500 21px/1.15 var(--font-display);letter-spacing:-.02em}
.sv-body p{font-size:14.5px;line-height:1.5;color:var(--muted);min-height:3em}
.sv-f{display:flex;align-items:center;justify-content:space-between;gap:12px}.sv-f .price{font-size:20px;font-weight:500}
.sv-go{width:42px;height:42px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--cta);color:#151518;font-size:18px;transition:transform .35s cubic-bezier(.3,1.5,.5,1)}.sv-go:hover{transform:rotate(45deg)}
.sv-tags{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0}.sv-tags li{font-size:12px;line-height:1.3;padding:4px 10px;border-radius:99px;color:var(--soft);border:1px solid var(--line)}
.sv-more{margin-top:clamp(14px,2.4vh,28px);font-size:14.5px}.sv-more a{color:var(--soft);border-bottom:1px solid var(--line-2);display:inline-flex;gap:6px;align-items:center}.sv-more a:hover{color:var(--ink)}
.sv-vis .mu-site{width:90%;max-width:none;margin:0;align-self:start;margin-top:18px}
.sv-vis .mu-site .pgr{height:230px;overflow:hidden}
.sv-vis .phone-front{right:12px;bottom:12px;width:170px;font-size:12px;padding:10px 12px 12px;border-radius:18px}
.sv-card:has(.mu-site.on) .phone-front{animation-play-state:running}
.sv-vis .mu-chat{width:88%;max-width:340px}.sv-vis .chat-b{height:236px}
.sv-vis .mu-kan{width:92%;padding:12px 12px 22px}.sv-vis .col{min-height:210px;padding:8px}.sv-vis .kc{font-size:11.5px}
.sv-vis .mu-chk{width:88%;padding:16px 18px 24px}.sv-vis .mu-chk li{padding:8px 0;font-size:14px}
.sv-vis .phone{position:absolute;left:50%;top:18px;transform:translateX(-50%) scale(.82);transform-origin:50% 0}
.sv-run.flat .sv-track{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));width:auto;max-width:1312px;margin:0 auto;padding:0 var(--g)}
.sv-run.flat .sv-card{width:auto}
@media (max-width:768px){
  .sv-vp{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;scroll-padding:0 var(--g)}
  .sv-vp::-webkit-scrollbar{display:none}
  .sv-track{padding:0 var(--g)}
  .sv-card{width:min(84vw,360px);scroll-snap-align:start}
  .sv-vis{height:300px}
}
@media (prefers-reduced-motion:reduce){.pm-tag,.pm-tag-in,.pm-vis{transition:none}}
.pm-h .hd{max-width:none;font-size:clamp(30px,3.3vw,50px)}
.pm-tag{width:152px;left:-76px}
.pv-doc{width:63%;left:7%}.pv-note{right:4%;top:20%}
@media (min-width:1000px) and (max-width:1279px){.pm-vis .fb{zoom:.84}}
@media (max-width:620px){.pv-msg{left:auto;right:4%;bottom:5%;width:66%}.pm-track[data-mode=stack] .pm-tag{width:136px;height:70px;margin-bottom:-70px}}
.sv-vis .col h6{gap:4px;font-size:11.5px;white-space:nowrap}
@media (max-width:1279px){.sv-vis .mu-chk li{padding:6px 0;font-size:13px;line-height:1.35}.sv-vis .mu-chk{padding:12px 16px 22px}.sv-vis .mu-kan{width:94%}}

/* ===== Phase 4: «Работы» — стопка окон ===== */
#portfolio{padding:0}
.ws-pin{padding:var(--sp) 0}
.ws-run.pinned .ws-pin{position:sticky;top:0;height:100vh;height:100svh;padding:84px 0 24px;display:flex;align-items:center;overflow:hidden}
.ws-run.pinned .ws-pin>.wrap{width:100%}
.ws{display:grid;grid-template-columns:minmax(250px,320px) 1fr;gap:clamp(28px,5vw,80px);align-items:center}
.ws-side .hd{font-weight:500;font-size:clamp(48px,5.2vw,76px);letter-spacing:-.04em;line-height:.95;margin:0}
.ws-lead{color:var(--muted);font-size:15px;margin-top:18px;max-width:290px;line-height:1.6}
.ws-info{margin-top:30px;min-height:158px;display:grid;gap:6px;align-content:start;animation:wsi .55s cubic-bezier(.2,.8,.2,1)}
@keyframes wsi{from{opacity:0;transform:translateY(10px)}}
.ws-tag{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--amber);font-weight:600}
.ws-name{font-size:36px;line-height:1.1;color:var(--ink);margin-top:2px}
.ws-info p{color:var(--soft);font-size:15.5px;line-height:1.5}
.ws-cta{justify-self:start;margin-top:8px;display:inline-flex;gap:8px;align-items:center;font-size:14.5px;color:var(--ink);border-bottom:1px solid var(--line-2);padding-bottom:3px;transition:border-color .25s}.ws-cta:hover{border-color:var(--sage)}
.ws-ctl{display:flex;align-items:center;gap:12px;margin-top:22px}
.ws-b{width:46px;height:46px;font-size:17px;color:var(--ink)}
.ws-cnt{font-family:var(--font-display);font-size:14px;color:var(--dim);min-width:58px;text-align:center;white-space:nowrap}.ws-cnt b{color:var(--ink);font-size:22px;font-weight:500}
.ws-prog{flex:1;max-width:110px;height:2px;background:var(--line-2);border-radius:2px;overflow:hidden}.ws-prog i{display:block;height:100%;background:var(--sage);transform-origin:0 50%;transform:scaleX(.17);transition:transform .3s}
.ws-all{display:inline-flex;gap:8px;align-items:center;margin-top:24px;color:var(--soft);font-size:14.5px;border-bottom:1px solid var(--line-2);padding-bottom:3px}.ws-all:hover{color:var(--ink)}
.ws-stage{position:relative;padding:100px 100px 18px 0}
.ws-stage::after{content:"";position:absolute;left:6%;right:16%;bottom:-4px;height:40px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.75),transparent);filter:blur(6px);z-index:-1}
.ws-stack{position:relative;aspect-ratio:16/11.3;outline:none;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab}
.ws-stack.drag{cursor:grabbing}
.ws-stack:focus-visible{outline:2px solid #dce4ba;outline-offset:10px;border-radius:14px}
.wc{position:absolute;inset:0;display:flex;flex-direction:column;border-radius:12px;overflow:hidden;background:#111;box-shadow:var(--sh);transform-origin:50% 90%;will-change:transform,opacity;backface-visibility:hidden}
.wc-bar{display:flex;gap:6px;align-items:center;padding:10px 14px;background:#1c1c1f;flex:none}.wc-bar i{width:9px;height:9px;border-radius:50%;background:#3b3b3f}.wc-bar span{margin-left:10px;font-size:12px;color:var(--dim)}
.wc-view{flex:1;min-height:0;overflow:hidden;position:relative;background:#0c0c0e}
.wc-view .cs{border-radius:0;min-height:100%}
.wc-img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;-webkit-user-drag:none}
.wc-cap{display:flex;gap:10px;align-items:center;padding:10px 16px;background:var(--paper);color:var(--ink-d);font-size:13.5px;line-height:1.35;flex:none}
.wc-cap em{font-style:normal;font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;padding:3px 9px;border-radius:99px;background:var(--ink-d);color:var(--paper);flex:none}
.wc-cap span{color:#6a665c;flex:none}.wc-cap p{margin:0 0 0 auto;font-weight:500;text-align:right}
.wc-shade{position:absolute;inset:0;background:#08080a;opacity:var(--dk,0);pointer-events:none}
.ws-run.flat .ws{grid-template-columns:1fr}
.ws-run.flat .ws-stage{padding:0}.ws-run.flat .ws-stage::after{display:none}
.ws-run.flat .ws-stack{aspect-ratio:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;cursor:auto}
.ws-run.flat .wc{position:relative;inset:auto;aspect-ratio:16/11.3}.ws-run.flat .wc-shade{display:none}
.ws-run.flat .ws-ctl{display:none}
@media (max-width:1100px){.ws-stage{padding:70px 70px 14px 0}.wc-cap span{display:none}}
@media (max-width:768px){
  .ws{display:flex;flex-direction:column;align-items:stretch;gap:0}.ws-side{display:contents}
  .ws-side .hd{order:1;font-size:clamp(48px,15vw,64px)}.ws-lead{order:2;margin-bottom:8px}
  .ws-stage{order:3;padding:46px 34px 10px 0;margin-top:6px}.ws-ctl{order:4;margin-top:18px}.ws-info{order:5;margin-top:18px;min-height:0}.ws-all{order:6;align-self:flex-start}
  .ws-stack{aspect-ratio:1/1.08}
  .wc-cap{flex-wrap:wrap;gap:4px 8px;padding:9px 12px;font-size:12.5px}.wc-cap span{display:inline}.wc-cap p{margin:0;width:100%;text-align:left}
  .ws-run.flat .ws-stack{grid-template-columns:1fr}.ws-run.flat .wc{aspect-ratio:1/1.08}
  .ws-prog{max-width:none}
}

/* ===== Phase 4: сравнение — свет на колонке Flowleadly ===== */
@property --cra{syntax:'<angle>';inherits:false;initial-value:0deg}
.cmp-card{transition:background .9s}
.cmp-card::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(70% 34% at 50% 0,rgba(255,238,204,.17),transparent 72%);opacity:0;transition:opacity 1.4s .3s}
.cmp.on .cmp-card::after{opacity:1}
.cmp-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--cra),transparent 0 76%,rgba(255,226,170,.0) 80%,rgba(255,236,200,.95) 88%,transparent 90%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);filter:drop-shadow(0 0 5px rgba(255,214,150,.75));opacity:0;transition:opacity 1s .6s;animation:cmpRun 10s linear infinite}
.cmp.on .cmp-card::before{opacity:1}
.cmp.off .cmp-card::before{animation-play-state:paused}
@keyframes cmpRun{to{--cra:360deg}}
.cmp-beam{position:absolute;grid-column:4;grid-row:1/-1;top:-300px;height:calc(300px + 62%);left:-26%;right:-26%;z-index:0;pointer-events:none;filter:blur(18px);opacity:0;transition:opacity 1.6s;mix-blend-mode:screen}
.cmp-beam::before{content:"";position:absolute;inset:0;clip-path:polygon(43% 0,57% 0,100% 100%,0 100%);background:linear-gradient(180deg,rgba(255,236,200,0) 0%,rgba(255,236,200,.09) 38%,rgba(255,236,200,.05) 75%,rgba(255,236,200,0) 100%)}
.cmp-grid>.cmp-beam{position:absolute;padding:0;border:0;display:block;z-index:0}
.cmp.on .cmp-beam{opacity:1}
.cmp-grid>[data-r]{transition:opacity .55s,transform .65s cubic-bezier(.2,.8,.2,1),background .25s,color .6s}
.cmp.rv-rows .cmp-grid>[data-r]:not(.rin){opacity:0;transform:translateY(14px)}
.cmp-grid>.c .ic{transition:opacity .6s}
.cmp.dim .cmp-grid>.c:not(.hov){color:#5c5c63}.cmp.dim .cmp-grid>.c:not(.hov) .ic{opacity:.5}
.ck svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.ck path{stroke-dasharray:20;stroke-dashoffset:20;transition:stroke-dashoffset .5s .18s cubic-bezier(.3,.7,.2,1)}
.hf.lit .ck path{stroke-dashoffset:0}
@media (max-width:800px){.cmp-grid>.cmp-beam{display:none}.cmp.dim .cmp-grid>.c:not(.hov){color:#a8a8b0}.cmp.dim .cmp-grid>.c .ic{opacity:1}}
@media (prefers-reduced-motion:reduce){.cmp-card::before{animation:none;--cra:200deg}}

/* ===== Phase 4: путь клиента — схема с импульсами ===== */
.fl-h{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 40px;margin-bottom:46px;flex-wrap:wrap}
.fl-h .hd{font-weight:500;font-size:clamp(28px,3.2vw,46px);letter-spacing:-.03em;line-height:1.08;margin:0;max-width:820px}
.fl-hint{color:var(--dim);font-size:13.5px;max-width:250px;line-height:1.5;margin:0}
.flow.fl{display:grid;grid-template-columns:minmax(180px,220px) 150px minmax(0,1fr);gap:clamp(30px,5vw,90px);align-items:center}
.fl .flow-svg{display:block;z-index:1}
.fl .flow-svg path{fill:none;stroke:#2e2e33;stroke-width:1.5;transition:stroke .3s,opacity .3s}
.fl .flow-svg path.hot{stroke:url(#fg);stroke-width:2;filter:none}
.fl.focus .flow-svg path:not(.hot){opacity:.3}
.fl-dot{pointer-events:none}.fl-dot .pa{fill:rgba(224,190,140,.2)}.fl-dot .pc{fill:#f1e2c6}
.fl-dot.hot .pa{fill:rgba(255,228,178,.32)}.fl-dot.hot .pc{fill:#fff}
.fl-src{display:grid;gap:10px;position:relative;z-index:2}
.fl-n{font:inherit;color:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.fl-n:focus-visible{outline:2px solid #dce4ba;outline-offset:3px}
.fl-src .fl-n{width:100%;display:flex;align-items:center;gap:11px;padding:11px 14px;border:1px solid #2a2a2e;border-radius:12px;background:#1a1a1d;box-shadow:0 8px 18px -10px #000;font-size:14px;color:var(--soft);transition:border-color .3s,color .3s,transform .4s cubic-bezier(.2,.8,.2,1),opacity .3s}
.fl-src .fl-n i{font-size:19px;color:var(--dim);transition:color .3s}
.mg{font:700 9.5px/1 var(--font-display);width:19px;height:19px;border-radius:5px;display:grid;place-items:center;background:#2c2c31;color:var(--soft);flex:none}
.fl-src .fl-n.hot,.fl-src .fl-n.src-on{border-color:var(--sage);color:var(--ink);transform:translateX(6px)}
.fl-src .fl-n.hot i,.fl-src .fl-n.src-on i{color:var(--sage)}
.fl.focus .fl-src .fl-n:not(.hot){opacity:.5}
.fl .node{width:150px;height:150px;padding:0;text-align:center;color:var(--ink);font:inherit}
.fl .node.hot{border-color:var(--sage)}
.fl .node::before,.fl .node::after{display:none}
.fl-out{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(30px,4vw,64px);align-items:center;position:relative;z-index:2}
.fl .leads{display:block;padding:14px;min-height:0;transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .3s}
.fl .leads.flash{transform:rotate(1.2deg) translateY(-4px)}
.fl-cap{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;margin-bottom:10px;color:#55524b}.fl-cap small{font-weight:500;color:#8a857a;margin-left:auto}
.fl .leads li{padding:9px 11px;margin-bottom:6px;font-size:13px}.fl .leads li:last-child{margin-bottom:0}
.fl-tg{display:block;padding:14px;border-radius:18px;background:#17212b;border:1px solid #24313f;box-shadow:var(--sh);transform:rotate(-1.5deg);transition:border-color .4s,transform .45s cubic-bezier(.2,.8,.2,1),opacity .3s}
.fl-tg.flash{border-color:#8fb3e8;transform:rotate(-1.5deg) translateY(-4px)}
.fl-tg .fl-cap{color:#a9c3ea}.fl-tg .fl-cap i{font-size:16px}.fl-tg .fl-cap small{color:#6d7f93}
.fl-msg{display:grid;gap:2px;padding:10px 12px;border-radius:12px 12px 12px 4px;background:#22303e;color:#e6edf5;font-size:13px;line-height:1.4;animation:pop .45s cubic-bezier(.2,.9,.3,1.2)}
.fl-msg b{font-weight:600;color:#fff}.fl-msg small{color:#8ea3b8;font-size:12px}
.fl-tip{position:absolute;z-index:5;max-width:280px;padding:9px 12px;border-radius:10px;background:var(--paper);color:var(--ink-d);font-size:13px;line-height:1.4;box-shadow:var(--sh);pointer-events:none;animation:pop .25s}
.fl-tip[hidden]{display:none}
.fl-tip small{display:block;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:#8a857a;font-weight:600;margin-bottom:2px}
@media (max-width:1000px){.flow.fl{grid-template-columns:minmax(170px,200px) 130px minmax(0,1fr)}.fl .node{width:130px;height:130px}.fl-out{grid-template-columns:1fr;gap:34px}}
@media (max-width:800px){
  .fl-h{margin-bottom:28px}
  .flow.fl{grid-template-columns:1fr;gap:40px}
  .fl-src{grid-template-columns:1fr 1fr;gap:8px}.fl-src .fl-n{padding:10px 11px;font-size:13px;gap:8px}
  .fl-src .fl-n.hot,.fl-src .fl-n.src-on{transform:translateY(-2px)}
  .fl .node{width:124px;height:124px;margin:0 auto}
  .fl-out{gap:40px}.fl-tg{max-width:330px;justify-self:end}
}
#compare{overflow-x:clip}.ws-pin{overflow-x:clip}
@media (min-width:801px){.cmp-grid>div{padding-top:13px;padding-bottom:13px}.cmp-grid>.hh{padding-top:22px;padding-bottom:20px}}
.wc-cap span{flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wc-cap p{min-width:0}.ws-run.flat .wc-cap span{display:none}
.fl .leads li span:last-child{white-space:nowrap}

/* ===== Этап 5 · о студии, цены, ИИ-помощник, финал ===== */
/* о студии: Егор — центр, линии к ролям */
.ab{position:relative;display:grid;grid-template-columns:minmax(280px,.8fr) 1.2fr;gap:clamp(40px,7vw,110px);align-items:center}
.ab-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;overflow:visible}
.ab-l{fill:none;stroke:#2c2c31;stroke-width:1.2;transition:stroke .35s}
.ab-p{fill:none;stroke:var(--amber);stroke-width:1.6;stroke-linecap:round;stroke-dasharray:5 95;stroke-dashoffset:100;opacity:.35;animation:abPulse 4.2s linear infinite}
.ab-svg g:nth-child(2) .ab-p{animation-delay:-.7s}.ab-svg g:nth-child(3) .ab-p{animation-delay:-1.4s}.ab-svg g:nth-child(4) .ab-p{animation-delay:-2.1s}.ab-svg g:nth-child(5) .ab-p{animation-delay:-2.8s}.ab-svg g:nth-child(6) .ab-p{animation-delay:-3.5s}
.ab-svg g.on .ab-l{stroke:rgba(224,169,109,.55)}.ab-svg g.on .ab-p{opacity:1;stroke-width:2.2;animation-duration:1.4s}
.ab.hot .ab-svg g:not(.on) .ab-p{opacity:.12}
@keyframes abPulse{to{stroke-dashoffset:0}}
.ab-ph{position:relative;z-index:1;margin:0;max-width:440px;width:100%}
.ab-img{position:relative;aspect-ratio:4/5;border-radius:22px;overflow:hidden;background:#121214;border:1px solid var(--line-2);box-shadow:0 50px 100px -50px #000,0 0 0 8px rgba(255,255,255,.015)}
.ab-img img{width:100%;height:100%;object-fit:cover;display:block}
.ab-fb{display:none;position:absolute;inset:0;place-items:center;background:radial-gradient(70% 55% at 50% 30%,rgba(224,169,109,.22),transparent 70%),linear-gradient(180deg,#19191c,#0e0e10)}
.ab-fb svg{position:absolute;bottom:0;left:50%;width:78%;transform:translateX(-50%);fill:#232327}
.ab-fb b{position:relative;font-family:var(--font-display);font-size:clamp(54px,6vw,86px);letter-spacing:-.04em;color:rgba(240,239,241,.92);margin-bottom:22%}
.ab-img.nf img{display:none}.ab-img.nf .ab-fb{display:grid}
.ab-cap{position:absolute;left:16px;right:16px;bottom:16px;display:grid;gap:2px;padding:14px 16px;border-radius:14px;background:rgba(12,12,14,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.08)}
.ab-cap b{font-family:var(--font-display);font-weight:500;font-size:17px}.ab-cap span{font-size:13px;color:var(--soft)}
.ab-hub{position:absolute;right:-7px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 5px rgba(224,169,109,.16),0 0 24px rgba(224,169,109,.55)}
.ab-t{position:relative;z-index:1}
.ab-t .hd{max-width:640px}
.ab-q{margin:22px 0 30px;padding:0 0 0 18px;border-left:2px solid var(--amber);font-size:clamp(16px,1.3vw,18.5px);line-height:1.6;color:var(--ink);max-width:600px}
.ab-q cite{display:block;margin-top:8px;font-style:normal;font-size:13px;color:var(--dim)}
.ab-team{list-style:none;margin:0 0 30px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ab-team li{position:relative;display:grid;grid-template-columns:44px 1fr;column-gap:14px;align-items:center;padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:rgba(17,17,19,.86);cursor:default;transition:border-color .3s,background .3s,transform .4s cubic-bezier(.2,.9,.3,1.2);outline:none}
.ab-team li.on,.ab-team li:focus-visible{border-color:rgba(224,169,109,.5);background:#17150f;transform:translateX(4px)}
.ab-team .av{grid-row:1/3;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:20px;color:var(--soft);background:#1d1d21;border:1px solid var(--line-2);transition:.3s}
.ab-team li.on .av{color:#151518;background:var(--amber);border-color:var(--amber)}
.ab-team b{font-weight:600;font-size:15px;line-height:1.3}
.ab-d{display:grid;font-size:13px;line-height:1.45}
.ab-d em{font-style:normal;color:var(--dim)}
.ab-d em+em{color:var(--soft);max-height:0;opacity:0;overflow:hidden;transition:max-height .4s,opacity .3s,margin .3s}
.ab-team li.on .ab-d em+em,.ab-team li:focus-visible .ab-d em+em{max-height:60px;opacity:1;margin-top:4px}
.ab-f{display:flex;align-items:center;gap:22px;flex-wrap:wrap}.ab-f span{font-size:13.5px;color:var(--dim);line-height:1.5}
@media (max-width:1100px){.ab{grid-template-columns:1fr}.ab-ph{max-width:360px}.ab-hub{display:none}.ab-d em+em{max-height:none;opacity:1;margin-top:4px}}
@media (max-width:600px){.ab-team{grid-template-columns:1fr}.ab-ph{max-width:none}.ab-img{aspect-ratio:1/1}}

/* цены */
.pr-pay{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.pr-pay li{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:99px;border:1px solid var(--line-2);background:rgba(255,255,255,.02);font-size:14px;color:var(--soft)}
.pr-pay i{color:var(--sage);font-size:17px}
.pr-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
#prices .tabs{position:relative;display:inline-flex;flex-wrap:wrap;gap:2px;margin:0;padding:5px;border:1px solid var(--line-2);border-radius:99px;background:rgba(14,14,16,.7)}
.tab-ind{position:absolute;left:0;top:0;border-radius:99px;background:var(--cta);transition:transform .5s cubic-bezier(.3,1.3,.4,1),width .5s cubic-bezier(.3,1.3,.4,1);pointer-events:none}
#prices .tab{position:relative;z-index:1;border:0;background:transparent;padding:11px 20px}
#prices .tab.on{background:transparent;color:#151518}
.pr-all{display:inline-flex;align-items:center;gap:6px;font-size:14.5px;color:var(--soft);border-bottom:1px solid var(--line-2);padding-bottom:3px}.pr-all:hover{color:var(--ink);border-color:var(--soft)}
.pr-rail{display:grid;grid-template-columns:1.12fr 1fr 1fr 1fr;column-gap:16px;row-gap:14px;align-items:center;margin:6px 0 16px;color:var(--dim)}
.pr-rail p{grid-column:1/-1;margin:0;font-size:clamp(17px,1.4vw,20px);color:var(--soft)}.pr-rail p b{color:var(--amber);font-weight:600}
.pr-rail span{display:flex;align-items:center;gap:10px;letter-spacing:.07em;text-transform:uppercase;font-size:11.5px;font-weight:600;padding-left:22px}
.pr-rail span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--line-2);flex:none}
.pr-rail span::after{content:"";flex:1;height:1px;margin-right:-38px;background:linear-gradient(90deg,var(--line-2),var(--line-2) 85%,transparent);-webkit-mask:linear-gradient(90deg,#000 calc(100% - 8px),transparent)}
.pr-rail span:first-of-type{color:var(--amber)}.pr-rail span:first-of-type::before{background:var(--amber);box-shadow:0 0 12px rgba(224,169,109,.6)}
.pr-rail span:first-of-type::after{background:linear-gradient(90deg,var(--amber),var(--line-2))}
.pr-rail span:last-of-type::after{display:none}.pr-rail span:last-of-type::before{background:none;border:1px dashed var(--dim)}
.pgrid{display:grid;grid-template-columns:1.12fr 1fr 1fr 1fr;gap:16px;align-items:stretch}
.pt{position:relative;display:flex;flex-direction:column;padding:24px 22px 22px;border-radius:20px;border:1px solid var(--line);background:linear-gradient(180deg,#141416,#0f0f11);min-width:0}
.pt-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px;min-height:26px}
.pt-tier{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--dim)}
.pt-badge{padding:4px 10px;border-radius:99px;font-size:11.5px;font-weight:600;background:rgba(224,169,109,.16);color:var(--amber);white-space:nowrap}
.pt h3{margin:0 0 14px;font-family:var(--font-text);font-weight:600;font-size:16.5px;line-height:1.3;min-height:2.6em}
.pt-price{font-family:var(--font-display);font-weight:500;font-size:clamp(24px,2.1vw,30px);letter-spacing:-.02em;line-height:1.1;white-space:nowrap}
.pt-price small{font-family:var(--font-text);font-size:14px;font-weight:400;color:var(--dim);margin-right:6px;letter-spacing:0}
.pt-term{display:flex;align-items:center;gap:6px;margin:8px 0 18px;font-size:13px;color:var(--dim)}
.pt ul{list-style:none;margin:0 0 22px;padding:16px 0 0;border-top:1px solid var(--line);display:grid;gap:9px;font-size:14px;line-height:1.45;color:var(--soft)}
.pt li{position:relative;padding-left:20px}.pt li::before{content:"";position:absolute;left:2px;top:.55em;width:8px;height:5px;border-left:1.5px solid var(--sage);border-bottom:1.5px solid var(--sage);transform:rotate(-45deg)}
.pt .btn{margin-top:auto;justify-content:center}
.pt0{border-color:rgba(224,169,109,.55);background:radial-gradient(120% 60% at 0% 0%,rgba(224,169,109,.2),transparent 60%),linear-gradient(180deg,#1c1913,#121110);box-shadow:0 30px 70px -35px rgba(224,169,109,.45),inset 0 1px 0 rgba(255,255,255,.06);transform:translateY(-8px)}
.pt0 .pt-tier{color:var(--amber)}.pt0 .pt-price{color:#fff3e2}
.pt3{border-style:dashed;border-color:var(--line-2);background:transparent}.pt3 .pt-price{color:var(--soft)}
.pgrid.swap .pt{animation:ptIn .55s cubic-bezier(.2,.9,.3,1.1) both;animation-delay:calc(var(--d) * 60ms)}
.pgrid.swap .pt0{animation-name:ptIn0}
@keyframes ptIn{from{opacity:0;transform:translateY(18px)}}
@keyframes ptIn0{from{opacity:0;transform:translateY(10px)}to{transform:translateY(-8px)}}
#prices .fine{margin-top:22px;font-size:13.5px;color:var(--dim)}
@media (max-width:1100px){.pgrid{grid-template-columns:1fr 1fr}.pt0{transform:none}@keyframes ptIn0{from{opacity:0;transform:translateY(18px)}}.pr-rail{display:none}.pt h3{min-height:0}}
@media (max-width:640px){
  .pgrid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 calc(-1 * var(--g));padding:10px var(--g) 14px;scrollbar-width:none}
  .pgrid::-webkit-scrollbar{display:none}
  .pt{flex:0 0 82%;scroll-snap-align:start}
  #prices .tabs{display:flex;border-radius:16px}#prices .tab{padding:10px 14px}.tab-ind{border-radius:12px}
}

/* ИИ-помощник */
.aic-btn{position:fixed;right:22px;bottom:22px;z-index:60;display:flex;align-items:center;gap:9px;padding:13px 18px 13px 15px;border-radius:99px;border:1px solid rgba(224,169,109,.35);background:rgba(18,17,15,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--ink);font-size:14.5px;font-weight:500;box-shadow:0 18px 40px -16px #000;transition:transform .35s cubic-bezier(.3,1.3,.4,1),border-color .3s,bottom .4s}
.aic-btn i{font-size:19px;color:var(--amber)}
.aic-btn:hover{transform:translateY(-2px);border-color:var(--amber)}
.aic-open .aic-btn{border-color:var(--amber)}
.aic{position:fixed;right:22px;bottom:84px;z-index:61;width:min(370px,calc(100vw - 24px));max-height:min(560px,calc(100vh - 180px));display:flex;flex-direction:column;border-radius:20px;border:1px solid var(--line-2);background:rgba(15,15,17,.94);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 40px 90px -30px #000;opacity:0;transform:translateY(14px) scale(.97);transform-origin:100% 100%;transition:opacity .25s,transform .35s cubic-bezier(.3,1.3,.4,1)}
.aic.in{opacity:1;transform:none}
.aic[hidden]{display:none}
.aic-h{display:flex;align-items:center;gap:12px;padding:14px 14px 12px 16px;border-bottom:1px solid var(--line)}
.aic-h>div{flex:1;min-width:0;display:grid;gap:1px}.aic-h b{font-size:14.5px;font-weight:600}.aic-h small{font-size:11.5px;line-height:1.35;color:var(--dim)}
.aic-av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;flex:none;font-family:var(--font-display);font-size:15px;color:#151518;background:linear-gradient(140deg,#f0d3a8,var(--amber))}
.aic-x{width:34px;height:34px;border-radius:50%;border:1px solid var(--line-2);background:transparent;color:var(--soft);display:grid;place-items:center;font-size:15px;flex:none}.aic-x:hover{color:var(--ink);border-color:var(--soft)}
.aic-log{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;min-height:120px;overscroll-behavior:contain}
.aic-m{max-width:86%;padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.5;animation:pop .3s}
.aic-m.bot{align-self:flex-start;background:#1c1c20;border-bottom-left-radius:4px;color:var(--ink)}
.aic-m.bot a{color:var(--amber);border-bottom:1px solid rgba(224,169,109,.4)}
.aic-m.me{align-self:flex-end;background:var(--cta);color:#151518;border-bottom-right-radius:4px}
.aic-m.typ{align-self:flex-start;background:#1c1c20;display:flex;gap:4px;padding:13px 14px}
.aic-m.typ i{width:6px;height:6px;border-radius:50%;background:var(--dim);animation:aicDot 1s infinite}.aic-m.typ i:nth-child(2){animation-delay:.15s}.aic-m.typ i:nth-child(3){animation-delay:.3s}
@keyframes aicDot{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.aic-q{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 12px;transition:opacity .3s}
.aic-q button{padding:7px 12px;border-radius:99px;border:1px solid var(--line-2);background:transparent;color:var(--soft);font-size:13px;transition:.25s}.aic-q button:hover{border-color:var(--amber);color:var(--ink)}
.aic-q.wait{opacity:.45;pointer-events:none}
.aic-in{display:flex;gap:8px;padding:10px 12px 12px;border-top:1px solid var(--line)}
.aic-in input{flex:1;min-width:0;padding:11px 14px;border-radius:99px;border:1px solid var(--line-2);background:#0b0b0d;color:var(--ink);font:inherit;font-size:14px}.aic-in input:focus{outline:none;border-color:var(--amber)}
.aic-in button{width:42px;height:42px;border-radius:50%;border:0;background:var(--cta);color:#151518;display:grid;place-items:center;font-size:17px;flex:none}
@media (max-width:800px){
  .aic-btn{bottom:84px;right:14px;padding:13px}.aic-btn span{display:none}
  .aic{right:12px;left:12px;width:auto;bottom:146px;max-height:calc(100vh - 220px)}
}
@media (prefers-reduced-motion:reduce){.ab-p,.aic-m.typ i{animation:none}.aic,.tab-ind{transition:none}}

/* финал: форма с выбором «что нужно» и состоянием «принято» */
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.f-need{border:0;margin:0;padding:0;min-width:0;display:grid;gap:10px}
.f-need legend{padding:0;margin-bottom:10px;font-size:13px;color:var(--soft);font-weight:500}
#needChips button{padding:9px 14px;border-radius:99px;border:1px solid var(--line-2);background:transparent;color:var(--soft);font-size:13.5px;transition:.25s}
#needChips button:hover{border-color:var(--soft);color:var(--ink)}
#needChips button[aria-pressed=true]{background:var(--sage);border-color:var(--sage);color:#10110e;font-weight:600}
.form.done>*:not(.res){display:none}
.form.done .res{display:grid;justify-items:start;gap:8px;padding:8px 4px;border:0;background:none;animation:pop .45s}
.form.done .res i{font-size:42px;color:var(--sage)}
.form.done .res b{font-family:var(--font-display);font-weight:500;font-size:24px;color:var(--ink)}
.form.done .res span{color:var(--soft);line-height:1.55}.form.done .res small{color:var(--dim);font-size:12.5px}
.form.done .res .btn{margin-top:8px}
.legal{gap:10px 24px;flex-wrap:wrap}
@media (max-width:520px){.f-row{grid-template-columns:1fr}}
.final .hd.big{font-size:clamp(34px,3.9vw,58px);line-height:1.08}
.ab-fb svg{display:none}.ab-fb b{margin:0}
.ab-fb::after{content:"фото Егора";position:absolute;top:18px;left:18px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.menu a{white-space:nowrap}
@media (max-width:1320px){.menu a{padding:8px 10px;font-size:13.5px}}
@media (max-width:1100px){.pr-rail{display:block}.pr-rail span{display:none}}
@media (max-width:800px){.aic-btn{bottom:16px}body:has(.msticky.show) .aic-btn{bottom:84px}.aic{bottom:78px}body:has(.msticky.show) .aic{bottom:146px}}
/* шрифты: выбор владельца — Dela Gothic One + Manrope */
:root{--font-display:'Dela Gothic One',system-ui,sans-serif;--font-text:'Manrope',system-ui,sans-serif}
.h1,.hd,.pt-price,.ab-cap b,.ab-fb b,.form.done .res b,.mnav nav a{font-weight:400;letter-spacing:-.01em}

/* ===== Первый экран v3: без стеклянной карточки и засветов — строгий типографский блок ===== */
.hero-txt::before,.hero-txt::after{content:none!important}
@media (min-width:1181px){
  /* читаемость даёт ровное затемнение сцены слева, без пятен света */
  .hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,var(--bg) 0,rgba(8,8,9,.9) 30%,rgba(8,8,9,.5) 44%,rgba(8,8,9,0) 56%)}
}
.hero-txt .eyebrow{display:flex;justify-content:space-between;gap:16px;max-width:600px;margin:0 0 30px;padding-bottom:12px;border-bottom:1px solid var(--line-2);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hero-txt .eyebrow span:first-child{color:var(--ink);font-weight:600}
.hero-txt .lead{max-width:520px;margin:26px 0 30px;font-size:clamp(16px,1.25vw,18.5px);line-height:1.6;color:#d4d4da}
.terms{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;margin:0 0 34px;padding:0;max-width:600px;border-top:1px solid var(--line-2)}
.terms>div{padding:14px 28px 0 0;margin-right:28px;border-right:1px solid var(--line)}
.terms>div:last-child{border-right:0;margin-right:0;padding-right:0}
.terms dt{font-family:var(--font-display);font-size:20px;line-height:1.2;color:var(--ink);white-space:nowrap}
.terms dd{margin:4px 0 0;font-size:13px;color:var(--muted);white-space:nowrap}
.hero-cta{display:flex;align-items:center;gap:28px;flex-wrap:wrap;margin-bottom:22px}
.tlink{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;color:var(--ink);padding-bottom:4px;border-bottom:1px solid var(--line-2);transition:border-color .25s,gap .25s}
.tlink:hover{border-color:var(--ink);gap:12px}
.hero-txt .micro{font-size:13px;color:var(--dim)}.hero-txt .micro a{color:var(--soft);text-decoration:underline;text-underline-offset:3px}
@media (max-width:800px){
  .hero-txt .eyebrow{flex-direction:column;gap:2px;margin-bottom:22px}
  .terms{grid-template-columns:1fr;max-width:none}
  .terms>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:11px 0;margin:0;border-right:0;border-bottom:1px solid var(--line)}
  .terms dt{font-size:17px}.terms dd{margin:0}
  .hero-cta{gap:20px}.hero-cta .btn{flex:none;min-width:0}
}

/* лента сфер v3: без превью, подпись «Делаем для» — отдельный сплошной блок, строка под неё не заезжает */
.marq{display:flex;align-items:center;padding:0;height:58px}
.mq .th{display:none}
.marq-l{position:relative;z-index:2;align-self:stretch;flex:none;padding:0 26px 0 var(--g);background:var(--tone,#080809);border-right:1px solid rgba(255,255,255,.1);font-size:11.5px;letter-spacing:.14em;color:var(--soft);font-weight:600}
.marq-l::after{content:"";position:absolute;left:100%;top:0;bottom:0;width:48px;background:linear-gradient(90deg,var(--tone,#080809),transparent);pointer-events:none}
.marq-t{font-size:18px;color:#d6d6dc}
.mq{gap:0;padding:0 0 0 0}
.mq b{font-weight:400}
.mq i{width:auto;height:auto;border-radius:0;background:none;margin:0 22px;color:#4d4d55}
.mq i::before{content:"/"}
@media (max-width:800px){.marq{height:48px}.marq-l{display:flex;padding:0 16px 0 var(--g);font-size:10px}.marq-t{font-size:15px}.mq i{margin:0 14px}}
.marq-l{color:var(--amber);font-size:12px;border-right-color:rgba(255,255,255,.14)}
.marq-l::after{width:110px;background:linear-gradient(90deg,var(--tone,#080809) 15%,transparent)}
@media (max-width:800px){.marq-l::after{width:60px}}
/* лента сфер: без подписи, края мягко гаснут с обеих сторон */
.marq-l{display:none!important}
.marq{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%)}
@media (max-width:800px){.marq{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%)}}

/* ===== «Как мы работаем» v2: номера на линии, фокус на активном шаге, ровные иллюстрации ===== */
.pm-steps{counter-reset:pm}
.pm-step{counter-increment:pm}
.pm-step::before{content:counter(pm);width:28px;height:28px;margin-left:-14px;top:-103px;display:grid;place-items:center;font:400 12px/1 var(--font-display);color:#8b8478;background:#151311;border:1.5px solid #4c463f;z-index:2}
.pm-step.on::before,.pm-step.done::before{color:#141510;background:var(--sage);border-color:var(--sage)}
.pm-step.on::before{box-shadow:0 0 0 6px rgba(183,197,158,.14)}
.pm-n{display:none}
.pm-step h3{margin-bottom:8px}
.pm-step h3,.pm-step p{transition:opacity .45s}
.pm-run.pinned .pm-step:not(.on) .pm-vis{opacity:.42;filter:saturate(.55)}
.pm-run.pinned .pm-step:not(.on) h3,.pm-run.pinned .pm-step:not(.on) p{opacity:.45}
.pm-vis{transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.3,1),filter .5s,box-shadow .5s;border:1px solid rgba(255,255,255,.05)}
.pm-run.pinned .pm-step.on .pm-vis{border-color:rgba(183,197,158,.28);box-shadow:0 30px 60px -30px #000,inset 0 1px 0 rgba(255,255,255,.06)}
.pm-fact{display:block;font-size:14px;line-height:1.5;color:var(--muted)}
/* иллюстрации целиком в карточке, без обрезанных кнопок и переносов цен */
.pv-win{left:7%;right:7%;top:12%;bottom:-8%}
.pv-site h6{font-size:15px}
.pv-doc{top:9%;bottom:7%;left:8%;width:62%;padding:13px 15px}
.pv-doc ul{gap:6px;margin-bottom:9px}.pv-doc li{font-size:11.5px;line-height:1.3}
.pv-dh b{font-size:13px}
.pv-sum b{font-size:13.5px;white-space:nowrap}
.pv-note{right:6%;top:14%;width:112px}.pv-note b{white-space:nowrap;font-size:13px}
.pm-tag{top:44px}.pm-str{top:-19px;height:24px}
.pm-h{margin-bottom:clamp(30px,4.5vh,56px)}
.pm-track[data-mode=stack] .pm-n{display:block}

/* ===== «Как мы работаем» v3: сцены «на столе» вместо плоских карточек ===== */
.pm-step:nth-child(1) .pm-vis{--tint:46,94,70}.pm-step:nth-child(2) .pm-vis{--tint:224,169,109}.pm-step:nth-child(3) .pm-vis{--tint:233,191,134}.pm-step:nth-child(4) .pm-vis{--tint:183,197,158}
.pm-vis{background:radial-gradient(90% 70% at 50% 0%,rgba(var(--tint),.16),transparent 70%),linear-gradient(180deg,#1d1b19,#141312)}
.sc{overflow:hidden}
.sc-desk{position:absolute;left:-10%;right:-10%;bottom:0;height:30%;background:linear-gradient(180deg,#2a2622,#1a1816 70%);box-shadow:inset 0 1px 0 rgba(255,255,255,.07);transform:perspective(400px) rotateX(28deg);transform-origin:50% 100%}
.sc-desk::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0 2px,transparent 2px 9px);opacity:.8}
.sc .pv-win{box-shadow:0 2px 0 rgba(255,255,255,.4) inset,0 28px 40px -18px rgba(0,0,0,.9),0 4px 10px rgba(0,0,0,.35)}
/* телефон */
.sc-phone{position:absolute;z-index:3;border-radius:20px;padding:5px;background:linear-gradient(145deg,#3a3835,#121110);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),0 26px 34px -14px rgba(0,0,0,.95),0 3px 6px rgba(0,0,0,.4)}
.sc-scr{height:100%;border-radius:15px;overflow:hidden;background:#151a16;padding:22px 9px 9px;display:flex;flex-direction:column;gap:7px;position:relative}
.sc-scr::before{content:"";position:absolute;top:7px;left:50%;width:34%;height:7px;margin-left:-17%;border-radius:9px;background:#050505}
/* шаг 1: сайт в окне + телефон с сообщением Егора */
.pv1.sc .pv-win{left:6%;top:9%;right:auto;bottom:auto;width:74%;height:66%;transform:perspective(900px) rotateY(9deg) rotateX(3deg);transform-origin:0 50%}
.pv1.sc .pv-site h6{font-size:13.5px}.pv1.sc .pv-chips{display:none}
.pv1 .sc-phone{right:6%;bottom:6%;width:31%;height:74%}
.sc-chat-h{font-size:9.5px;color:#9fb08a;text-align:center;letter-spacing:.02em}
.sc .pv-msg{position:static;width:auto;display:block;padding:8px 9px;border-radius:12px 12px 12px 4px;background:#2b3327;color:#eef2e6;font-size:10.5px;line-height:1.35;box-shadow:none}
.sc .pv-msg b{font-size:10.5px;color:#fff;margin-bottom:2px}.sc .pv-msg small{display:block;text-align:right;font-size:8.5px;color:#8fa07b;margin-top:2px}
.sc-react{align-self:flex-end;font-size:9.5px;background:#3f6b4f;color:#fff;padding:5px 8px;border-radius:12px 12px 4px 12px;animation:pvMsg 7s 1.4s infinite both}
/* шаг 2: ТЗ на столе с зажимом, стикер на скотче, ручка */
.pv2.sc .pv-doc{left:9%;top:8%;bottom:auto;height:80%;width:56%;transform:rotate(-3deg);border-radius:3px;background:#f3efe6 repeating-linear-gradient(180deg,transparent 0 21px,rgba(60,50,30,.035) 21px 22px);box-shadow:0 26px 30px -16px rgba(0,0,0,.95),0 2px 4px rgba(0,0,0,.3)}
.sc-clip{position:absolute;top:-9px;left:50%;width:42px;height:16px;margin-left:-21px;border-radius:3px 3px 5px 5px;background:linear-gradient(180deg,#5b5b60,#2a2a2e);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 3px 5px rgba(0,0,0,.4)}
.sc-clip::after{content:"";position:absolute;left:8px;right:8px;top:-7px;height:9px;border:2px solid #9a9aa0;border-bottom:0;border-radius:6px 6px 0 0}
.pv2.sc .pv-note{right:7%;top:20%;width:30%;min-width:96px;transform:rotate(7deg);background:#f2cf74 linear-gradient(180deg,rgba(255,255,255,.25),transparent 40%);box-shadow:0 16px 20px -10px rgba(0,0,0,.8)}
.sc-tape{position:absolute;top:-8px;left:50%;width:46px;height:15px;margin-left:-23px;transform:rotate(-4deg);background:rgba(240,236,224,.55);box-shadow:0 1px 2px rgba(0,0,0,.15)}
.sc-pen{position:absolute;right:8%;bottom:11%;width:44%;height:8px;border-radius:5px;transform:rotate(-16deg);background:linear-gradient(90deg,#c9a46a 0 9%,#1c1c1f 9% 86%,#7f7f86 86% 90%,#1c1c1f 90%);box-shadow:0 6px 8px -3px rgba(0,0,0,.8);z-index:3}
/* шаг 3: телефон со счётом и бумажный чек */
.pv3.sc{display:block;padding:0}
.pv3 .sc-phone-c{left:12%;top:6%;width:44%;height:104%}
.pv3 .sc-scr{padding-top:22px;gap:6px}
.sc .pv-stage{padding:6px 8px;font-size:10px;border-radius:8px;background:#232821}.sc .pv-stage b{font-size:9px;padding:2px 7px}
.sc .pv-inv{padding:8px 9px;gap:5px;border-radius:9px;box-shadow:none}
.sc .pv-ih{font-size:10px}.sc .pv-ih small{font-size:8.5px}
.sc .pv-is{font-size:9.5px}.sc .pv-is b{font-size:15px;white-space:nowrap}
.sc .pv-pay{font-size:10px;padding:6px}
.sc .pv-steps{gap:4px}.sc .pv-steps span{font-size:9px;padding:3px 0;background:#232821}
.sc-receipt{position:absolute;right:8%;top:16%;width:31%;padding:11px 10px 16px;display:grid;gap:3px;background:#f6f3ec;color:#3a362f;font-size:9.5px;transform:rotate(5deg);box-shadow:0 18px 22px -12px rgba(0,0,0,.9);
  -webkit-mask:linear-gradient(#000,#000) top/100% calc(100% - 6px) no-repeat,conic-gradient(from 135deg at 50% 0,#000 90deg,#0000 0) bottom/10px 6px repeat-x;mask:linear-gradient(#000,#000) top/100% calc(100% - 6px) no-repeat,conic-gradient(from 135deg at 50% 0,#000 90deg,#0000 0) bottom/10px 6px repeat-x}
.sc-receipt b{font:400 12px var(--font-display);letter-spacing:.08em}
.sc-receipt span{color:#7a7366;border-bottom:1px dashed #cfc8b9;padding-bottom:3px}
.sc-receipt em{font-style:normal;font:400 13px var(--font-display);text-align:right;white-space:nowrap;margin-top:3px}
/* шаг 4: опубликованный сайт, заявка и ключ с биркой «Доступы» */
.pv4.sc{display:block;padding:0}
.pv4.sc .pv-win{left:6%;top:8%;right:auto;bottom:auto;width:72%;height:60%}
.pv4.sc .pv-bar span{display:flex;align-items:center;gap:4px}
.sc-pub{margin-left:auto;font-style:normal;font-size:9px;color:#4f7a3f}
.pv4.sc .pv-site h6{font-size:14px}
.pv4.sc .pv-lead{position:absolute;right:5%;top:30%;width:52%;padding:8px 10px;gap:8px;z-index:3;box-shadow:0 18px 24px -10px rgba(0,0,0,.85)}
.pv4.sc .pv-lead b{font-size:11px}.pv4.sc .pv-lead span{font-size:10px}
.sc-key{position:absolute;left:10%;bottom:9%;z-index:3;display:flex;align-items:center;transform:rotate(-8deg);filter:drop-shadow(0 8px 6px rgba(0,0,0,.7))}
.sc-ring{width:26px;height:26px;border-radius:50%;border:5px solid #c9b78f;background:transparent;box-shadow:inset 0 1px 1px rgba(255,255,255,.4)}
.sc-shaft{width:46px;height:7px;margin-left:-2px;border-radius:0 2px 2px 0;background:linear-gradient(180deg,#e2d2ad,#a8956d);-webkit-mask:linear-gradient(#000,#000) top/100% 4px no-repeat,repeating-linear-gradient(90deg,#000 0 5px,#0000 5px 8px) bottom/100% 3px no-repeat;mask:linear-gradient(#000,#000) top/100% 4px no-repeat,repeating-linear-gradient(90deg,#000 0 5px,#0000 5px 8px) bottom/100% 3px no-repeat}
.sc-ktag{margin-left:10px;display:grid;padding:6px 9px;border-radius:4px;background:#d6e1bf;color:#1f2a17;font:400 11px var(--font-display);transform:rotate(12deg)}
.sc-ktag small{font:500 8.5px var(--font-text);color:#4b5a3c;margin-top:1px}

/* ===== линия шагов v2: желоб, заливка с «головой», бирка на бечёвке с люверсом ===== */
.pm-line{height:6px;top:8px;border-radius:6px;background:#141210;box-shadow:inset 0 1px 2px rgba(0,0,0,.9),0 1px 0 rgba(255,255,255,.06);overflow:visible}
.pm-line b{border-radius:6px;background:linear-gradient(90deg,#8fa077,var(--sage) 60%,#d8e3c0)}
.pm-head{position:absolute;left:0;top:11px;width:0;height:0;pointer-events:none}
.pm-head::before{content:"";position:absolute;left:-9px;top:-9px;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle,rgba(216,227,192,.9),rgba(183,197,158,.25) 45%,transparent 70%)}
.pm-step::before{width:32px;height:32px;margin-left:-16px;top:-105px;background:radial-gradient(circle at 35% 30%,#2a2724,#141210);border:1px solid #4a443d;box-shadow:0 4px 10px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.08)}
.pm-step.done::before{background:radial-gradient(circle at 35% 30%,#d8e3c0,#9fb085);border-color:#c4d1aa;color:#1c2216}
.pm-step.on::before{background:radial-gradient(circle at 35% 30%,#eef3e2,#b7c59e);border-color:#eef3e2;color:#1c2216;box-shadow:0 0 0 5px rgba(183,197,158,.16),0 0 0 11px rgba(183,197,158,.06),0 6px 14px rgba(0,0,0,.6)}
.pm-tag{top:46px}
.pm-str{top:-21px;height:28px;width:3px;margin-left:-1.5px;border-radius:2px;background:repeating-linear-gradient(160deg,#cbb98f 0 2px,#8f7c56 2px 4px);box-shadow:0 1px 2px rgba(0,0,0,.5)}
.pm-face{border-radius:0 0 6px 6px}
.pm-face::before{content:"";position:absolute;left:50%;top:5px;width:12px;height:12px;margin-left:-6px;border-radius:50%;border:2.5px solid #b7ab92;box-sizing:border-box;box-shadow:inset 0 1px 1px rgba(0,0,0,.3),0 1px 0 rgba(255,255,255,.6)}
.pm-face::after{content:"";position:absolute;inset:5px;border:1px dashed rgba(40,32,20,.22);clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%,0 16px);pointer-events:none}
.pm-f{background-color:#f1ebdd}
.pv1.sc .pv-win{width:66%}
.pv1 .sc-phone{width:38%;right:5%}
.pv3 .sc-phone-c{left:7%;width:56%}
.sc-receipt{right:5%;width:30%;top:22%}
.pv3 .pv-stage span{white-space:nowrap}
.pv4.sc .pv-bar span{font-size:9.5px;white-space:nowrap;margin-left:6px}
.pv4.sc .pv-bar .sc-pub{display:none}
.pv4.sc .pv-lead{top:34%}
.pm-track[data-mode=stack] .pm-tag{margin-left:6px;margin-right:auto}

/* ===== #model v4: линейка с кареткой, бирка на шнуре, четыре талона одной планкой ===== */
.pm-track{padding-top:180px}
.pm-rail{height:180px;top:0;z-index:5}
.pm-rule{position:absolute;top:0;left:calc(var(--x0,12%) - 90px);width:calc(var(--x3,88%) - var(--x0,12%) + 180px);height:36px;border-radius:5px;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.028) 0 1px,transparent 1px 2px,rgba(0,0,0,.05) 2px 3px),linear-gradient(180deg,#8a8378 0%,#686258 30%,#4c4740 78%,#3a3631 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -2px 0 rgba(0,0,0,.45),0 1px 0 rgba(0,0,0,.7),0 20px 30px -16px rgba(0,0,0,.9)}
.pm-rule::before,.pm-rule::after{content:"";position:absolute;top:13px;left:22px;width:10px;height:10px;border-radius:50%;transform:rotate(38deg);
  background:linear-gradient(90deg,transparent 4px,rgba(0,0,0,.6) 4px 6px,transparent 6px),radial-gradient(circle at 40% 35%,#9c968b,#5a554e 70%);box-shadow:inset 0 -1px 1px rgba(0,0,0,.5),0 1px 0 rgba(255,255,255,.12)}
.pm-rule::after{left:auto;right:22px;transform:rotate(-62deg)}
.pm-ticks{position:absolute;top:0;left:90px;width:calc(var(--x3,88%) - var(--x0,12%) + 1px);height:12px;filter:drop-shadow(1px 0 0 rgba(255,255,255,.1));
  background:linear-gradient(90deg,rgba(16,14,12,.95) 0 1px,transparent 0) 0 0/var(--seg,25%) 12px repeat-x,linear-gradient(90deg,rgba(16,14,12,.8) 0 1px,transparent 0) 0 0/calc(var(--seg,25%) / 4) 8px repeat-x,linear-gradient(90deg,rgba(16,14,12,.6) 0 1px,transparent 0) 0 0/calc(var(--seg,25%) / 20) 4px repeat-x}
.pm-groove{position:absolute;left:90px;right:90px;top:27px;height:4px;border-radius:2px;background:#161412;box-shadow:inset 0 1px 1px rgba(0,0,0,.9),0 1px 0 rgba(255,255,255,.09);overflow:hidden}
.pm-groove b{display:block;height:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(180deg,#c9d3b1,#8d9a72)}
.pm-st{position:absolute;top:13px;transform:translateX(-50%);display:flex;gap:6px;align-items:baseline;font:700 9.5px/1 var(--font-text),Manrope,sans-serif;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;
  color:#1b1915;text-shadow:0 1px 0 rgba(255,255,255,.16);transition:color .5s,text-shadow .5s}
.pm-st b{font:400 10px/1 var(--font-display);letter-spacing:.02em}
.pm-st.done{color:#26301b;text-shadow:0 1px 0 rgba(255,255,255,.16)}.pm-st.done b{color:#3d4a2c}
.pm-st.on{color:#f6f1e6;text-shadow:0 -1px 0 rgba(0,0,0,.55)}
.pm-cart{position:absolute;top:29px;left:-27px;width:54px;height:22px;z-index:2;border-radius:3px 3px 9px 9px;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 1px,transparent 1px 3px),linear-gradient(180deg,#a7a094 0%,#6d675e 45%,#4a4640 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 0 rgba(0,0,0,.5),0 10px 14px -6px rgba(0,0,0,.85)}
.pm-cart::before{content:"";position:absolute;left:50%;top:-11px;width:1px;height:11px;margin-left:-.5px;background:#efe9dc;opacity:.85}
.pm-wh{position:absolute;top:5px;left:6px;width:11px;height:11px;border-radius:50%;
  background:linear-gradient(90deg,transparent 4.5px,rgba(0,0,0,.65) 4.5px 6.5px,transparent 6.5px),radial-gradient(circle,#d9d2c4 0 28%,#837d73 32% 62%,#3a3631 66%);box-shadow:0 1px 0 rgba(255,255,255,.18)}
.pm-wh+.pm-wh{left:auto;right:6px}
.pm-eye{position:absolute;left:50%;bottom:-6px;width:10px;height:10px;margin-left:-5px;border-radius:50%;border:2px solid #8d877c;box-shadow:0 1px 1px rgba(0,0,0,.6)}
.pm-cord{position:absolute;left:0;top:0;width:100%;height:180px;overflow:visible;z-index:3;pointer-events:none}
.pm-cord path{fill:none;stroke-linecap:round}
.pm-cord-s{stroke:rgba(0,0,0,.45);stroke-width:3;transform:translate(2px,3px)}
.pm-cord-l{stroke:#cdbf9f;stroke-width:1.7}
.pm-track:not([data-mode=stack]) .pm-tag{top:-11px;left:-76px;transform-origin:50% 11px;transition:none;z-index:7}
/* талоны: одна планка, четыре отрывных секции */
.pm-steps{gap:0;border-radius:18px;background:#191715;border:1px solid #2b2723;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 40px 70px -40px #000;overflow:hidden}
.pm-step{display:flex;flex-direction:column;padding:16px 14px 0;transition:background .5s}
.pm-step::before{content:"";left:0;top:16px;bottom:58px;width:1px;height:auto;margin:0;border:0;border-radius:0;box-shadow:none;background:radial-gradient(circle,#4a443c 0 1px,transparent 1.4px) 0 0/1px 6px repeat-y;z-index:1}
.pm-step.on::before,.pm-step.done::before{background:radial-gradient(circle,#4a443c 0 1px,transparent 1.4px) 0 0/1px 6px repeat-y;border:0;box-shadow:none}
.pm-step:first-child::before{content:none}
.pm-step.on{background:linear-gradient(180deg,#25221e,#1d1b18)}
.pm-step::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:#efe9dc;opacity:0;transition:opacity .5s}
.pm-step.on::after{opacity:.5}
.pm-top{display:flex;justify-content:space-between;align-items:flex-end;margin:0 2px 12px}
.pm-num{font:400 40px/.85 var(--font-display);letter-spacing:-.02em;color:#242019;text-shadow:0 1px 0 rgba(255,255,255,.07),0 -1px 0 rgba(0,0,0,.85);transition:color .5s}
.pm-step.done .pm-num{color:#7e8a69}.pm-step.on .pm-num{color:#efe9dc}
.pm-stat em{display:none;font:700 10px/1 var(--font-text),Manrope,sans-serif;font-style:normal;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);align-items:center;gap:7px}
.pm-stat em::before{content:"";width:6px;height:6px;border:1px solid currentColor}
.pm-step .s-next,.pm-step.done .s-done,.pm-step.on .s-on{display:inline-flex}
.pm-step.done .s-next,.pm-step.on .s-next{display:none}
.pm-step.done .s-done{color:#a6b48a}.pm-step.done .s-done::before{background:currentColor}
.pm-step.on .s-on{color:#efe9dc}.pm-step.on .s-on::before{background:var(--sage);border-color:var(--sage)}
.pm-vis{height:clamp(170px,25vh,240px);margin:0 0 14px;border-radius:12px;border:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),0 14px 24px -16px #000}
.pm-run.pinned .pm-step.on .pm-vis{transform:none;border:0;box-shadow:inset 0 0 0 1px rgba(239,233,220,.16),0 18px 30px -16px #000}
.pm-run.pinned .pm-step:not(.on) .pm-vis{opacity:.55}
.pm-txt{flex:1;padding:0 2px 16px}
.pm-step p{font-size:14.5px}
.pm-run.pinned .pm-step:not(.on) .pm-txt{opacity:.5}.pm-run.pinned .pm-step:not(.on) h3,.pm-run.pinned .pm-step:not(.on) p{opacity:1}
.pm-txt{transition:opacity .45s}
.pm-stub{position:relative;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:10px;margin:0 -14px;padding:13px 16px 14px;
  background:radial-gradient(circle,#4a443c 0 1px,transparent 1.4px) 0 0/6px 1px repeat-x;transition:background-color .5s,color .5s}
.pm-stub span{font:700 9.5px/1.2 var(--font-text),Manrope,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);white-space:nowrap}
.pm-stub b{font-weight:600;font-size:13.5px;color:var(--soft);text-align:right;line-height:1.25}
.pm-step.on .pm-stub{background-color:#efe9dc}.pm-step.on:nth-child(3) .pm-stub{background-color:#e9bf86}.pm-step.on:nth-child(4) .pm-stub{background-color:#d6e1bf}
.pm-step.on .pm-stub span{color:rgba(25,23,20,.62)}.pm-step.on .pm-stub b{color:#191714}
.pm-step.done .pm-stub b{color:#a6b48a}
/* узкие экраны: талоны расходятся в отдельные карточки, бирка липкая */
.pm-track[data-mode=stack] .pm-steps{gap:16px;background:none;border:0;box-shadow:none;border-radius:0;overflow:visible}
.pm-track[data-mode=stack] .pm-step{border-radius:16px;background:#191715;border:1px solid #2b2723;overflow:hidden}
.pm-track[data-mode=stack] .pm-step.on{background:linear-gradient(180deg,#25221e,#1d1b18)}
.pm-track[data-mode=stack] .pm-step::before{display:none}
@media (min-width:1000px) and (max-width:1279px){.pm-num{font-size:34px}.pm-stub b{font-size:12.5px}.pm-st{font-size:8.5px;letter-spacing:.12em}}
@media (max-width:620px){.pm-vis{height:220px}}
@media (prefers-reduced-motion:reduce){.pm-step,.pm-stub,.pm-num,.pm-st{transition:none}}
/* метки на линейке: читаемый размер и контраст (гравировка на светлой стали) */
.pm-st{font-size:11px;letter-spacing:.12em;color:#2b2925;text-shadow:0 1px 0 rgba(255,255,255,.22)}
.pm-st b{font-size:12px}
.pm-st.done{color:#2d3a20}.pm-st.done b{color:#2d3a20}
.pm-st.on{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7)}
@media (min-width:1000px) and (max-width:1279px){.pm-st{font-size:10px}}
/* закреплённый блок: контент всегда ниже шапки-капсулы */
.pm-run.pinned .pm-pin{padding-top:92px;padding-bottom:16px}
.pm-run.pinned .pm-vis{height:clamp(170px,25vh,250px)}
@media (max-height:900px){.pm-run.pinned .pm-h{margin-bottom:18px}.pm-run.pinned .pm-h .hd{font-size:clamp(28px,2.9vw,44px)}}

/* ===== #model v4.1: линейка над талонами со смыслом (зоны оплаты), талоны — отдельные билеты с вырезами ===== */
.pm-track{padding-top:194px}
.pm-rail{height:194px}.pm-cord{height:194px}
.pm-rule{left:0;width:100%;height:46px}
.pm-ticks{left:var(--x0,12%)}
.pm-st{top:14px}
.pm-zone{position:absolute;top:27px;height:12px;display:grid;place-items:center;font:700 7.5px/1 var(--font-text),Manrope,sans-serif;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;overflow:hidden;
  box-shadow:inset 0 1px 1px rgba(0,0,0,.45),0 1px 0 rgba(255,255,255,.1);transition:opacity .5s}
.pm-zone.z1{left:var(--x0,12%);width:calc(var(--xb,50%) - var(--x0,12%));background:rgba(239,233,220,.62);color:#2b2721;border-radius:2px 0 0 2px}
.pm-zone.z2{left:var(--xb,50%);width:calc(var(--x3,88%) - var(--xb,50%));background:rgba(233,191,134,.7);color:#3d2b12;border-radius:0 2px 2px 0}
.pm-rule:not(.pay) .z2,.pm-rule.pay .z1{opacity:.42}
.pm-zb{position:absolute;top:0;bottom:0;left:var(--xb,50%);width:12px;margin-left:-6px}
.pm-zb::before{content:"";position:absolute;left:0;top:0;width:12px;height:8px;background:#1e1c19;clip-path:polygon(0 0,100% 0,50% 100%)}
.pm-zb::after{content:"";position:absolute;left:5.5px;top:6px;bottom:4px;width:1px;background:rgba(18,16,13,.95);box-shadow:1px 0 0 rgba(255,255,255,.14)}
.pm-groove{left:var(--x0,12%);right:auto;width:calc(var(--x3,88%) - var(--x0,12%));top:41px;height:3px}
.pm-cart{top:40px}
.pm-gd{position:absolute;top:47px;height:146px;width:1px;margin-left:-.5px;background:repeating-linear-gradient(180deg,rgba(255,255,255,.14) 0 2px,transparent 2px 6px);transition:background .5s}
.pm-gd::after{content:"";position:absolute;left:-3px;bottom:0;width:7px;height:1px;background:inherit;background:rgba(255,255,255,.2)}
.pm-gd.done{background:repeating-linear-gradient(180deg,rgba(166,180,138,.4) 0 2px,transparent 2px 6px)}
.pm-gd.on{background:repeating-linear-gradient(180deg,rgba(239,233,220,.55) 0 2px,transparent 2px 6px)}
/* билеты */
.pm-steps{gap:14px;background:none;border:0;box-shadow:none;border-radius:0;overflow:visible}
.pm-step,.pm-step.on{padding:0;background:none;filter:drop-shadow(0 16px 18px rgba(0,0,0,.5));transition:transform .55s cubic-bezier(.2,.8,.3,1),filter .55s,opacity .5s}
.pm-step::before,.pm-step::after,.pm-step.on::before,.pm-step.done::before{content:none}
.pm-tk{--st:47px;position:relative;height:100%;display:flex;flex-direction:column;padding:16px 14px 0;border-radius:14px;overflow:hidden;background:var(--tkb);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),inset 0 1px 0 rgba(255,255,255,.08);transition:background .5s,box-shadow .5s;
  -webkit-mask:radial-gradient(circle 9px at 0 calc(100% - var(--st)),#0000 96%,#000),radial-gradient(circle 9px at 100% calc(100% - var(--st)),#0000 96%,#000);-webkit-mask-composite:source-in;
  mask:radial-gradient(circle 9px at 0 calc(100% - var(--st)),#0000 96%,#000),radial-gradient(circle 9px at 100% calc(100% - var(--st)),#0000 96%,#000);mask-composite:intersect}
.pm-step:nth-child(1){--tkb:linear-gradient(180deg,#201e1a,#1a1816)}
.pm-step:nth-child(2){--tkb:linear-gradient(180deg,#1f1d1b,#191816)}
.pm-step:nth-child(3){--tkb:linear-gradient(180deg,#221e19,#1b1814)}
.pm-step:nth-child(4){--tkb:linear-gradient(180deg,#1e1f1b,#181916)}
.pm-step.on{transform:translateY(-8px);filter:drop-shadow(0 28px 26px rgba(0,0,0,.7)) drop-shadow(0 2px 3px rgba(0,0,0,.5))}
.pm-step.on .pm-tk{background:linear-gradient(180deg,#2d2923,#221f1b);box-shadow:inset 0 0 0 1px rgba(239,233,220,.26),inset 0 1px 0 rgba(255,255,255,.14)}
.pm-step.done{transform:translateY(3px);filter:drop-shadow(0 3px 5px rgba(0,0,0,.5))}
.pm-step.done .pm-tk{background:linear-gradient(180deg,#191816,#151412);box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),inset 0 2px 4px rgba(0,0,0,.35)}
.pm-step:not(.on):not(.done){opacity:.8}
.pm-stub{height:var(--st);flex-wrap:nowrap;align-items:center;padding:0 16px;margin:0 -14px;background:rgba(0,0,0,.2)}
.pm-stub::before{content:"";position:absolute;left:13px;right:13px;top:-1px;height:1px;background:radial-gradient(circle,#5a534a 0 1px,transparent 1.4px) 0 0/6px 1px repeat-x}
.pm-stub b{white-space:nowrap}
.pm-track[data-mode=stack] .pm-step,.pm-track[data-mode=stack] .pm-step.on{background:none;border:0;border-radius:0;overflow:visible}
@media (min-width:1000px) and (max-width:1279px){.pm-zone{font-size:6.5px;letter-spacing:.14em}}
@media (prefers-reduced-motion:reduce){.pm-step,.pm-tk,.pm-gd,.pm-zone{transition:none}}
.pm-ticks{left:40px;width:calc(100% - 80px);background-position-x:calc(var(--x0,12%) - 40px)}
.pm-zone{height:13px;font-size:8px;top:26px}
/* полоски прогресса и подсказка под 3D-сценой убраны (стойкой управляют кнопки на столе); для экранных дикторов блок остаётся */
.has-3d .hero-bar{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap;margin:-1px;padding:0;border:0}

/* ===== #model v5: спокойнее — тонкая линейка, зоны оплаты как главный смысл, один акцент (охра) ===== */
.pm-track{padding-top:178px}
.pm-rail{height:178px}.pm-cord{height:178px}
.pm-gd,.pm-groove,.pm-wh,.pm-cart::before{display:none}
.pm-rule{top:30px;height:20px;border-radius:3px;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 2px,rgba(0,0,0,.05) 2px 3px),linear-gradient(180deg,#8f897f 0%,#6f6a62 45%,#57534c 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(0,0,0,.35),0 1px 0 rgba(0,0,0,.6),0 12px 20px -12px rgba(0,0,0,.9)}
/* потайные винты: купол, крестовой шлиц, кольцо-зенковка */
.pm-rule::before,.pm-rule::after{top:4px;left:12px;width:12px;height:12px;border-radius:50%;transform:rotate(22deg);
  background:linear-gradient(90deg,transparent 5.25px,rgba(30,27,23,.75) 5.25px 6.75px,transparent 6.75px),linear-gradient(0deg,transparent 5.25px,rgba(30,27,23,.75) 5.25px 6.75px,transparent 6.75px),radial-gradient(circle at 38% 32%,#e3ddd2 0,#aaa397 38%,#6c665d 78%,#4d4943 100%);
  box-shadow:0 0 0 1.5px rgba(40,36,31,.55),0 0 0 2.5px rgba(255,255,255,.12),inset 0 -1px 1px rgba(0,0,0,.35)}
.pm-rule::after{left:auto;right:12px;transform:rotate(-34deg)}
.pm-ticks{left:40px;width:calc(100% - 80px);height:7px;filter:none;background-position-x:calc(var(--x0,12%) - 40px);
  background:linear-gradient(90deg,rgba(28,25,21,.85) 0 1px,transparent 0) calc(var(--x0,12%) - 40px) 0/var(--seg,25%) 9px repeat-x,linear-gradient(90deg,rgba(28,25,21,.45) 0 1px,transparent 0) calc(var(--x0,12%) - 40px) 0/calc(var(--seg,25%) / 6) 4px repeat-x}
.pm-st{top:9px;font-size:0;gap:0;color:#2a2621;text-shadow:0 1px 0 rgba(255,255,255,.22)}
.pm-st b{font-size:9px;letter-spacing:.06em}
.pm-st.done{color:#2a2621}.pm-st.done b{color:#3a352e}
.pm-st.on{color:#f7f3ea;text-shadow:0 -1px 0 rgba(0,0,0,.45)}.pm-st.on b{color:#f7f3ea}
/* зоны оплаты над линейкой: подпись по центру зоны и тонкая скобка на всю её длину */
.pm-zone{top:-30px;height:24px;display:block;text-align:center;background:none!important;box-shadow:none;border-radius:0;overflow:visible;
  font:600 12px/16px var(--font-text),Manrope,sans-serif;letter-spacing:.06em;text-transform:none;color:var(--soft)}
.pm-zone::after{content:"";position:absolute;left:1px;right:1px;bottom:0;height:5px;border:1px solid currentColor;border-bottom:0;opacity:.45}
.pm-zone.z1{color:#bdb7ac}.pm-zone.z2{color:#e0b47c}
.pm-zone.z1::after{right:4px}.pm-zone.z2::after{left:4px}
.pm-rule:not(.pay) .z2,.pm-rule.pay .z1{opacity:.55}
.pm-zb{width:2px;margin-left:-1px}
.pm-zb::before{display:none}
.pm-zb::after{left:.5px;top:0;bottom:0;background:#e0b47c;box-shadow:none;opacity:.9}
.pm-cart{top:46px;left:-20px;width:40px;height:12px;border-radius:2px 2px 6px 6px;background:linear-gradient(180deg,#b9b3a8,#7a756c);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 10px -4px rgba(0,0,0,.8)}
.pm-eye{width:9px;height:9px;margin-left:-4.5px;bottom:-6px;border-width:1.5px;border-color:#9b958a}
.pm-tag.own .pm-f{background-color:#efe9dc}.pm-tag.own .pm-f small{color:#6a645a}
/* билеты: меньше рамок, одно состояние — цвет номера и подъём активного */
.pm-tk{padding:14px 14px 0}
.pm-tk,.pm-step.done .pm-tk{box-shadow:none}
.pm-step:nth-child(n){--tkb:#1b1917}
.pm-step.done .pm-tk{background:#181715}
.pm-step.on .pm-tk{background:linear-gradient(180deg,#26231f,#1f1d1a);box-shadow:inset 0 0 0 1px rgba(239,233,220,.14)}
.pm-step:not(.on):not(.done){opacity:1}
.pm-vis{height:clamp(220px,31vh,280px);margin-bottom:16px;box-shadow:none}
.pm-run.pinned .pm-step.on .pm-vis{box-shadow:none}
.pm-run.pinned .pm-step:not(.on) .pm-vis{opacity:.62;filter:saturate(.5)}
.pm-run.pinned .pm-step:not(.on) .pm-txt{opacity:1}
.pm-txt{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-content:start;padding:0 2px 18px}
.pm-num{grid-row:span 2;font:400 26px/1 var(--font-display);color:#6c665d;text-shadow:none;padding-top:1px}
.pm-step.done .pm-num{color:#8f897f}.pm-step.on .pm-num{color:#efe9dc}
.pm-step h3{margin-bottom:5px}
.pm-step:not(.on) h3{color:#b9b4ab}.pm-step:not(.on) p{color:#8a857d}
.pm-step.done .pm-stub b{color:var(--soft)}
.pm-step.on:nth-child(4) .pm-stub{background-color:#efe9dc}
.pm-stub{background:rgba(0,0,0,.16)}
/* сцены целиком внутри: чуть уменьшаем содержимое */
.pm-track:not([data-mode=stack]) .pm-vis .fb{zoom:.9}
@media (min-width:1000px) and (max-width:1279px){.pm-track:not([data-mode=stack]) .pm-vis .fb{zoom:.76}.pm-zone{font-size:11px}.pm-num{font-size:22px}}
.pm-cart{top:49px}
.pv2 .pv-doc{bottom:auto;top:7%;padding:11px 14px 12px}
.pv2 .pv-doc ul{gap:4px;margin-bottom:8px}
.pm-vis .pv2.sc .pv-doc{height:auto;bottom:auto;top:7%;padding:11px 14px 12px}
@media (min-width:1000px) and (max-width:1279px){.pm-vis .pv4 .pv-nav span+span{display:none}}
/* на узких экранах оплату показывают корешки билетов — липкая бирка не нужна и перекрывала текст */
.pm-track[data-mode=stack] .pm-tag{display:none!important}

/* lower v6 · services — карточки-«мониторы» с линейными машинами */
.sv-track{gap:24px}
.sv-card{width:clamp(320px,42vw,620px);padding:10px;background:#0d0d0f;border:1px solid rgba(255,255,255,.07);border-radius:22px;box-shadow:0 30px 60px -40px #000;transition:border-color .35s,transform .5s cubic-bezier(.2,.9,.2,1)}
.sv-card.hot{border-color:rgba(255,255,255,.2)}
.sv-scr{position:relative;border-radius:14px;overflow:hidden;background:#0b0b0d;border:1px solid rgba(255,255,255,.08)}
.sv-cv{display:block;width:100%;height:auto;aspect-ratio:1024/372}
.sv-body{padding:22px 14px 12px;gap:8px}
.sv-body h3{font:400 clamp(22px,2vw,28px)/1.1 var(--font-display);letter-spacing:-.01em}
.sv-body p{font-size:15.5px;line-height:1.5;color:var(--soft);min-height:0;max-width:44ch;margin:0}
.sv-f{margin-top:14px;padding-top:16px;border-top:1px solid rgba(255,255,255,.07)}
.sv-f .price{font:400 22px/1 var(--font-display);color:var(--amber);letter-spacing:0}
.sv-f .price small{font:500 14px/1 var(--font-text);color:var(--muted);margin-right:2px}
.sv-go{width:auto;height:42px;padding:0 18px;gap:8px;display:inline-flex;align-items:center;border-radius:99px;background:transparent;border:1px solid var(--line-2);color:var(--ink);font:600 14.5px/1 var(--font-text)}
.sv-go i{font-size:16px;transition:transform .3s}
.sv-go:hover{background:var(--cta);color:#151518;border-color:var(--cta)}.sv-go:hover i{transform:translateX(3px)}
.sv-run.flat .sv-track{grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:24px}
@media (max-width:768px){.sv-card{width:min(86vw,400px)}.sv-body{padding:18px 8px 6px}.sv-body p{font-size:15px}}

/* lower v6 · portfolio — «из схемы в дизайн»: каркас снят с настоящей вёрстки концепта */
.ws-lead{max-width:310px;color:var(--soft)}
.wc-bar span{flex:1;min-width:0}
.wc-tag{flex:none;font:600 10.5px/1 var(--font-text);letter-spacing:.12em;text-transform:uppercase;color:var(--soft);border:1px solid rgba(255,255,255,.22);border-radius:99px;padding:4px 9px}
.ws-run:not(.flat) .wc-cap{display:none}
.wc-wire{position:absolute;inset:0;z-index:2;pointer-events:none;background-color:#0b0b0d;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:24px 24px;clip-path:inset(0 calc(100% - var(--rx,0px)) 0 0)}
.wc-wire svg{display:block;width:100%;height:100%}
.wc-wire rect,.wc-wire path{fill:none;stroke:rgba(255,255,255,.55);stroke-width:1;vector-effect:non-scaling-stroke}
.wc-wire .d{stroke:rgba(255,255,255,.2)}.wc-wire .t{stroke:rgba(255,255,255,.45)}.wc-wire .t.b{stroke:rgba(255,255,255,.85)}
.wc-cut{position:absolute;top:0;bottom:0;left:var(--rx,0px);width:1px;background:var(--amber);z-index:3;opacity:0;transition:opacity .3s;pointer-events:none}
.wc-view.wiring .wc-cut{opacity:1}
.wc-cut span{position:absolute;top:14px;font:600 11px/1 var(--font-text);letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;border-radius:99px;white-space:nowrap}
.wc-cut span:first-child{right:9px;color:#fff;background:#0b0b0d;border:1px solid rgba(255,255,255,.3)}
.wc-cut span:last-child{left:9px;color:#111;background:var(--amber)}
.ws-stack:hover{cursor:col-resize}.ws-stack.drag{cursor:grabbing}

/* lower v6 · compare — одна страница в трёх состояниях + спокойная таблица с выбранным столбцом */
#compare .cmp-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,540px);gap:36px 64px;align-items:center;margin-bottom:clamp(40px,5vw,64px)}
.cmp-lead{color:var(--soft);font-size:16px;line-height:1.55;max-width:400px;margin:22px 0 0}
.cmp-demo{margin:0;display:grid;gap:14px}
#compare .cmp-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;margin:0;border:1px solid var(--line);border-radius:99px;background:#0d0d0f}
#compare .cmp-seg button{border:0;background:none;color:var(--muted);padding:11px 6px;border-radius:99px;font:600 14px/1 var(--font-text);cursor:pointer;transition:background .3s,color .3s}
#compare .cmp-seg button:hover{color:var(--ink)}#compare .cmp-seg button.on{background:var(--cta);color:#151518}
.cmp-svg{display:block;width:100%;height:auto;aspect-ratio:520/330;background:#0b0b0d;border-radius:14px}
.cmp-svg text{fill:#fff;font-family:Manrope,sans-serif}.cmp-svg text.dm{fill:rgba(255,255,255,.55)}.cmp-svg text.mid{text-anchor:middle}.cmp-svg text.end{text-anchor:end}.cmp-svg text.acc{fill:var(--amber)}.cmp-svg text.ink{fill:#16130f}
.cmp-svg .fr{fill:none;stroke:rgba(255,255,255,.8);stroke-width:1.4}.cmp-svg .hl{fill:none;stroke:rgba(255,255,255,.4);stroke-width:1}
.cmp-svg .m.bx{fill:#0b0b0d;stroke:rgba(255,255,255,.7);stroke-width:1.2;transition:x .8s cubic-bezier(.6,0,.2,1),y .8s cubic-bezier(.6,0,.2,1),width .8s cubic-bezier(.6,0,.2,1),height .8s cubic-bezier(.6,0,.2,1),fill .5s,stroke .5s}
.cmp-svg .img{transition:transform .8s cubic-bezier(.6,0,.2,1)}
.cmp-svg .img .ir{fill:#0b0b0d;stroke:rgba(255,255,255,.7);stroke-width:1.2;vector-effect:non-scaling-stroke}
.cmp-svg .img .ix{fill:none;stroke:rgba(255,255,255,.22);stroke-width:1;vector-effect:non-scaling-stroke;transition:opacity .5s}
.cmp-svg[data-s="1"] #cmBand{stroke-dasharray:4 4;stroke:rgba(255,255,255,.45)}
.cmp-svg[data-s="3"] .img .ix{opacity:0}
.cmp-svg[data-s="3"] #cmBtn{fill:var(--amber);stroke:var(--amber)}
.cmp-svg[data-s="3"] #cmBand{stroke:rgba(224,169,109,.7)}
.cmp-svg .dot{fill:var(--amber)}
.cmp-svg .sg{opacity:0;transition:opacity .3s}
.cmp-svg[data-s="1"] .sg1,.cmp-svg[data-s="2"] .sg2,.cmp-svg[data-s="3"] .sg3{opacity:1;transition:opacity .45s .5s}
.cmp-demo figcaption{color:var(--soft);font-size:14.5px;line-height:1.5;min-height:3em}
#compare .cmp-grid{grid-template-columns:minmax(150px,.9fr) 1.15fr 1.15fr 1.35fr;grid-template-rows:none;padding:0}
#compare .cmp-grid>div,#compare .cmp-grid>button{display:flex;align-items:center;gap:12px;padding:16px 18px;border:0;border-bottom:1px solid #1e1e21;font-size:15px;line-height:1.4;background:none;transition:background .3s,color .4s}
#compare .cmp-grid>.l{color:var(--ink);font-weight:600;padding-left:2px}
#compare .cmp-grid>.c{color:#6f6f76}
#compare .cmp-grid>.hh{padding-top:12px;padding-bottom:16px;border-bottom-color:rgba(255,255,255,.14)}
#compare .cmp-grid>.cmp-col{font:600 12.5px/1.2 var(--font-text);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left;cursor:pointer;position:relative}
#compare .cmp-grid>.cmp-col .logo{font-size:19px;letter-spacing:0;text-transform:none;color:inherit}
#compare .cmp-grid>.cmp-col.on{color:var(--ink)}
#compare .cmp-grid>.cmp-col.on::before{content:"";position:absolute;left:18px;right:18px;top:0;height:2px;background:var(--amber);border-radius:2px}
#compare .cmp[data-sel="1"] .c1,#compare .cmp[data-sel="2"] .c2,#compare .cmp[data-sel="3"] .c3:not(.ft){color:var(--ink);background:rgba(255,255,255,.035)}
#compare .cmp-grid>.hov:not(.l){background:rgba(255,255,255,.05)}
#compare .ic{width:20px;height:20px;flex:none;display:block;border:0;background:none;border-radius:0}
#compare .ic svg{width:20px;height:20px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#compare .ic.ok{color:var(--ink)}#compare .c3 .ic.ok{color:var(--amber)}#compare .ic.mid{color:#8a8a90}#compare .ic.no{color:#66666c}
#compare .ic.tick{animation:cmTick .5s cubic-bezier(.3,1.4,.5,1) both}
@keyframes cmTick{0%{transform:scale(.3);opacity:0}100%{transform:none;opacity:1}}
#compare .cmp-grid>.ft{grid-column:4;border:0;padding:22px 0 0;display:block}#compare .cmp-grid>.ft .btn{width:100%}
#compare .cmp-grid>.ft0{grid-column:1/4;border:0}
#compare .cmp-note{display:block;margin-top:18px}
@media (max-width:1000px){#compare .cmp-top{grid-template-columns:1fr}.cmp-demo{max-width:560px}}
@media (max-width:800px){
  #compare .cmp-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
  #compare .cmp-grid>.c,#compare .cmp-grid>.hh{display:none}
  #compare .cmp[data-sel="1"] .c1,#compare .cmp[data-sel="2"] .c2,#compare .cmp[data-sel="3"] .c3{display:flex}
  #compare .cmp-grid>div{padding:14px 10px;font-size:14.5px}
  #compare .cmp-grid>.ft{grid-column:1/-1}#compare .cmp-grid>.ft0{display:none}
}
.cmp-svg text{white-space:pre}

/* lower v6 · path — схема тонкими белыми линиями, как машины; шаги пути загораются по ходу заявки */
.fl-hint{color:var(--soft);font-size:14.5px;max-width:300px}
.fl .flow-svg path{stroke:rgba(255,255,255,.16);stroke-width:1.2}
.fl .flow-svg path.hot{stroke:rgba(255,255,255,.8);stroke-width:1.4}
.fl-dot .pa{fill:transparent}.fl-dot .pc{fill:rgba(255,255,255,.75)}
.fl-dot.hot .pa{fill:rgba(224,169,109,.22)}.fl-dot.hot .pc{fill:var(--amber)}
.fl-src .fl-n{background:#0b0b0d;border:1px solid rgba(255,255,255,.16);border-radius:10px;box-shadow:none;font-size:15px;color:var(--soft)}
.fl-src .fl-n i{color:rgba(255,255,255,.55)}
.fl-src .fl-n:hover,.fl-src .fl-n.hot,.fl-src .fl-n.src-on{border-color:rgba(255,255,255,.75);color:var(--ink)}
.fl-src .fl-n.hot i,.fl-src .fl-n.src-on i{color:var(--ink)}
.fl .node{border-radius:12px;background:#0b0b0d;border:1.5px solid rgba(255,255,255,.8);box-shadow:none;gap:6px;transition:border-color .3s,transform .4s cubic-bezier(.3,1.4,.5,1)}
.fl .node::after{display:block;content:"";position:absolute;left:10px;top:-10px;right:-10px;bottom:10px;border-top:1px solid rgba(255,255,255,.4);border-right:1px solid rgba(255,255,255,.4);border-radius:0 12px 0 0;pointer-events:none}
.fl .node b{font:400 18px/1.15 var(--font-display)}.fl .node small{font:500 12.5px/1.45 var(--font-text);color:var(--muted)}
.fl .node.hot{border-color:#fff}
.node.flash{border-color:var(--amber);box-shadow:none;transform:translateY(-3px)}
.fl .leads{background:#0b0b0d;border:1.5px solid rgba(255,255,255,.8);border-radius:12px;box-shadow:none;transform:none;color:var(--ink);padding:16px}
.fl .leads.flash{transform:translateY(-4px);border-color:var(--amber)}
.fl .leads .fl-cap{color:var(--ink)}.fl-cap small{color:var(--muted)}
.fl .leads li{background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.1);border-radius:0;color:var(--ink);padding:11px 2px;margin:0}
.fl .leads li:last-child{border-bottom:0}
.fl .leads li small{color:var(--muted)}.fl .leads li span:last-child{color:var(--soft)}.fl .leads li span:last-child small{color:var(--dim)}
.fl .leads li span.new{color:var(--amber)}
.fl-tg{position:relative;background:#0b0b0d;border:1.5px solid rgba(255,255,255,.8);border-radius:28px;padding:34px 14px 18px;box-shadow:none;transform:none}
.fl-tg::before{content:"";position:absolute;top:14px;left:50%;width:44px;height:2px;margin-left:-22px;border-radius:2px;background:rgba(255,255,255,.4)}
.fl-tg.flash{border-color:var(--amber);transform:translateY(-4px)}
.fl-tg .fl-cap{color:var(--ink)}.fl-tg .fl-cap i{color:var(--ink)}.fl-tg .fl-cap small{color:var(--muted)}
.fl-msg{background:transparent;border:1px solid rgba(255,255,255,.3);color:var(--soft);font-size:13.5px}
.fl-msg b{color:var(--ink)}.fl-msg small{color:var(--muted)}
.fl-tip{background:#141210;color:var(--ink);border:1px solid rgba(255,255,255,.18);font-size:13.5px}
.fl-tip small{color:var(--amber)}
.fl-steps{list-style:none;padding:0;margin:44px 0 0;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.1)}
.fl-steps li{display:flex;gap:14px;padding:20px 20px 0 0;color:var(--muted);transition:color .4s}
.fl-steps li b{flex:none;width:30px;height:30px;border-radius:50%;border:1px solid rgba(255,255,255,.25);display:grid;place-items:center;font:400 13px/1 var(--font-display);color:var(--soft);transition:border-color .3s,background .3s,color .3s}
.fl-steps li span{font-size:15.5px;font-weight:600;line-height:1.35}.fl-steps li small{display:block;font-size:13.5px;font-weight:400;color:var(--dim);margin-top:4px;line-height:1.45}
.fl-steps li.on{color:var(--ink)}.fl-steps li.on b{border-color:#fff;color:var(--ink)}
.fl-steps li.cur b{background:var(--amber);border-color:var(--amber);color:#16130f}
@media (max-width:900px){.fl-steps{grid-template-columns:1fr 1fr;gap:4px 0}}
@media (max-width:520px){.fl-steps{grid-template-columns:1fr}.fl-steps li{padding-top:14px}}

/* lower v6 · about — Егор и шесть ролей на тонких линиях; наведение ведёт импульс по линии к роли */
.ab-img{border-radius:16px;background:#0b0b0d;border:1px solid rgba(255,255,255,.14);box-shadow:none}
.ab-fb{background:#0b0b0d}
.ab-fb svg{display:block;position:absolute;left:50%;bottom:0;width:74%;transform:translateX(-50%);fill:none;stroke:rgba(255,255,255,.7);stroke-width:1.3;stroke-linecap:round;vector-effect:non-scaling-stroke}
.ab-fb svg .g{stroke:rgba(255,255,255,.3)}
.ab-fb::after{color:var(--muted);font-size:12px;font-weight:600}
.ab-cap{position:static;margin-top:16px;padding:0;background:none;border:0;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.ab-cap b{font-size:20px}.ab-cap span{font-size:14.5px;color:var(--soft)}
.ab-hub{width:9px;height:9px;margin-top:-4.5px;right:-4.5px;top:calc(50% - 40px);box-shadow:none}
.ab-l{stroke:rgba(255,255,255,.14);stroke-width:1}
.ab-p{opacity:0;animation:none;stroke-width:1.6}
.ab-svg g.on .ab-l{stroke:rgba(255,255,255,.5)}
.ab-svg g.on .ab-p{opacity:1;animation:abPulse 1.3s linear infinite}
.ab.hot .ab-svg g:not(.on) .ab-l{stroke:rgba(255,255,255,.07)}
.ab-q{font-size:clamp(16.5px,1.3vw,19px);margin:24px 0 34px}
.ab-team{grid-template-columns:1fr;gap:0;border-top:1px solid rgba(255,255,255,.09);margin-bottom:34px}
.ab-team li{grid-template-columns:minmax(150px,.75fr) minmax(0,1.5fr) auto;column-gap:22px;padding:14px 4px 14px 2px;border:0;border-bottom:1px solid rgba(255,255,255,.09);border-radius:0;background:none;transform:none;transition:background .3s}
.ab-team li.on,.ab-team li:focus-visible{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.09);transform:none;outline:none}
.ab-team .av{position:absolute;left:0;top:50%;width:1px;height:1px;padding:0;border:0;background:none;grid-row:auto}
.ab-team li.on .av{background:none}
.ab-r{display:grid;gap:1px}.ab-r b{font-size:15.5px;font-weight:700;color:var(--ink)}.ab-r em{font-style:normal;font-size:13.5px;color:var(--amber)}
.ab-x{font-size:14.5px;line-height:1.45;color:var(--muted);transition:color .3s}
.ab-team li.on .ab-x,.ab-team li:focus-visible .ab-x{color:var(--ink)}
.ab-st{display:grid;justify-items:end;font:600 12.5px/1.3 var(--font-text);color:var(--dim);white-space:nowrap;transition:color .3s}.ab-st small{font-size:12px;font-weight:500}
.ab-team li.on .ab-st{color:var(--soft)}.ab-st:hover{color:var(--ink)}
@media (max-width:700px){.ab-team li{grid-template-columns:1fr auto;row-gap:6px}.ab-x{grid-column:1/-1;grid-row:2;color:var(--soft)}.ab-st{grid-row:1;grid-column:2}}
.ab-team li{grid-template-columns:190px minmax(0,1fr) 112px}
@media (max-width:700px){.ab-team li{grid-template-columns:1fr auto}}
@media (max-width:800px){#compare .cmp[data-sel] .cmp-grid>.cmp-col{display:none}}
@media (max-width:1000px){.fl .node b{font-size:15px}}
@media (max-width:768px){.fl .node{width:150px;height:118px}.ab-img{aspect-ratio:4/3}}

/* lower v6 · prices — лестница уровней тонкими линиями, кубик-«проект» стоит на выбранной ступени */
#prices .sec-h.split{align-items:flex-end}
#prices p.pr-pay{display:block;max-width:330px;margin:0;font-size:16px;line-height:1.55;color:var(--soft)}
#prices .pr-all{background:none;border:0;border-bottom:1px solid var(--line-2);font:600 15px/1.2 var(--font-text);color:var(--ink);cursor:pointer;padding:0 0 4px}
#prices .pr-all:hover{border-color:var(--amber)}
.pr-stair{position:relative;margin:34px 0 22px}
.pr-lead{margin:0 0 12px;font-size:clamp(17px,1.4vw,20px);color:var(--soft)}.pr-lead b{color:var(--amber);font-weight:600}
.ps-row{display:grid;grid-template-columns:1.12fr 1fr 1fr 1fr;gap:16px;height:150px;border-bottom:1px solid rgba(255,255,255,.35)}
.ps{position:relative;cursor:pointer}
.ps-t{position:absolute;left:0;right:-16px;bottom:0;height:calc(22px + var(--k) * 24px);border-top:1.5px solid rgba(255,255,255,.8);border-left:1.5px solid rgba(255,255,255,.8);background:repeating-linear-gradient(135deg,rgba(255,255,255,.07) 0 1px,transparent 1px 9px);transition:border-color .3s}
.ps:last-child .ps-t{right:0;border-right:1.5px solid rgba(255,255,255,.8)}
.ps-l{position:absolute;left:14px;bottom:calc(22px + var(--k) * 24px + 12px);display:grid;gap:3px;font:600 12px/1.2 var(--font-text);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);transition:color .3s}
.ps-l b{font:400 16px/1.1 var(--font-display);letter-spacing:0;text-transform:none;color:var(--soft);white-space:nowrap;transition:color .3s}
.ps.on .ps-l,.ps.on .ps-l b{color:var(--amber)}
.ps:hover .ps-l b{color:var(--ink)}
.ps-cube{position:absolute;left:0;top:0;width:46px;height:44px;pointer-events:none;transition:transform .7s cubic-bezier(.3,1.35,.5,1)}
.ps-cube svg{display:block;width:100%;height:100%;fill:none;stroke-linejoin:round}
.ps-cube .sd{stroke:rgba(255,255,255,.75);stroke-width:1.3}.ps-cube rect{fill:var(--amber);stroke:var(--amber);stroke-width:1.3}
.ps-cube.jump{animation:psJump .7s cubic-bezier(.3,.8,.4,1)}
@keyframes psJump{40%{margin-top:-22px}}
/* карточки: без засветов; Старт — охристая рамка, выбранная — светлая рамка */
.pt{background:#0f0f11;border-color:rgba(255,255,255,.09);transition:border-color .3s,transform .4s cubic-bezier(.3,1.3,.5,1)}
.pt0{background:#141210;border-color:rgba(224,169,109,.6);box-shadow:none;transform:none}
.pt.act:not(.pt0){border-color:rgba(255,255,255,.4)}
.pt.act{transform:translateY(-4px)}
.pt-badge{background:none;border:1px solid rgba(224,169,109,.5)}
.pt li::before{border-color:var(--amber)}
.pt ul{font-size:14.5px}.pt-term{font-size:13.5px;color:var(--muted)}
.pt-calc{margin-top:12px;align-self:center;background:none;border:0;padding:2px 0;font:600 13.5px/1.2 var(--font-text);color:var(--muted);border-bottom:1px solid transparent;cursor:pointer;transition:color .25s,border-color .25s}
.pt-calc:hover{color:var(--ink);border-color:var(--line-2)}
.pt .btn{margin-top:auto}
.pgrid.swap .pt0{animation-name:ptIn}
@media (max-width:1100px){.pr-stair{display:block}.ps-row{grid-template-columns:repeat(4,1fr);gap:8px}.ps-t{right:-8px}.pt.act{transform:none}}
@media (max-width:640px){.ps-row{height:128px}.ps-l{left:6px;letter-spacing:.04em;font-size:11px}.ps-l b{font-size:12.5px;white-space:normal}.ps-t{height:calc(16px + var(--k) * 20px)}.ps-l{bottom:calc(16px + var(--k) * 20px + 8px)}.ps-cube{width:34px;height:32px}}
.ps-row{height:196px}
.ps-t{height:calc(58px + var(--k) * 28px);background:none}
.ps-l{bottom:auto;top:calc(196px - 58px - var(--k) * 28px + 12px)}
@media (max-width:640px){.ps-row{height:156px}.ps-t{height:calc(50px + var(--k) * 20px)}.ps-l{bottom:auto;top:calc(156px - 50px - var(--k) * 20px + 8px)}}

/* lower v6 · faq — ответ раскрывается плавно, рядом прорисовывается рисунок тонкой линией */
.fq{border-color:rgba(255,255,255,.1)}.fq:first-child{border-top-color:rgba(255,255,255,.1)}
.fq button{padding:24px 0;color:var(--ink)}
.fq button span{transition:color .3s}.fq button:hover span{color:#fff}
.fq button i{border-color:rgba(255,255,255,.22);color:var(--ink)}
.fq.open button i{background:var(--amber);border-color:var(--amber);color:#16130f}
.fa-in{display:grid;grid-template-columns:56px minmax(0,1fr);gap:22px;align-items:start;padding:0 56px 28px 0}
.fa-in p{padding:0 !important;margin:0;color:var(--soft);font-size:16.5px;line-height:1.6;max-width:56ch}
.fa-ic{width:56px;height:56px;fill:none;stroke:rgba(255,255,255,.8);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.fa-ic *{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .9s cubic-bezier(.4,0,.2,1) .15s}
.fq.open .fa-ic *{stroke-dashoffset:0}
.fq:not(.open) .fa-ic *{transition-duration:.2s;transition-delay:0s}
.tg-card{background:#0d0d0f;border:1px solid rgba(255,255,255,.1);border-radius:16px;box-shadow:none}
.tg-card>i{color:var(--ink)}
@media (max-width:768px){.fa-in{grid-template-columns:44px minmax(0,1fr);gap:14px;padding-right:0}.fa-ic{width:44px;height:44px}}
@media (prefers-reduced-motion:reduce){.fa-ic *{transition:none}}

/* lower v6 · contact — «машина заявок» над формой собирается по мере заполнения; спокойный финал и подвал */
.final .acc.g,.final .acc{background:none;-webkit-text-fill-color:currentColor;color:var(--amber);font-family:inherit;font-style:normal;font-size:1em;font-weight:inherit}
.final .sub{color:var(--soft);font-size:17px;max-width:520px}
.msg{background:#0d0d0f;backdrop-filter:none;-webkit-backdrop-filter:none;border-color:rgba(255,255,255,.14)}
.msg>i,.msg.wa>i,.msg:first-child>i{color:var(--ink)}
.msg:hover,.msg.wa:hover{border-color:rgba(255,255,255,.55);transform:none}
.form{background:#0d0d0f;backdrop-filter:none;-webkit-backdrop-filter:none;border-color:rgba(255,255,255,.12);border-radius:20px;box-shadow:0 40px 80px -50px #000}
.form.done>.fm{display:block}
.fm{margin:-6px -4px 4px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.08)}
.fm svg{display:block;width:100%;height:auto;aspect-ratio:520/150;overflow:visible;fill:none;stroke-linecap:round;stroke-linejoin:round}
.fm text{font-family:Manrope,sans-serif;stroke:none}
.fm .fl0{stroke:rgba(255,255,255,.45);stroke-width:1.1}.fm .ht{stroke:rgba(255,255,255,.13);stroke-width:.8}
.fm .pt-belt *{stroke:rgba(255,255,255,.22);stroke-width:1.3;transition:stroke .5s}
.fm.s-ag .pt-belt *{stroke:rgba(255,255,255,.85)}
.fm .pt-belt circle{fill:#0d0d0f}
.fm .pt-card{transform:translate(60px,0);opacity:0;transition:opacity .4s,transform 1s cubic-bezier(.6,0,.3,1)}
.fm.s-name .pt-card{opacity:1}
.fm .pt-card rect{fill:#0d0d0f;stroke:rgba(255,255,255,.9);stroke-width:1.5}
.fm .pt-card .nm{fill:#fff;font-size:14px;font-weight:700}.fm .pt-card .ct{fill:rgba(255,255,255,.6);font-size:12px;font-weight:600}
.fm .pt-tags rect{fill:#0d0d0f;stroke:rgba(255,255,255,.55);stroke-width:1.1}.fm .pt-tags text{fill:rgba(255,255,255,.85);font-size:11.5px;font-weight:600;text-anchor:middle}
.fm .pt-tags path{stroke:rgba(255,255,255,.3);stroke-width:1;stroke-dasharray:2 4}
.fm .pt-tags g{animation:fmIn .45s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(var(--i) * 60ms)}
@keyframes fmIn{from{opacity:0;transform:translateY(-8px)}}
.fm .pt-phone{opacity:.18;transition:opacity .5s}
.fm.s-ct .pt-phone{opacity:1}
.fm .pt-phone rect,.fm .pt-phone path{stroke:rgba(255,255,255,.85);stroke-width:1.4}.fm .pt-phone .scr{stroke:rgba(255,255,255,.3);stroke-width:1;fill:transparent;transition:fill .4s .9s,stroke .4s .9s}
.fm .pt-phone .lb{fill:rgba(255,255,255,.6);font-size:11px;font-weight:600;text-anchor:middle}
.fm .pt-phone .sc{fill:#16130f;font-size:11.5px;font-weight:700;text-anchor:middle;opacity:0;transition:opacity .3s 1.1s}
.fm .pt-fly{stroke:rgba(255,255,255,.4);stroke-width:1.1;stroke-dasharray:3 6;opacity:0;transition:opacity .4s}
.fm.s-ag.s-ct .pt-fly{opacity:1}
.fm .pt-dot{fill:var(--amber);opacity:0;offset-path:path('M200 86H330C370 100 390 58 424 58');offset-distance:0%}
.fm.sent .pt-card{transform:translate(196px,0);opacity:0;transition:transform .8s cubic-bezier(.6,0,.3,1),opacity .2s .65s}
.fm.sent .pt-dot{animation:fmFly .7s .7s cubic-bezier(.4,0,.2,1) both}
@keyframes fmFly{0%{opacity:1;offset-distance:0%}90%{opacity:1}100%{opacity:0;offset-distance:100%}}
.fm.sent .pt-phone .scr{fill:var(--amber);stroke:var(--amber)}.fm.sent .pt-phone .sc{opacity:1}
.fm-h{margin:8px 0 0;font-size:14px;line-height:1.45;color:var(--soft);min-height:1.45em}.fm-h small{color:var(--dim);font-size:12.5px}
.form.done .res i{color:var(--amber)}
@media (prefers-reduced-motion:reduce){.fm *{transition:none!important;animation:none!important}.fm.sent .pt-dot{opacity:0}}
.foot{background:#08080a}
.foot nav a:hover,.fc a:hover{color:var(--ink)}
.fc{gap:4px}.fc a{display:inline-flex;align-items:center;gap:8px;justify-content:flex-end}
.legal{font-size:13.5px;color:var(--muted)}
.ps-row{height:164px}
.ps-t{height:calc(52px + var(--k) * 22px)}
.ps-l{top:calc(164px - 52px - var(--k) * 22px + 10px)}
.pr-stair{margin-top:28px}
.sv-steps{display:flex;align-items:center;gap:12px;margin:0;padding:4px 18px 16px;font:700 11.5px/1 var(--font-text);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.88)}
.sv-steps i{flex:1;height:1px;background:rgba(255,255,255,.4);position:relative;min-width:14px}
.sv-steps i::after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid rgba(255,255,255,.55);border-right:1px solid rgba(255,255,255,.55);transform:rotate(45deg)}
@media (max-width:768px){.sv-steps{padding:2px 12px 12px;font-size:10.5px;letter-spacing:.1em;gap:8px}}
@media (max-width:640px){.ps-l b{display:none}.ps-l{font-size:10.5px}}
#needChips button[aria-pressed="true"]{background:var(--cta);border-color:var(--cta);color:#151518}
.ws-prog i{background:var(--ink)}

/* services v7 — большие сцены-слайды (services-scenes.js) */
.sv-run.pinned .sv-pin{padding:72px 0 16px}
.sv-head{margin-bottom:clamp(14px,2.4vh,28px)}
.sv-track{gap:clamp(20px,2vw,32px);padding:0 9vw}
.sv-card{width:82vw;max-width:1560px;height:min(70vh,calc(100svh - 250px),820px);min-height:420px;display:grid;grid-template-columns:minmax(0,1fr) clamp(270px,24vw,380px);padding:12px;border-radius:24px;background:#0b0b0d;border:1px solid rgba(255,255,255,.08);box-shadow:0 40px 80px -50px #000}
.sv-card.hot{border-color:rgba(255,255,255,.08)}
.sv-scr{height:100%;min-height:0;border-radius:16px;border:0;background:#0b0b0d}
.sv-cv{display:block;width:100%;height:100%;aspect-ratio:auto}
.sv-body{display:flex;flex-direction:column;justify-content:flex-end;gap:12px;padding:clamp(20px,2.6vw,40px) clamp(18px,2vw,32px) clamp(16px,2vw,28px);border-left:1px solid rgba(255,255,255,.07)}
.sv-body h3{font:400 clamp(30px,2.9vw,46px)/1.04 var(--font-display);letter-spacing:-.02em;margin:0}
.sv-body p{font-size:clamp(15px,1.1vw,17px);line-height:1.5;color:var(--soft);max-width:34ch;margin:0}
.sv-body .sv-tier{margin-top:auto;padding-top:18px;font-size:14px;color:var(--muted)}
.sv-f{margin-top:0;padding-top:16px;flex-wrap:wrap}
.sv-f .price{font-size:clamp(24px,2vw,30px)}
.sv-run.flat .sv-track{display:grid;grid-template-columns:1fr;width:auto;max-width:1400px;margin:0 auto;padding:0 var(--g);gap:24px}
.sv-run.flat .sv-card{width:auto;height:min(70vh,760px)}
@media (max-width:1100px){.sv-card{grid-template-columns:minmax(0,1fr) 270px}.sv-body p{font-size:15px}}
@media (max-width:800px){
  .sv-run .sv-vp{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;scroll-padding:0 var(--g)}
  .sv-vp::-webkit-scrollbar{display:none}
  .sv-track{padding:0 var(--g);gap:12px}
  .sv-card,.sv-run.flat .sv-card{width:min(88vw,560px);height:auto;min-height:0;display:flex;flex-direction:column;padding:8px;scroll-snap-align:center;border-radius:20px}
  .sv-scr{height:auto;aspect-ratio:4/3;border-radius:14px}
  .sv-body{border-left:0;padding:18px 10px 8px;gap:10px}
  .sv-body .sv-tier{margin-top:4px;padding-top:0}
  .sv-body h3{font-size:28px}
  .sv-f{padding-top:14px}
}
.sv-body h3{font-size:clamp(24px,2.1vw,38px);overflow-wrap:anywhere}
@media (max-width:800px){.sv-body h3{font-size:26px}}

/* services v8 — история в три шага под первыми тремя сценами */
.sv-scr{display:flex;flex-direction:column}
.sv-cv{flex:1 1 auto;min-height:0;height:auto}
.sv-story{flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px 24px;padding:14px 22px 16px;border-top:1px solid rgba(255,255,255,.07)}
.sv-cap{margin:0;display:flex;gap:10px;align-items:baseline;font:500 clamp(18px,1.45vw,22px)/1.35 var(--font-text);color:var(--ink);min-height:2.7em;align-content:center;flex-wrap:nowrap}
.sv-cap b{font-weight:700;color:var(--muted);flex:none}
.sv-cap.is-res span{color:var(--amber)}
.sv-cap.sw span{animation:svCap .45s cubic-bezier(.2,.8,.2,1)}
@keyframes svCap{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.sv-dots{display:flex;align-items:center;gap:6px;flex:none}
.sv-dots i{color:var(--dim);font-style:normal}
.sv-dots button{width:36px;height:36px;border-radius:50%;border:1px solid var(--line-2);background:transparent;color:var(--soft);font:600 14px/1 var(--font-text);cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.sv-dots button:hover{border-color:var(--ink);color:var(--ink)}
.sv-dots button.on{background:var(--ink);border-color:var(--ink);color:#111}
.sv-dots button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.sv-list{margin:0;padding:0 0 0 1.3em;display:grid;gap:6px;font:500 17px/1.4 var(--font-text);color:var(--ink)}
.sv-list li.is-res{list-style:none;margin-left:-1.3em;color:var(--amber)}
@media (prefers-reduced-motion:reduce){.sv-cap.sw span{animation:none}}
@media (max-width:800px){
  .sv-scr{aspect-ratio:auto}
  .sv-cv{flex:none;aspect-ratio:4/3;height:auto}
  .sv-story{flex-direction:column;align-items:flex-start;padding:12px 12px 10px;gap:10px}
  .sv-cap{font-size:16px;min-height:2.8em}
  .sv-dots button{width:40px;height:40px}
  .sv-list{font-size:16px}
}
@media (max-width:800px){.sv-body{justify-content:flex-start}}
.sv-cap b:empty{display:none}

/* «Как мы работаем»: фон — тонкая чертёжная сетка на графите вместо коричневой заливки */
#model .pm-pin{isolation:isolate}
.pm-run:not(.pinned) .pm-pin{position:relative}
#model .pm-pin::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:240px 240px,240px 240px,48px 48px,48px 48px;
  background-position:center top;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 40%,#000 35%,transparent 85%);
          mask-image:radial-gradient(120% 90% at 50% 40%,#000 35%,transparent 85%)}
#model .pm-pin::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(11,11,12,0) 0,rgba(11,11,12,0) 70%,rgba(11,11,12,.9) 100%)}

/* ===== Варианты фона «Как мы работаем» (?bg=1..5, страница bg-variants.html) ===== */
[data-bg] #model .pm-pin::before,[data-bg] #model .pm-pin::after{content:none}
.bgv{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.bgv svg,.bgv canvas{position:absolute;inset:0;width:100%;height:100%}
/* 1. Тёмный камень и лампа над столом: фактура базальта, сверху конус тёплого света на карточки */
[data-bg="1"] .bgv{background:
  radial-gradient(60% 55% at 50% 38%,rgba(255,226,186,.10),transparent 70%),
  linear-gradient(180deg,rgba(8,8,9,.55),rgba(8,8,9,.85)),
  url(/studio/img/gen/desk-texture.png) center/520px;}
[data-bg="1"] .bgv::after{content:"";position:absolute;inset:0;background:radial-gradient(130% 100% at 50% 40%,transparent 55%,rgba(5,5,6,.9))}
/* 2. Топография: тонкие изолинии, как карта рельефа, медленно дрейфуют */
[data-bg="2"] .bgv{background:#0c0c0d}
[data-bg="2"] .bgv::before{content:"";position:absolute;inset:-20%;opacity:1;
  background:
    repeating-radial-gradient(ellipse 60% 40% at 30% 40%,transparent 0 22px,rgba(233,227,214,.13) 22px 23px),
    repeating-radial-gradient(ellipse 50% 60% at 75% 65%,transparent 0 26px,rgba(224,169,109,.10) 26px 27px);
  animation:bgvDrift 40s linear infinite alternate;
  -webkit-mask-image:radial-gradient(80% 70% at 50% 45%,#000 30%,transparent 80%);mask-image:radial-gradient(80% 70% at 50% 45%,#000 30%,transparent 80%)}
@keyframes bgvDrift{to{transform:translate(3%,-2%) rotate(2deg)}}
/* 3. Чертёж сайта: крупный тонкий эскиз страницы с размерами (рисуется SVG в bg-variants.js) */
[data-bg="3"] .bgv{background:radial-gradient(90% 80% at 50% 40%,#121316,#0a0a0b)}
/* 4. Окно и свет: косые лучи света из окна с тенью переплёта, лёгкое зерно плёнки */
[data-bg="4"] .bgv{background:#0b0b0c}
[data-bg="4"] .bgv::before{content:"";position:absolute;inset:-10%;transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent 0 18%,rgba(255,232,200,.14) 18% 30%,transparent 30% 31.5%,rgba(255,232,200,.14) 31.5% 43.5%,transparent 43.5% 100%);
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%);filter:blur(3px)}
[data-bg="4"] .bgv::after{content:"";position:absolute;inset:0;opacity:.18;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.9'/></svg>")}
/* 5. Поле точек: волна и подсветка у курсора (canvas в bg-variants.js) */
[data-bg="5"] .bgv{background:#0b0b0c}
@media (prefers-reduced-motion:reduce){[data-bg="2"] .bgv::before{animation:none}}

/* ===== #model v6: широкие билеты. strip — лента едет справа налево под линейкой (сдвиг задаёт app.js по каретке); rail — сетка 2×2 (?test, reduced motion, низкий экран) ===== */
.pm-track[data-mode=strip] .pm-steps,.pm-track[data-mode=rail] .pm-steps{display:flex;gap:26px;will-change:transform}
.pm-track[data-mode=strip] .pm-step{flex:0 0 50%}
.pm-run.pinned .pm-pin{overflow-x:clip}
.pm-track[data-mode=rail] .pm-steps{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 20px;will-change:auto}
/* билет: сцена слева, текст справа, корешок снизу во всю ширину */
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-tk{display:grid;grid-template-columns:minmax(0,1fr) clamp(170px,15vw,220px);grid-template-rows:1fr auto;column-gap:22px;padding:14px 14px 0}
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-vis{grid-column:1;grid-row:1;margin:0 0 14px;height:clamp(250px,calc(100vh - 490px),390px);height:clamp(250px,calc(100svh - 490px),390px)}
.pm-track[data-mode=rail] .pm-vis{height:clamp(250px,26vw,340px)}
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-vis .fb{zoom:1}
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-txt{grid-column:2;grid-row:1;display:flex;flex-direction:column;padding:6px 4px 18px 0}
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-num{font:400 clamp(44px,4.4vw,64px)/.9 var(--font-display);letter-spacing:-.03em;margin-bottom:auto;padding:0}
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-step h3{font-size:clamp(19px,1.6vw,24px);margin:18px 0 8px}
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-step p{font-size:15px;line-height:1.5}
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-stub{grid-column:1/-1;grid-row:2}
/* лента: прошедшие уходят влево притушенными, следующий выглядывает справа, активный — поднят и ярче */
.pm-track[data-mode=strip] .pm-step.done{opacity:.5}
.pm-track[data-mode=strip] .pm-step:not(.on):not(.done){opacity:.72}
.pm-track[data-mode=strip] .pm-step.on .pm-vis{opacity:1;filter:none}
@media (min-width:1000px) and (max-width:1279px){
  .pm-track:is([data-mode=strip],[data-mode=rail]) .pm-tk{grid-template-columns:minmax(0,1fr) 150px;column-gap:16px}
  .pm-track:is([data-mode=strip],[data-mode=rail]) .pm-vis .fb{zoom:.86}
  .pm-track:is([data-mode=strip],[data-mode=rail]) .pm-num{font-size:40px}
  .pm-track:is([data-mode=strip],[data-mode=rail]) .pm-step p{font-size:14px}
}
@media (prefers-reduced-motion:reduce){.pm-steps{transition:none}}

/* ===== #model v6.1: что вы получаете на шаге, номера выбиты в стали линейки, лампа над активным билетом ===== */
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-tk{grid-template-columns:minmax(0,1fr) clamp(220px,17vw,250px)}
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-num{font-size:clamp(44px,3.9vw,56px)}
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-step h3{margin:12px 0 6px}
.pm-get{list-style:none;margin:12px 0 0;padding:0;display:grid}
.pm-get li{font-size:15px;line-height:1.35;color:#cfc9bf;padding:6px 0 6px;border-top:1px solid rgba(239,233,220,.1)}
.pm-get li:last-child{border-bottom:1px solid rgba(239,233,220,.1)}
.pm-step:not(.on) .pm-get li{color:#8f8a82}
.pm-txt .pm-time{margin:9px 0 0;font-size:15px!important;line-height:1.3!important;color:#e0b47c}
.pm-time span{display:inline-block;margin-right:8px;font:600 11px/1 var(--font-text),Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#8f897f;vertical-align:1px}
.pm-step:not(.on) .pm-time{color:#a08a6c}
.pm-track:is([data-mode=strip],[data-mode=rail]) .pm-txt{padding-bottom:16px}
/* номер выбит в шлифованной стали: тот же градиент, что у линейки, тёмная кромка сверху и блик снизу, как у штамповки */
.pm-num{color:transparent!important;-webkit-text-fill-color:transparent;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 2px,rgba(0,0,0,.06) 2px 3px),linear-gradient(180deg,#5a564f 0%,#7a756c 38%,#8f897f 70%,#a39d92 100%);
  -webkit-background-clip:text;background-clip:text;
  text-shadow:none;--eng:drop-shadow(0 -1px 0 rgba(0,0,0,.8)) drop-shadow(0 1px 0 rgba(255,255,255,.13));
  filter:var(--eng) brightness(.72);transition:filter .5s}
.pm-step.done .pm-num{filter:var(--eng) brightness(.85)}
.pm-step.on .pm-num{filter:var(--eng);background:repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 1px,transparent 1px 2px,rgba(0,0,0,.05) 2px 3px),linear-gradient(180deg,#77726a 0%,#a8a196 40%,#c9c2b6 72%,#ddd7cc 100%);-webkit-background-clip:text;background-clip:text}
@media (min-width:1000px) and (max-width:1279px){
  .pm-track:is([data-mode=strip],[data-mode=rail]) .pm-tk{grid-template-columns:minmax(0,1fr) 196px;column-gap:16px}
  .pm-track:is([data-mode=strip],[data-mode=rail]) .pm-vis .fb{zoom:.8}
  .pm-track:is([data-mode=strip],[data-mode=rail]) .pm-num{font-size:38px}
  .pm-track:is([data-mode=strip],[data-mode=rail]) .pm-step p{font-size:15px}
  .pm-get li{padding:5px 0}
}
/* лампа: мягкое эллиптическое пятно тёплого света на камне, едет за активным билетом (сдвиг задаёт app.js, только transform) */
[data-bg="1"] .bgv{background:
  radial-gradient(60% 55% at 50% 38%,rgba(255,226,186,.035),transparent 70%),
  linear-gradient(180deg,rgba(8,8,9,.62),rgba(8,8,9,.88)),
  url(/studio/img/gen/desk-texture.png) center/520px}
.bgv-lamp{position:absolute;left:0;top:0;width:var(--lw,700px);height:var(--lh,520px);margin:calc(var(--lh,520px) / -2) 0 0 calc(var(--lw,700px) / -2);
  transform:translate3d(50vw,60%,0);will-change:transform;
  background:radial-gradient(closest-side,rgba(255,224,182,.2),rgba(255,214,166,.11) 45%,rgba(255,210,160,.04) 75%,transparent)}
[data-bg]:not([data-bg="1"]) .bgv-lamp{display:none}
/* калькулятор не перекрывает корешки билетов, пока блок на экране */
html.pm-in .cx-fab{opacity:0;pointer-events:none;transform:scale(.9) translateY(8px)}
.pm-track[data-mode=stack] .pm-get,.pm-track[data-mode=stack] .pm-time{grid-column:1/-1}

/* ===== #model v6: билеты вшиты в камень стола (гравировка); активный прорезается по контуру и поднимается ===== */
[data-bg="1"] .bgv{background:linear-gradient(180deg,rgba(8,8,9,.58),rgba(8,8,9,.84)),url(/studio/img/gen/desk-texture.png) center/520px}
.bgv-lamp{display:none}
/* в столе: фон билета — сам камень, контур — утопленная кромка, текст выбит */
.pm-step,.pm-step.on,.pm-step.done{filter:none;opacity:1!important;transform:none}
.pm-track:not([data-mode=stack]) .pm-step,.pm-track:not([data-mode=stack]) .pm-step.done{opacity:1}
.pm-tk,.pm-step.done .pm-tk,.pm-step.on .pm-tk{background:none;box-shadow:inset 0 1px 1px rgba(0,0,0,.75),inset 0 -1px 0 rgba(255,255,255,.06),inset 0 0 0 1px rgba(0,0,0,.28)}
.pm-tk::before{content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;background:linear-gradient(180deg,#2a2622,#201d1a);opacity:0;transition:opacity .35s}
.pm-tk>*{position:relative;z-index:1}
.pm-step .pm-vis{transition:opacity .45s,filter .45s}
.pm-run.pinned .pm-step:not(.on) .pm-vis,.pm-step:not(.on) .pm-vis{opacity:.2;filter:grayscale(1) contrast(.85)}
.pm-step:not(.on) h3{color:#8d877d;text-shadow:0 -1px 0 rgba(0,0,0,.8),0 1px 0 rgba(255,255,255,.07)}
.pm-step:not(.on) p,.pm-step:not(.on) .pm-get li{color:#77726a;text-shadow:0 -1px 0 rgba(0,0,0,.7),0 1px 0 rgba(255,255,255,.05)}
.pm-step:not(.on) .pm-get li{border-color:rgba(0,0,0,.4);box-shadow:0 1px 0 rgba(255,255,255,.04)}
.pm-step:not(.on) .pm-time{color:#8a7a62}
.pm-step:not(.on) .pm-stub,.pm-step.done .pm-stub{background:rgba(0,0,0,.18)}
.pm-step:not(.on) .pm-stub b{color:#8d877d}
/* прорезь: светлая линия обходит контур за .6 с, затем гаснет до тонкой кромки */
.pm-cut{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;overflow:visible}
.pm-cut rect{x:1px;y:1px;width:calc(100% - 2px);height:calc(100% - 2px);rx:13px;fill:none;stroke:#efe9dc;stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1;opacity:0;transition:opacity .25s}
.pm-step.on .pm-cut rect{animation:pmCut 1s cubic-bezier(.55,.1,.35,1) forwards}
@keyframes pmCut{0%{stroke-dashoffset:1;opacity:1}60%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.28}}
/* подъём: после прорези плита выходит из стола — лицевая сторона, тень, лёгкий сдвиг вверх; обратно ложится сразу */
.pm-track:not([data-mode=stack]) .pm-step{transition:transform .45s cubic-bezier(.3,.7,.3,1),filter .45s}
.pm-track:not([data-mode=stack]) .pm-step.on{transform:translateY(-10px);filter:drop-shadow(0 26px 24px rgba(0,0,0,.7)) drop-shadow(0 2px 3px rgba(0,0,0,.5));transition-delay:.55s}
.pm-track[data-mode=stack] .pm-step.on{filter:drop-shadow(0 18px 18px rgba(0,0,0,.6));transition:filter .45s .55s}
.pm-step.on .pm-tk::before{opacity:1;transition-delay:.55s}
.pm-step.on .pm-tk{box-shadow:inset 0 0 0 1px rgba(239,233,220,.1),inset 0 1px 0 rgba(255,255,255,.1)}
.pm-step.on .pm-vis{transition-delay:.45s}
.pm-track[data-mode=stack] .pm-step,.pm-track[data-mode=stack] .pm-step.on{background:none;border:0}
@media (prefers-reduced-motion:reduce){
  .pm-step.on .pm-cut rect{animation:none;stroke-dashoffset:0;opacity:.28}
  .pm-step,.pm-tk::before,.pm-step .pm-vis{transition:none!important}
}
/* камень — широкая плита под билетами, сдвигается вместе с лентой (transform из app.js); затемнение и виньетка неподвижны поверх */
[data-bg="1"] .bgv{background:#0b0b0c}
.bgv-tex{position:absolute;top:0;bottom:0;left:0;width:400%;background:url(/studio/img/gen/desk-texture.png) 0 0/520px;will-change:transform}
[data-bg="1"] .bgv::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,8,9,.58),rgba(8,8,9,.84))}
[data-bg="1"] .bgv::after{z-index:1}

/* ===== #model v7: поднятая плита — вырезанный кусок того же камня; сцена лежит прямо на камне; корешок — сталь, как линейка ===== */
.pm-tk::before{background:linear-gradient(180deg,rgba(255,236,210,.05),rgba(8,8,9,.3)),linear-gradient(rgba(8,8,9,.42),rgba(8,8,9,.42)),url(/studio/img/gen/desk-texture.png) var(--tx,0) var(--ty,0)/520px}
.pm-step.on .pm-tk{box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 0 0 1px rgba(255,255,255,.05),inset 0 -1px 0 rgba(0,0,0,.5)}
/* толщина плиты: тёмный торец снизу и мягкая тень на столе */
.pm-track:not([data-mode=stack]) .pm-step.on{filter:drop-shadow(0 4px 0 #0e0d0c) drop-shadow(0 24px 22px rgba(0,0,0,.65))}
.pm-track[data-mode=stack] .pm-step.on{filter:drop-shadow(0 4px 0 #0e0d0c) drop-shadow(0 16px 16px rgba(0,0,0,.55))}
/* сцена без своей коробки и «пола»: предметы лежат на камне и отбрасывают на него тень */
.pm-vis,.pm-run.pinned .pm-step.on .pm-vis{background:none;box-shadow:none;border:0}
.pm-vis .sc-desk{display:none}
.pm-vis .sc-obj,.pm-vis .sc-phone,.pm-vis .sc-receipt,.pm-vis .pv-note{filter:drop-shadow(0 14px 14px rgba(0,0,0,.55))}
/* корешок: шлифованная сталь, текст выбит */
.pm-step.on .pm-stub,.pm-step.on:nth-child(n) .pm-stub{background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 2px,rgba(0,0,0,.05) 2px 3px),linear-gradient(180deg,#a49e93 0%,#837e75 50%,#6a665e 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.pm-step.on .pm-stub span{color:rgba(28,25,21,.75);text-shadow:0 1px 0 rgba(255,255,255,.2)}
.pm-step.on .pm-stub b{color:#191714;text-shadow:0 1px 0 rgba(255,255,255,.22)}
.pm-step.on:nth-child(3) .pm-stub b{color:#3d2b12}
.pm-step.on .pm-stub::before{opacity:0}
@media (prefers-reduced-motion:reduce){.pm-stub{transition:none}}

/* ===== #model v8: живой контур активной плиты (как у кнопки «Обсудить проект»), блик за курсором, пружинный подъём ===== */
@property --pra{syntax:'<angle>';inherits:false;initial-value:0deg}
.pm-tk::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;padding:1.5px;
  background:conic-gradient(from var(--pra),transparent 0 64%,rgba(143,179,232,.55) 74%,#fff 80%,#e0a96d 87%,transparent 95%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  opacity:0;transition:opacity .3s}
.pm-step.on .pm-tk::after{opacity:.85;transition:opacity .8s .9s;animation:pmRun 9s linear infinite}
@keyframes pmRun{to{--pra:1turn}}
@keyframes pmCut{0%{stroke-dashoffset:1;opacity:1}60%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.12}}
/* блик на камне идёт за курсором */
.pm-tk::before{background:radial-gradient(60% 70% at var(--hx,50%) var(--hy,30%),rgba(255,240,220,.07),transparent 70%),linear-gradient(180deg,rgba(255,236,210,.05),rgba(8,8,9,.3)),linear-gradient(rgba(8,8,9,.42),rgba(8,8,9,.42)),url(/studio/img/gen/desk-texture.png) var(--tx,0) var(--ty,0)/520px}
.pm-tk{will-change:transform}
/* подъём с лёгким перелётом и оседанием */
.pm-track:not([data-mode=stack]) .pm-step.on{transition:transform .7s cubic-bezier(.34,1.56,.5,1) .55s,filter .5s .55s}
@media (prefers-reduced-motion:reduce){.pm-step.on .pm-tk::after{animation:none;opacity:.5}}

/* ===== #model v9: 3D-стол с предметами (process3d.js) ===== */
.p3{--disp:var(--font-display);--text:var(--font-text);--cream:#efe9dc;--amber:#e0a96d;--soft:#c9c6c0;--muted:#8d8a85;background:#080809}
.p3{position:relative;height:540vh}
.p3-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.p3 canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.p3-pin::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(8,8,9,.85) 0,rgba(8,8,9,0) 26%),linear-gradient(0deg,rgba(8,8,9,.9) 0,rgba(8,8,9,0) 32%)}
.p3-ui{position:absolute;inset:0;z-index:2;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(24px,5vh,56px) clamp(16px,5vw,72px)}
.p3-top{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap}
.p3 h2{font:400 clamp(28px,3.6vw,52px)/1.02 var(--disp);letter-spacing:-.02em;max-width:760px}
.p3 h2 em{font-style:normal;color:#8f897f}
.p3-fact{max-width:300px;color:var(--soft);font-size:15px;pointer-events:auto}
.p3-fact a{display:inline-block;margin-top:12px;padding:12px 18px;border-radius:99px;background:var(--cream);color:#151518;font-weight:600;text-decoration:none}
.p3-bot{display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:end}
.p3-n{font:400 clamp(64px,8vw,120px)/.8 var(--disp);letter-spacing:-.04em;color:var(--cream);transition:color .5s}
.p3[data-s="2"] .p3-n{color:var(--amber)}
.p3-t h3{font:400 clamp(22px,2.2vw,32px)/1.1 var(--disp)}
.p3-t p{color:var(--soft);margin-top:8px;max-width:440px;font-size:17px}
.p3-pay{text-align:right}
.p3-pay span{font:600 11px/1 var(--text);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.p3-pay b{display:block;margin-top:10px;font:400 clamp(22px,2.4vw,34px)/1 var(--disp);color:var(--amber)}
.p3 [data-t]:not(.cur){display:none}
.p3 [data-t].cur{animation:p3in .55s cubic-bezier(.2,.8,.3,1) both}
@keyframes p3in{from{opacity:0;transform:translateY(10px)}}
.p3-prog{display:flex;gap:6px;margin-top:22px;grid-column:1/-1}
.p3-prog i{flex:1;height:2px;background:rgba(239,233,220,.14);position:relative;overflow:hidden}
.p3-prog i b{position:absolute;inset:0;background:var(--cream);transform-origin:0 50%;transform:scaleX(0)}
.p3-prog i:nth-child(n+3) b{background:var(--amber)}
.p3-try{pointer-events:auto;margin-top:14px;display:inline-flex;align-items:center;gap:8px;font:600 14px/1 var(--text);color:var(--ink);background:rgba(8,8,9,.5);border:1px solid rgba(239,233,220,.22);border-radius:99px;padding:10px 16px;cursor:pointer;backdrop-filter:blur(6px);transition:border-color .3s,background .3s}
.p3-try::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--amber)}
.p3-try:hover{border-color:rgba(239,233,220,.6);background:rgba(8,8,9,.7)}
.p3-fb{display:none;padding:40px 16px}
.no3d .p3{height:auto}.no3d .p3-pin{display:block;position:static;height:auto;overflow:visible}.no3d .p3 canvas,.no3d .p3-say{display:none}.no3d .p3-ui{position:static}.no3d .p3-fb{display:block}
.p3-fb{list-style:none;margin:0;padding:8px clamp(16px,5vw,72px) 72px;display:none;color:var(--soft)}
.p3-fb li{padding:14px 0;border-top:1px solid rgba(239,233,220,.12);font:400 17px/1.5 var(--text)}
.p3-fb b{color:var(--cream);font-weight:600}
@media (max-width:760px){.p3-bot{grid-template-columns:1fr;gap:10px}.p3-pay{text-align:left}.p3-n{font-size:56px}.p3-fact{display:none}}
@media (prefers-reduced-motion:reduce){.p3 [data-t].cur{animation:none}}
.p3-ui{padding-top:clamp(92px,12vh,120px)}

/* чистый режим: после входа в блок текст уходит, остаётся композиция и строка-рассказ; у конца блока текст возвращается */
.p3-top,.p3-bot{transition:opacity .55s cubic-bezier(.2,.8,.3,1),transform .7s cubic-bezier(.2,.8,.3,1)}
.p3.clean .p3-top{opacity:0;transform:translateY(-28px);pointer-events:none}
.p3.clean .p3-bot{opacity:0;transform:translateY(28px);pointer-events:none}
.p3-cap{position:absolute;left:clamp(16px,5vw,72px);right:clamp(16px,5vw,72px);bottom:clamp(28px,6vh,60px);max-width:560px;margin:0;font:500 clamp(17px,1.35vw,20px)/1.45 var(--text);color:var(--soft);opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.3,1)}
.p3-cap b{font:400 1em/1 var(--disp);color:var(--amber);margin-right:12px}
.p3.clean .p3-cap{opacity:1;transform:none;transition-delay:.18s}
.p3 canvas{transform-origin:50% 60%;will-change:transform}
@media (prefers-reduced-motion:reduce){.p3-top,.p3-bot,.p3-cap{transition:none}}

/* ===== подпись шагов 3D-блока: крупно под шапкой, маркер на ключевом слове, линза веса под курсором ===== */
.p3-bot,.p3-cap{display:none!important}
.p3-say{position:absolute;left:clamp(16px,5vw,72px);right:clamp(16px,5vw,72px);top:clamp(96px,13vh,130px);width:auto;pointer-events:none}
.say-i{position:absolute;left:0;top:0;width:min(640px,44vw)}
.say-i.say-right{left:auto;right:0;text-align:right}
.say-i.say-right .say-t{margin-left:auto}
.say-k{display:flex;align-items:baseline;gap:12px;font:600 12.5px/1 var(--text);letter-spacing:.16em;text-transform:uppercase;color:#a29c92;margin-bottom:16px;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.3,1)}
.say-k b{font:400 15px/1 var(--disp);letter-spacing:0;color:#e0a96d}
.say-t{font:300 clamp(28px,3.1vw,50px)/1.13 var(--text);letter-spacing:-.02em;color:#efe9dc;text-wrap:balance}
.say-t .w{display:inline-block;white-space:nowrap;overflow:hidden;vertical-align:top;padding:.04em .02em .08em;margin:-.04em -.02em -.08em}
.say-t .wi{display:inline-block;transform:translateY(108%);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.say-t .l{display:inline-block;font-variation-settings:'wght' var(--wg,300)}
.say-t .w.mk{position:relative;overflow:visible;color:#16130f}
.say-t .w.mk::before{content:"";position:absolute;left:-.08em;right:-.08em;top:.18em;bottom:.04em;background:#e0a96d;border-radius:3px;transform:scaleX(0) skewX(-8deg);transform-origin:0 50%;transition:transform .7s cubic-bezier(.6,0,.2,1) .55s;z-index:-1}
.say-t .w.mk .wi{position:relative}
.say-i.on .say-k{opacity:1;transform:none}
.say-i.on .wi{transform:none}
.say-i.on .w.mk::before{transform:scaleX(1) skewX(-8deg)}
.say-i.out{transition:opacity .45s,transform .55s cubic-bezier(.4,0,.2,1);opacity:0;transform:translateY(-26px)}
.say-act{pointer-events:auto;margin-top:22px;display:inline-flex;align-items:center;gap:10px;font:600 14.5px/1 var(--text);color:#efe9dc;background:none;border:0;border-bottom:1px solid rgba(239,233,220,.35);padding:0 0 6px;cursor:pointer;opacity:0;transform:translateY(8px);transition:opacity .5s .7s,transform .6s .7s,border-color .3s}
.say-act span{transition:transform .3s}
.say-act:hover{border-color:#efe9dc}.say-act:hover span{transform:translateX(4px)}
.say-i.on .say-act{opacity:1;transform:none}
/* подпись видна только в чистом режиме; большой заголовок и кнопка — на входе и у конца блока */
.p3-say{opacity:0;transition:opacity .45s}
.p3.clean .p3-say{opacity:1;transition-delay:.15s}
@media (max-width:760px){.p3-say{left:16px;right:16px;top:clamp(84px,11vh,110px)}.say-i{width:100%}.say-i.say-right{text-align:left}.say-i.say-right .say-t{margin-left:0}.say-t{font-size:clamp(24px,7vw,32px)}}
@media (prefers-reduced-motion:reduce){.say-t .wi,.say-k,.say-act,.say-i.out,.say-t .w.mk::before{transition:none}}
/* ключевое слово: светлое, пока маркер не дорисовался, и темнеет вместе с ним — иначе тёмный текст пропадает на тёмном фоне */
.say-t .w.mk{color:#efe9dc;transition:color .35s ease .85s}
.say-i.on .say-t .w.mk{color:#16130f}
.say-i.out .say-t .w.mk{transition-delay:0s}
/* ===== подпись шага v2: без меток-капсом, маркера и «линзы веса»; номер, фраза, действие; шторка слева направо ===== */
.say-k{display:none}
.say-n{display:block;font:400 15px/1 var(--disp);color:#e0a96d;margin-bottom:14px}
.say-n i{font-style:normal;color:#6f6a62;margin-left:2px}
.say-t{font:400 clamp(24px,2.5vw,38px)/1.22 var(--text);letter-spacing:-.015em;color:#efe9dc;margin:0;max-width:22em}
.say-filter{position:absolute;width:0;height:0;overflow:hidden}
.p3-say.is-morphing{filter:url(#p3-say-morph)}
.say-i{will-change:filter,opacity}
.say-n,.say-act{opacity:0;transition:opacity .4s}
.say-i.on .say-n{opacity:1}
.say-i.on .say-act{opacity:1;transition-delay:.6s}
.say-act{transform:none!important;border-bottom-color:rgba(239,233,220,.3);font-weight:500;color:#c9c6c0}
.say-act:hover{color:#efe9dc}
.say-i.out{transition:opacity .35s;opacity:0;transform:none}
@media (prefers-reduced-motion:reduce){.p3-say.is-morphing{filter:none}.say-i{will-change:auto}}
/* анти-шаблон: метки капсом оставлены только у ступеней цен и бейджей «Концепт», остальное обычным регистром */
.ws-tag,#compare .cmp-grid>.cmp-col,.pt-tier,.marq-l,.fl-tip small{text-transform:none;letter-spacing:0}
.ws-tag{font-size:13px}#compare .cmp-grid>.cmp-col{font-size:14px}.pt-tier{font-size:13px}.marq-l{font-size:13px}.fl-tip small{font-size:11.5px}
@media (max-width:1100px){
  .hdr .snd,.hdr .ico-btn,.hdr .burger{width:44px;height:44px}
}

/* visual audit v23 — clearer fallbacks, tighter mobile conversion UI, cleaner pacing */
.ab-fb{
  isolation:isolate;
  background:
    radial-gradient(circle at 72% 24%,rgba(224,169,109,.18),transparent 30%),
    repeating-linear-gradient(0deg,transparent 0 31px,rgba(255,255,255,.035) 31px 32px),
    repeating-linear-gradient(90deg,transparent 0 31px,rgba(255,255,255,.035) 31px 32px),
    #0b0b0d;
}
.ab-fb b{z-index:2;margin:0;font-size:clamp(42px,6vw,78px);letter-spacing:-.04em;color:#f0ece4;text-shadow:0 18px 50px rgba(0,0,0,.55)}
.ab-fb svg{z-index:1;width:88%;opacity:.28}
.ab-fb::after{content:"Егор · руководитель";z-index:3;letter-spacing:.06em;text-transform:none;color:var(--soft)}
#faq{padding-bottom:clamp(48px,5vw,76px)}

@media (max-width:800px){
  .msticky{left:12px;right:12px;bottom:10px;padding:7px;border:1px solid rgba(255,255,255,.13);border-radius:16px;background:rgba(12,12,14,.88);box-shadow:0 18px 50px rgba(0,0,0,.55);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
  .msticky .btn{padding:13px 16px;border-radius:10px}
  .msticky .ico-btn{width:48px;height:48px}
  #prices .tabs{display:grid;grid-template-columns:1fr 1fr;width:100%;padding:5px;border-radius:14px;gap:3px}
  #prices .tab{min-height:48px;padding:10px 8px;border-radius:10px;text-align:center;white-space:normal;line-height:1.25}
  #prices .tab-ind{border-radius:10px}
  #faq{padding-bottom:52px}
}
@media (min-width:801px) and (max-width:1100px){
  .ab{grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);gap:36px;align-items:start}
  .ab-ph{max-width:360px}
}
#portfolio.work-proof{background:#141210;padding:var(--sp) 0;scroll-margin-top:100px}
.work-proof-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:48px}
.work-proof-head p{max-width:370px;color:var(--soft);font-size:17px;line-height:1.65}
.work-proof-project{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:start}
.work-proof-project figure{margin:0;min-width:0}
.work-proof-project img{display:block;width:100%;height:auto;border:1px solid #403b36}
.work-proof-project figcaption{font-size:14px;line-height:1.6;color:var(--soft);margin-top:14px}
.work-proof-label{font-size:14px;color:var(--amber)}
.work-proof-copy h3{font-family:'Dela Gothic One',sans-serif;font-size:clamp(28px,3vw,44px);margin:12px 0 20px}
.work-proof-copy p,.work-proof-copy dd{font-size:17px;line-height:1.65;color:var(--soft)}
.work-proof-copy dl{margin:28px 0}
.work-proof-copy dt{font-size:14px;color:var(--ink);margin-top:20px;margin-bottom:6px}
.work-proof-copy dd{margin:0}
.p3.p3-static{height:auto;min-height:0}
.p3-static .p3-pin{position:static;height:auto;min-height:0;overflow:visible}
.p3-static canvas,.p3-static .p3-say{display:none}
.p3-static .p3-ui{position:static}
.p3-static .p3-top{opacity:1;transform:none}
.p3-static .p3-fb{display:block}
.svc-flow{font-size:14px!important;line-height:1.6!important;color:var(--amber)!important;margin:12px 0!important}
.ps-row button.ps{border:0;background:none;color:inherit;text-align:left;font:inherit;padding:0;min-width:0}
.ps-row button.ps:focus-visible{outline:2px solid var(--amber);outline-offset:4px}
@media(max-width:800px){.work-proof-head{display:block}.work-proof-head p{margin-top:20px}.work-proof-project{grid-template-columns:1fr}.work-proof-copy dl{display:grid;grid-template-columns:1fr;gap:4px}.p3-static .p3-fact{display:block}.ps-row .ps-l b{font-size:12px;white-space:normal}}
.work-proof-project[hidden]{display:none}
.work-gallery{display:grid;grid-template-columns:1fr 1fr;gap:64px 32px}
.work-tile{display:block;color:var(--ink);text-decoration:none;min-width:0}
.work-cover{aspect-ratio:1.5;background:#211e1b;overflow:hidden;border:1px solid #3c3732}
.work-cover video{display:block;width:100%;height:100%;object-fit:contain;background:#101010}
.case-media video{display:block;width:100%;max-height:80vh;background:#101010;margin-bottom:20px}
.work-cover img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .3s}
.work-portrait .work-cover img{object-fit:contain;background:#08080a}
.work-tile:hover .work-cover img{transform:scale(1.025)}
.work-type{display:block;font-size:14px;color:var(--soft);margin:18px 0 8px}
.work-tile h3{font-family:'Dela Gothic One',sans-serif;font-size:clamp(22px,2.1vw,32px);line-height:1.3;display:flex;justify-content:space-between;gap:16px}
.work-tile h3 span{color:var(--amber)}
.work-tile p{font-size:16px;color:var(--soft);line-height:1.6;margin:14px 0;max-width:500px}
.work-open{font-size:14px;border-bottom:1px solid #81705d;padding-bottom:5px}
.work-dialog{position:fixed;inset:0;width:min(1100px,calc(100% - 48px));max-width:none;height:calc(100dvh - 48px);max-height:none;margin:auto;background:#141210;color:var(--ink);border:1px solid #625549;padding:0;overscroll-behavior:contain}
.work-dialog::backdrop{background:rgba(0,0,0,.85)}
.work-dialog-bar{position:sticky;top:0;z-index:2;background:#141210;display:flex;align-items:center;justify-content:space-between;padding:16px 28px;border-bottom:1px solid #40382f;gap:12px}
.work-dialog-bar button{font:inherit;color:var(--ink);border:1px solid #716456;background:transparent;padding:10px 16px;cursor:pointer}
#caseContent{padding:32px}
.case-intro{max-width:700px;margin-bottom:32px}
.case-intro h2{font-family:'Dela Gothic One',sans-serif;font-size:clamp(28px,4vw,52px);line-height:1.2;margin:16px 0}
.case-intro p,.case-intro li{font-size:17px;line-height:1.65;margin-bottom:12px;color:var(--soft)}
.case-intro .case-task{color:var(--ink);font-size:22px}
.case-intro ul{padding-left:22px;margin:24px 0}
.case-intro .case-note{font-size:14px;border-top:1px solid #40382f;padding-top:16px}
.case-media img{display:block;width:100%;height:auto;margin-bottom:20px}
.case-portrait{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
#caseContent video{display:block;width:100%;margin:28px 0;background:#08080a}
.case-cta{margin:24px 0}
html.case-open{overflow:hidden}

/* Mobile review: explicit controls, readable scenes, no floating obstruction. */
.hero .lead strong{font-weight:500;color:var(--ink)}
.sv-controls{display:flex;align-items:center;gap:12px;margin-top:16px;font-size:14px;color:var(--muted)}
.sv-controls button{width:44px;height:44px;border:1px solid var(--line-2);border-radius:50%;background:transparent;color:var(--ink);font-size:24px;cursor:pointer}
.sv-controls a{margin-left:auto;color:var(--ink)}
.mobile-tiers{display:none}
.case-details{margin:24px 0;padding:18px 0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);color:var(--soft);line-height:1.6}
.case-details summary{cursor:pointer;color:var(--ink)}.case-details p{margin-top:16px}.case-full{display:inline-block;color:var(--amber);padding:12px 0;text-decoration:underline;text-underline-offset:5px}
.work-tile>p{display:none}
.work-proof-head{align-items:end}
.work-proof-head p{max-width:none}
@media(max-width:800px){
  .cx-fab{display:none!important}
  .hero .lead{font-size:16px;line-height:1.65;max-width:32ch}
  .sv-run.pinned .sv-pin{height:100svh;min-height:0;padding:66px 0 12px;display:flex;flex-direction:column;justify-content:center}
  .sv-run.pinned .sv-vp{overflow:hidden;touch-action:pan-y}
  .sv-run.pinned .sv-track{will-change:transform}
  .sv-run.pinned .sv-card{flex:0 0 calc(100vw - 2 * var(--g));width:calc(100vw - 2 * var(--g));height:calc(100svh - 228px);min-height:390px;max-height:660px}
  .sv-run.pinned .sv-scr{flex:1;min-height:150px;aspect-ratio:auto}
  .sv-head{margin-bottom:12px}.sv-sub{display:none}
  .sv-body{padding:12px 10px 8px;gap:8px}.sv-body p{font-size:14px;line-height:1.45}
  .sv-body h3{font-size:24px}.sv-f{padding-top:6px}.sv-f .price{font-size:23px}
  .sv-controls{margin-top:10px}.sv-prog{margin-top:12px}
  .sv-run.flat .sv-track{display:grid;width:auto;transform:none!important}
  .sv-run.flat .sv-card{width:100%;max-width:none;min-height:0;height:auto}
  .work-proof-head{display:block;margin-bottom:24px}.work-proof-head p{margin-top:10px;font-size:15px}
  .work-gallery{gap:30px}.work-tile h3{font-size:25px;margin:8px 0 10px}.work-open{font-size:14px}
  #prices .tabs{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:4px;border:0;padding:0;background:none}
  #prices .tab{font-size:14px;padding:13px 8px;min-height:48px;border:1px solid var(--line-2);border-radius:7px}
  #prices .tab.on{background:var(--cta);color:#151518}#prices .tab-ind{display:none}
  .mobile-tiers{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:22px 0 12px}
  .mobile-tiers button{min-height:44px;padding:10px;border:1px solid var(--line-2);background:none;color:var(--soft);border-radius:6px;font:inherit;font-size:14px}
  .mobile-tiers button[aria-pressed=true]{color:var(--amber);border-color:var(--amber);background:#211b15}
  #pcards.pgrid{display:block;margin:0;padding:0;overflow:visible}
  #pcards .pt{display:none;transform:none;width:100%;min-width:0;margin:0;padding:24px}
  #pcards .pt.act{display:flex;animation:none}#pcards .pt h3{min-height:0}
  #compare.cmp-scroll{padding:0;margin-top:40px;position:relative}
  #compare.cmp-scroll>.wrap{position:sticky;top:12px;padding-top:12px;padding-bottom:24px;background:var(--bg);}
  #compare.cmp-scroll .cmp-top{gap:12px;margin-bottom:14px}
  #compare.cmp-scroll .cmp-tt h2{font-size:25px;line-height:1.16}
  #compare.cmp-scroll .cmp-lead,#compare.cmp-scroll figcaption,#compare.cmp-scroll .cmp-note,#compare.cmp-scroll .cmp[data-sel] .cmp-grid>.ft{display:none}
  #compare.cmp-scroll .cmp-demo{gap:10px;width:100%;max-width:none}
  #compare.cmp-scroll .cmp-svg{max-height:clamp(155px,24svh,235px);width:100%}
  #compare.cmp-scroll .cmp-seg button{font-size:13px;min-height:40px}
  #compare.cmp-scroll .cmp-grid>div{padding:10px 8px;font-size:13px;line-height:1.35}
  #compare .cmp[data-sel="3"] .cmp-grid>.c3{color:var(--ink);background:#231c15;border-bottom-color:#4a3825}
  #compare .cmp[data-sel="3"] .l{color:var(--amber)}
  html.mobile-story header.hdr,html.mobile-story #hdr,html.mobile-story .msticky,html.mobile-prices .msticky,html.mobile-prices #hdr{opacity:0;pointer-events:none}
  #prices .pr-stair{margin:20px 0 0;padding:0;min-height:0}
  #prices .pr-lead{margin:0;font-size:14px}
  .work-gallery{row-gap:28px}
}
@media(max-width:800px){.work-gallery{grid-template-columns:1fr;gap:40px}.work-dialog{width:100%;height:100dvh;border:0}.work-dialog-bar{padding:12px 16px}#caseContent{padding:24px 16px}.case-portrait{grid-template-columns:1fr}.case-portrait img{max-width:400px;margin:0 auto 20px}.pr-stair .ps-row,.pr-stair .ps-cube{display:none}.pr-stair{min-height:0;height:auto;padding-bottom:16px}}
@media(prefers-reduced-motion:reduce){.work-cover img{transition:none}.work-tile:hover .work-cover img{transform:none}}
.work-cover.work-phone-scene{position:relative;isolation:isolate;background:#30211e}
.work-phone-caption{position:absolute;left:7%;top:7%;color:#f4d4c4;font-size:20px;line-height:1.35;font-weight:700}
.work-portrait .work-phone-scene img{position:absolute;width:29%;height:auto;object-fit:cover;border:5px solid #1b1b1d;border-radius:24px;box-shadow:0 18px 26px #0006}
.work-tile .work-cover.work-phone-scene .work-phone-back{left:16%;top:32%;transform:rotate(-9deg)}
.work-tile .work-cover.work-phone-scene .work-phone-front{right:15%;top:17%;transform:rotate(7deg)}
@media(max-width:800px){.work-phone-caption{font-size:16px}.work-portrait .work-phone-scene img{border-width:4px;border-radius:20px}}