/* Kontaktseite: Assistent (Contact Form 7 + menne-wizard.js), Schritte, Öffnungszeiten */

/* Drei Schritte als Kacheln */
.menne-steps-tiles .menne-step-n { font-family: var(--m-display); font-size: 34px; line-height: 1; color: var(--m-moss); transition: transform .2s var(--m-ease); }
.menne-steps-tiles > .wp-block-column:hover .menne-step-n { transform: translateY(-2px); }
.menne-steps-tiles .wp-block-heading { font-size: 21px; margin-top: 14px; }
.menne-steps-tiles .wp-block-heading + p { font-size: 15px; line-height: 1.6; margin-top: 6px; }
.menne-steps-tiles > .wp-block-column { padding: 32px 30px !important; }

/* Karte um das Formular */
.menne-wizard-card { background: var(--m-paper); border: 1px solid var(--m-line); border-radius: 3px; box-shadow: var(--m-shadow-card); padding: 44px 46px; max-width: 760px; margin-inline: auto !important; }
@media (max-width: 640px) { .menne-wizard-card { padding: 32px 22px; } }

.mw { font-family: var(--m-body); }
.mw fieldset { border: 0; padding: 0; margin: 0 0 40px; min-width: 0; }
.mw.is-js fieldset { margin-bottom: 0; }
.mw [hidden] { display: none !important; }
.mw legend, .mw .mw-q { display: block; padding: 0; font-family: var(--m-display); font-weight: 500; font-size: clamp(23px, 3vw, 30px); line-height: 1.15; color: var(--m-ink); margin: 0 0 26px; outline: none; }
.mw p { margin: 0; }
.mw .mw-hint { font-size: 14px; color: var(--m-ink-mute); margin: -14px 0 18px; }
.mw-head { margin-bottom: 8px; }
.mw-progress { display: flex; gap: 6px; margin-bottom: 30px; }
.mw-dot { flex: 1; height: 4px; border-radius: 2px; background: var(--m-line); transition: background .3s var(--m-ease); }
.mw-dot.is-done { background: var(--m-moss); }
.mw-dot.is-now { background: var(--m-moss-bright); }
.mw-stepno { font-weight: 600; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--m-moss); margin: 0 0 8px !important; }

