.site {
	max-width: 1240px;
	margin: 0 auto;
	padding: var(--space-5) var(--space-4) var(--space-2);
}

.brand {
	display: inline-block;
	font-size: 1.75rem;
	font-weight: 700;
	letter-spacing: 0.01em;
	text-decoration: none;
}

.brand span {
	color: var(--accent);
}

.tagline {
	margin: var(--space-1) 0 0;
	color: var(--muted);
}

main {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 var(--space-4) var(--space-5);
}

.content {
	margin: var(--space-4) 0;
}

.site-footer {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2) var(--space-4);
	max-width: 1240px;
	margin: 0 auto;
	padding: var(--space-4);
	border-top: 1px solid var(--line);
	color: var(--muted);
	font-size: 0.85rem;
}

.site-footer a {
	color: var(--text);
}

@media (max-width: 640px) {
	.site {
		padding: var(--space-4) var(--space-3) var(--space-1);
	}

	main {
		padding: 0 var(--space-3) var(--space-4);
	}

	.site-footer {
		padding: var(--space-3);
	}
}