/*
Theme Name: MP Metalldesign Konfigurator
Theme URI: https://cbj-productions.de/themes/mp-metalldesign
Author: CBJ – Productions
Author URI: https://cbj-productions.de
Description: Ruhiges, modernes WordPress-Theme für MP Metalldesign mit eingebautem Preiskonfigurator. Installiert sich als eigenes Theme, überschreibt also keine ältere Fassung. Abschnitte und Optionen werden im Adminbereich gepflegt, die Konfiguration wandert samt Summe ins Anfrageformular. Ohne Page-Builder, ohne externe Schriften.
Version: 5.9.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mp-metalldesign
Tags: business, portfolio, custom-logo, custom-menu, editor-style, translation-ready, wide-blocks
*/

/*
Eigene Schriften: .woff2 nach /assets/fonts/ legen und entkommentieren.
Bewusst keine Google-Fonts-CDN.
@font-face{font-family:"MP Sans";src:url("assets/fonts/mp-sans-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"MP Sans";src:url("assets/fonts/mp-sans-medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"MP Sans";src:url("assets/fonts/mp-sans-semibold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
*/

/* -------------------------------------------------------------------------
   1. Tokens
   Fast alles ist unbunt. Der eine Farbton ist die Anlassfarbe, die Stahl beim
   Erwärmen annimmt – er markiert ausschließlich, was gerade gewählt ist.
   ----------------------------------------------------------------------- */
:root{
  --mp-ink:#16181b;
  --mp-ink-2:#575d63;
  --mp-ink-3:#8d9399;
  --mp-flaeche:#f4f5f6;
  --mp-flaeche-2:#eceef0;
  --mp-linie:#e2e4e7;
  --mp-linie-stark:#cdd1d5;
  --mp-weiss:#ffffff;
  --mp-blau:#33487c;
  --mp-blau-hell:#eef1f8;
  --mp-warn:#a8332a;

  --mp-font:"MP Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;

  --mp-t-mega:clamp(2.5rem,5.6vw,4.6rem);
  --mp-t-gross:clamp(1.75rem,3.2vw,2.7rem);
  --mp-t-mittel:clamp(1.25rem,1.9vw,1.6rem);
  --mp-t-body:1.0625rem;
  --mp-t-klein:0.9375rem;
  --mp-t-cap:0.8125rem;

  --mp-wrap:1240px;
  --mp-gut:clamp(1.15rem,3.5vw,2.5rem);
  --mp-abstand:clamp(4rem,9vw,8rem);
  --mp-head-h:66px;
  --mp-logo-h:32px;
  --mp-rund:10px;
  --mp-rund-klein:7px;
}

/* -------------------------------------------------------------------------
   2. Basis
   ----------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;
  background:var(--mp-weiss);
  color:var(--mp-ink);
  font-family:var(--mp-font);
  font-size:var(--mp-t-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%;height:auto;display:block}
figure{margin:0}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--mp-blau);outline-offset:2px}

h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-0.022em;line-height:1.1;text-wrap:balance}
h1{font-size:var(--mp-t-mega);letter-spacing:-0.03em;line-height:1.05}
h2{font-size:var(--mp-t-gross);letter-spacing:-0.026em}
h3{font-size:var(--mp-t-mittel)}
h4{font-size:1.0625rem}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}

.mp-skip{position:absolute;left:-9999px;top:0;z-index:999;background:var(--mp-ink);color:var(--mp-weiss);padding:.8rem 1.2rem;border-radius:0 0 var(--mp-rund) 0}
.mp-skip:focus{left:0}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

.mp-wrap{width:100%;max-width:var(--mp-wrap);margin-inline:auto;padding-inline:var(--mp-gut)}
.mp-text{color:var(--mp-ink-2);max-width:56ch}
.mp-text-eng{max-width:44ch}
.mp-zahl{font-variant-numeric:tabular-nums}
.mp-cap{font-size:var(--mp-t-cap);color:var(--mp-ink-3)}

/* -------------------------------------------------------------------------
   3. Sektionen
   ----------------------------------------------------------------------- */
