/* Tienda y categoría: H1 con la palabra, entradilla, hechos de compra y los productos por grupos; después, las
   preguntas y la cooperativa sobre el olivar. */

.os-woo__migas {
	padding-top: clamp(40px, 5vw, 64px);
}

.os-tienda__cabecera {
	padding-bottom: clamp(24px, 3vw, 40px);
}

.os-tienda__titulo {
	max-width: 18em;
	margin: 0 0 12px;
	font-size: var(--os-t-pagina);
}

.os-tienda__entradilla {
	max-width: 42rem;
	margin: 0 0 20px;
	color: var(--os-tinta-suave);
	font-size: var(--os-t-entradilla);
	line-height: 1.5;
}

.os-tienda__entradilla p {
	margin: 0;
}

.os-tienda__lista {
	padding-bottom: var(--os-seccion);
}

.os-grupo + .os-grupo {
	margin-top: clamp(48px, 6vw, 80px);
}

.os-grupo__cabecera {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 24px;
	margin-bottom: clamp(20px, 2.6vw, 32px);
	padding-bottom: 12px;
	border-bottom: 1px solid var(--os-linea);
}

.os-grupo__cabecera h2 {
	margin: 0;
	font-size: var(--os-t-titular);
}

.os-grupo__cabecera p {
	margin: 0;
	color: var(--os-tinta-suave);
}

.os-grupo--agotado ul.products {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.os-grupo--agotado .os-tarjeta__nombre {
	font-size: 1.1875rem;
}

/* La cooperativa sobre el olivar */
.os-banda-olivar {
	position: relative;
	isolation: isolate;
	padding-block: clamp(72px, 10vw, 140px);
	background: var(--os-verde-hondo);
	color: var(--os-sobre-verde);
	overflow: hidden;
}

.os-banda-olivar__foto {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.os-banda-olivar::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(90deg, rgba(43, 53, 0, 0.92) 0%, rgba(43, 53, 0, 0.78) 45%, rgba(43, 53, 0, 0.25) 100%);
}

.os-banda-olivar__dentro {
	display: grid;
	gap: 14px;
	justify-items: start;
}

.os-banda-olivar h2 {
	max-width: 16em;
	margin: 0;
	color: var(--os-blanco);
}

.os-banda-olivar p {
	max-width: 34rem;
	margin: 0 0 8px;
}

@media (max-width: 1024px) {
	.os-grupo--agotado ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
