/**
 * PixelHead 4.0 - Main stylesheet
 * Enqueued via functions.php (ph4_enqueue_assets)
 *
 * Split into more files under assets/css/ as the theme grows
 * (e.g. header.css, footer.css, components/*.css) and enqueue
 * them alongside this one in functions.php.
 */

:root {
	--ph4-color-text: var(--color-text-strong);
	--ph4-color-bg: var(--color-neutral-canvas);
	--ph4-color-primary: var(--color-black-soft);
	--ph4-max-width: 1200px;
}

* {
	box-sizing: border-box;
}

body {
	margin: 0;
	color: var(--ph4-color-text);
	background: var(--ph4-color-bg);
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	line-height: 1.5;
}

.site {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.site-header,
.site-footer,
.site-main {
	width: 100%;
	max-width: var(--ph4-max-width);
	margin-inline: auto;
	padding-inline: 1rem;
}

.site-main--home,
.site-main--full-width {
	max-width: none;
	padding-inline: 0;
}

.site-main {
	flex: 1;
}

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