scaling font/hyphenated

Site URL: https://www.citizenleather.co.nz/ready-made-swanndri-oilskin

Im not sure if this is a scaling for hyphenating issue...but on my website the fonts break in the wrong places when scaling. On the mobile and tablet views its fine, but the desktop version has the issue. See attached.

I have the code to disable all hyphens in the custom CSS but this doesn't seam to work. 

Another issue I have with the desktop view is that the menu bar goes behind the logo when scaling down.

You can resize heading by adding to Home > Design > Custom CSS

h2 {
    font-size: 4rem;
}

Thanks! I was so excited I forgot to say that worked 😄