.mp-sek{padding-block:var(--mp-abstand)}
.mp-sek--knapp{padding-block:calc(var(--mp-abstand) * .55)}
.mp-sek--flaeche{background:var(--mp-flaeche)}
.mp-sek--dunkel{background:var(--mp-ink);color:#e9eaec}
.mp-sek--dunkel .mp-text{color:#a3a9b0}

.mp-kopf{margin-bottom:clamp(2rem,4vw,3.5rem);max-width:var(--mp-wrap)}
.mp-kopf__zeile{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(1rem,3vw,3rem);align-items:end}
@media (max-width:880px){.mp-kopf__zeile{grid-template-columns:1fr;align-items:start;gap:.9rem}}

/* -------------------------------------------------------------------------
   4. Kopfzeile
   ----------------------------------------------------------------------- */
.mp-head{position:sticky;top:0;z-index:70;background:rgba(255,255,255,.9);backdrop-filter:saturate(150%) blur(10px);border-bottom:1px solid var(--mp-linie)}
.mp-head__inner{min-height:var(--mp-head-h);display:flex;align-items:center;gap:1.4rem}
.mp-marke{display:flex;align-items:center;gap:.6rem;margin-right:auto}
.mp-marke img,.mp-marke .custom-logo{max-height:var(--mp-logo-h);width:auto}
.mp-marke__mono{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:var(--mp-rund-klein);
  background:var(--mp-ink);color:var(--mp-weiss);
  font-size:.8125rem;font-weight:600;letter-spacing:-0.01em;flex:0 0 auto;
}
.mp-marke__wort{font-size:1rem;font-weight:600;letter-spacing:-0.015em;line-height:1.2}
.mp-marke__wort span{display:block;font-size:var(--mp-t-cap);font-weight:400;color:var(--mp-ink-3);letter-spacing:0}

.mp-nav ul{display:flex;align-items:center;gap:clamp(.8rem,1.8vw,1.6rem);list-style:none;margin:0;padding:0}
.mp-nav a{font-size:var(--mp-t-klein);color:var(--mp-ink-2);padding:.35rem .1rem;transition:color .15s ease}
.mp-nav a:hover,.mp-nav a:focus-visible{color:var(--mp-ink)}
.mp-nav .current-menu-item > a{color:var(--mp-ink);font-weight:500}
.mp-nav ul ul{display:none}

.mp-head__cta{display:inline-block;background:var(--mp-ink);color:var(--mp-weiss);font-weight:500;font-size:var(--mp-t-klein);padding:.55rem 1.05rem;border-radius:var(--mp-rund-klein);transition:opacity .15s ease}
.mp-head__cta:hover,.mp-head__cta:focus-visible{opacity:.85}
@media (max-width:560px){.mp-head__cta{padding:.5rem .8rem;font-size:var(--mp-t-cap)}}
@media (max-width:400px){.mp-marke__wort span{display:none}}

.mp-burger{display:none;border:1px solid var(--mp-linie-stark);background:transparent;width:40px;height:36px;padding:0;cursor:pointer;border-radius:var(--mp-rund-klein)}
.mp-burger span{display:block;width:15px;height:1.5px;background:var(--mp-ink);margin:3.5px auto;border-radius:2px}

@media (max-width:960px){
  .mp-burger{display:block}
  .mp-nav{position:absolute;left:0;right:0;top:100%;background:var(--mp-weiss);border-bottom:1px solid var(--mp-linie);max-height:0;overflow:hidden;visibility:hidden}
  .mp-nav[data-offen="true"]{max-height:75vh;overflow:auto;visibility:visible}
  .mp-nav ul{flex-direction:column;align-items:stretch;gap:0;padding:.3rem var(--mp-gut) 1.1rem}
  .mp-nav li + li{border-top:1px solid var(--mp-linie)}
  .mp-nav a{display:block;padding:.85rem 0;font-size:1.0625rem}
}

/* -------------------------------------------------------------------------
   5. Auftakt
   ----------------------------------------------------------------------- */
.mp-auftakt{padding-top:clamp(3rem,7vw,6rem);padding-bottom:clamp(2rem,4vw,3.5rem)}
.mp-auftakt__oben{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem);align-items:start;padding-bottom:clamp(1.5rem,3vw,2.5rem)}
@media (max-width:880px){.mp-auftakt__oben{grid-template-columns:1fr;align-items:start;gap:1.6rem}}
.mp-auftakt__lead{color:var(--mp-ink-2);max-width:40ch;font-size:1.0625rem}
/* Der Abstand gilt ab der Unterkante des Textblocks, nicht ab der höheren Spalte. */
.mp-auftakt__bild{--ar:24/9;margin-top:clamp(5rem,10vw,9rem)}
@media (max-width:760px){.mp-auftakt__bild{--ar:4/3}}

/* -------------------------------------------------------------------------
   6. Bildfelder
   ----------------------------------------------------------------------- */
.mp-figur{margin:0}
.mp-figur img,.mp-figur .mp-platz{width:100%;aspect-ratio:var(--ar,4/3);object-fit:cover;background:var(--mp-flaeche-2);border-radius:var(--mp-rund)}
.mp-platz{background:var(--mp-flaeche-2)}
.mp-figur figcaption{margin-top:.6rem;font-size:var(--mp-t-cap);color:var(--mp-ink-3)}
.mp-zoom{display:block;width:100%;border:0;padding:0;background:none;cursor:zoom-in;border-radius:var(--mp-rund)}
.mp-zoom img{transition:opacity .15s ease}
.mp-zoom:hover img{opacity:.92}

/* -------------------------------------------------------------------------
   7. Knöpfe
   ----------------------------------------------------------------------- */
.mp-knopf{
  display:inline-block;font-family:inherit;font-weight:500;font-size:var(--mp-t-klein);
  padding:.8rem 1.5rem;border:1px solid transparent;border-radius:var(--mp-rund-klein);cursor:pointer;
  background:var(--mp-ink);color:var(--mp-weiss);
  transition:opacity .15s ease,background .15s ease,color .15s ease;
}
.mp-knopf:hover,.mp-knopf:focus-visible{opacity:.86}
.mp-knopf--linie{background:transparent;color:var(--mp-ink);border-color:var(--mp-linie-stark)}
.mp-knopf--linie:hover,.mp-knopf--linie:focus-visible{opacity:1;background:var(--mp-flaeche);border-color:var(--mp-linie-stark)}
.mp-sek--dunkel .mp-knopf{background:var(--mp-weiss);color:var(--mp-ink)}
.mp-sek--dunkel .mp-knopf--linie{background:transparent;color:#e9eaec;border-color:#3a3f45}
.mp-knopf-reihe{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.6rem 0 0}
.mp-link{font-weight:500;font-size:var(--mp-t-klein);color:var(--mp-blau);box-shadow:inset 0 -1px 0 rgba(51,72,124,.35);padding-bottom:1px}
.mp-link:hover,.mp-link:focus-visible{box-shadow:inset 0 -1px 0 var(--mp-blau)}

/* -------------------------------------------------------------------------
   8. Konfigurator
   ----------------------------------------------------------------------- */
.mp-konf{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(1.5rem,3.5vw,3.5rem);align-items:start}
@media (max-width:1000px){.mp-konf{grid-template-columns:1fr}}

/* Abschnitte klappen auf und zu; zugeklappt steht die Auswahl in der Zeile */
.mp-gruppen{display:grid;gap:.6rem}
.mp-gruppe{background:var(--mp-weiss);border:1px solid var(--mp-linie);border-radius:var(--mp-rund);overflow:hidden}
.mp-gruppe[open]{border-color:var(--mp-linie-stark)}
.mp-gruppe__kopf{
  display:flex;align-items:center;gap:.8rem;
  padding:.95rem 1.1rem;cursor:pointer;list-style:none;
}
.mp-gruppe__kopf::-webkit-details-marker{display:none}
.mp-gruppe__kopf:hover{background:var(--mp-flaeche)}
.mp-gruppe__nr{font-size:var(--mp-t-cap);color:var(--mp-ink-3);font-variant-numeric:tabular-nums;flex:0 0 auto}
.mp-gruppe__titel{display:flex;flex-direction:column;gap:.1rem;min-width:0;flex:1 1 auto}
.mp-gruppe__name{font-weight:600;letter-spacing:-0.015em}
.mp-gruppe__wahl{font-size:var(--mp-t-cap);color:var(--mp-ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mp-gruppe[open] .mp-gruppe__wahl{display:none}
.mp-gruppe__pfeil{flex:0 0 auto;width:9px;height:9px;border-right:1.5px solid var(--mp-ink-3);border-bottom:1.5px solid var(--mp-ink-3);transform:rotate(45deg) translate(-2px,-2px);transition:transform .18s ease}
.mp-gruppe[open] .mp-gruppe__pfeil{transform:rotate(225deg) translate(-2px,-2px)}
@media (prefers-reduced-motion:reduce){.mp-gruppe__pfeil{transition:none}}
.mp-gruppe__inhalt{padding:0 1.1rem 1.1rem}
.mp-gruppe__hinweis{font-size:var(--mp-t-cap);color:var(--mp-ink-3);margin:0 0 .8rem}

/* Optionen als ruhige Zeilen, nicht als Kachelraster */
.mp-optionen{display:grid;gap:.5rem}
.mp-opt{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;gap:.3rem .9rem;
  background:var(--mp-weiss);
  border:1px solid var(--mp-linie);
  border-radius:var(--mp-rund);
  padding:.85rem 1rem;cursor:pointer;
  transition:border-color .13s ease,background .13s ease;
}
.mp-opt:hover{border-color:var(--mp-linie-stark)}
.mp-opt input{margin:0;accent-color:var(--mp-blau);flex:0 0 auto;width:18px;height:18px}
.mp-opt.ist-gewaehlt{border-color:var(--mp-blau);background:var(--mp-blau-hell);box-shadow:inset 0 0 0 1px var(--mp-blau)}
.mp-gruppe .mp-opt{border-color:var(--mp-linie)}
.mp-opt__bild{grid-row:span 2;--ar:1/1;width:52px;flex:0 0 auto}
.mp-opt__bild img,.mp-opt__bild .mp-platz{border-radius:var(--mp-rund-klein)}
.mp-opt__name{font-weight:500;line-height:1.3}
.mp-opt__preis{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.mp-opt__info{grid-column:2;font-size:var(--mp-t-cap);color:var(--mp-ink-3);line-height:1.4}
.mp-opt__kenn{grid-column:2;font-size:var(--mp-t-cap);color:var(--mp-ink-3);font-variant-numeric:tabular-nums}
@media (max-width:520px){
  .mp-opt{grid-template-columns:auto minmax(0,1fr)}
  .mp-opt__preis{grid-column:2;text-align:left;margin-top:.2rem}
}

/* Datenblatt */
.mp-blatt{background:var(--mp-weiss);border:1px solid var(--mp-linie);border-radius:var(--mp-rund);position:sticky;top:calc(var(--mp-head-h) + 1.2rem);overflow:hidden}
@media (max-width:1000px){.mp-blatt{position:static}}
.mp-blatt__kopf{padding:1.05rem 1.2rem .8rem}
.mp-blatt__kopf h3{font-size:1.0625rem}
.mp-blatt__kopf span{display:block;font-size:var(--mp-t-cap);color:var(--mp-ink-3);margin-top:.15rem}
.mp-blatt__liste{list-style:none;margin:0;padding:0 1.2rem}
.mp-blatt__liste li{display:flex;justify-content:space-between;gap:.9rem;padding:.65rem 0;border-top:1px solid var(--mp-linie);font-size:var(--mp-t-klein);align-items:baseline}
.mp-blatt__pos{display:none}
.mp-blatt__wert{font-variant-numeric:tabular-nums;white-space:nowrap}
.mp-blatt__gruppe{display:block;font-size:var(--mp-t-cap);color:var(--mp-ink-3)}
.mp-blatt__leer{padding:1.2rem 0;color:var(--mp-ink-3);font-size:var(--mp-t-klein);border-top:1px solid var(--mp-linie)}
.mp-blatt__summe{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin:0;padding:1.05rem 1.2rem;background:var(--mp-flaeche);border-top:1px solid var(--mp-linie)}
.mp-blatt__summe span{font-size:var(--mp-t-klein);color:var(--mp-ink-2)}
.mp-blatt__summe strong{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:600;letter-spacing:-0.025em;font-variant-numeric:tabular-nums;line-height:1}
.mp-blatt__fuss{padding:1.05rem 1.2rem 1.2rem}
.mp-blatt__fuss .mp-knopf{width:100%;text-align:center}
.mp-blatt__hinweis{margin:.75rem 0 0;font-size:var(--mp-t-cap);color:var(--mp-ink-3);line-height:1.45}
.mp-blatt__fehlt{margin:.75rem 0 0;font-size:var(--mp-t-cap);color:var(--mp-warn);line-height:1.45}

/* Feste Preisleiste, solange der Konfigurator sichtbar ist */
.mp-leiste{
  position:fixed;left:0;right:0;bottom:0;z-index:80;
  display:none;align-items:center;justify-content:space-between;gap:1rem;
  padding:.7rem var(--mp-gut) calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.94);backdrop-filter:saturate(150%) blur(10px);
  border-top:1px solid var(--mp-linie);
  box-shadow:0 -6px 20px rgba(22,24,27,.06);
}
.mp-leiste[data-sichtbar="true"]{display:flex}
@media (min-width:1001px){.mp-leiste{display:none!important}}
.mp-leiste__preis{display:flex;flex-direction:column;line-height:1.2}
.mp-leiste__preis span{font-size:var(--mp-t-cap);color:var(--mp-ink-3)}
.mp-leiste__preis strong{font-size:1.375rem;font-weight:600;letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.mp-leiste .mp-knopf{white-space:nowrap}

.mp-noscript{background:var(--mp-blau-hell);border:1px solid var(--mp-linie);border-radius:var(--mp-rund);padding:.85rem 1rem;font-size:var(--mp-t-klein);margin-bottom:1.4rem}

.mp-uebernahme{border:1px solid var(--mp-linie);background:var(--mp-flaeche);border-radius:var(--mp-rund);padding:.85rem 1rem;margin-bottom:1.1rem;font-size:var(--mp-t-klein);white-space:pre-line;max-height:14rem;overflow:auto;color:var(--mp-ink-2)}
.mp-uebernahme:empty{display:none}
[data-konfig-block][hidden]{display:none}

/* -------------------------------------------------------------------------
   8b. Leistungen
   ----------------------------------------------------------------------- */
.mp-leistungen{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(1.5rem,3vw,2.5rem)}
.mp-leistung{border-top:1px solid var(--mp-ink);padding-top:1rem}
.mp-leistung h3{font-size:1.125rem;margin-bottom:.5rem}
.mp-leistung p{margin:0;font-size:var(--mp-t-klein);line-height:1.6;color:var(--mp-ink-2)}

/* -------------------------------------------------------------------------
   9. Arbeiten
   ----------------------------------------------------------------------- */
/* Galerie: Spalten statt Raster, damit beliebig viele Bilder in beliebigen
   Formaten zusammenpassen, ohne dass etwas beschnitten wird. */
.mp-galerie{columns:3;column-gap:clamp(.6rem,1.2vw,1rem)}
@media (max-width:900px){.mp-galerie{columns:2}}
@media (max-width:560px){.mp-galerie{columns:1}}
.mp-galerie .mp-figur{break-inside:avoid;margin:0 0 clamp(.6rem,1.2vw,1rem)}
.mp-galerie .mp-figur img{aspect-ratio:auto;object-fit:contain;height:auto}
.mp-galerie .mp-platz{aspect-ratio:4/5}
.mp-galerie .mp-zoom{line-height:0}

/* -------------------------------------------------------------------------
   10. Fertigung
   ----------------------------------------------------------------------- */
.mp-schritte{list-style:none;margin:0;padding:0;counter-reset:mp-s}
.mp-schritt{counter-increment:mp-s;display:grid;grid-template-columns:2.6rem minmax(0,1fr) minmax(0,1.9fr);gap:clamp(.7rem,2.2vw,2.2rem);padding:1.5rem 0;border-top:1px solid #2b2f34;align-items:baseline}
.mp-schritt:last-child{border-bottom:1px solid #2b2f34}
.mp-schritt::before{content:counter(mp-s,decimal-leading-zero);font-size:var(--mp-t-cap);color:#7f868d;font-variant-numeric:tabular-nums}
.mp-schritt h3{font-size:1.125rem}
.mp-schritt p{margin:0;font-size:1rem;line-height:1.65;color:#a3a9b0}
@media (max-width:820px){.mp-schritt{grid-template-columns:2.2rem minmax(0,1fr)}.mp-schritt p{grid-column:2}}

/* -------------------------------------------------------------------------
   11. Datenlisten
   ----------------------------------------------------------------------- */
.mp-daten{list-style:none;margin:1.1rem 0 0;padding:0;font-size:var(--mp-t-klein);font-variant-numeric:tabular-nums}
.mp-daten li{display:flex;justify-content:space-between;gap:1rem;padding:.65rem 0;border-top:1px solid var(--mp-linie)}
.mp-daten li span:first-child{color:var(--mp-ink-3)}
.mp-sek--dunkel .mp-daten li{border-top-color:#2b2f34}
.mp-sek--dunkel .mp-daten li span:first-child{color:#7f868d}

.mp-tabelle{width:100%;border-collapse:collapse;font-size:var(--mp-t-klein);font-variant-numeric:tabular-nums}
.mp-tabelle th,.mp-tabelle td{text-align:left;padding:.7rem 1rem .7rem 0;border-bottom:1px solid var(--mp-linie);font-weight:400}
.mp-tabelle thead th{color:var(--mp-ink-3);font-size:var(--mp-t-cap)}
.mp-tabelle-huelle{overflow-x:auto}

/* -------------------------------------------------------------------------
   12. Stimmen
   ----------------------------------------------------------------------- */
.mp-stimmen{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:clamp(1.2rem,2.5vw,2rem)}
.mp-stimme{background:var(--mp-weiss);border:1px solid var(--mp-linie);border-radius:var(--mp-rund);padding:1.3rem}
.mp-stimme blockquote{margin:0;font-size:1.0625rem;line-height:1.55;text-wrap:pretty}
.mp-stimme figcaption{margin-top:.9rem;font-size:var(--mp-t-cap);color:var(--mp-ink-3)}

/* -------------------------------------------------------------------------
   13. Anfrage
   ----------------------------------------------------------------------- */
.mp-anfrage{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,5vw,4rem)}
@media (max-width:900px){.mp-anfrage{grid-template-columns:1fr}}
.mp-kontakt{list-style:none;margin:1.5rem 0 0;padding:0;font-size:var(--mp-t-klein)}
.mp-kontakt li{padding:.7rem 0;border-top:1px solid var(--mp-linie);display:flex;gap:1.2rem}
.mp-kontakt li span:first-child{flex:0 0 6.5rem;color:var(--mp-ink-3)}
.mp-kontakt a:hover{color:var(--mp-blau)}

.mp-formular{display:grid;gap:1rem}
.mp-feld{display:grid;gap:.35rem;margin:0}
.mp-feld label{font-size:var(--mp-t-cap);color:var(--mp-ink-2)}
.mp-feld input,.mp-feld select,.mp-feld textarea{
  font-family:inherit;font-size:1rem;padding:.75rem .85rem;
  background:var(--mp-weiss);border:1px solid var(--mp-linie-stark);border-radius:var(--mp-rund-klein);
  color:var(--mp-ink);width:100%;transition:border-color .13s ease;
}
.mp-feld input:focus,.mp-feld select:focus,.mp-feld textarea:focus{border-color:var(--mp-blau);outline:none;box-shadow:0 0 0 3px rgba(51,72,124,.12)}
.mp-feld textarea{min-height:130px;resize:vertical;line-height:1.5}
.mp-feld-paar{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:600px){.mp-feld-paar{grid-template-columns:1fr}}
.mp-honig{position:absolute;left:-9999px}
.mp-zustimmung{display:flex;gap:.65rem;align-items:flex-start;font-size:.9375rem;line-height:1.5;color:var(--mp-ink-2);margin:0}
.mp-zustimmung input{width:auto;margin-top:.28rem;flex:0 0 auto;accent-color:var(--mp-blau)}
.mp-absenden{margin:0}
.mp-hinweis{padding:.85rem 1rem;background:var(--mp-blau-hell);border:1px solid var(--mp-linie);border-radius:var(--mp-rund);font-size:1rem;margin:0 0 1.4rem}
.mp-hinweis--fehler{background:#fbeeed;border-color:#f0d3d0}

/* -------------------------------------------------------------------------
   13b. Contact Form 7
   Das Anfrageformular dieses Themes braucht kein Plugin. Wer Contact Form 7
   für ein anderes Formular auf einer Unterseite einsetzt, bekommt damit
   dieselbe Darstellung. Ohne das Plugin greift hier nichts.
   ----------------------------------------------------------------------- */
.wpcf7 .mp-feld br,
.wpcf7 .mp-zustimmung br,
.wpcf7 .mp-absenden br{display:none}
.wpcf7-form-control-wrap{display:block}
.wpcf7 .mp-feld label{display:block}

.wpcf7-form-control:not(.wpcf7-submit):not([type="checkbox"]):not([type="radio"]){
  font-family:inherit;font-size:1rem;padding:.75rem .85rem;
  background:var(--mp-weiss);border:1px solid var(--mp-linie-stark);border-radius:var(--mp-rund-klein);
  color:var(--mp-ink);width:100%;transition:border-color .13s ease;
}
.wpcf7-form-control:not(.wpcf7-submit):focus{border-color:var(--mp-blau);outline:none;box-shadow:0 0 0 3px rgba(51,72,124,.12)}
.wpcf7-textarea{min-height:130px;resize:vertical;line-height:1.5}

.wpcf7-submit{
  display:inline-block;font-family:inherit;font-weight:500;font-size:var(--mp-t-klein);
  padding:.8rem 1.5rem;border:1px solid transparent;border-radius:var(--mp-rund-klein);cursor:pointer;
  background:var(--mp-ink);color:var(--mp-weiss);width:auto;
  transition:opacity .15s ease;
}
.wpcf7-submit:hover{opacity:.86}

.wpcf7 .mp-zustimmung .wpcf7-form-control-wrap{display:inline;flex:0 0 auto}
.wpcf7 .mp-zustimmung .wpcf7-acceptance .wpcf7-list-item{margin:0}
.wpcf7 .mp-zustimmung input[type="checkbox"]{width:auto;margin:.28rem .65rem 0 0;accent-color:var(--mp-blau)}

.wpcf7 .mp-uebernahme:empty{display:none}
.wpcf7 .mp-uebernahme{display:block}

.wpcf7-not-valid-tip{color:var(--mp-warn);font-size:var(--mp-t-cap);margin-top:.3rem}
.wpcf7-form-control.wpcf7-not-valid{border-color:var(--mp-warn)}
.wpcf7-response-output{
  margin:1.2rem 0 0!important;padding:.85rem 1rem!important;
  border:1px solid var(--mp-linie)!important;border-radius:var(--mp-rund);
  background:var(--mp-flaeche);font-size:var(--mp-t-klein);
}
.wpcf7 form.sent .wpcf7-response-output{border-color:var(--mp-blau)!important;background:var(--mp-blau-hell)}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output{border-color:var(--mp-warn)!important;background:#fbeeed}
.wpcf7-spinner{margin-left:.6rem}

/* -------------------------------------------------------------------------
   14. Fußzeile
   ----------------------------------------------------------------------- */
.mp-fuss{background:var(--mp-ink);color:#9aa1a8;padding-block:clamp(3rem,6vw,4.5rem) 1.8rem}
.mp-fuss__raster{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(2,minmax(0,1fr));gap:clamp(1.6rem,4vw,3rem)}
@media (max-width:820px){.mp-fuss__raster{grid-template-columns:1fr;gap:1.8rem}}
.mp-fuss h4{color:var(--mp-weiss);margin:0 0 .8rem;font-size:var(--mp-t-klein);font-weight:500}
.mp-fuss ul{list-style:none;margin:0;padding:0;font-size:var(--mp-t-klein)}
.mp-fuss li{padding:.28rem 0}
.mp-fuss a:hover,.mp-fuss a:focus-visible{color:var(--mp-weiss)}
.mp-fuss__text{font-size:1rem;line-height:1.6;max-width:34ch}
.mp-fuss__marke{display:inline-flex;align-items:center;gap:.6rem;margin-bottom:1.1rem;color:var(--mp-weiss)}
.mp-fuss__marke .mp-marke__mono{background:var(--mp-weiss);color:var(--mp-ink)}
.mp-fuss__marke img{max-height:var(--mp-logo-h);width:auto;filter:brightness(0) invert(1);opacity:.92}
.mp-fuss__schluss{margin-top:clamp(2rem,4vw,3rem);padding-top:1.1rem;border-top:1px solid #2b2f34;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;font-size:var(--mp-t-cap);color:#6f767d}

/* -------------------------------------------------------------------------
   15. Großansicht
   ----------------------------------------------------------------------- */
.mp-lupe{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;background:rgba(22,24,27,.93);padding:clamp(1rem,4vw,3rem)}
.mp-lupe[data-offen="true"]{display:flex}
.mp-lupe img{max-width:100%;max-height:84vh;width:auto;object-fit:contain;border-radius:var(--mp-rund)}
.mp-lupe figcaption{margin-top:.9rem;font-size:var(--mp-t-cap);color:#9aa1a8;text-align:center}
.mp-lupe__zu{position:absolute;top:1rem;right:1rem;background:rgba(255,255,255,.12);border:0;color:#fff;width:42px;height:42px;font-size:1.2rem;cursor:pointer;line-height:1;border-radius:var(--mp-rund-klein)}
.mp-lupe__zu:hover{background:rgba(255,255,255,.22)}

/* -------------------------------------------------------------------------
   16. Inhaltsseiten
   ----------------------------------------------------------------------- */
.mp-seite{padding-block:clamp(3rem,6vw,5rem)}
.mp-seite__kopf{margin-bottom:clamp(1.8rem,3.5vw,2.8rem);padding-bottom:1.2rem;border-bottom:1px solid var(--mp-linie)}
.mp-seite__bild{--ar:16/9;margin-bottom:clamp(1.6rem,3vw,2.6rem)}
.mp-seite__meta{font-size:var(--mp-t-cap);color:var(--mp-ink-3);margin:.7rem 0 0}
.mp-inhalt{max-width:66ch}
.mp-inhalt > *{margin-bottom:1.2rem}
.mp-inhalt h2{margin-top:2.2rem;margin-bottom:.7rem}
.mp-inhalt h3{margin-top:1.7rem;margin-bottom:.5rem}
.mp-inhalt ul,.mp-inhalt ol{padding-left:1.2rem}
.mp-inhalt li{margin-bottom:.4rem}
.mp-inhalt a{color:var(--mp-blau);box-shadow:inset 0 -1px 0 rgba(51,72,124,.35)}
.mp-inhalt blockquote{margin:1.5rem 0;padding-left:1.1rem;border-left:2px solid var(--mp-linie-stark);color:var(--mp-ink-2)}
.mp-inhalt table{width:100%;border-collapse:collapse;font-size:var(--mp-t-klein)}
.mp-inhalt th,.mp-inhalt td{border-bottom:1px solid var(--mp-linie);padding:.6rem 0;text-align:left}
.mp-inhalt code{font-size:.9em;background:var(--mp-flaeche);padding:.15em .4em;border-radius:4px}

.mp-blaettern{display:flex;justify-content:space-between;gap:1.2rem;flex-wrap:wrap;margin-top:clamp(2.5rem,5vw,4rem);padding-top:1.1rem;border-top:1px solid var(--mp-linie);font-size:var(--mp-t-klein)}
.mp-liste{display:grid;gap:0}
.mp-liste__eintrag{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.6fr);gap:clamp(.8rem,3vw,2.5rem);padding:1.6rem 0;border-top:1px solid var(--mp-linie)}
.mp-liste__eintrag:last-child{border-bottom:1px solid var(--mp-linie)}
@media (max-width:760px){.mp-liste__eintrag{grid-template-columns:1fr;gap:.5rem}}
.mp-liste__datum{font-size:var(--mp-t-cap);color:var(--mp-ink-3);margin:0}
.mp-liste__eintrag h2{font-size:var(--mp-t-mittel);margin-bottom:.5rem}
.mp-leer{padding-block:clamp(4rem,10vw,8rem)}
.mp-leer h1{margin-bottom:1.1rem}

.alignleft{float:left;margin:.4rem 1.6rem 1.2rem 0}
.alignright{float:right;margin:.4rem 0 1.2rem 1.6rem}
.aligncenter{margin-inline:auto;display:block}
.wp-caption-text,.wp-element-caption{font-size:var(--mp-t-cap);color:var(--mp-ink-3);margin-top:.5rem}

[id]{scroll-margin-top:calc(var(--mp-head-h) + 16px)}

/* Seiten, die einen Kurzbefehl enthalten: Bereiche über die volle Breite */
.mp-hat-kurzbefehl .mp-inhalt{max-width:none}
.mp-hat-kurzbefehl .mp-inhalt > .mp-sek,
.mp-hat-kurzbefehl .mp-inhalt > .mp-auftakt{margin-inline:calc(var(--mp-gut) * -1)}

/* Die WordPress-Adminleiste schiebt die Seite nach unten */
.admin-bar .mp-head{top:32px}
@media (max-width:782px){.admin-bar .mp-head{top:46px}}

@media print{
  .mp-head,.mp-fuss,.mp-knopf,.mp-burger,.mp-lupe,.mp-optionen,.mp-leiste{display:none}
  body{background:#fff;color:#000}
  .mp-blatt{border:1px solid #000;position:static}
}