:root{--orange:#ff751f;--ink:#202020;--white:#fff;--ease:cubic-bezier(.22,.75,.25,1)}
*{box-sizing:border-box}body{margin:0;background:var(--orange);color:var(--ink);font-family:'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid currentColor;outline-offset:6px}button:active{scale:.98}.skip{position:fixed;left:20px;top:-100px;z-index:20;background:white;padding:15px}.skip:focus{top:15px}
.hero{min-height:100svh;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;padding:0 24px 30px;background:radial-gradient(ellipse at 50% 55%,#ffb579 0%,#ff8d42 32%,#ff751f 65%)}header{width:100%;max-width:1600px;display:flex;justify-content:space-between;align-items:center;padding:24px 2vw;z-index:4}.brand{display:flex;align-items:center;width:148px;height:50px}.brand img{width:100%;height:auto}nav{display:flex;align-items:center;gap:26px}.text-button{border:0;background:none;padding:12px;font-weight:500}.contact{border:1px solid #20202066;border-radius:99px;padding:13px 25px;font-weight:500}.intro{text-align:center;z-index:2;transition:opacity .4s,transform .6s var(--ease)}h1{font-family:Outfit,sans-serif;font-weight:500;font-size:clamp(48px,5.4vw,90px);letter-spacing:-.045em;line-height:.96;margin:16px 0 0}h1 span{color:white}.scene-wrap{position:relative;width:min(760px,100%);height:440px;flex:none;margin:-2px auto 0;transition:transform .7s var(--ease)}.scene{position:absolute;left:50%;top:0;width:720px;height:430px;transform:translateX(-50%);perspective:1100px}.halo{position:absolute;inset:50px 20px 5px;border-radius:50%;background:radial-gradient(ellipse,#ffcfaa99,transparent 66%)}.floor{position:absolute;left:110px;bottom:-18px;width:520px;height:80px;border-radius:50%;background:radial-gradient(ellipse,#d85a10aa,transparent 67%);filter:blur(15px)}.product-shadow{position:absolute;left:150px;top:340px;width:290px;height:45px;border-radius:50%;background:#79380d55;filter:blur(14px);transform:rotate(-9deg)}
.plaque{position:absolute;left:123px;top:70px;width:285px;height:285px;transform:rotateX(7deg) rotateY(-13deg) rotateZ(-10deg);border-radius:27px;background:#e6ddd6;box-shadow:1px 1px #fff,2px 2px #eee,3px 3px #ddd,4px 4px #ccc,5px 5px #bbb,6px 6px #aaa,10px 15px 25px #5c2a1644;z-index:2}.plaque-front{position:absolute;inset:0;border-radius:26px;background:linear-gradient(130deg,#ff9c4d,#ff751f 46%,#f96c14);border:1px solid #ffffff55;display:flex;align-items:center;flex-direction:column;padding:23px;overflow:hidden}.plaque-front:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(130deg,#ffffff28,transparent 40%)}.plaque-logo{width:180px;height:60px;object-fit:contain}.plaque-message{font-size:16px;line-height:1.15;font-weight:500;text-align:center;letter-spacing:-.035em;margin:1px 0 13px}.qr{width:91px;height:91px;padding:6px;background:white;border-radius:5px}.plaque-foot{font-size:12px;font-weight:500;margin-top:12px}.contact-symbol{width:30px;position:absolute;right:17px;top:15px}
.phone{position:absolute;left:425px;top:30px;width:185px;height:366px;background:linear-gradient(110deg,#b8b9b8,#505353 10%,#d6d7d3 45%,#444 80%,#f1f1ed);border-radius:34px;padding:5px;box-shadow:1px 1px 1px #eee,-3px 0 1px #393a39,9px 15px 24px #50280c66;z-index:3;transform:rotateY(-14deg) rotateZ(11deg);animation:approach 10s var(--ease) infinite}.phone:before{content:'';position:absolute;width:3px;height:40px;background:#333;left:-4px;top:76px;border-radius:3px}.phone-screen{background:#fff;position:relative;height:100%;border:4px solid #101313;border-radius:30px;overflow:hidden}.island{position:absolute;width:57px;height:16px;border-radius:20px;background:#111;top:9px;left:55px;z-index:10}.status{position:absolute;top:12px;left:13px;right:12px;display:flex;justify-content:space-between;font-size:8px;font-weight:500;z-index:9}.home-bar{position:absolute;width:57px;height:3px;background:#111;border-radius:3px;bottom:7px;left:56px;z-index:10}.lockscreen{position:absolute;inset:0;background:radial-gradient(ellipse at 110% 0,#ffbf82 8%,#ff822a 32%,#792c05 70%,#211710);text-align:center;padding-top:65px;color:white}.clock{font:500 45px Outfit,sans-serif;letter-spacing:-.05em}.lockscreen p{margin-top:95px;font-size:17px;line-height:1.2}.notification{position:absolute;left:7px;right:7px;top:115px;background:#fffc;border-radius:13px;padding:12px 8px;display:flex;gap:8px;align-items:center;font-size:9px;z-index:4;opacity:0;animation:notification 10s infinite}.notification-icon{font-size:22px}.review{position:absolute;inset:0;background:#fff;z-index:5;padding:47px 12px 20px;text-align:center;opacity:0;animation:review 10s infinite}.google{font:500 24px 'DM Sans',sans-serif;letter-spacing:-1.5px}.google span:nth-child(1),.google span:nth-child(4){color:#4285f4}.google span:nth-child(2),.google span:nth-child(6){color:#ea4335}.google span:nth-child(3){color:#b47c00}.google span:nth-child(5){color:#188038}.shop-avatar{background:#ff751f;border-radius:50%;width:42px;height:42px;margin:17px auto 8px;display:grid;place-content:center;font:500 11px/1 Outfit}.shop-name{font-size:13px}.review p{font-size:9px;margin:7px 0 14px;color:#505050}.stars{position:relative;display:flex;justify-content:space-between;font-size:25px;line-height:1;color:#8e6500}.filled{position:absolute;inset:0;color:#c78a00;letter-spacing:1px;opacity:0;animation:stars 10s infinite}.review-field{border:1px solid #dadce0;border-radius:5px;margin-top:17px;height:49px;text-align:left;padding:9px 6px;font-size:8px;color:#555}.publish{font-size:10px;border-radius:20px;background:#1a73e8;color:white;padding:8px;margin-top:13px}.touch{position:absolute;left:142px;top:207px;width:14px;height:14px;border-radius:50%;background:#20202033;border:1px solid #fff;z-index:8;opacity:0;animation:touch 10s infinite}.signal{position:absolute;left:345px;top:82px;width:44px;height:44px;border:2px solid white;border-radius:50%;z-index:4;opacity:0;animation:signal 10s infinite}.scene-caption{position:absolute;bottom:3px;left:0;right:0;margin:0;text-align:center;font-weight:500;font-size:16px;display:flex;justify-content:center;gap:18px}.scene-caption span{opacity:.65}.scene-caption span:nth-child(1){animation:step1 10s infinite}.scene-caption span:nth-child(2){animation:step2 10s infinite}.scene-caption span:nth-child(3){animation:step3 10s infinite}.bottom{text-align:center;z-index:4;transition:opacity .4s,transform .6s var(--ease)}.bottom p{font-size:clamp(21px,1.8vw,26px);line-height:1.25;margin:16px 0 22px;letter-spacing:-.025em}.primary{height:64px;min-width:248px;border:0;border-radius:100px;padding:0 30px;color:white;background:#202020;font-weight:500;font-size:17px;box-shadow:0 8px 20px #9b3f1522;transition:transform .2s,background .2s}.primary:hover{background:#343434;transform:translateY(-2px)}.scene-controls{position:absolute;bottom:40px;z-index:5;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}.scene-controls:not([hidden]){display:flex}.scene-controls button,.scene-controls a{min-height:48px;border:1px solid #20202066;border-radius:99px;background:transparent;padding:12px 20px;font-size:15px}.scene-controls .return{background:#202020;color:white}.immersive .intro,.immersive .bottom{opacity:0;pointer-events:none;transform:translateY(15px)}.immersive .scene-wrap{transform:translateY(-38px) scale(1.22)}.immersive nav .open-scene{visibility:hidden}.paused .scene *,.paused .scene-caption *{animation-play-state:paused!important}
@keyframes approach{0%,8%,96%,100%{transform:translate(0,0) rotateY(-14deg) rotateZ(11deg)}24%,40%{transform:translate(-99px,25px) rotateY(-20deg) rotateZ(4deg)}53%,88%{transform:translate(-5px,3px) rotateY(-9deg) rotateZ(8deg)}}@keyframes notification{0%,28%,43%,100%{opacity:0;transform:translateY(-7px)}31%,39%{opacity:1;transform:translateY(0)}}@keyframes review{0%,42%,97%,100%{opacity:0;transform:translateY(12px)}47%,91%{opacity:1;transform:translateY(0)}}@keyframes stars{0%,64%,95%,100%{opacity:0}69%,91%{opacity:1}}@keyframes touch{0%,60%,72%,100%{opacity:0;transform:scale(1.3)}65%,69%{opacity:1;transform:scale(.8)}}@keyframes signal{0%,24%,43%,100%{opacity:0;transform:scale(.6)}28%{opacity:1;transform:scale(.7)}39%{opacity:0;transform:scale(1.8)}}@keyframes step1{0%,40%{opacity:1}45%,100%{opacity:.55}}@keyframes step2{0%,39%,62%,100%{opacity:.55}44%,59%{opacity:1}}@keyframes step3{0%,61%,99%,100%{opacity:.55}66%,94%{opacity:1}}
@media(min-width:1600px){.scene-wrap{height:490px}.scene{top:20px;transform:translateX(-50%) scale(1.1)}}
@media(max-width:700px){.hero{padding:0 20px 28px;min-height:100svh}header{padding:18px 0}.brand{width:120px;height:40px}nav{gap:10px}.text-button{font-size:14px;padding:12px 8px}.contact{font-size:14px;padding:11px 15px}h1{font-size:clamp(48px,10.8vw,70px);margin:22px 0 0}.scene-wrap{height:330px;margin:10px 0 0;width:100%}.scene{top:0;transform:translateX(-50%) scale(.74);transform-origin:50% 0}.scene-caption{font-size:15px;bottom:0}.bottom p{font-size:20px;line-height:1.3;margin:20px 0}.primary{height:62px}.immersive .scene-wrap{transform:translateY(-25px) scale(1.04)}.scene-controls{left:20px;right:20px;bottom:35px;gap:10px}.scene-controls .pause{font-size:13px}.scene-controls a{font-size:13px}}
@media(max-width:420px){.scene-wrap{height:285px}.scene{transform:translateX(-50%) scale(.63)}nav{gap:4px}.brand{width:105px}.contact{padding:11px 12px}.bottom p{font-size:20px;max-width:330px}h1{margin-top:20px}.hero{padding-inline:16px}.scene-caption{font-size:14px}}
@media(max-width:350px){.scene{transform:translateX(-50%) scale(.55)}.scene-wrap{height:250px}.contact{display:none}h1{font-size:45px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.phone{transform:rotateY(-9deg) rotateZ(8deg)}.review{opacity:1}.filled{opacity:0}.scene-caption span{opacity:1}.pause{display:none}.immersive .scene-wrap{transform:none}}