/*!
 * MoselFinder – entwickelt von Mike Linsenbold <info@linstec.de>
 * (c) 2026 linstec – Mike Linsenbold, Neumagen-Dhron · https://linstec.de
 */
/* MoselFinder – mobile first */

@font-face { font-family: "Figtree"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/figtree-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Figtree"; font-weight: 800; font-style: normal; font-display: swap; src: url("../fonts/figtree-latin-800-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/source-sans-3-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/source-sans-3-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/source-sans-3-latin-700-normal.woff2") format("woff2"); }

:root {
	--mf-grund: #F4F1EA;
	--mf-flaeche: #FFFFFF;
	--mf-flaeche-2: #E6E1D6;
	--mf-linie: #E0DBCF;
	--mf-text: #1B2426;
	--mf-text-2: #4A5658;
	--mf-mosel: #073954;
	--mf-mosel-dunkel: #042637;
	--mf-mosel-hell: #E1EBF1;
	--mf-gold: #C6D96A;
	--mf-gold-hell: #EEF4D2;
	--mf-gold-text: #36420C;
	--mf-ok: #1D6B3A;
	--mf-ok-hell: #E3F2E7;
	--mf-warn: #8A3D00;
	--mf-warn-hell: #FCEBD9;
	--mf-rot: #9B1C1C;
	--mf-rot-hell: #FBE4E4;
	--mf-radius: 18px;
	--mf-display: "Figtree", "Segoe UI", sans-serif;
	--mf-body: "Source Sans 3", "Segoe UI", sans-serif;
	--mf-tabbar-h: 68px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--mf-grund);
	color: var(--mf-text);
	font-family: var(--mf-body);
	font-size: 16px;
	line-height: 1.45;
}
body.mf-hat-tabbar { padding-bottom: calc(var(--mf-tabbar-h) + env(safe-area-inset-bottom)); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--mf-mosel); }
a:hover { color: var(--mf-mosel-dunkel); }
:focus-visible { outline: 3px solid var(--mf-mosel); outline-offset: 2px; }
h1, h2, h3 { font-family: var(--mf-display); line-height: 1.1; margin: 0; }

.mf-skip { position: absolute; left: -9999px; top: 8px; z-index: 100; background: var(--mf-flaeche); padding: 10px 14px; border-radius: 8px; }
.mf-skip:focus { left: 8px; }

.mf-main { max-width: 720px; margin: 0 auto; }

/* ---------- Kopf ---------- */
.mf-kopf {
	max-width: 720px; margin: 0 auto;
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 16px 16px 10px;
}
.mf-logo { display: flex; align-items: center; gap: 8px; text-decoration: none; }
.mf-logo__bild { height: 46px; width: auto; display: block; }
@media (min-width: 720px) { .mf-logo__bild { height: 56px; } }
.mf-logo__text { font-family: var(--mf-display); font-weight: 800; font-size: 21px; letter-spacing: -0.3px; color: var(--mf-mosel); }
.mf-kopf__ortung {
	display: inline-flex; align-items: center; gap: 6px; min-height: 40px;
	padding: 6px 14px; border: 0; border-radius: 999px;
	background: var(--mf-flaeche-2); color: var(--mf-text); font: 600 14px var(--mf-body); cursor: pointer;
}

