/* Full-bleed hero image height for single-projects.php and
   single-services.php — matches the real project-detail-N.html /
   services-detail-N.html ".about-mission" hero exactly. The equivalent
   Tailwind arbitrary-value classes (h-[670px], h-[calc(100vh-12vh)]...)
   were never compiled into orion-tailwind.css, so this fills the gap with
   the same values at this project's real breakpoints:
   sm=640, md=769, lg=992, xl=1199, 1xl=1380, 2xl=1752. */
.orion-detail-hero__media {
	position: relative;
	width: 100%;
	height: auto;
}
@media (min-width: 640px)  { .orion-detail-hero__media { height: 450px; } }
@media (min-width: 769px)  { .orion-detail-hero__media { height: 500px; } }
@media (min-width: 992px)  { .orion-detail-hero__media { height: 600px; } }
@media (min-width: 1199px) { .orion-detail-hero__media { height: 670px; } }
@media (min-width: 1380px) { .orion-detail-hero__media { height: calc(100vh - 12vh); } }

.orion-detail-hero__media img {
	display: block;
	width: 100%;
	height: 220px;
	object-fit: cover;
}
@media (min-width: 640px) {
	.orion-detail-hero__media img {
		height: 100% !important;
	}
}