/* Живые сценки: путь гостя, карточки, сервисы. Анимации идут, только пока сценка на экране (.play). */
.scn{position:relative;overflow:hidden;border-radius:28px;border:1px solid var(--line);isolation:isolate}
.path .scn{height:clamp(360px,36vw,430px)}
@media (prefers-reduced-motion:reduce){.scn *{animation:none!important}}

/* телефон */
.ph{--pw:170px;position:relative;width:var(--pw);aspect-ratio:9/19;border-radius:calc(var(--pw)*.17);padding:calc(var(--pw)*.035);background:linear-gradient(145deg,#4a4036,#15120e 40%,#0d0b09 70%,#3a3229);box-shadow:inset 0 0 0 1px rgba(230,204,152,.28),0 40px 60px -28px rgba(0,0,0,.95)}
.ph .sc{position:relative;height:100%;border-radius:calc(var(--pw)*.135);overflow:hidden;background:radial-gradient(120% 60% at 50% 0,#173126,#0E0C0A 60%);font:400 calc(var(--pw)*.06)/1.3 var(--sans);color:var(--ink)}
.ph .sc::before{content:"";position:absolute;top:2.6%;left:50%;width:30%;height:3.4%;border-radius:99px;background:#000;transform:translateX(-50%);z-index:9}
.sb{display:flex;justify-content:space-between;align-items:center;padding:1.05em 1.5em .5em;font-weight:600;font-size:.82em}
.sb i{width:1.9em;height:.85em;border-radius:.25em;border:1px solid rgba(243,237,228,.6);position:relative}
.sb i::after{content:"";position:absolute;inset:.12em .5em .12em .12em;border-radius:.12em;background:var(--ink)}
.sc .ic{width:1.35em;height:1.35em;color:var(--gold-l);stroke-width:1.6}
.logo2{width:2.6em;height:1.6em;fill:none;stroke:var(--gold);stroke-width:1.6}

/* карточка LINKO: NFC + QR */
.lk{position:relative;aspect-ratio:1.586;border-radius:7%/11%;padding:7% 8%;background:linear-gradient(140deg,#2a241c,#0F0D0A 58%,#1C1813);border:1px solid rgba(230,204,152,.45);display:flex;flex-direction:column;justify-content:space-between;color:var(--ink);box-shadow:0 26px 34px -16px rgba(0,0,0,.95);font-size:var(--fs,11px)}
.lk-l{display:flex;align-items:center;gap:.6em;font:500 .72em/1 var(--sans);letter-spacing:.4em}
.lk-l svg{width:2.1em;height:1.3em;fill:none;stroke:var(--gold);stroke-width:1.6}
.lk-b{display:flex;justify-content:space-between;align-items:flex-end;gap:.8em}
.lk-n{display:flex;align-items:center;gap:.55em;font:500 1.05em/1.15 var(--serif)}
.lk-n svg{width:1.5em;height:1.5em;flex:none;fill:none;stroke:var(--gold);stroke-width:1.6;stroke-linecap:round}
.lk-q{width:30%;aspect-ratio:1;flex:none;background:#F3EDE4;border-radius:.45em;padding:.3em}
.lk-s{display:block;font:400 .72em/1.3 var(--sans);color:var(--soft);margin-top:.35em}

/* --- путь гостя --- */
.path{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:clamp(56px,7vw,100px)}
.st{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,5vw,80px);align-items:center}
.st:nth-child(even) .st-t{order:2}
.st-t{display:flex;flex-direction:column;gap:14px;max-width:46ch}
.st-n{font:500 clamp(64px,8vw,110px)/.85 var(--serif);color:transparent;-webkit-text-stroke:1px rgba(200,164,107,.55)}
.st .k{font:500 11px/1 var(--sans);letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.st-t p{color:var(--soft)}
@media (max-width:860px){.st{grid-template-columns:1fr}.st:nth-child(even) .st-t{order:0}.st-n{font-size:64px}}

/* 1. касание */
.s1{background:radial-gradient(75% 60% at 50% 78%,#4a2f1b,#21160d 62%,#0d0a07)}
.s1 .lk{position:absolute;left:50%;bottom:7%;width:min(62%,300px);--fs:clamp(10px,1.1vw,13px);transform:translateX(-50%) perspective(700px) rotateX(52deg)}
.s1 .ph{position:absolute;left:50%;bottom:26%;--pw:clamp(118px,11vw,140px);transform:translateX(-50%);z-index:2}
.s1.play .ph{animation:s1tap 6s var(--ease) infinite}
@keyframes s1tap{0%,6%{transform:translate(-50%,-8%) rotate(-7deg)}28%,74%{transform:translate(-50%,6%) rotate(0)}94%,100%{transform:translate(-50%,-8%) rotate(-7deg)}}
.s1 .rg{position:absolute;left:50%;bottom:24%;width:2px;height:2px;z-index:1}
.s1 .rg i{position:absolute;left:-90px;top:-28px;width:180px;height:56px;border-radius:50%;border:1.5px solid var(--gold-l);opacity:0}
.s1.play .rg i{animation:s1ring 6s ease-out infinite}.s1.play .rg i:nth-child(2){animation-delay:.25s}.s1.play .rg i:nth-child(3){animation-delay:.5s}
@keyframes s1ring{0%,27%{transform:scale(.25);opacity:0}30%{opacity:.85}52%,100%{transform:scale(1.5);opacity:0}}
.s1 .off{position:absolute;inset:0;background:#050505;z-index:5;opacity:0}
.s1.play .off{animation:s1off 6s infinite}
@keyframes s1off{0%,28%{opacity:1}36%,80%{opacity:0}92%,100%{opacity:1}}
.hi{display:flex;flex-direction:column;align-items:center;gap:.35em;padding:1.2em 1em .9em;text-align:center}
.hi span{font-size:.72em;letter-spacing:.3em;color:var(--gold)}
.hi b{font:500 1.55em/1.1 var(--serif)}
.bt4{display:flex;flex-direction:column;gap:.55em;padding:0 .9em}
.bt4 span{display:flex;align-items:center;gap:.7em;padding:.75em .85em;border-radius:.9em;background:rgba(36,32,26,.95);border:1px solid rgba(200,164,107,.22);font-weight:500;font-size:.92em}
.s1.play .bt4 span{animation:s1in 6s var(--ease) infinite}
.s1.play .bt4 span:nth-child(2){animation-name:s1in2}.s1.play .bt4 span:nth-child(3){animation-name:s1in3}.s1.play .bt4 span:nth-child(4){animation-name:s1in4}
@keyframes s1in{0%,34%{opacity:0;transform:translateY(.8em)}42%,100%{opacity:1;transform:none}}
@keyframes s1in2{0%,38%{opacity:0;transform:translateY(.8em)}46%,100%{opacity:1;transform:none}}
@keyframes s1in3{0%,42%{opacity:0;transform:translateY(.8em)}50%,100%{opacity:1;transform:none}}
@keyframes s1in4{0%,46%{opacity:0;transform:translateY(.8em)}54%,100%{opacity:1;transform:none}}

/* 2. меню по фото */
.s2{background:radial-gradient(70% 70% at 50% 40%,#1b3328,#0d0b09 75%);display:grid;place-items:center}
.s2 .ph{--pw:clamp(160px,15vw,190px)}
.mh{display:flex;flex-direction:column;gap:.55em;padding:.3em 1em .7em}
.mh b{font:500 1.5em/1 var(--serif)}
.tabs{display:flex;gap:.45em;font-size:.78em}
.tabs i{font-style:normal;padding:.4em .8em;border-radius:99px;border:1px solid var(--line);color:var(--soft)}.tabs i.on{background:var(--gold);border-color:var(--gold);color:#120F0B}
.ml{display:flex;flex-direction:column;gap:.6em;padding:0 .8em}
.dish{display:flex;align-items:center;gap:.7em;padding:.45em;border-radius:.9em;background:rgba(32,28,23,.95);height:5.4em;flex:none}
.dish img{width:4em;height:4em;border-radius:.65em;object-fit:cover;flex:none}
.dish div{display:flex;flex-direction:column;gap:.2em;min-width:0}
.dish b{font:500 .9em/1.15 var(--serif);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dish span{font-size:.76em;color:var(--soft);white-space:nowrap}
.add{margin-left:auto;flex:none;width:1.9em;height:1.9em;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:#120F0B;font:600 1.1em/1 var(--sans);font-style:normal}
.s2.play .ml{animation:s2scroll 9s var(--ease) infinite}
@keyframes s2scroll{0%,12%{transform:none}24%,86%{transform:translateY(-6em)}96%,100%{transform:none}}
.cart{position:absolute;left:.8em;right:.8em;bottom:1.1em;display:flex;align-items:center;justify-content:space-between;padding:.8em 1em;border-radius:99px;background:var(--gold);color:#120F0B;font-weight:600;font-size:.86em;z-index:3}
.cv{display:grid}.cv span{grid-area:1/1}.cart .c1{opacity:0}
.s2.play .cart{animation:s2cart 9s var(--ease) infinite}
.s2.play .cart .c1{animation:s2c1 9s infinite}.s2.play .cart .c2{animation:s2c2 9s infinite}
@keyframes s2cart{0%,30%{transform:translateY(160%)}35%,90%{transform:none}96%,100%{transform:translateY(160%)}}
@keyframes s2c1{0%,67%{opacity:1}70%,100%{opacity:0}}
@keyframes s2c2{0%,67%{opacity:0}70%,100%{opacity:1}}
.sheet{position:absolute;left:0;right:0;bottom:0;padding:1em 1em 4.6em;border-radius:1.4em 1.4em 0 0;background:#1d1a15;border-top:1px solid var(--line2);z-index:2;transform:translateY(100%)}
.sheet>span{font-size:.75em;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.sg{display:flex;align-items:center;gap:.7em;margin-top:.6em;padding:.6em .7em;border-radius:.9em;background:rgba(255,255,255,.05)}
.sg>div{display:flex;flex-direction:column;gap:.15em}.sg .add{margin-left:auto}.sg b{font:500 .95em/1.1 var(--serif)}.sg span{font-size:.75em;color:var(--soft)}
.s2.play .sheet{animation:s2sheet 9s var(--ease) infinite}
@keyframes s2sheet{0%,42%{transform:translateY(100%)}48%,64%{transform:none}70%,100%{transform:translateY(100%)}}
.tap{position:absolute;width:2.6em;height:2.6em;margin:-1.3em 0 0 -1.3em;border-radius:50%;background:rgba(243,237,228,.55);opacity:0;z-index:6;pointer-events:none}
.s2 .t1{left:85%;top:43%}.s2 .t2{left:85%;top:80%}
.s2.play .t1{animation:s2t1 9s infinite}.s2.play .t2{animation:s2t2 9s infinite}
@keyframes s2t1{0%,27%{opacity:0;transform:scale(.4)}29%{opacity:.9;transform:scale(.8)}33%,100%{opacity:0;transform:scale(1.4)}}
@keyframes s2t2{0%,57%{opacity:0;transform:scale(.4)}59%{opacity:.9;transform:scale(.8)}63%,100%{opacity:0;transform:scale(1.4)}}

/* 3. заказ — официанту */
.s3{background:radial-gradient(60% 70% at 25% 60%,#1d3529,transparent 70%),radial-gradient(60% 70% at 78% 40%,#3a2717,transparent 70%),#0d0b09;display:flex;align-items:center;justify-content:space-around;padding:0 4%}
.who{display:flex;flex-direction:column;align-items:center;gap:12px;z-index:1}
.who .ph{--pw:clamp(118px,11.5vw,146px)}
.who.gst .ph{transform:rotate(-5deg)}.who.wtr .ph{transform:rotate(5deg)}
.lbl{font:500 11px/1 var(--sans);letter-spacing:.3em;text-transform:uppercase;color:var(--soft)}
.oc{display:flex;flex-direction:column;gap:.5em;padding:.5em .9em}
.oc .k2{font-size:.72em;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.it{display:flex;justify-content:space-between;gap:.5em;padding:.55em .65em;border-radius:.7em;background:rgba(36,32,26,.95);font-size:.85em}
.it b{font:500 1em/1.2 var(--serif)}.it span{color:var(--gold-l);white-space:nowrap}
.tot{display:flex;justify-content:space-between;padding:.3em .2em;font-size:.9em}.tot b{font-weight:600}
.sbtn{position:relative;height:2.7em;border-radius:99px;font-size:.82em;font-weight:600}
.sbtn span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:.4em;border-radius:99px}
.sbtn .a{background:var(--gold);color:#120F0B;opacity:0}.sbtn .b{background:rgba(200,164,107,.15);color:var(--gold-l);opacity:0}.sbtn .c{background:rgba(110,170,120,.18);color:#bfe3c4}
.sbtn .c .ic{color:#bfe3c4;width:1.3em;height:1.3em}
.s3.play .sbtn .a{animation:s3a 8s infinite}.s3.play .sbtn .b{animation:s3b 8s infinite}.s3.play .sbtn .c{animation:s3c 8s infinite}
@keyframes s3a{0%,15%{opacity:1;transform:none}18%{transform:scale(.94)}22%,100%{opacity:0}}
@keyframes s3b{0%,22%{opacity:0}25%,56%{opacity:1}59%,100%{opacity:0}}
@keyframes s3c{0%,58%{opacity:0}61%,94%{opacity:1}98%,100%{opacity:0}}
.pk{position:absolute;left:30%;top:66%;width:12px;height:12px;margin:-6px;border-radius:50%;background:var(--gold-l);box-shadow:0 0 18px 6px rgba(230,204,152,.6);opacity:0;z-index:3}
.s3.play .pk{animation:s3pk 8s cubic-bezier(.45,.05,.4,1) infinite}
@keyframes s3pk{0%,20%{left:30%;top:66%;opacity:0}22%{opacity:1}31%{left:50%;top:18%}40%{left:70%;top:34%;opacity:1}43%,100%{left:70%;top:34%;opacity:0}}
.lock .clk{display:flex;flex-direction:column;align-items:center;padding:.6em 0 .8em}
.lock .clk b{font:300 3.1em/1 var(--sans);letter-spacing:-.02em}.lock .clk span{font-size:.75em;color:var(--soft)}
.nt{margin:0 .6em;padding:.7em .75em;border-radius:1em;background:rgba(40,36,30,.92);border:1px solid rgba(230,204,152,.25);display:flex;flex-direction:column;gap:.25em;font-size:.86em;box-shadow:0 10px 24px -10px rgba(0,0,0,.8)}
.nh{display:flex;align-items:center;gap:.45em;font-size:.78em;color:var(--soft)}.nh svg{width:1.9em;height:1.2em;fill:none;stroke:var(--gold);stroke-width:1.8}.nh em{margin-left:auto;font-style:normal}
.nt b{font-weight:600}.nt>span{color:var(--soft);font-size:.9em;line-height:1.3}
.acc{margin-top:.35em;align-self:flex-start;padding:.45em 1em;border-radius:99px;background:var(--gold);color:#120F0B;font:600 .85em/1 var(--sans);font-style:normal}
.s3.play .nt{animation:s3nt 8s var(--ease) infinite}.s3.play .acc{animation:s3acc 8s infinite}
@keyframes s3nt{0%,40%{opacity:0;transform:translateY(-140%)}44%{opacity:1;transform:none}46%{transform:translateX(-4%)}48%{transform:translateX(4%)}50%,92%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(-30%)}}
@keyframes s3acc{0%,55%{transform:none;background:var(--gold)}57%{transform:scale(.9)}59%,100%{transform:none;background:#bfe3c4}}
@media (max-width:420px){.s3{padding:0 2%}.who .ph{--pw:112px}}

/* 4. отчёт в понедельник */
.s4{background:radial-gradient(70% 60% at 60% 30%,#1b3328,#0d0b09 75%);display:grid;place-items:center;padding:28px 20px}
.path .scn.s4{height:auto}
.rp{width:min(100%,380px);border-radius:22px;background:#15130f;border:1px solid var(--line);padding:16px;display:flex;flex-direction:column;gap:12px;box-shadow:0 40px 60px -30px rgba(0,0,0,.9)}
.rp-h{display:flex;align-items:center;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.rp-h i{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:#120F0B;font:600 12px/1 var(--sans);font-style:normal}
.rp-h b{display:block;font-weight:500;font-size:14px}.rp-h span{font-size:12px;color:var(--soft)}
.typing{display:none;gap:5px;padding:10px 14px;border-radius:14px;background:var(--surf2);align-self:flex-start}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--soft);animation:dot 1s infinite}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{50%{transform:translateY(-3px);opacity:.4}}
.s4.play .typing{display:flex;animation:s4ty 1.1s forwards}
@keyframes s4ty{0%,90%{opacity:1}100%{opacity:0;height:0;padding:0;margin:-6px 0}}
.msg{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:16px;background:var(--surf2)}
.s4.play .msg{animation:s4msg .7s 1.1s var(--ease) both}
@keyframes s4msg{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.mt{font-weight:500;font-size:14px}.mt span{color:var(--faint);font-weight:400}
.kp{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kp div{padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.035);display:flex;flex-direction:column;gap:3px}
.kp span{font-size:11.5px;color:var(--soft)}.kp b{font:500 22px/1.1 var(--serif);color:var(--gold-l);font-variant-numeric:tabular-nums}
.rb{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;align-items:end;height:74px}
.rb i{display:block;height:calc(var(--h)*100%);border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,var(--gold-l),rgba(200,164,107,.35));transform-origin:bottom}
.rb i.mx{background:linear-gradient(180deg,#f2d9a6,var(--gold))}
.s4.play .rb i{animation:s4bar .8s var(--ease) both}
.s4.play .rb i:nth-child(1){animation-delay:1.4s}.s4.play .rb i:nth-child(2){animation-delay:1.48s}.s4.play .rb i:nth-child(3){animation-delay:1.56s}.s4.play .rb i:nth-child(4){animation-delay:1.64s}.s4.play .rb i:nth-child(5){animation-delay:1.72s}.s4.play .rb i:nth-child(6){animation-delay:1.8s}.s4.play .rb i:nth-child(7){animation-delay:1.88s}
@keyframes s4bar{from{transform:scaleY(0)}to{transform:none}}
.rd{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;font-size:10.5px;color:var(--faint);text-align:center;margin-top:-4px}
.best{font-size:13px;color:var(--soft)}.best b{color:var(--ink);font-weight:500}

/* --- карточки: NFC + QR, любая форма --- */
.pc .vis{height:190px;perspective:800px}
.pc .lk{width:220px;--fs:11px;transform:rotateX(16deg) rotateY(-14deg);transition:transform .6s var(--ease)}
.pc:hover .lk{transform:rotateX(6deg) rotateY(-4deg) translateY(-4px)}
.lk.v{width:132px;aspect-ratio:.68;padding:12px;align-items:center;text-align:center;gap:6px}
.lk.v .lk-q{width:62%}
.lk.v .lk-n{font-size:12px}
.lk.v .lk-t{font:500 13px/1.2 var(--serif)}
.shapes{position:relative;width:250px;height:170px}
.shapes>div{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:#1A1612;box-shadow:0 20px 30px -14px rgba(0,0,0,.9);transition:transform .6s var(--ease)}
.shapes svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.shapes img{width:38px;aspect-ratio:1;background:#F3EDE4;border-radius:4px;padding:2px}
.shapes small{font:500 8px/1 var(--sans);letter-spacing:.3em}
.sh-r{left:0;top:26px;width:118px;height:118px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#e7c99c,#b98a55 70%,#9a6e40);border:1px solid rgba(0,0,0,.15)}
.sh-t{left:92px;top:0;width:78px;height:132px;border-radius:10px 10px 4px 4px;background:linear-gradient(160deg,#1f4a3a,#0f2a20);color:#F3EDE4;border:1px solid rgba(230,204,152,.35)}
.sh-t svg{stroke:var(--gold-l)}
.sh-a{left:156px;top:44px;width:94px;height:94px;border-radius:14px;background:linear-gradient(140deg,rgba(255,255,255,.22),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:var(--ink)}
.pc:hover .sh-r{transform:translate(-6px,-4px) rotate(-6deg)}.pc:hover .sh-a{transform:translate(6px,-4px) rotate(6deg)}

/* --- сервисы: маленькие демо --- */
.sv-order{width:250px;height:330px;display:grid;place-items:center;border:0;background:radial-gradient(60% 55% at 50% 50%,rgba(29,58,45,.8),transparent 75%)}
.sv-order .ph{--pw:150px}
.ost{position:absolute;inset:3em 0 0;padding:0 .8em;display:flex;flex-direction:column;gap:.55em}
.o1,.o3{opacity:0}
.o1 img{width:100%;height:7.6em;object-fit:cover;border-radius:.9em}
.o1 b{font:500 1.15em/1.1 var(--serif)}.o1 span{font-size:.78em;color:var(--soft)}
.prc{display:flex;justify-content:space-between;align-items:center;margin-top:.2em}.prc b{font:600 1em/1 var(--sans);color:var(--gold-l)}
.prc i{font-style:normal;padding:.6em 1.1em;border-radius:99px;background:var(--gold);color:#120F0B;font-weight:600;font-size:.82em}
.o2 .go2{margin-top:.3em;text-align:center;padding:.8em;border-radius:99px;background:var(--gold);color:#120F0B;font-weight:600;font-size:.82em}
.o3{align-items:center;text-align:center;justify-content:center;padding-bottom:3em}
.o3 .ok{width:4.4em;height:4.4em;border-radius:50%;display:grid;place-items:center;background:rgba(200,164,107,.14);border:1px solid var(--line2)}
.o3 .ok .ic{width:2em;height:2em}
.o3 b{font:500 1.3em/1.15 var(--serif)}.o3 span{font-size:.8em;color:var(--soft)}
.live2{display:inline-flex;align-items:center;gap:.5em;padding:.45em .9em;border-radius:99px;background:rgba(200,164,107,.12);color:var(--gold-l);font-size:.8em}
.live2 i{width:.6em;height:.6em;border-radius:50%;background:var(--gold);animation:pulse 1.6s infinite}
.sv-order.play .o1{animation:o1 9s infinite}.sv-order.play .o2{animation:o2 9s infinite}.sv-order.play .o3{animation:o3 9s infinite}
@keyframes o1{0%,28%{opacity:1;transform:none}33%,100%{opacity:0;transform:translateX(-12%)}}
@keyframes o2{0%,30%{opacity:0;transform:translateX(12%)}35%,61%{opacity:1;transform:none}66%,100%{opacity:0;transform:translateX(-12%)}}
@keyframes o3{0%,63%{opacity:0;transform:scale(.94)}68%,96%{opacity:1;transform:none}100%{opacity:0}}
.sv-order .tap{left:72%;top:58%}.sv-order.play .tap{animation:svt 9s infinite}
@keyframes svt{0%,22%{opacity:0;transform:scale(.4)}24%{opacity:.9;transform:scale(.8)}28%,52%{opacity:0;transform:scale(1.4)}53%{opacity:0;left:50%;top:73%;transform:scale(.4)}55%{opacity:.9;left:50%;top:73%;transform:scale(.8)}59%,100%{opacity:0;left:50%;top:73%;transform:scale(1.4)}}
.dm{position:relative;height:150px;margin-top:auto;border-radius:18px;background:#0f0d0a;border:1px solid var(--line);overflow:hidden}
.dm-nfc{background:radial-gradient(70% 70% at 50% 85%,#3a2616,#120d09 75%)}
.dm-nfc .lk{position:absolute;left:50%;bottom:10px;width:150px;--fs:8px;transform:translateX(-50%) perspective(500px) rotateX(50deg)}
.dm-nfc .ph{position:absolute;left:50%;bottom:44px;--pw:52px;transform:translateX(-50%);z-index:2}
.dm-nfc .ph .sc::before{display:none}
.dm-nfc.play .ph{animation:s1tap 4s var(--ease) infinite}
.dm-nfc .rg{position:absolute;left:50%;bottom:40px;width:2px;height:2px}
.dm-nfc .rg i{position:absolute;left:-60px;top:-18px;width:120px;height:36px;border-radius:50%;border:1.5px solid var(--gold-l);opacity:0}
.dm-nfc.play .rg i{animation:s1ring 4s ease-out infinite}.dm-nfc.play .rg i:nth-child(2){animation-delay:.25s}
.dm-nfc .ph .sc{background:linear-gradient(160deg,#21402f,#0E0C0A)}
.chip{position:absolute;top:12px;left:12px;font-size:11.5px;padding:6px 10px;border-radius:99px;background:rgba(255,255,255,.06);color:var(--soft)}
.dm-rev{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.stars{display:flex;gap:6px}
.stars svg{width:26px;height:26px;fill:var(--gold);stroke:var(--gold);stroke-width:1}
.dm-rev.play .stars svg{animation:star 5s infinite}
.dm-rev.play .stars svg:nth-child(2){animation-delay:.15s}.dm-rev.play .stars svg:nth-child(3){animation-delay:.3s}.dm-rev.play .stars svg:nth-child(4){animation-delay:.45s}.dm-rev.play .stars svg:nth-child(5){animation-delay:.6s}
@keyframes star{0%,8%{fill:transparent;stroke:#5c544a;transform:scale(.85)}14%{transform:scale(1.2)}18%,90%{fill:var(--gold);stroke:var(--gold);transform:none}100%{fill:transparent;stroke:#5c544a}}
.toast2{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:8px 12px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid var(--line)}
.toast2 .ic{width:16px;height:16px;color:var(--gold)}
.dm-rev.play .toast2{animation:rtoast 5s infinite}
@keyframes rtoast{0%,30%{opacity:0;transform:translateY(8px)}38%,88%{opacity:1;transform:none}96%,100%{opacity:0}}
.dm-book{display:flex;flex-direction:column;justify-content:center;gap:10px;padding:12px 14px}
.days2{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.days2 span{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;border-radius:10px;font-size:10.5px;color:var(--soft);border:1px solid var(--line)}
.days2 b{font:500 15px/1 var(--sans);color:var(--ink)}
.days2 .on{background:var(--gold);border-color:var(--gold);color:#120F0B}.days2 .on b{color:#120F0B}
.times{display:flex;gap:6px}
.times span{flex:1;text-align:center;padding:6px 0;border-radius:99px;font-size:11.5px;border:1px solid var(--line);color:var(--soft)}
.times .on{border-color:var(--gold);color:var(--gold-l)}
.dm-book .toast2{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);white-space:nowrap;background:#1d1a15;opacity:0}
.dm-book.play .days2 .on{animation:bday 6s infinite}.dm-book.play .times .on{animation:btime 6s infinite}.dm-book.play .toast2{animation:btoast 6s infinite}
@keyframes bday{0%,10%{background:transparent;border-color:var(--line);color:var(--soft)}16%,100%{background:var(--gold);border-color:var(--gold);color:#120F0B}}
@keyframes btime{0%,28%{border-color:var(--line);color:var(--soft)}34%,100%{border-color:var(--gold);color:var(--gold-l)}}
@keyframes btoast{0%,48%{opacity:0;transform:translate(-50%,8px)}56%,90%{opacity:1;transform:translate(-50%,0)}98%,100%{opacity:0}}
.dm-site{padding:12px}
.brw{position:relative;height:100%;border-radius:10px;overflow:hidden;background:#000;border:1px solid var(--line)}
.brw::before{content:"";position:absolute;left:0;right:0;top:0;height:18px;background:#1d1a15;z-index:3;box-shadow:inset 10px 0 0 -6px #6b5a45}
.brw img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.25);filter:brightness(.7)}
.brw b{position:absolute;left:14px;bottom:14px;font:500 20px/1.05 var(--serif);z-index:2;text-shadow:0 2px 14px rgba(0,0,0,.8)}
.brw b em{display:block}
.dm-site.play .brw img{animation:szoom 7s ease-in-out infinite alternate}.dm-site.play .brw b{animation:stext 7s ease-in-out infinite alternate}
@keyframes szoom{from{transform:scale(1.35) translateY(4%)}to{transform:scale(1.05) translateY(-3%)}}
@keyframes stext{from{transform:translateY(16px);opacity:.3}to{transform:none;opacity:1}}
@media (max-width:600px){.sv-order{width:100%}}

/* --- наши работы: одна страница, переключатель стилей --- */
.sty{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,6vw,90px);align-items:center}
.sty-ph{position:relative;display:grid;place-items:center;padding-block:20px}
.sty-glow{position:absolute;left:50%;top:50%;width:min(130%,520px);aspect-ratio:1;transform:translate(-50%,-50%);background-color:#C8875A;opacity:.32;-webkit-mask:radial-gradient(closest-side,#000,transparent);mask:radial-gradient(closest-side,#000,transparent);transition:background-color .8s ease;pointer-events:none}
.sty .phone{position:relative;right:auto;top:auto;width:clamp(240px,23vw,290px);animation:none}
.sty-c{display:flex;flex-direction:column;gap:22px}
.sty-l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.sty-l button{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:14px;row-gap:2px;align-items:center;text-align:left;padding:16px 18px;border-radius:18px;background:var(--surf);border:1px solid var(--line);color:var(--ink);font:inherit;cursor:pointer;transition:border-color .35s,background .35s,transform .35s var(--ease)}
.sty-l button:hover{border-color:var(--line2);transform:translateY(-2px)}
.sty-l button[aria-checked="true"]{border-color:var(--gold);background:linear-gradient(180deg,rgba(200,164,107,.1),var(--surf))}
.sty-l .sw{grid-row:1/3;display:flex}
.sty-l .sw i{width:22px;height:22px;border-radius:50%;border:2px solid var(--surf);margin-left:-8px;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.sty-l .sw i:first-child{margin-left:0}
.sty-l b{font:500 18px/1.2 var(--serif)}
.sty-l small{font-size:13px;color:var(--soft)}
.sty-n{color:var(--soft);font-size:15px;max-width:48ch}
@media (max-width:860px){.sty{grid-template-columns:1fr;gap:18px}.sty-c{order:-1;gap:14px}.sty .phone{width:min(220px,58vw)}.sty-ph{padding-block:6px}
  .sty-l{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.sty-l button{grid-template-columns:1fr;justify-items:center;text-align:center;row-gap:6px;padding:10px 6px;border-radius:14px}
  .sty-l .sw{grid-row:auto}.sty-l .sw i{width:16px;height:16px;margin-left:-6px}.sty-l b{font-size:14px}.sty-l small{display:none}.sty-l .wide{grid-column:1/-1}.sty-n{font-size:14px}}

/* стоимость: калькулятор */
.calc{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(20px,3vw,40px);align-items:start}
.calc-o{display:flex;flex-direction:column;gap:12px}
.calc-n{padding:22px 24px;border-radius:20px;background:var(--surf);border:1px solid var(--line)}
.calc-n>label{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft)}
.calc-r{display:flex;align-items:center;gap:18px;margin-top:10px}
.calc-r input{flex:1;min-width:0;accent-color:var(--gold);border:0;padding:0;height:28px}
.calc-r output{font:500 34px/1 var(--serif);color:var(--gold-l);min-width:2ch;text-align:right}
.calc-g{display:flex;flex-direction:column;gap:8px;padding-top:8px}
.calc-g>span{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft);padding-left:4px}
.calc-i{position:relative;flex-direction:row;align-items:flex-start;gap:14px;padding:16px 20px;border-radius:18px;border:1px solid var(--line);background:rgba(22,20,15,.55);cursor:pointer;letter-spacing:0;text-transform:none;color:var(--ink);font-size:15px;transition:border-color .3s,background .3s}
.calc-i input{position:absolute;opacity:0;pointer-events:none}
.calc-i::before{content:"";flex:none;width:20px;height:20px;margin-top:2px;border-radius:6px;border:1.5px solid var(--line2);transition:background .3s,border-color .3s,box-shadow .3s}
.calc-g .calc-i::before{border-radius:50%}
.calc-i:has(input:checked){border-color:var(--line2);background:rgba(200,164,107,.07)}
.calc-i:has(input:checked)::before{background:var(--gold);border-color:var(--gold);box-shadow:inset 0 0 0 4px var(--bg)}
.calc-i:has(input:focus-visible){outline:1.5px solid var(--gold-l);outline-offset:3px}
.calc-i span{display:flex;flex-direction:column;gap:4px}
.calc-i b{font-weight:500}.calc-i small{font-size:13.5px;color:var(--soft);line-height:1.45}
.calc-s{position:sticky;top:96px;display:flex;flex-direction:column;gap:16px;padding:28px 26px;border-radius:24px;background:linear-gradient(160deg,var(--surf2),var(--surf));border:1px solid var(--line2)}
.calc-l{display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--soft);min-height:40px}
.calc-l div{display:flex;justify-content:space-between;gap:12px}.calc-l div b{font-weight:400;color:var(--ink);white-space:nowrap}
.calc-t{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-top:14px;border-top:1px solid var(--line)}
.calc-t span{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--soft)}
.calc-t b{font:500 clamp(26px,2.6vw,34px)/1 var(--serif);color:var(--gold-l);white-space:nowrap}
.calc-f{font-size:13px;color:var(--faint)}
.calc-s .btn{justify-content:center}
@media (max-width:860px){.calc{grid-template-columns:1fr}.calc-s{position:static}}

/* частые вопросы */
.faq-g{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,96px);align-items:start}
.faq-g .head a{color:var(--gold-l)}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 2px;font:500 clamp(18px,1.6vw,21px)/1.3 var(--serif);transition:color .3s}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:12px;height:12px;border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);transform:translateY(-3px) rotate(45deg);transition:transform .35s var(--ease)}
.faq details[open] summary::after{transform:translateY(3px) rotate(-135deg)}
.faq summary:hover{color:var(--gold-l)}
.faq details p{color:var(--soft);font-size:16px;padding:0 2px 24px;max-width:60ch}
@media (max-width:860px){.faq-g{grid-template-columns:1fr}}

/* Telegram внизу экрана на телефоне */
.tgb{display:none}
@media (max-width:720px){
  .tgb{display:flex;position:fixed;z-index:40;left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom,0px));justify-content:center;align-items:center;gap:10px;padding:15px 20px;border-radius:999px;background:var(--gold);color:#120F0B;font:500 15px/1 var(--sans);text-decoration:none;box-shadow:0 12px 34px rgba(0,0,0,.5);transform:translateY(140%);transition:transform .45s var(--ease)}
  .tgb .ic{width:18px;height:18px}
  .tgb.on{transform:none}
  .foot{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}}