/*
 * Base tipográfica.
 *
 * GeneratePress carga su CSS después de los estilos globales de theme.json y, con la misma
 * especificidad, le gana en tipografía de encabezados y cuerpo. Aquí se restablece lo que
 * dice theme.json, usando solo sus tokens (variables --wp--preset--*).
 */
html body,
html body button,
html body input,
html body select,
html body textarea {
	font-family: var(--wp--preset--font-family--inter);
}

html body :is(h1, h2, h3, h4, h5, h6) {
	font-family: var(--wp--preset--font-family--barlow-condensed);
	line-height: 1.05;
	text-transform: none;
}

html body h1 {
	font-size: var(--wp--preset--font-size--titulo-xl);
	font-weight: 900;
}

html body h2 {
	font-size: var(--wp--preset--font-size--titulo-l);
	font-weight: 800;
}

html body h3 {
	font-size: var(--wp--preset--font-size--titulo-m);
	font-weight: 700;
}

/* Etiqueta pequeña sobre títulos (p. ej. «Información de producto», «Compra online»). */
.bcn-etiqueta {
	margin: 0 0 var(--wp--preset--spacing--20);
	font-family: var(--wp--preset--font-family--inter);
	font-size: var(--wp--preset--font-size--pequena);
	font-weight: 700;
	letter-spacing: 0.15em;
	text-transform: uppercase;
}

html body .bcn-etiqueta {
	line-height: 1.4;
}

/* Botones de bloque (Botones de WordPress): dorado con texto negro, esquinas rectas. GeneratePress los pinta en gris. */
html body .wp-block-button .wp-block-button__link.wp-element-button {
	padding: 0.9em 1.75em;
	background-color: var(--wp--preset--color--dorado);
	color: var(--wp--preset--color--negro);
	border-radius: 0;
	font-family: var(--wp--preset--font-family--inter);
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
}

html body .wp-block-button .wp-block-button__link.wp-element-button:hover,
html body .wp-block-button .wp-block-button__link.wp-element-button:focus-visible {
	background-color: var(--wp--preset--color--negro);
	color: var(--wp--preset--color--blanco);
}

/* Listas numeradas 01, 02, 03… (pasos, qué llevar, preparación). */
.bcn-pasos {
	margin-left: 0;
	padding: 0;
	list-style: none;
	counter-reset: bcn-paso;
}

.bcn-pasos > li {
	position: relative;
	padding-inline-start: 3rem;
	margin-block: var(--wp--preset--spacing--10);
	counter-increment: bcn-paso;
}

.bcn-pasos > li::before {
	content: counter(bcn-paso, decimal-leading-zero);
	position: absolute;
	inset-inline-start: 0;
	font-family: var(--wp--preset--font-family--barlow-condensed);
	font-size: var(--wp--preset--font-size--grande);
	font-weight: 800;
	line-height: 1.2;
}