/* ==========================================================================
   CABECERA DE PÁGINA (template-parts/page-header.php)
   Imagen + franja azul con el titular. Mismo diseño que el widget de Elementor
   "Cabecera de página interna (mim)". La usan la ficha de establecimiento y el
   archivo de eventos.
   ========================================================================== */

.mim-page-header-media {
	position: relative;
	height: 589px;
	background-color: #005888;
}

.mim-page-header-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.mim-page-header-bar {
	display: flex;
	align-items: center;
	width: fit-content;
	min-width: 730px;
	max-width: 100%;
	min-height: 126px;
	padding: 20px 60px 20px 93px;
	background-color: #005888;
	border-radius: 0 0 0 100px;
}

.mim-page-header-title {
	margin: 0;
	font-weight: 500;
	line-height: .9;
	color: #fff;
}

.mim-page-header-title.is-normal-case {
	text-transform: none;
}

@media only screen and (max-width: 1100px) {
	.mim-page-header-media {
		height: 460px;
	}

	.mim-page-header-bar {
		min-width: 0;
		min-height: 100px;
		padding-left: 60px;
	}

	.mim-page-header-title {
		font-size: 48px;
	}
}

@media only screen and (max-width: 767px) {
	.mim-page-header-media {
		height: 462px;
	}

	/* Degradado para que la cabecera del sitio se lea sobre la foto (diseño móvil). */
	.mim-page-header-media::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 45px;
		background: linear-gradient(to bottom, rgba(0, 88, 136, .5), rgba(0, 88, 136, 0));
	}

	.mim-page-header-bar {
		min-width: 194px;
		min-height: 58px;
		padding: 10px 30px 10px 41px;
		background-color: #004D79;
		border-radius: 0 0 0 45px;
	}

	.mim-page-header-title {
		font-size: 30px;
	}
}
