/* Paket 4 – Bedienung: Schriftgröße, kompakter Kopf, Abschnittsleiste und Statuszeile am Handy, Schrittleiste,
   Wetter je Platz, Zustandssymbole, Fokus, Platzfelder, Rückflug/Betankung, Profil-Wischhinweis, Hilfe, Druckteile.
   Lädt nach profil.css. Farben nur über Tokens; Nachtmodus über :root[data-theme="dark"] (styles.css), Druck hell. */

/* ---------- Schriftgröße (D31): alle Bildschirm-Schriftgrößen sind calc(Npx * var(--fs)) ---------- */
:root { --fs: 1; }
@media (max-width: 640px) { :root { --fs: 1.08; } }                 /* Handy: 13 px → 14 px */
html[data-schrift="gross"] { --fs: 1.18; }
@media (max-width: 640px) { html[data-schrift="gross"] { --fs: 1.26; } }
@media print { html, html[data-schrift] { --fs: 1 !important; } }
html[data-schrift="gross"] body { line-height: 1.6; }
@media (min-width: 961px) { html[data-schrift="gross"] .workspace .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
html[data-schrift="gross"] .workspace { grid-template-columns: minmax(360px, 460px) minmax(0, 1fr); }
@media (max-width: 960px) { html[data-schrift="gross"] .workspace { grid-template-columns: 1fr; } }

/* ---------- Kopf (D8): Schrift- und Designknopf im Seitenkopf ---------- */
.kopf-knoepfe { display: flex; align-items: center; gap: 8px; }
.kopf-knoepfe .theme-switch { display: contents; }
.schrift-toggle { display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px 7px 11px; border: 1px solid var(--rule-strong); border-radius: 999px;
  background: var(--surface); color: var(--ink); font: 600 calc(13px * var(--fs, 1))/1 var(--f-display); letter-spacing: .08em; text-transform: uppercase; }
.schrift-icon { font: 700 calc(16px * var(--fs, 1))/1 var(--f-body); letter-spacing: 0; text-transform: none; }
.schrift-icon small { font-size: .72em; margin-left: 1px; }
.schrift-toggle[aria-pressed="true"] { background: var(--sunken); color: var(--text); }
@media (pointer: coarse) { .schrift-toggle { min-height: 44px; } }
@media (max-width: 960px) {
  /* Seitentitel nur für Screenreader: die Bewertung beginnt oben */
  .page-head { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .wrap { padding-block-start: 12px; }
  .site-head__inner { flex-wrap: nowrap; gap: 8px; min-height: 52px; }
  .site-head__logo { min-width: 0; flex: 1 1 auto; margin-right: 0; }
  .site-head__logo b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: calc(18px * var(--fs, 1)); }
  .site-head__meta { display: none; }
  .site-head__nav { display: none; }
  .kopf-knoepfe .theme-text, .kopf-knoepfe .schrift-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .kopf-knoepfe .theme-toggle, .kopf-knoepfe .schrift-toggle { justify-content: center; width: 44px; height: 44px; min-height: 44px; padding: 0; }
}

/* ---------- Abschnittsleiste und Statuszeile (D8/D9), nur Handy/Tablet ---------- */
.mobil-leiste { display: none; }
@media (max-width: 960px) {
  .mobil-leiste { display: block; position: sticky; top: 0; z-index: 850; background: color-mix(in srgb, var(--surface) 96%, transparent);
    border-bottom: 1px solid var(--rule); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  .abschnitte ul { display: flex; gap: 4px; margin: 0; padding: 4px 12px; list-style: none; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }
  .abschnitte ul::-webkit-scrollbar { display: none; }
  .abschnitte li { flex: none; scroll-snap-align: start; }
  .abschnitte a, .abschnitte button { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 999px; border: 1px solid transparent;
    color: var(--text); text-decoration: none; font: 600 calc(13px * var(--fs, 1))/1 var(--f-display); letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; background: none; }
  .abschnitte a[aria-current="location"] { border-color: var(--rule-strong); background: var(--sunken); color: var(--ink); }
  .abschnitte button { color: var(--brand-fg); }
  /* Statuszeile schwebt unter der Leiste: Ein-/Ausblenden verschiebt nichts */
  .status-chip { position: absolute; left: 8px; right: 8px; top: calc(100% + 6px); display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px;
    border-radius: 12px; border: 1px solid var(--rule-strong); background: var(--surface); color: var(--ink); text-align: left; text-transform: none; letter-spacing: 0;
    font: 600 calc(14px * var(--fs, 1))/1.25 var(--f-body); box-shadow: 0 6px 18px -8px rgba(0, 0, 0, .35); }
  .status-chip .status-text { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .status-chip .status-n { padding: 2px 8px; border-radius: 999px; background: var(--sunken); font-family: var(--f-num); }
  .status-chip .status-ziel { color: var(--muted); font-weight: 400; font-size: calc(12px * var(--fs, 1)); white-space: nowrap; }
  .status-chip.bad { border-color: var(--bad); background: var(--bad-bg); color: var(--bad); }
  .status-chip.warn { border-color: var(--warn-line); background: var(--warn-bg); color: var(--warn-ink); }
  .status-chip.ok { border-color: var(--ok-line); background: var(--ok-bg); color: var(--ok); }
  .status-chip.na { border-style: dashed; background: repeating-linear-gradient(135deg, var(--sunken) 0 6px, var(--zinc-50) 6px 12px); }
  body:has(.workspace-side.expanded) .mobil-leiste, html.pf-vollbild-offen .mobil-leiste { display: none; }
  [id^="abschnitt-"] { scroll-margin-top: 108px; }
}

/* ---------- Schrittleiste „So geht's“ (D27 neu, ui-kurz.js/vorbereitung.js) ----------
   Zeile je Schritt: Symbol/Nummer · Titel, Zustand in Worten, Status, was fehlt · Knopf. Zustand nie nur über Farbe:
   Wort („erledigt“, „offen“, „Grenzwert“, „Hinweis“, „wartet“) plus Symbol (✓ ○ ■ ▲ –). */
.schritte { display: grid; gap: 8px; padding: 12px 14px; border: 1px solid var(--rule); border-radius: 12px; background: var(--zinc-50); }
.schritte-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.schritte-stand { color: var(--muted); font-size: calc(13px * var(--fs, 1)); }
.schritte-aktionen { display: flex; gap: 4px; margin-left: auto; }
.schritte-liste { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
/* Feste Höhe je Schritt (zwei Textzeilen, gekürzt mit …): Zustandswechsel durch Wetter/Neuberechnung ändern die Höhe nicht */
.schritt { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 0 10px; padding: 0 10px; height: max(58px, calc(2.7em + 16px));
  border: 1px solid var(--rule); border-radius: 10px; background: var(--surface); font-size: calc(14px * var(--fs, 1)); line-height: 1.35; }
.schritt.auf { height: auto; padding-bottom: 8px; }
.schritt.auf > .schritt-sym, .schritt.auf > .schritt-text, .schritt.auf > .schritt-knopf { align-self: center; margin-top: 7px; }
.schritt-sym { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--rule-strong); color: var(--muted);
  font: 700 calc(13px * var(--fs, 1))/1 var(--f-display); }
.schritt-text { min-width: 0; display: grid; }
.schritt-z1 { display: flex; align-items: center; gap: 6px; min-width: 0; white-space: nowrap; }
.schritt-titel { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.schritt-zustand { flex: none; }
.schritt-z2 { display: block; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--text); }
button.schritt-z2-knopf { min-height: 32px; padding: 0; border: 0; border-radius: 6px; background: none; text-align: left; color: var(--brand-fg);
  text-transform: none; letter-spacing: 0; font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.schritt-titel { color: var(--ink); }
.schritt-zustand { display: inline-block; margin: 0 2px; padding: 0 7px; border: 1px solid currentColor; border-radius: 999px; font-size: calc(12px * var(--fs, 1)); line-height: 1.45; white-space: nowrap; }
.schritt-knopf { min-height: 44px; max-width: 11em; padding: 6px 12px; border-radius: 10px; text-transform: none; letter-spacing: 0; font: 600 calc(13px * var(--fs, 1))/1.2 var(--f-body);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
label.schritt-knopf { display: flex; align-items: center; gap: 8px; border: 1px solid var(--rule-strong); background: var(--surface); cursor: pointer; }
.schritt.z-erledigt .schritt-sym { background: var(--ok); border-color: var(--ok); color: var(--surface); }
.schritt.z-erledigt .schritt-zustand { color: var(--ok); }
.schritt.z-erledigt { background: transparent; }
.schritt.z-offen .schritt-zustand, .schritt.z-hinweis .schritt-zustand { color: var(--warn); }
.schritt.z-einwand .schritt-zustand { color: var(--bad); }
.schritt.z-einwand { border-color: var(--bad-line); }
.schritt.z-wartet .schritt-zustand, .schritt.z-wartet .schritt-z2, .schritt.z-wartet .schritt-titel { color: var(--muted); }
.schritt.z-wartet .schritt-sym { border-style: dashed; }
/* Nächster offener Schritt nur hervorgehoben (Rand per Schatten, ändert keine Maße) */
.schritt.aktiv { border-color: var(--brand-fg); box-shadow: inset 0 0 0 1px var(--brand-fg); }
.schritt.aktiv .schritt-sym { border-color: var(--brand-fg); color: var(--brand-fg); }
.schritt.aktiv button.schritt-knopf { background: var(--brand); border-color: var(--brand); color: #fff; }
.schritt > .briefing { grid-column: 2 / -1; margin-top: 6px; }
.briefing-liste label { display: flex; align-items: center; gap: 10px; min-height: 44px; cursor: pointer; font-weight: 600; }
.schritt input[type="checkbox"] { flex: none; width: 22px; height: 22px; margin: 0; accent-color: var(--brand); }
.briefing-liste { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.briefing-liste > li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0 10px; padding: 2px 8px; border-radius: 8px; background: var(--zinc-50); }
.briefing-liste > li.an { background: var(--ok-bg); }
.bp-zeit { min-width: 9.5em; text-align: right; color: var(--muted); font: 400 calc(12px * var(--fs, 1))/1.3 var(--f-body); font-variant-numeric: tabular-nums; }
.briefing-liste > li.an .bp-zeit { color: var(--ok); font-weight: 600; }
.bp-quellen { grid-column: 1 / -1; padding: 0 0 6px 32px; font-size: calc(12px * var(--fs, 1)); }
.bp-quellen a { display: inline-block; padding: 4px 0; color: var(--brand-fg); }
.briefing-hinweis { margin: 6px 0 0; padding: 6px 8px; border-left: 3px solid var(--warn-line); color: var(--text); font-size: calc(12px * var(--fs, 1)); }
.schritte-verein { margin: 0; padding: 8px 10px; border-left: 3px solid var(--brand-fg); background: var(--surface); font-size: calc(14px * var(--fs, 1)); }
/* Kompakt: alles erledigt → eine Zeile „Flugvorbereitung vollständig ✓“ */
.schritte.kompakt { grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding: 6px 10px; border-color: var(--ok-line); background: var(--ok-bg); }
.schritte-fertig { display: flex; align-items: center; gap: 10px; margin: 0; min-height: 44px; font-size: calc(14px * var(--fs, 1)); }
.schritte-fertig > span:last-child { min-width: 0; }
.schritte-fertig b, .schritte-fertig small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.schritte-fertig small { color: var(--muted); }
.schritte-fertig .schritt-sym { background: var(--ok); border-color: var(--ok); color: var(--surface); }
.schritte.kompakt:has(.nicht-fertig) { border-color: var(--rule); background: var(--zinc-50); }
.schritte-fertig.nicht-fertig .schritt-sym { background: none; border-color: var(--warn); color: var(--warn); }
/* Handy: Titel und Zustand in Zeile 1 über die ganze Breite, Status und Knopf in Zeile 2 – feste Höhe */
@media (max-width: 560px) {
  .schritt { grid-template-columns: 26px minmax(0, 1fr) auto; grid-template-rows: auto 46px; gap: 2px 8px; padding: 6px 8px; height: calc(1.35em + 60px); }
  .schritt.auf { height: auto; }
  .schritt > .schritt-sym { grid-row: 1 / 3; }
  .schritt-text { display: contents; }
  .schritt-z1 { grid-column: 2 / -1; grid-row: 1; }
  .schritt-z2 { grid-column: 2; grid-row: 2; align-self: center; }
  .schritt > .schritt-knopf { grid-column: 3; grid-row: 2; margin-top: 0; }
  .schritt.auf > .schritt-sym, .schritt.auf > .schritt-knopf { margin-top: 0; }
  button.schritt-z2-knopf { min-height: 44px; }
  .schritt > .briefing { grid-column: 1 / -1; grid-row: 3; }
  .bp-quellen { padding-left: 0; }
  .briefing-liste > li { grid-template-columns: minmax(0, 1fr); }
  .bp-zeit { text-align: left; padding-left: 32px; }
  .schritte.kompakt { grid-template-columns: minmax(0, 1fr); }
  .schritte.kompakt .schritte-aktionen { margin-left: 0; }
}
}
.verdict.mit-schritten > ul, .verdict.mit-schritten > .more-issues { display: none; }
.link-knopf { padding: 4px 6px; border: 0; background: none; color: var(--brand-fg); text-decoration: underline; text-underline-offset: 3px;
  text-transform: none; letter-spacing: 0; font: 400 calc(13px * var(--fs, 1))/1.3 var(--f-body); }
@media (pointer: coarse) { .link-knopf { min-height: 44px; } }
.overview-actions { align-items: center; gap: 8px; flex-wrap: wrap; }
.pdf-hinweis { flex-basis: 100%; margin: 0; text-align: right; color: var(--warn); font-size: calc(13px * var(--fs, 1)); }
.pdf-hinweis:empty { display: none; }
button[aria-disabled="true"].pilotlog-btn { opacity: .6; }

/* ---------- Wetter je Platz (D3) ---------- */
.wx-kurz { display: grid; gap: 6px; }
.wxk-titel { margin: 0; }
.wxk-liste { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.wxk { display: grid; grid-template-columns: auto minmax(90px, auto) minmax(0, 1fr) auto; align-items: center; gap: 4px 10px; padding: 6px 10px;
  border: 1px solid var(--rule); border-radius: 10px; background: var(--zinc-50); font-size: calc(13px * var(--fs, 1)); }
.wxk-sym { font-size: calc(15px * var(--fs, 1)); }
.wxk-platz small, .wxk-werte small { color: var(--muted); }
.wxk-werte { color: var(--ink); font-variant-numeric: tabular-nums; }
.wxk-urteil { grid-column: 2 / 4; font-weight: 600; }
.wxk-link { grid-column: 4; grid-row: 1 / 3; padding: 6px 10px; font-size: calc(12px * var(--fs, 1)); }
.wxk-ok { border-color: var(--ok-line); } .wxk-ok .wxk-sym, .wxk-ok .wxk-urteil { color: var(--ok); }
.wxk-warn { border-color: var(--warn-line); background: var(--warn-bg); } .wxk-warn .wxk-sym, .wxk-warn .wxk-urteil { color: var(--warn); }
.wxk-bad { border-color: var(--bad-line); background: var(--bad-bg); } .wxk-bad .wxk-sym, .wxk-bad .wxk-urteil { color: var(--bad); }
.wxk-na { border-style: dashed; background: repeating-linear-gradient(135deg, var(--sunken) 0 6px, var(--zinc-50) 6px 12px); }
.wxk-na .wxk-urteil { color: var(--muted); font-weight: 400; }
.wxk-fuss { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 6px; margin: 0; font-size: calc(13px * var(--fs, 1)); color: var(--muted); }
.wxk-fuss button { padding: 6px 12px; font-size: calc(12px * var(--fs, 1)); }
@media (pointer: coarse) { .wxk-link, .wxk-fuss button { min-height: 44px; } }
@media (max-width: 480px) { .wxk { grid-template-columns: auto minmax(0, 1fr) auto; } .wxk-werte, .wxk-urteil { grid-column: 2 / 3; } .wxk-link { grid-column: 3; } }

/* ---------- Zustand nie nur Farbe (D33): Symbol im Kicker wie im PDF, sichtbarer Fokus ---------- */
.kpi.bad .kicker::before { content: "■ "; color: var(--bad); }
.kpi.warn .kicker::before { content: "▲ "; color: var(--warn); }
.kpi.ok .kicker::before { content: "● "; color: var(--ok); }
.kpi.ok .kpi-sub, .kpi.warn .kpi-sub { color: var(--text); }
:is(button, a, summary, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.jstep:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }

/* ---------- Route: Rückflug, Platzfelder am Handy (D12, D13), Betankung (D16) ---------- */
.plan-actions { align-items: center; justify-content: flex-start; }
.add-return { color: var(--brand-fg); border-color: color-mix(in srgb, var(--brand) 45%, transparent); }
.rueckflug-hinweis { margin: 0; flex-basis: 100%; }
.tank-info { flex-basis: 100%; margin: 2px 0 0; text-transform: none; letter-spacing: 0; font: 400 calc(13px * var(--fs, 1))/1.4 var(--f-body); }
.tank-info:empty { display: none; }
.stop-meta .unit { width: 7.5em; }
.stop-meta .unit input { width: 100%; }
@media (pointer: coarse) { .add-stop { min-height: 44px; } }
@media (max-width: 480px) {
  .stop-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "nr rolle weg" "feld feld feld"; align-items: center; gap: 6px 8px; }
  .stop-head .stop-no { grid-area: nr; }
  .stop-head .stop-role { grid-area: rolle; }
  .stop-head .icon-btn { grid-area: weg; }
  .stop-head input[data-f="ad"] { grid-area: feld; width: 100%; font-size: calc(16px * var(--fs, 1)); }
  .planner .stop .info, .planner .stop-meta, .planner .stop-times { margin-left: 0; }
}

/* ---------- Etappentabelle: Lufträume aufklappbar (P14) ---------- */
.lr-liste summary { list-style: none; cursor: pointer; display: inline-flex; }
.lr-liste summary::-webkit-details-marker { display: none; }
.lr-liste ul { margin: 6px 0 0; padding: 0; list-style: none; text-align: left; white-space: normal; font-family: var(--f-body); font-size: calc(13px * var(--fs, 1)); }
.lr-liste li { margin: 2px 0; }
td.lr-zelle { white-space: normal; }

/* ---------- Seitenprofil am Handy (D10) ---------- */
.pf-flaeche.wischbar { background: linear-gradient(to left, color-mix(in srgb, var(--ink) 10%, transparent), transparent 28px) right / 28px 100% no-repeat local, var(--surface); }
.pf-wischen { margin: 4px 0 0; text-align: center; }
.pf-dialog-drehen { display: none; margin: 0; flex-basis: 100%; color: var(--muted); font-size: calc(13px * var(--fs, 1)); }
@media (max-width: 600px) and (orientation: portrait) { .pf-dialog-drehen { display: block; } }
html[data-schrift="gross"] .pf-achse, html[data-schrift="gross"] .pf-asp-text, html[data-schrift="gross"] .pf-msa-text,
html[data-schrift="gross"] .pf-platz-text, html[data-schrift="gross"] .pf-marke-text { font-size: calc(10px * var(--fs, 1) * 1.02); }

/* ---------- Hilfe im Kontext (D29) ---------- */
.hilfe { display: inline-grid; place-items: center; width: 24px; height: 24px; margin-left: 8px; padding: 0; vertical-align: 2px; border-radius: 50%;
  font: 700 calc(13px * var(--fs, 1))/1 var(--f-body); letter-spacing: 0; color: var(--brand-fg); }
.hilfe[aria-expanded="true"] { background: var(--sunken); }
@media (pointer: coarse) { .hilfe { width: 44px; height: 44px; margin-block: -10px; } }
.hilfe-text { clear: both; margin: 0 0 10px; padding: 8px 10px; border-left: 3px solid var(--brand-fg); background: var(--zinc-50); }
.hilfe-text + * { clear: both; }

/* ---------- Druckdialog: Teile abwählbar (D24) ---------- */
.druck-teile { margin: 10px 18px 6px; padding: 10px 12px; border: 1px solid var(--rule); border-radius: 12px; box-shadow: none; }
.druck-teile legend { float: none; width: auto; margin: 0 0 6px; padding: 0 4px; font: 600 calc(13px * var(--fs, 1))/1.3 var(--f-display); letter-spacing: .08em; text-transform: uppercase; }
.druck-teile legend::before { content: none; }
.druck-teile legend small { text-transform: none; letter-spacing: 0; font: 400 calc(12px * var(--fs, 1)) var(--f-body); color: var(--muted); }
.druck-teile label { display: flex; align-items: flex-start; gap: 8px; min-height: 36px; padding: 4px 0; font-size: calc(14px * var(--fs, 1)); cursor: pointer; }
.druck-teile input[type="checkbox"] { flex: none; width: 20px; height: 20px; margin: 2px 0 0; padding: 0; accent-color: var(--brand); }
.druck-teile small { color: var(--muted); }
.druck-teile .hint { margin: 4px 0 0; }
dialog.druck-dialog { max-height: calc(100dvh - 24px); overflow-y: auto; }
@media (pointer: coarse) { .druck-teile label { min-height: 44px; } }

/* ---------- A4: Seite 1 Zusammenfassung (druck-a4-kurz.js) ---------- */
@media print {
  .a4-seite1 { break-after: page; }
  .a4-seite1 h3 { margin-top: 2.5mm; }
  .a4-kern { grid-template-columns: 22mm minmax(0, 1fr); }
  .a4-kern-tab, .a4-wx-kurz { margin-top: 1mm; }
  .kb-tab.a4-wx-kurz td, .kb-tab.a4-wx-kurz th { text-align: left; }
  .a4-seite1 .kb-unterschrift { margin-top: 7mm; }
  .a4-seite1 .a4-check { margin-top: 1mm; }
  /* Briefing-Häkchen aus der Schrittleiste (D27): Kasten mit ✓ und Uhrzeit statt Leerlinie */
  .a4-box-an { font: 700 2.6mm/3mm "Inter", system-ui, sans-serif; text-align: center; vertical-align: -.4mm; }
  .kb-briefing b { font-weight: 600; }
}

/* ---------- Schrift „Groß“ am Handy: Start-/Landekarten nicht breiter als die Seite ---------- */
@media (max-width: 560px) { .mv-bars { grid-template-columns: minmax(0, 1fr); } }
details.move > summary, .mv-bars > * { min-width: 0; }
html[data-schrift="gross"] .bar-top { flex-wrap: wrap; }
html[data-schrift="gross"] .bar-top .num { white-space: normal; }
/* Handy/Tablet: Wetter je Platz direkt unter der Bewertung, vor den Kacheln (P3: Wetter oben) */
@media (max-width: 960px) {
  .overview-top > .schritte { order: 0; } .overview-top > .verdict { order: 1; } .overview-top > .wx-kurz { order: 2; } .overview-top > .kpis { order: 3; }
}