How to use custom CSS to prevent the header nav on desktop from wrapping to two lines

Hi! I'm on 7.1 and have already used some custom CSS to center align my logo. But a consequence of this move is that my regular desktop nav wraps to two or more lines VERY quickly. 

I'd love to collapse the text links on the left (image below) into a mobile-style hamburger and have experimented with some custom CSS I found in the forums. But the solutions I've found so far (see below) collapse ALL the nav whereas I want to keep the social links and header CTA visible.

Can anyone advise me how to collapse just the text links into a hamburger mobile nav?

What is site url? We can check easier