/* عرض الكمبيوتر: إطار آيفون + جولة */
#stage{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;gap:clamp(30px,6vw,110px);
background:radial-gradient(90% 120% at 80% 0%,var(--p),var(--pd) 45%,var(--pdd) 80%,#120406);overflow:hidden;transition:background .6s}
.st-bg{position:absolute;inset:0;pointer-events:none}
.st-flow{width:100%;height:100%}
.st-flow path{fill:none;stroke:rgba(255,255,255,.07);stroke-width:1.4;stroke-dasharray:2400;stroke-dashoffset:2400;animation:draw 5s var(--ease) forwards}
.st-flow path:nth-child(2){animation-delay:.4s}.st-flow path:nth-child(3){animation-delay:.8s}.st-flow path:nth-child(4){animation-delay:1.2s}
#tour{position:relative;z-index:2;width:min(380px,32vw);color:#fff}
.tour-logo{width:150px;margin-bottom:26px;filter:drop-shadow(0 16px 30px rgba(0,0,0,.35))}
.tour-t{font-size:clamp(30px,3.2vw,46px);line-height:1.15;margin:0 0 10px;font-weight:800;letter-spacing:-.01em}
.tour-s{margin:0 0 24px;opacity:.75;font-size:15px;line-height:1.8}
.tour-play{display:inline-flex;align-items:center;gap:12px;height:54px;padding:0 22px 0 26px;border-radius:99px;background:#fff;color:var(--pd);font-weight:700;font-size:15px;box-shadow:0 18px 40px -14px rgba(0,0,0,.5);margin-bottom:22px}
.tp-ic{width:0;height:0;border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent currentColor}
[dir=rtl] .tp-ic{transform:scaleX(-1)}
.tour-play.on .tp-ic{width:12px;height:15px;border:0;border-inline:4px solid currentColor;transform:none}
.tour-steps{list-style:none;margin:0;padding:0;display:grid;gap:4px;max-height:52vh;overflow:auto;scrollbar-width:none}
.tour-steps::-webkit-scrollbar{display:none}
.tour-steps li button{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;text-align:start;color:rgba(255,255,255,.72);font-size:14px;transition:.25s}
.tour-steps li button:hover{background:rgba(255,255,255,.07);color:#fff}
.tour-steps li button i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:700;background:rgba(255,255,255,.1);flex:none;direction:ltr}
.tour-steps li.on button{background:rgba(255,255,255,.14);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.tour-steps li.on button i{background:var(--ac);color:var(--pdd)}
.tour-foot{display:flex;align-items:center;gap:10px;margin-top:26px;font-size:12px;opacity:.55}
.tour-foot i{width:4px;height:4px;border-radius:50%;background:#fff}
.device-wrap{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:16px}
.device{--h:min(90vh,932px);position:relative;height:var(--h);aspect-ratio:440/956;border-radius:calc(var(--h)*.075);padding:calc(var(--h)*.013);
background:linear-gradient(145deg,#3a3a3e,#111 30%,#2a2a2e 60%,#0b0b0c);box-shadow:0 0 0 2px #4a4a50,0 60px 120px -30px rgba(0,0,0,.7),0 0 0 calc(var(--h)*.004) #000 inset}
.device #app{border-radius:calc(var(--h)*.064);height:100%;transform:translateZ(0)}
.island{position:absolute;top:calc(var(--h)*.026);left:50%;width:31%;height:calc(var(--h)*.034);transform:translateX(-50%);background:#000;border-radius:99px;z-index:100;pointer-events:none}
.device #app{--sat:calc(var(--h)*.05)}
.qr-hint{position:absolute;bottom:2px;inset-inline-start:calc(100% + 26px);display:grid;justify-items:center;gap:8px;color:rgba(255,255,255,.7);font-size:12px}
#qrbox{width:104px;height:104px;padding:8px;border-radius:16px;background:#fff}
#qrbox svg,#qrbox img{width:100%;height:100%}
@media (max-width:1100px){#tour{display:none}.qr-hint{display:none}}
@media (max-width:700px),(pointer:coarse) and (max-width:1024px){
  #stage{position:static;display:block;background:var(--bg)}
  .st-bg,#tour,.qr-hint,.island{display:none}
  .device-wrap{display:block}
  .device{height:auto;aspect-ratio:auto;padding:0;border-radius:0;background:none;box-shadow:none}
  .device #app{position:fixed;inset:0;border-radius:0;height:100%;--sat:env(safe-area-inset-top,0px)}
}

.tour-logo{width:auto;height:120px;margin-bottom:20px}