/* -----------------------------------------
   Soulmix - Recetas: listing grid
   ----------------------------------------- */

.recetas-grid {
	padding: clamp(16px, calc(16 / 1920 * 100vw), 22px) 0 88px;
}

.recetas-grid__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: 24px;
	row-gap: 96px;
}

/* .receta-card / .receta-card__media / .receta-card__title-row / etc. se
   reutilizan tal cual de producto.css (ya cargado globalmente). Solo se
   añade aquí el badge de sabor, que esa card no tenía. */
.receta-card__media {
	position: relative;
}

.receta-card__badge {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 1;
	display: inline-block;
	font-family: var(--font-condensed);
	font-weight: 900;
	font-size: 13px;
	line-height: 1;
	text-transform: uppercase;
	color: #1F1E1D;
	border-radius: 999px;
	padding: 8px 14px;
}