/* Device showcase — scoped to the homepage hero. */
.hero:has(.device-showcase){padding-top:60px;padding-bottom:34px}.hero:has(.device-showcase) .hero-layout{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:38px;max-width:1440px;margin:auto}.hero:has(.device-showcase) h1{font-size:clamp(36px,3.5vw,54px)}.hero:has(.device-showcase) .hero-foot{margin-top:42px}.device-showcase{position:relative;min-width:0;width:100%;padding:12px 0 0;isolation:isolate}.ds-overline{display:flex;align-items:center;justify-content:space-between;color:#bdccdc;font-size:9px;letter-spacing:.18em;text-transform:uppercase;margin:0 0 24px;padding-inline:4px}.ds-overline>span:first-child{display:flex;align-items:center;gap:8px}.ds-light{width:5px;height:5px;border-radius:50%;background:#73e2e4;box-shadow:0 0 12px #51cde8}.ds-overline>span:last-child{color:#7896ae;letter-spacing:.08em}.ds-stage{position:relative;width:100%;aspect-ratio:1.54;perspective:1300px}.ds-stage:before{content:"";position:absolute;inset:10% -4% 1%;background:radial-gradient(ellipse at 55% 60%,#209fc52e,transparent 68%);filter:blur(26px);z-index:-1}.ds-orbit{position:absolute;left:1%;right:3%;bottom:0;height:30%;border:1px solid #6bc6e516;border-radius:50%;transform:rotate(-7deg);box-shadow:0 -15px 70px #5fb9dd09}.ds-laptop{position:absolute;left:1%;top:8%;width:86%;transform:rotateY(-5deg) rotateX(3deg) rotateZ(-1deg);transform-style:preserve-3d;filter:drop-shadow(0 22px 20px #0005)}.ds-lid{padding:9px 9px 0;background:linear-gradient(135deg,#8b929b,#292f36 2%,#0b1018 40%,#545c66);border:1px solid #9fa6af;border-radius:15px 15px 7px 7px;box-shadow:inset 0 0 0 2px #101722,0 0 0 1px #0009;position:relative}.ds-camera{position:absolute;width:3px;height:3px;border-radius:50%;background:#1c3855;top:3px;left:50%;box-shadow:0 0 0 1px #02070b}.ds-display{border-radius:5px 5px 1px 1px;overflow:hidden;background:#e9ecee;position:relative;box-shadow:0 0 0 1px #000}.ds-browser{height:24px;background:linear-gradient(#e8e9eb,#d5d7db);display:flex;align-items:center;justify-content:center;position:relative;gap:4px;color:#555f6c;font-size:7px}.ds-browser-dots{position:absolute;left:8px;display:flex;gap:3px}.ds-browser-dots i{width:4px;height:4px;border-radius:50%;background:#a5abb2}.ds-browser-dots i:first-child{background:#ef7b77}.ds-browser-dots i:nth-child(2){background:#e6be65}.ds-browser-dots i:last-child{background:#7cba8d}.ds-address{background:#f7f8f9b5;border:1px solid #bdc2c761;border-radius:4px;text-align:center;width:55%;height:14px;line-height:12px;overflow:hidden;white-space:nowrap}.ds-display video{display:block;width:100%;height:auto;aspect-ratio:8/5;object-fit:cover;background:#e7e9eb}.ds-chin{height:15px;color:#8f959f;font-size:5px;text-align:center;letter-spacing:.035em;line-height:15px}.ds-base{height:13px;margin:0 -5.8%;background:linear-gradient(#d3d8df 0%,#9da6b1 24%,#b0b8c2 45%,#6e7885 80%,#303b49);border-radius:1px 1px 50% 50%/1px 1px 100% 100%;box-shadow:0 2px 1px #111a27;position:relative}.ds-base:before{content:"";position:absolute;top:0;left:42%;width:16%;height:4px;border-radius:0 0 8px 8px;background:linear-gradient(90deg,#747f8c,#c8ced6,#7b8591)}.ds-phone{position:absolute;right:0;bottom:3%;width:24%;padding:5px;background:linear-gradient(135deg,#bac3c9,#303b45 22%,#98a2ab 52%,#303b45 80%,#a4aeb7);border-radius:26px;box-shadow:0 0 0 1px #c8d3db70,0 24px 35px #0008,0 4px 8px #0006;transform:rotateY(-9deg) rotateZ(4deg);z-index:3}.ds-phone:before{content:"";position:absolute;width:2px;height:11%;right:-2px;top:28%;border-radius:0 2px 2px 0;background:#83919e}.ds-phone:after{content:"";position:absolute;width:2px;height:7%;left:-2px;top:24%;border-radius:2px 0 0 2px;background:#83919e}.ds-phone-inner{border:3px solid #070a0f;border-radius:22px;overflow:hidden;background:#fff;position:relative}.ds-phone-status{height:20px;display:flex;align-items:center;justify-content:space-between;padding:0 9px;color:#232b34;background:#fafafa;font-size:5px;font-weight:700}.ds-island{position:absolute;top:4px;left:32%;width:36%;height:10px;background:#070a0f;border-radius:8px;z-index:2}.ds-island:after{content:"";width:3px;height:3px;background:#102642;border-radius:50%;position:absolute;right:5px;top:3px}.ds-phone img{display:block;width:100%;height:auto;aspect-ratio:1/2;object-fit:cover}.ds-home-bar{height:12px;background:#fafafa;position:relative}.ds-home-bar:after{content:"";position:absolute;left:32%;right:32%;height:2px;background:#111c26;top:5px;border-radius:3px}.ds-project{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:22px;padding:17px 2px 0;border-top:1px solid #b9d6e320}.ds-project-name{display:block;font-size:18px;font-weight:500;letter-spacing:-.03em;color:#f4f8fc;margin-bottom:5px}.ds-project-kind{font-size:10px;color:#9fb3c7}.ds-project-count{font-variant-numeric:tabular-nums;font-size:12px;color:#e3edf6;letter-spacing:.12em}.ds-project-count span:last-child{color:#6f8ba5}.ds-segments{display:flex;gap:7px;margin-top:19px}.ds-segment{position:relative;padding:0;border:0;height:18px;flex:1;background:transparent;cursor:pointer}.ds-segment:before,.ds-segment:after{content:"";position:absolute;height:2px;left:0;right:0;top:8px;border-radius:2px;background:#c9e1ee25}.ds-segment:after{right:auto;width:var(--progress,0%);background:#71d9ed}.ds-segment[aria-current="true"]:before{background:#c9e1ee55}.ds-segment:focus-visible{outline:2px solid #f7d550;outline-offset:3px}.device-showcase.ds-static .ds-segments{display:none}
@media(min-width:1600px){.ds-stage{max-height:520px}.ds-laptop{max-width:700px}.ds-phone{max-width:185px}}
@media(max-width:1100px) and (min-width:761px){.hero:has(.device-showcase) .hero-layout{grid-template-columns:1fr;gap:40px}.hero:has(.device-showcase) .hero-layout>div:first-child{max-width:650px}.device-showcase{max-width:760px;margin:auto}.hero:has(.device-showcase) h1{font-size:54px}.ds-stage{aspect-ratio:1.7}}
@media(max-width:760px){.hero:has(.device-showcase){padding-top:38px}.hero:has(.device-showcase) .hero-layout{grid-template-columns:1fr;gap:35px}.hero:has(.device-showcase) h1{font-size:clamp(36px,9.7vw,52px)}.hero:has(.device-showcase) .hero-foot{margin-top:30px}.device-showcase{max-width:570px;margin:auto}.ds-overline{font-size:8px;margin-bottom:15px;letter-spacing:.12em}.ds-overline>span:last-child{font-size:7px}.ds-stage{aspect-ratio:1.48}.ds-laptop{top:9%;width:88%}.ds-lid{padding:5px 5px 0;border-radius:10px 10px 5px 5px}.ds-camera{width:2px;height:2px;top:1px}.ds-browser{height:16px;font-size:5px}.ds-address{height:10px;line-height:9px}.ds-browser-dots{left:4px;gap:2px}.ds-browser-dots i{width:3px;height:3px}.ds-chin{height:10px;line-height:10px;font-size:4px}.ds-base{height:9px}.ds-base:before{height:3px}.ds-phone{width:25%;padding:3px;border-radius:17px;bottom:4%}.ds-phone-inner{border-width:2px;border-radius:14px}.ds-phone-status{height:14px;padding-inline:5px;font-size:4px}.ds-island{top:3px;height:7px}.ds-island:after{width:2px;height:2px;right:3px;top:2px}.ds-home-bar{height:9px}.ds-home-bar:after{top:3px;height:2px}.ds-project{margin-top:12px;padding-top:14px}.ds-project-name{font-size:16px}.ds-project-kind{font-size:9px}.ds-segments{margin-top:10px}}
@media(prefers-reduced-motion:reduce){.ds-laptop,.ds-phone{transform:none}}

.ds-web-view{position:relative;aspect-ratio:8/5;overflow:hidden;background:#f4f5f6}.ds-home{display:block;width:100%;height:auto;transform:translateY(0)}.ds-target{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}.ds-pointer{position:absolute;left:74%;top:70%;width:25px;height:34px;filter:drop-shadow(1px 2px 2px #0008);z-index:2}.ds-click{position:absolute;left:var(--cursor-x);top:var(--cursor-y);width:26px;height:26px;border:2px solid #31c7e4;border-radius:50%;opacity:0;transform:translate(-50%,-50%);z-index:3}.ds-running .ds-home{animation:ds-pan 12s ease-in-out infinite}.ds-running .ds-target{animation:ds-detail 12s linear infinite}.ds-running .ds-pointer{animation:ds-pointer-move 12s ease-in-out infinite}.ds-running .ds-click{animation:ds-click-ring 12s linear infinite}.ds-running .ds-segment[aria-current="true"]:after{animation:ds-progress 12s linear infinite}@keyframes ds-pan{0%,8%{transform:translateY(0)}43%,49%{transform:translateY(var(--pan))}59%,100%{transform:translateY(0)}}@keyframes ds-detail{0%,76%{opacity:0}79%,98%{opacity:1}100%{opacity:0}}@keyframes ds-pointer-move{0%,57%{left:74%;top:70%}68%,78%{left:var(--cursor-x);top:var(--cursor-y)}84%,100%{left:85%;top:73%}}@keyframes ds-click-ring{0%,72%,79%,100%{opacity:0;transform:translate(-50%,-50%) scale(.3)}74%{opacity:1}78%{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}@keyframes ds-progress{from{width:0}to{width:100%}}@media(max-width:760px){.ds-pointer{width:15px;height:21px}.ds-click{width:17px;height:17px}}@media(prefers-reduced-motion:reduce){.ds-web-view *,.ds-segment:after{animation:none!important}.ds-pointer,.ds-click{display:none}}