/* ============================================================
   BULL SYSTEMS — BACKGROUND AMBIENTE
   Camada decorativa fixa por trás de todo o conteúdo do site:
   3 glows (cyan/azul/violeta) estáticos e vignette nas bordas.
   As cores ficam centralizadas em :root (style.css); não há loop
   decorativo competindo com scroll, canvas ou ponteiro.
   ============================================================ */

.bg-glow-layer {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.bg-glow {
    position: absolute;
    border-radius: 50%;
}

.bg-glow--cyan {
    width: 58vw;
    height: 58vw;
    max-width: 780px;
    max-height: 780px;
    left: 6%;
    top: -8%;
    background: radial-gradient(circle, var(--glow-cyan), transparent 60%);
}

.bg-glow--blue {
    width: 52vw;
    height: 52vw;
    max-width: 720px;
    max-height: 720px;
    right: 2%;
    top: 40%;
    background: radial-gradient(circle, var(--glow-blue), transparent 60%);
}

.bg-glow--violet {
    width: 44vw;
    height: 44vw;
    max-width: 600px;
    max-height: 600px;
    left: 20%;
    bottom: -12%;
    background: radial-gradient(circle, var(--glow-violet), transparent 62%);
}

/* Vignette extremamente suave — reforça a profundidade sem escurecer
   o conteúdo central. Pinta por cima dos glows (depois deles no DOM). */
.bg-vignette {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: radial-gradient(ellipse at center, transparent 40%, rgba(0, 4, 13, 0.12) 68%, rgba(0, 4, 13, 0.52) 128%);
}

@media (max-width: 640px) {
    .bg-glow--cyan, .bg-glow--blue, .bg-glow--violet {
        width: 85vw;
        height: 85vw;
    }
    /* Composição vertical: os 3 glows empilham no eixo central. */
    .bg-glow--cyan   { left: 8%; right: auto; top: -12%; }
    .bg-glow--blue   { left: 8%; right: auto; top: 42%; }
    .bg-glow--violet { left: 8%; right: auto; bottom: -14%; }
}

@media (max-width: 768px), (hover: none) {
    .bg-glow--violet { display: none; }
}

/* Cursor: voltou a ser o nativo do SO em todo o site — sem
   customização. (Removido a pedido do usuário: a seta customizada
   não estava agradando.) */

/* --------------------------------------------------------
   Malha de pontos interativa global — canvas 2D fixo (ver
   assets/js/motion/interactive-dot-grid.js). Cobre todas as páginas
   públicas; na Hero usa intensidade reduzida (HERO_SOFTEN no JS). É
   um único canvas do tamanho da viewport — o
   JS desenha/computa somente a fatia visível e apenas sob demanda.
   Fica atrás de todo o conteúdo (main tem z-index:1) e nunca
   intercepta cliques.
   -------------------------------------------------------- */
.content-dotgrid {
    position: fixed;
    inset: 0;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.content-dotgrid[hidden] { display: none; }

@media (max-width: 768px), (hover: none) {
    .content-dotgrid { display: none; }
}