/* footer.css – ausgelagert aus styles.css (Footer + Floating CTA) */

/* Sticky-Footer: Footer immer am unteren Rand bei wenig Seiteninhalt
   - funktioniert ohne "fixed" (überlagert keinen Content)
   - bei langen Seiten bleibt der Footer normal am Ende (nach dem Content)
*/
/* Sticky-Footer: OHNE height:100% (verhindert Background-Seams beim Scrollen) */
html{
  min-height: 100%;
  height: auto; /* wichtig: keine fixe Höhe -> keine "Linien" beim Scrollen */
}
body{
  height: auto;      /* wichtig: kein 100% */
  min-height: 100vh; /* bleibt mind. Viewport hoch, wächst aber korrekt mit Content */
  display: flex;
  flex-direction: column;
}
uptinhalt soll den verfügbaren Platz füllen und den Footer nach unten drücken */
body > main{
  flex: 1 0 auto;
}
/* Footer selbst am Ende der Flex-Spalte */
body > footer.footer{
  margin-top: auto;
  flex: 0 0 auto;
}


/* Floating CTA */
.floating-cta{
  position:fixed;
  right: 16px;
  bottom: 16px;
  z-index: 90;
  display:flex;
  gap:10px;
  align-items:center;
  pointer-events:none;
}

.floating-cta .btn{
  pointer-events:auto;
  box-shadow: 0 18px 44px rgba(7,24,50,.18);
}

.floating-cta .hint{
  display:none;
  font-size:12px;
  color:#fff;
  background: rgba(4,26,53,.86);
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
}

@media (min-width: 900px){
  .floating-cta .hint{ display:block; }
}

/* Floating-CTA: Icon größer (nur unten rechts) */
.floating-cta .btn{
  --icon-size: 22px; /* 20–24px je nach Geschmack */
}

/* Footer */
.footer{
  padding: 34px 0 46px;
  border-top: 1px solid rgba(230,237,247,.9);
  background: rgba(255,255,255,.60);
}

.footer-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;
  flex-wrap:wrap;
}

.footer-left{
  display:flex;
  align-items:center;
  gap: 12px;
}

.footer-right{
  display:flex;
  align-items:center;
  gap: 12px;
  flex-wrap:wrap;
}

.footer a{
  color: var(--blue-700);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.footer-version{
  color: var(--muted);
  flex: 0 0 100%;
  width: 100%;
  text-align: right;
  padding-right: 6px; /* verhindert "kleben am Rand" */
  box-sizing: border-box;
}

/* Zertifikat unten im Footer */
.footer-cert{
  flex: 1 0 100%;
  display:flex;
  justify-content:center;
  align-items:center;
  gap: 26px;
  row-gap: 10px;
  margin-top: 12px;
  padding-top: 40px;
  border-top: 1px solid rgba(230,237,247,.65);
}

.footer-cert img{
  height: 44px;
  width: auto;
  max-width: min(320px, 90vw);
  display:block;
  object-fit: contain;
}

@media (max-width: 560px){
  .footer-cert{
    justify-content:center;
    margin-top: 10px;
    padding-top: 10px;
  }
  .footer-cert img{
    height: 34px;
  }
}