#grafo-exito-digital {
        background-color: #01040a;
        color: #ffffff;
        padding: 100px 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }

    .grafo-header {
        text-align: center;
        margin-bottom: 80px;
    }

    .grafo-header h2 {
        color: #00e5ff;
        font-size: 32px;
        text-transform: uppercase;
        margin-bottom: 10px;
        text-shadow: 0 0 20px rgba(0, 229, 255, 0.5);
    }

    .grafo-container {
        display: flex;
        justify-content: space-around;
        align-items: flex-start;
        width: 100%;
        max-width: 1200px;
        position: relative;
    }

    /* Línea punteada de fondo */
    .grafo-container::before {
        content: "";
        position: absolute;
        top: 60px;
        left: 10%;
        right: 10%;
        height: 2px;
        background: repeating-linear-gradient(to right, #00e5ff 0, #00e5ff 10px, transparent 10px, transparent 20px);
        opacity: 0.3;
        z-index: 1;
    }

    .grafo-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 300px;
        z-index: 2;
        position: relative;
    }

    /* Estilo de los Nodos Circulares */
    .grafo-nodo {
        width: 120px;
        height: 120px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(0, 229, 255, 0.2) 0%, rgba(1, 4, 10, 1) 70%);
        border: 2px solid #00e5ff;
        display: flex;
        justify-content: center;
        align-items: center;
        box-shadow: 0 0 30px rgba(0, 229, 255, 0.4);
        margin-bottom: 25px;
        transition: all 0.4s ease;
    }

    .grafo-nodo:hover {
        transform: scale(1.1);
        box-shadow: 0 0 50px rgba(0, 229, 255, 0.8);
        background: radial-gradient(circle, rgba(0, 229, 255, 0.4) 0%, rgba(1, 4, 10, 1) 70%);
    }

    .grafo-nodo svg {
        width: 50px;
        height: 50px;
        fill: #00e5ff;
        filter: drop-shadow(0 0 5px #00e5ff);
    }

    /* Textos */
    .grafo-info h3 {
        color: #00e5ff;
        font-size: 20px;
        text-transform: uppercase;
        margin: 0 0 10px 0;
        text-align: center;
    }

    .grafo-info p {
        color: #a1a1aa;
        font-size: 14px;
        line-height: 1.5;
        text-align: center;
    }

    /* Micro-nodos (Satélites) */
    .mini-nodo {
        position: absolute;
        width: 45px;
        height: 45px;
        border: 1px solid rgba(0, 229, 255, 0.5);
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 10px;
        color: #fff;
        background: #01040a;
    }

    .pos-1 { top: -20px; left: 40px; }
    .pos-2 { bottom: 100px; left: 20px; }

    @media (max-width: 768px) {
        .grafo-container { flex-direction: column; align-items: center; gap: 60px; }
        .grafo-container::before { display: none; }
    }