/**
 * BoraVision layout primitives.
 *
 * Purpose:
 * - defines reusable page-width, section-spacing and grid helpers
 * - gives templates a small set of predictable layout utilities
 *
 * Edit here when:
 * - the standard max-width or page gutter changes across the site
 * - the default section rhythm or generic grid behaviour should shift globally
 *
 * Keep this file structural.
 * Visual styling belongs in component or template files.
 */

/* Standard content widths used by templates and internal components. */
body.boravision .bv-container {
	width: min(100% - (2 * var(--bv-page-gutter)), var(--bv-container));
	margin-inline: auto;
}

body.boravision .bv-container--text {
	width: min(100% - (2 * var(--bv-page-gutter)), var(--bv-container-text));
	margin-inline: auto;
}

/* Vertical rhythm for large content bands. */
body.boravision .bv-section {
	padding-block: var(--bv-section-space);
}

body.boravision .bv-section--surface {
	background: var(--bv-color-surface);
}

/* Generic grid / stack helpers used as layout primitives, not product-specific UI. */
body.boravision .bv-grid {
	display: grid;
	grid-template-columns: repeat(var(--bv-grid-columns), minmax(0, 1fr));
	gap: var(--bv-grid-gap);
}

body.boravision .bv-grid--cards {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.boravision .bv-stack {
	display: flex;
	flex-direction: column;
	gap: var(--bv-space-6);
}

body.boravision .bv-cluster {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--bv-space-3);
}

@media (max-width: 1024px) {
	body.boravision .bv-grid--cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	body.boravision .bv-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	body.boravision .bv-grid--cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}