/*
 * Tokens del tema.
 *
 * No hay un solo color ni tamaño escrito aquí: todo son alias de las
 * variables que WordPress genera a partir de theme.json. Cambiar la paleta
 * en theme.json (o desde el editor de estilos) cambia el front entero, y el
 * CSS del tema sólo habla en estos nombres cortos.
 */
:root {
	--or-ink: var(--wp--preset--color--ink);
	--or-white: var(--wp--preset--color--white);
	--or-coral: var(--wp--preset--color--coral);
	--or-coral-deep: var(--wp--preset--color--coral-deep);
	--or-coral-soft: var(--wp--preset--color--coral-soft);
	--or-coral-line: var(--wp--preset--color--coral-line);
	--or-cream: var(--wp--preset--color--cream);
	--or-cream-2: var(--wp--preset--color--cream-2);
	--or-line: var(--wp--preset--color--line);
	--or-line-2: var(--wp--preset--color--line-2);
	--or-text-2: var(--wp--preset--color--text-2);
	--or-muted: var(--wp--preset--color--muted);
	--or-muted-2: var(--wp--preset--color--muted-2);
	--or-violet: var(--wp--preset--color--violet);
	--or-dark-2: var(--wp--preset--color--dark-2);
	--or-on-dark: var(--wp--preset--color--on-dark);
	--or-success: var(--wp--preset--color--success);
	--or-error: var(--wp--preset--color--error);
	--or-wa: var(--wp--preset--color--whatsapp);
	--or-star: var(--wp--preset--color--star);

	--or-font: var(--wp--preset--font-family--body);
	--or-font-display: var(--wp--preset--font-family--display);

	--or-fs-xs: var(--wp--preset--font-size--xs);
	--or-fs-sm: var(--wp--preset--font-size--sm);
	--or-fs-md: var(--wp--preset--font-size--md);
	--or-fs-lg: var(--wp--preset--font-size--lg);
	--or-fs-xl: var(--wp--preset--font-size--xl);
	--or-fs-h2: var(--wp--preset--font-size--h-2);
	--or-fs-display: var(--wp--preset--font-size--display);

	--or-sp-1: var(--wp--preset--spacing--10);
	--or-sp-2: var(--wp--preset--spacing--20);
	--or-sp-3: var(--wp--preset--spacing--30);
	--or-sp-4: var(--wp--preset--spacing--40);
	--or-sp-5: var(--wp--preset--spacing--50);
	--or-sp-6: var(--wp--preset--spacing--60);

	--or-r-sm: var(--wp--custom--radius--sm);
	--or-r-md: var(--wp--custom--radius--md);
	--or-r-lg: var(--wp--custom--radius--lg);
	--or-r-xl: var(--wp--custom--radius--xl);
	--or-r-pill: var(--wp--custom--radius--pill);

	--or-wrap: var(--wp--custom--wrap);
	--or-gutter: var(--wp--custom--gutter-mobile);
	--or-hdr-h: var(--wp--custom--header--height-mobile);

	/* Derivados: no son de marca, son consecuencia de los de arriba. */
	--or-shadow: 0 10px 30px rgb(0 0 0 / 0.18);
	--or-backdrop: rgb(17 17 17 / 0.45);
	--or-ease: 0.18s ease;
}

@media (min-width: 561px) {
	:root { --or-gutter: var(--wp--custom--gutter); }
}

@media (min-width: 1181px) {
	:root { --or-hdr-h: var(--wp--custom--header--height); }
}
