/* Lo único propio de la página suelta del test: su cabecera y su caja.
 *
 * Las clases llevan el prefijo «pagina-» a propósito: estilos.css ya usa
 * .cabecera y .marca para la cabecera azul del sitio, y aquí harían que
 * esta página se pintara con una barra que no le toca.
 * Las piezas del test están en ../recursos/test-auditivo.css y la base
 * en ../recursos/estilos.css, compartidas con el sitio.
 */

body { background: var(--gris-claro); }

.pagina-envoltorio {
  max-width: 44rem;
  margin: 0 auto;
  padding: 1.5rem 1rem 4rem;
}

/* El pie: la salida para quien no quiera contestar el test */
.pagina-pie {
  margin-top: 2.5rem;
  text-align: center;
  font-size: .9375rem;
  line-height: 1.7;
  color: var(--texto-suave);
}
.pagina-pie p { margin: 0 0 .5rem; }
.pagina-pie a { color: var(--azul); }

/* Los tres enlaces en fila, y ninguno se parte a la mitad */
.pagina-pie__enlaces {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .5rem 1.25rem;
}
.pagina-pie__enlaces a { white-space: nowrap; }

/* La caja blanca, igual que la del test incrustado en la portada */
main.ta {
  background: #fff;
  border-radius: var(--r-grande);
  padding: clamp(1.5rem, 1rem + 2.4vw, 2.5rem);
  box-shadow: var(--sombra);
}

.ta h1 {
  font-size: clamp(1.75rem, 1.4rem + 1.6vw, 2.5rem);
  margin-bottom: 1rem;
}