/* Auswahlkarten (Radio) */
.mw :is(.wpcf7-radio, .wpcf7-checkbox) { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mw [data-step="kontaktweg"] .wpcf7-radio { grid-template-columns: 1fr; }
.mw .wpcf7-list-item { margin: 0; display: block; }
.mw .wpcf7-list-item label { position: relative; display: block; height: 100%; cursor: pointer; background: var(--m-paper); border: 1.5px solid var(--m-line); border-radius: 2px; padding: 16px 18px; transition: border-color .2s var(--m-ease), background .2s var(--m-ease), transform .2s var(--m-ease); }
.mw .wpcf7-list-item label:hover { border-color: var(--m-moss); background: rgba(110, 147, 34, .05); transform: translateY(-2px); }
.mw .wpcf7-list-item input { position: absolute; opacity: 0; pointer-events: none; }
.mw .wpcf7-list-item-label { display: block; font-weight: 600; font-size: 15.5px; line-height: 1.35; color: var(--m-ink); }
.mw .mw-sub { display: block; font-weight: 500; font-size: 13px; color: var(--m-ink-mute); margin-top: 3px; }
.mw .wpcf7-list-item label:has(input:checked) { border: 2px solid var(--m-moss); padding: 15.5px 17.5px; background: rgba(110, 147, 34, .08); }
.mw .wpcf7-list-item label:has(input:checked) .wpcf7-list-item-label, .mw .wpcf7-list-item label:has(input:checked) .mw-sub { color: var(--m-moss); }
.mw .wpcf7-list-item label:has(input:focus-visible) { outline: 3px solid var(--m-moss); outline-offset: 3px; }

/* Eingabefelder */
.mw-field { display: block; margin-top: 4px; }
.mw-field + .mw-field { margin-top: 18px; }
.mw [data-step="kontaktweg"] .mw-field { margin-top: 18px; }
.mw-label { display: block; font-weight: 600; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--m-ink-mute); margin-bottom: 8px; }
.mw input[type=text], .mw input[type=tel], .mw input[type=email], .mw textarea {
	width: 100%; font-family: var(--m-body); font-size: 16px; color: var(--m-ink); background: #fff;
	border: 1px solid var(--m-line); border-radius: 2px; padding: 13px 15px; line-height: 1.4; transition: border-color .2s var(--m-ease), box-shadow .2s var(--m-ease);
}
.mw textarea { min-height: 110px; resize: vertical; }
.mw input:hover, .mw textarea:hover { border-color: var(--m-bark); }
.mw input:focus, .mw textarea:focus { outline: none; border-color: var(--m-moss); box-shadow: 0 0 0 3px rgba(110, 147, 34, .18); }
.mw .wpcf7-not-valid { border-color: #b5453b !important; }
.mw .wpcf7-not-valid-tip, .mw-error { color: #9c3a30; font-size: 14px; font-weight: 600; margin-top: 8px; display: block; }
.mw .wpcf7-radio + .wpcf7-not-valid-tip { margin-top: 10px; }
.mw-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.mw-grid .mw-field { margin: 0 !important; }
.mw-grid .mw-full { grid-column: 1 / -1; }
.mw-accept { margin-top: 22px; font-size: 14px; line-height: 1.55; color: var(--m-ink-soft); }
.mw-accept .wpcf7-list-item label { display: flex; gap: 12px; align-items: flex-start; border: 0; padding: 0; background: none; transform: none !important; }
.mw-accept .wpcf7-list-item label:has(input:checked) { border: 0; padding: 0; background: none; }
.mw-accept input[type=checkbox] { position: static !important; opacity: 1 !important; pointer-events: auto !important; width: 20px; height: 20px; margin-top: 1px; accent-color: var(--m-moss); flex: none; }
.mw-accept .wpcf7-list-item-label { font-weight: 400; font-size: 14px; color: var(--m-ink-soft); }
.mw-accept .wpcf7-list-item label:has(input:checked) .wpcf7-list-item-label { color: var(--m-ink-soft); }
.mw-accept a { color: var(--m-moss); }

/* Navigation */
.mw-nav, .mw-submit { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 34px; }
.mw-back { background: none; border: 0; color: var(--m-ink-mute); font-family: var(--m-body); font-weight: 600; font-size: 15px; cursor: pointer; padding: 8px 4px; }
.mw-back:hover { color: var(--m-ink); }
.mw-back[hidden] + .mw-next { margin-left: auto; }
.mw .mw-next, .mw .wpcf7-submit {
	margin-left: auto; display: inline-flex; align-items: center; background: var(--m-moss); color: #fff; font-family: var(--m-body); font-weight: 600; font-size: 16px;
	padding: 14px 26px; border: 0; border-radius: 2px; cursor: pointer; transition: background .2s var(--m-ease), transform .2s var(--m-ease);
}
.mw .mw-next:hover, .mw .wpcf7-submit:hover { background: var(--m-ink); transform: translateY(-2px); }
.mw .wpcf7-spinner { margin: 0 0 0 12px; }
.mw:not(.is-js) .mw-submit { justify-content: flex-start; }

/* Zusammenfassung */
.mw-result { display: grid; grid-template-columns: .7fr 1.3fr; gap: 32px; align-items: center; }
.mw-result img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 3px; background: var(--m-sand); }
.mw-area-name { font-family: var(--m-display); font-weight: 500; font-size: 24px; color: var(--m-ink); }
.mw-area-role { font-size: 14px; font-weight: 600; color: var(--m-ink-mute); margin-top: 4px !important; }
.mw-list { list-style: none; padding: 0; margin: 18px 0 0; display: flex; flex-direction: column; gap: 8px; }
.mw-list li { font-size: 14.5px; color: var(--m-ink-soft); overflow-wrap: anywhere; }
.mw-list strong { color: var(--m-ink); }
.mw [data-step="summary"] .mw-q { font-family: var(--m-body); font-weight: 600; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--m-moss); margin-bottom: 18px; }

/* Danke */
.mw-thanks { text-align: center; padding: 20px 0; outline: none; }
.mw-thanks .mw-q { font-size: 26px; margin: 12px 0 10px; }
.mw-thanks-text { color: var(--m-ink-soft); margin: 0 0 22px !important; }
.mw-thanks-text a { color: var(--m-moss); font-weight: 600; }
.mw.is-js ~ .wpcf7-response-output { display: none !important; }
.wpcf7 form.sent .wpcf7-response-output { display: none; }
.wpcf7 .wpcf7-response-output { margin: 24px 0 0 !important; padding: 12px 16px !important; border-radius: 2px; font-size: 15px; }

