https://psdfreebies.com/ ,
на Pinterest ищешь free PSD template
Удачи

Там во время наведения :hover у svg с таким же контуром меняется цвет с прозрачного на немного прозрачный.
Можно посмотреть с помощью инструментов разработчика ( например, в хроме достаточно нажать f12), как оно работает - наводить и убирать мышку - код svg меняется.
Рекомендую также поставить на браузер Chrome расширение Wappalyzer - показывает, какие технологии используются на сайте

Лучше всего писать CSS в подключаемых файлах .css
Во-первых - таким способом ты разделяешь разметку и стили, не превращаешь всё в кашу.
Во-вторых, стили прописанные в аттрибуте style="" сложно перевесить - для этого нужно делать !important, теряется вся фишка "каскадных" стилей.

А так, всё можно использовать в нужных случаях, смотри по ситуации.
Всему своё место