:root{
  --njs-float-blue:#4e78ff;
  --njs-float-purple:#b14cff;
  --njs-float-cyan:#59d8ff;
  --njs-float-green:#3cdf85;
}

body.njs-floating-objects-enabled .njs-card,
body.njs-floating-objects-enabled .njs-home-card,
body.njs-floating-objects-enabled .service-card,
body.njs-floating-objects-enabled .project-card,
body.njs-floating-objects-enabled .feature-card,
body.njs-floating-objects-enabled article[class*="card"],
body.njs-floating-objects-enabled div[class*="card"]{
  position:relative;
  isolation:isolate;
  overflow:visible;
}

body.njs-floating-objects-enabled .njs-card > *,
body.njs-floating-objects-enabled .njs-home-card > *,
body.njs-floating-objects-enabled .service-card > *,
body.njs-floating-objects-enabled .project-card > *,
body.njs-floating-objects-enabled .feature-card > *,
body.njs-floating-objects-enabled article[class*="card"] > *,
body.njs-floating-objects-enabled div[class*="card"] > *{
  position:relative;
  z-index:2;
}

.njs-float-scene{
  position:absolute;
  inset:-18px;
  pointer-events:none;
  z-index:1;
  overflow:visible;
}

.njs-float-item{
  position:absolute;
  pointer-events:none;
  will-change:transform, opacity;
  animation-timing-function:ease-in-out;
  animation-iteration-count:infinite;
  animation-direction:alternate;
}

.njs-float-orb{
  width:78px;
  height:78px;
  border-radius:999px;
  filter:blur(2px);
  opacity:.42;
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.55), transparent 28%),
    radial-gradient(circle at center, rgba(177,76,255,.32), transparent 64%);
  box-shadow:
    0 0 34px rgba(177,76,255,.24),
    inset 0 0 14px rgba(255,255,255,.08);
  animation-name:njsFloatOrb;
  animation-duration:4.8s;
}

.njs-float-orb.blue{
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.52), transparent 28%),
    radial-gradient(circle at center, rgba(78,120,255,.34), transparent 64%);
  box-shadow:
    0 0 34px rgba(78,120,255,.24),
    inset 0 0 14px rgba(255,255,255,.08);
}

.njs-float-orb.green{
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.50), transparent 28%),
    radial-gradient(circle at center, rgba(60,223,133,.28), transparent 64%);
  box-shadow:
    0 0 30px rgba(60,223,133,.22),
    inset 0 0 14px rgba(255,255,255,.08);
}

.njs-float-chip{
  width:74px;
  height:20px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:
    linear-gradient(90deg, rgba(78,120,255,.24), rgba(177,76,255,.22)),
    rgba(255,255,255,.03);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:
    0 10px 22px rgba(0,0,0,.14),
    inset 0 1px 0 rgba(255,255,255,.10);
  opacity:.72;
  animation-name:njsFloatChip;
  animation-duration:5.6s;
}

.njs-float-chip.small{
  width:52px;
  height:14px;
  opacity:.64;
  animation-duration:4.9s;
}

.njs-float-ring{
  width:92px;
  height:92px;
  border-radius:999px;
  border:1.5px solid rgba(255,255,255,.12);
  box-shadow:
    0 0 0 8px rgba(177,76,255,.05),
    0 0 30px rgba(78,120,255,.16);
  opacity:.50;
  animation-name:njsFloatRing;
  animation-duration:6.4s;
}

.njs-float-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:linear-gradient(180deg, var(--njs-float-cyan), #ffffff);
  box-shadow:0 0 18px rgba(89,216,255,.38);
  opacity:.88;
  animation-name:njsFloatDot;
  animation-duration:3.8s;
}

.njs-float-grid{
  position:absolute;
  width:82px;
  height:82px;
  opacity:.26;
  background-image:
    linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px);
  background-size:14px 14px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.95), transparent 90%);
  animation-name:njsFloatGrid;
  animation-duration:7.2s;
}

.njs-scene-a .o1{top:-8px; right:12px;}
.njs-scene-a .o2{bottom:10px; left:-6px;}
.njs-scene-a .c1{top:28px; left:-8px;}
.njs-scene-a .c2{bottom:28px; right:-6px;}
.njs-scene-a .r1{top:38%; right:-18px;}
.njs-scene-a .d1{top:16px; right:104px;}
.njs-scene-a .g1{bottom:8px; right:10px;}

.njs-scene-b .o1{top:-6px; left:18px;}
.njs-scene-b .o2{bottom:-4px; right:8px;}
.njs-scene-b .c1{top:24px; right:-8px;}
.njs-scene-b .c2{bottom:30px; left:-10px;}
.njs-scene-b .r1{top:44%; left:-18px;}
.njs-scene-b .d1{top:18px; left:108px;}
.njs-scene-b .g1{bottom:12px; left:14px;}

.njs-scene-c .o1{top:12px; right:-6px;}
.njs-scene-c .o2{bottom:-6px; left:24px;}
.njs-scene-c .c1{top:-4px; left:34px;}
.njs-scene-c .c2{bottom:18px; right:16px;}
.njs-scene-c .r1{top:-10px; left:-10px;}
.njs-scene-c .d1{bottom:96px; right:26px;}
.njs-scene-c .g1{top:28px; left:10px;}

.njs-scene-d .o1{top:14px; left:-6px;}
.njs-scene-d .o2{bottom:12px; right:-6px;}
.njs-scene-d .c1{top:-6px; right:24px;}
.njs-scene-d .c2{bottom:-4px; left:18px;}
.njs-scene-d .r1{bottom:-18px; right:26px;}
.njs-scene-d .d1{top:42px; right:18px;}
.njs-scene-d .g1{top:10px; right:10px;}

@keyframes njsFloatOrb{
  0%{transform:translate3d(0,0,0) scale(1);}
  100%{transform:translate3d(0,-12px,0) scale(1.08);}
}

@keyframes njsFloatChip{
  0%{transform:translate3d(0,0,0) rotate(0deg);}
  100%{transform:translate3d(0,-10px,0) rotate(4deg);}
}

@keyframes njsFloatRing{
  0%{transform:translate3d(0,0,0) rotate(0deg) scale(1);}
  100%{transform:translate3d(0,-8px,0) rotate(8deg) scale(1.04);}
}

@keyframes njsFloatDot{
  0%{transform:translate3d(0,0,0); opacity:.65;}
  100%{transform:translate3d(0,-14px,0); opacity:1;}
}

@keyframes njsFloatGrid{
  0%{transform:translate3d(0,0,0);}
  100%{transform:translate3d(0,-8px,0);}
}

@media (max-width:1024px){
  .njs-float-scene{
    inset:-12px;
  }
  .njs-float-orb{
    width:58px;
    height:58px;
    opacity:.34;
  }
  .njs-float-ring{
    width:72px;
    height:72px;
    opacity:.40;
  }
  .njs-float-chip{
    width:58px;
    height:16px;
  }
  .njs-float-grid{
    width:62px;
    height:62px;
  }
}

@media (max-width:680px){
  .njs-float-orb,
  .njs-float-ring,
  .njs-float-grid{
    display:none;
  }
  .njs-float-chip{
    opacity:.48;
  }
  .njs-float-dot{
    opacity:.58;
  }
}