/* Gemeinsame Tokens für alle Infografiken.
   Bewusst auf .rwif-grafik statt :root, damit das Plugin keine globalen
   Custom Properties des Themes überschreibt. */

.rwif-grafik {
	--rwif-paper: #EFF1EC;
	--rwif-paper-2: #E3E8DE;
	--rwif-paper-3: #D6DCD1;
	--rwif-ink: #17211B;
	--rwif-ink-soft: #5C6A5F;
	--rwif-ink-faint: #8A968C;
	--rwif-forest: #1E5C3C;
	--rwif-leaf: #3F9161;
	--rwif-savanna: #C4922F;
	--rwif-dust: #8A6224;
	--rwif-alert: #A8442E;
	--rwif-line: #C9D1C5;
	--rwif-on-ground: #EFF1EC;
	--rwif-shadow: 0 1px 2px rgba(23, 33, 27, .06), 0 8px 24px -12px rgba(23, 33, 27, .22);

	/* Die drei Schriftstapel der Website, unveraendert uebernommen. Das Plugin
	   laedt dadurch keine einzige Schriftdatei: Enriqueta liefert das Theme
	   bereits selbst aus, Georgia und die Systemschrift sind ohnehin da.
	   --rwif-ui traegt Zahlen und Bedienelemente, weil Enriqueta und Georgia
	   Mediaevalziffern haben (3, 7, 9 haengen unter die Grundlinie) -- fuer
	   einen Messwert wie "2,3 °C" liest sich das dekorativ statt exakt. */
	--rwif-display: Enriqueta, Arial, Helvetica, sans-serif;
	--rwif-body: Georgia, "Times New Roman", Times, serif;
	--rwif-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;

	box-sizing: border-box;
	max-width: 960px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 30px;
	background: var(--rwif-paper);
	color: var(--rwif-ink);
	font-family: var(--rwif-body);
	font-size: 17px;
	line-height: 1.62;
	padding: 32px 22px 40px;
	border-radius: 18px;
}

@media (prefers-color-scheme: dark) {
	.rwif-grafik {
		--rwif-paper: #111610;
		--rwif-paper-2: #1A211A;
		--rwif-paper-3: #232B22;
		--rwif-ink: #E7EDE5;
		--rwif-ink-soft: #9DAA9C;
		--rwif-ink-faint: #6E7C6F;
		--rwif-forest: #2C7A4F;
		--rwif-leaf: #56AA78;
		--rwif-savanna: #D9A845;
		--rwif-dust: #A87B31;
		--rwif-alert: #D97054;
		--rwif-line: #2E382D;
		--rwif-on-ground: #0E120D;
		--rwif-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px -12px rgba(0, 0, 0, .7);
	}
}

.rwif-grafik * {
	box-sizing: border-box;
}

.rwif-eyebrow {
	font-family: var(--rwif-ui);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--rwif-leaf);
	margin: 0 0 10px;
}

.rwif-titel {
	font-family: var(--rwif-display);
	font-weight: 700;
	font-size: clamp(32px, 5.4vw, 52px);
	line-height: 1.04;
	letter-spacing: -.02em;
	margin: 0 0 14px;
	text-wrap: balance;
	color: var(--rwif-ink);
}

.rwif-lead {
	margin: 0;
	font-size: 19px;
	color: var(--rwif-ink-soft);
}

.rwif-lead strong {
	color: var(--rwif-ink);
	font-weight: 600;
}


@media (prefers-reduced-motion: reduce) {
	.rwif-grafik * {
		transition-duration: .01ms !important;
	}
}
