/*
	Layout Styles
	Purpose: Global containers, wrappers, grid, header, footer, and spacing.
*/
@import 'base.css';

:root {
	--section-spacing-block: 5rem;
	--container-slim-max-width: 50rem;
	--container-max-width: 100rem;
	--wrapper-spacing: 2rem;
}

.section {
	margin-block: var(--section-spacing-block);
}

.wrapping {
	padding-inline: var(--wrapper-spacing);
}

.container {
	margin-inline: auto;
	max-width: var(--container-max-width);
}

.container--slim {
	max-width: var(--container-slim-max-width);
}

.section p {
	margin: 2em 0;
	line-height: 1.6;
}

.section h1,
.section h2 {
	margin-bottom: 1rem;
}

/* Compact section: reduce Bulma default padding */
.section--compact {
	padding-top: 0px !important;
	padding-bottom: 24px !important;
}

/* Responsive adjustments for sections */
@media (max-width: 768px) {
	:root {
		--section-spacing-block: 3rem;
		--wrapper-spacing: 1rem;
	}
}