Indentation between menu items

There is a website

distancebetweenmenuitems

The distance between the 1st level subcategory (for example Smartphones) and the Smartphones and gadgets category is 25px, and the distance between the 2nd level subcategory and the 1st level subcategory (for example, between Cell phones and Smartphones with a good camera) is 52px, and the distance inside subcategories 1st level 12px.

Tell me how to achieve a breakdown into three columns, so that the distance between the title ( Smartphones and gadgets) and the first line (Smartphones, Tablet Accessories, E-books and Accessories) is 25px, and the rest of the formatting is as in the screenshot ( or rather I'm interested in Category (Smartphones and Gadgets), a list of 1st level subcategories ( Smartphones, Cell phones, Tablets, Tablet Accessories, etc.) and lists of 2nd level subcategories).

The problem is that the number of menu items is not known in advance (they may be stored in the database).

As I see it: for lists <ul> </ul> data with the number of sub-items will be transmitted, then the column heights will be checked, and in case of switching to another column, the required height indent will be made for a specific menu item. But I don’t know how to implement it.