
/* =========================================================
   PRECISION — AI NETWORK
   ========================================================= */

.hero-tech-precision .ai-network {
  position: absolute;
  inset: 0;
}

.hero-tech-precision span {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(120,217,139,0.85);

  box-shadow:
    0 0 18px rgba(120,217,139,0.5),
    0 0 40px rgba(120,217,139,0.25);
}

.hero-tech-precision span::after {
  content: "";
  position: absolute;
  width: 180px;
  height: 1px;
  background: linear-gradient(
    to right,
    rgba(120,217,139,0.35),
    transparent
  );
  top: 50%;
  left: 50%;
}

.hero-tech-precision span:nth-child(1) {
  top: 18%;
  left: 62%;
}

.hero-tech-precision span:nth-child(2) {
  top: 30%;
  left: 74%;
}

.hero-tech-precision span:nth-child(3) {
  top: 46%;
  left: 66%;
}

.hero-tech-precision span:nth-child(4) {
  top: 58%;
  left: 82%;
}

.hero-tech-precision span:nth-child(5) {
  top: 72%;
  left: 70%;
}

.hero-tech-precision span:nth-child(6) {
  top: 24%;
  left: 88%;
}

.hero-tech-precision span:nth-child(7) {
  top: 42%;
  left: 90%;
}

.hero-tech-precision span:nth-child(8) {
  top: 66%;
  left: 92%;
}

.hero-tech-precision span:nth-child(9) {
  top: 80%;
  left: 84%;
}

.hero-tech-precision .ai-network {
  animation: pulseNetwork 8s ease-in-out infinite;
}

.hero-tech-precision::after {
  content: "";

  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 72% 24%,
      rgba(120,217,139,0.10),
      transparent 18rem),

    radial-gradient(circle at 86% 74%,
      rgba(120,217,139,0.10),
      transparent 14rem);

  animation: precisionPulse 8s ease-in-out infinite alternate;
}

@keyframes precisionPulse {
  from {
    opacity: 0.45;
    transform: scale(1);
  }

  to {
    opacity: 1;
    transform: scale(1.04);
  }
}

@keyframes pulseNetwork {
  0%, 100% {
    opacity: 0.65;
  }

  50% {
    opacity: 1;
  }
}
