/* UniforMed · Frase del pie */

/* La banda se imprime dentro de `main.wd-content-layout`, que tiene un espacio
   inferior propio. Anularlo solo en las páginas donde la banda existe la deja
   pegada al pie, y el margen superior la separa del contenido. */
.ufr-con-banda .wd-content-layout {
	padding-bottom: 0;
}

.ufr-banda {
	--ufr-navy: #2c2a63;

	margin-top: 50px;
	padding: 18px 20px;
	border-top: 1px solid #ececf1;
	border-bottom: 1px solid #ececf1;
	background: #fafafc;
	text-align: center;
}

/* Las frases se apilan en la misma celda del grid: la banda toma el alto de la
   más larga y al cambiar de frase no hay salto de layout. */
.ufr-inner {
	display: grid;
	max-width: 900px;
	margin: 0 auto;
}

.ufr-frase {
	grid-area: 1 / 1;
	margin: 0;
	color: #5c5c72;
	font-size: 15px;
	line-height: 1.5;
	opacity: 0;
	visibility: hidden;
	transition: opacity .45s ease, visibility 0s .45s;
}

/* Una sola clase decide qué frase se ve. El servidor ya se la pone a la primera,
   así que sin JavaScript sigue viéndose una; el JS solo la mueve a otra al azar.
   Sin reglas rivales de por medio, no hay dudas de cascada. */
.ufr-frase.is-visible {
	opacity: 1;
	visibility: visible;
	transition: opacity .45s ease;
}

@media (prefers-reduced-motion: reduce) {
	.ufr-frase { transition: none; }
}

@media (max-width: 600px) {
	.ufr-banda { padding: 14px 16px; }
	.ufr-frase { font-size: 14px; }
}