/* AI / tech “wallpaper” — neon circuits + subtle bot grid (no external video required) */
.tayel-ai-wallpaper {
  position: fixed;
  inset: 0;
  z-index: -29;
  pointer-events: none;
  background-color: #040010;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cg fill='none' stroke='%23c026ff' stroke-opacity='0.14' stroke-width='0.8'%3E%3Crect x='28' y='36' width='104' height='88' rx='12'/%3E%3Ccircle cx='62' cy='72' r='7'/%3E%3Ccircle cx='98' cy='72' r='7'/%3E%3Cpath d='M52 92 Q80 104 108 92'/%3E%3Cpath d='M80 36 V18'/%3E%3Cpath d='M64 22 H96'/%3E%3Crect x='68' y='108' width='24' height='14' rx='2'/%3E%3Cpath d='M48 124h64' stroke-opacity='0.1'/%3E%3Ccircle cx='24' cy='24' r='3' fill='%2322d3ee' fill-opacity='0.2'/%3E%3Ccircle cx='136' cy='130' r='3' fill='%23f0abfc' fill-opacity='0.18'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(ellipse 90% 70% at 50% -10%, rgba(192, 38, 255, 0.22), transparent 52%),
    radial-gradient(ellipse 60% 50% at 100% 80%, rgba(34, 211, 238, 0.08), transparent 45%),
    linear-gradient(180deg, rgba(3, 0, 20, 0.2) 0%, transparent 40%, rgba(3, 0, 20, 0.45) 100%),
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 47px,
      rgba(192, 38, 255, 0.045) 48px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 47px,
      rgba(192, 38, 255, 0.045) 48px
    );
  background-size:
    200px 200px,
    100% 100%,
    100% 100%,
    100% 100%,
    96px 96px,
    96px 96px;
  background-position: center, center, center, center, 0 0, 0 0;
  animation: tayelAiWallShift 42s linear infinite;
  opacity: 0.92;
}

/* Older pages: video at z-index:-3, overlay:-1 — sit wallpaper between */
.tayel-ai-wallpaper.tayel-ai-wallpaper--legacy {
  z-index: -2;
}

@keyframes tayelAiWallShift {
  0% {
    background-position: center, center, center, center, 0 0, 0 0;
  }
  100% {
    background-position: center, center, center, center, 96px 96px, -96px 96px;
  }
}

/* Deep space ambience — works alongside Tailwind */
.space-stars {
  position: fixed;
  inset: 0;
  z-index: -12;
  pointer-events: none;
  background-image:
    radial-gradient(1px 1px at 10% 20%, rgba(255, 255, 255, 0.4), transparent),
    radial-gradient(1px 1px at 30% 65%, rgba(255, 255, 255, 0.25), transparent),
    radial-gradient(1px 1px at 72% 40%, rgba(240, 171, 252, 0.35), transparent),
    radial-gradient(1px 1px at 88% 12%, rgba(255, 255, 255, 0.3), transparent),
    radial-gradient(1px 1px at 55% 88%, rgba(192, 38, 255, 0.35), transparent),
    radial-gradient(1px 1px at 22% 90%, rgba(255, 255, 255, 0.2), transparent),
    radial-gradient(1.5px 1.5px at 50% 50%, rgba(192, 38, 255, 0.5), transparent);
  background-size: 100% 100%;
  opacity: 0.85;
}

.space-scan {
  position: fixed;
  inset: 0;
  z-index: -7;
  pointer-events: none;
  background: linear-gradient(
    transparent 0%,
    rgba(192, 38, 255, 0.03) 50%,
    transparent 100%
  );
  background-size: 100% 8px;
  animation: scanMove 14s linear infinite;
  opacity: 0.6;
}

@keyframes scanMove {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 0 100vh;
  }
}

.orbit-ring {
  position: absolute;
  border: 1px solid rgba(192, 38, 255, 0.15);
  border-radius: 50%;
  pointer-events: none;
}