Как реализовать текст на тексте?

Question

[Alekosh Akhosh]

Приветствую, оформил задний текст через селектор ::before, как декоративный, но никак не получается. Выходит что он перекрывает заголовок, что даже Z-index не помогает. В чем я ошибся? буду признателен.

.title h3::before{
  content: 'my projects';
  text-transform: uppercase;
  font-weight: 600;
  font-size: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-shadow: 2px 2px 0 rgba(153, 153, 153, 0.3), 2px -2px 0 rgba(153, 153, 153, 0.3), -2px 2px 0 rgba(153, 153, 153, 0.3), -2px -2px 0 rgba(153, 153, 153, 0.3), 2px 0px 0 rgba(153, 153, 153, 0.3), 0px 2px 0 rgba(153, 153, 153, 0.3), -2px 0px 0 rgba(153, 153, 153, 0.3), 0px -2px 0 rgba(153, 153, 153, 0.3), 0px 0px 0px rgba(206,89,55,0.03);
  color: #000000;
}

Comments

[Ankhena]

Гридом (у гридов тоже есть z-index, но при правильном порядке не понадобится)
Абсолютом.

content лучше получать из data-атрибута - проще будут редактировать.