It is a little weird but directly targeted elements take precedence over inherited styles.
The h1 is being directly targeted by the inline style so it takes precedence over the inherited style from the body. If you give the h1 its own selector the !important will work.
h1 {
color: green !important;
}