/* Autorregistro del cliente — pensado para el celular */
.pagina-registro { background: var(--papel); }
.registro {
  width: min(100%, 520px);
  margin: 0 auto;
  padding: max(1.25rem, env(safe-area-inset-top)) 1rem calc(2.5rem + env(safe-area-inset-bottom));
}
.registro-cabeza img { width: 170px; height: auto; display: block; }
.registro-cabeza h1 { font-size: clamp(1.9rem, 8vw, 2.4rem); line-height: 1.05; color: var(--navy); margin-top: 1rem; }
.registro-cabeza p { color: var(--tinta-2); margin-top: .5rem; }

.hoja {
  margin-top: 1.25rem; background: var(--blanco); border: 1px solid var(--linea);
  border-radius: var(--r-grande); padding: 1.25rem; display: grid; gap: 1rem;
}
.campo { display: grid; gap: .3rem; }
.campo > span { font-weight: 600; }
.campo em { font-style: normal; font-weight: 400; color: var(--tinta-2); }
.campo small { color: var(--tinta-2); font-size: .85rem; }
.campo input {
  min-height: 48px; padding: .6rem .8rem; font: inherit; font-size: 1.05rem; color: var(--tinta);
  border: 1px solid var(--linea-fuerte); border-radius: var(--r-medio); background: var(--blanco); width: 100%;
}
.campo input:focus { border-color: var(--celeste); box-shadow: var(--foco); outline: none; }
.campo-check { display: flex; align-items: flex-start; gap: .6rem; cursor: pointer; font-size: .95rem; }
.campo-check input { width: 22px; height: 22px; margin-top: .1rem; accent-color: var(--navy); flex: none; }
.campo-check a, .registro-ya a, .registro-pie a { color: var(--navy); font-weight: 600; }
.form-error { background: var(--mal-suave); color: var(--mal); padding: .7rem .9rem; border-radius: var(--r-chico); font-weight: 500; }
.registro-nota { font-size: .9rem; color: var(--tinta-2); }
.registro-ya { margin-top: 1rem; background: var(--celeste-suave); border-radius: var(--r-medio); padding: .8rem 1rem; }

.registro-listo { text-align: center; justify-items: center; }
.registro-listo .btn-plano { justify-self: center; }
.listo-marca {
  width: 64px; height: 64px; border-radius: 50%; background: var(--bien-suave); color: var(--bien);
  display: grid; place-items: center; font-size: 2rem; font-weight: 700;
}
.registro-listo h2 { font-size: 1.9rem; color: var(--navy); }
.registro-pie { margin-top: 1.5rem; text-align: center; font-size: .9rem; }