@media (max-width: 640px) {
	.mw :is(.wpcf7-radio, .wpcf7-checkbox), .mw-grid { grid-template-columns: 1fr; }
	.mw-result { grid-template-columns: 1fr; text-align: center; }
	.mw-result img { max-width: 160px; margin: 0 auto; }
	.mw-list { text-align: left; }
}

/* Öffnungszeiten in der Kontaktkarte */
.menne-hours { list-style: none; padding: 0; margin: 4px 0 0 !important; width: 100%; }
.menne-hours li { display: flex; justify-content: space-between; gap: 16px; font-size: 15px; color: var(--m-cream-soft); padding: 4px 0; }
.menne-hours li strong { color: #fff; font-weight: 400; }
.is-style-menne-info-row.menne-ico-clock { justify-content: flex-start; }
/* Direkter Draht: Bild füllt die Spalte */
.menne-direkt-img { flex: 1 1 auto; }
.menne-direkt-img img { height: 100%; min-height: 280px; object-fit: cover; }
.menne-map-wide { aspect-ratio: 16 / 5; min-height: 280px; margin-top: 32px !important; }
@media (max-width: 680px) { .menne-map-wide { aspect-ratio: auto; } }
.menne-section--form { padding-top: 0 !important; }
.menne-steps-tiles { margin-top: 18px !important; }

/* Wie Design-Referenz: Schritt-Kacheln hell, Hover sand */
.menne-steps-tiles > .wp-block-column { background: var(--m-paper) !important; }
.menne-steps-tiles > .wp-block-column:hover { background: var(--m-sand) !important; }
/* Karten-Platzhalter dunkel wie in der Referenz */
.wp-block-group.is-style-menne-map.menne-map-wide { background: var(--m-walnut-line); border-color: var(--m-walnut-line); color: var(--m-cream-soft); }
.menne-map-wide .is-style-menne-label { color: var(--m-moss-bright); }
.menne-map-wide a:not(.wp-element-button) { color: var(--m-moss-bright); }
.menne-map-wide .wp-block-button.is-style-menne-quiet .wp-block-button__link { color: #fff; border-color: var(--m-cream-mute); }
.menne-map-wide .wp-block-button.is-style-menne-quiet .wp-block-button__link:hover { background: #fff; color: var(--m-ink); }

/* ---------- Assistent: Abgleich mit der Design-Referenz ---------- */
.mw .wpcf7-list-item label { box-sizing: border-box; height: 100%; }
.mw .wpcf7-list-item label:hover { background: var(--m-paper); }
.mw .wpcf7-list-item label:has(input:checked) { border: 1.5px solid var(--m-moss); padding: 16px 18px; background: rgba(110, 147, 34, .08); }
.mw .wpcf7-list-item label:has(input:focus-visible) { outline: 3px solid var(--m-moss); outline-offset: 2px; }
.mw .wpcf7-list-item label:has(input:focus:not(:focus-visible)) { outline: none; }
.mw-fields { margin-top: 18px; display: grid; gap: 16px; }
.mw-fields .mw-field { margin: 0 !important; }
.mw .mw-next:focus:not(:focus-visible), .mw .wpcf7-submit:focus:not(:focus-visible), .mw-back:focus:not(:focus-visible) { outline: none; }
.mw .mw-next:focus-visible, .mw .wpcf7-submit:focus-visible, .mw-back:focus-visible { outline: 3px solid var(--m-moss); outline-offset: 3px; }
/* Zusammenfassung wie Vorlage: Foto links, Angaben + Buttons rechts */
.mw [data-step="summary"] .mw-q { margin-bottom: 8px; }
.mw-result { grid-template-columns: .7fr 1.3fr; gap: 32px; align-items: center; margin-top: 10px; }
.mw-result-body > p { margin: 0; }
.mw-list { gap: 10px; }
.mw-list li { font-size: 14.5px; line-height: 1.5; }
.mw-final { margin-top: 22px; }
.mw-final .mw-accept { margin-top: 0; font-size: 13px; }
.mw-final .mw-accept .wpcf7-list-item-label { font-size: 13px; }
.mw-final .mw-submit { margin-top: 18px; justify-content: space-between; }
.mw-final .mw-error { margin-top: 10px; }
.mw-eyebrow { font-weight: 600; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--m-moss); }
@media (max-width: 640px) { .mw-final .mw-submit { flex-direction: column-reverse; align-items: stretch; } .mw .wpcf7-submit { margin-left: 0; justify-content: center; } }
.mw-back { white-space: nowrap; }

/* Karte nach dem Laden: iframe ohne Layout-Abstand */
.wp-block-group.is-style-menne-map iframe { margin: 0 !important; }

/* „Direkter Draht“ wie Design-Referenz */
.menne-direkt-text { max-width: 46ch; font-size: 17px; line-height: 1.65; }
.wp-block-column.menne-direkt-col { display: flex; flex-direction: column; }
.wp-block-column.menne-direkt-col > .menne-direkt-img { flex: 1 1 auto; position: relative; min-height: 280px; margin-top: 28px !important; }
.wp-block-column.menne-direkt-col > .menne-direkt-img img { position: absolute; inset: 0; width: 100%; height: 100% !important; min-height: 0; object-fit: cover; object-position: 50% 40%; }
.menne-kontakt-card .wp-block-group.is-style-menne-info-row { padding: 24px 28px 24px 90px; min-height: 0; justify-content: flex-start; }
.menne-kontakt-card .is-style-menne-info-row::before { top: 24px; margin-top: 0; left: 28px; width: 46px; height: 46px; }
.menne-kontakt-card .is-style-menne-info-row::after { top: 36px; margin-top: 0; left: 40px; }
.menne-kontakt-card .is-style-menne-info-row:hover::before, .menne-kontakt-card .is-style-menne-info-row:hover::after { transform: none; }
.menne-kontakt-card .menne-ico-phone .menne-info-value { font-size: 21px; }
.menne-kontakt-card .menne-info-note { font-size: 13px; margin-top: 6px !important; }
.menne-kontakt-card .menne-ico-pin .menne-info-note { color: var(--m-moss-bright); font-weight: 600; margin-top: 8px !important; }
.menne-kontakt-card .menne-ico-clock { padding-left: 28px !important; }
.menne-kontakt-card .menne-ico-clock::before, .menne-kontakt-card .menne-ico-clock::after { display: none; }
.menne-kontakt-card .menne-ico-clock .is-style-menne-label { margin-bottom: 8px !important; }
.menne-kontakt-card .menne-hours li { padding: 4px 0; }
.menne-kontakt-card .menne-hours li:last-child strong { color: var(--m-cream-soft); }
@media (max-width: 920px) { .wp-block-column.menne-direkt-col > .menne-direkt-img { min-height: 280px; } }

/* „So einfach geht’s“: Kopf mit Bild rechts (Update 10/2026) */
.menne-ablauf-head .menne-ablauf-img { border: 1px solid var(--m-line); }
.menne-ablauf-head .wp-block-column > .wp-block-heading { max-width: 560px; }
.menne-ablauf-head + .menne-steps-tiles { margin-top: 18px !important; }
@media (max-width: 920px) { .wp-block-columns.menne-ablauf-head { row-gap: 28px !important; } }

/* ---------- Assistent (Update 26.10.2026): Kontaktdaten unter jeder Frage, Umfang-Auswahl ---------- */
.mw [data-step="umfang"] .wpcf7-checkbox { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mw [data-step="umfang"] .mw-field { margin-top: 12px; }
.mw [data-step="kontaktweg"] .mw-field { margin-top: 18px; }
.mw-cdata { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--m-line); display: grid; gap: 10px; }
.mw-cdata .mw-field, .mw-cdata .mw-field + .mw-field { margin: 0; }
.mw-cdata .mw-accept { margin-top: 10px; }
.mw-cdata > .mw-error { margin-top: 4px; }
.mw-step > .mw-error { margin-top: 12px; }
.mw-accept .wpcf7-list-item-label { font-size: 14px; line-height: 1.55; }
.mw-nav .wpcf7-submit[hidden], .mw-nav .mw-next[hidden], .mw-nav .mw-back[hidden] { display: none !important; }
.mw-nav .wpcf7-spinner { order: 3; }
/* Honeypot: für Menschen unsichtbar */
.mw-hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 640px) {
	.mw [data-step="umfang"] .wpcf7-checkbox { grid-template-columns: 1fr 1fr; }
	.mw-nav { flex-wrap: wrap; }
}
.mw input[type=text], .mw input[type=tel], .mw input[type=email], .mw textarea { box-sizing: border-box; max-width: 100%; }

/* Kontaktkarte wie Vorlage (04.11.): Öffnungszeiten-Zeilen 24 px + 8 px Abstand, Anschrift mit Zeilenhöhe 1,2 */
.menne-kontakt-card .menne-hours li { padding: 0; }
.menne-kontakt-card .menne-ico-pin .menne-info-value { line-height: 1.2; }
.menne-kontakt-card .menne-hours { margin-top: 8px !important; }