/* Farbfelder: quadratische Fläche links, rechts Name, HEX, RGB, Verwendung (inc/farbfelder.php).
   Rand und Radius wie die Farbkacheln im Styleguide; als Liste, damit es auch in die Marginalspalte passt. */
.wir-farbfelder.is-layout-grid { gap: var(--wp--preset--spacing--s, 1rem) var(--wp--preset--spacing--m); grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)) !important; margin-block: var(--wp--preset--spacing--m) var(--wp--preset--spacing--l); }
.wir-farbfeld.is-layout-flow { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: 1rem; align-items: start; margin: 0; }
.wir-farbfeld > * { margin: 0 !important; }
.wir-farbfeld__feld.has-background { aspect-ratio: 1; min-height: 0; padding: 0 !important; border: 1px solid var(--wp--preset--color--linie); border-radius: var(--wp--custom--radius--kachel); }
.wir-farbfeld p { font-size: var(--wp--preset--font-size--meta); line-height: 1.5; font-variant-numeric: tabular-nums; color: var(--wp--preset--color--text-leise); }
.wir-farbfeld p strong { display: block; font-weight: 600; color: var(--wp--preset--color--text); }
/* Textseiten ab 1200 px: Farbfelder direkt im Text stehen in dessen Spalte (rahmen.css, hängende Überschriften) */
@media (min-width: 75em) {
	.seite:not(.seite--start) > .wp-block-post-content > .wir-farbfelder { margin-left: var(--wir-einzug) !important; max-width: none; }
}