/* WhatsApp-Button (global wiederverwendbar) */
.whatsapp-button {
  display:inline-flex; align-items:center; justify-content:center;
  background:#25d366; color:#fff; padding:.5em 1em; border-radius:4px;
  height:38px; min-width:140px; text-align:center; gap:8px; text-decoration:none; font-weight:600;
  transition:background-color .3s;
}
.whatsapp-button:hover { background-color:#1a9e4a !important; color:#fff !important; }

/* Primärer CTA (global) – z. B. #cta-ersparnis */
#cta-ersparnis,
#cta-ersparnis:visited{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; padding:.5em 1em; font-weight:700; text-decoration:none;
  color:#fff !important; background:var(--ersp-primary, #007acc) !important;
  border-radius:10px; box-shadow:0 1px 2px rgba(0,0,0,.12);
  transition: background .15s ease, transform .05s ease, box-shadow .15s ease;
}
#cta-ersparnis:hover{
  background:var(--ersp-primary-hov, #0067c2) !important;
  box-shadow:0 2px 6px rgba(0,0,0,.14);
}
#cta-ersparnis:active{
  background:var(--ersp-primary-act, #005fb0) !important;
  transform:translateY(1px); box-shadow:0 1px 2px rgba(0,0,0,.10);
}
#cta-ersparnis:focus-visible{ outline:2px solid var(--ersp-focus, #c6dafc); outline-offset:2px; }

/* Buttons in .container, Bild-rechts-Variante (falls genutzt) */
.container a.button { display:inline-flex; align-items:center; justify-content:center;
  background-color:#007bff; color:#fff; text-decoration:none; padding:12px 20px; margin:10px auto;
  border-radius:10px; transition:background-color .3s; width:100%; max-width:500px; box-sizing:border-box; text-align:center; gap:8px; font-weight:700;
}
.container a.button:hover { background-color:#0056b3; }
.container a.button.img-right { justify-content:space-between; gap:10px; }
.container a.button.img-right > span { flex-grow:1; text-align:center; }
.container a.button.img-right img { margin-left:10px; height:24px; width:auto; flex-shrink:0; }
@media (max-width:600px){
  .container a.button { max-width:100%; }
  .container a.button.img-right { justify-content:center; }
  .container a.button.img-right img { display:none; }
}

/* Spezial-Buttons mit Hintergrundbildern (falls noch genutzt) */
.container a.button.aqua, .container a.button.gyg {
  font-size:1.2rem; height:150px; padding:0 20px; text-shadow:0 0 4px rgba(0,0,0,.7); border:none; display:flex; color:#fff;
}
.container a.button.aqua { background:url('../images/aqua.webp') 100% 45% / 100% no-repeat; }
.container a.button.gyg  { background:url('../images/gyg.webp') 50% 6% / 100% no-repeat; transition: background-color .3s, filter .3s; }
.container a.button.aqua:hover, .container a.button.gyg:hover { filter: brightness(.85); background-color: transparent; }