/* ============================================================
   Animação de máquina de escrever (cursor piscante).
   Aplica-se a qualquer elemento com [data-typewriter].
   ============================================================ */

[data-typewriter] {
  white-space: pre;
}

.typewriter--active::after {
  content: "|";
  display: inline-block;
  margin-left: 2px;
  font-weight: var(--font-weight-regular);
  color: currentColor;
  animation: typewriter-blink 0.7s step-end infinite;
}

.typewriter--done::after {
  content: "";
}

@keyframes typewriter-blink {
  0%,
  50% {
    opacity: 1;
  }
  51%,
  100% {
    opacity: 0;
  }
}