/* =========================================================
   Mängelmelder – Stylesheet
   ---------------------------------------------------------
   Farben und Schriften nach CI Die Linke 2023.
   Anpassungen nur hier oben in den Variablen vornehmen.
   ========================================================= */
:root {
  --mm-red:      #FF0000;   /* Die Linke Rot */
  --mm-plum:     #6F003C;   /* Dunkelrot */
  --mm-ink:      #1C1C1C;   /* Schwarz für Text und dunkle Flächen */
  --mm-sand:     #F4F1EE;   /* heller Hintergrund */
  --mm-line:     #E6E1DC;   /* Linien */
  --mm-field:    #BDB6AE;   /* Rahmen von Eingabefeldern */
  --mm-body:     #4A4A4A;   /* Fließtext grau */
  --mm-muted:    #5C5C5C;   /* Nebentext */
  --mm-on-dark:  #D9D4CF;   /* Text auf Schwarz */
  --mm-red-soft: #FDE8E9;   /* helle Hinweisflächen */
  --mm-ok:       #1F6B33;
  --mm-ok-bg:    #E3F3E6;
  --mm-warn:     #6B4200;
  --mm-warn-bg:  #FFF1D6;

  /* Typescale Digital: Überschriften Work Sans Black, Intro Work Sans Light, Text und Buttons Inter */
  --mm-font-head: 'Work Sans', 'Arial Black', sans-serif;
  --mm-font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --mm-max: 1200px;
  --mm-section: 128px;      /* Abstand oben/unten der Abschnitte */
}

