/* Public form: mobile friendly, modern grey/blue (with design settings)
   - clean spacing + soft shadows
   - accessible focus states
   - subtle micro-interactions (hover/active)
*/
.mkf-wrap,
.mkf-wrap * ,
.mkf-wrap *::before,
.mkf-wrap *::after{box-sizing:border-box}

/* Layout width wrapper (per-form) */
.mkf-outer{width:100%;}
.mkf-width-max .mkf-wrap{--mkf-max-width: 920px;}
.mkf-width-wide .mkf-wrap{--mkf-max-width: 1280px;}
.mkf-width-custom .mkf-wrap{--mkf-max-width: 1100px;}

/* Break out of theme content width for wide/custom/full (prevents being limited by the theme container) */
.mkf-width-full,
.mkf-width-wide,
.mkf-width-custom{
  /* Desktop breakout: extend beyond the theme container.
     NOTE: 100vw can be wider than the visible viewport on mobile (scrollbar / safe-area),
     which may cause horizontal overflow. We neutralize this on small screens below. */
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  overflow-x:hidden;
}

.mkf-width-full .mkf-wrap{max-width:none;width:100%;margin-left:0;margin-right:0;}
.mkf-width-wide .mkf-wrap,
.mkf-width-custom .mkf-wrap{width:100%;margin-left:auto;margin-right:auto;}

