Centering Top Navigation

Hi all,

I'm using SquareSpace 7.1 and I hate the way the top navigation stacks onto two lines because of the # of navigation items I have. See reference below:

I was able to fix this by adjusting the width of the nav header with css but now it's off-center. See code & screenshot for reference below:

.header-layout-nav-center .header-nav {
    width: 100%;
    text-align: center;
    flex: 1 1 100%;
}

I've hit a bit of a wall with this. Any ideas for how I can center the navigation while keeping it at this width to avoid it stacking?

Thank you in advance, I appreciate it.