MrStan1slav

https://jsfiddle.net/MrStan1slav/0jabetpn

Если вы знаете тонкости своего дела и свободно владеете инструментами, то вам под силу всё, но даже эти скиллы (навыки) не сравнятся с собственным опытом и что называется "набитыми шишками". Но как я вижу, вы уже делаете хорошие сайты, и вы можете делать/верстать хорошие сайты. Если сомневаетесь в себе - вбейте в поисковик лучшие/красивые сайты/лендинги или что-то подобное и попробуйте сверстать (если не лень). В любом случае опыт необходим.

Можно и на чистом CSS: https://jsfiddle.net/MrStan1slav/3zrems1b

Это делается при помощи matchMedia в js.
Документации = {
русиш: https://developer.mozilla.org/ru/docs/Web/API/Wind... ,
инглиш: https://www.w3schools.com/jsref/met_win_matchmedia.asp
}
Материал: https://loftblog.ru/material/izuchaem-matchmedia-a...
Если вы фанатеете от jQuery и не можете без него: https://habr.com/post/318972/

Потому что селектор + влияет только на элемент, идущий следующим по дереву, а на предыдущий элемент нет. Тут проще всего использовать JS.