/* Lebendige Knöpfe des Anfrageformulars: Licht und Magnet für Absenden, Weiter und Zurück
   (.btn-absenden.knopf-leben), wie bei den übrigen Haupt-Schaltflächen. Form, Pfeil und Druck stehen in anfrage.css.
   Nur mit Maus (hover: hover und pointer: fine), schwach: der Schein folgt dem Zeiger, der Knopf rückt höchstens
   3 px. Bei „Bewegung reduzieren“ steht alles still. Ein eigenes Stylesheet, weil anfrage.css keinen Verlauf trägt.
   Das Skript knopf-leben.js setzt nur --licht-x/-y und --magnet-x/-y. Die Kacheln bleiben ohne. */
@media (hover: hover) and (pointer: fine) {
  .btn-absenden.knopf-leben {
    --licht-x: 50%; --licht-y: 50%; --licht-farbe: rgba(169, 192, 216, 0.32);
    position: relative; isolation: isolate; overflow: hidden;
    translate: var(--magnet-x, 0px) var(--magnet-y, 0px);
    transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease, scale 120ms ease, translate 220ms ease;
  }
  .btn-absenden.knopf-leben::before {
    content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
    background: radial-gradient(90px circle at var(--licht-x) var(--licht-y), var(--licht-farbe), transparent 70%);
    opacity: 0; transition: opacity 200ms ease;
  }
  .btn-absenden.knopf-leben:hover::before { opacity: 1; }
  .btn-absenden.knopf-leben.knopf-zweitrangig { --licht-farbe: rgba(74, 109, 153, 0.16); }
  .btn-absenden.knopf-leben[disabled] { translate: none; }
  .btn-absenden.knopf-leben[disabled]::before { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .btn-absenden.knopf-leben { translate: none; transition: none; }
  .btn-absenden.knopf-leben::before { display: none; }
}
