.hero-art{isolation:isolate}
.sphere{right:10%;top:12%;width:350px;height:350px}
.sphere:before{content:"";position:absolute;inset:14%;border:1px solid rgba(255,255,255,.24);border-radius:50%}
.sphere:after{content:"";position:absolute;inset:32%;border:1px solid rgba(255,255,255,.18);border-radius:50%}
.float{position:absolute;z-index:4;width:170px;height:170px;min-width:0;padding:25px 18px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;background:linear-gradient(145deg,#4fa0df,#1768b9 72%);border:2px solid rgba(255,255,255,.65);box-shadow:0 18px 45px rgba(10,60,120,.24),inset 0 0 0 12px rgba(255,255,255,.045)}
.float b{font:600 16px/1.28 Manrope,sans-serif;color:#fff;letter-spacing:-.35px;text-shadow:0 1px 10px rgba(5,37,76,.22)}
.float span{font-size:13px;line-height:1.5;color:rgba(255,255,255,.88);margin-top:8px;word-break:keep-all}
.float:before{content:"";position:absolute;z-index:-2;height:1px;background:#4b92cf}
.float:after{content:"";position:absolute;z-index:-1;width:8px;height:8px;border-radius:50%;background:#1767bf;box-shadow:0 0 0 4px #fff}
.f1{left:2%;top:4%}
.f1:before{left:calc(100% - 8px);top:68%;width:55px;transform:rotate(22deg);transform-origin:left}
.f1:after{left:calc(100% + 39px);top:81%}
.f2{right:1%;bottom:3%;background:linear-gradient(145deg,#3287cc,#0d4f98 74%)}
.f2:before{right:calc(100% - 8px);top:30%;width:58px;transform:rotate(22deg);transform-origin:right}
.f2:after{right:calc(100% + 42px);top:15%}
@media(max-width:800px){.hero-art{height:400px}.sphere{width:260px;height:260px;right:8%;top:16%}.float{width:138px;height:138px;padding:18px 12px;border-width:2px}.float b{font-size:13px}.float span{font-size:10px;margin-top:6px}.f1{left:0;top:2%}.f2{right:0;bottom:2%}.f1:before,.f2:before{width:36px}.f1:after{left:calc(100% + 25px)}.f2:after{right:calc(100% + 25px)}}