/* ═══════════════════════════════════════════════════════════════════════
   hh-typografie.css — Umbruch und Lesbarkeit, netzwerkweit
   Eingefuehrt am 2026-10-02 auf rettungsgasse.ch.

   Auftrag und Begruendung:
     _WEBSTRATEGIE/_tools/PROMPT_UMBRUCH-UND-TYPOGRAFIE.md
     _WEBSTRATEGIE/02_grundlagen/UMBRUCH-ANALYSE-2026-10-02.md

   Diese Datei soll in jedem Theme des Verbunds BYTE-GLEICH liegen, bis sie
   als Netzwerk-Plugin kommt (gleiches Muster wie hh-navigation.css).
   Eine Aenderung, alle Stellen.

   SIE LAEDT VOR DER SEITEN-CSS. Sie fuellt Luecken und setzt Grundregeln;
   wo ein Theme bewusst etwas anderes will, gewinnt das Theme. Deshalb steht
   hier kein !important.

   Jede Regel faellt in alten Browsern ohne Fehler zurueck: Wer
   text-wrap oder hyphens nicht kennt, bricht normal um.

   Gepruefte Wirkung: 06_Deployment/umbruch-pruefung/ (sechs Breiten,
   null Fehler als Abnahme).
   ═══════════════════════════════════════════════════════════════════════ */

/* Safari vergroessert Text im Querformat sonst eigenmaechtig. */
html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

/* Notbremse: Ein Wort, das breiter ist als seine Spalte, bricht, statt die
   Spalte zu sprengen. Greift nur, wenn es sonst keinen Umbruchpunkt gibt. */
body { overflow-wrap: break-word; }

/* Ueberschriften ausgewogen, Fliesstext ohne Einzelwort in der letzten Zeile. */
h1, h2, h3, h4, h5, h6 { text-wrap: balance; }
p, li, dd, figcaption, blockquote, summary { text-wrap: pretty; }

/* Silbentrennung nur auf schmalen Geraeten und nur bei langen Woertern:
   mindestens 12 Zeichen, je Teil mindestens 5. Auf dem Desktop wird nicht
   getrennt. Braucht das lang-Attribut am Dokument (de-CH, fr-CH, it-CH). */
@media (max-width: 600px) {
	h1, h2, h3, h4, h5, h6,
	p, li, dd, dt, label, legend, figcaption, blockquote, summary, th, td {
		-webkit-hyphens: auto;
		hyphens: auto;
		-webkit-hyphenate-limit-before: 5;
		-webkit-hyphenate-limit-after: 5;
		hyphenate-limit-chars: 12 5 5;
	}
}

/* Wortgruppen, die nie getrennt werden sollen. Fuer Faelle, die der
   Auslieferungsfilter (inc/typografie.php) nicht kennt. */
.hh-zusammen { white-space: nowrap; }

/* Formulare: Beschriftungen und Meldungen brechen sauber. */
label, legend,
.gfield_label, .gfield_description, .gfield_validation_message,
.validation_message, .gform_validation_errors, .gform_confirmation_message {
	overflow-wrap: anywhere;
}

/* Unter 16 px zoomt iOS beim Antippen eines Feldes in die Seite. */
@media (max-width: 767px) {
	input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]),
	select,
	textarea {
		font-size: max(16px, 1rem);
	}
}

input, select, textarea { max-width: 100%; }
