/* meinkatalysator.de – Ergänzungen zur statischen Kopie (ersetzt das OnePage-JavaScript) */
@media (max-width: 768px) { .mk-only-desktop { display: none !important; } }
@media (min-width: 769px) { .mk-only-mobile { display: none !important; } }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Honigtopf: für Menschen unsichtbar, für Bots ein normales Feld */
.mk-hp { position: absolute !important; left: -9999px !important; top: auto !important; width: 1px; height: 1px; overflow: hidden; }

/* Ländervorwahl: Anzeige "+49", echtes <select> liegt unsichtbar darüber */
.con-kit-atom-phone-number .one-kit-form-item-prepend--clickable { width: 64px !important; }
.con-kit-atom-phone-number input[name=telefon_nummer] { padding-left: 74px !important; }
.mk-cc { position: relative; display: flex; align-items: center; width: 64px; height: 100%; box-sizing: border-box; padding: 0 8px 0 12px; margin: 0;
  border-right: 1px solid rgba(25, 25, 25, .15); font-size: 13px; color: rgb(25, 25, 25); font-family: inherit; cursor: pointer; }
.mk-cc .mk-cc-label { pointer-events: none; white-space: nowrap; }
.mk-cc .mk-cc-label::after { content: ""; display: inline-block; margin-left: 5px; border: 4px solid transparent; border-top-color: currentColor; transform: translateY(2px); opacity: .6; }
.mk-cc select.mk-cc-select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; font-size: 16px; }

/* Upload (Simon 136293): große Ablagefläche, Klick öffnet den Ordner, Dateien als Liste mit Entfernen */
.mk-form .con-kit-form-uploader { cursor: pointer; border-radius: 6px; }
.mk-form .con-kit-form-uploader:focus-visible { outline: 2px solid rgb(255, 204, 0); outline-offset: 2px; }
.mk-form .con-kit-form-uploader__item { min-height: 80px; align-items: center; background: rgba(25, 25, 25, .025); border-radius: 6px; transition: background .15s ease; }
.mk-form .con-kit-form-uploader__item-text { max-height: none !important; min-height: 80px !important; }
.mk-form .con-kit-form-uploader__item-text-subtitle { line-height: 1.35; margin-top: 2px; }
@media (max-width: 768px) { .mk-form .con-kit-form-uploader__item, .mk-form .con-kit-form-uploader__item-text { min-height: 64px !important; } }
.mk-form .con-kit-form-uploader__item .one-kit-form-item-prepend { height: 100%; display: flex; align-items: center; }
.mk-form .con-kit-form-uploader:hover .con-kit-form-uploader__item { background: rgba(255, 204, 0, .08); }
.mk-form .con-kit-form-uploader.mk-drag .con-kit-form-uploader__item { background: rgba(255, 204, 0, .16); outline: 2px dashed rgb(255, 204, 0); outline-offset: -2px; }
.mk-files { display: flex; flex-direction: column; gap: 4px; font-size: 12px; line-height: 1.4; color: rgb(25, 25, 25); }
.mk-files:empty { display: none; }
.mk-datei { display: flex; align-items: center; gap: 8px; padding: 5px 4px 5px 10px; border-radius: 6px; background: rgba(25, 25, 25, .05); }
.mk-datei-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk-datei-groesse { color: rgba(25, 25, 25, .55); white-space: nowrap; }
.mk-datei-weg { border: 0; background: none; width: 24px; height: 24px; border-radius: 50%; font-size: 16px; line-height: 1; color: rgba(25, 25, 25, .6); cursor: pointer; }
.mk-datei-weg:hover { background: rgba(25, 25, 25, .08); color: rgb(25, 25, 25); }

/* Einwilligung: Haken klar sichtbar, wenn gesetzt */
.mk-form .con-kit-atom-consent .one-kit-form-radio-check--selected { --alpha-border: .6 !important; }
.mk-form .con-kit-atom-consent label { cursor: pointer; }

/* Anzahl: eigene Auswahlliste im Seitendesign (Rechner) */
.mk-form .mk-dd { position: relative; }
.mk-form .mk-dd select.mk-dd-nativ { position: absolute !important; opacity: 0 !important; pointer-events: none !important; width: 1px !important; height: 1px !important; }
.mk-dd-knopf { display: block; width: 100%; height: 40px; padding: 0 36px 0 12px; border: 0; background: transparent; text-align: left; font: inherit; font-family: Poppins, sans-serif;
  font-size: 13px; color: rgb(25, 25, 25); cursor: pointer; position: relative; z-index: 1; border-radius: 6px; }
