/* El Sello de Confianza Sortícula.

   Vivía dentro de product.css, que solo se carga en la ficha de producto. Al
   pasar los sellos a ser también una sección apagable de la portada hacía falta
   una hoja propia: la cargan la home, el producto y el carrito.

   La grilla es `auto-fit` a propósito: los sellos son cinco, pero cada uno se
   apaga vaciando su título en el panel, así que la fila tiene que recomponerse
   sola con cinco, con tres o con uno. */

.sc-sellos {
	padding: var(--space-8) var(--pad);
	background: var(--bg);
	color: var(--fg);
	border-top: 1px solid var(--line);
}

.sc-sellos .shell {
	max-width: var(--maxw);
	margin: 0 auto;
}

/* Solo existe cuando esto es una sección de la portada; al pie de la ficha de
   experiencia la banda va suelta, sin titular que compita con el producto. */
.sc-sellos-head {
	margin-bottom: var(--space-7);
	max-width: var(--measure);
}

.sc-sellos-head .title {
	font-family: var(--serif);
	font-size: var(--fs-h2);
	line-height: var(--lh-title);
	letter-spacing: var(--track-title);
	margin: var(--space-3) 0 0;
}

.sc-sellos-head .ital {
	font-style: italic;
	color: var(--accent);
}

.sc-sellos .grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: var(--space-6);
}

.sc-sellos .desc {
	margin: var(--space-3) 0 0;
	color: var(--fg-muted);
	font-size: var(--fs-sm);
	line-height: 1.55;
}
