/* =========================================================
   FIDJ PEOPLE HERO
   ========================================================= */

#top .people-header {
	position: relative !important;
	display: block !important;

	width: 100% !important;

	height: min(
		var(--fidj-people-desktop-height, 340px),
		14.57vw
	) !important;

	min-height: 220px !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow: hidden !important;
}

/* =========================================================
   IMAGE
   ========================================================= */

#top .people-header-picture {
	position: absolute !important;
	inset: 0 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow: hidden !important;
}

#top .people-header-img {
	position: absolute !important;
	inset: 0 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover !important;
	object-position: var(--fidj-people-desktop-position, right center) !important;
}

/* =========================================================
   TITLE
   ========================================================= */

#top .people-header-title {
	position: absolute !important;
	z-index: 2;

	top: 50% !important;
	left: 50% !important;

	width: calc(100% - 80px) !important;
	margin: 0 !important;

	transform: translate(-50%, -50%) !important;

	text-align: center !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 767px) {

	#top .people-header {
		height: var(--fidj-people-mobile-height, 280px) !important;
        margin-top: -50px !important;
	}

	#top .people-header-img {
		object-position: var(--fidj-people-mobile-position, 80% center) !important;
	}

	#top .people-header-title {
        width: calc(100% - 52px) !important;
    }
}

/*
 * Old People profiles use .header-single + .header-single-mobile.
 * Keep the new responsive hero visible while profiles are migrated.
 */
@media screen and (max-width: 479px) {

	.post-type-people .header-single.people-header {
		display: block !important;
	}
}