Фото в буквах

Фотография видна сквозь огромные буквы (background-clip: text) и медленно панорамирует.

Просто смотрите.

ГОРЫ

Код

<h1 class="photo-text">ГОРЫ</h1>

<style>
.photo-text {
  font-size: 20vw; font-weight: 800; letter-spacing: -.04em;
  background-image: url(photo.jpg);
  background-size: cover; background-position: center 30%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;                    /* фото видно сквозь буквы */
  animation: pan 14s ease-in-out infinite alternate;
}
@keyframes pan {
  from { background-position: center 20%; }
  to { background-position: center 60%; } }
</style>

Промпт для ИИ

Сделай фото внутри букв: огромному жирному заголовку (вес 800, размер 15-20vw, letter-spacing отрицательный — чем толще буквы, тем больше фото видно) задай background-image с фото, background-clip: text (+ -webkit-) и color: transparent. Добавь медленный пан фона background-position 20%→60% за 14s alternate — фото «живёт» внутри букв.