/* ─────────────────────────────────────────────────────────────
   Energiestroom-lijnen + kalme animatie (op de huisfoto-overlay)
   ───────────────────────────────────────────────────────────── */

.flow-path {
  fill: none;
  stroke: rgba(255, 255, 255, 0.16);
  stroke-width: 2;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke; /* gelijke lijndikte ongeacht schaal */
  opacity: 0;
  transition: opacity 0.5s ease, stroke 0.3s ease, stroke-width 0.3s ease;
}
/* Massieve, vage onderlijn — exact als het energie-dashboard (:3456); lijndikte
   wordt door de flow-engine met het vermogen meegeschaald. */
.flow-path.active {
  opacity: 0.3;
}

.flow-dot {
  fill: currentColor;
  opacity: 0;                                    /* opacity wordt per frame door JS gezet */
  filter: drop-shadow(0 0 5px currentColor);
}

/* Bewuste keuze: de kalme energiestroom is de kern-visual en blijft ook bij
   prefers-reduced-motion bewegen (zowel de gestippelde lijn als de bolletjes). */