/* ==========================================================================
   Recuperar contraseña — composición.

   Casi todo lo pinta `/shared`: la tarjeta de acceso (`.login-card`), el lienzo
   (`.auth-canvas`), la marca (`.login-brand`), los campos, los avisos y los
   botones. Aquí abajo solo va lo que es de ESTA pantalla y de ninguna otra: el
   párrafo que explica el paso y la columna de puertas del final.

   Si algo de este archivo empieza a servirle a una segunda superficie, se sube
   a `shared/greenhouse.css`. Es la regla y no tiene excepciones.
   ========================================================================== */

/* El párrafo bajo el título. Es la única pantalla del sistema que se usa
   cuando alguien ya está teniendo un problema, así que explica antes de pedir:
   la tipografía es de lectura, no de formulario. */
.rec-intro {
  margin: 0 0 var(--s-6);
  color: var(--ink-soft);
  line-height: 1.6;
}

.rec-intro + .notice { margin-bottom: var(--s-5); }

/* Las cuatro puertas al terminar. En columna y no en fila: son cuatro y con
   cuatro en horizontal las etiquetas se parten en un teléfono, que es donde
   más se va a leer esto. */
.rec-puertas {
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
  margin-top: var(--s-2);
}