/* ============================================================================
   deck-local · NUR dieses Deck · klar benannte Overrides (DECK-MASTER §6).
   Keine neuen Farben, keine neuen Fonts — nur Token-Werte und Kanon-Variablen.
   Uebernommen aus dem Vorgaenger v0.2.0 + drei neue Komponenten fuer die
   Folien, die dieses Deck neu einfuehrt (Architektur, Vergleich, Beleg-Marken).
   ============================================================================ */

/* §7.3 Kasten-Mindestwerte „in Karte/Kachel/Zelle >= 72 px". */
.fc img{width:74px;height:74px}
.mmcard .mmh img{width:72px;height:72px}
.stack .step .si{width:74px;height:74px}

/* 🤖 GUARD-BEFUND: `.irow` hat im Kanon `grid-template-columns:54px 1fr`, waehrend
   `.irow img` auf 64 px steht — die Rasterspalte kappt das Bild. Kandidat fuer den
   Kanon (DECK-MASTER §8). Unveraendert aus v0.2.0 uebernommen. */
.irow{grid-template-columns:78px 1fr}
.irow img{width:78px;height:78px}

/* 🤖 KANON-LUECKE: §7.2 verlangt auf JEDER Vollton-Flaeche einen weissen Balken mit
   Ink-Wort; implementiert ist das nur fuer `.trenn.yel/.grn/.blu`. Die gelbe `.alert`
   ist nicht erfasst. Hier lokal nachgezogen. Kandidat fuer den Kanon. */
