Объёмный текст с двойным смещением!

Прозрачный основной текст с контуром, а два псевдослоя дублируют надпись и смещаются в разные стороны. При наведении слои расходятся, создавая 3D-смещение в стиле глич-дизайна.

Как работает:

• Прозрачный основной текст оставляет только контур;

• ::before и ::after выводят копию строки поверх него;

• При hover слои уходят в противоположные направления, формируя глубину;

• Всё построено на transform и text-stroke.

Минимальный код, но эффект отлично выделяет заголовки, hero-блоки и промо-элементы.

Code Ready | #фишка