How to change header's height?

The first important thing to note, is that you should not edit the theme files directly, otherwise your changes will be overwritten every time the theme is updated.

Instead, add your CSS overrides using one of these methods:

An easy way to add custom CSS is to install the Jetpack plugin and activate the Custom CSS module. You’ll then add your custom CSS in the new stylesheet editor that’ll appear in your dashboard, under Appearance > Edit CSS. You could also install a standalone custom CSS plugin if you prefer.

If you want to restrict your custom CSS to desktop size only, wrap it in a media query so it applies to larger screens.

You can learn more about using media queries that target certain screen sizes here:

https://en.support.wordpress.com/custom-design/custom-css-media-queries/
https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
https://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

For example, if you wanted to match the largest media query in Hew’s style.css file, you could wrap the same media query around your custom CSS to restrict it to wide screens only:

@media screen and (min-width: 1176px) {

  .site-title {
	font-family: "Open Sans", sans-serif;
	font-size: 36px;
	font-weight: 700;
	line-height: 1;
	margin: 0;
	padding: 22px 0;
	text-transform: uppercase;
  }

  .menu-toggle:before,
  .widgets-toggle:before {
		font-size: 24px;
		font-size: 2.4rem;
  }

}