.mkf-wrap{
  /* Design tokens */
  --mkf-radius: 20px;
  --mkf-radius-sm: 14px;
  --mkf-shadow: 0 22px 60px rgba(16,24,40,.12);
  --mkf-shadow-sm: 0 14px 34px rgba(16,24,40,.10);
  /* gets overwritten in JS when accent is set via the Builder */
  --mkf-accent-soft: rgba(34,113,177,.18);
  --mkf-muted: rgba(11,31,53,.62);
  --mkf-input-fs: 15px;

  width:100%;
  max-width: var(--mkf-max-width, 920px);
  margin:16px auto;
  padding:22px;
  background: var(--mkf-bg, #fff);
  color: var(--mkf-text, #0b1f35);
  border:1px solid var(--mkf-card-border, #e4e8ef);
  border-radius: var(--mkf-radius);
  box-shadow: var(--mkf-shadow-sm);
  font-family: var(--mkf-font, inherit);
  font-weight: var(--mkf-weight, 400);
  font-style: var(--mkf-style, normal);
}
.mkf-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.mkf-title{margin:0;font-size:22px;line-height:1.15;letter-spacing:-.012em}
.mkf-draft-statusline{display:flex;justify-content:flex-end;margin-top:10px}
.mkf-draft-status{font-size:13px;color:var(--mkf-muted)}
.mkf-draft-status a{margin-left:6px}
.mkf-form{margin-top:14px}
.mkf-page{display:none}
.mkf-page.mkf-grid{
  display:none;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap:16px;
}
.mkf-field-wrap{
  position:relative;
  min-width:0;
  padding:0;
  border:0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition:none;
}
.mkf-field-wrap:hover{box-shadow:none;transform:none}
.mkf-label{display:block;font-weight:700;margin-bottom:8px;font-size:12px;line-height:1.2;letter-spacing:.06em;text-transform:uppercase;color:var(--mkf-muted)}
.mkf-input{display:block;width:100%;min-width:0;padding:14px 14px;border-radius:14px;border:1px solid var(--mkf-input-border, #d7deea);background: var(--mkf-input-bg, #fff);color:inherit;font-size:var(--mkf-input-fs, 15px);line-height:1.2;box-shadow: inset 0 1px 1px rgba(16,24,40,.06);transition:border-color .15s ease, box-shadow .15s ease}
.mkf-input::placeholder{color:rgba(11,31,53,.42)}
.mkf-input:focus{outline:none;border-color: var(--mkf-accent, #2271b1);box-shadow: 0 0 0 3px var(--mkf-accent-soft)}
.mkf-input:hover{border-color: rgba(11,31,53,.22)}
.mkf-radio{display:flex;flex-direction:column;gap:8px}
.mkf-choice{display:flex;gap:10px;align-items:center}
.mkf-consent-box{display:flex;flex-direction:column;gap:6px}
.mkf-consent{align-items:flex-start}
.mkf-consent input{margin-top:3px}
.mkf-consent-text{line-height:1.25}
.mkf-consent-text a{color:var(--mkf-accent, #2271b1);text-decoration:underline}
.mkf-hint{font-size:13px;color:var(--mkf-muted);margin-left:28px}
.mkf-required{position:absolute;top:2px;right:0;color:#b42318;font-weight:900;font-size:14px;line-height:1}
.mkf-error{margin-top:8px;color:#b42318;font-size:13px}

.mkf-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;justify-content:flex-end}
.mkf-btn{border:0;border-radius:12px;padding:12px 18px;cursor:pointer;font-weight:800;font-size:var(--mkf-input-fs, 15px);line-height:1.1;display:inline-flex;align-items:center;gap:8px;transition:transform .12s ease, filter .12s ease, box-shadow .12s ease;box-shadow: 0 10px 22px rgba(16,24,40,.10)}
.mkf-btn:active{transform: translateY(1px)}
.mkf-primary{background: var(--mkf-accent, #2271b1);color:#fff}
.mkf-primary:hover{filter:brightness(.96);box-shadow: 0 10px 22px rgba(16,24,40,.12)}
.mkf-secondary{background:#f4f7fb;color:#0b1f35;border:1px solid var(--mkf-input-border, #d7deea);box-shadow:none}
.mkf-secondary:hover{filter:brightness(.98);box-shadow: 0 10px 22px rgba(16,24,40,.10)}
.mkf-next{background:#0b1f35;color:#fff;box-shadow: 0 12px 26px rgba(11,31,53,.18)}
.mkf-next:hover{filter:brightness(1.05);box-shadow: 0 10px 22px rgba(16,24,40,.14)}
.mkf-small{padding:8px 10px;border-radius:12px;font-weight:600}
.mkf-danger{background:#b42318;color:#fff}
.mkf-result{margin-top:12px;font-weight:700}
.mkf-result.ok{color:#067647}
.mkf-result.err{color:#b42318}

.mkf-signature{display:flex;flex-direction:column;gap:10px}
.mkf-sig-canvas{width:100%;height:auto;border:1px dashed rgba(196,207,222,1);border-radius:14px;background: var(--mkf-input-bg, #fff);touch-action:none}
.mkf-sig-tools{display:flex;gap:10px}

.mkf-repeater-row{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.mkf-repeater-row .mkf-input{flex:1}

/* Responsive: on tablets allow max. 2 columns to avoid too narrow fields */
@media (max-width: 900px){
  .mkf-page.mkf-grid{gap:8px}
  .mkf-col-1,.mkf-col-2,.mkf-col-3,.mkf-col-4,.mkf-col-5{grid-column: span 6}
  .mkf-col-7,.mkf-col-8,.mkf-col-9,.mkf-col-10,.mkf-col-11{grid-column: span 12}
}

/* Responsive: collapse 2-column fields a bit earlier (small tablets) */
@media (max-width: 820px){
  .mkf-col-6{grid-column: span 12}
}

@media (max-width: 640px){
  /* Prevent horizontal overflow on mobile when the form is configured as full/wide/custom.
     On small screens we don't need the 100vw breakout, and it can introduce a few pixels
     of overflow (esp. iOS/Android address bar, scrollbars, safe areas). */
  .mkf-width-full,
  .mkf-width-wide,
  .mkf-width-custom{
    width:100%;
    margin-left:0;
    margin-right:0;
  }

  .mkf-wrap{padding:14px;margin:12px auto;max-width:100%}
  .mkf-actions{justify-content:stretch}
  .mkf-btn{width:100%;justify-content:center}
  .mkf-field-wrap{grid-column: span 12 !important}
}

/* Extra safeguard: never allow the public form wrapper to exceed the viewport width */
.mkf-outer,
.mkf-wrap{max-width:100%}

.mkf-locker{max-width:520px;margin:18px auto;padding:14px;background: var(--mkf-bg, #fff);border:1px solid var(--mkf-card-border, #e4e8ef);border-radius:18px}
.mkf-locker input{width:100%;padding:12px;border-radius:12px;border:1px solid var(--mkf-input-border, #d7deea);margin-top:6px;background: var(--mkf-input-bg, #fff)}
.mkf-locker button{margin-top:10px;border:0;border-radius:14px;padding:12px 14px;background: var(--mkf-accent, #2271b1);color:#fff;font-weight:700;cursor:pointer}
.mkf-locked{max-width:520px;margin:18px auto;padding:14px;border:1px solid var(--mkf-card-border, #e4e8ef);border-radius:18px;background: var(--mkf-bg, #fff)}

.mkf-progress{display:flex;gap:8px;align-items:center;margin-left:auto}
.mkf-dot{width:12px;height:12px;border-radius:999px;background:rgba(215,222,234,1);display:inline-block;box-shadow: inset 0 0 0 1px rgba(11,31,53,.08)}
.mkf-dot.is-active{background: var(--mkf-accent, #2271b1);box-shadow: 0 0 0 3px var(--mkf-accent-soft)}

/* 12-col layout helpers (Breite pro Feld) */
.mkf-col-12{grid-column: span 12}
.mkf-col-11{grid-column: span 11}
.mkf-col-10{grid-column: span 10}
.mkf-col-9{grid-column: span 9}
.mkf-col-8{grid-column: span 8}
.mkf-col-7{grid-column: span 7}
.mkf-col-6{grid-column: span 6}
.mkf-col-5{grid-column: span 5}
.mkf-col-4{grid-column: span 4}
.mkf-col-3{grid-column: span 3}
.mkf-col-2{grid-column: span 2}
.mkf-col-1{grid-column: span 1}


/* Honeypot: hidden from humans */
.mkf-hp-wrap{
  position:absolute !important;
  left:-9999px !important;
  top:auto !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

/* reCAPTCHA spacing */
.mkf-recaptcha{
  margin: 14px 0 10px 0;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .mkf-field-wrap,
  .mkf-btn,
  .mkf-input{transition:none !important}
  .mkf-field-wrap:hover{transform:none}
}

/* Submit button hover fill animation (per form via data-submit-fill="1") */
.mkf-wrap[data-submit-fill="1"] .mkf-primary{
  position:relative;
  overflow:hidden;
  background: var(--mkf-submit-bg, var(--mkf-accent, #2271b1));
  color: var(--mkf-submit-text, #ffffff);
}
.mkf-wrap[data-submit-fill="1"] .mkf-primary:hover{
  filter:none;
  color: var(--mkf-submit-hover-text, #ffffff);
}
.mkf-wrap[data-submit-fill="1"] .mkf-primary::before{
  content:"";
  position:absolute;
  inset:0;
  background: var(--mkf-submit-hover-bg, #0b1f35);
  transform: scaleX(0);
  transform-origin: var(--mkf-submit-origin, left);
  transition: transform var(--mkf-submit-dur, 320ms) cubic-bezier(.2,.8,.2,1);
  z-index:0;
}
.mkf-wrap[data-submit-fill="1"] .mkf-primary:hover::before,
.mkf-wrap[data-submit-fill="1"] .mkf-primary:focus-visible::before{
  transform: scaleX(1);
}
.mkf-wrap[data-submit-fill="1"] .mkf-primary .mkf-btn-label{
  position:relative;
  z-index:1;
}
.mkf-wrap[data-submit-fill="1"] .mkf-primary:focus-visible{
  outline:none;
  box-shadow: 0 0 0 3px var(--mkf-accent-soft), 0 10px 22px rgba(16,24,40,.12);
}

@media (prefers-reduced-motion: reduce){
  .mkf-wrap[data-submit-fill="1"] .mkf-primary::before{transition:none !important}
}

/* ---------------------------------------------------------
   Telephone country selector (intl-tel-input)
   - shows flag + dial code (default: DE +49)
--------------------------------------------------------- */
.mkf-wrap .iti{width:100%;display:block}
.mkf-wrap .iti input[type="tel"].mkf-input{padding-left:90px}
.mkf-wrap .iti__selected-country,
.mkf-wrap .iti__selected-country-container{border-radius:14px 0 0 14px}
/* Match dial code typography to input */
.mkf-wrap .iti__selected-country{font-family:inherit;font-size:var(--mkf-input-fs, 15px);line-height:1.2;color:inherit}
.mkf-wrap .iti__selected-dial-code{font-family:inherit;font-size:var(--mkf-input-fs, 15px);line-height:1.2;color:inherit}
.mkf-wrap .iti__country-list{z-index:99999}



/* ---------------------------------------------------------
   High-End Look: transparent wrapper + underline inputs
--------------------------------------------------------- */
.mkf-wrap.mkf-ui-transparent{
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  padding: 8px 0;
}
.mkf-wrap.mkf-ui-transparent .mkf-head{
  margin-bottom: 10px;
}
.mkf-wrap.mkf-ui-transparent .mkf-title{
  font-size: clamp(24px, 3vw, 34px);
  letter-spacing: -.02em;
}

.mkf-wrap.mkf-ui-underline{
  --mkf-input-border-strong: rgba(11,31,53,.18);
  --mkf-input-border-hover: rgba(11,31,53,.32);
}
.mkf-wrap.mkf-ui-underline .mkf-page.mkf-grid{
  gap: 22px 18px;
}
.mkf-wrap.mkf-ui-underline .mkf-label{
  margin-bottom: 10px;
  letter-spacing: .08em;
  color: color-mix(in srgb, var(--mkf-text, #0b1f35) 62%, white 38%);
}
.mkf-wrap.mkf-ui-underline .mkf-field-wrap{
  padding-top: 4px;
}
.mkf-wrap.mkf-ui-underline .mkf-input,
.mkf-wrap.mkf-ui-underline .mkf-locker input{
  padding: 12px 0 14px;
  border: 0;
  border-bottom: 1px solid var(--mkf-input-border-strong);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.mkf-wrap.mkf-ui-underline textarea.mkf-input{
  min-height: 92px;
  resize: vertical;
}
.mkf-wrap.mkf-ui-underline .mkf-input:hover,
.mkf-wrap.mkf-ui-underline .mkf-locker input:hover{
  border-color: transparent;
  border-bottom-color: var(--mkf-input-border-hover);
}
.mkf-wrap.mkf-ui-underline .mkf-input:focus,
.mkf-wrap.mkf-ui-underline .mkf-locker input:focus{
  border-color: transparent;
  border-bottom-color: var(--mkf-accent, #2271b1);
  box-shadow: 0 10px 20px -18px rgba(11,31,53,.45);
}
.mkf-wrap.mkf-ui-underline .mkf-input::placeholder{
  color: rgba(11,31,53,.36);
}
.mkf-wrap.mkf-ui-underline .mkf-required{
  top: 4px;
}
.mkf-wrap.mkf-ui-underline .mkf-actions{
  margin-top: 28px;
}
.mkf-wrap.mkf-ui-underline .mkf-btn{
  border-radius: 999px;
  padding: 14px 24px;
}
.mkf-wrap.mkf-ui-underline .mkf-secondary{
  background: rgba(255,255,255,.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.mkf-wrap.mkf-ui-underline .iti input[type="tel"].mkf-input{
  padding-left: 72px;
}
.mkf-wrap.mkf-ui-underline .iti__selected-country,
.mkf-wrap.mkf-ui-underline .iti__selected-country-container{
  border-radius: 0;
  background: transparent;
}
.mkf-wrap.mkf-ui-underline .iti__selected-country{
  height: calc(100% - 1px);
}
.mkf-wrap.mkf-ui-underline .mkf-consent-box{
  padding-top: 6px;
}
.mkf-wrap.mkf-ui-underline .mkf-hint{
  margin-left: 30px;
}

@supports not (color: color-mix(in srgb, black 50%, white 50%)){
  .mkf-wrap.mkf-ui-underline .mkf-label{color: var(--mkf-muted)}
}

@media (max-width: 640px){
  .mkf-wrap.mkf-ui-transparent{padding: 0}
  .mkf-wrap.mkf-ui-underline .mkf-page.mkf-grid{gap: 18px}
}

/* ---------------------------------------------------------
   Patch 1.0.21: kompakter Abstand + Premium-Datenschutzzeile
   - ca. 15% weniger vertikaler Abstand
   - kleinere Datenschutz-Schrift wie Feldlabels
   - animierte Checkbox + Link-Unterstreichung
   - Absenden-Button neben Datenschutz auf der letzten Seite
--------------------------------------------------------- */
.mkf-wrap{
  margin:14px auto;
  padding:19px;
}
.mkf-form{margin-top:12px}
.mkf-page.mkf-grid{gap:14px}
.mkf-label{margin-bottom:7px}
.mkf-input{padding:12px 12px}
.mkf-actions{margin-top:15px}
.mkf-recaptcha{margin:12px 0 8px 0}
.mkf-error{margin-top:7px}

.mkf-wrap.mkf-ui-underline .mkf-page.mkf-grid{
  gap:19px 15px;
}
.mkf-wrap.mkf-ui-underline .mkf-label{
  margin-bottom:8px;
}
.mkf-wrap.mkf-ui-underline .mkf-field-wrap{
  padding-top:3px;
}
.mkf-wrap.mkf-ui-underline .mkf-input,
.mkf-wrap.mkf-ui-underline .mkf-locker input{
  padding:10px 0 12px;
}
.mkf-wrap.mkf-ui-underline textarea.mkf-input{
  min-height:78px;
}
.mkf-wrap.mkf-ui-underline .mkf-actions{
  margin-top:24px;
}
.mkf-wrap.mkf-ui-underline .mkf-consent-box{
  padding-top:4px;
}

.mkf-consent-box{
  gap:4px;
}
.mkf-consent{
  position:relative;
  align-items:flex-start;
  gap:10px;
}
.mkf-consent input[type="checkbox"]{
  appearance:none;
  -webkit-appearance:none;
  flex:0 0 auto;
  width:15px;
  height:15px;
  margin:1px 0 0 0;
  border:1.35px solid color-mix(in srgb, var(--mkf-text, #0b1f35) 28%, white 72%);
  border-radius:4px;
  background:rgba(255,255,255,.42);
  box-shadow:0 1px 2px rgba(11,31,53,.06), inset 0 0 0 2px rgba(255,255,255,.22);
  display:inline-grid;
  place-items:center;
  cursor:pointer;
  transition:background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.mkf-consent input[type="checkbox"]::after{
  content:"";
  width:4px;
  height:8px;
  border:solid #fff;
  border-width:0 2px 2px 0;
  transform:rotate(45deg) scale(.3);
  opacity:0;
  transition:transform .2s cubic-bezier(.2,.9,.2,1.35), opacity .16s ease;
}
.mkf-consent input[type="checkbox"]:hover{
  border-color:var(--mkf-accent, #2271b1);
  box-shadow:0 0 0 3px var(--mkf-accent-soft), inset 0 0 0 2px rgba(255,255,255,.22);
}
.mkf-consent input[type="checkbox"]:focus-visible{
  outline:none;
  border-color:var(--mkf-accent, #2271b1);
  box-shadow:0 0 0 3px var(--mkf-accent-soft), inset 0 0 0 2px rgba(255,255,255,.22);
}
.mkf-consent input[type="checkbox"]:checked{
  background:var(--mkf-accent, #2271b1);
  border-color:var(--mkf-accent, #2271b1);
  transform:translateY(-1px);
}
.mkf-consent input[type="checkbox"]:checked::after{
  opacity:1;
  transform:rotate(45deg) scale(1);
}
.mkf-consent-text{
  font-size:12px;
  line-height:1.35;
  letter-spacing:.055em;
  font-weight:700;
  color:var(--mkf-muted);
}
.mkf-consent-text a{
  position:relative;
  color:var(--mkf-accent, #2271b1);
  text-decoration:none;
  text-underline-offset:3px;
}
.mkf-consent-text a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-2px;
  height:1px;
  background:currentColor;
  transform:scaleX(.55);
  transform-origin:left;
  opacity:.65;
  transition:transform .18s ease, opacity .18s ease;
}
.mkf-consent:hover .mkf-consent-text a::after,
.mkf-consent-text a:hover::after,
.mkf-consent-text a:focus-visible::after{
  transform:scaleX(1);
  opacity:1;
}
.mkf-hint{
  margin-left:25px;
  font-size:11px;
  line-height:1.35;
}
.mkf-wrap.mkf-ui-underline .mkf-hint{
  margin-left:25px;
}

.mkf-consent-inline-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  column-gap:14px;
  row-gap:6px;
}
.mkf-consent-inline-row .mkf-consent-box{
  grid-column:1;
  min-width:0;
}
.mkf-consent-inline-row .mkf-inline-submit-slot{
  grid-column:2;
  grid-row:1;
  align-self:center;
  justify-self:end;
}
.mkf-consent-inline-row .mkf-error{
  grid-column:1 / -1;
}
.mkf-consent-inline-row .mkf-actions{
  margin-top:0 !important;
  justify-content:flex-start;
  flex-wrap:nowrap;
}
.mkf-consent-inline-row .mkf-btn{
  white-space:nowrap;
}

@supports not (color: color-mix(in srgb, black 50%, white 50%)){
  .mkf-consent input[type="checkbox"]{border-color:rgba(11,31,53,.28)}
}

@media (max-width: 640px){
  .mkf-wrap{padding:12px;margin:10px auto}
  .mkf-page.mkf-grid{gap:12px}
  .mkf-wrap.mkf-ui-underline .mkf-page.mkf-grid{gap:15px}
  .mkf-consent-inline-row{
    grid-template-columns:1fr;
    align-items:start;
  }
  .mkf-consent-inline-row .mkf-inline-submit-slot{
    grid-column:1;
    grid-row:auto;
    width:100%;
    justify-self:stretch;
  }
  .mkf-consent-inline-row .mkf-actions{
    width:100%;
  }
}

@media (prefers-reduced-motion: reduce){
  .mkf-consent input[type="checkbox"],
  .mkf-consent input[type="checkbox"]::after,
  .mkf-consent-text a::after{
    transition:none !important;
  }
}


/* ---------------------------------------------------------
   Patch 1.0.22: Desktop/Mobile-Feinschliff Datenschutz + Absenden
   - Desktop: Datenschutz und Absenden sauber in einer Linie
   - Mobile: Datenschutz untereinander, Button vollbreit darunter
   - weichere Fokus-/Hover-Animationen ohne Layout-Sprung
--------------------------------------------------------- */
.mkf-consent-inline-row{
  column-gap:18px;
  row-gap:8px;
  margin-top:-1px;
}
.mkf-consent-inline-row .mkf-consent-box{
  align-self:center;
}
.mkf-consent-inline-row .mkf-inline-submit-slot{
  display:flex;
  align-items:center;
}
.mkf-consent-inline-row .mkf-inline-submit-slot .mkf-actions{
  align-items:center;
}
.mkf-consent-inline-row .mkf-inline-submit-slot .mkf-primary{
  min-width:132px;
  min-height:44px;
  animation:mkfSubmitSoftIn .26s cubic-bezier(.2,.8,.2,1) both;
}
.mkf-consent-inline-row .mkf-consent-box:focus-within .mkf-consent-text,
.mkf-consent-inline-row .mkf-consent:hover .mkf-consent-text{
  color:color-mix(in srgb, var(--mkf-text, #0b1f35) 72%, white 28%);
}
.mkf-wrap.mkf-ui-underline .mkf-consent-inline-row{
  padding-top:1px;
}

@keyframes mkfSubmitSoftIn{
  from{opacity:0;transform:translateX(8px) scale(.98)}
  to{opacity:1;transform:translateX(0) scale(1)}
}

@media (min-width: 641px){
  .mkf-consent-inline-row{
    grid-template-columns:minmax(320px, 1fr) max-content;
  }
  .mkf-consent-inline-row .mkf-consent-text{
    max-width:100%;
  }
  .mkf-consent-inline-row .mkf-inline-submit-slot .mkf-btn{
    width:auto;
  }
}

@media (max-width: 640px){
  .mkf-consent-inline-row{
    grid-template-columns:1fr !important;
    row-gap:10px;
    margin-top:0;
  }
  .mkf-consent-inline-row .mkf-consent-box{
    align-self:stretch;
  }
  .mkf-consent-inline-row .mkf-inline-submit-slot{
    grid-column:1 !important;
    grid-row:auto !important;
    width:100%;
    justify-self:stretch;
    margin-top:3px;
  }
  .mkf-consent-inline-row .mkf-actions{
    display:flex;
    width:100%;
    justify-content:stretch !important;
  }
  .mkf-consent-inline-row .mkf-inline-submit-slot .mkf-primary{
    width:100%;
    min-height:48px;
    min-width:0;
    justify-content:center;
    animation:mkfSubmitSoftInMobile .24s cubic-bezier(.2,.8,.2,1) both;
  }
  .mkf-consent{
    gap:9px;
  }
  .mkf-consent input[type="checkbox"]{
    width:14px;
    height:14px;
    margin-top:2px;
  }
  .mkf-consent-text{
    font-size:11px;
    line-height:1.38;
    letter-spacing:.045em;
  }
  .mkf-hint,
  .mkf-wrap.mkf-ui-underline .mkf-hint{
    margin-left:23px;
    font-size:10.5px;
    line-height:1.35;
  }
}

@media (max-width: 390px){
  .mkf-consent-text{
    font-size:10.5px;
    letter-spacing:.035em;
  }
  .mkf-hint,
  .mkf-wrap.mkf-ui-underline .mkf-hint{
    font-size:10px;
  }
  .mkf-wrap.mkf-ui-underline .mkf-btn,
  .mkf-btn{
    padding-left:16px;
    padding-right:16px;
  }
}

@keyframes mkfSubmitSoftInMobile{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:translateY(0)}
}

@supports not (color: color-mix(in srgb, black 50%, white 50%)){
  .mkf-consent-inline-row .mkf-consent-box:focus-within .mkf-consent-text,
  .mkf-consent-inline-row .mkf-consent:hover .mkf-consent-text{color:var(--mkf-muted)}
}

@media (prefers-reduced-motion: reduce){
  .mkf-consent-inline-row .mkf-inline-submit-slot .mkf-primary{animation:none !important}
}


/* ---------------------------------------------------------
   Patch 1.0.23: Tablet Portrait Datenschutz / Absenden
   - Tablet Hochformat: Absenden unter Datenschutzerklärung
   - Desktop bleibt nebeneinander
   - Mobile bleibt vollbreit darunter
--------------------------------------------------------- */
@media (min-width: 641px) and (max-width: 1024px) and (orientation: portrait){
  .mkf-consent-inline-row{
    grid-template-columns:1fr !important;
    align-items:start;
    row-gap:10px;
  }
  .mkf-consent-inline-row .mkf-consent-box{
    grid-column:1;
    align-self:stretch;
  }
  .mkf-consent-inline-row .mkf-inline-submit-slot{
    grid-column:1 !important;
    grid-row:auto !important;
    width:100%;
    justify-self:start;
    margin-top:2px;
  }
  .mkf-consent-inline-row .mkf-actions{
    width:100%;
    justify-content:flex-start !important;
    flex-wrap:nowrap;
  }
  .mkf-consent-inline-row .mkf-inline-submit-slot .mkf-primary{
    min-width:160px;
  }
}