.demo-frame{--z:1;border:1px solid var(--border);max-width:1100px;height:calc(470px * var(--z));background:radial-gradient(circle at 20% 10%,#f6e8e5 0,#0000 55%),radial-gradient(circle at 90% 90%,#e9eee4 0,#0000 50%),#f4f0e9;border-radius:26px;margin:0 auto;position:relative;overflow:hidden}.demo-stage{width:1060px;height:470px;transform:scale(var(--z));transform-origin:top;color:var(--foreground);margin-left:-530px;font-family:Arial,Helvetica,sans-serif;position:absolute;top:0;left:50%}.demo-stage *{box-sizing:border-box}.demo-stage,.demo-stage *{animation-duration:14s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}.d-browser{background:#fff;border-radius:16px;width:500px;height:350px;position:absolute;top:52px;left:36px;overflow:hidden;box-shadow:0 24px 60px -24px #283b3355,0 0 0 1px #283b3312}.d-bar{background:#f1f0ec;border-bottom:1px solid #e6e3dc;align-items:center;gap:6px;height:40px;padding:0 12px;display:flex}.d-bar i{background:#e36b5d;border-radius:50%;width:10px;height:10px}.d-bar i:nth-child(2){background:#e9b949}.d-bar i:nth-child(3){background:#6cbf5a}.d-url{color:#777;background:#fff;border-radius:12px;flex:1;align-items:center;gap:6px;height:24px;margin-left:8px;padding:0 10px;font-size:11px;display:flex}.d-ext{background:var(--red);color:#fff;border-radius:8px;place-items:center;width:28px;height:28px;animation-name:d-ext;display:grid}.d-shop{grid-template-columns:190px 1fr;gap:22px;padding:24px;display:grid}.d-photo{color:#3c4f46;background:linear-gradient(145deg,#eef0ea,#dfe4da);border-radius:12px;place-items:center;height:190px;display:grid}.d-info{flex-direction:column;gap:9px;padding-top:4px;display:flex}.d-brand{letter-spacing:.14em;color:#999;font-size:10px;font-weight:700}.d-info strong{color:#222;font-size:18px;line-height:1.3}.d-stars{color:#e0a526;font-size:13px}.d-price{color:#222;font-size:24px;font-weight:700}.d-cart{color:#fff;text-align:center;background:#222;border-radius:8px;margin-top:6px;padding:11px;font-size:13px;font-weight:700}.d-cursor{filter:drop-shadow(0 3px 4px #0003);animation-name:d-cursor;position:absolute;top:260px;left:250px}.d-popup{opacity:0;background:#fffdf9;border-radius:14px;width:280px;animation-name:d-popup;position:absolute;top:84px;left:330px;overflow:hidden;box-shadow:0 30px 70px -20px #283b3370,0 0 0 1px #283b3318}.d-popup-head{border-bottom:1px solid #eee9df;align-items:center;gap:8px;padding:12px 14px;font:600 15px/1 Georgia,serif;display:flex}.d-logo{background:var(--red);color:#fff;border-radius:6px;place-items:center;width:22px;height:22px;display:grid}.d-popup-body{gap:12px;padding:14px;display:flex}.d-thumb{color:#3c4f46;background:#eef0ea;border-radius:10px;flex:none;place-items:center;width:66px;height:66px;display:grid}.d-fields{flex-direction:column;flex:1;gap:8px;display:flex}.d-field{background:#fff;border:1px solid #dcdfd6;border-radius:7px;align-items:center;height:29px;padding:0 9px;font-size:12px;display:flex;overflow:hidden}.d-field.short{width:60%}.d-type,.d-type2{white-space:nowrap;width:0;animation-name:d-type;animation-timing-function:steps(15,end);display:inline-block;overflow:hidden}.d-type2{animation-name:d-type2;animation-timing-function:steps(8,end)}.d-btn{background:var(--red);color:#fff;border-radius:8px;justify-content:center;align-items:center;gap:6px;margin:0 14px 14px;padding:10px;font-size:12.5px;font-weight:700;animation-name:d-btn;display:flex}.d-list{background:#fff;border-radius:18px;width:390px;height:400px;padding:20px;position:absolute;top:40px;right:36px;box-shadow:0 24px 60px -24px #283b3355,0 0 0 1px #283b3312}.d-list-head{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.d-list-head small{letter-spacing:.16em;color:#8a917f;font-size:10px;font-weight:700;display:block}.d-list-head strong{color:var(--red);font:italic 400 30px/1.1 Georgia,serif}.d-share{border:1px solid var(--border);border-radius:30px;align-items:center;gap:6px;padding:7px 12px;font-size:12px;font-weight:700;animation-name:d-share;display:flex}.d-items{flex-direction:column;gap:8px;display:flex}.d-item{background:#fff;border:1px solid #eeece5;border-radius:11px;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;padding:9px 10px;font-size:13px;display:grid;position:relative}.d-item em{color:var(--red);font-size:12px;font-style:normal;font-weight:700}.d-ico{color:#3c4f46;background:#f1f3ec;border-radius:9px;place-items:center;width:34px;height:34px;display:grid}.d-ico.red{color:var(--red);background:#f6e8e5}.d-new{opacity:0;border-width:0;max-height:0;margin-bottom:-8px;padding-top:0;padding-bottom:0;animation-name:d-new}.d-reserved{color:#fff;opacity:0;background:#2f6b45;border-radius:20px;align-items:center;gap:4px;padding:3px 8px;font-size:10.5px;animation-name:d-reserved;display:flex;position:absolute;top:-9px;right:10px}.d-copied{background:var(--foreground);color:#fff;opacity:0;border-radius:8px;align-items:center;gap:5px;padding:6px 10px;font-size:11.5px;font-weight:700;animation-name:d-copied;display:flex;position:absolute;top:62px;right:20px}.d-people{opacity:0;align-items:center;animation-name:d-people;display:flex;position:absolute;bottom:18px;left:20px;right:20px}.d-people span{color:#fff;border:2px solid #fff;border-radius:50%;place-items:center;width:30px;height:30px;margin-right:-8px;font-size:12px;font-weight:700;display:grid}.d-people small{color:#6e746d;margin-left:18px;font-size:12px}.d-fly{width:40px;height:40px;color:var(--red);opacity:0;background:#f6e8e5;border-radius:10px;place-items:center;animation-name:d-fly;display:grid;position:absolute;top:190px;left:520px;box-shadow:0 8px 20px -6px #ad303866}@keyframes d-cursor{0%,6%{opacity:0;transform:translate(0)}9%{opacity:1;transform:translate(0)}18%{transform:translate(206px,-229px)}19.5%{transform:translate(206px,-229px)scale(.82)}21%{transform:translate(206px,-229px)scale(1)}30%{opacity:1;transform:translate(206px,-229px)}34%,to{opacity:0;transform:translate(206px,-229px)}}@keyframes d-ext{0%,18%{box-shadow:0 0 #ad303800}19.5%{transform:scale(.9);box-shadow:0 0 0 6px #ad303840}22%,to{transform:scale(1);box-shadow:0 0 0 12px #ad303800}}@keyframes d-popup{0%,20%{opacity:0;transform:translateY(14px)scale(.96)}24%,44%{opacity:1;transform:none}48%,to{opacity:0;transform:translateY(-8px)scale(.97)}}@keyframes d-type{0%,25%{width:0}33%,to{width:100%}}@keyframes d-type2{0%,33%{width:0}37%,to{width:100%}}@keyframes d-btn{0%,39%{filter:none;transform:none}41%{filter:brightness(.9);transform:scale(.95)}43%,to{filter:none;transform:none}}@keyframes d-fly{0%,43%{opacity:0;transform:translate(0)scale(.6)}45%{opacity:1;transform:translate(0)scale(1)}51%{opacity:1;transform:translate(46px,-52px)scale(.9)}53%,to{opacity:0;transform:translate(46px,-52px)scale(.6)}}@keyframes d-new{0%,50%{opacity:0;background:#fff;border-width:0;max-height:0;margin-bottom:-8px;padding-top:0;padding-bottom:0}54%{opacity:1;background:#fdf1ee;border-width:1px;max-height:60px;margin-bottom:0;padding-top:9px;padding-bottom:9px}62%,95%{opacity:1;background:#fff;border-width:1px;max-height:60px;margin-bottom:0;padding-top:9px;padding-bottom:9px}99%,to{opacity:0;border-width:0;max-height:0;margin-bottom:-8px;padding-top:0;padding-bottom:0}}@keyframes d-share{0%,57%{color:inherit;background:#fff;transform:none}59%{transform:scale(.93)}61%,70%{background:var(--foreground);color:#fff;transform:none}73%,to{color:inherit;background:#fff}}@keyframes d-copied{0%,60%{opacity:0;transform:translateY(-4px)}62%,70%{opacity:1;transform:none}73%,to{opacity:0}}@keyframes d-people{0%,66%{opacity:0;transform:translateY(8px)}70%,95%{opacity:1;transform:none}99%,to{opacity:0}}@keyframes d-reserved{0%,76%{opacity:0;transform:scale(.6)}79%{opacity:1;transform:scale(1.1)}81%,95%{opacity:1;transform:none}98%,to{opacity:0}}@media (max-width:1180px){.demo-frame{--z:.92}}@media (max-width:1060px){.demo-frame{--z:.82}}@media (max-width:940px){.demo-frame{--z:.7}}@media (max-width:800px){.demo-frame{--z:.6}}@media (max-width:680px){.demo-frame{--z:.5}}@media (max-width:560px){.demo-frame{--z:.42;border-radius:18px}}@media (max-width:470px){.demo-frame{--z:.34}}@media (max-width:380px){.demo-frame{--z:.3}}@media (prefers-reduced-motion:reduce){.demo-stage,.demo-stage *,.demo-steps li{animation:none!important}.d-cursor,.d-fly,.d-copied{display:none}.d-popup{opacity:1;top:250px;left:300px}.d-type,.d-type2{width:100%}.d-new{opacity:1;border-width:1px;max-height:60px;margin-bottom:0;padding:9px 10px}.d-reserved,.d-people{opacity:1}}.home-demo{clip-path:inset(0 -100vmax);color:#e9ede6;background:#1f3029;padding:84px 0 90px;position:relative;box-shadow:0 0 0 100vmax #1f3029}.home-demo .section-heading{text-align:center;max-width:760px;margin:0 auto 38px}.home-demo .section-heading .eyebrow{color:#b9c7bc;justify-content:center}.home-demo h2{color:#fff;font-size:44px}.home-demo h2 em{color:#f3a9a3}.home-demo .section-heading p{color:#c5d0c7;margin-top:14px;font-size:17px;line-height:1.6}.home-demo .demo-frame{background:radial-gradient(circle at 15% 0,#ad303833 0,#0000 50%),radial-gradient(circle at 95% 100%,#e0c07722 0,#0000 45%),#2a3f36;border-color:#ffffff14;box-shadow:0 40px 90px -40px #000a}.demo-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;max-width:1100px;margin:34px auto 0;padding:0;list-style:none;display:grid}.demo-steps li{background:#ffffff06;border:1px solid #ffffff14;border-radius:14px;padding:18px 18px 16px;animation:none}.demo-step-head{align-items:center;gap:10px;margin-bottom:8px;display:flex}.demo-step-head span{color:#fff;background:#ffffff14;border-radius:50%;flex:none;place-items:center;width:28px;height:28px;font-size:13px;font-weight:700;display:grid}.demo-steps h3{color:#fff;letter-spacing:0;margin:0;font:700 16px/1.3 Arial,Helvetica,sans-serif}.demo-steps p{color:#b9c5bc;margin:0;font-size:14px;line-height:1.6}.demo-steps a{color:#f3a9a3;text-underline-offset:2px;text-decoration:underline}.demo-steps .s1{animation-name:d-s1}.demo-steps .s2{animation-name:d-s2}.demo-steps .s3{animation-name:d-s3}.demo-steps .s4{animation-name:d-s4}@keyframes d-s1{0%,19%{background:#ffffff14;border-color:#f3a9a380}22%,to{background:#ffffff06;border-color:#ffffff14}}@keyframes d-s2{0%,19%{background:#ffffff06;border-color:#ffffff14}22%,53%{background:#ffffff14;border-color:#f3a9a380}56%,to{background:#ffffff06;border-color:#ffffff14}}@keyframes d-s3{0%,53%{background:#ffffff06;border-color:#ffffff14}56%,73%{background:#ffffff14;border-color:#f3a9a380}76%,to{background:#ffffff06;border-color:#ffffff14}}@keyframes d-s4{0%,73%{background:#ffffff06;border-color:#ffffff14}76%,96%{background:#ffffff14;border-color:#f3a9a380}99%,to{background:#ffffff06;border-color:#ffffff14}}@media (max-width:1000px){.demo-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:720px){.home-demo{padding:56px 0 60px}.home-demo h2{font-size:32px}.home-demo .section-heading p{font-size:15px}}@media (max-width:520px){.demo-steps{grid-template-columns:1fr;gap:10px}}