/**
 * NewEra base styles: typography + layout primitives on top of tokens.css.
 * Component classes live in components.css; per-template CSS in its own file.
 */

html { overflow-x: clip; }

body {
	max-width: 100%;
	/* clip (not hidden): hidden makes body a scroll container, which
	   silently disables every position:sticky descendant (quick links). */
	overflow-x: clip;
	font-family: var(--ne-font);
	font-size: var(--ne-b1-size);
	line-height: var(--ne-b1-line);
	color: var(--ne-neutral-1000);
	background: var(--ne-neutral-100);
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--ne-font);
	color: var(--ne-primary-500);
	font-weight: 700;
}

h1 { font-size: var(--ne-h1-size); line-height: var(--ne-h1-line); }
h2 { font-size: var(--ne-h2-size); line-height: var(--ne-h2-line); }
h3 { font-size: var(--ne-h4-size); line-height: var(--ne-h4-line); }
h4 { font-size: var(--ne-h6-size); line-height: var(--ne-h6-line); }

*, *::before, *::after { box-sizing: border-box; }

a { color: var(--ne-primary-400); }

img { max-width: 100%; height: auto; }

.ne-container {
	max-width: var(--ne-container);
	margin-inline: auto;
	padding-inline: var(--ne-space-xl);
}

/* Vertical rhythm for stacked page sections */
.ne-section { padding-block: var(--ne-space-6xl); }
.ne-section--tight { padding-block: var(--ne-space-4xl); }
.ne-section--tint { background: var(--ne-tertiary-100); }
.ne-section--muted { background: var(--ne-primary-a10); }
.ne-section--gray { background: #f5f7fb; }

/* Utility */
.ne-visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}

/* ---------------------------------------------------------------- *
 *  GeneratePress layout neutralisation — the NewEra design is
 *  full-width with its own .ne-container gutters, so strip GP's
 *  site max-width, padding and separators.
 * ---------------------------------------------------------------- */
.site-content .content-area,
.site-main,
.inside-article,
.entry-content { max-width: none; }
#page.site,
.site-content,
#content.site-content { max-width: none; padding: 0; margin: 0; }
.separate-containers .inside-article,
.separate-containers .site-main { margin: 0; }
.generate-columns-container { margin: 0; }
body .site-content { display: block; }

/* ---------------------------------------------------------------- *
 *  Responsive heading scale-down
 * ---------------------------------------------------------------- */
@media (max-width: 1024px) {
	h1 { font-size: 44px; line-height: 1.15; }
	h2 { font-size: 36px; line-height: 1.2; }
	h3 { font-size: 28px; line-height: 1.25; }
	.ne-sechead__title { font-size: 28px; line-height: 1.25; }
	.ne-container { padding-inline: var(--ne-space-l); }
}

@media (max-width: 640px) {
	h1 { font-size: 34px; line-height: 1.15; }
	h2 { font-size: 28px; line-height: 1.2; }
	h3 { font-size: 24px; line-height: 1.25; }
	.ne-sechead__title { font-size: 24px; line-height: 1.3; }
	.ne-cta-banner__title { font-size: 26px; line-height: 1.25; }
	.ne-section { padding-block: var(--ne-space-4xl); }
	.ne-container { padding-inline: var(--ne-space-m); }
}
