Как сделать всплывающую подсказку из примера невидимой для курсора?
Вот.
Используйте свойство visibility, для полного скрытия элемента до наведения на текст.
Подсказка добавлена к ссылке в виде псевдоэлемента. Он хоть и скрыт, но при наведении курсора на него он воспринимается как часть ссылки, и срабатывает hover.
Чтобы от этого избавиться, надо псевдоэлемент "замаскировать" - например спрятать его за предела экрана, а для :hover назначить "правильный" css, чтобы элемент был видим на экране в нужном месте.