/**
 * Unified layout shell: container 1280 / content 1040.
 */
:root {
	--rw-container: 1280px;
	--rw-content: 1040px;
	--rw-gutter: 24px;
}

@media (max-width: 767px) {
	:root {
		--rw-gutter: 16px;
	}
}

/* Sync hub tokens with site layout */
.hub {
	--hub-container-max: var(--rw-container);
	--hub-content-max: var(--rw-content);
}

.hub-wrap {
	width: 100%;
	max-width: var(--rw-container);
	margin-inline: auto;
	padding-inline: var(--rw-gutter);
	box-sizing: border-box;
}

.hub-wrap--narrow {
	width: 100%;
	max-width: min(860px, var(--rw-content));
	margin-inline: auto;
	padding-inline: var(--rw-gutter);
	box-sizing: border-box;
}

.hub-wrap--content {
	width: 100%;
	max-width: var(--rw-content);
	margin-inline: auto;
	padding-inline: var(--rw-gutter);
	box-sizing: border-box;
}

/* Global WP/Careerfy containers */
.careerfy-main-section > .container,
body.rework-blog-archive .careerfy-main-section > .container,
body.rework-blog-pages .careerfy-main-section > .container,
body.single-job .careerfy-main-section > .container,
body.single-job .jobsearch-detail > .container,
.rework-24r-professions-wrap .container,
body.rework-24r-professions .careerfy-main-section > .container {
	width: 100% !important;
	max-width: var(--rw-container) !important;
	margin-inline: auto !important;
	padding-inline: var(--rw-gutter) !important;
	box-sizing: border-box !important;
}

/* Prose / long text */
.hub-about__block,
.hub-faq__a,
.jobsearch-description,
.jobsearch-jobdetail-content,
.rework-24r-prof-single__text,
.rework-article-body,
.careerfy-rich-editor,
.entry-content > p {
	max-width: var(--rw-content);
}

/* Footer shell */
#careerfy-footer.careerfy-footer-three > .container {
	width: 100% !important;
	max-width: var(--rw-container) !important;
	margin-inline: auto !important;
	padding-inline: var(--rw-gutter) !important;
	box-sizing: border-box !important;
}

#careerfy-footer.careerfy-footer-three .careerfy-footer-widget > .row {
	max-width: 100%;
	box-sizing: border-box;
}

/* Wider job card grid on ultrawide */
@media (min-width: 1440px) {
	.hub-list {
		grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	}
}