/* ---------- Hero ---------- */
.mf-hero {
	position: relative; overflow: hidden;
	margin: 4px 16px 0; padding: 22px 20px 20px;
	border-radius: 20px; background: var(--mf-mosel); color: #fff;
	display: flex; flex-direction: column; gap: 6px; align-items: flex-start;
}
.mf-hero::after {
	content: ""; position: absolute; right: -30px; bottom: -20px; width: 260px; height: 110px; opacity: .25; pointer-events: none;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 90' fill='none'%3E%3Cpath d='M0 60c40-30 80-30 120 0s80 30 120 0' stroke='%23C6D96A' stroke-width='6' stroke-linecap='round'/%3E%3Cpath d='M0 80c40-30 80-30 120 0s80 30 120 0' stroke='%237FA3BA' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain;
}
.mf-hero > * { position: relative; z-index: 1; }
.mf-hero__ort { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--mf-gold); }
.mf-hero__titel { font-weight: 800; font-size: 32px; letter-spacing: -0.5px; }
.mf-hero__text { margin: 4px 0 0; font-size: 15px; color: #D3E1EA; }
.mf-hero__chips { display: flex; gap: 8px; margin-top: 8px; }
.mf-chip { background: rgba(255, 255, 255, .14); border-radius: 999px; padding: 5px 10px; font-size: 13px; font-weight: 600; }
.mf-hero .mf-button { margin-top: 10px; }

/* ---------- Kacheln ---------- */
.mf-kacheln { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 16px; }
.mf-kachel {
	display: flex; flex-direction: column; gap: 10px; min-height: 128px;
	padding: 16px; border-radius: var(--mf-radius); background: var(--mf-flaeche);
	color: var(--mf-text); text-decoration: none; transition: transform .15s ease;
}
.mf-kachel:active { transform: scale(.98); }
.mf-kachel__icon { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.mf-kachel--gruen .mf-kachel__icon { background: #EEF4D2; color: #55661A; }
.mf-kachel--gold .mf-kachel__icon { background: var(--mf-gold-hell); color: #8A5A00; }
.mf-kachel--rot .mf-kachel__icon { background: #F1E4EC; color: #7A2D55; }
.mf-kachel--blau .mf-kachel__icon { background: #E4E8F5; color: #2D3F7A; }
.mf-kachel--stein .mf-kachel__icon { background: #EFE7DB; color: #6B4E2E; }
.mf-kachel--teal .mf-kachel__icon { background: #DDF0EE; color: #1F6A66; }
.mf-kachel__titel { font-family: var(--mf-display); font-weight: 600; font-size: 18px; color: var(--mf-text); }
.mf-kachel__info { font-size: 13px; font-weight: 600; color: var(--mf-text-2); }
.mf-kachel__info--ok { color: var(--mf-ok); display: flex; align-items: center; gap: 6px; }
.mf-kachel__info--ok::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #2E8B4F; flex: none; }

/* ---------- Abschnitte ---------- */
.mf-abschnitt { padding: 8px 16px 16px; }
.mf-abschnitt--eng { padding-top: 4px; display: flex; flex-direction: column; gap: 12px; }
.mf-abschnitt__kopf { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 10px; }
.mf-abschnitt__titel { font-weight: 800; font-size: 20px; margin-bottom: 10px; }
.mf-abschnitt__kopf .mf-abschnitt__titel { margin-bottom: 0; }
.mf-abschnitt__kopf a { font-weight: 600; font-size: 15px; }
.mf-leer { color: var(--mf-text-2); padding: 0 16px; }
.mf-abschnitt .mf-leer { padding: 0; }
.mf-tipp { margin: 0 16px 16px; padding: 14px 16px; border-radius: 16px; background: var(--mf-flaeche-2); }
.mf-tipp p { margin: 4px 0 0; color: #3D4A4C; font-size: 15px; }

.mf-seitenkopf { display: flex; align-items: center; gap: 8px; padding: 6px 16px 10px 8px; }
.mf-seitenkopf__ort { font-size: 13px; font-weight: 600; color: var(--mf-text-2); }
.mf-seitenkopf__titel { font-weight: 800; font-size: 26px; letter-spacing: -0.3px; }
.mf-seite .mf-seitenkopf__titel { margin-bottom: 12px; }
.mf-zurueck { width: 44px; height: 44px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: var(--mf-text); flex: none; }
.mf-zurueck:hover { background: var(--mf-flaeche-2); }

.mf-listenkopf { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 0 16px 10px; font-size: 14px; color: var(--mf-text-2); flex-wrap: wrap; }
.mf-listenkopf__aktionen { display: flex; gap: 4px; }
.mf-textbutton { display: inline-flex; align-items: center; gap: 4px; min-height: 40px; padding: 4px 8px; border: 0; background: none; font: 600 14px var(--mf-body); color: var(--mf-mosel); text-decoration: none; cursor: pointer; border-radius: 8px; }
.mf-textbutton:hover { background: var(--mf-flaeche-2); }

.mf-liste { display: flex; flex-direction: column; gap: 12px; }
.mf-abschnitt > .mf-liste, .mf-main > .mf-liste { padding: 0 16px 16px; }
.mf-abschnitt > .mf-liste { padding: 0; }

/* ---------- Karten (Betrieb) ---------- */
.mf-karte { background: var(--mf-flaeche); border-radius: var(--mf-radius); overflow: hidden; }
.mf-karte__bild img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.mf-karte__inhalt, .mf-zimmer__inhalt { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; }
.mf-karte__kopf { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.mf-karte__titel, .mf-zimmer__titel { font-weight: 600; font-size: 19px; }
.mf-karte__titel a { color: inherit; text-decoration: none; }
.mf-karte__titel a::after { content: ""; position: absolute; inset: 0; } /* gesamte Kopfzeile klickbar */
.mf-karte__kopf { position: relative; }
.mf-karte__text { margin: 0; font-size: 15px; color: var(--mf-text-2); }
.mf-distanz { font-size: 13px; font-weight: 600; color: var(--mf-text-2); white-space: nowrap; }

.mf-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.mf-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 999px; background: #F0ECE3; color: #3D4A4C; font-size: 13px; font-weight: 700; }
.mf-badge--ok { background: var(--mf-ok-hell); color: var(--mf-ok); }
.mf-badge--warn { background: var(--mf-warn-hell); color: var(--mf-warn); }
.mf-badge--belegt { background: var(--mf-rot-hell); color: var(--mf-rot); }
.mf-badge--aus { background: #ECE9E2; color: #555E60; }

.mf-angebot { background: var(--mf-gold-hell); color: var(--mf-gold-text); border-radius: 12px; padding: 10px 12px; font-size: 15px; }

.mf-aktionen { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 2px; }
.mf-aktionen--gross { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.mf-button {
	display: inline-flex; align-items: center; justify-content: center; gap: 6px;
	min-height: 46px; padding: 10px 16px; border: 0; border-radius: 12px;
	background: var(--mf-mosel); color: #fff; font: 700 15px var(--mf-body); text-decoration: none; cursor: pointer;
}
.mf-button:hover { background: var(--mf-mosel-dunkel); color: #fff; }
.mf-button--zart { background: var(--mf-mosel-hell); color: var(--mf-mosel); }
.mf-button--zart:hover { background: #CFE2DF; color: var(--mf-mosel-dunkel); }
.mf-button--gold { background: #6E831E; color: #fff; }
.mf-button--gold:hover { background: #5A6C17; color: #fff; }
.mf-button--hell { background: #fff; color: var(--mf-mosel); }
.mf-button--hell:hover { background: var(--mf-grund); color: var(--mf-mosel-dunkel); }
.mf-button--breit { width: 100%; }

/* ---------- Veranstaltungen ---------- */
.mf-event { display: flex; gap: 14px; align-items: center; padding: 14px; border-radius: 16px; background: var(--mf-flaeche); text-decoration: none; color: var(--mf-text); }
.mf-event__zeit { width: 64px; flex: none; border-radius: 12px; background: var(--mf-mosel); color: #fff; text-align: center; padding: 8px 4px; display: flex; flex-direction: column; }
.mf-event__vor { font-size: 11px; font-weight: 700; letter-spacing: .5px; color: var(--mf-gold); }
.mf-event__uhr { font-family: var(--mf-display); font-weight: 800; font-size: 17px; }
.mf-event__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mf-event__titel { font-weight: 700; font-size: 16px; }
.mf-event__unter { font-size: 14px; color: var(--mf-text-2); }

/* ---------- Zimmer ---------- */
.mf-zimmer { background: var(--mf-flaeche); border-radius: var(--mf-radius); overflow: hidden; }
.mf-zimmer__preis { font-weight: 700; color: var(--mf-mosel); white-space: nowrap; }
.mf-zimmer__text { font-size: 15px; color: var(--mf-text-2); }
.mf-zimmer__text p { margin: 0 0 8px; }
.mf-zimmer__stand { margin: 0; font-size: 13px; color: var(--mf-text-2); }
.mf-ausstattung { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 14px; color: var(--mf-text-2); }
.mf-ausstattung li::before { content: "✓ "; color: var(--mf-ok); font-weight: 700; }

.mf-galerie { position: relative; }
.mf-galerie__spur { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.mf-galerie__spur::-webkit-scrollbar { display: none; }
.mf-galerie__bild { flex: 0 0 100%; margin: 0; scroll-snap-align: start; }
.mf-galerie__bild img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.mf-galerie__punkte { position: absolute; left: 0; right: 0; bottom: 10px; display: flex; justify-content: center; gap: 6px; pointer-events: none; }
.mf-galerie__punkte span { width: 8px; height: 8px; border-radius: 50%; background: rgba(255, 255, 255, .55); box-shadow: 0 0 0 1px rgba(0, 0, 0, .15); }
.mf-galerie__punkte span.is-aktiv { background: #fff; }

.mf-zimmer__kalender summary { display: flex; align-items: center; gap: 6px; min-height: 44px; cursor: pointer; font-weight: 700; color: var(--mf-mosel); list-style: none; }
.mf-zimmer__kalender summary::-webkit-details-marker { display: none; }
.mf-zimmer__kalender summary::after { content: "▾"; margin-left: auto; }
.mf-zimmer__kalender[open] summary::after { content: "▴"; }
.mf-kal { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; padding-top: 4px; }
.mf-kal__titel { font-weight: 700; margin-bottom: 6px; }
.mf-kal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; text-align: center; font-size: 13px; }
.mf-kal__wt { font-size: 11px; color: var(--mf-text-2); font-weight: 600; }
.mf-kal__tag { padding: 6px 0; border-radius: 6px; background: var(--mf-ok-hell); color: var(--mf-ok); font-weight: 600; }
.mf-kal__tag.is-belegt { background: var(--mf-rot-hell); color: var(--mf-rot); text-decoration: line-through; }
.mf-kal__tag.is-vorbei { background: transparent; color: #A0A6A7; }
.mf-kal__tag.is-heute { box-shadow: inset 0 0 0 2px var(--mf-mosel); }
.mf-kal__legende { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--mf-text-2); margin: 8px 0 0; }
.mf-kal__punkt { width: 12px; height: 12px; border-radius: 3px; background: var(--mf-ok-hell); border: 1px solid #B9DCC3; display: inline-block; }
.mf-kal__punkt.is-belegt { background: var(--mf-rot-hell); border-color: #EBB8B8; margin-left: 10px; }

/* ---------- Betriebsseite ---------- */
.mf-titelbild { margin: 0 16px 12px; border-radius: var(--mf-radius); overflow: hidden; }
.mf-titelbild img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.mf-titelbild--ort { position: relative; }
.mf-titelbild__ort { position: absolute; left: 12px; bottom: 12px; padding: 5px 12px; border-radius: 999px; background: rgba(7, 57, 84, .82); color: #fff; font: 600 13px/1.3 var(--mf-text, sans-serif); }
.mf-text { font-size: 16px; }
.mf-text > :first-child { margin-top: 0; }
.mf-zeiten { width: 100%; border-collapse: collapse; background: var(--mf-flaeche); border-radius: 16px; overflow: hidden; }
.mf-zeiten th, .mf-zeiten td { text-align: left; padding: 10px 14px; border-bottom: 1px solid var(--mf-linie); font-weight: 400; }
.mf-zeiten tr:last-child th, .mf-zeiten tr:last-child td { border-bottom: 0; }
.mf-zeiten tr.is-heute { background: var(--mf-mosel-hell); font-weight: 700; }
.mf-zeiten tr.is-heute th { font-weight: 700; }
.mf-adresse { font-style: normal; margin-top: 10px; color: var(--mf-text-2); }
.mf-fakten { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; margin: 0; padding: 14px 16px; background: var(--mf-flaeche); border-radius: 16px; }
.mf-fakten dt { font-weight: 700; }
.mf-fakten dd { margin: 0; }

/* ---------- Karte ---------- */
.mf-filter { display: flex; gap: 8px; padding: 0 16px 12px; overflow-x: auto; scrollbar-width: none; }
.mf-filter__chip { flex: none; min-height: 40px; padding: 8px 14px; border-radius: 999px; border: 1px solid #CFC8B8; background: var(--mf-flaeche); color: var(--mf-text); font: 600 14px var(--mf-body); cursor: pointer; }
.mf-filter__chip.is-aktiv { background: var(--mf-mosel); border-color: var(--mf-mosel); color: #fff; }
.mf-karte-wrap { position: relative; margin: 0 16px 16px; }
.mf-karte-box { height: 62vh; min-height: 360px; border-radius: var(--mf-radius); overflow: hidden; background: #DDE3DC; z-index: 0; }
.mf-karte-box--klein { height: 240px; min-height: 0; }
.mf-karte-ortung {
	position: absolute; right: 12px; bottom: 28px; z-index: 500;
	display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 8px 14px;
	border: 0; border-radius: 999px; background: #fff; color: var(--mf-mosel);
	font: 700 14px var(--mf-body); box-shadow: 0 2px 10px rgba(0, 0, 0, .18); cursor: pointer;
}
.mf-pin-wrap { background: none; border: 0; }
.mf-pin {
	display: block; width: 28px; height: 28px; margin: 0 auto;
	background: var(--pin); border: 3px solid #fff; border-radius: 50% 50% 50% 0;
	transform: rotate(-45deg); box-shadow: 0 2px 6px rgba(0, 0, 0, .3); position: relative;
}
.mf-pin__punkt { position: absolute; top: 6px; left: 6px; width: 10px; height: 10px; border-radius: 50%; background: #7CE0A0; }
.mf-ich-wrap { background: none; border: 0; }
.mf-ich { display: block; width: 22px; height: 22px; border-radius: 50%; background: #2D6CDF; border: 3px solid #fff; box-shadow: 0 0 0 6px rgba(45, 108, 223, .25); }
.mf-popup-status { font-weight: 700; font-size: 13px; }
.mf-popup-status--offen, .mf-popup-status--frei { color: var(--mf-ok); }
.mf-popup-status--zu, .mf-popup-status--belegt { color: var(--mf-rot); }
.leaflet-container { font-family: var(--mf-body); }
.leaflet-popup-content { font-size: 15px; }

.mf-naehe, .mf-ortliste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.mf-naehe li { display: flex; justify-content: space-between; gap: 12px; padding: 12px 14px; background: var(--mf-flaeche); border-radius: 14px; }
.mf-naehe a { font-weight: 700; text-decoration: none; }
.mf-naehe span { font-size: 13px; color: var(--mf-text-2); white-space: nowrap; }

.mf-ortliste__link { display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 12px 16px; background: var(--mf-flaeche); border-radius: 14px; text-decoration: none; color: var(--mf-text); }
.mf-ortliste__name { font-family: var(--mf-display); font-weight: 600; font-size: 18px; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.mf-ortliste__hier { font-family: var(--mf-body, inherit); font-size: 12px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: #6E831E; }
.mf-ortliste__hier[hidden] { display: none; }
.mf-ortliste__item.is-hier .mf-ortliste__link { box-shadow: inset 0 0 0 2px #6E831E; }

/* ---------- Unteres Menü ---------- */
.mf-tabbar {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 1000;
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
	padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
	background: var(--mf-flaeche); border-top: 1px solid var(--mf-linie);
}
.mf-tabbar__link {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
	min-height: 52px; border: 0; background: none; cursor: pointer;
	font: 600 12px var(--mf-body); color: var(--mf-text-2); text-decoration: none;
}
.mf-tabbar__link.is-aktiv { color: var(--mf-mosel); font-weight: 700; }

/* ---------- „Wo bin ich?“ ---------- */
.mf-sheet {
	width: min(520px, 100% - 24px); margin: auto auto 12px; padding: 22px 20px 20px;
	border: 0; border-radius: 22px; background: var(--mf-flaeche); color: var(--mf-text);
	box-shadow: 0 10px 40px rgba(0, 0, 0, .25);
}
.mf-sheet::backdrop { background: rgba(18, 51, 53, .45); }
.mf-sheet__schliessen-form { position: absolute; right: 10px; top: 10px; margin: 0; }
.mf-sheet__schliessen { width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--mf-flaeche-2); font-size: 24px; line-height: 1; cursor: pointer; color: var(--mf-text); }
.mf-sheet__titel { font-size: 22px; font-weight: 800; margin-bottom: 12px; }
.mf-sheet__label { margin: 0; color: var(--mf-text-2); font-size: 14px; }
.mf-sheet__ort { margin: 2px 0; font-family: var(--mf-display); font-weight: 800; font-size: 28px; color: var(--mf-mosel); }
.mf-sheet__distanz { margin: 0 0 14px; color: var(--mf-text-2); font-size: 14px; }
.mf-sheet__status { color: var(--mf-text-2); }
.mf-sheet__weitere { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 15px; }
.mf-sheet__weitere li { display: flex; justify-content: space-between; gap: 8px; }
.mf-sheet__weitere span { color: var(--mf-text-2); font-size: 13px; }

/* ---------- Fuß ---------- */
.mf-fuss { max-width: 720px; margin: 8px auto 0; padding: 16px; text-align: center; font-size: 13px; color: var(--mf-text-2); }
.mf-fuss__menu { list-style: none; margin: 0 0 6px; padding: 0; display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }
.mf-fuss__copy { margin: 0; }

/* ---------- Größere Bildschirme ---------- */
@media (min-width: 720px) {
	.mf-kacheln { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.mf-hero__titel { font-size: 40px; }
	.mf-liste--grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; scroll-behavior: auto !important; }
}

/* ---------- Veranstaltung melden ---------- */
.mf-tipp--melden { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; margin-top: 8px; }
.mf-tipp--melden p { margin: 0 0 8px; }
.mf-seite .mf-melden { margin-top: 8px; }

/* Ortsliste gekürzt */
.mf-ortliste.is-gekuerzt > li:nth-child(n+7) { display: none; }
.mf-mehr { display: block; width: 100%; margin-top: 10px; min-height: 48px; border: 2px solid var(--mf-linie); border-radius: 14px; background: transparent; color: var(--mf-mosel); font: 600 16px/1.2 var(--mf-body); cursor: pointer; }
.mf-mehr:hover { background: var(--mf-flaeche); }

/* App-Tipp */
.mf-tipp--app { display: flex; gap: 14px; align-items: flex-start; }
.mf-tipp__icon { flex: none; width: 56px; height: 56px; border-radius: 14px; box-shadow: 0 1px 4px rgba(0,0,0,.15); }
.mf-tipp__inhalt { flex: 1; min-width: 0; }
.mf-tipp--app .mf-button { margin-top: 10px; }
.mf-anleitung { margin-top: 10px; font-size: 15px; color: #3D4A4C; }
.mf-anleitung ol { margin: 0; padding-left: 20px; display: grid; gap: 6px; }
.mf-anleitung svg { vertical-align: -3px; color: var(--mf-mosel); }
.mf-ist-app .mf-tipp--app { display: none; }

/* ==================================================================
   Look der „Bald online“-Seite: dunkle Bühne mit Mosel-Schleife
   ================================================================== */
:root { --mf-tief: #042637; --mf-oliv: #6E831E; --mf-oliv-hell: #C6D96A; }
html, body { overflow-x: clip; }

/* Kopf: dunkles Band über die ganze Breite */
.mf-kopf-band { position: relative; z-index: 20; background: linear-gradient(180deg, #031c29 0%, var(--mf-tief) 100%); border-bottom: 1px solid rgba(198,217,106,.28); box-shadow: 0 8px 24px rgba(0,0,0,.38), 0 2px 6px rgba(0,0,0,.25); }
.mf-kopf { padding: max(14px, env(safe-area-inset-top)) 16px 12px; }
.mf-logo__bild { height: 46px; max-width: 58vw; object-fit: contain; object-position: left center; }
@media (min-width: 720px) { .mf-logo__bild { height: 60px; max-width: none; } }
.mf-main { min-height: 55vh; }
.mf-kopf__ortung { background: rgba(255,255,255,.1); color: #fff; border: 1px solid rgba(255,255,255,.16); }
.mf-kopf__ortung:hover { background: rgba(255,255,255,.18); }
.mf-kopf__ortung svg { color: var(--mf-oliv-hell); }

/* Bühne (Start- und Ortsseite) */
.mf-buehne {
	position: relative; overflow: hidden; color: #fff;
	margin-inline: calc(50% - 50vw); padding: 8px max(16px, calc(50vw - 344px)) 64px;
	background:
		radial-gradient(70% 60% at 85% 55%, rgba(14,81,116,.75) 0%, rgba(14,81,116,0) 70%),
		linear-gradient(180deg, var(--mf-mosel) 0%, #05304A 55%, var(--mf-tief) 100%);
}
.mf-buehne__fluss { position: absolute; left: -10%; right: -10%; bottom: -8%; width: 120%; height: 55%; pointer-events: none; }
.mf-buehne__inhalt { position: relative; }
.mf-status {
	display: flex; align-items: center; gap: 6px; width: max-content; max-width: 100%;
	margin: 18px 0 14px; padding: 6px 12px; border-radius: 999px;
	background: rgba(198,217,106,.14); color: var(--mf-oliv-hell); font-weight: 600; font-size: 14px;
}
.mf-buehne__titel { font: 800 clamp(34px, 9vw, 56px)/1.03 var(--mf-display); letter-spacing: -.02em; margin: 0 0 14px; }
.mf-buehne__titel span { color: var(--mf-oliv-hell); }
.mf-buehne__text { margin: 0 0 20px; font-size: clamp(17px, 2.4vw, 19px); line-height: 1.5; color: #D5E2EA; max-width: 34em; }
.mf-buehne .mf-button--hell { margin-top: 2px; }

/* Kacheln als Glas auf der Bühne */
.mf-buehne .mf-kacheln { padding: 4px 0 0; gap: 10px; }
.mf-buehne .mf-kachel {
	background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); color: #fff;
	min-height: 118px; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.mf-buehne .mf-kachel:hover { background: rgba(255,255,255,.12); }
.mf-buehne .mf-kachel__icon { background: rgba(198,217,106,.14) !important; color: var(--mf-oliv-hell) !important; }
.mf-buehne .mf-kachel__titel { color: #fff; }
.mf-buehne .mf-kachel__info { color: #B9CCD8; }
.mf-buehne .mf-kachel__info--ok { color: var(--mf-oliv-hell); }
.mf-buehne .mf-kachel__info--ok::before { background: var(--mf-oliv-hell); }
.mf-buehne .mf-kachel:focus-visible { outline-color: var(--mf-oliv-hell); }

/* Inhalt unter der Bühne rückt als Karte leicht nach oben */
.mf-buehne + .mf-abschnitt { position: relative; margin-top: -28px; padding-top: 22px; background: var(--mf-grund); border-radius: 22px 22px 0 0; }

/* Ortsliste: aktiver Ort in Oliv */
.mf-ortliste__item.is-hier .mf-ortliste__link { box-shadow: inset 0 0 0 2px var(--mf-oliv); }

/* Fuß wie auf der „Bald online“-Seite */
.mf-fuss { max-width: none; margin: 24px 0 0; padding: 22px 16px 26px; background: var(--mf-tief); color: #9DB4C2; }
.mf-fuss a { color: #D5E2EA; text-decoration: none; }
.mf-fuss a:hover { text-decoration: underline; color: #fff; }

/* Betriebsgalerie (Titelbild + weitere Bilder) */
.mf-galerie--titel .mf-galerie__bild img { aspect-ratio: 16 / 9; }
.mf-galerie__pfeil { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(255,255,255,.9); color: var(--mf-tief, #042637); display: none; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 10px rgba(0,0,0,.25); }
.mf-galerie__pfeil--zurueck { left: 12px; }
.mf-galerie__pfeil--weiter { right: 12px; }
.mf-galerie__pfeil--weiter svg { transform: scaleX(-1); }
.mf-galerie__pfeil:hover { background: #fff; }
.mf-galerie__pfeil:focus-visible { outline: 3px solid var(--mf-oliv, #6E831E); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .mf-galerie__pfeil { display: inline-flex; } }

/* Hervorhebung (Tarif) */
.mf-karte--tipp { box-shadow: 0 0 0 2px var(--mf-oliv, #6E831E); }
.mf-tipp-marke { display: inline-block; vertical-align: middle; margin-left: 4px; padding: 2px 8px; border-radius: 999px; background: var(--mf-oliv, #6E831E); color: #fff; font: 700 11px/1.4 var(--mf-text, sans-serif); letter-spacing: .04em; text-transform: uppercase; }
.mf-entwurf-marke { display: inline-block; vertical-align: middle; margin-left: 4px; padding: 2px 8px; border-radius: 999px; background: #E9E5DC; color: #5A4A1E; border: 1px dashed #B9A66A; font: 700 11px/1.4 var(--mf-text, sans-serif); letter-spacing: .04em; text-transform: uppercase; }

/* ==================================================================
   Buchungsanfrage (Formular auf der Betriebsseite)
   ================================================================== */
.mf-anfrage { background: var(--mf-flaeche); border-radius: var(--mf-radius); padding: 18px 16px 16px; display: flex; flex-direction: column; gap: 12px; box-shadow: 0 0 0 2px var(--mf-gold-hell); }
.mf-anfrage .mf-abschnitt__titel { margin-bottom: 0; }
.mf-anfrage__intro { margin: 0; color: var(--mf-text-2); font-size: 15px; }
.mf-anfrage__raster { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.mf-feld { display: flex; flex-direction: column; gap: 4px; font-size: 14px; font-weight: 700; color: var(--mf-text); min-width: 0; }
.mf-feld--breit { grid-column: 1 / -1; }
.mf-feld input, .mf-feld select, .mf-feld textarea { width: 100%; min-height: 46px; padding: 10px 12px; border: 1.5px solid #D6CFBF; border-radius: 12px; background: #FBFAF6; font: 400 16px var(--mf-body); color: var(--mf-text); }
.mf-feld textarea { min-height: 84px; resize: vertical; }
.mf-feld input:focus, .mf-feld select:focus, .mf-feld textarea:focus { outline: none; border-color: var(--mf-mosel); background: #fff; box-shadow: 0 0 0 4px rgba(7, 57, 84, .12); }
.mf-feld [aria-invalid="true"], .mf-check [aria-invalid="true"] { border-color: var(--mf-rot); }
.mf-anfrage__fehler { color: var(--mf-rot); font-size: 13px; font-weight: 600; }
.mf-anfrage__fehler--block { margin: 0; padding: 10px 12px; border-radius: 12px; background: var(--mf-rot-hell); }
.mf-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--mf-text-2); }
.mf-check input { width: 20px; height: 20px; margin-top: 1px; flex: none; accent-color: var(--mf-mosel); }
.mf-anfrage__hinweis { margin: 0; font-size: 13px; color: var(--mf-text-2); text-align: center; }
.mf-anfrage__honig { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.mf-anfrage--danke { text-align: center; align-items: center; }
.mf-anfrage__haken { width: 52px; height: 52px; border-radius: 50%; background: var(--mf-ok-hell); color: var(--mf-ok); font: 800 26px/52px var(--mf-display); }
.mf-zimmer .mf-button--gold { align-self: flex-start; }
@media (max-width: 420px) { .mf-anfrage__raster { grid-template-columns: 1fr; } }

/* ==================================================================
   PC / Desktop: breiter, Navigation im Kopf, Liste + Karte nebeneinander
   ================================================================== */
.mf-kopfnav { display: none; }
.mf-split { padding: 0 16px 16px; }
.mf-split--karte { padding: 0; }
.mf-split--ort .mf-split__karte { display: none; }
.mf-kartenliste { display: none; }

@media (min-width: 1024px) {
	body.mf-hat-tabbar { padding-bottom: 0; }
	.mf-tabbar { display: none; }
	.mf-main, .mf-kopf { max-width: 1240px; }
	.mf-kopf { padding-left: 24px; padding-right: 24px; }
	.mf-buehne { padding-left: max(24px, calc(50vw - 596px)); padding-right: max(24px, calc(50vw - 596px)); }
	.mf-abschnitt { padding-left: 24px; padding-right: 24px; }
	.mf-seitenkopf { padding-left: 16px; }
	.mf-listenkopf { padding-left: 24px; padding-right: 24px; }

	.mf-kopfnav { display: flex; align-items: center; gap: 4px; margin-left: auto; }
	.mf-kopfnav__link { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 14px; border-radius: 999px; color: #D5E2EA; font-weight: 600; font-size: 15px; text-decoration: none; }
	.mf-kopfnav__link:hover, .mf-kopfnav__link.is-aktiv { background: rgba(255,255,255,.1); color: #fff; }
	.mf-kopfnav__link--hell { background: var(--mf-oliv-hell); color: var(--mf-tief); margin-left: 6px; }
	.mf-kopfnav__link--hell:hover { background: #fff; color: var(--mf-tief); }

	/* Startseite: Orte als Raster */
	.mf-ortliste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
	.mf-ortliste.is-gekuerzt > li:nth-child(n+7) { display: block; }
	.mf-ortliste + .mf-mehr { display: none; }
	.mf-kacheln { max-width: 900px; }

	/* Liste links, Karte rechts */
	.mf-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 24px; align-items: start; padding: 0 24px 24px; }
	.mf-split__karte { position: sticky; top: 16px; }
	.mf-split--ort .mf-split__karte { display: block; }
	.mf-split--ort .mf-karte-box { height: calc(100vh - 32px); min-height: 480px; }
	.mf-split--ort .mf-liste { display: grid; grid-template-columns: 1fr; }

	.mf-split--karte { grid-template-columns: 400px minmax(0, 1fr); }
	.mf-split--karte .mf-filter { padding: 0 0 12px; flex-wrap: wrap; }
	.mf-split--karte .mf-karte-wrap { margin: 0; }
	.mf-split--karte .mf-karte-box { height: calc(100vh - 32px); min-height: 520px; }
	.mf-split--karte .mf-split__liste { max-height: calc(100vh - 32px); overflow-y: auto; position: sticky; top: 16px; padding-right: 4px; }
	.mf-kartenliste { display: block; }
	.mf-kartenliste[hidden] { display: none; }
	.mf-kartenliste__zahl { margin: 0 0 8px; font-size: 14px; color: var(--mf-text-2); font-weight: 600; }
	.mf-kartenliste__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
	.mf-kartenliste__link { display: flex; gap: 12px; align-items: flex-start; padding: 10px; border-radius: 14px; background: var(--mf-flaeche); color: var(--mf-text); text-decoration: none; }
	.mf-kartenliste__link img, .mf-kartenliste__platz { width: 64px; height: 64px; flex: none; border-radius: 10px; object-fit: cover; background: var(--mf-mosel-hell); }
	.mf-kartenliste__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
	.mf-kartenliste__text strong { font-size: 16px; }
	.mf-kartenliste__ort { font-size: 13px; color: var(--mf-text-2); }
	.mf-kartenliste__kurz { font-size: 14px; color: var(--mf-text-2); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

	[data-mf-id] { transition: box-shadow .15s ease; }
	[data-mf-id]:hover > .mf-kartenliste__link, .mf-karte[data-mf-id]:hover, [data-mf-id].is-markiert, [data-mf-id].is-markiert > .mf-kartenliste__link { box-shadow: 0 0 0 2px var(--mf-mosel); }

	/* Betriebsseite: Inhalt links, Anfrage rechts mitlaufend */
	.mf-betrieb { display: grid; grid-template-columns: minmax(0, 1fr) 400px; column-gap: 24px; padding: 0 24px; }
	.mf-betrieb > * { grid-column: 1; }
	.mf-betrieb > .mf-betrieb__seite { grid-column: 2; grid-row: 1 / span 20; position: sticky; top: 16px; align-self: start; }
	.mf-betrieb__seite .mf-abschnitt { padding: 0; }
	.mf-betrieb .mf-abschnitt { padding-left: 0; padding-right: 0; }
	.mf-betrieb .mf-titelbild { margin-left: 0; margin-right: 0; }
	.mf-liste--zimmer { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mf-nur-mobil { display: none; }

	/* Einstellung „Karte neben Listen“ aus */
	.mf-ohne-split .mf-split--ort { display: block; }
	.mf-ohne-split .mf-split--ort .mf-split__karte { display: none; }
}
.mf-pin-wrap.is-hervor .mf-pin { transform: rotate(-45deg) scale(1.3); box-shadow: 0 0 0 4px rgba(198,217,106,.9), 0 2px 8px rgba(0,0,0,.35); }
.mf-fuss__copy a { color: var(--mf-oliv-hell); }

/* Kacheln wackeln beim Drüberfahren (Maus) und beim Antippen (Touch) */
@keyframes mf-wackeln {
	0%, 100% { transform: rotate(0); }
	20% { transform: rotate(-1.6deg); }
	40% { transform: rotate(1.4deg); }
	60% { transform: rotate(-.9deg); }
	80% { transform: rotate(.5deg); }
}
@media (hover: hover) and (pointer: fine) {
	.mf-ortliste__link:hover, .mf-kachel:hover { animation: mf-wackeln .45s ease-in-out; }
}
.mf-ortliste__link.is-wackeln, .mf-kachel.is-wackeln { animation: mf-wackeln .45s ease-in-out; }
@media (prefers-reduced-motion: reduce) {
	.mf-ortliste__link, .mf-kachel { animation: none !important; }
}

/* Wappen der Orte */
.mf-ortliste__wappen { width: 40px; height: 40px; flex: none; object-fit: contain; }
.mf-ortliste__wappen--leer { display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; background: var(--mf-mosel-hell); color: var(--mf-mosel); }
.mf-buehne__kopf { display: flex; align-items: center; gap: 16px; }
.mf-buehne__wappen { width: clamp(56px, 12vw, 88px); height: auto; max-height: 104px; object-fit: contain; flex: none; filter: drop-shadow(0 2px 6px rgba(0,0,0,.35)); }

/* ==================================================================
   Sprachen, Grundbestand, Weiter am Radweg, Infopunkte, Plaketten, Offline
   ================================================================== */
.mf-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mf-sprachen ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 2px; }
.mf-sprachen a { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 36px; padding: 4px 8px; border-radius: 999px; font: 700 13px var(--mf-body); letter-spacing: .04em; text-decoration: none; }
.mf-sprachen--kopf { display: none; }
.mf-sprachen--kopf a { color: #B9CCD8; }
.mf-sprachen--kopf a:hover, .mf-sprachen--kopf a.is-aktiv { color: #fff; background: rgba(255,255,255,.1); }
@media (min-width: 720px) { .mf-sprachen--kopf { display: block; margin-left: auto; } .mf-kopfnav + .mf-sprachen--kopf { margin-left: 4px; } }
.mf-sprachen--fuss { display: flex; justify-content: center; margin: 0 0 10px; }
.mf-sprachen--fuss a { color: #D5E2EA; }
.mf-sprachen--fuss a.is-aktiv { background: rgba(255,255,255,.12); color: #fff; text-decoration: none; }

.mf-gb { margin: 18px 0 0; padding: 14px 16px; border-radius: 14px; background: var(--mf-flaeche-2); font-size: 15px; }
.mf-gb__text { margin: 0 0 8px; color: var(--mf-text-2); }
.mf-gb__links { margin: 0; display: flex; flex-wrap: wrap; gap: 6px 16px; }
.mf-gb__los { font-weight: 700; color: var(--mf-mosel); }
.mf-gb__weg { color: var(--mf-text-2); font-size: 14px; }

.mf-weiter__intro { margin: 0 0 12px; color: var(--mf-text-2); }
.mf-weiter__wahl { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--mf-flaeche-2); margin-bottom: 12px; max-width: 100%; overflow-x: auto; }
.mf-weiter__tab { border: 0; background: none; min-height: 40px; padding: 6px 14px; border-radius: 999px; font: 600 15px var(--mf-body); color: var(--mf-text-2); cursor: pointer; white-space: nowrap; }
.mf-weiter__tab[aria-selected="true"] { background: var(--mf-flaeche); color: var(--mf-mosel); box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.mf-weiter__liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.mf-weiter__liste[hidden], .mf-plakette-melden[hidden], .mf-offline[hidden] { display: none; }
.mf-weiter__ort { display: grid; grid-template-columns: 86px 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: center; padding: 12px 14px; border-radius: 14px; background: var(--mf-flaeche); color: var(--mf-text); text-decoration: none; box-shadow: 0 1px 3px rgba(18,51,53,.06); }
.mf-weiter__ort:hover { box-shadow: 0 3px 12px rgba(18,51,53,.12); }
.mf-weiter__km { grid-row: span 2; white-space: nowrap; font: 800 15px var(--mf-display); color: var(--mf-mosel); background: var(--mf-mosel-hell); border-radius: 10px; text-align: center; padding: 8px 4px; }
.mf-weiter__name { font-weight: 700; font-size: 17px; }
.mf-weiter__frei { font-size: 14px; color: var(--mf-text-2); }
.mf-weiter__frei.is-frei { color: var(--mf-ok); font-weight: 600; }
.mf-weiter__hinweis { margin: 10px 0 0; font-size: 13px; color: var(--mf-text-2); }

.mf-infopin { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: var(--pin, #073954); color: #fff; font: 700 10px/1 var(--mf-body); border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.3); }
.mf-infopin-wrap { background: none; border: 0; }
.mf-popup-typ { font-size: 13px; color: var(--mf-text-2); }
.mf-unterwegs__liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.mf-unterwegs__punkt { display: grid; grid-template-columns: 30px 1fr; gap: 4px 10px; align-items: start; padding: 12px 14px; border-radius: 14px; background: var(--mf-flaeche); }
.mf-unterwegs__text { display: grid; gap: 2px; }
.mf-unterwegs__meta { font-size: 14px; color: var(--mf-text-2); }
.mf-unterwegs__info { font-size: 14px; }
.mf-unterwegs__aktionen { grid-column: 2; display: flex; gap: 4px; margin-left: -8px; }
.leaflet-control-layers { border-radius: 12px !important; font: 600 13px var(--mf-body); }

.mf-plakette-melden { margin: 0 16px 16px; padding: 12px 16px; border-radius: 14px; background: var(--mf-flaeche); font-size: 15px; }
.mf-plakette-melden summary { cursor: pointer; font-weight: 600; color: var(--mf-mosel); min-height: 32px; }
.mf-plakette-melden form { display: grid; gap: 8px; margin-top: 10px; }
.mf-plakette-melden fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: 4px; }
.mf-plakette-melden legend { font-weight: 600; margin-bottom: 4px; }
.mf-plakette-melden textarea { font: inherit; padding: 8px 10px; border: 1px solid var(--mf-linie); border-radius: 10px; }
.mf-plakette-melden__hp { position: absolute; left: -9999px; }
.mf-plakette-melden__antwort { margin: 8px 0 0; font-weight: 600; color: var(--mf-ok); }

.mf-offline { position: fixed; left: 12px; right: 12px; bottom: calc(var(--mf-tabbar-h) + 12px + env(safe-area-inset-bottom)); z-index: 60; padding: 10px 14px; border-radius: 12px; background: #3D2A00; color: #FFE9B8; font-weight: 600; font-size: 14px; text-align: center; box-shadow: 0 4px 16px rgba(0,0,0,.25); }
@media (min-width: 1024px) { .mf-offline { bottom: 16px; left: auto; max-width: 420px; } }
@media (min-width: 1024px) { .mf-weiter__liste, .mf-unterwegs__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mf-bildnachweis { margin: 4px 16px 0; font-size: 12px; color: var(--mf-text-2); }
.mf-bildnachweis a { color: inherit; }
.mf-karte__nachweis { margin: 0; padding: 3px 14px 0; font-size: 11px; line-height: 1.35; color: var(--mf-text-2); }
.mf-karte__nachweis a { color: inherit; }

/* ---------- Etappenplaner ---------- */
.mf-etappen-form { background: var(--mf-flaeche); border-radius: var(--mf-radius); padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.mf-etappen-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.mf-etappen-form__grid [hidden] { display: none; }
@media (max-width: 520px) { .mf-etappen-form__grid { grid-template-columns: 1fr; } }
.mf-etappen-km { display: flex; align-items: center; gap: 10px; min-height: 46px; }
.mf-etappen-km input[type=range] { flex: 1; min-height: 0; padding: 0; border: 0; background: none; accent-color: var(--mf-mosel); box-shadow: none; }
.mf-etappen-km output { font-weight: 700; min-width: 58px; text-align: right; color: var(--mf-mosel); }
.mf-etappen-summe { display: flex; flex-direction: column; gap: 10px; }
.mf-etappen-summe__zahlen { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.mf-etappen-summe__zahlen > div { background: var(--mf-mosel); color: #fff; border-radius: 16px; padding: 12px 14px; display: flex; flex-direction: column; }
.mf-etappen-summe__zahlen strong { font-family: var(--mf-display); font-size: 26px; line-height: 1.1; }
.mf-etappen-summe__zahlen span { font-size: 13px; color: #C9DAE5; font-weight: 600; }
.mf-etappen-summe__strecke { margin: 0; font-weight: 700; font-size: 17px; }
.mf-etappen-summe__aktionen { display: flex; gap: 8px; flex-wrap: wrap; }
.mf-etappe { position: relative; }
.mf-etappe > * { position: relative; }
.mf-etappe__kopf { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; align-items: end; margin-bottom: 10px; }
.mf-etappe__tag { grid-column: 1 / -1; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--mf-oliv, #6E831E); }
.mf-etappe__titel { font-weight: 800; font-size: 21px; }
.mf-etappe__titel a { color: inherit; text-decoration: none; }
.mf-etappe__titel a:hover { text-decoration: underline; }
.mf-etappe__km { font-weight: 800; font-family: var(--mf-display); font-size: 18px; color: var(--tag, var(--mf-mosel)); white-space: nowrap; }
.mf-etappen-karte { height: 340px; margin-top: 14px; border-radius: 16px; overflow: hidden; background: #E3E9EA; z-index: 0; }
.mf-etappen-karte__quelle { margin: 6px 2px 0; font-size: 12px; color: var(--mf-text-leise, #5B6769); }
.mf-etappe__route { margin: 8px 0 0; }
.mf-etappe__route a { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.mf-etappen-ziel { background: #fff; border: 3px solid var(--f, #073954); border-radius: 50%; width: 14px; height: 14px; box-sizing: border-box; }
.mf-etappen-ziel--start { background: var(--f, #073954); }
@media (min-width: 760px) { .mf-etappen-karte { height: 440px; } }
@media print { .mf-etappen-karte { height: 300px; break-inside: avoid; } .mf-etappe__route { display: none; } }
.mf-etappe__intro { margin: 0 0 8px; color: var(--mf-text-2); }
.mf-etappe__orte { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.mf-etappe__orte li.is-beste .mf-weiter__ort { box-shadow: inset 0 0 0 2px var(--mf-oliv, #6E831E); }
.mf-etappe__tipp { font-style: normal; font-size: 12px; font-weight: 700; background: var(--mf-gold-hell); color: var(--mf-gold-text); border-radius: 999px; padding: 2px 8px; margin-left: 4px; }
.mf-etappe__unterwegs { margin: 0 0 8px; font-size: 15px; line-height: 1.5; }
.mf-etappe__infos { list-style: none; margin: 8px 0 12px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.mf-etappe__infos > li { display: flex; gap: 10px; align-items: flex-start; }
.mf-etappe__infotext { display: flex; flex-direction: column; gap: 2px; font-size: 15px; min-width: 0; }
.mf-etappe__infoart { font-size: 12px; font-weight: 700; color: var(--mf-text-2); text-transform: uppercase; letter-spacing: .03em; }
.mf-etappe__infotext details summary { cursor: pointer; }
.mf-etappe__infotext details span { display: block; font-size: 14px; color: var(--mf-text-2); margin: 4px 0 6px; line-height: 1.45; }
.mf-etappe__chips { flex-wrap: wrap; }
.mf-etappe__chip { display: inline-flex; align-items: center; gap: 6px; background: var(--mf-flaeche); border-radius: 999px; padding: 4px 10px 4px 4px; font-size: 13px; font-weight: 600; margin: 0 6px 6px 0; }
.mf-infopin--klein { width: 22px; height: 22px; font-size: 9px; }
.mf-etappe__nacht { background: var(--mf-flaeche); border-radius: var(--mf-radius); padding: 14px 16px; }
.mf-etappe__nacht-kopf { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; color: var(--mf-mosel); }
.mf-etappe__nacht-kopf strong { color: var(--mf-text); }
.mf-etappe__nacht-kopf .mf-weiter__frei { margin-left: auto; }
.mf-etappe__gastgeber { list-style: none; margin: 10px 0 4px; padding: 0; }
.mf-etappe__gastgeber li { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid var(--mf-linie); }
.mf-etappe__gastgeber a { font-weight: 600; text-decoration: none; }
.mf-etappe__status { font-size: 13px; font-weight: 700; border-radius: 999px; padding: 2px 10px; white-space: nowrap; align-self: center; }
.mf-etappe__status.is-frei { background: var(--mf-ok-hell); color: var(--mf-ok); }
.mf-etappe__status.is-unbekannt { background: var(--mf-mosel-hell); color: var(--mf-mosel); }
.mf-etappe__status.is-belegt { background: var(--mf-rot-hell); color: var(--mf-rot); }
.mf-weiter__frei.is-offen { color: var(--mf-mosel); }
.mf-weiter__frei.is-voll { color: var(--mf-rot); }
.mf-etappe__alt { margin: 8px 0 0; font-size: 14px; color: var(--mf-text-2); }
.mf-etappe__alt span { color: var(--mf-text-2); }
.mf-etappen-hinweise p { margin: 0 0 8px; }
.mf-weiter__planen { margin-top: 10px; }
@media print {
	.mf-kopf-band, .mf-tabbar, .mf-fuss, .mf-etappen-form, .mf-etappen-summe__aktionen { display: none !important; }
	.mf-etappe { break-inside: avoid; }
	.mf-etappe__infotext details { display: block; }
	.mf-etappe__infotext details span { display: block; }
}

/* Fuß immer unten, auch bei kurzen Seiten */
body { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
body > .mf-main { flex: 1 0 auto; width: 100%; box-sizing: border-box; }
body > .mf-fuss { flex: none; }
.mf-etappen-art { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; background: var(--mf-flaeche-2); padding: 5px; border-radius: 14px; }
.mf-etappen-art label { position: relative; cursor: pointer; }
.mf-etappen-art input { position: absolute; opacity: 0; pointer-events: none; }
.mf-etappen-art span { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; border-radius: 10px; font-weight: 700; font-size: 15px; color: var(--mf-text-2); text-align: center; padding: 4px 8px; }
.mf-etappen-art input:checked + span { background: var(--mf-mosel); color: #fff; }
.mf-etappen-art input:focus-visible + span { outline: 3px solid var(--mf-mosel); outline-offset: 2px; }
.mf-etappe__werte { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0 0 10px; font-weight: 600; color: var(--mf-text-2); }
.mf-etappe__steig { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.mf-etappe__steig li { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mf-etappe__steig a { font-weight: 700; }
.mf-etappe__nr { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; border-radius: 8px; background: var(--mf-gold-hell); color: var(--mf-gold-text); font-weight: 800; font-size: 13px; }
.mf-etappe__meta { font-size: 13px; color: var(--mf-text-2); font-weight: 600; }

/* Hinweis auf Nachbar-Portal (MoselFinder ↔ SaarFinder) */
.mf-portal-hinweis { display: grid; gap: 4px; margin: 14px 0 0; padding: 14px 16px; border-radius: 14px; background: var(--mf-mosel-hell, #E1EBF1); color: var(--mf-text, #1B2426); text-decoration: none; border-left: 5px solid var(--mf-oliv, #6E831E); }
.mf-portal-hinweis strong { font-family: var(--mf-display); font-size: 17px; color: var(--mf-mosel, #073954); }
.mf-portal-hinweis span { font-size: 15px; }
.mf-portal-hinweis:hover strong { text-decoration: underline; }
.mf-fuss__portale { margin: 8px 0 0; font-size: 14px; opacity: .9; }
.mf-fuss__portale a { font-weight: 700; }
.mf-fuss__fluss { opacity: .75; }
@media print { .mf-portal-hinweis { display: none; } }

.mf-etappe__offiziell { margin-left: 6px; font-size: 13px; font-weight: 600; white-space: nowrap; opacity: .8; }