/* ------------------------------------------------------------------
   Ajustes propios de la versión estática.
   Sustituyen CSS que WordPress imprimía inline o que venía en
   font-awesome.css (que ya no cargamos: los 9 glifos son SVG inline).
   ------------------------------------------------------------------ */

/* 1. WP imprimía `.page-id-N.disabled_footer_bottom .footer_bottom_holder{display:none}`
      en cada página. La regla era idéntica en las 13 páginas archivadas. */
.disabled_footer_bottom .footer_bottom_holder { display: none; }

/* 2. Reglas base de Font Awesome 4 que Bridge da por sentadas.
      Copiadas literalmente de font-awesome.css 4.7.0 (sólo las de caja,
      sin @font-face ni los 700+ selectores :before). */
.fa {
	display: inline-block;
	font-size: inherit;
	line-height: 1;          /* FA4 lo fija vía `font: ... 14px/1 FontAwesome` */
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.fa-stack {
	position: relative;
	display: inline-block;
	width: 2em;
	height: 2em;
	line-height: 2em;
	vertical-align: middle;
}
.fa-stack-1x,
.fa-stack-2x {
	position: absolute;
	left: 0;
	width: 100%;
	text-align: center;
}
.fa-stack-1x { line-height: inherit; }
.fa-stack-2x { font-size: 2em; }

/* 3. Los glifos son ahora SVG inline dentro del <i> original, para conservar
      intactas las clases de Bridge (.qode_icon_font_awesome, .fa-stack…). */
i.fa > svg {
	display: inline-block;
	height: 1em;
	width: auto;             /* el viewBox lleva el avance real del glifo (horiz-adv-x) */
	vertical-align: bottom;
	fill: currentColor;
}

/* Un <i> con glifo de fuente apoya en la línea base del texto; uno con SVG apoya
   en el borde inferior de la caja. La diferencia es el medio interlineado del em
   de FontAwesome: 1/18 em. Se compensa con posicionamiento relativo, que NO altera
   el flujo (los iconos dentro de .fa-stack van centrados por flex y quedan fuera).

   OJO CON LOS ICONOS QUE BRIDGE POSICIONA ÉL: la compensación hace falta
   SOLO en los iconos que van en el flujo, donde la caja del <i> la decide su
   contenido. Cuando Bridge le da `position:absolute` y lo centra a mano
   (`top:50%;margin-top:-15px`), la caja ya no depende del contenido: ahí no
   hay nada que compensar, y encima este `position:relative` le pisaba el
   `absolute` — las lupas de la galería de Sustainability se iban 132 px
   arriba, a la esquina de la foto en vez de a su centro.

   Por eso las exclusiones. Si aparece otro contexto donde Bridge posicione
   un icono, hay que añadirlo aquí; lo delata `jscheck` o el diff. */
i.fa:has(> svg):not(.fa-stack i):not(.gallery_hover i) {
	position: relative;
	top: 0.0556em;
}
.fa-stack > i.fa {
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.fa-stack > i.fa > svg { vertical-align: 0; }

/* 4. LEGIBILIDAD DEL MENÚ SOBRE EL HERO
      ------------------------------------------------------------------
      El menú principal ocupa 8 ítems y se parte en dos líneas (fiel al
      original). La segunda línea cae fuera del header (y=155→310) y queda
      sobre la imagen del `.title_outer`, con contraste insuficiente.

      Este bloque SÓLO añade contraste. No toca layout, wrap ni alturas:
      el degradado es un pseudo-elemento `position:absolute` (fuera de flujo)
      y el text-shadow no ocupa caja. */

@media only screen and (min-width: 1001px) {

	/* velo oscuro que cubre el header y la franja de desbordamiento del menú */
	header.page_header::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 340px;
		z-index: -1;
		pointer-events: none;
		background: linear-gradient(
			to bottom,
			rgba(0, 0, 0, 0.55) 0%,
			rgba(0, 0, 0, 0.45) 45%,
			rgba(0, 0, 0, 0.22) 78%,
			rgba(0, 0, 0, 0) 100%
		);
	}

	/* refuerzo sobre el propio texto, para las imágenes de hero más claras */
	nav.main_menu > ul > li > a,
	nav.main_menu > ul > li > a span {
		text-shadow: 0 1px 3px rgba(0, 0, 0, 0.65);
	}
}