.mk-dd-knopf.mk-dd-leer { color: rgba(25, 25, 25, .45); }
.mk-dd-knopf:focus-visible { outline: 2px solid rgb(255, 204, 0); outline-offset: 1px; }
.mk-dd .one-kit-form-dropdown__arrow { transition: transform .15s ease; pointer-events: none; z-index: 2; }
.mk-dd.mk-dd-offen .one-kit-form-dropdown__arrow { transform: rotate(180deg); }
.mk-dd.mk-dd-offen .one-kit-form-element-border { border-color: rgb(25, 25, 25) !important; }
.mk-dd-liste { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 40; margin: 0; padding: 6px; list-style: none; background: #fff;
  border: 1px solid rgba(25, 25, 25, .12); border-radius: 10px; box-shadow: 0 12px 32px rgba(0, 0, 0, .16), 0 2px 6px rgba(0, 0, 0, .06); font-family: Poppins, sans-serif; }
.mk-dd-liste li { padding: 9px 12px; border-radius: 6px; font-size: 13px; color: rgb(25, 25, 25); cursor: pointer; display: flex; justify-content: space-between; align-items: center; }
.mk-dd-liste li.mk-dd-aktiv { background: rgba(255, 204, 0, .22); }
.mk-dd-liste li[aria-selected=true] { font-weight: 600; }
.mk-dd-liste li[aria-selected=true]::after { content: "✓"; font-weight: 600; }

/* Eigene Texte in der Seitenschrift */
.mk-danke, .mk-form-status, .mk-files, .mk-form .one-form-validation { font-family: Poppins, sans-serif; }

/* Fehler / Status */
.mk-form .one-form-validation:not(:empty) { color: rgb(255, 97, 57); font-size: 12px; margin-top: 4px; }
.mk-form .mk-invalid .one-kit-form-element-border,
.mk-form .mk-invalid .one-kit-form-input__border { border-color: rgb(255, 97, 57) !important; box-shadow: 0 0 0 1px rgb(255, 97, 57) inset; }
.mk-form-status:not(:empty) { margin-top: 10px; padding: 10px 12px; border-radius: 8px; background: rgba(255, 97, 57, .1); color: rgb(190, 50, 20); font-size: 13px; line-height: 1.4; text-align: center; }
.mk-form button[type=submit][disabled] { opacity: .65; cursor: progress; }

/* Danke-Ansicht (Frame "Dankeseite" des Originals) */
.mk-danke { text-align: center; color: rgb(25, 25, 25); padding: 6px 4px; outline: none; }
.mk-danke-titel { font-family: var(--font-kit-header-font, Poppins), sans-serif; font-weight: 700; font-size: 22px; margin-bottom: 12px; }
.mk-danke-text { font-size: 14px; line-height: 1.55; margin: 0 0 18px; }
.mk-danke-knopf { display: inline-flex; text-decoration: none; margin-bottom: 18px; }
.mk-danke .mk-danke-knopf { background: rgb(255, 204, 0); color: rgb(25, 25, 25); padding: 14px 26px; border-radius: 100px; font-weight: 600; font-size: 15px; }
.mk-danke-punkte { list-style: none; padding: 0; margin: 0 auto; display: inline-flex; flex-direction: column; gap: 8px; text-align: left; font-size: 14px; }
.mk-danke-punkte li { display: flex; align-items: center; gap: 8px; }
.mk-danke-punkte svg { width: 18px; height: 18px; color: rgb(255, 204, 0); flex: none; }

/* FAQ: geschlossene Antworten */
.con-kit-component-list-item-accordion:not(.con-kit-component-list-item-accordion--open) .con-kit-component-list-item-accordion__body { height: 0; }
.con-kit-component-list-item-accordion--open .con-kit-component-list-item-accordion__body { transform: none; }

/* Slider */
.con-kit-component-slider__items.mk-slider-track { transition: transform .45s ease; will-change: transform; }
.con-kit-component-slider-pagination__item { cursor: pointer; }
.con-kit-component-slider-arrow[hidden] { display: none !important; }

/* Video: Einbettung erst nach Klick */
.mk-video-frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; z-index: 5; border-radius: inherit; background: #000; }
.con-kit-atom-video .con-kit-component-video-preview { cursor: pointer; }

