/**
 * TechBBQ Filterable program cards — tabs + cardProgram grid.
 *
 * Figma Startups section 5:
 * - 1440: node 7136:46161
 * - 1024: node 7154:67018
 * - 768:  node 7164:70249
 * - 375:  node 7164:70483
 *
 * Breakpoints (mobile-first): 0–767 (base), 768–1023, 1024–1439, 1440+.
 */

.techbbq-filterable-program-cards {
	--techbbq-filterable-program-cards-gap: var(--techbbq-space-3);
	--techbbq-filterable-program-cards-grid-gap: var(--techbbq-space-1);

	box-sizing: border-box;
	width: 100%;
	color: var(--techbbq-content-primary);
}

.techbbq-filterable-program-cards__inner {
	display: flex;
	flex-direction: column;
	gap: var(--techbbq-filterable-program-cards-gap);
	align-items: center;
	width: 100%;
}

.techbbq-filterable-program-cards__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--techbbq-filterable-program-cards-grid-gap);
	width: 100%;
}

/* ── Tablet (768–1023) ── */
@media (min-width: 768px) {
	.techbbq-filterable-program-cards {
		--techbbq-filterable-program-cards-gap: var(--techbbq-space-5);
	}

	.techbbq-filterable-program-cards__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ── Desktop (1024–1439) ── */
@media (min-width: 1024px) {
	.techbbq-filterable-program-cards__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}