/* ═══════════════════════════════════════════════════════════
   SEPARADOR-GRAFO — Grafo animado
═══════════════════════════════════════════════════════════ */

/* Fix contenedores WPBakery */
.vc_row:has(#separador-grafo) .full_section_inner,
.vc_row:has(#separador-grafo) .vc_column-inner,
.vc_row:has(#separador-grafo) .vc_column,
.vc_row:has(#separador-grafo) .wpb_wrapper,
.vc_row:has(#separador-grafo) .wpb_raw_html,
.vc_row:has(#separador-grafo) .vc_row-fluid,
.vc_row:has(#separador-grafo) {
  padding: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* Ocultar <p> vacíos que WPBakery inyecta como hijos DIRECTOS de sus
   wrappers — tienen margin de 1em que acumula espacio vacío. */
#separador-grafo > p,
.vc_row:has(#separador-grafo) > p,
.vc_row:has(#separador-grafo) .wpb_wrapper > p,
.vc_row:has(#separador-grafo) .wpb_raw_html > p,
.vc_row:has(#separador-grafo) .vc_column-inner > p {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  height: 0 !important;
}

#separador-grafo {
  position: relative;
  width: 100vw !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  height: 420px;
  background: #000;
  overflow: hidden;
}

.grafo__canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  cursor: crosshair;
}

@media (max-width: 768px) {
  #separador-grafo { height: 300px; }
}
@media (max-width: 480px) {
  #separador-grafo { height: 220px; }
}