@keyframes loopText1 {
  0%, 6% { opacity: 0; transform: translateY(5px); }
  20%, 90% { opacity: 1; transform: translateY(0); }
  95%, 100% { opacity: 0; transform: translateY(5px); }
}
@keyframes loopText2 {
  0%, 20% { opacity: 0; transform: translateY(5px); }
  33%, 90% { opacity: 1; transform: translateY(0); }
  95%, 100% { opacity: 0; transform: translateY(5px); }
}
@keyframes loopText3 {
  0%, 33% { opacity: 0; transform: translateY(5px); }
  46%, 90% { opacity: 1; transform: translateY(0); }
  95%, 100% { opacity: 0; transform: translateY(5px); }
}
@keyframes loopText4 {
  0%, 46% { opacity: 0; transform: translateY(5px); }
  60%, 90% { opacity: 1; transform: translateY(0); }
  95%, 100% { opacity: 0; transform: translateY(5px); }
}

@keyframes loopDot1 {
  0%, 6% { transform: scale(0); opacity: 0; }
  10% { transform: scale(1.5); opacity: 1; }
  14%, 90% { transform: scale(1); opacity: 1; }
  95%, 100% { transform: scale(0); opacity: 0; }
}
@keyframes loopDot2 {
  0%, 20% { transform: scale(0); opacity: 0; }
  24% { transform: scale(1.5); opacity: 1; }
  28%, 90% { transform: scale(1); opacity: 1; }
  95%, 100% { transform: scale(0); opacity: 0; }
}
@keyframes loopDot3 {
  0%, 33% { transform: scale(0); opacity: 0; }
  37% { transform: scale(1.5); opacity: 1; }
  41%, 90% { transform: scale(1); opacity: 1; }
  95%, 100% { transform: scale(0); opacity: 0; }
}
@keyframes loopDot4 {
  0%, 46% { transform: scale(0); opacity: 0; }
  50% { transform: scale(1.5); opacity: 1; }
  54%, 90% { transform: scale(1); opacity: 1; }
  95%, 100% { transform: scale(0); opacity: 0; }
}

.anim-text-1 { opacity: 0; animation: loopText1 7s infinite; }
.anim-text-2 { opacity: 0; animation: loopText2 7s infinite; }
.anim-text-3 { opacity: 0; animation: loopText3 7s infinite; }
.anim-text-4 { opacity: 0; animation: loopText4 7s infinite; font-weight: 600; color: var(--story-gold); }

.story-intro__sequence li:nth-child(1) { animation: loopText1 7s infinite; }
.story-intro__sequence li:nth-child(1)::before { animation: loopDot1 7s infinite; }

.story-intro__sequence li:nth-child(2) { animation: loopText2 7s infinite; }
.story-intro__sequence li:nth-child(2)::before { animation: loopDot2 7s infinite; }

.story-intro__sequence li:nth-child(3) { animation: loopText3 7s infinite; }
.story-intro__sequence li:nth-child(3)::before { animation: loopDot3 7s infinite; }

.story-intro__sequence li:nth-child(4) { animation: loopText4 7s infinite; }
.story-intro__sequence li:nth-child(4)::before { animation: loopDot4 7s infinite; }