/* ==========================================================================
   Kölner Putzteufel – dezente Auffrischung (02.10.2026)
   Wird NACH styles1.css geladen. Ändert kein Layout, nur Details:
   Buttons, Formulare, Bilder, Hover-Effekte, Schnellkontakt-Buttons.
   Zum Abschalten: <link …kpt-modern.css> aus den Seiten entfernen.
   ========================================================================== */
:root {
  --kpt-red: #df0612;
  --kpt-red-dark: #b8040e;
  --kpt-ink: #1d232b;
  --kpt-line: #d9dde3;
  --kpt-radius: 12px;
  --kpt-shadow: 0 6px 20px rgba(20, 24, 31, .10);
  --kpt-wa: #25d366;
  --kpt-wa-dark: #1ebe5b;
}

html { scroll-behavior: smooth; }
html, body { overflow-x: hidden; } @supports (overflow: clip) { html, body { overflow-x: clip; } }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
::selection { background: var(--kpt-red); color: #fff; }
input[type="checkbox"], input[type="radio"], input[type="range"] { accent-color: var(--kpt-red); }

/* ---------- Navigation ---------- */
.navbar-nav > li > a { transition: color .2s ease; }
.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus { color: var(--kpt-red) !important; }
.dropdown-menu { border-radius: 10px !important; border: 1px solid #eceef1 !important; box-shadow: var(--kpt-shadow) !important; padding: 6px 0 !important; }
.dropdown-menu > li > a { transition: background-color .15s ease, color .15s ease, padding-left .15s ease; }
.dropdown-menu > li > a:hover { background: #fff1f2 !important; color: var(--kpt-red) !important; padding-left: 24px; }

/* ---------- Buttons ---------- */
.btn-primary,
button[type="submit"],
input[type="submit"] {
  background: var(--kpt-red) !important;
  border: 0 !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 12px 28px !important;
  font-weight: 600 !important;
  letter-spacing: .01em;
  box-shadow: 0 6px 16px rgba(223, 6, 18, .25);
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.btn-primary:hover, button[type="submit"]:hover, input[type="submit"]:hover,
.btn-primary:focus, button[type="submit"]:focus, input[type="submit"]:focus {
  background: var(--kpt-red-dark) !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(223, 6, 18, .30);
}
a.btn, .video-link-button { border-radius: 999px !important; transition: transform .15s ease, box-shadow .15s ease; }
a.btn:hover, .video-link-button:hover { transform: translateY(-1px); }

/* ---------- Formulare ---------- */
form input[type="text"], form input[type="email"], form input[type="tel"], form input[type="date"],
form input[type="number"], form input[type="file"], form select, form textarea, .form-control, .form-select {
  border: 1px solid var(--kpt-line) !important;
  border-radius: 10px !important;
  padding: 11px 14px !important;
  min-height: 46px;
  background-color: #fff !important;
  box-shadow: none !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}
form textarea, textarea.form-control { min-height: 110px; }
form input:focus, form select:focus, form textarea:focus, .form-control:focus, .form-select:focus {
  border-color: var(--kpt-red) !important;
  box-shadow: 0 0 0 4px rgba(223, 6, 18, .12) !important;
  outline: none !important;
}
form label { color: var(--kpt-ink); }
form .error, .error { color: var(--kpt-red); font-weight: 500; }

/* Auswahl-Kästchen im Angebotsformular als klickbare Zeilen */
.checkbox-option {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px !important;
  margin: 0 0 6px !important;
  border: 1px solid #eceef1;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  transition: border-color .15s ease, background-color .15s ease;
}
.checkbox-option:hover { border-color: #f3b3b6; background: #fff7f7; }
.checkbox-option:has(input:checked) { border-color: var(--kpt-red); background: #fff1f2; }
.checkbox-option input { width: 18px; height: 18px; margin: 0 !important; flex: 0 0 auto; }

/* ---------- Bilder & Karten ---------- */
.blog-slider { border-radius: 18px !important; box-shadow: 0 18px 40px rgba(20, 24, 31, .16) !important; }
.blog-slider__img img { border-radius: 12px; }
.img-thumbnail { border-radius: 10px !important; transition: transform .2s ease, box-shadow .2s ease; }
a:hover > .img-thumbnail { transform: translateY(-2px) scale(1.03); box-shadow: 0 8px 18px rgba(0, 0, 0, .35); }
.video-teaser-link, .video-player-card, .video-card { border-radius: 16px !important; overflow: hidden; }
.headelement .head1 { border-radius: 18px !important; backdrop-filter: blur(2px); }
main img[src*="/images-sq/"], .container img[src*="/images-sq/"] { border-radius: var(--kpt-radius); box-shadow: var(--kpt-shadow); }

/* ---------- Footer ---------- */
.footer a { transition: color .15s ease, opacity .15s ease; }
.footer a:hover { color: #fff !important; opacity: .85; }
.footer img[src$="fb.webp"], .footer img[src$="gm.webp"], .footer img[src$="yt.webp"] { transition: transform .15s ease; }
.footer a:hover img[src$="fb.webp"], .footer a:hover img[src$="gm.webp"], .footer a:hover img[src$="yt.webp"] { transform: translateY(-2px); }

/* ---------- Schnellkontakt (WhatsApp / Anrufen) ---------- */
.mobile-call-button { display: none !important; } /* alter Anruf-Button der Startseite – ersetzt durch .kpt-fab */
.kpt-fab {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 9990;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}
.kpt-fab__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 56px;
  min-width: 56px;
  padding: 0 16px;
  border-radius: 999px;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 600;
  font-size: 15px;
  line-height: 1;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .22);
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.kpt-fab__btn svg { width: 26px; height: 26px; flex: 0 0 auto; fill: currentColor; }
.kpt-fab__btn:hover, .kpt-fab__btn:focus-visible { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0, 0, 0, .28); }
.kpt-fab__btn:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.kpt-fab__wa { background: var(--kpt-wa); }
.kpt-fab__wa:hover { background: var(--kpt-wa-dark); }
.kpt-fab__call { background: var(--kpt-red); padding: 0; justify-content: center; width: 56px; }
.kpt-fab__call:hover { background: var(--kpt-red-dark); }
@media (min-width: 1025px) {
  .kpt-fab__call { display: none; }
}
@media (max-width: 600px) {
  .kpt-fab { right: 14px; bottom: 14px; }
  .kpt-fab__wa { padding: 0; width: 56px; justify-content: center; }
  .kpt-fab__wa span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}
@media print { .kpt-fab { display: none !important; } }