/* =========================================================
   rp-cybertour.css: Block «Bilder, Rundgänge und Marketing aus eigenem Haus» (Schritt 63; Startseite und Über uns)
   Nicolas 30.09.2026: «der Abstand vom Button mehr zu Cybertour … ein bisschen klein und dann könnten da diese
   Gut-Zeichen so grün aufleuchten». Häkchen grün, leuchten beim Hineinscrollen einmal nacheinander auf; ohne
   JavaScript und bei «Bewegung reduzieren» stehen sie einfach grün da. Listentext 16 px (G7, vorher 14 px).
   ========================================================= */
.rpct-liste .bordered-list-item-small-2,
.rpct-liste .list-item-small { font-size: 16px; line-height: 1.45; }
.rpct-liste .h-list-gap-8 { align-items: center; }
.rpct-liste .circle-small { width: 24px; height: 24px; padding: 0; background: none; }
.rpct-haken {
  display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%;
  background: #e5f5ec; color: #178a4a;
}
.rpct-haken svg { width: 13px; height: 13px; display: block; }
.rpct-knopf { margin-top: 2rem; }

@media (prefers-reduced-motion: no-preference) {
  html.hat-js .rpct-liste:not(.an) .rpct-haken { background: #eef0f2; color: #a3abb2; }
  .rpct-haken {
    transition: background-color .45s ease-out, color .45s ease-out;
    transition-delay: calc(var(--i, 0) * 260ms + 150ms);
  }
  .rpct-liste.an .rpct-haken { animation: rpct-leuchten 1.5s ease-out calc(var(--i, 0) * 260ms + 150ms) 1 both; }
}
@keyframes rpct-leuchten {
  0% { box-shadow: 0 0 0 0 rgba(23, 138, 74, 0); }
  25% { box-shadow: 0 0 0 5px rgba(23, 138, 74, .22), 0 0 14px 2px rgba(40, 190, 105, .45); }
  100% { box-shadow: 0 0 0 9px rgba(23, 138, 74, 0), 0 0 0 0 rgba(40, 190, 105, 0); }
}
