/* I pezzi comuni dei nodi: le reti della pagina iniziale, di Esempi e di Chi sono, e le icone nel cerchio di Per chi e
   Contatti; le misure stanno nelle pagine. */
/* Nodi: pillola di vetro con la «lente ai bordi», icona nel cerchio, pallino del colore di significato */
.pill.glass {
  display: flex;
  align-items: center;
  background: radial-gradient(
    ellipse 62% 76% at 50% 50%,
    var(--lens-full) 0%,
    var(--lens-full) 55%,
    var(--lens-bordo, var(--bianco-14)) 100%
  );
  -webkit-backdrop-filter: var(--nodo-sfoca);
  backdrop-filter: var(--nodo-sfoca);
}
.n-icon {
  position: relative;
  flex: none;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(160deg, var(--bianco-95), var(--bianco-55));
  box-shadow:
    inset 0 1px 0 var(--bianco),
    0 4px 10px -4px var(--icona-ombra);
}
.n-tint {
  position: absolute;
  right: 1px;
  top: 1px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--tint);
  box-shadow: 0 0 0 2px var(--bianco);
}
.n-title {
  font-weight: 600;
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.t-gray {
  --tint: var(--silver);
}
.t-code {
  --tint: var(--code);
}
.t-ai {
  --tint: var(--ai);
}
.t-person {
  --tint: var(--person);
}
.t-data {
  --tint: var(--data);
}
.filo-alone {
  fill: none;
  stroke: var(--bianco-75);
  stroke-width: 7;
  stroke-linecap: round;
}
.filo {
  fill: none;
  stroke: var(--filo);
  stroke-width: 1.6;
  stroke-linecap: round;
}
.port {
  fill: var(--bianco);
  stroke: var(--filo);
  stroke-width: 1.4;
}