body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  background: radial-gradient(ellipse at left bottom, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), linear-gradient(to right,  rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), linear-gradient(-45deg, #670d10 0%,#092756 100%);
}

h1 {
  position: relative;
}

h1, h1::after {
  margin: 0;
  font-size: clamp(2rem, 1rem + 3vw, 12rem);
  background: linear-gradient(to left, #d16ba5, #c777b9, #ba83ca, #aa8fd8, #9a9ae1, #8aa7ec, #79b3f4, #69bff8, #52cffe, #41dfff, #46eefa, #5ffbf1, #46eefa,#41dfff,#52cffe,#69bff8,#79b3f4,#8aa7ec,#9a9ae1,#aa8fd8,#ba83ca, #c777b9,#d16ba5);
   /*background: linear-gradient(90deg in hsl longer hue, hsl(0 100% 70%) 0 0); */
  background-size: 500% 100%;
  -webkit-animation: blend 30s infinite linear;
          animation: blend 30s infinite linear;
  color: transparent;
  -webkit-background-clip: text;
          background-clip: text;
}

h1::after {
  content: 'fb84';
  filter: blur(8px);
  position: absolute;
/*   z-index: -1; */
  left: 0;
  mix-blend-mode: hard-light;
}

@-webkit-keyframes blend {
  to { background-position: 500% 100%; }
}

@keyframes blend {
  to { background-position: 500% 100%; }
}