How to style a content block?

Question

Radio communication

I would like to ask experienced layout designers for advice: here is the structure of the site page prntscr.com/gg2v5g . The .main block has paragraphs with line-height=15 and line-height=22, there are headings with indents and 20px and 50px on different pages. Tell me, for such motley styling, you create nested classes inside .main for each page, or add another class to .main. Why such a question? I'm laying out the site and on the page "About the company" the paragraphs are gray with font-size=12px, line-height=16px, and on the posts page font-size=16px, font-size=22. In the search results, the product card is 250px high, and in the product catalog - 270px, otherwise the cards are identical. Tell me how to organize this moment. Thank you.

Answer 1

If I understand correctly .. Isn't it easier to do this:

<section class="main">
 <div class="*">

 </div>
</section>

* instead of an asterisk on each page, change the class with the desired styles

Answer 2

Learn BEM, do not take out the brain of yourself and others.