/* Projected 3D particles, with independent floating layers around the brand. */
.home-universe.universe-3d{
 --plate-size:292px;
 perspective:1100px;perspective-origin:50% 48%;
}
.universe-aura{
 position:absolute;inset:8% 0;pointer-events:none;
 background:radial-gradient(ellipse at 50% 49%,#329ce52b,transparent 66%);
}
.universe-stage,.universe-float{
 position:absolute;inset:0;pointer-events:none;
}
.universe-stage{
 transform:rotateX(var(--scene-x,0deg)) rotateY(var(--scene-y,0deg));
 transition:transform 900ms cubic-bezier(.2,.7,.25,1);
}
.universe-core{
 position:absolute;inset:0;display:grid;place-items:center;
}
.universe-particles{
 position:absolute;display:block;width:100%;height:100%;max-width:540px;max-height:540px;
 pointer-events:none;
}
.universe-3d .planet-brand{
 position:absolute;left:50%;top:50%;width:var(--plate-size);padding:24px 22px;z-index:1;
 border:0;border-radius:50%;backdrop-filter:none;box-shadow:none;
 background:radial-gradient(ellipse,#061c35ed 10%,#071e37cf 44%,#08244000 74%);
 transform:translate(-50%,-50%);
 animation:universe-logo-elevate 9s ease-in-out infinite paused;
}
.universe-3d .planet-brand img{width:100%;user-select:none}
.home-universe.universe-3d .orbit-label{
 padding:12px 14px;gap:10px;border-radius:13px;
 border:1px solid #88ceff4f;border-top-color:#a3ddff73;
 background:linear-gradient(135deg,#224969e6,#102b49ee 58%,#0b203ce8);
 box-shadow:0 12px 24px #010d233d,inset 0 1px 0 #b6e4ff14;
 backdrop-filter:none;animation-play-state:paused;
}
.universe-3d .orbit-label>span{
 display:grid;place-items:center;width:30px;height:32px;flex-shrink:0;
 font-size:23px;color:#b0e7ff;text-shadow:0 0 12px #91d9ff4d;
}
.universe-3d .orbit-label small{color:#a6c2dc;font-size:7px;letter-spacing:1.1px}
.universe-3d .orbit-label b{font-size:11px;font-weight:700;white-space:nowrap}
.universe-3d .label-ai{
 left:4%;top:14%;transform:rotate(-6deg);
 animation:universe-ai-elevate 8s -2s ease-in-out infinite paused;
}
.universe-3d .label-apps{
 right:4%;top:24%;transform:rotate(5deg);
 animation:universe-apps-elevate 10s -5s ease-in-out infinite paused;
}
.universe-3d .label-game{
 left:7%;top:calc(50% + 146px);bottom:auto;transform:rotate(-4deg);
 animation:universe-game-elevate 9s -4s ease-in-out infinite paused;
}
.universe-3d[data-motion="running"] :is(.planet-brand,.orbit-label){animation-play-state:running}
.universe-3d .universe-caption{pointer-events:none}
@keyframes universe-logo-elevate{
 0%,100%{transform:translate(-50%,-50%) translateY(3px)}
 50%{transform:translate(-50%,-50%) translateY(-3px)}
}
@keyframes universe-ai-elevate{
 0%,100%{transform:translate(0,5px) rotate(-6deg)}
 50%{transform:translate(3px,-6px) rotate(-3deg)}
}
@keyframes universe-apps-elevate{
 0%,100%{transform:translate(0,-6px) rotate(5deg)}
 50%{transform:translate(-3px,5px) rotate(2deg)}
}
@keyframes universe-game-elevate{
 0%,100%{transform:translate(0,5px) rotate(-4deg)}
 50%{transform:translate(4px,-5px) rotate(-1deg)}
}
@media(min-width:801px) and (max-width:1050px){
 .home-universe.universe-3d{--plate-size:240px}
 .universe-3d .label-ai{left:2%;top:12%}
 .universe-3d .label-apps{right:5%;top:22%}
 .universe-3d .label-game{left:6%;top:calc(50% + 112px)}
 .home-universe.universe-3d .orbit-label{padding:10px;gap:6px}
 .universe-3d .orbit-label b{font-size:10px}
}
@media(min-width:641px) and (max-width:800px){
 .home-universe.universe-3d{height:440px;--plate-size:260px}
 .universe-3d .label-ai{top:10%;left:6%}
 .universe-3d .label-apps{top:17%;right:5%}
 .universe-3d .label-game{top:auto;bottom:20%;left:6%}
}
/* Touch layouts keep the service labels still, below the particle illustration. */
@media(max-width:640px){
 .home-universe.universe-3d{
  --plate-size:clamp(180px,55vw,238px);grid-template-rows:280px auto auto;gap:14px 8px;
  padding-top:4px;perspective:none;
 }
 .universe-3d .universe-stage,.universe-3d .universe-float{display:contents;transform:none}
 .universe-3d .universe-core{
  position:relative;inset:auto;width:100%;height:280px;grid-column:1/-1;grid-row:1;
 }
 .home-universe.universe-3d .planet-brand{
  top:50%;bottom:auto;width:var(--plate-size);padding:20px 15px;border:0;box-shadow:none;
  transform:translate(-50%,-50%);animation-name:universe-mobile-elevate;
 }
 .home-universe.universe-3d .orbit-label{
  position:static;grid-row:2;padding:10px 4px;gap:4px;min-height:68px;
  transform:none;animation:none;box-shadow:inset 0 1px 0 #b6e4ff14;min-width:0;
 }
 .universe-3d .orbit-label>span{width:auto;height:24px;font-size:21px}
 .universe-3d .orbit-label b{font-size:clamp(9px,2.6vw,11px)}
 .universe-3d .universe-aura{inset:0 0 24%}
}
@keyframes universe-mobile-elevate{
 0%,100%{transform:translate(-50%,-50%) translateY(2px)}
 50%{transform:translate(-50%,-50%) translateY(-2px)}
}
@media(prefers-reduced-motion:reduce){
 .universe-3d .universe-stage{transform:none;transition:none}
 .home-universe.universe-3d :is(.planet-brand,.orbit-label){animation:none}
}