/*
 * Layout primitives — containers, sections, grid helpers.
 * These class names are used by the Gutenberg block patterns so page content
 * stays editable while remaining pixel-faithful.
 */

.site-main {
	min-height: 50vh;
}

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

/* Vertical rhythm for page sections */
.section {
	padding-block: var(--section-py);
}
.section--tight { padding-block: clamp(2rem, 1.5rem + 2vw, 3.5rem); }
.section--flush-top { padding-top: 0; }
.section--flush-bottom { padding-bottom: 0; }

/* Section header (eyebrow + heading + intro, usually centred) */
.section__head {
	max-width: 760px;
	margin: 0 auto 2.5rem;
}
.section__head--left { margin-inline: 0; }
.section__head p { color: var(--color-muted); }
.section__head .eyebrow { margin-bottom: 1rem; }
.section__intro {
	font-size: var(--fs-lead);
	color: var(--color-muted);
}

/* Background helpers */
.bg-white { background: var(--pos-white); }
.bg-light { background: var(--pos-light); }
.bg-light-grey { background: var(--pos-light-grey); }
.bg-pale-cyan { background: var(--pos-pale-cyan); }
.bg-dark { background: var(--pos-dark); color: #fff; }
.bg-navy { background: var(--pos-navy); color: #fff; }
.bg-gradient { background: var(--pos-gradient); color: #fff; }

.bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4,
.bg-navy h1, .bg-navy h2, .bg-navy h3, .bg-navy h4,
.bg-gradient h1, .bg-gradient h2, .bg-gradient h3, .bg-gradient h4 {
	color: #fff;
}
.bg-dark a:not(.btn), .bg-navy a:not(.btn), .bg-gradient a:not(.btn) { color: #fff; text-decoration: underline; }

/* Text helpers */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-muted { color: var(--color-muted); }
.text-white { color: #fff; }
.text-primary { color: var(--pos-primary); }
.lead { font-size: var(--fs-lead); }

/* Gradient text (highlighted heading words) */
.text-gradient {
	background: var(--pos-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: var(--pos-primary); /* fallback */
}

.mx-auto { margin-inline: auto; }
.measure { max-width: 65ch; }
.measure-narrow { max-width: 48ch; }

/* Simple responsive grids */
.grid {
	display: grid;
	gap: var(--gutter);
}
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.grid--gap-lg { gap: 1.5rem; }

.flex {
	display: flex;
	gap: var(--gutter);
}
.flex-center { align-items: center; }
.flex-between { justify-content: space-between; }
.flex-wrap { flex-wrap: wrap; }

@media (max-width: 1024px) {
	.grid-4 { grid-template-columns: repeat(2, 1fr); }
	.grid-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
	.grid-2,
	.grid-3,
	.grid-4 { grid-template-columns: 1fr; }
}
