/* Logo: ein heller Lichtpunkt wandert in größeren Abständen über die Pulslinie.
   Ohne Bewegungswunsch des Geräts bleibt das Logo vollständig statisch. */

.brand__spark {
  stroke: var(--color-accent-200);
  stroke-dasharray: 0.2 2;
  stroke-dashoffset: 0.2;
  opacity: 0;
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  @keyframes brand-spark-idle {
    0% {
      stroke-dashoffset: 0.2;
      opacity: 0;
    }

    3% {
      opacity: 1;
    }

    17% {
      opacity: 1;
    }

    22%,
    100% {
      stroke-dashoffset: -1.2;
      opacity: 0;
    }
  }

  @keyframes brand-spark-once {
    0% {
      stroke-dashoffset: 0.2;
      opacity: 0;
    }

    12%,
    78% {
      opacity: 1;
    }

    100% {
      stroke-dashoffset: -1.2;
      opacity: 0;
    }
  }

  .site-header .brand__spark {
    animation: brand-spark-idle 9s ease-in-out 1.6s infinite;
  }

  .brand:hover .brand__spark,
  .brand:focus-visible .brand__spark {
    animation: brand-spark-once 0.9s ease-in-out 1 both;
  }

  .brand__mark {
    transition: transform 0.4s ease;
  }

  .brand:hover .brand__mark {
    transform: scale(1.04);
  }
}