/*
 * WordPress layout cutover — one fluid content rail for every theme template.
 *
 * `styles.css` is statics-owned and retains its 980px source rule. This file
 * loads after it and makes the WP theme use the wider rail without modifying
 * the static bundle. Readable content remains deliberately narrower inside
 * that rail.
 */
:root {
	/* Outer wrap (content + side gutters) never exceeds 1280px. */
	--el-layout-max-width: 1280px;
	--el-layout-gutter: 20px;
	--el-layout-rail: min(calc(100% - (var(--el-layout-gutter) * 2)), calc(var(--el-layout-max-width) - (var(--el-layout-gutter) * 2)));
	--el-reading-measure: 760px;
}

@media (min-width: 640px) {
	:root {
		--el-layout-gutter: 32px;
	}
}

@media (min-width: 1024px) {
	:root {
		--el-layout-gutter: 40px;
	}
}

/* Every existing page, header, and footer wrapper shares the same rail. */
.page-container,
.page-container-wide {
	width: var(--el-layout-rail);
	max-width: none;
	margin-inline: auto;
}


/* The navigation is not wrapped in `.page-container`; align its tabs to it. */
.feature-nav ul {
	width: var(--el-layout-rail);
	min-width: 0;
	margin-inline: auto;
}

/* Fluent Forms inherited the old 980px cap independently of its wrapper. */
.contact-section .fluentform .frm-fluent-form {
	max-width: none;
}

/* Remaining statics-era 980px caps inside a fluid page region. */
.about-service__body > div,
.about-history__brands,
.contact-form,
.contact-privacy,
.contact-note,
.contact-status {
	max-width: none;
}

/* Editorial text stays easy to scan while the surrounding region grows. */
.article-header > .page-container,
.article-content__inner {
	max-width: var(--el-reading-measure);
}

.article-body,
.faq-page .faq-groups,
.privacy-paper > header,
.privacy-paper > .privacy-section {
	max-width: var(--el-reading-measure);
}

/* Wide hero regions keep a restrained copy column rather than a long line. */
.blog-hero p,
.talk-hero__inner > p,
.about-hero p {
	max-width: var(--el-reading-measure);
}

.about-hero p {
	margin-inline: auto;
}

/*
 * ArticleTypo — WordPress core blocks retain their semantic wrappers while
 * inheriting the shared `.article-body` editorial scale from styles.css.
 */
.section-stack > .article-content,
.article-content__inner,
.article-body {
	min-width: 0;
}

.article-body .wp-block-image,
.article-body .wp-block-table {
	min-width: 0;
	max-width: 100%;
}

.article-body .wp-block-table {
	overflow-x: auto;
	overscroll-behavior-inline: contain;
}

.article-body .wp-block-table > table {
	min-width: 560px;
}

.article-body .wp-block-image .wp-element-caption,
.article-body .wp-block-table figcaption {
	margin-top: 8px;
	font-size: 13px;
	line-height: 20px;
	color: #5f6368;
}

@media (min-width: 640px) {
	.article-body .wp-block-table > table {
		min-width: 100%;
	}
}
