/* Alles gilt nur, wenn das Skript .bewegt gesetzt hat. Ohne Skript bleibt die Seite vollständig sichtbar. */
@media (prefers-reduced-motion: no-preference) {
  .bewegt .einblenden { opacity: 0; transform: translateY(1.5rem); transition: opacity 0.5s ease, transform 0.5s ease; }
  .bewegt .einblenden.sichtbar { opacity: 1; transform: none; }

  /* Die Punktkette aus dem Logo wächst beim Laden in den Kreis hinein. */
  .bewegt .gsv-kreis::before { animation: punkte 0.9s ease-out both; }
  .bewegt .gsv-kreis img { animation: kreis 0.7s ease-out both; }
  @keyframes punkte { from { opacity: 0; transform: translate(1.5rem, 3rem) scale(0.4); } to { opacity: 1; transform: none; } }
  @keyframes kreis { from { opacity: 0; transform: scale(0.88); } to { opacity: 1; transform: none; } }

  .bewegt .wp-block-button__link { transition: transform 0.15s ease; }
  .bewegt .wp-block-button__link:hover { transform: translateY(-2px); }
  .bewegt .beitrag-zeile h2 a { background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 2px; transition: background-size 0.25s ease; }
  .bewegt .beitrag-zeile h2 a:hover { background-size: 100% 2px; text-decoration: none; }
}
