:root{--planet-size:600vw;--atmosphere-thickness:12vh;--fadeout-width:35vw;--halo-height:4.5px;--delta:calc((1 - cos(asin(50vw / var(--planet-size)))) * var(--planet-size) * 2);--base-time:16s;--base-color:var(--background-color);--base-color-rgba-506:rgba(var(--white-rgb), 0.506);--base-color-rgba-189:rgba(var(--white-rgb), 0.189);--base-color-rgba-0:rgba(var(--white-rgb), 0);--green-rgba-25:rgba(0, 128, 0, 0.25);--purple-rgba-25:rgba(128, 0, 122, 0.25);--transparent:transparent}.hero-logo,.hero-logo-contrast{position:absolute;top:50%;left:50%;width:20vmax;height:20vmax;transform:translate(-50%,-50%);z-index:1000;background-color:var(--hero-logo-color);display:flex;justify-content:center;align-items:center;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-position:center;-webkit-mask-position:center;mix-blend-mode:overlay;animation:floatUpDown 10s ease-in-out infinite alternate}@keyframes floatUpDown{0%{transform:translate(-50%,-50%) translateY(0)}100%{transform:translate(-50%,-50%) translateY(-20px)}}.hero-logo-contrast{z-index:1001;background:radial-gradient(circle,var(--hero-logo-color) 20%,transparent);opacity:.4;mix-blend-mode:screen}@media (orientation:portrait){.hero-logo{width:60vw;height:60vw;transform:translate(-50%,-200%)}.hero-logo-contrast{width:60vw;height:60vw;transform:translate(-50%,-100%)}}.atmosphere-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--bg-color);background-size:cover;background-repeat:no-repeat;background-position:center;overflow:hidden}.planet{position:absolute;top:calc(100% - var(--delta));left:50%;transform:translateX(-50%);width:var(--planet-size);height:var(--planet-size);background-color:var(--planet-color);border-radius:50%;z-index:9;box-shadow:inset 0 0 25px var(--planet-halo-color)}.planet-halo{position:absolute;top:calc(100% - var(--delta) - var(--halo-height));left:50%;transform:translateX(-50%);width:var(--planet-size);height:calc(var(--planet-size) * 1.1);background-color:var(--planet-halo-color);box-shadow:0 0 25px var(--planet-halo-color);border-radius:50%;z-index:8}.planet-linear-glow{position:absolute;bottom:0;left:50%;width:100%;transform:translateX(-50%);height:calc(var(--delta)/ 100 * 1.4);background:linear-gradient(0deg,var(--base-color-rgba-506) 0,var(--base-color-rgba-189) 48%,var(--base-color-rgba-0) 100%);z-index:8;filter:blur(50px)}.planet-radial-glow{position:absolute;top:calc(100% - var(--delta));left:calc(50% - var(--planet-size) * .6 / 2);width:calc(var(--planet-size) * .6);height:calc(var(--planet-size) * .6);background:conic-gradient(from 180deg at 50% 50%,var(--atmosphere-cyan),var(--atmosphere-purple),var(--atmosphere-pink),var(--atmosphere-orange),var(--atmosphere-green),var(--atmosphere-cyan));border-radius:50%;z-index:9;filter:blur(100px);transform-origin:center center;animation:rotate-in-place-cw var(--base-time) linear infinite}.atmosphere{position:absolute;bottom:0;left:50%;transform:translate(-50%,50%);width:15vw;height:170vh;border-radius:50%;background:linear-gradient(to top,var(--planet-glow-blue),transparent);filter:blur(100px);z-index:3}.atmosphere-left{position:absolute;bottom:-30%;left:8%;width:50%;height:100%;border-radius:50%;background:linear-gradient(to top,var(--green-rgba-25),var(--transparent));filter:blur(100px);z-index:4;animation:atmosphere-glow 5s ease-in-out infinite alternate}.atmosphere-right{position:absolute;bottom:-10%;right:8%;width:50%;height:100%;border-radius:50%;background:linear-gradient(to top,var(--purple-rgba-25),var(--transparent));filter:blur(100px);z-index:4;animation:atmosphere-glow 3s ease-in-out infinite alternate}.center-glow{position:absolute;bottom:0;left:50%;transform:translate(-50%,35%);width:20vw;height:8vw;border-radius:50%;background:var(--base-color);filter:blur(70px);z-index:4}.center-glow::before{content:"";position:absolute;bottom:70%;left:50%;width:10px;height:300px;transform:translateX(-50%);background:var(--base-color);z-index:5}.fadeout{content:"";position:absolute;left:0;bottom:0;width:100vw;height:calc(var(--delta)/ 25);z-index:10}.fadeout::before{content:"";position:absolute;left:0;bottom:0;width:var(--fadeout-width);height:100vh;background:linear-gradient(90deg,var(--background-color) 0,rgba(var(--background-color-rgb),.7) 45%,var(--transparent) 100%)}.fadeout::after{content:"";position:absolute;right:0;bottom:0;width:var(--fadeout-width);height:100vh;background:linear-gradient(-90deg,var(--background-color) 0,rgba(var(--background-color-rgb),.7) 45%,var(--transparent) 100%)}.orbit-object{position:absolute;bottom:calc(-1 * var(--fadeout-width)/ 3.5);width:calc(var(--fadeout-width) * 1.1);height:calc(var(--fadeout-width) * .8);border-radius:50%;filter:blur(100px);margin:auto}.orbit-object-center{bottom:10%;left:calc(50% - var(--fadeout-width) * .75 / 2);background:conic-gradient(from 0deg,transparent,var(--atmosphere-orange),var(--atmosphere-purple) 50%,transparent 80%);animation:rotate-in-place-ccw calc(var(--base-time) * 1.2) linear infinite;animation-delay:-.5s;width:calc(var(--fadeout-width) * .6);height:calc(var(--fadeout-width) * .4)}.orbit-object-bottom-center{bottom:-15%;left:calc(50% - var(--fadeout-width) * .9 / 2);background:conic-gradient(from 0deg,transparent,var(--atmosphere-purple),var(--atmosphere-green) 50%,transparent 80%);animation:rotate-in-place-cw calc(var(--base-time) * .85) linear infinite;animation-delay:-4.2s;width:calc(var(--fadeout-width) * .9);height:calc(var(--fadeout-width) * .7)}@keyframes rotate-in-place-cw{from{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotate-in-place-ccw{from{transform:rotate(0)}to{transform:rotate(-360deg)}}@keyframes atmosphere-glow{0%{opacity:.6;transform:translate(-50%,50%) scale(.9)}100%{opacity:1;transform:translate(-50%,50%) scale(1.1)}}@keyframes pulse-glow{0%{opacity:.3;transform:scale(.8)}50%{opacity:.8;transform:scale(1.1)}100%{opacity:.4;transform:scale(.9)}}.particles-container{position:absolute;top:0;left:50%;transform:translateX(-50%);width:20vw;height:100%;pointer-events:none;z-index:1;overflow:hidden}.particle{position:absolute;border-radius:50%;background:radial-gradient(circle,var(--particles-color-1) 0,var(--particles-color-2) 50%,transparent 100%);animation:float-particle 15s linear infinite}.particle-1{width:2px;height:2px;top:10%;left:1vw;animation-duration:20s;animation-delay:0s}.particle-2{width:1px;height:1px;top:25%;left:3vw;animation-duration:18s;animation-delay:-2s}.particle-3{width:3px;height:3px;top:40%;left:5vw;animation-duration:22s;animation-delay:-5s}.particle-4{width:1.5px;height:1.5px;top:60%;left:7vw;animation-duration:16s;animation-delay:-8s}.particle-5{width:2.5px;height:2.5px;top:15%;left:9vw;animation-duration:25s;animation-delay:-3s}.particle-6{width:1px;height:1px;top:70%;left:11vw;animation-duration:19s;animation-delay:-7s}.particle-7{width:2px;height:2px;top:30%;left:13vw;animation-duration:21s;animation-delay:-4s}.particle-8{width:1.5px;height:1.5px;top:80%;left:15vw;animation-duration:17s;animation-delay:-6s}.particle-9{width:3px;height:3px;top:5%;left:17vw;animation-duration:24s;animation-delay:-1s}.particle-10{width:1px;height:1px;top:50%;left:19vw;animation-duration:18s;animation-delay:-9s}.particle-11{width:2px;height:2px;top:35%;left:2vw;animation-duration:20s;animation-delay:-2.5s}.particle-12{width:1.5px;height:1.5px;top:65%;left:4vw;animation-duration:16s;animation-delay:-5.5s}.particle-13{width:2.5px;height:2.5px;top:20%;left:6vw;animation-duration:23s;animation-delay:-3.5s}.particle-14{width:1px;height:1px;top:75%;left:8vw;animation-duration:17s;animation-delay:-7.5s}.particle-15{width:3px;height:3px;top:45%;left:10vw;animation-duration:26s;animation-delay:-1.5s}.particle-16{width:1.5px;height:1.5px;top:12%;left:12vw;animation-duration:19s;animation-delay:-4.5s}.particle-17{width:2px;height:2px;top:55%;left:14vw;animation-duration:21s;animation-delay:-6.5s}.particle-18{width:1px;height:1px;top:85%;left:16vw;animation-duration:18s;animation-delay:-8.5s}.particle-19{width:2.5px;height:2.5px;top:8%;left:18vw;animation-duration:24s;animation-delay:-2s}.particle-20{width:1.5px;height:1.5px;top:90%;left:.5vw;animation-duration:17s;animation-delay:-5s}.particle-21{width:1px;height:1px;top:18%;left:1.5vw;animation-duration:19s;animation-delay:-1.2s}.particle-22{width:2.5px;height:2.5px;top:65%;left:3.5vw;animation-duration:23s;animation-delay:-3.8s}.particle-23{width:1.5px;height:1.5px;top:35%;left:5.5vw;animation-duration:16s;animation-delay:-6.2s}.particle-24{width:2px;height:2px;top:75%;left:7.5vw;animation-duration:20s;animation-delay:-4.5s}.particle-25{width:1px;height:1px;top:22%;left:9.5vw;animation-duration:18s;animation-delay:-7.8s}.particle-26{width:3px;height:3px;top:48%;left:11.5vw;animation-duration:25s;animation-delay:-2.1s}.particle-27{width:1.5px;height:1.5px;top:82%;left:13.5vw;animation-duration:17s;animation-delay:-5.7s}.particle-28{width:2px;height:2px;top:28%;left:15.5vw;animation-duration:21s;animation-delay:-3.3s}.particle-29{width:1px;height:1px;top:58%;left:17.5vw;animation-duration:19s;animation-delay:-8.9s}.particle-30{width:2.5px;height:2.5px;top:12%;left:.2vw;animation-duration:24s;animation-delay:-1.8s}.particle-31{width:1.5px;height:1.5px;top:68%;left:2.2vw;animation-duration:16s;animation-delay:-6.8s}.particle-32{width:2px;height:2px;top:42%;left:4.2vw;animation-duration:22s;animation-delay:-4.2s}.particle-33{width:1px;height:1px;top:88%;left:6.2vw;animation-duration:18s;animation-delay:-7.1s}.particle-34{width:3px;height:3px;top:32%;left:8.2vw;animation-duration:26s;animation-delay:-2.7s}.particle-35{width:1.5px;height:1.5px;top:78%;left:10.2vw;animation-duration:17s;animation-delay:-5.4s}.particle-36{width:2px;height:2px;top:52%;left:12.2vw;animation-duration:20s;animation-delay:-3.9s}.particle-37{width:1px;height:1px;top:15%;left:14.2vw;animation-duration:19s;animation-delay:-8.3s}.particle-38{width:2.5px;height:2.5px;top:62%;left:16.2vw;animation-duration:23s;animation-delay:-1.5s}.particle-39{width:1.5px;height:1.5px;top:38%;left:18.2vw;animation-duration:16s;animation-delay:-6.5s}.particle-40{width:2px;height:2px;top:72%;left:.8vw;animation-duration:21s;animation-delay:-4.8s}.particle-41{width:1px;height:1px;top:25%;left:2.8vw;animation-duration:18s;animation-delay:-7.6s}.particle-42{width:3px;height:3px;top:55%;left:4.8vw;animation-duration:25s;animation-delay:-2.4s}.particle-43{width:1.5px;height:1.5px;top:85%;left:6.8vw;animation-duration:17s;animation-delay:-5.1s}.particle-44{width:2px;height:2px;top:45%;left:8.8vw;animation-duration:20s;animation-delay:-3.6s}.particle-45{width:1px;height:1px;top:95%;left:10.8vw;animation-duration:19s;animation-delay:-8.7s}.particle-46{width:2.5px;height:2.5px;top:8%;left:12.8vw;animation-duration:24s;animation-delay:-1.9s}.particle-47{width:1.5px;height:1.5px;top:65%;left:14.8vw;animation-duration:16s;animation-delay:-6.9s}.particle-48{width:2px;height:2px;top:35%;left:16.8vw;animation-duration:22s;animation-delay:-4.1s}.particle-49{width:1px;height:1px;top:78%;left:18.8vw;animation-duration:18s;animation-delay:-7.3s}.particle-50{width:3px;height:3px;top:48%;left:.3vw;animation-duration:26s;animation-delay:-2.6s}@keyframes float-particle{0%{transform:translateY(100vh) translateX(0) rotate(0);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(-100px) translateX(50px) rotate(360deg);opacity:0}}@media (max-width:768px){.orbit-object{width:30vw;height:30vw;filter:blur(60px)}.orbit-object-left,.orbit-object-right{width:45%;height:80%}.orbit-object-center{width:25%;height:50%}.orbit-object-top-left,.orbit-object-top-right{width:35%;height:40%}.orbit-object-bottom-center{width:40%;height:60%}.orbit-object-far-left,.orbit-object-far-right{width:25%;height:30%}.particle{animation-duration:12s}}