/*
 * CertMatCon 2026 — front-end styles (the single stylesheet).
 *
 * NOTE: the design tokens below are PROVISIONAL placeholders so the scaffold
 * isn't unstyled. The locked design direction replaces this whole tokens block.
 */

:root {
	/* Provisional institutional palette — replaced in the design pass */
	--color-bg: #ffffff;
	--color-fg: #1a2230;
	--color-muted: #5b6678;
	--color-accent: #0a4fa3;       /* trust blue (placeholder) */
	--color-accent-ink: #083b7a;
	--color-line: #e4e8ee;

	--font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--font-head: var(--font-body);

	--container: 1160px;
	--space: clamp(1rem, 2vw, 1.5rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	font-family: var(--font-body);
	color: var(--color-fg);
	background: var(--color-bg);
	line-height: 1.6;
}

img, svg { max-width: 100%; height: auto; display: block; }
a { color: var(--color-accent); }

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

/* Header */
.site-header { border-bottom: 1px solid var(--color-line); }
.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	padding-block: 1rem;
}
.site-header__brand {
	font-weight: 700;
	font-size: 1.25rem;
	color: var(--color-fg);
	text-decoration: none;
}
.site-nav__list {
	list-style: none;
	display: flex;
	gap: 1.25rem;
	margin: 0;
	padding: 0;
}
.site-nav__list a { text-decoration: none; color: var(--color-fg); }

/* Hero (placeholder) */
.hero { padding-block: clamp(3rem, 8vw, 6rem); }
.hero__eyebrow {
	text-transform: uppercase;
	letter-spacing: .08em;
	font-size: .8rem;
	color: var(--color-accent);
	margin: 0 0 .75rem;
}
.hero__title {
	font-size: clamp(2rem, 5vw, 3.25rem);
	line-height: 1.1;
	margin: 0 0 1rem;
}
.hero__lead {
	color: var(--color-muted);
	font-size: 1.125rem;
	max-width: 48ch;
}

/* Footer */
.site-footer { border-top: 1px solid var(--color-line); margin-top: 4rem; }
.site-footer__inner { padding-block: 2rem; }
.site-footer__copy { color: var(--color-muted); margin: 0; }