/* Atmosfera tecnológica leve: sem imagens ou bibliotecas externas. */
:root { --mx: 50%; --my: 50%; }

body {
  background:
    radial-gradient(circle at var(--mx) var(--my), rgba(39, 229, 245, .045), transparent 24%),
    radial-gradient(circle at 15% 10%, rgba(0, 226, 255, .08), transparent 28%),
    radial-gradient(circle at 88% 88%, rgba(239, 0, 204, .09), transparent 30%),
    var(--bg);
}

.ambient-bg, .grid-overlay, .tech-atmosphere {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.ambient-bg { transform: translate(calc((var(--mx) - 50%) * .025), calc((var(--my) - 50%) * .025)); }
.grid-overlay {
  opacity: .48;
  background-image: linear-gradient(rgba(39,229,245,.035) 1px,transparent 1px), linear-gradient(90deg,rgba(237,85,212,.027) 1px,transparent 1px);
  animation: gridPulse 8s ease-in-out infinite;
}
.grid-overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent, rgba(39,229,245,.055) 48%, transparent 52%);
  background-size: 100% 220px;
  animation: gridScan 10s linear infinite;
}

.orb { animation: orbFloat 14s ease-in-out infinite alternate; }
.orb-2 { animation-delay: -5s; }
.orb-3 { animation-delay: -9s; }
.tech-atmosphere { z-index: 0; }
.scan-beam {
  position: absolute;
  width: 55vw;
  height: 1px;
  opacity: .3;
  background: linear-gradient(90deg, transparent, var(--cyan), transparent);
  box-shadow: 0 0 12px rgba(39,229,245,.38);
  animation: beamTravel 11s linear infinite;
}
.scan-beam-a { top: 24%; left: -55vw; }
.scan-beam-b {
  right: -55vw;
  bottom: 18%;
  background: linear-gradient(90deg, transparent, var(--pink), transparent);
  box-shadow: 0 0 12px rgba(237,85,212,.35);
  animation-direction: reverse;
  animation-delay: -4s;
}
.circuit { position: absolute; width: 240px; height: 160px; opacity: .2; color: var(--cyan); }
.circuit-a { top: 9%; right: 4%; border-top: 1px solid; border-right: 1px solid; }
.circuit-b { left: 3%; bottom: 8%; color: var(--pink); transform: rotate(180deg); border-top: 1px solid; border-right: 1px solid; }
.circuit i { position: absolute; width: 7px; height: 7px; border: 1px solid currentColor; border-radius: 50%; box-shadow: 0 0 9px currentColor; animation: nodePulse 3s ease-in-out infinite; }
.circuit i:nth-child(1) { top: -4px; left: 22%; }
.circuit i:nth-child(2) { top: 37%; right: -4px; animation-delay: -1s; }
.circuit i:nth-child(3) { right: -4px; bottom: 10%; animation-delay: -2s; }
.digital-particles span { position: absolute; width: 2px; height: 2px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 7px var(--cyan); opacity: 0; animation: particleRise var(--duration,10s) linear infinite; animation-delay: var(--delay,0s); }
.digital-particles span:nth-child(3n) { background: var(--pink); box-shadow: 0 0 7px var(--pink); }

@keyframes gridPulse { 50% { opacity: .7; } }
@keyframes gridScan { from { background-position: 0 -220px; } to { background-position: 0 calc(100vh + 220px); } }
@keyframes orbFloat { to { transform: translate3d(35px,-25px,0) scale(1.12); opacity: .22; } }
@keyframes beamTravel { from { transform: translateX(0); } to { transform: translateX(155vw); } }
@keyframes nodePulse { 50% { transform: scale(1.65); opacity: .35; } }
@keyframes particleRise { 0% { transform: translate3d(0,30px,0); opacity: 0; } 15% { opacity: .7; } 85% { opacity: .35; } 100% { transform: translate3d(var(--drift,25px),-115vh,0); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  .grid-overlay, .grid-overlay::after, .orb, .scan-beam, .circuit i, .digital-particles span { animation: none !important; }
  .digital-particles { display: none; }
}
@media (max-width: 800px) {
  body {
    background: linear-gradient(145deg, #07131a 0%, var(--bg) 52%, #160a1b 100%);
  }
  .ambient-bg, .grid-overlay, .tech-atmosphere { display: none; }
}
