Ionic 4 React Fonts and Styles

I don’t fully understand how the vars and styles work in Ionic 4 react app. I was able to successfully install and style my app globally with a font, but want to use different fonts for different elements.

In /src/theme/variables.css I have defined my fonts, as such

/* Fonts */
@font-face {
  font-family: 'Comfortaa', ;
  src: url('/assets/fonts/comfortaa.woff');
}

@font-face {
  font-family: 'OpenSans',;
  src: url('/assets/fonts/opensans.woff2');
}

and applied the style by setting the root font family:

: root {
  ...
  --ion-font-family: 'Comfortaa';
}

However I want to style body or h1 or paragraphs with OpenSans. I cannot figure out where and what I need to do to style each element (font/colors/etc) separately than the root theme.

Any all replies appreciated, thanks in advance.