/*
 * mobile-overrides.css — Anpassungen für schmale Geräte.
 *
 * Bewusst kurz. Die Vorlage aus den Schwesterprojekten brachte Regeln mit, die
 * hier Schaden angerichtet haben — an der Quelle nachgemessen:
 *
 *   - „Links touch-freundlich" (`padding: 4px 0` auf Verweise in Link-Gruppen)
 *     traf echte Schaltflächen und ersetzte deren Innenabstand 31 px durch 0.
 *     Der Text lag danach am Rand, die Schaltfläche war 44 statt 61 px hoch.
 *   - „Mindestschriftgröße 14/16 px" hob die Fließtexte von 14 auf 16 px —
 *     die Quelle setzt dort 14 px.
 *   - „Kartenraster einspaltig stapeln" drehte `.con-kit-component-grid-list`
 *     auf `column`; die Quelle lässt es in der Reihe (Elementbreite ist mit
 *     342 px in beiden Fällen gleich, die Regel änderte also nur die Richtung).
 *   - „Desktop-Navigation verstecken" und die eigenen Burger-Stile sind
 *     überflüssig, seit Kopfbereich und Menü der schmalen Fassung aus der
 *     Quelle mitkommen (`fix-mobile-header.mjs`, `fix-burger-menu.mjs`).
 *
 * Wer hier etwas ergänzt: vorher dieselbe Stelle in der Quelle messen.
 */

@media (max-width: 1023px) {
  /* Die Textkarten des Laufbands behalten ohne Zutun ihre Desktop-Spaltenbreite
     (~114 px, ein Wort pro Zeile). Die Quelle rechnet sie zur Laufzeit auf eine
     Karte pro Ansicht um; das fehlt hier und wird deshalb nachgezogen.
     `initMarquees` vermisst danach die Laufbreite neu. */
  .con-kit-component-marquee-grid-item {
    width: 85vw !important;
    min-width: 85vw !important;
    max-width: 342px !important;
    flex: 0 0 auto !important;
  }

  /* Die Zeitachse hält ihre Elemente sonst bei 50 % Breite mit Zickzack-Versatz
     aus festen Pixelwerten — auf schmalen Geräten bleiben davon ~63 px Text.
     Das Element selbst bleibt eine Reihe (Symbol links, Karte rechts). */
  .con-kit-component-grid-timeline,
  .con-kit-component-grid-timeline__container {
    flex-direction: column !important;
  }

  .con-kit-component-grid-timeline__item {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
  }

  .con-kit-component-grid-timeline--align-center .con-kit-component-grid-timeline__item {
    align-self: flex-start !important;
    transform: none !important;
    left: 0 !important;
    right: auto !important;
  }
}