/* === NEURAL-MESH.CSS ===
 * SVG bg-mesh для hero - сетка точек с пульсирующими связями
 * Генерируется JS (neural-mesh.js) — здесь только стили
 */

.neural-mesh-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: 0.5;
    mix-blend-mode: screen;
}

html.light-theme .neural-mesh-bg {
    opacity: 0.25;
    mix-blend-mode: multiply;
}

.nm-svg {
    width: 100%;
    height: 100%;
    display: block;
}

.nm-dot {
    fill: var(--gold);
    animation: nm-dot-pulse 4s ease-in-out infinite;
    animation-delay: var(--nm-delay, 0s);
    filter: drop-shadow(0 0 3px var(--gold));
}

@keyframes nm-dot-pulse {
    0%, 100% { opacity: 0.3; r: 1.5; }
    50%      { opacity: 0.9; r: 2.5; }
}

.nm-line {
    stroke: var(--electric);
    stroke-width: 0.5;
    stroke-dasharray: 5 8;
    opacity: 0.15;
    animation: nm-line-flow 10s linear infinite;
    animation-delay: var(--nm-line-delay, 0s);
}

@keyframes nm-line-flow {
    0%   { stroke-dashoffset: 0; opacity: 0.05; }
    50%  { opacity: 0.3; }
    100% { stroke-dashoffset: -100; opacity: 0.05; }
}

@media (prefers-reduced-motion: reduce) {
    .nm-dot, .nm-line {
        animation: none !important;
    }
}

/* === Hero floating orbs === */
.hero-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.18;
    pointer-events: none;
    z-index: 0;
    will-change: transform;
}

.hero-orb-1 {
    width: 400px; height: 400px;
    top: 10%; left: -10%;
    background: radial-gradient(circle, var(--gold) 0%, transparent 70%);
    animation: orb-drift-1 20s ease-in-out infinite alternate;
}

.hero-orb-2 {
    width: 500px; height: 500px;
    bottom: -10%; right: -10%;
    background: radial-gradient(circle, var(--electric) 0%, transparent 70%);
    animation: orb-drift-2 25s ease-in-out infinite alternate;
}

.hero-orb-3 {
    width: 300px; height: 300px;
    top: 50%; left: 40%;
    background: radial-gradient(circle, var(--blue) 0%, transparent 70%);
    opacity: 0.12;
    animation: orb-drift-3 30s ease-in-out infinite alternate;
}

@keyframes orb-drift-1 {
    from { transform: translate(0, 0) scale(1); }
    to   { transform: translate(80px, 60px) scale(1.1); }
}

@keyframes orb-drift-2 {
    from { transform: translate(0, 0) scale(1); }
    to   { transform: translate(-100px, -80px) scale(1.15); }
}

@keyframes orb-drift-3 {
    from { transform: translate(0, 0) scale(1); }
    to   { transform: translate(-60px, 100px) scale(0.9); }
}

@media (prefers-reduced-motion: reduce) {
    .hero-orb { animation: none !important; }
}