The .hidden and .visible classes in Bootstrap. Hiding elements, is it dangerous for SEO?

Question

Search Engine Optimization

Good!
To hide unnecessary elements on narrow screens or show them only on wide screens, I use the .hidden and .visible classes.
Thus, I increase the convenience for mobile users by removing unnecessary things, but sometimes you have to display the titles 2 times in the code.
For example, I now have two H1 headings on the page
. One is shown for mobile (the second is for desktop, just in a different place for convenience)
.
After all, now there are two identical H1 headers in the code, although they are displayed for users 1 time
each. Thank you in advance!

Answer 1

This approach harms rankings, because content is duplicated. Go deep and apply media queries with different styles to elements without duplicating them.

Answer 2

The content of the tag can be replaced using JS by setting a condition for the mobile version.

Answer 3

I can’t understand why change H1, I put the ranking in principle only one h1, because I don’t see the point of removing the main name of the projects and confusing people, xs maybe I didn’t understand something from your article.