/* Streifen „Handverlesen …“ (18.10.2026, Micha: „die Leiste finde ich noch ein bisschen hässlich, die Sterne gefallen mir
   nicht“). Statt vier Schriftzügen mit ✳ dazwischen: gleich breite Felder mit feiner Trennlinie, jedes mit einem eigenen
   Liniensymbol im Stil des Kleiderbügels (Hand, Tropfen mit Haken, Etikett, Bügel). Unter 1100 px fällt der lange vierte
   Punkt weg (der Spruch steht auch am Logo), am Handy steht das Symbol über dem Text. Gilt auch oben auf /shop.
   Selektoren mit span.signal-punkt: styles.css blendet am Handy „.signal-strip span:nth-last-child(-n+2)“ aus, das träfe
   sonst auch die Texte in den Feldern. Nach detailansicht.css geladen. */
.signal-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); justify-content: stretch; gap: 0; min-height: 0; padding: 0 var(--gutter); }
.signal-strip span.signal-punkt { display: flex; min-width: 0; min-height: 56px; align-items: center; justify-content: center; gap: 12px; padding: 0 14px; letter-spacing: .16em; }
.signal-strip span.signal-punkt + span.signal-punkt { border-left: 1px solid var(--line-soft); }
.signal-strip span.signal-punkt > span { display: inline; overflow: hidden; text-overflow: ellipsis; }
.signal-strip svg { width: 18px; height: 18px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; color: var(--paper); opacity: .82; }

@media (max-width: 1100px) {
  .signal-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .signal-strip span.signal-punkt:nth-child(4) { display: none; }
}
@media (max-width: 680px) {
  .signal-strip { padding: 0 6px; }
  .signal-strip span.signal-punkt { flex-direction: column; gap: 7px; min-height: 66px; padding: 10px 4px; font-size: 7px; letter-spacing: .1em; }
  .signal-strip span.signal-punkt:nth-child(3) { display: flex; }
  .signal-strip svg { width: 17px; height: 17px; }
}