/* Mobil-Menü (Burger) */
.mk-drawer { position: fixed; inset: 0; z-index: 1000; background: rgba(0, 0, 0, .55); }
.mk-drawer[hidden] { display: none; }
.mk-drawer-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(86vw, 340px); background: #000; color: #fff;
  padding: 72px 28px 28px; box-shadow: -8px 0 30px rgba(0, 0, 0, .4); font-family: Poppins, sans-serif; animation: mk-in .25s ease; }
@keyframes mk-in { from { transform: translateX(30px); opacity: 0; } to { transform: none; opacity: 1; } }
.mk-drawer-panel nav { display: flex; flex-direction: column; }
.mk-drawer-link { color: #fff; text-decoration: none; font-size: 18px; font-weight: 500; padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, .11); }
.mk-drawer-link:hover, .mk-drawer-link:focus-visible, .mk-drawer-link[aria-current=page] { color: rgb(255, 204, 0); }
.mk-drawer-close { position: absolute; top: 18px; right: 18px; width: 40px; height: 40px; border: 0; background: transparent; color: #fff; cursor: pointer; padding: 8px; }
.mk-drawer-close svg { width: 24px; height: 24px; }
body.mk-noscroll { overflow: hidden; }

/* Text-Hervorhebung (OnePage zeichnet sie per JS als Hintergrund-Kasten) */
.con-kit-quark-highlight[data-highlight-type=background] {
  background-color: rgba(var(--color-bg), var(--alpha-bg));
  border-radius: calc(var(--one-kit-quark-radius, 4) * .02em);
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}

/* Zwei-Schritt-Formular, Handy-Knopf, Cookie-Banner (Simon 136189) — Farben von meinkatalysator.de */
.mk-schritt{font:600 14px/1.4 Poppins,system-ui,sans-serif;color:#292929;margin:0 0 10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mk-schritt-nr{display:inline-block;background:#FFCC01;color:#292929;font-weight:700;font-size:12px;letter-spacing:.03em;text-transform:uppercase;border-radius:999px;padding:3px 10px}
.mk-sticky-cta{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:9000;border:0;border-radius:100px;background:#FFCC01;color:#191919;font:700 16px/1.2 Poppins,system-ui,sans-serif;padding:16px 20px;box-shadow:0 8px 24px rgba(0,0,0,.35);cursor:pointer}
.mk-sticky-cta[hidden]{display:none}
.mk-consent{position:fixed;left:12px;right:12px;bottom:12px;z-index:9500;max-width:560px;margin:0 auto;background:#292929;color:#f2f2f2;border-radius:16px;padding:18px 20px;box-shadow:0 12px 40px rgba(0,0,0,.45);font:400 14px/1.55 Poppins,system-ui,sans-serif}
.mk-consent[hidden]{display:none}
.mk-consent p{margin:0 0 12px}.mk-consent b{color:#fff}.mk-consent a{color:#FFCC01}
.mk-consent-knoepfe{display:flex;gap:10px;flex-wrap:wrap}
.mk-consent-knoepfe button{flex:1 1 160px;min-height:46px;border-radius:100px;font:700 15px Poppins,system-ui,sans-serif;cursor:pointer}
.mk-consent-ja{background:#FFCC01;color:#191919;border:0}
.mk-consent-nein{background:transparent;color:#fff;border:2px solid #fff}
/* Conversion-Feinschliff (Simon 136210) */
/* Handy (Simon 136283): Video + Sterne, dann Formular, dann Laufband — Formular nicht mehr vorgezogen, kleiner Abstand dazwischen */
@media (max-width:768px){.mk-hero-row{flex-wrap:wrap}.mk-form-col{margin-top:-20px}}
.mk-vertrauen{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;margin:10px 0 0;font:500 13px/1.4 Poppins,system-ui,sans-serif;color:#3a3a3a}
.mk-vertrauen span{white-space:nowrap}
@media (min-width:769px){.mk-sticky-cta{left:auto;right:24px;bottom:24px;padding:14px 24px;font-size:15px}}
/* Google-Siegel „5,0 von 5“ (Bild) aus dem Laufband — widerspricht der 4,9 im Kopf (Simon 136210) */
.con-kit-component-marquee-gallery-item:has(img[src*="5-sterne-google-bewertung"]){display:none}
/* Einheitlicher Abstands-Rhythmus (Simon 136259) */
:root{--mk-luft:88px;--mk-luft-hero:48px}
@media (max-width:768px){:root{--mk-luft:56px;--mk-luft-hero:36px}}
.mk-hero{min-height:0!important;padding-bottom:var(--mk-luft-hero)!important}
.mk-abschnitt{min-height:0!important;padding-top:var(--mk-luft)!important;padding-bottom:var(--mk-luft)!important}
/* Formular als Popup (Simon 136262) */
body.mk-popup-offen{overflow:hidden}
.mk-popup-schleier{position:fixed;inset:0;background:rgba(0,0,0,.62);z-index:9600}
.mk-popup{position:fixed!important;z-index:9700!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;width:min(560px,calc(100vw - 24px))!important;max-width:none!important;flex:none!important;max-height:calc(100dvh - 24px);overflow:auto;margin:0!important;border-radius:20px}
.mk-popup-zu{position:absolute;top:10px;right:10px;z-index:30;box-shadow:0 2px 8px rgba(0,0,0,.18);width:40px;height:40px;border-radius:50%;border:0;background:#EAEAEA;color:#191919;font:700 24px/40px Poppins,system-ui,sans-serif;cursor:pointer}
@media (max-width:768px){.mk-popup{top:12px!important;transform:translateX(-50%)!important;max-height:calc(100dvh - 24px)}}
.mk-popup-pfad{z-index:9650!important}
.mk-popup-pfad:not([style*="position"]){position:relative}
.mk-popup{background:#fff;box-shadow:0 24px 70px rgba(0,0,0,.5);padding-bottom:16px!important}
.mk-abschnitt-huelle{min-height:0!important}
/* Handy-Feinschliff (Simon 136273, WebKit/iPhone geprüft) */
.mk-popup{padding-top:40px!important}
@media (max-width:768px){
  body{padding-bottom:84px}                       /* fester Knopf verdeckt den Fuß nicht */
  .mk-consent{padding:14px 16px;font-size:13px;line-height:1.45;bottom:8px;left:8px;right:8px}
  .mk-consent p{margin:0 0 10px}
  .mk-consent-knoepfe button{min-height:42px;font-size:14px;flex-basis:130px}
}
/* Laufband auf dem Handy enger (Simon 136283): Abstand je Logo 80 → 28 px */
@media (max-width:768px){.con-kit-component-marquee-gallery-item{--one-kit-component-grid-list-horizontal-space:28px!important}}
/* Hilfe-Pille (nur eingeloggt) unten links (Simon 136287) */
.mk-eingeloggt .pqh-btn{left:16px!important;right:auto!important}
/* Handy: der allgemeine Knopf sitzt seit 14.10. oben rechts (Simon 144291) — hier liegt oben das Menü, unten rechts „Versandlabel anfordern“ → unten links über der Leiste (Simon 145005) */
@media(max-width:760px){.mk-eingeloggt .pqh-btn{top:auto!important;bottom:calc(env(safe-area-inset-bottom,0px) + 84px)!important;left:12px!important}}
/* Hilfe-Pille in Website-Gelb, damit sie auch auf dem schwarzen Fuß sichtbar bleibt (Simon 136313) */
.mk-eingeloggt .pqh-btn { background: #FFCC01 !important; color: #191919 !important; box-shadow: 0 6px 20px rgba(0, 0, 0, .35), 0 0 0 2px rgba(25, 25, 25, .9) !important; }
.mk-eingeloggt .pqh-btn:hover { background: #f0bf00 !important; }
.mk-eingeloggt .pqh-btn * { color: #191919 !important; }

/* Adress-Vorschläge (Simon 147333): Liste unter dem Straßenfeld, Auswahl füllt alle vier Felder */
.mk-adr { position: relative; }
.mk-adr-liste { position: absolute; left: 0; right: 0; top: 100%; z-index: 80; margin-top: 4px; background: #fff; border: 1px solid rgba(25,25,25,.15); border-radius: 8px; box-shadow: 0 12px 32px rgba(20,30,50,.16); padding: 6px; display: flex; flex-direction: column; gap: 2px; max-height: 260px; overflow: auto; }
.mk-adr-opt { display: block; width: 100%; padding: 8px 10px; border: 0; border-radius: 6px; background: none; color: rgb(25,25,25); font: 500 13px/1.35 inherit; font-family: inherit; text-align: left; cursor: pointer; }
.mk-adr-opt:hover, .mk-adr-opt.an { background: #fff6cc; }
