/* ============================================================
   Layout: container, sections, header & footer scaffolding
   ============================================================ */
.container { width: min(var(--container), 100% - var(--gutter)); margin-inline: auto; }

.site-main { display: block; }

/* Generic vertical rhythm for sections */
section { position: relative; }

.section-title {
	font-size: clamp(30px, 3.6vw, 48px);
	line-height: 1.16;
	font-weight: 800;
	color: var(--ink);
	text-transform: uppercase;
}
.section-title--sentence { text-transform: none; }
.section-title--center { text-align: center; }

/* ---------------------------------------------------- HEADER */
.site-header {
	position: sticky; top: 0; z-index: 100;
	background: var(--white);
}
.site-header__inner {
	display: flex; align-items: center; gap: 40px;
	padding: 20px 0;
}
.site-header__logo { flex: 1 1 0; min-width: 0; display: inline-flex; }
.site-header__logo svg { height: 72px; width: auto; }

.site-nav { flex: 1 1 0; min-width: 0; display: flex; justify-content: flex-end; }
.site-nav__list { display: flex; align-items: center; gap: 40px; }
.site-nav__list a {
	color: var(--ink); font-weight: 800; font-size: 20px;
	line-height: 28px; text-transform: uppercase; letter-spacing: .4px; white-space: nowrap;
}
.site-nav__list a:hover { color: var(--blue); }
/* Anchor links to the front page all match as "current"; keep them navy, blue on hover only. */
.site-nav__list .current-menu-item > a { color: var(--ink); }
.site-nav__list .current-menu-item > a:hover { color: var(--blue); }

.site-header__cta { display: flex; align-items: center; gap: 16px; flex: 0 0 auto; }

@media (max-width: 1300px) {
	.site-nav__list { gap: 28px; }
	.site-nav__list a { font-size: 18px; }
	.site-header__logo svg { height: 60px; }
}

.nav-toggle { display: none; }

/* ---------------------------------------------------- FOOTER */
/* Design: white footer; only the top strip (logo + stats) is navy; columns are black-on-white. */
.site-footer { background: #fff; color: var(--ink); padding-bottom: 40px; }
.site-footer__top { background: var(--navy); padding: 40px 0; }
.site-footer__top-inner { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.site-footer__logo { display: inline-flex; flex: 1 1 0; min-width: 0; }
.site-footer__logo svg { height: 72px; width: auto; }

.footer-stats { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; }
.footer-stats__item { display: inline-flex; align-items: center; gap: 8px; color: #fff; font-weight: 400; font-size: 20px; line-height: 28px; }
.footer-stats__item .icon { width: 24px; height: 24px; color: var(--blue); flex: 0 0 auto; }

.site-footer__body { margin-top: 40px; display: flex; flex-direction: column; gap: 40px; }
.footer-cols { display: flex; gap: 32px; align-items: flex-start; }
.footer-col { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.footer-col__title { color: var(--ink); font-size: 20px; line-height: 28px; font-weight: 800; text-transform: uppercase; }
.footer-col p { margin: 0; font-size: 16px; line-height: 24px; color: var(--ink); }
.footer-col p strong { font-weight: 700; }
.footer-col a { color: var(--ink); text-decoration: underline; }
.footer-col a:hover { color: var(--blue); }

.site-footer__bottom {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding-top: 40px; flex-wrap: wrap;
}
.site-footer__copy { font-size: 14px; line-height: 22px; color: var(--ink); }
.site-footer__links { display: flex; gap: 24px; flex-wrap: wrap; }
.site-footer__links a { color: var(--ink); font-size: 14px; line-height: 22px; }
.site-footer__links a:hover { color: var(--blue); }

/* ---------------------------------------------------- LEGAL / GENERIC PAGE */
.page-article__head { background: var(--tint); padding: 56px 0; border-bottom: 1px solid var(--line); }
.page-article__title { font-size: clamp(30px, 4vw, 48px); }
.page-article__body { max-width: 880px; padding: 56px 0 88px; }

/* ---------------------------------------------------- RESPONSIVE */
@media (max-width: 980px) {
	.footer-cols { flex-wrap: wrap; }
	.footer-col { flex: 1 1 calc(50% - 16px); }
	.site-footer__logo { flex: 0 0 auto; }
	.footer-stats { width: 100%; }
}
@media (max-width: 1023px) {
	:root { --header-h: 80px; }
	.site-nav, .site-header__cta { display: none; }
	.site-header__inner { padding: 16px 0; }
	.site-header__logo svg { height: 52px; }
	.site-footer__logo svg { height: 56px; }
	.nav-toggle {
		display: inline-flex; align-items: center; justify-content: center;
		margin-left: auto; width: 44px; height: 44px; border: 1px solid var(--line);
		border-radius: 10px; background: #fff; color: var(--ink);
	}
	.nav-toggle .icon--close { display: none; }
	.nav-toggle[aria-expanded="true"] .icon--menu { display: none; }
	.nav-toggle[aria-expanded="true"] .icon--close { display: block; }
}
@media (max-width: 560px) {
	.footer-col { flex: 1 1 100%; }
	.site-footer__bottom { flex-direction: column; align-items: flex-start; }
	.site-header__logo svg { height: 44px; }
	.site-footer__logo svg { height: 48px; }
}