Yes, the task is a little weird. On hover each item has to scale. The center left item works stable. Top and left are almost fine too, but the top corner is cropped. The right items scale wrong, only on hover near the center of all svg.
Like they have no place WHERE to scale.
I tried to change width-height, it didn't help.
What's the property, that can fix it?

Codepen link

CodePudding user response：

When you hover Дети, Финансы, it doesn't work well.
The paths scale when only if hovering over their stroke.
So I corrected it too.
This code can help you.

path:nth-child(2) {
  fill: white;
}
svg {
  overflow: visible;
}

Codepen link