/**
 * Headings — escalado responsive redefiniendo presets de :root.
 * theme.json no se toca; todo lo que use var(--wp--preset--font-size--*) hereda el cambio.
 * Valores en px para evitar escalado rem del font-size de :root.
 */

:root {
	/* Mismos valores que theme.json, en px (WP suele emitirlos en rem). */
	--wp--preset--font-size--heading-1: 64px;
	--wp--preset--font-size--heading-2: 40px;
	--wp--preset--font-size--heading-3: 32px;
	--wp--preset--font-size--x-large: 24px;
	--wp--preset--font-size--large: 20px;
}

@media (max-width: 1023px) {

	:root {
		--wp--preset--font-size--heading-1: 48px;
		--wp--preset--font-size--heading-2: 32px;
		--wp--preset--font-size--heading-3: 26px;
	}
}

@media (max-width: 640px) {

	:root {
		--wp--preset--font-size--heading-1: 36px;
		--wp--preset--font-size--heading-2: 28px;
		--wp--preset--font-size--heading-3: 24px;
	}
}
