/*
 * Pantalla de acceso.
 *
 * Mucho espacio negativo y una sola columna estrecha: es una pantalla de una
 * sola decisión. Todo lo que no sea entrar, estorba.
 */

.acceso {
  min-height: var(--vh);
  display: grid;
  place-items: center;
  padding: 32px 20px calc(32px + env(safe-area-inset-bottom));
}

.acceso__caja {
  width: 100%;
  max-width: 400px;
}

.acceso__marca {
  text-align: center;
  margin-bottom: 30px;
}
.acceso__marca .logo { margin-inline: auto; }
.acceso__marca .marca__txt { margin: 4px 0 0; }

.acceso__t {
  margin: 0 0 6px;
  font-size: clamp(1.5rem, 1.2rem + 1.4vw, 1.85rem);
  line-height: 1.25;
  text-align: center;
}

.acceso__sub {
  margin: 0 0 28px;
  text-align: center;
  color: var(--muted);
  font-size: .97rem;
}

.acceso__proveedores {
  display: grid;
  gap: 10px;
}

#aviso { margin-bottom: 18px; }

.acceso__pies {
  margin-top: 20px;
  display: flex;
  justify-content: center;
  gap: 22px;
  font-size: .92rem;
}
.acceso__pies a { color: var(--muted); text-decoration: none; }
.acceso__pies a:hover { color: var(--gold-bright); text-decoration: underline; }

/* La firma del pie necesita aire propio: pegada a «Crear cuenta» los dos filetes
   parecían el subrayado del enlace. */
.acceso .filete { margin-top: 26px; }

/* Estado "enviando": el botón se apaga y lo dice, para que nadie pulse dos
   veces pensando que no ha pasado nada. */
#enviar[aria-busy="true"] { opacity: .65; }

@media (max-width: 380px) {
  .acceso { padding-inline: 16px; }
  .acceso__marca .logo--hero { width: min(180px, 62vw); }
}