/* ============================================================
   KONTAKT – RESPONSIVE REFLOW (tablet <=1024, mobile <=640/480)
   Desktop (>1024px) bleibt vollständig unverändert.
   ============================================================ */

@media (max-width:1024px){

  /* ---------- generisch ---------- */
  html body .kth, html body .kcta{
    aspect-ratio:auto !important; height:auto !important;
    background-size:cover !important; background-position:center top !important;
  }
  img{max-width:100%;}

  /* ---------- HERO ---------- */
  /* Ab hier ist der Hero inhaltsgesteuert. Die Ueberlappung der Kontaktkarte
     (--kc-overlap) wird unten wieder aufgeschlagen: der Hero waechst um genau
     diesen Betrag, die Buttons stossen nicht an die Karte, Leerraum entsteht keiner. */
  html body .kth > .hero-content-container{
    position:static !important; width:calc(100% - 64px) !important;
    padding:150px 0 calc(54px + var(--kc-overlap)) !important;
  }
  html body .kth .kth-btn{min-height:48px;}

  /* ---------- FAQ ---------- */
  html body .kfaq{padding-inline:22px;}
  html body .kfaq .kfaq-q{font-size:16px !important; min-height:48px;}

  /* ---------- CTA-BAND ---------- */
  html body .kcta{
    display:flex; flex-direction:column; align-items:center; text-align:center;
    gap:14px; padding:46px 22px;
  }
  html body .kcta > *{position:static !important; transform:none !important;}
  html body section.kcta h2.kt4-ch{font-size:clamp(22px,5.4vw,30px) !important; white-space:normal !important;}
  html body .kcta .kt4-cp{font-size:15.5px !important; white-space:normal !important; max-width:560px;}
  html body .kcta .kt4-btn{
    min-height:50px; display:inline-flex !important; align-items:center;
    padding:0 30px !important; font-size:15px !important;
  }
}

/* ============================ MOBILE ============================ */
@media (max-width:640px){
  html body .kth > .hero-content-container{width:calc(100% - 44px) !important; padding:136px 0 calc(44px + var(--kc-overlap)) !important;}
  html body .kcta{padding:40px 18px;}
}

@media (max-width:480px){
}