/* ---------- Schriften (lokal, kein Google-Server) ---------- */
@font-face { font-family: 'Work Sans'; font-weight: 300; font-style: normal; font-display: swap; src: url('../fonts/worksans-light.woff2') format('woff2'); }
@font-face { font-family: 'Work Sans'; font-weight: 400; font-style: normal; font-display: swap; src: url('../fonts/worksans-regular.woff2') format('woff2'); }
@font-face { font-family: 'Work Sans'; font-weight: 900; font-style: normal; font-display: swap; src: url('../fonts/worksans-black.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 400; font-style: normal; font-display: swap; src: url('../fonts/inter-regular.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 400; font-style: italic; font-display: swap; src: url('../fonts/inter-italic.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 500 600; font-style: normal; font-display: swap; src: url('../fonts/inter-medium.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 700 800; font-style: normal; font-display: swap; src: url('../fonts/inter-bold.woff2') format('woff2'); }

/* ---------- Grundlagen ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; font-family: var(--mm-font-body); font-size: 16px; line-height: 1.55; color: var(--mm-ink); background: #fff; -webkit-font-smoothing: antialiased; }
body.mm-sand { background: var(--mm-sand); }
img, svg { max-width: 100%; }
a { color: var(--mm-plum); }
a:hover { color: var(--mm-red); }
:focus-visible { outline: 3px solid var(--mm-ink); outline-offset: 3px; }
.mm-wrap { max-width: var(--mm-max); margin: 0 auto; padding-left: 32px; padding-right: 32px; }
@media (max-width: 560px) { .mm-wrap { padding-left: 20px; padding-right: 20px; } :root { --mm-section: 80px; } }
.mm-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.mm-skip { position: absolute; left: 8px; top: -60px; background: var(--mm-ink); color: #fff; padding: 10px 14px; z-index: 10; border-radius: 4px; }
.mm-skip:focus { top: 8px; color: #fff; }

/* Typescale: H1 54/105 %, H2 42/110 %, H3 30/115 %, H4 24/120 %, H5 18/120 %, Intro Light 24/120 % */
.mm-h1, .mm-h2, .mm-h3 { font-family: var(--mm-font-head); font-weight: 900; margin: 0; letter-spacing: -0.5px; }
.mm-h1 { font-size: clamp(40px, 5vw, 54px); line-height: 1.08; }
.mm-h2 { font-size: clamp(32px, 4vw, 42px); line-height: 1.1; }
.mm-h3 { font-size: 30px; line-height: 1.15; }
.mm-intro { font-family: var(--mm-font-head); font-weight: 300; font-size: clamp(20px, 2.2vw, 24px); line-height: 1.25; color: var(--mm-body); max-width: 700px; margin: 24px 0 0; }

/* ---------- Buttons ---------- */
.mm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 22px; border: 2px solid transparent; border-radius: 4px; font-family: var(--mm-font-body); font-weight: 500; font-size: 15px; line-height: 1.2; text-decoration: none; cursor: pointer; background: var(--mm-red); color: #fff; }
.mm-btn:hover { background: var(--mm-plum); color: #fff; }
.mm-btn svg { width: 20px; height: 20px; flex: none; }
.mm-btn--dark { background: var(--mm-ink); }
.mm-btn--dark:hover { background: #000; }
.mm-btn--outline { background: transparent; color: var(--mm-ink); border-color: var(--mm-ink); }
.mm-btn--outline:hover { background: var(--mm-ink); color: #fff; }
.mm-btn--small { min-height: 40px; padding: 0 14px; font-size: 14px; }
.mm-btn--small svg { width: 16px; height: 16px; }
.mm-btn--big { min-height: 64px; padding: 0 30px; font-size: 18px; font-weight: 600; box-shadow: 6px 6px 0 var(--mm-ink); }
.mm-btn--big svg { width: 24px; height: 24px; }
.mm-btn--big:hover { transform: translate(-1px, -1px); box-shadow: 7px 7px 0 var(--mm-ink); }
.mm-btn--white { background: #fff; color: var(--mm-red); }
.mm-btn--white:hover { background: #fff; color: var(--mm-plum); }
.mm-btn--link { background: none; border: 0; color: inherit; text-decoration: underline; padding: 0 6px; min-height: 44px; }
.mm-btn--link:hover { background: none; color: inherit; text-decoration-thickness: 2px; }

/* ---------- Kopfzeile ---------- */
.mm-header { background: #fff; border-bottom: 1px solid var(--mm-line); }
.mm-header__in { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; padding-top: 20px; padding-bottom: 20px; }
.mm-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--mm-ink); }
.mm-brand:hover { color: var(--mm-ink); }
.mm-brand__tag { display: inline-block; background: var(--mm-red); color: #fff; font-family: var(--mm-font-head); font-weight: 900; font-size: 24px; line-height: 1; padding: 6px 10px 6px; transform: rotate(-3deg); }
.mm-brand__word { font-family: var(--mm-font-head); font-weight: 900; font-size: 24px; line-height: 1; }
.mm-brand__by { font-size: 13px; line-height: 1.3; color: var(--mm-muted); border-left: 1px solid #D6D0CA; padding-left: 12px; margin-left: 4px; }
.mm-brand__by strong { color: var(--mm-ink); }
.mm-nav { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.mm-nav a:not(.mm-btn) { color: var(--mm-ink); text-decoration: none; font-weight: 600; font-size: 15px; }
.mm-nav a:not(.mm-btn):hover { color: var(--mm-red); }
@media (max-width: 760px) { .mm-nav a:not(.mm-btn) { display: none; } }
@media (max-width: 440px) { .mm-brand__by { display: none; } }

/* ---------- Hero ---------- */
.mm-hero { background: var(--mm-red); color: #fff; overflow: hidden; }
.mm-hero__in { display: flex; flex-wrap: wrap; gap: 64px; align-items: center; padding-top: 112px; padding-bottom: 128px; }
.mm-hero__text { flex: 999 1 560px; min-width: 0; }
.mm-kicker { margin: 0 0 20px; font-weight: 700; font-size: 15px; letter-spacing: 1.5px; text-transform: uppercase; }
.mm-bar { display: inline-block; margin: 28px 0 0; background: var(--mm-plum); color: #fff; font-family: var(--mm-font-head); font-weight: 900; font-size: clamp(32px, 4vw, 42px); line-height: 1.1; padding: 10px 18px 10px; transform: rotate(-2deg); }
.mm-hero__intro { margin: 32px 0 0; max-width: 620px; font-family: var(--mm-font-head); font-weight: 300; font-size: clamp(20px, 2.2vw, 24px); line-height: 1.25; }
.mm-hero__cta { margin-top: 40px; display: flex; flex-wrap: wrap; gap: 16px 20px; align-items: center; }
.mm-hero__note { font-size: 15px; font-weight: 600; }
.mm-hero__tags { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.mm-tag { display: inline-block; font-family: var(--mm-font-head); font-weight: 900; font-size: 24px; line-height: 1.2; padding: 8px 16px; background: #fff; color: var(--mm-ink); }
.mm-tag:nth-child(even) { background: var(--mm-plum); color: #fff; }
.mm-tag:nth-child(1) { transform: rotate(-4deg); }
.mm-tag:nth-child(2) { transform: rotate(3deg); margin-left: 40px; }
.mm-tag:nth-child(3) { transform: rotate(-2deg); }
.mm-tag:nth-child(4) { transform: rotate(4deg); margin-left: 24px; }
.mm-tag:nth-child(5) { transform: rotate(-3deg); margin-left: 8px; }
@media (max-width: 760px) { .mm-hero__tags { display: none; } .mm-hero__in { padding-top: 64px; padding-bottom: 80px; } }

/* ---------- Abschnitte ---------- */
.mm-section { padding-top: var(--mm-section); padding-bottom: var(--mm-section); }
.mm-section--dark { background: var(--mm-ink); color: #fff; }
.mm-section--sand { background: var(--mm-sand); }
.mm-section--red { background: var(--mm-red); color: #fff; }
.mm-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; margin-top: 64px; }
.mm-card { background: var(--mm-sand); border-radius: 6px; padding: 32px 28px; display: flex; flex-direction: column; gap: 12px; }
.mm-card svg { width: 32px; height: 32px; color: var(--mm-red); }
.mm-card h3 { margin: 0; font-family: var(--mm-font-head); font-weight: 900; font-size: 18px; line-height: 1.2; }
.mm-card p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--mm-body); }
.mm-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 64px; margin-top: 72px; }
.mm-step { display: flex; flex-direction: column; gap: 12px; }
.mm-step__num { font-family: var(--mm-font-head); font-weight: 900; font-size: 54px; line-height: 1; color: var(--mm-red); }
.mm-step h3 { margin: 0; font-family: var(--mm-font-head); font-weight: 900; font-size: 24px; line-height: 1.2; }
.mm-step p { margin: 0; color: var(--mm-on-dark); }
.mm-split { display: flex; flex-wrap: wrap; gap: 72px; }
.mm-split > :first-child { flex: 1 1 380px; min-width: 0; }
.mm-split > :last-child { flex: 999 1 520px; min-width: 0; }
.mm-checks { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 16px; }
.mm-checks li { display: flex; gap: 14px; align-items: flex-start; background: #fff; border-radius: 6px; padding: 22px 24px; line-height: 1.5; }
.mm-checks svg { flex: none; width: 24px; height: 24px; color: var(--mm-plum); margin-top: 1px; }
.mm-boxes { display: flex; flex-wrap: wrap; gap: 32px; padding-top: 112px; padding-bottom: 112px; }
.mm-box { flex: 1 1 340px; min-width: 0; border: 2px solid var(--mm-ink); border-radius: 6px; padding: 32px; }
.mm-box h3 { margin: 0 0 10px; font-family: var(--mm-font-head); font-weight: 900; font-size: 18px; line-height: 1.2; }
.mm-box p { margin: 0; color: var(--mm-body); }
.mm-box p + p { margin-top: 16px; }
.mm-box a { font-weight: 700; }
.mm-cta { display: flex; flex-wrap: wrap; gap: 40px; align-items: center; justify-content: space-between; padding-top: 120px; padding-bottom: 120px; }
.mm-cta .mm-h2 { flex: 1 1 480px; font-size: clamp(38px, 4.6vw, 54px); }

/* ---------- Fußzeile ---------- */
.mm-footer { background: var(--mm-ink); color: var(--mm-on-dark); font-size: 14px; }
.mm-footer__in { display: flex; flex-wrap: wrap; gap: 24px 40px; justify-content: space-between; align-items: center; padding-top: 56px; padding-bottom: 56px; }
.mm-footer__org { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; color: var(--mm-on-dark); text-decoration: none; }
.mm-footer__org:hover { color: #fff; }
.mm-footer__org img { width: 150px; height: auto; display: block; }
.mm-footer nav { display: flex; gap: 24px; flex-wrap: wrap; }
.mm-footer a { color: #fff; }

/* ---------- Formular ---------- */
.mm-formpage { padding-top: 96px; padding-bottom: 128px; }
.mm-formgrid { display: flex; flex-wrap: wrap; gap: 48px; align-items: flex-start; margin-top: 64px; }
.mm-form { flex: 999 1 600px; min-width: 0; display: flex; flex-direction: column; gap: 32px; }
.mm-aside { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.mm-panel { margin: 0; border: 0; background: #fff; border-radius: 8px; padding: 44px 40px; display: flex; flex-direction: column; gap: 28px; min-width: 0; }
@media (max-width: 560px) { .mm-panel { padding: 28px 20px; } .mm-formpage { padding-top: 56px; } }
.mm-panel legend { float: left; width: 100%; padding: 0; margin: 0 0 4px; font-family: var(--mm-font-head); font-weight: 900; font-size: 30px; line-height: 1.15; }
.mm-panel legend small { font-family: var(--mm-font-body); font-size: 16px; font-weight: 600; color: var(--mm-muted); }
.mm-panel legend + * { clear: both; }
.mm-field { display: flex; flex-direction: column; gap: 8px; }
.mm-label { font-weight: 700; font-size: 16px; }
.mm-opt { font-weight: 500; color: var(--mm-muted); font-size: inherit; }
.mm-hint { font-size: 14px; color: var(--mm-muted); margin-top: -4px; }
.mm-hint--flat { margin: 0; }
.mm-input, .mm-textarea, .mm-select { width: 100%; min-height: 52px; padding: 0 16px; border: 2px solid var(--mm-field); border-radius: 6px; font-family: var(--mm-font-body); font-size: 16px; background: #fff; color: var(--mm-ink); }
.mm-textarea { padding: 14px 16px; line-height: 1.5; resize: vertical; min-height: 180px; }
.mm-select { padding: 0 12px; }
.mm-input:focus, .mm-textarea:focus, .mm-select:focus { border-color: var(--mm-ink); outline: none; box-shadow: 0 0 0 2px var(--mm-ink); }
.mm-has-error .mm-input, .mm-has-error .mm-textarea, .mm-has-error .mm-picker > summary { border-color: var(--mm-red); }
.mm-error { font-size: 14px; font-weight: 600; color: var(--mm-red); }
.mm-count { align-self: flex-end; font-size: 13px; color: var(--mm-muted); }
.mm-grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.mm-alert { border-radius: 6px; padding: 14px 16px; font-size: 15px; font-weight: 600; }
.mm-alert--error { background: var(--mm-red-soft); color: var(--mm-plum); }
.mm-alert--info { background: var(--mm-ink); color: #fff; }
.mm-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Mängel-Auswahl */
.mm-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.mm-chips:empty { display: none; }
.mm-chip { display: inline-flex; align-items: center; gap: 4px; background: var(--mm-ink); color: #fff; font-size: 14px; font-weight: 600; padding: 4px 4px 4px 12px; border-radius: 999px; }
.mm-chip button { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 0; border-radius: 50%; background: transparent; color: #fff; cursor: pointer; }
.mm-chip button:hover { background: rgba(255,255,255,.18); }
.mm-chip svg { width: 14px; height: 14px; }
.mm-picker > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 0 16px; background: #fff; border: 2px solid var(--mm-field); border-radius: 6px; font-weight: 600; cursor: pointer; }
.mm-picker > summary::-webkit-details-marker { display: none; }
.mm-picker > summary svg { width: 20px; height: 20px; transition: transform .15s; flex: none; }
.mm-picker[open] > summary { border-color: var(--mm-ink); border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.mm-picker[open] > summary svg { transform: rotate(180deg); }
.mm-picker__body { border: 2px solid var(--mm-ink); border-top: 0; border-radius: 0 0 6px 6px; padding: 20px; display: flex; flex-direction: column; gap: 18px; }
.mm-picker__group { margin: 0; padding: 0; border: 0; min-width: 0; }
.mm-picker__group legend { padding: 0; margin-bottom: 10px; font-size: 13px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--mm-muted); }
.mm-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.mm-pill { position: relative; }
.mm-pill input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.mm-pill span { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 999px; border: 2px solid var(--mm-field); background: #fff; font-size: 14px; font-weight: 600; cursor: pointer; user-select: none; }
.mm-pill span::before { content: '+'; font-weight: 700; }
.mm-pill:hover span { border-color: var(--mm-ink); }
.mm-pill input:checked + span { background: var(--mm-red); border-color: var(--mm-red); color: #fff; }
.mm-pill input:checked + span::before { content: '✓'; }
.mm-pill input:focus-visible + span { outline: 3px solid var(--mm-ink); outline-offset: 2px; }
#mm-picker-close { align-self: flex-start; }

/* Checkbox-Karten */
.mm-check { display: flex; gap: 14px; align-items: flex-start; padding: 16px; border: 2px solid var(--mm-line); border-radius: 6px; cursor: pointer; font-size: 15px; line-height: 1.55; }
.mm-check input { width: 22px; height: 22px; margin: 1px 0 0; flex: none; accent-color: var(--mm-red); }
.mm-check:has(input:checked) { border-color: var(--mm-red); background: #FFF5F5; }
.mm-has-error .mm-check { border-color: var(--mm-red); }
.mm-check small { display: block; color: var(--mm-body); font-size: 15px; margin-top: 2px; }

/* Spamschutz-Box */
.mm-captcha { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; justify-content: space-between; border: 2px solid var(--mm-line); border-radius: 6px; padding: 12px 16px; background: #FAF8F6; }
.mm-has-error .mm-captcha { border-color: var(--mm-red); }
.mm-captcha__btn { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 4px; border: 0; background: transparent; font-family: var(--mm-font-body); font-size: 16px; font-weight: 600; color: var(--mm-ink); cursor: pointer; }
.mm-captcha__box { width: 26px; height: 26px; border: 2px solid var(--mm-ink); border-radius: 4px; background: #fff; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.mm-captcha__box svg { width: 16px; height: 16px; display: none; }
.mm-captcha[data-state="running"] .mm-captcha__box { border-color: #D6D0CA; border-top-color: var(--mm-red); border-width: 3px; border-radius: 50%; animation: mmspin .8s linear infinite; }
.mm-captcha[data-state="done"] .mm-captcha__box { background: var(--mm-ok); border-color: var(--mm-ok); }
.mm-captcha[data-state="done"] .mm-captcha__box svg { display: block; color: #fff; }
.mm-captcha[data-state="done"] .mm-captcha__btn { cursor: default; }
.mm-captcha__note { font-size: 12px; color: var(--mm-muted); max-width: 300px; line-height: 1.4; }
@keyframes mmspin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .mm-captcha[data-state="running"] .mm-captcha__box { animation-duration: 3s; } }

.mm-submit { align-self: flex-start; }
.mm-darkbox { background: var(--mm-plum); color: #fff; border-radius: 8px; padding: 32px; }
.mm-darkbox h2 { margin: 0 0 14px; font-family: var(--mm-font-head); font-weight: 900; font-size: 24px; line-height: 1.2; }
.mm-darkbox ul { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 10px; font-size: 15px; line-height: 1.5; color: #F3E6EC; }
.mm-linebox { background: #fff; border: 2px solid var(--mm-ink); border-radius: 8px; padding: 28px; }
.mm-linebox h2 { margin: 0 0 10px; font-family: var(--mm-font-head); font-weight: 900; font-size: 18px; line-height: 1.2; }
.mm-linebox p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--mm-body); }
.mm-linebox p + p { margin-top: 12px; }
.mm-linebox a { font-weight: 700; }

/* Danke-Seite */
.mm-thanks { max-width: 760px; margin: 0 auto; padding: 96px 24px 128px; }
.mm-thanks__card { background: #fff; border-radius: 8px; padding: 56px 48px; display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
@media (max-width: 560px) { .mm-thanks__card { padding: 36px 24px; } }
.mm-thanks__icon { display: inline-flex; width: 64px; height: 64px; border-radius: 50%; background: var(--mm-red); align-items: center; justify-content: center; color: #fff; }
.mm-thanks__icon svg { width: 34px; height: 34px; }
.mm-thanks p { margin: 0; font-size: 18px; color: var(--mm-body); }
.mm-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* Textseiten (Impressum, Datenschutz) */
.mm-prose { max-width: 760px; padding-top: 96px; padding-bottom: 128px; }
.mm-prose h2 { font-family: var(--mm-font-head); font-weight: 900; font-size: 24px; line-height: 1.2; margin: 40px 0 10px; }
.mm-prose p, .mm-prose li { color: var(--mm-body); }
.mm-todo { background: var(--mm-warn-bg); color: var(--mm-warn); padding: 2px 6px; border-radius: 4px; font-weight: 600; }

/* =========================================================
   Backend
   ========================================================= */
.ad-header { background: var(--mm-ink); color: #fff; }
.ad-header .mm-header__in { padding-top: 12px; padding-bottom: 12px; max-width: 1440px; }
.ad-header .mm-brand, .ad-header .mm-brand:hover { color: #fff; }
.ad-header .mm-brand__tag, .ad-header .mm-brand__word { font-size: 22px; }
.ad-header .mm-brand__by { color: var(--mm-on-dark); border-color: #4A4A4A; }
.ad-header .mm-brand__by strong { color: #fff; }
.ad-user { display: flex; align-items: center; gap: 8px 18px; flex-wrap: wrap; font-size: 14px; color: var(--mm-on-dark); }
.ad-user strong { color: #fff; }
.ad-user .mm-btn--link { color: #fff; }
.ad-user form { margin: 0; }
.ad-main { max-width: 1440px; margin: 0 auto; padding: 40px 32px 80px; display: flex; flex-direction: column; gap: 24px; }
.ad-top { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: flex-end; justify-content: space-between; }
.ad-top h1 { font-family: var(--mm-font-head); font-weight: 900; font-size: 42px; line-height: 1.1; margin: 0; }
.ad-top p { margin: 6px 0 0; font-size: 14px; color: var(--mm-muted); }
.ad-top a svg { width: 16px; height: 16px; vertical-align: -3px; }
.ad-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.ad-stat { background: #fff; border-radius: 8px; padding: 20px 22px; }
.ad-stat__label { font-size: 13px; font-weight: 600; color: var(--mm-muted); }
.ad-stat__num { font-family: var(--mm-font-head); font-weight: 900; font-size: 42px; line-height: 1.15; }
.ad-stat__num small { font-size: 24px; color: var(--mm-muted); }
.ad-stat__num--red { color: var(--mm-red); }
.ad-stat__list { margin: 8px 0 0; padding-left: 20px; font-size: 14px; display: flex; flex-direction: column; gap: 4px; }
.ad-stat__list span { color: var(--mm-muted); }
.ad-filters { background: #fff; border-radius: 8px; padding: 20px 22px; display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; }
.ad-filters .mm-field { flex: 1 1 160px; gap: 6px; }
.ad-filters .mm-field--wide { flex: 2 1 240px; }
.ad-filters label { font-size: 13px; font-weight: 700; }
.ad-filters .mm-input, .ad-filters .mm-select { min-height: 44px; font-size: 15px; padding: 0 12px; }
.ad-filters .mm-check { padding: 0; border: 0; min-height: 44px; align-items: center; font-size: 14px; font-weight: 600; }
.ad-filters .mm-check:has(input:checked) { background: none; }
.ad-filters .mm-check input { width: 20px; height: 20px; margin: 0; }
.ad-filters__btns { display: flex; gap: 10px; flex-wrap: wrap; }
.ad-filters__btns .mm-btn { min-height: 44px; }
.ad-tablebox { background: #fff; border-radius: 8px; overflow-x: auto; }
.ad-table { width: 100%; min-width: 900px; border-collapse: collapse; font-size: 14px; }
.ad-table th { text-align: left; padding: 14px 16px; border-bottom: 2px solid var(--mm-ink); font-size: 12px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--mm-body); white-space: nowrap; }
.ad-table td { padding: 16px; border-bottom: 1px solid #ECE7E2; vertical-align: top; }
.ad-table tr:hover td { background: #FFF9F9; }
.ad-muted { color: var(--mm-muted); }
.ad-desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--mm-body); margin-top: 8px; max-width: 520px; }
.ad-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ad-chip { background: var(--mm-ink); color: #fff; font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.ad-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.ad-badge svg { width: 12px; height: 12px; }
.ad-badge--neu, .ad-badge--contact { background: var(--mm-red-soft); color: var(--mm-plum); }
.ad-badge--in_bearbeitung { background: var(--mm-warn-bg); color: var(--mm-warn); }
.ad-badge--erledigt { background: var(--mm-ok-bg); color: var(--mm-ok); }
.ad-empty { padding: 40px 20px; text-align: center; color: var(--mm-muted); }
.ad-pager { display: flex; gap: 8px; align-items: center; justify-content: center; flex-wrap: wrap; font-size: 14px; }
.ad-detail { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.ad-detail__main { flex: 999 1 560px; min-width: 0; background: #fff; border-radius: 8px; padding: 32px; display: flex; flex-direction: column; gap: 20px; }
.ad-detail__main > h2 { margin: 8px 0 0; font-family: var(--mm-font-head); font-weight: 900; font-size: 18px; }
.ad-detail__side { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.ad-card { background: #fff; border-radius: 8px; padding: 24px; display: flex; flex-direction: column; gap: 12px; }
.ad-card h2 { margin: 0; font-family: var(--mm-font-head); font-weight: 900; font-size: 18px; line-height: 1.2; }
.ad-text { white-space: pre-line; font-size: 16px; line-height: 1.6; margin: 0; overflow-wrap: anywhere; }
.ad-dl { margin: 0; display: grid; grid-template-columns: 120px 1fr; gap: 8px 12px; font-size: 15px; }
.ad-dl dt { color: var(--mm-muted); font-weight: 600; }
.ad-dl dd { margin: 0; overflow-wrap: anywhere; }
.ad-status-form { display: flex; flex-wrap: wrap; gap: 8px; }
.ad-status-form .mm-btn[aria-pressed="true"] { background: var(--mm-ink); color: #fff; }
.ad-danger { border: 2px solid var(--mm-red-soft); }
.ad-login { max-width: 440px; margin: 80px auto; padding: 0 24px; }
.ad-login .mm-panel { gap: 18px; }
.ad-secret { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 20px; letter-spacing: 2px; background: var(--mm-sand); padding: 12px 14px; border-radius: 4px; overflow-wrap: anywhere; }

/* =========================================================
   Miet-Check
   ========================================================= */
.mm-hero__rent { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 32px; color: #fff; font-size: 16px; font-weight: 500; text-decoration: none; border-bottom: 2px solid rgba(255,255,255,.6); padding-bottom: 4px; }
.mm-hero__rent span { font-weight: 700; }
.mm-hero__rent svg { width: 18px; height: 18px; flex: none; }
.mm-hero__rent:hover { color: #fff; border-bottom-color: #fff; }

.mc-section { background: #fff; }
.mc-split { display: flex; flex-wrap: wrap; gap: 64px; align-items: flex-start; }
.mc-intro { flex: 1 1 320px; min-width: 0; }
.mc-box { flex: 999 1 600px; min-width: 0; background: var(--mm-sand); border-radius: 8px; padding: 44px 40px; display: flex; flex-direction: column; gap: 32px; }
@media (max-width: 560px) { .mc-box { padding: 28px 20px; } }
.mc-bullets { list-style: none; margin: 32px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.mc-bullets li { display: flex; gap: 12px; align-items: center; font-weight: 600; }
.mc-bullets svg { width: 22px; height: 22px; color: var(--mm-red); flex: none; }
.mc-form { display: flex; flex-direction: column; gap: 28px; }
.mc-unit { position: relative; }
.mc-unit .mm-input { padding-right: 48px; }
.mc-unit span { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--mm-muted); font-weight: 600; pointer-events: none; }
.mc-lage { margin: 0; padding: 0; border: 0; min-width: 0; }
.mc-lage legend { padding: 0; margin-bottom: 10px; }
.mc-lage__opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.mc-option { position: relative; cursor: pointer; }
.mc-option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.mc-option span { display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 16px; border: 2px solid var(--mm-field); border-radius: 6px; background: #fff; }
.mc-option strong { font-family: var(--mm-font-head); font-weight: 900; font-size: 18px; }
.mc-option small { font-size: 14px; line-height: 1.45; color: var(--mm-body); }
.mc-option:hover span { border-color: var(--mm-ink); }
.mc-option input:checked + span { border-color: var(--mm-red); box-shadow: inset 0 0 0 1px var(--mm-red); background: #FFF5F5; }
.mc-option input:focus-visible + span { outline: 3px solid var(--mm-ink); outline-offset: 2px; }
.mc-more { border-top: 1px solid var(--mm-line); border-bottom: 1px solid var(--mm-line); }
.mc-more > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; font-weight: 700; cursor: pointer; }
.mc-more > summary::-webkit-details-marker { display: none; }
.mc-more > summary svg { width: 20px; height: 20px; transition: transform .15s; }
.mc-more[open] > summary svg { transform: rotate(180deg); }
.mc-more__body { display: flex; flex-direction: column; gap: 24px; padding: 8px 0 28px; }
.mc-checks { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.mc-checks .mm-check { background: #fff; align-items: center; }
.mc-checks .mm-check[hidden], .mc-modern[hidden] { display: none; }

.mc-result { background: #fff; border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; gap: 24px; padding-bottom: 28px; }
.mc-result:focus { outline: none; }
.mc-result > :not(.mc-result__head) { margin-left: 32px; margin-right: 32px; }
@media (max-width: 560px) { .mc-result > :not(.mc-result__head) { margin-left: 18px; margin-right: 18px; } }
.mc-result__head { padding: 28px 32px; color: #fff; background: var(--mm-ink); }
.mc-result--hoch .mc-result__head { background: var(--mm-red); }
.mc-result--passt .mc-result__head { background: var(--mm-ok); }
.mc-result--niedrig .mc-result__head { background: var(--mm-plum); }
.mc-result__head p { margin: 0; }
.mc-result__head p + p { margin-top: 8px; }
.mc-result__title { font-family: var(--mm-font-head); font-weight: 900; font-size: 24px; line-height: 1.2; }
.mc-result__big { font-family: var(--mm-font-head); font-weight: 900; font-size: clamp(38px, 5vw, 54px); line-height: 1.05; }
.mc-result__big span { font-family: var(--mm-font-head); font-weight: 300; font-size: 24px; }
.mc-scale { width: 100%; height: auto; display: block; }
.mc-scale__track { fill: #ECE7E2; }
.mc-scale__band { fill: #BDB6AE; }
.mc-scale__mid { stroke: var(--mm-ink); stroke-width: 3; }
.mc-scale__you { fill: var(--mm-red); stroke: #fff; stroke-width: 3; }
.mc-result--passt .mc-scale__you { fill: var(--mm-ok); }
.mc-result--niedrig .mc-scale__you { fill: var(--mm-plum); }
.mc-scale__label { font-family: var(--mm-font-body); font-size: 15px; fill: var(--mm-body); }
.mc-scale__label--you { font-weight: 700; fill: var(--mm-ink); }
.mc-facts { margin: 0; display: grid; grid-template-columns: 140px 1fr; gap: 10px 16px; font-size: 15px; }
.mc-facts dt { color: var(--mm-muted); font-weight: 600; }
.mc-facts dd { margin: 0; }
@media (max-width: 560px) { .mc-facts { grid-template-columns: 1fr; gap: 2px; } .mc-facts dd { margin-bottom: 10px; } }
.mc-brake { border: 2px solid var(--mm-red); border-radius: 6px; padding: 16px 18px; font-size: 15px; background: #FFF5F5; }
.mc-notes summary { cursor: pointer; font-weight: 700; font-size: 15px; }
.mc-notes ul { margin: 10px 0 0; padding-left: 20px; font-size: 14px; color: var(--mm-body); display: flex; flex-direction: column; gap: 6px; }
.mc-result > .mc-scale { width: calc(100% - 64px); }
@media (max-width: 560px) { .mc-result > .mc-scale { width: calc(100% - 36px); } }