.real-demo,.tap-demo{display:none!important}.auto-demo{padding:100px 5vw 115px;background:radial-gradient(circle at 50% 50%,#333a38,#0d0f0e 45%,#030303 78%);overflow:hidden}.auto-head{text-align:center;max-width:760px;margin:auto}.auto-head small{font-size:10px;letter-spacing:.2em;color:#aaa}.auto-head h2{font-size:clamp(42px,6vw,72px);letter-spacing:-4px;margin:13px 0}.auto-head p{color:#aaa}.auto-stage{max-width:1180px;height:650px;margin:35px auto 0;position:relative}.auto-cards{position:absolute;inset:auto 0 35px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:end}.auto-card{position:relative;aspect-ratio:1;overflow:hidden;border-radius:23px;border:1px solid #ffffff36;background:#111;box-shadow:0 28px 65px #000b;transition:.6s cubic-bezier(.16,1,.3,1);transform:perspective(800px) rotateX(10deg) scale(.92);opacity:.66}.auto-card:nth-child(2),.auto-card:nth-child(4){transform:perspective(800px) rotateX(10deg) translateY(22px) scale(.92)}.auto-card.active{opacity:1;transform:perspective(800px) rotateX(3deg) translateY(-16px) scale(1);box-shadow:0 35px 85px #000,0 0 0 2px #fff}.auto-card img{width:100%;height:110%;object-fit:cover;transform:translateY(-3%)}.auto-card>span{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);padding:6px 11px;border-radius:99px;background:#000d;color:#fff;font-size:9px;font-weight:700;white-space:nowrap}.auto-card i{position:absolute;left:50%;top:52%;width:30px;height:30px;border:2px solid #fff;border-radius:50%;opacity:0}.auto-card.detected i{animation:autoScan 1s ease-out}@keyframes autoScan{0%{opacity:1;transform:translate(-50%,-50%) scale(.3)}100%{opacity:0;transform:translate(-50%,-50%) scale(6)}}.auto-phone{position:absolute;left:0;top:0;width:190px;height:380px;padding:7px;border:6px solid #333;border-radius:36px;background:#050505;z-index:8;box-shadow:0 40px 80px #000;transition:transform 1.15s cubic-bezier(.55,.05,.22,1),box-shadow .3s}.auto-phone:before{content:'';position:absolute;z-index:9;left:50%;top:12px;transform:translateX(-50%);width:60px;height:16px;border-radius:15px;background:#050505}.auto-phone.reading{box-shadow:0 35px 90px #000,0 0 45px #fff8}.auto-phone .phone-screen{border-radius:25px}.auto-phone .opened-top{padding-top:40px}.auto-phone .opened-body{padding:17px 13px}.auto-phone .opened-body h3{font-size:14px}.auto-phone .opened-body p{font-size:10px}.auto-phone .opened-body button{font-size:10px}.detect-note{position:absolute;left:50%;top:30%;z-index:12;padding:12px 17px;border-radius:99px;background:#fff;color:#111;font-size:10px;font-weight:800;opacity:0;transform:translate(-50%,15px);transition:.3s}.detect-note.show{opacity:1;transform:translate(-50%,0)}.demo-progress{display:flex;justify-content:center;gap:7px}.demo-progress i{width:28px;height:3px;background:#555;border-radius:3px;transition:.4s}.demo-progress i.active{width:55px;background:#fff}@media(max-width:900px){.auto-stage{height:780px}.auto-cards{grid-template-columns:repeat(2,190px);justify-content:center}.auto-phone{width:160px;height:320px}}@media(max-width:600px){.auto-demo{padding:70px 15px}.auto-stage{height:675px}.auto-cards{grid-template-columns:repeat(2,145px);gap:12px}.auto-phone{width:130px;height:260px}.auto-card{border-radius:16px}.auto-card>span{font-size:7px}.auto-head h2{letter-spacing:-3px}}