/* ── Page Hero — shared subpage hero with image bg ─────────────────────────── */

.ph {
	position: relative;
	background: var(--color-near-black, #0B0B0F);
	color: #fff;
	overflow: hidden;
	margin-top: -7rem;
}

@media (min-width: 1024px) {
	.ph {
		margin-top: -8rem;
	}
}

.ph__bg {
	position: absolute;
	inset: 0;
}

.ph__bg-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.6;
	display: block;
}

.ph__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(11,11,15,0.8) 0%, rgba(11,11,15,0.6) 50%, #0B0B0F 100%);
}

.ph__content {
	position: relative;
	padding-top: 7rem;   /* pt-28 */
	padding-bottom: 6rem; /* pb-24 */
	max-width: 48rem;
	margin-left: 0;
}

@media (min-width: 1024px) {
	.ph__content {
		padding-top: 10rem;  /* lg:pt-40 */
		padding-bottom: 8rem; /* lg:pb-32 */
	}
}

.ph__eyebrow {
	margin-bottom: 1.5rem;
}

.ph__title {
	color: #fff;
	margin: 0;
}

.ph__intro {
	margin-top: 1.75rem;
	color: rgba(255,255,255,0.8);
	font-size: 1.125rem;
	line-height: 1.7;
	max-width: 40rem;
}

@media (min-width: 1024px) {
	.ph__intro {
		font-size: 1.25rem;
	}
}