/* kameras.css — nur die Kamera-Uebersicht (/kameras).
   Alles andere auf der Seite laeuft ueber die Blog-Klassen und die
   Vergleichstabelle aus compare.css; hier steht ausschliesslich das, was
   die Uebersichtstabelle braucht.

   >>> WARUM ES DIESE DATEI GIBT (22.09.2026) <<<
   .article-list deckelt die Karten auf 780px - richtig fuer Fliesstext
   (rund 65 Zeichen je Zeile), zu eng fuer eine Tabelle mit sechs Spalten:
   "44 von 61" und "WLAN / USB ab Hero 9" brachen mitten entzwei. Statt die
   Zellen immer weiter zu kuerzen, darf die EINE Tabellenkarte breiter
   werden als ihre Geschwister. Der Fliesstext bleibt schmal. */

/* >>> ERST DIE SPALTE FESTNAGELN, DANN AUSBRECHEN <<<
   .article-list ist ein Grid mit `max-width: 780px`, die Spalte selbst
   aber `auto`. Gibt man EINER Karte 1120px, waechst die SPALTE mit - und
   damit alle uebrigen Karten gleich mit (genau so passiert, 22.09.2026:
   ploetzlich lief auch der Fliesstext ueber die volle Breite). Deshalb
   bekommt die Spalte hier eine feste Breite; erst dann kann eine einzelne
   Karte darueber hinausragen, ohne die Geschwister mitzuziehen. */
.article-list.kameras { grid-template-columns: minmax(0, 780px); justify-content: center; }

/* Die Tabellenkarte bricht aus dem Raster aus - aber nur so weit, wie der
   Platz es hergibt (.wrap ist 1400px minus 2x40px Rand). */
.article-list.kameras .kamera-tabelle {
  width: min(1120px, calc(100vw - 80px));
  margin-left: 50%;
  transform: translateX(-50%);
}

/* Sechs Spalten, deren Inhalte kurz sind: umbrechen soll hier nichts
   mehr. Die Markenspalte darf, sie ist die einzige mit echtem Text. */
.kamera-tabelle table.feature-compare th,
.kamera-tabelle table.feature-compare td { white-space: nowrap; }
.kamera-tabelle table.feature-compare th[scope="row"] { white-space: normal; }

/* Schmale Bildschirme: zurueck ins Raster. Die Tabelle rollt dann
   waagerecht in ihrem .compare-wrap - das ist auf einem Telefon die
   richtige Loesung, ein 6-spaltiges Umbruch-Chaos waere es nicht. */
@media (max-width: 1220px) {
  .article-list.kameras { grid-template-columns: minmax(0, 1fr); }
  .article-list.kameras .kamera-tabelle { width: auto; margin-left: 0; transform: none; }
}

/* Laufumgebungs-Tabelle (_sections/laufumgebungen.php, 25.09.2026).
   Nutzt die Kameratabelle als Grundlage; hier nur, was dazukommt.
   Die Mac-Spalte steht gedaempft: sie beschreibt etwas, das es noch
   nicht gibt, und soll nicht so aussehen wie die beiden, die es gibt. */
.laufum-tabelle th span.laufum-note {
  display: block; font-family: var(--mono); font-size: 10.5px;
  font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--ink-faint); margin-top: 2px;
}
.laufum-tabelle td.laufum-folgt { color: var(--ink-faint); }
.laufum-tabelle th[scope="row"] { text-align: left; font-weight: 600; }

/* Verweis unter der Laufumgebungs-Tabelle auf /drucken/ (30.09.2026). */
.laufum-drucken { margin: 14px 0 0; font-size: 14.5px; font-weight: 600; }
.laufum-drucken a { color: var(--accent-strong); }
.laufum-drucken a::after { content: " \2192"; }