.phone-stage{height:610px;max-width:930px;margin:60px auto 0;overflow:visible;isolation:isolate}.phone-stage:before{inset:8% 10%;background:radial-gradient(ellipse,rgba(18,146,226,.28),transparent 68%)}.phone-stage .demo-label{top:0;z-index:4}.phone{position:absolute;top:50px;width:270px;height:500px;padding:7px;border-radius:38px;background:linear-gradient(145deg,#8cb0c9,#17283b 18%,#07111c 68%,#7491a8);box-shadow:0 28px 70px #0009,0 0 0 1px #acd8f54d;animation:phone-up .8s cubic-bezier(.2,.7,.2,1) both}.phone-left{left:8%;transform:translateY(35px) rotate(-7deg);z-index:1}.phone-center{left:50%;width:300px;height:540px;transform:translateX(-50%);z-index:3;box-shadow:0 30px 75px #000a,0 0 40px #168de534,0 0 0 1px #c8e7fa7a}.phone-right{right:8%;transform:translateY(35px) rotate(7deg);z-index:1}.phone-screen{position:relative;overflow:hidden;height:100%;border-radius:31px;background:linear-gradient(165deg,#0b1c2e,#071421);border:1px solid #000}.phone-status{display:flex;justify-content:space-between;padding:12px 16px 7px;color:#e1f0f8;font-size:9px;font-weight:700}.phone-notch{position:absolute;top:7px;left:50%;transform:translateX(-50%);height:14px;width:64px;border-radius:12px;background:#020910}.phone-app{display:flex;align-items:center;gap:8px;padding:15px 12px;background:#10283a;border-block:1px solid #a9d7f21c;text-align:left}.phone-app img,.phone-avatar{height:32px;width:32px;flex:none}.phone-app strong,.phone-app small{display:block;line-height:1.3}.phone-app strong{font-size:11px;color:#f4faff}.phone-app small{font-size:9px;color:#a3bdce;margin-top:2px}.phone-app i{margin-left:auto;width:6px;height:6px;border-radius:50%;background:#5be7bf}.phone-avatar{display:grid;place-items:center;border-radius:50%;background:#168bea;color:white;font-weight:700}.phone-content{padding:24px 16px;text-align:left}.phone-label{display:inline-block;padding:6px 8px;border-radius:6px;font-size:8px;font-weight:700;letter-spacing:.07em}.phone-label.green{background:#13be7530;color:#68eeb0}.phone-label.cyan{background:#2a9de52c;color:#99dfff}.phone-content h3{font:700 24px/1.1 var(--display);letter-spacing:-.04em;margin:18px 0 10px}.phone-content p{font-size:11px;line-height:1.5;color:#b3cadb;margin:0 0 20px}.phone-message{max-width:91%;padding:10px 11px;border-radius:11px;background:#1a2c3c;color:#e4f2fa;font-size:10px;line-height:1.4;text-align:left}.phone-message small{display:block;text-align:right;color:#8db5c4;font-size:8px;margin-top:4px}.phone-message.sent{align-self:flex-end;background:#075f51}.phone-pill{display:inline-block;margin-top:16px;padding:7px 10px;border-radius:999px;background:#18bc7b24;color:#7de9b6;font-size:9px}.phone-pill.blue{background:#299ae528;color:#a1dcff}.phone-conversation{padding:16px 12px;display:flex;flex-direction:column;gap:10px}.conversation-date{font-size:8px;color:#98b5c5;text-align:center;letter-spacing:.08em;margin-bottom:2px}.phone-input{margin-top:2px;background:#ffffff0c;border-radius:999px;color:#9bb1c1;font-size:10px;padding:10px 13px;text-align:left}.phone-input span{float:right;color:#6ae2b7}.phone-home{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);width:76px;height:4px;border-radius:5px;background:#eef8ff80}.handoff-card{display:flex;align-items:center;gap:9px;background:#b5ddf20d;border:1px solid #a8d8fb2e;border-radius:9px;padding:11px}.handoff-card>span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#35c8a82c;color:#71efd3}.handoff-card strong,.handoff-card small{display:block;font-size:9px;line-height:1.4}.handoff-card small{color:#9fbccc;margin-top:3px}@keyframes phone-up{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}@media(max-width:800px){.phone-stage{height:540px;margin-top:45px;overflow:clip}.phone{width:235px;height:445px;top:55px}.phone-left{left:0}.phone-right{right:0}.phone-center{width:270px;height:485px}.phone-content h3{font-size:20px}.phone-conversation{gap:7px}.phone-message{font-size:9px}}@media(max-width:600px){.phone-stage{height:445px;margin-top:40px;width:100%;overflow:clip}.phone{width:190px;height:365px;top:50px;border-radius:29px;padding:5px}.phone-screen{border-radius:24px}.phone-left{left:-12%;transform:translateY(34px) rotate(-7deg)}.phone-right{right:-12%;transform:translateY(34px) rotate(7deg)}.phone-center{width:232px;height:397px}.phone-status{padding:10px 12px 5px;font-size:8px}.phone-notch{width:53px;height:12px}.phone-app{padding:10px 9px}.phone-app img,.phone-avatar{width:27px;height:27px}.phone-app strong{font-size:10px}.phone-app small{font-size:8px}.phone-content{padding:17px 11px}.phone-content h3{font-size:18px;margin:13px 0 7px}.phone-content p{font-size:10px;margin-bottom:12px}.phone-conversation{padding:11px 9px;gap:6px}.phone-message{font-size:9px;padding:7px 9px}.phone-message small{font-size:7px;margin-top:2px}.phone-input{padding:7px 10px}.phone-pill{margin-top:11px}.phone-home{bottom:6px;width:55px}.phone-stage .demo-label{font-size:9px}}@media(prefers-reduced-motion:reduce){.phone{animation:none!important}}