/* ============================================================
   Pro Tier — Bild-Text-Blöcke (Section „about“)
   Kurzer Trennstrich im Primary-Gold unter der Überschrift, linksbündig zur Textspalte.
   Farben ausschließlich über die IPS-Tokens in variables.css.
   ============================================================ */

.about-text h2::after {
  content: "";
  display: block;
  width: 3rem;
  height: 0.125rem;
  margin-block: var(--space-3) 0;
  margin-inline: 0;
  background: var(--color-primary);
}

/* ─── Zickzack gespiegelt: erstes Segment mit Bild LINKS ────────────────
   Kernel (sections/about.css): ungerade Rows Text links/Bild rechts, gerade
   umgekehrt. IPS beginnt mit dem Bild links (Philosophie auf Startseite und
   Unternehmen); weitere Segmente wechseln dann wie gewohnt ab.
   Gleicher Breakpoint wie im Kernel — darunter bleibt die feste Mobile-
   Reihenfolge (Bild oben, Text darunter). */
@media (min-width: 79.5rem) {
  .about-row:nth-child(odd) > figure {
    grid-column: 1;
    grid-row: 1;
  }
  .about-row:nth-child(odd) > .about-text {
    grid-column: 2;
  }
  .about-row:nth-child(even) > figure {
    grid-column: 2;
    grid-row: 1;
  }
  .about-row:nth-child(even) > .about-text {
    grid-column: 1;
  }
}