trouble with fonts…(responsive sizes, weights etc)

Hi there,
I’m having trouble setting the various font sizes and weights on our site..
I’d ‘like’ them to be thus:

h1 57 pixels – lato black (weight 900) for wide screen
h2 37 pixels – lato black (weight 900)
h3 21 pixels – lato black (weight 900)
h4 19 pixels – lato bold
h5 15 pixels – lato bold
p 17 pixels – lato regular

I’d also like for the responsive sizes to work…

essentially, I’m trying to model the type style of https://gusto.com/ but with Lato as the font…
I’m finding if very difficult….
I’ve tried adding some html/css stuff to type sections, like <span style=”font-weight: 900;”> etc, and that seems to help, but I’d like to have it all set automatically, no have to go into each type section and tweak…

also, the section on our home page that says “Technology solutions that connect your audiences to the great things you do.” I can’t seem to get the type there to set responsively…in other words, the font size doesn’t go down appropriately when you got to smaller screens.. when I’ve set the responsive type for different sizes, it’s not working for some reason…

I’ve added some custom css to
Enfold Child: Stylesheet (style.css)
Select theme to edit:

h1 {
font-family: Lato;
font-size: 57px;
font-style: bold;
font-variant: normal;
font-weight: 900;
line-height: 26.4px;
}
h2 {
font-family: Lato;
font-size: 37px;
font-style: bold;
font-variant: normal;
font-weight: 900;
line-height: 26.4px;
}
h3 {
font-family: Lato;
font-size: 21px;
font-style: bold;
font-variant: normal;
font-weight: 900;
line-height: 15.4px;
}
h4 {
font-family: Lato;
font-size: 19px;
font-style: bold;
font-variant: normal;
font-weight: 700;
line-height: 15.4px;
}
h5 {
font-family: Lato;
font-size: 15px;
font-style: bold;
font-variant: normal;
font-weight: 700;
line-height: 15.4px;
}
p {
font-family: Lato;
font-size: 17px;
font-style: normal;
font-variant: normal;
font-weight: 400;
line-height: 20px;
}
blockquote {
font-family: Lato;
font-size: 21px;
font-style: normal;
font-variant: normal;
font-weight: 400;
line-height: 30px;
}
pre {
font-family: Lato;
font-size: 13px;
font-style: normal;
font-variant: normal;
font-weight: 400;
line-height: 18.5667px;
}

if there’s any help you could give me, or some pointers, I sure would appreciate it!