/* Fonts: Poppins, self-hosted (latin). */
@font-face { font-family: Poppins; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/poppins-400.woff2") format("woff2"); }
@font-face { font-family: Poppins; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/poppins-500.woff2") format("woff2"); }
@font-face { font-family: Poppins; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/poppins-600.woff2") format("woff2"); }

:root {
	--navy: #002955;
	--yellow: #f9d445;
	--line: #dfe5ee;
	--wash: #f1f5fa;
	--text: #000;
	--top-h: 34px;   /* yellow strip (desktop only) */
	--main-h: 60px;  /* white bar (desktop) */
	--gutter: clamp(16px, 3.2vw, 45px);
	--z-header: 100;
	--font: Poppins, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

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

html {
	-webkit-text-size-adjust: 100%;
	scroll-padding-top: calc(var(--main-h) + 12px);
}

body {
	margin: 0;
	font-family: var(--font);
	font-size: 1rem;
	line-height: 1.6;
	color: var(--text);
	background: #fff;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100dvh;
}
.site-main { flex: 1 0 auto; }

img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button { font: inherit; }
a, button { touch-action: manipulation; }

.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

.skip-link {
	position: absolute;
	left: 12px;
	top: -100px;
	z-index: 2000;
	padding: 10px 16px;
	border-radius: 4px;
	background: var(--navy);
	color: #fff;
	font-weight: 600;
	text-decoration: none;
}
.skip-link:focus { top: 12px; }

.site-main:focus { outline: none; }