.alert .mark{background:#fff!important;color:var(--ink)!important}

/* 🤖 KANON-LUECKE (neu gefunden 03.08.2026, dieselbe Familie): `.klist span` und
   `.lead` sind fuer DUNKLE Flaechen gestylt (helles Grau bzw. Weiss). Auf der
   gelben `.alert`-Vollflaeche ergibt das gemessen 1,41:1 (Fliesstext) und 1,51:1
   (Fettschrift, weiss auf Gelb) — WCAG AA verlangt 4,5:1. Der Text ist dort
   praktisch unlesbar. Betrifft JEDES Deck mit Text auf `.alert`, auch v0.2.0.
   Hier auf Ink gezogen (gemessen 13,7:1). Kandidat fuer den Kanon. */
.alert .klist span{color:var(--ink-soft)}
.alert .klist span b{color:var(--ink)}
.alert .lead{color:var(--ink-soft)}
.alert .lead b{color:var(--ink)}
.alert .bm.fb{color:var(--ink-soft);opacity:.72}

/* 🤖 KANON-LUECKE: `.mchips`/`.mpers` stehen NICHT im Kanon-CSS, obwohl §7.6 fordert,
   dass das Fassungs-Menue in JEDEM Deck gleich aussieht. Sie leben als Handkopie je
   Deck. 1:1 aus der Referenz uebernommen. Gehoert in jerry-deck.css. */
.mchips{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.mchips a{cursor:pointer;border:1px solid rgba(255,255,255,.25);border-radius:99px;padding:9px 18px;font:800 12.5px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:#fff}
.mchips a.on{background:var(--blue);border-color:var(--blue)}
.mchips a.fok.on{background:var(--green);border-color:var(--green);color:var(--ink-soft)}
.mpers{display:flex;gap:10px;margin-top:10px;align-items:center}
.mpers input{flex:1;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);border-radius:10px;padding:10px 14px;font:600 14px var(--body);color:#fff;outline:none}
.mpers input::placeholder{color:rgba(255,255,255,.45)}
.mpers a{font:800 13px/1 var(--body);letter-spacing:.08em;text-transform:uppercase;background:var(--green);color:var(--ink-soft);border-radius:999px;padding:11px 18px;cursor:pointer}

/* Zahlen-Karten auf HELL (der Kanon-Bento `.cells/.cell` ist dunkel gestylt). */
.numgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}
.numc{background:#fff;border:1px solid var(--line-l);border-top:4px solid var(--blue);border-radius:16px;padding:18px 22px}
.numc .nn{font:800 clamp(2.1rem,48px,2.9rem)/1 var(--disp);letter-spacing:-.02em;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.numc .nl{font:800 13px/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-top:7px}
.numc .nd{font:600 15.5px/1.45 var(--body);color:var(--mut-l);margin-top:7px}
.numc.acc-y{border-top-color:var(--yellow)}

/* 🤖 KANON-LUECKE (neu gefunden 03.08.2026) — BEIDSEITIG, und in beide Richtungen
   unsichtbar. Der Kanon faerbt die Fettschrift nach der FUELLUNG der km-box:
   `.km-box b` = Ink (richtig in der gruenen Box), `.km-box.blu b` = Weiss (richtig
   in der blauen Box). Die `.kmnote` rendert aber AUSSERHALB der Fuellung, direkt
   auf der Folienflaeche — und erbt trotzdem diese Farbe. Ergebnis, gemessen:
     · `.dark`/`.alt` + `.km-box`      → Ink auf Schwarz   = 1,00:1 (Folien 14, 16, 18)
     · `.light`      + `.km-box.blu`   → Weiss auf Weiss   = 1,00:1 (Folien 03, 12, 15)
   Die Fettschrift muss der FLAECHE folgen, nicht der Fuellung. Kandidat fuer den
   Kanon — betrifft jedes Deck, das eine kmnote mit Fettschrift benutzt. */
.sec .km-box .kmnote b{color:var(--ink)}
.sec.dark .km-box .kmnote b,.sec.alt .km-box .kmnote b{color:#fff}

/* 🤖 KANON-LUECKE, DRITTE INSTANZ derselben Familie (gemessen 03.08.2026):
   `.cht b` steht — wie `.irow b` — auf `display:block` mit Display-Font. Richtig
   fuer die Kachel-UEBERSCHRIFT, falsch fuer jede Hervorhebung im Fliesstext der
   gleichen Kachel: sie wird zur eigenen 19-px-Zeile und zerlegt den Absatz
   (gemessen auf Folie 22). Nur das ERSTE `<b>` ist der Titel. Kanon-Kandidat:
   die Regel gehoert an den Titel-Slot, nicht an das Element. */
.cht span p b,.cht span > b:not(:first-child){display:inline;font-family:var(--body);
  font-size:inherit;line-height:inherit;font-weight:800;color:inherit;letter-spacing:0}

/* 🤖 KANON-LUECKE (neu gefunden 03.08.2026): `.irow b` steht auf `display:block`
   mit 23,2 px Display-Font. Das ist richtig fuer die TITELZEILE der Zeile — trifft
   aber JEDES `<b>` im Fliesstext derselben Zelle. Eine Hervorhebung mitten im Satz
   wird dadurch zur eigenen 23-px-Ueberschrift und zerreisst den Absatz (gemessen
   auf den Folien 14 und 17). Nur das ERSTE `<b>` ist der Titel. Kanon-Kandidat. */
.irow span b:not(:first-child){display:inline;font-family:var(--body);font-size:inherit;line-height:inherit;font-weight:800;color:inherit;letter-spacing:0}

/* NEU · Beleg-Zeile in `.irow`: die Marke plus ihr Messwert stehen als eigene,
   ruhige Zeile unter dem Fliesstext — nie mitten im Satz, wo sie beim Umbruch
   allein auf einer Zeile landet (der Fehler in Screenshot 1). */
.irow span .ev{display:block;margin-top:6px;font:700 15.5px/1.4 var(--body);color:var(--green)}
/* Design-System-Regel: KLEINER gruener Text → Ink (green-600 ist seit 01.07.2026
   zurueckgezogen). Auf Hell gemessen: das dunklere Gruen kam auf 4,08:1 und faellt
   damit unter AA — Ink loest das regelkonform, ohne eine neue Farbe zu erfinden.
   Auf Dunkel bleibt Jerry-Gruen als Akzent zulaessig und kontrastiert deutlich. */
.light .irow span .ev,.alert .irow span .ev{color:var(--ink-soft)}

/* Licht-Variante der Zwei-Spalten-Karten (Kopf/Koerper auf heller Flaeche). */
.duo2.lt .dcol{background:#fff;border-color:var(--line-l)}
.duo2.lt .dcol .dh b{color:var(--ink-soft)}
/* Dieselbe Design-System-Regel wie bei `.ev`: kleiner gruener Text → Ink.
   12 px im dunkleren Gruen kam auf 4,08:1 (unter AA). */
.duo2.lt .dcol .dh i{color:var(--ink-soft)}
.duo2.lt .dcol li{color:var(--mut-l)}
.duo2.lt .dcol li b{color:var(--ink-soft)}
.duo2.lt .dcol li::before{color:var(--blue)}

/* NEU · Beleg-Marke (NARRATIVE-MASTER §5 / narrative-doctrine RULE 5): jede Zahl
   traegt ● gemessen oder ◐ fremdbelegt. Sichtbar, weil die Beleg-Disziplin selbst
   das Unterscheidungsmerkmal ist — kein Wettbewerbsdeck macht das. */
.bm{font:800 13px/1 var(--body);letter-spacing:.02em;vertical-align:.08em;margin-left:7px}
/* Auf Hell traegt die GLYPHE die Unterscheidung (● gemessen vs ◐ fremdbelegt),
   nicht die Farbe: kleiner gruener Text → Ink (gemessen 4,08:1, unter AA). */
.bm.ms{color:var(--ink-soft)}  /* ● gemessen */
.bm.fb{color:var(--mut-l)}     /* ◐ fremdbelegt */
.dark .bm.ms,.alt .bm.ms{color:var(--green)}
.dark .bm.fb,.alt .bm.fb{color:var(--mut-d)}
.bmlg{margin-top:14px;font:700 13.5px/1.5 var(--body);color:var(--mut-l);letter-spacing:.01em}
.dark .bmlg,.alt .bmlg{color:var(--mut-d)}

/* Basis + Module — die Kern-Loesungsfolie. Modul-Karten docken auf ein Basis-Band. */
.bmwrap{margin-top:24px}
.bmmods{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.bmmod{background:#fff;border:1px solid var(--line-l);border-top:4px solid var(--blue);border-radius:14px 14px 6px 6px;padding:16px 16px 18px;text-align:center}
.bmmod img{width:72px;height:72px;object-fit:contain;margin:0 auto 10px;display:block}
.bmmod b{display:block;font:800 17px/1.25 var(--disp);color:var(--ink-soft)}
.bmmod p{font:600 14.5px/1.4 var(--body);color:var(--mut-l);margin-top:6px}
.bmbase{margin-top:12px;background:var(--ink);color:#fff;border-radius:8px 8px 16px 16px;padding:20px 26px}
.bmbase .bl{font:800 12.5px/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--green);margin-bottom:10px}
.bmbase .bi{display:flex;flex-wrap:wrap;gap:10px 26px;font:700 17px/1.4 var(--body);color:#fff}
.bmbase .bi span::before{content:"· ";color:var(--green)}

/* Nutzen je Ebene: Ebene · Ergebnis · Messpunkt. */
.ebenen{margin-top:22px;display:grid;gap:8px}
.eb{display:grid;grid-template-columns:72px 240px 1fr 290px;gap:18px;align-items:center;background:#fff;border:1px solid var(--line-l);border-radius:14px;padding:8px 20px}
.eb img{width:72px;height:72px;object-fit:contain}
.eb .ebn{font:800 18px/1.22 var(--disp);color:var(--ink-soft)}
/* Aus v0.2.0 uebernommen, hier korrigiert: `#1e8f60` auf Weiss misst 4,08:1 und
   faellt unter AA. Design-System-Regel: kleiner gruener Text → Ink (green-600 ist
   seit 01.07.2026 zurueckgezogen); Gruen bleibt Akzent fuer Linien und Grossflaeche.
   Die Spaltenhierarchie traegt weiterhin ueber Fettung, nicht ueber Farbe. */
.eb .ebv{font:700 17.5px/1.35 var(--body);color:var(--ink-soft)}
.eb .ebm{font:600 15.5px/1.38 var(--body);color:var(--mut-l);border-left:2px solid var(--line-l);padding-left:16px}

/* Architektur-Folie: Beschreibung → Konstruktor → Dein OS, darunter die Ebenen-Treppe. */
.archrow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:14px;align-items:center;margin-top:26px}
.archn{background:#1c1f1e;border:1px solid #343a37;border-top:4px solid var(--blue);border-radius:16px;padding:20px 22px;text-align:center}
.archn img{width:72px;height:72px;object-fit:contain;margin:0 auto 10px;display:block}
.archn b{display:block;font:800 20px/1.25 var(--disp);color:#fff}
.archn p{font:600 15.5px/1.45 var(--body);color:var(--mut-d);margin-top:6px}
.archa{font:800 30px/1 var(--disp);color:var(--green);text-align:center}
.treppe{display:grid;gap:6px;margin-top:22px}
.tst{background:#151717;border:1px solid #232626;border-left:4px solid var(--blue);border-radius:10px;padding:10px 20px;display:flex;justify-content:space-between;align-items:baseline}
.tst b{font:800 16.5px/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:#fff}
.tst span{font:600 15.5px/1.35 var(--body);color:var(--mut-d)}

/* NEU · Die Betriebs-Architektur: zwei Spalten (Menschen-Motoren / autonome Flotte)
   ueber einem gemeinsamen Gate-Band. Dunkelflaechen-Variante der .archn-Sprache. */
.duo2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}
.dcol{background:#1c1f1e;border:1px solid #343a37;border-top:4px solid var(--blue);border-radius:16px;padding:18px 22px 20px}
.dcol.grn{border-top-color:var(--green)}
.dcol .dh{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.dcol .dh img{width:72px;height:72px;object-fit:contain}
.dcol .dh b{font:800 21px/1.2 var(--disp);color:#fff}
.dcol .dh i{display:block;font:800 12px/1.3 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--green);font-style:normal;margin-top:4px}
.dcol ul{list-style:none;display:grid;gap:7px}
.dcol li{font:600 16px/1.42 var(--body);color:var(--mut-d);padding-left:16px;position:relative}
.dcol li::before{content:"·";position:absolute;left:2px;color:var(--green);font-weight:800}
.dcol li b{color:#fff;font-weight:800}
.gateband{margin-top:14px;background:var(--blue);border-radius:14px;padding:15px 24px;display:flex;align-items:center;gap:20px}
.gateband .gl{font:800 12.5px/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:#fff;white-space:nowrap;background:rgba(255,255,255,.16);border-radius:99px;padding:8px 15px}
.gateband p{font:700 18.5px/1.4 var(--body);color:#fff;margin:0}

/* NEU · Der Ebenen-Vergleich (narrative-doctrine §4a: Kategorie-Vergleich, NIE
   Feature-Kreuztabelle — deshalb Ebene + Bruchstelle, keine Haekchen-Matrix). */
.vgl{display:grid;gap:7px;margin-top:20px}
.vgl .vh,.vgl .vr{display:grid;grid-template-columns:290px 250px 1fr;gap:18px;align-items:center;padding:9px 22px}
/* Kopfzeile steht auf der DUNKLEN Folienflaeche, nicht auf den weissen Zeilen —
   deshalb `--mut-d` (Dunkelflaechen-Grau). Mit `--mut-l` waren es gemessen 3,04:1. */
.vgl .vh{font:800 12px/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--mut-d);padding-bottom:2px}
.vgl .vr{background:#fff;border:1px solid var(--line-l);border-radius:12px}
.vgl .vr b{font:800 17.5px/1.25 var(--disp);color:var(--ink-soft)}
.vgl .vr .vl{font:700 15.5px/1.35 var(--body);color:var(--mut-l)}
.vgl .vr .vb{font:600 15.5px/1.38 var(--body);color:var(--ink-soft);border-left:2px solid var(--line-l);padding-left:16px}
.vgl .vr.us{background:var(--ink);border-color:var(--ink)}
.vgl .vr.us b{color:#fff}
.vgl .vr.us .vl{color:var(--green)}
.vgl .vr.us .vb{color:#fff;border-left-color:rgba(255,255,255,.25)}

/* §7.12 Ueberlauf-Korrektur (aus v0.2.0): die km-box mit kmnote traegt auf fast
   jeder Folie 90–160 px. Typo-Minima (§7.12) bleiben unberuehrt. */
.km-box{margin-top:18px}
.kmnote{font-size:14px;line-height:1.45}
.ebenen{gap:3px;margin-top:10px}
.eb{padding:0 20px}
.eb .ebm{font-size:15px;padding-left:14px}
.irows{gap:11px;margin-top:26px}
.irow{grid-template-columns:74px 1fr;gap:16px}
.irow img{width:74px;height:74px}
.chtiles{margin-top:24px}
.cells{margin-top:22px}
.archrow{margin-top:22px}
.archn{padding:16px 18px}
.treppe{gap:5px;margin-top:18px}
.tst{padding:8px 20px}
.mmcard{padding:19px 22px}
.mmcard .mmh{margin-bottom:12px}

/* §7.16 „Headline und Subline gleich breit — die rechten Kanten fluchten". */
.trenn .lead{max-width:620px}

/* Die Ehrlichkeits-Zeilen — bewusst klein, Fussnote statt Kapitel. */
.offen{margin-top:22px;border-top:2px solid var(--line-l);padding-top:16px;display:grid;gap:7px}
.offen .ol{font:800 12px/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--mut-l);margin-bottom:3px}
.offen span{font:600 16px/1.45 var(--body);color:var(--mut-l)}
.offen span b{color:var(--ink-soft)}

/* NEU 03.08.2026 · Schluss-Flaeche „Warum wir" (Enterprise-Register, Doktrin §7a).
   Referenz-Leiste = Mandate DES HAUSES, ausdruecklich NICHT OS-Installationen; die
   Zuordnung steht als Text darueber, damit das Bild sie nicht stillschweigend
   umdeutet. Logos sind auf wearejerry.com bereits oeffentlich publiziert. */
.reflead{margin-top:22px;font:600 16px/1.5 var(--body);color:var(--mut-l);max-width:1180px}
.reflead b{color:var(--ink-soft);font-weight:800}
.refbar{margin-top:12px;display:flex;flex-wrap:wrap;align-items:center;gap:14px 30px}
.refbar img{height:30px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.62}
.dark .refbar img,.alt .refbar img{filter:grayscale(1) invert(1);opacity:.72}

/* Reife-Zeile: datierter Stand statt Maengelliste (RULE 17). Bewusst ruhig. */
.statline{margin-top:16px;border-top:2px solid var(--line-l);padding-top:12px;
  font:600 14.5px/1.5 var(--body);color:var(--mut-l);max-width:1400px}
.statline b{color:var(--ink-soft);font-weight:800}

/* 🤖 KANON-LUECKE (03.08.2026): `.metaline` kommt in `jerry-deck.css` GAR NICHT vor.
   Die Klasse wird in den Decks benutzt, wurde aber nie in den Kanon gehoben — sie
   faellt auf Browser-Defaults zurueck, u. a. `margin-top:0`. Folge: die Zeile klebt
   ohne Abstand am Block darueber (gemessen: Abstand 0 px auf der Kontakt-Flaeche),
   und jedes Deck musste den Abstand bisher per Inline-Style selbst nachruesten —
   ein Bauteil, das ohne Handarbeit falsch sitzt.
   Hier lokal definiert. KANON-KANDIDAT: gehoert nach `jerry-deck.css`, damit der
   Abstand nicht je Deck neu erfunden wird. Abstand NIE wieder per Inline-Style. */
.metaline{margin-top:34px;font:600 15px/1.5 var(--body);color:var(--mut-d);letter-spacing:.01em}
.light .metaline,.alert .metaline{color:var(--mut-l)}
.hero .metaline{margin-top:14px}

/* 🤖 KANON-BEFUND (03.08.2026): `.circwrap` ist im Kanon KEIN Layout-Container,
   sondern der runde Portrait-RAHMEN — fix 352x352, `border-radius:50%`, mit dem
   Verlaufsband als Hintergrund und `img{width:100%}` darin. Das Vorgaenger-Deck
   hat ihn als Drei-Spalten-Grid zweckentfremdet; Ergebnis: der sichtbare Kreis war
   der Rahmen selbst, beide Bilder kollabierten auf Breite 0. Layout gehoert in
   einen eigenen Container — hier `.ctarow`; `.circwrap` umschliesst nur noch das
   Portrait, wie vom Kanon vorgesehen. */
.ctarow{display:grid;grid-template-columns:auto 1fr auto;gap:52px;align-items:center;margin-top:30px}
/* Portrait kleiner als der Kanon-Standard (352px): auf der CTA-Fläche steht es
   neben Text und QR, nicht allein — 240px hält das Verhältnis ruhig. */
.ctarow .circwrap{flex:none;width:240px;height:240px}
.ctatext .pname{font:800 40px/1.15 var(--disp);color:#fff;letter-spacing:-.01em}
.ctatext .pdesc{font:700 19px/1.5 var(--body);color:var(--green);margin-top:6px}
.ctatext .sub{margin-top:16px;max-width:680px}
.ctatext .ctamail{margin-top:14px;font:700 19px/1.5 var(--body);color:#fff}
.ctaqr{text-align:center}
.ctaqr img{width:175px;height:175px;border-radius:12px}
.ctaqr span{display:block;margin-top:9px;font:800 11.5px/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--mut-d)}

/* ════════════════════════════════════════════════════════════════════════════
   MOBIL · Ergaenzung 03.08.2026
   Die Buehne bleibt per Kanon fix 1600x900 (DECK-MASTER §1) und wird NUR
   skaliert — kein Reflow, kein zweites Layout. Mobil heisst deshalb: die
   Bedienung passt sich an, nicht die Folie. Zielhaltung ist Querformat.
   ════════════════════════════════════════════════════════════════════════════ */

/* Safe-Area (Notch/Home-Indicator) — betrifft nur die HUD, nie die Buehne. */
.chapter{padding-left:env(safe-area-inset-left,0)}
.menu-btn{margin-right:env(safe-area-inset-right,0)}

/* ── Bedienelemente: Fingergroesse statt Mausgroesse ──────────────────── */
@media (pointer:coarse),(max-width:820px){
  .menu-btn{min-width:48px;min-height:48px;font-size:22px}
  /* Die Kapitelzeile lief unter den Menue-Knopf. Sie ist HUD, skaliert also
     nicht mit und muss auf schmalen Schirmen selbst kuerzen. */
  .chapter{font-size:10px;letter-spacing:.16em;max-width:calc(100vw - 96px);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* 27 Mini-Punkte sind am Telefon weder treffbar noch lesbar. */
  .dots{display:none}
  /* Die HUD skaliert NICHT mit der Buehne. Bei Skalierung ~0.24 (Telefon
     hochkant) wuerde ein 15-px-Hinweis die Folie optisch erschlagen — und er
     nennt Tasten, die es dort gar nicht gibt. Hochkant deshalb ganz weg. */
  .hint{font-size:11px;letter-spacing:.1em;max-width:76vw}
  /* Menue: volle Hoehe, scrollbar, Chips umbrechend, Eingaben gestapelt. */
  .menu .minner{max-height:100dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;
    padding:calc(20px + env(safe-area-inset-top,0px)) 18px calc(24px + env(safe-area-inset-bottom,0px))}
  .menu .mgrid{grid-template-columns:1fr;gap:2px;max-height:46dvh;overflow-y:auto}
  .menu .mgrid a{padding:13px 12px;min-height:44px;display:flex;align-items:center;gap:10px}
  .mchips a{padding:12px 18px;min-height:44px;display:flex;align-items:center}
  .mpers{flex-direction:column;align-items:stretch}
  .mpers input,.mpers a{width:100%;min-height:46px;text-align:center;justify-content:center}
  .mhelp{font-size:12px;line-height:1.5}
}

/* ── Sehr schmales Querformat (Telefon quer) ──────────────────────────── */
@media (orientation:landscape) and (max-height:460px){
  /* Die HUD darf der kleinen Buehne keinen Platz wegnehmen. */
  .chapter{top:10px;left:14px;font-size:10px;letter-spacing:.18em}
  .menu-btn{top:8px;right:10px}
  .hint{bottom:8px;left:14px}
  .menu .mgrid{max-height:38dvh}
}

/* ── Maus/Trackpad-freie Geraete: Hover-Zustaende nicht kleben lassen ─── */
@media (hover:none){
  .mchips a:hover,.mgrid a:hover{background:inherit}
}

/* Hochkant am Telefon: Tastatur-Hinweis ausblenden (keine Pfeiltasten da). */
@media (orientation:portrait) and (max-width:820px){ .hint{display:none} }

/* ════════════════════════════════════════════════════════════════════════════
   🤖 KANON-BEFUND (gemessen 03.08.2026) · Buehne vs. Viewport
   ──────────────────────────────────────────────────────────────────────────
   Der Kanon enthaelt 20 Regeln `@media screen and (max-width:900px)`, die
   Mehrspalter auf eine Spalte zusammenklappen. Sie haengen aber am FENSTER,
   nicht an der BUEHNE — und die Buehne ist fix 1600 px breit und wird nur
   SKALIERT. Auf jedem Fenster unter 900 px (Telefon quer = 844, schmales
   Laptop-Fenster, Headless-Export) bleibt die Buehne also 1600 px breit,
   waehrend ihr Inhalt einspaltig wird: er laeuft ueber und wird abgeschnitten.
   Gemessen an genau den zwei Folien, die betroffene Bauteile nutzen:
     Folie 15 (.chtiles) 961 px · Folie 18 (.cells) 943 px — Buehne ist 900.
   Der Kanon kennt den Effekt und weicht ihm aus, statt ihn zu loesen
   (web-structure.md: Headless-Laeufe erzwingen `--window-size=1700,1000`,
   „das 800-px-Fenster … korrumpiert Pruefungen und PDF-Export").
   Hier fuer dieses Deck zurueckgenommen, solange die 16:9-Buehne aktiv ist.
   Im Hochformat gilt darunter bewusst etwas anderes (eigene Buehne).
   KANON-KANDIDAT: Bauteil-Umbrueche gehoeren an eine Container-Query der
   Buehne, nicht an die Fensterbreite.
   ════════════════════════════════════════════════════════════════════════════ */
@media screen and (max-width:900px) and (orientation:landscape){
  .chtiles{grid-template-columns:1fr 1fr}
  .cells{grid-template-columns:repeat(6,1fr)}
  .cardrow.c5,.cardrow.c3{grid-template-columns:repeat(3,1fr)}
  .tiles{grid-template-columns:repeat(3,1fr)}
  .grid2,.duo .pair{grid-template-columns:1fr 1fr}
  .appx .cols3{grid-template-columns:repeat(3,1fr)}
  .appx .cols2{grid-template-columns:1fr 1fr}
  .services .klist,.rsg .cardrow,.trust .cardrow{grid-template-columns:1fr 1fr}
}

/* ════════════════════════════════════════════════════════════════════════════
   HOCHKANT · eigenes Buehnenformat (Theo 03.08.2026)
   ──────────────────────────────────────────────────────────────────────────
   ABWEICHUNG VOM KANON, bewusst und Owner-angeordnet: DECK-MASTER §1 setzt die
   Buehne fix auf 1600x900. Auf einem Telefon hochkant ergibt das Skalierung
   ~0.24 — die Folie ist dann formal korrekt und praktisch unlesbar.
   Hochkant bekommt deshalb ein EIGENES Format: 1000 x 2000 (deutlich hoeher
   als 1:1). Die Skalierung bleibt breitenbestimmt (390px → 0.39 statt 0.24,
   also gut 60 % groesser), und 2000 * 0.39 = 780 px fuellen den Schirm fast ganz.
   Quer bleibt unveraendert 16:9 — der Kanon gilt dort weiter unangetastet.
   ════════════════════════════════════════════════════════════════════════════ */
@media (orientation:portrait) and (max-width:820px){
  #stage{width:1000px;height:2000px}
  .sec{padding:104px 54px 96px}

  /* Typo: schmalere Buehne + staerkere Verkleinerung ⇒ Fliesstext muss
     relativ groesser werden, Ueberschriften duerfen kleiner. */
  .eyebrow{font-size:23px;letter-spacing:.22em}
  .sec h2,.sec .h2x{font-size:70px;line-height:1.16}
  .lead{font-size:33px;line-height:1.5;max-width:none!important}
  .km-box>span{font-size:31px}
  .km-box .kmnote{font-size:21px;line-height:1.5}
  .klist span{font-size:25px}
  .bignum{font-size:300px}

  .hero h1{font-size:88px;line-height:1.12}
  .hero .sub{font-size:33px}
  .hero .trustline{font-size:25px}
  .hero .metaline{font-size:21px}
  .hero .wordmark{width:210px}

  .trenn h2{font-size:82px}
  .trenn .inner{max-width:none!important}
  .trenn .lead{font-size:31px;max-width:none}
  .trenn .znum{font-size:170px;top:24px}
  .trenn .cap,.sec .cap,.sec .mcap{font-size:19px}

  /* ── Mehrspalter → eine bzw. zwei Spalten ─────────────────────────── */
  .numgrid{grid-template-columns:1fr 1fr;gap:14px}
  .numc{padding:16px 18px}
  .numc .nn{font-size:50px}.numc .nl{font-size:18px}.numc .nd{font-size:20px}

  .chtiles{grid-template-columns:1fr 1fr!important;gap:14px}
  .cht b{font-size:25px}.cht p{font-size:20px}.cht img{width:64px;height:64px}

  .duo2{grid-template-columns:1fr;gap:14px}
  .dcol .dh b{font-size:31px}.dcol .dh i{font-size:17px}
  .dcol li{font-size:23px;line-height:1.45}
  .gateband{flex-direction:column;align-items:flex-start;gap:10px}
  .gateband p{font-size:26px}

  .irow{grid-template-columns:96px 1fr;gap:18px}
  .irow img{width:96px;height:96px}
  .irow b{font-size:31px}
  .irow span{font-size:24px;line-height:1.45}
  .irow span .ev{font-size:22px}

  /* Ebenen-Tabelle: die vierspaltige Zeile wird ein Block. */
  .ebenen .eb{grid-template-columns:1fr;gap:5px;padding:16px 20px}
  .eb img{display:none}
  .eb .ebn{font-size:27px}.eb .ebv{font-size:25px}
  .eb .ebm{font-size:21px;border-left:0;padding-left:0;opacity:.85}

  /* Vergleichstabelle: Kopfzeile weg, jede Zeile wird eine Karte. */
  .vgl .vh{display:none}
  .vgl .vr{grid-template-columns:1fr;gap:7px;padding:18px 22px}
  .vgl .vr b{font-size:27px}
  .vgl .vr .vl{font-size:22px}
  .vgl .vr .vb{font-size:22px;border-left:0;padding-left:0}

  .cardrow{grid-template-columns:1fr!important;gap:14px}
  .dcard h4{font-size:27px}.dcard p{font-size:21px}.dcard .rn{font-size:23px}
  .mmgrid{grid-template-columns:1fr;gap:14px}
  .mmcard .mmh b{font-size:26px}.mmcard p{font-size:21px}
  .pcard h3{font-size:27px}.pcard p{font-size:21px}
  .cells{grid-template-columns:1fr 1fr;gap:14px}
  .cell .n{font-size:62px}.cell .l{font-size:20px}.cell .d{font-size:19px}
  .flow{grid-template-columns:1fr 1fr;gap:14px}
  .flowc b{font-size:24px}.flowc p{font-size:20px}
  .archrow{grid-template-columns:1fr;gap:10px}
  .archa{display:none}
  .archn b{font-size:26px}.archn p{font-size:20px}
  .treppe .tst{flex-direction:column;align-items:flex-start;gap:3px}
  .tst b{font-size:21px}.tst span{font-size:20px}
  .rungs .rung{grid-template-columns:56px 1fr;row-gap:4px}
  .rung .st{grid-column:2;font-size:21px}
  .rung .nm{font-size:26px}
  .offen span{font-size:21px}.offen .ol{font-size:17px}

  /* Management-Summary-Seiten */
  .msdoc h2{font-size:52px}
  .msdoc .sect p{font-size:23px;line-height:1.55}
  .msdoc .beschluss{font-size:24px}
  .msdoc .quad{grid-template-columns:1fr;gap:12px}
  .msdoc .dochead{font-size:18px}

  .reflead{font-size:22px;max-width:none}
  .refbar{gap:12px 22px}
  .refbar img{height:26px}
  .statline{font-size:19px;line-height:1.5;max-width:none}

  /* Kontakt */
  .ctarow{grid-template-columns:1fr;gap:22px;justify-items:start}
  .ctarow .circwrap{width:210px;height:210px}
  .ctatext .pname{font-size:44px}
  .ctatext .pdesc{font-size:24px}
  .ctatext .sub{font-size:26px;max-width:none}
  .ctatext .ctamail{font-size:24px}
  .ctaqr img{width:150px;height:150px}
}