/* LaranSys v6.0.20 HF2 - Data Pulse Bridge
   Refina a ponte luminosa entre Solucoes e Ecossistema para parecer
   uma conexao de dados, nao um divisor visual.
*/

.ls-v620hf1-bridge.ls-v620hf2-bridge {
  --ls620hf2-energy: 0.78;
  width: 2px !important;
  height: 188px !important;
  opacity: var(--ls620hf2-energy) !important;
  background:
    linear-gradient(
      to bottom,
      rgba(199, 237, 54, 0) 0%,
      rgba(199, 237, 54, .08) 9%,
      rgba(199, 237, 54, .68) 28%,
      rgba(168, 232, 64, .78) 46%,
      rgba(67, 216, 155, .50) 68%,
      rgba(24, 215, 208, .11) 86%,
      rgba(24, 215, 208, 0) 100%
    ) !important;
  box-shadow:
    0 0 7px rgba(199, 237, 54, .26),
    0 0 18px rgba(199, 237, 54, .12),
    0 0 32px rgba(24, 215, 208, .055) !important;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 15%, #000 82%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, #000 15%, #000 82%, transparent 100%);
}

.ls-v620hf1-bridge.ls-v620hf2-bridge::before {
  top: 77px !important;
  width: 9px !important;
  height: 9px !important;
  background: #c7ed36 !important;
  box-shadow:
    0 0 9px rgba(199, 237, 54, .72),
    0 0 22px rgba(199, 237, 54, .24) !important;
  animation: ls620hf2-core 3.1s ease-in-out infinite !important;
}

.ls-v620hf1-bridge.ls-v620hf2-bridge::after {
  top: 47px !important;
  width: 82px !important;
  height: 82px !important;
  background:
    radial-gradient(circle,
      rgba(199, 237, 54, .095) 0%,
      rgba(199, 237, 54, .04) 36%,
      transparent 70%) !important;
  filter: blur(4px) !important;
}

@keyframes ls620hf2-core {
  0%, 100% {
    opacity: .56;
    transform: translateX(-50%) scale(.86);
  }
  50% {
    opacity: 1;
    transform: translateX(-50%) scale(1.12);
  }
}

/* Particulas: pequenos pulsos de dados. */
.ls-v620hf2-particle {
  position: absolute;
  left: 50%;
  width: 4px;
  height: 4px;
  margin-left: -2px;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
  background: #c7ed36;
  box-shadow:
    0 0 7px rgba(199, 237, 54, .70),
    0 0 12px rgba(24, 215, 208, .13);
  animation: ls620hf2-particle 4.8s linear infinite;
}

.ls-v620hf2-particle.p1 {
  animation-delay: .15s;
}

.ls-v620hf2-particle.p2 {
  width: 3px;
  height: 3px;
  margin-left: -1.5px;
  background: #77e6aa;
  animation-delay: 1.55s;
  animation-duration: 5.5s;
}

.ls-v620hf2-particle.p3 {
  width: 3px;
  height: 3px;
  margin-left: -1.5px;
  background: #b8e93b;
  animation-delay: 3.0s;
  animation-duration: 5.1s;
}

@keyframes ls620hf2-particle {
  0% {
    top: 88%;
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(.72);
  }
  12% {
    opacity: .72;
  }
  50% {
    opacity: .90;
    transform: translate3d(0, -62px, 0) scale(1);
  }
  84% {
    opacity: .45;
  }
  100% {
    top: 14%;
    opacity: 0;
    transform: translate3d(0, -102px, 0) scale(.74);
  }
}

/* Pequeno pulso horizontal para dar leitura de "nodo", sem virar ornamento forte. */
.ls-v620hf2-node-ring {
  position: absolute;
  left: 50%;
  top: 76px;
  width: 28px;
  height: 28px;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(199, 237, 54, .15);
  border-radius: 50%;
  pointer-events: none;
  opacity: .48;
  animation: ls620hf2-ring 3.1s ease-out infinite;
}

@keyframes ls620hf2-ring {
  0% {
    opacity: .46;
    transform: translate(-50%, -50%) scale(.50);
  }
  72% {
    opacity: .08;
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.28);
  }
}

/* Mantem a linha interna do Ecossistema ainda mais discreta, evitando duplicidade. */
.ls-eco-v608.ls-eco-v620::after {
  opacity: .18 !important;
  height: 108px !important;
  filter: blur(.2px);
}

/* Evita que a ponte domine a composicao em telas menores. */
@media (max-width: 980px) {
  .ls-v620hf1-bridge.ls-v620hf2-bridge {
    height: 150px !important;
    opacity: .56 !important;
  }

  .ls-v620hf2-particle,
  .ls-v620hf2-node-ring {
    display: none !important;
  }
}

@media (max-width: 720px) {
  .ls-v620hf1-bridge.ls-v620hf2-bridge {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ls-v620hf1-bridge.ls-v620hf2-bridge::before,
  .ls-v620hf2-particle,
  .ls-v620hf2-node-ring {
    animation: none !important;
  }

  .ls-v620hf2-particle,
  .ls-v620hf2-node-ring {
    display: none !important;
  }
}
