.mobile-device-hint{display:none}
.device-switch{position:relative;z-index:20;width:max-content;max-width:100%;margin:0 auto 22px;padding:5px;display:flex;align-items:center;gap:4px;background:#161411e8;border:1px solid #ffffff17;border-radius:14px;box-shadow:0 14px 38px #2115072b;backdrop-filter:blur(16px)}
.device-switch:before{content:"";position:absolute;inset:5px;border-radius:10px;background:#b47a25;width:calc(50% - 5px);transform:translateX(0);transition:transform .32s cubic-bezier(.2,.8,.2,1);z-index:-1}
[dir=rtl] .device-switch:before{transform:translateX(0)}
.hero-visual.preview-mobile .device-switch:before{transform:translateX(100%)}
[dir=rtl] .hero-visual.preview-mobile .device-switch:before{transform:translateX(-100%)}
.device-switch:before{display:none}.device-switch button{min-height:41px;padding:0 16px;display:flex;align-items:center;justify-content:center;gap:8px;border:0;background:transparent;color:#948e85;border-radius:10px;font:800 10px inherit;cursor:pointer;white-space:nowrap;transition:.25s}.device-switch button span{font:700 16px Arial}.device-switch button[aria-pressed=true]{color:#fff;background:linear-gradient(135deg,#c58a31,#8e5917);box-shadow:0 7px 18px #0003}
.hero-visual.preview-mobile{width:min(405px,calc(100% - 34px))!important;margin-top:52px!important}
.hero-visual.preview-mobile .visual-glow{inset:-35px -28px;background:radial-gradient(ellipse,#d87d344f,#733d9515 45%,transparent 68%)}
.hero-visual.preview-mobile .data-float{display:none}
.hero-visual.preview-mobile:before{content:"";position:absolute;z-index:8;top:180px;left:-4px;width:4px;height:72px;border-radius:4px 0 0 4px;background:linear-gradient(#e9a269,#743b1d);box-shadow:0 -94px 0 #a85a30,0 95px 0 -1px #9d5129}
.hero-visual.preview-mobile:after{content:"iPhone 17 Pro Max";position:absolute;z-index:8;left:50%;bottom:-29px;transform:translateX(-50%);color:#8c7c6e;font:700 9px "Manrope",sans-serif;letter-spacing:.08em;white-space:nowrap}
.hero-visual.preview-mobile .live-demo{position:relative;width:100%;padding:7px;border:0;border-radius:53px;background:linear-gradient(125deg,#7a3d20 0,#efaa72 9%,#914923 18%,#d8783e 50%,#65331d 82%,#eca068 93%,#7a3b20 100%);box-shadow:0 42px 105px #2116075c,0 0 0 1px #7d4325,inset 0 0 0 1px #ffd2ac8a;transform:none!important;overflow:visible}
.hero-visual.preview-mobile .live-demo:before{content:"";position:absolute;z-index:15;top:15px;left:50%;width:105px;height:28px;transform:translateX(-50%);border-radius:18px;background:#030303;box-shadow:inset 0 -1px #ffffff0c,0 2px 7px #0006}
.hero-visual.preview-mobile .live-demo:after{content:"";position:absolute;z-index:16;top:25px;left:calc(50% + 31px);width:6px;height:6px;border-radius:50%;background:#17212b;box-shadow:0 0 0 2px #0a0a0a,0 0 6px #253d56}
.hero-visual.preview-mobile .live-demo-bar{position:relative;height:49px;min-height:49px;padding:0 12px;justify-content:center;border-radius:45px 45px 0 0;background:#080808}
.hero-visual.preview-mobile .live-demo-bar>span,.hero-visual.preview-mobile .live-demo-bar>a{display:none}
.hero-visual.preview-mobile .demo-address{display:flex!important;opacity:0;pointer-events:none}
.hero-visual.preview-mobile .live-demo-stage{height:clamp(620px,75vh,735px);aspect-ratio:auto!important;border-radius:0 0 45px 45px;background:#e8ebf0;overscroll-behavior:contain;touch-action:pan-y;box-shadow:inset 0 0 0 2px #090909}
.hero-visual.preview-mobile .live-demo-stage>img{left:0;right:auto;width:auto!important;max-width:none!important;height:100%!important;object-fit:initial!important;object-position:initial!important}
html[dir=rtl] .hero-visual.preview-mobile .live-demo-stage>img{left:auto;right:0}
.hero-visual.preview-mobile .live-demo-stage>iframe{border-radius:0 0 45px 45px;-webkit-overflow-scrolling:touch;touch-action:pan-y}
.hero-visual.preview-mobile .live-demo-cover{padding:30px 24px;background:linear-gradient(180deg,#08080855,#080808e9);border-radius:0 0 45px 45px}
.hero-visual.preview-mobile .live-demo-cover h3{font-size:25px;line-height:1.18;max-width:285px}.hero-visual.preview-mobile .live-demo-cover p{font-size:11px;line-height:1.65;max-width:270px;margin-bottom:18px}.hero-visual.preview-mobile .live-demo-start{min-height:51px;padding:12px 16px;font-size:12px}
.hero-visual.preview-mobile .mobile-device-hint{position:absolute;z-index:18;display:flex;align-items:center;gap:8px;left:50%;bottom:17px;transform:translateX(-50%) translateY(12px);width:max-content;max-width:82%;padding:9px 13px;border:1px solid #ffffff20;border-radius:30px;background:#0b0a09d9;color:#d4cec5;font-size:9px;font-weight:700;opacity:0;pointer-events:none;transition:.4s;box-shadow:0 8px 30px #0005;backdrop-filter:blur(10px)}
.hero-visual.preview-mobile .mobile-device-hint span{color:#efaa72;font:800 15px Arial;animation:scrollHint 1.3s ease-in-out infinite}.hero-visual.preview-mobile .live-demo-stage.is-live+.mobile-device-hint{opacity:1;transform:translateX(-50%) translateY(0);animation:hideDeviceHint .6s ease 4s forwards}
@keyframes scrollHint{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}@keyframes hideDeviceHint{to{opacity:0;visibility:hidden}}
@media(max-width:600px){.device-switch{margin-bottom:20px}.device-switch button{padding:0 11px;font-size:9px}.hero-visual.preview-desktop{width:calc(100% - 20px)!important;margin-top:48px!important}.hero-visual.preview-desktop .data-float{display:none}.hero-visual.preview-mobile{width:min(390px,calc(100% - 26px))!important}.hero-visual.preview-mobile .live-demo-stage{height:clamp(600px,73vh,710px)}}
@media(max-width:380px){.device-switch button{padding:0 8px}.hero-visual.preview-mobile{width:calc(100% - 20px)!important}.hero-visual.preview-mobile .live-demo-stage{height:620px}}