/*!
 * breadcrumbs.css — Navegació de molles de pa (Rank Math engine).
 *
 * Estil sobri, alineat amb el sistema visual càlid del lloc:
 *  - Text petit, gris càlid, sense soroll
 *  - Verd corporatiu només a l'hover dels enllaços
 *  - Amplada limitada al content width per alinear amb el contingut
 */

.er-breadcrumbs {
	background: transparent;
	font-size: 13px;
	line-height: 1.5;
}

.er-breadcrumbs__inner {
	/* Sense padding ni max-width propis: el shortcode viu dins d'una
	   columna Kadence (Element o fila) que ja imposa l'ample i el
	   marge lateral. L'aire vertical es gestiona des de la fila on
	   l'inserta l'editor. */
	padding: 0;
	margin: 0;
}

/* El markup intern el genera Rank Math: <nav class="rank-math-breadcrumb">
   amb un <p> i <a>/<span> a dins. */
.er-breadcrumbs .rank-math-breadcrumb p {
	margin: 0;
	color: #8A8278;            /* gris càlid, discret */
	display: flex;
	flex-wrap: wrap;
	gap: 4px 6px;
	align-items: center;
}

.er-breadcrumbs .rank-math-breadcrumb a {
	color: #5C5249;            /* marró-gris una mica més fosc per als enllaços */
	text-decoration: none;
	transition: color 0.2s ease;
}

.er-breadcrumbs .rank-math-breadcrumb a:hover,
.er-breadcrumbs .rank-math-breadcrumb a:focus-visible {
	color: #4D8C36;            /* verd corporatiu fosc */
}

/* L'últim element (pàgina actual) — sense enllaç, una mica destacat */
.er-breadcrumbs .rank-math-breadcrumb .last,
.er-breadcrumbs .rank-math-breadcrumb p > span:last-child {
	color: #2A2520;
	font-weight: 500;
}

/* El separador » que injecta Rank Math */
.er-breadcrumbs .rank-math-breadcrumb .separator {
	color: #B5AE9F;
	margin: 0 2px;
}

@media (max-width: 768px) {
	.er-breadcrumbs {
		font-size: 12px;
	}
}