А зачем вы подключаете SVG-файл шрифта, когда шрифты этого формата признаны устаревшими. И поддержка оных есть только в Safari (и её планируют выпилить в следующей версии).
Нужно 3 формата — TTF, WOFF, WOFF2. Эти форматы покрывают всё браузеры. А браузер всё равно выберет и скачает только тот, что он поддерживает, т. е. он скачает только один файл.
BenderIsGreat34, не знаю, может, он просто неаккуратный на мой взгляд. Но ладно, вы пока думайте, что да как у вас, но вот вам мой вариант с блоком-ссылкой и текстами при наведении:
BenderIsGreat34, просто у вас код косой довольно и слишком усложненный. Плюс, нейминг классов неверный (почему обертка сетки имеет класс .cards-item?):
И что мешало вам ваш код в песочницу изначально поместить, я же не должен был это делать за вас.
Градиент на круге можно сделать просто разными цветами border четырёх сторон закругленного блока (border-color-left и т. д.).