:root {
  color-scheme: light;
  --azul: #1757C2;
  --azul-oscuro: #0F3F8F;
  --azul-claro: #EBF2FD;
  --marino: #0B2A55;
  --verde: #0E7A50;
  --verde-claro: #E8F5EE;
  --texto: #0F172A;
  --suave: #475569;
  --fondo: #F4F6F9;
  --blanco: #FFFFFF;
  --linea: #E2E8F0;
  --linea-fuerte: #CBD5E1;
  --rojo: #B42318;
  --rojo-claro: #FEF3F2;
  --ambar: #8A4B00;
  --ambar-claro: #FFF6E5;

  --e1: 4px;
  --e2: 8px;
  --e3: 12px;
  --e4: 16px;
  --e5: 24px;
  --e6: 32px;
  --e7: 48px;

  --t-micro: 14px;
  --t-chico: 16px;
  --t-base: 18px;
  --t-medio: 22px;
  --t-titulo: 28px;
  --t-monto: 40px;

  --ancho: 600px;
  --ancho-amplio: 1040px;
  --radio: 20px;
  --radio-chico: 12px;
  --sombra: 0 1px 2px rgba(15, 23, 42, .05);
  --sombra-media: 0 4px 16px rgba(15, 23, 42, .06);
  --foco: 0 0 0 3px rgba(23, 87, 194, .3);
  --toque: 48px;
  --fuente: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; min-height: 100vh; display: flex; flex-direction: column; background: var(--fondo); color: var(--texto);
  font: 400 var(--t-base)/1.55 var(--fuente);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: var(--azul); text-underline-offset: 3px; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: none; box-shadow: var(--foco); border-radius: var(--radio-chico); }
b, strong { font-weight: 600; }
.i { width: 1.3em; height: 1.3em; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.monto, .fila span:last-child, .dato-valor, .copiar .numero, input.grande, input.clave, .num { font-variant-numeric: tabular-nums; }

.contenedor { width: 100%; max-width: var(--ancho); margin: 0 auto; padding-left: var(--e4); padding-right: var(--e4); }
.amplio .contenedor, .contenedor.amplio { max-width: var(--ancho-amplio); }

.cabecera { position: sticky; top: 0; z-index: 10; background: var(--blanco); border-bottom: 1px solid var(--linea); }
.cabecera .contenedor { display: flex; align-items: center; gap: var(--e3); min-height: 64px; }
.cabecera .marca { display: inline-flex; align-items: center; gap: var(--e2); min-height: var(--toque); text-decoration: none; color: var(--texto); font-weight: 700; font-size: var(--t-base); }
.cabecera .marca img { width: auto; height: 30px; display: block; }
.cabecera .acciones { margin-left: auto; display: flex; align-items: center; gap: var(--e1); }
.icono-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--e2);
  min-width: var(--toque); min-height: var(--toque); padding: 0 var(--e3); border-radius: var(--radio-chico); border: 0; background: transparent;
  color: var(--texto); font: inherit; font-size: var(--t-chico); text-decoration: none; cursor: pointer;
}
.icono-btn:active { background: var(--fondo); }
.contador { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; padding: 0 var(--e2);
  border-radius: 12px; background: var(--azul); color: #fff; font-size: var(--t-micro); font-weight: 700; line-height: 1; }

main { flex: 1 0 auto; padding-top: var(--e5); padding-bottom: var(--e6); }
h1 { font-size: var(--t-titulo); line-height: 1.2; font-weight: 700; letter-spacing: -.02em; margin: var(--e2) 0 var(--e3); }
h2 { font-size: var(--t-medio); line-height: 1.3; font-weight: 700; letter-spacing: -.01em; margin: 0 0 var(--e3); }
p { margin: 0 0 var(--e4); }
.suave { color: var(--suave); }
.centro { text-align: center; }
.chico { font-size: var(--t-chico); }
.bajada { color: var(--suave); margin-bottom: var(--e5); }
.sobretitulo { margin: 0 0 var(--e2); font-size: var(--t-micro); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--suave); }

.mt-0 { margin-top: 0; }
.mt-2 { margin-top: var(--e2); }
.mt-3 { margin-top: var(--e3); }
.mt-4 { margin-top: var(--e4); }
.mt-5 { margin-top: var(--e5); }
.mt-6 { margin-top: var(--e6); }
.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: var(--e1); }
.mb-4 { margin-bottom: var(--e4); }
.entre { display: flex; justify-content: space-between; align-items: center; gap: var(--e3); }
.seccion { margin-top: var(--e7); }
.codigo-verificacion { font-size: var(--t-medio); letter-spacing: .1em; font-variant-numeric: tabular-nums; }

.tarjeta { background: var(--blanco); border: 1px solid var(--linea); border-radius: var(--radio); box-shadow: var(--sombra); padding: var(--e5) var(--e4); margin-bottom: var(--e4); }
.tarjeta > :last-child { margin-bottom: 0; }

.tarjeta.resalte { background: var(--marino); border-color: var(--marino); color: #fff; }
.resalte h1, .resalte h2, .resalte b { color: #fff; }
.resalte .suave, .resalte .sobretitulo, .resalte .bajada { color: rgba(255, 255, 255, .78); }
.resalte a:not(.btn) { color: #fff; }
.resalte .fila { border-color: rgba(255, 255, 255, .16); }
.resalte .fila span:first-child { color: rgba(255, 255, 255, .78); }
.resalte .btn-principal { background: var(--blanco); color: var(--marino); }
.resalte .btn-principal:active { background: var(--azul-claro); }
.resalte .btn-secundario { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); }
.resalte .mensaje.info { background: rgba(255, 255, 255, .12); color: #fff; }

.btn {
  display: flex; align-items: center; justify-content: center; gap: var(--e2); width: 100%; min-height: 56px;
  padding: var(--e3) var(--e4); border-radius: var(--radio-chico); border: 1.5px solid transparent; font: inherit; font-size: var(--t-base); font-weight: 600;
  text-decoration: none; cursor: pointer; text-align: center; transition: transform 120ms ease-out, background-color 150ms ease-out;
}
.btn:active { transform: scale(.98); }
.btn-principal { background: var(--azul); color: #fff; }
.btn-principal:active { background: var(--azul-oscuro); }
.btn-secundario { background: var(--blanco); color: var(--azul-oscuro); border-color: var(--linea-fuerte); }
.btn-secundario:active { background: var(--fondo); }
.btn-whatsapp { background: #128C4B; color: #fff; }
.btn-texto { background: none; color: var(--azul); min-height: var(--toque); font-weight: 600; text-decoration: underline; }
.btn[disabled], .btn.cargando { opacity: .7; pointer-events: none; }
.botones { display: grid; gap: var(--e3); margin-top: var(--e5); }
@media (hover: hover) {
  .btn-principal:hover { background: var(--azul-oscuro); }
  .btn-secundario:hover { background: var(--fondo); }
  .resalte .btn-principal:hover { background: var(--azul-claro); }
  .accion-grande:hover { border-color: var(--linea-fuerte); }
}

.enlace { display: inline-flex; align-items: center; gap: var(--e1); min-height: 44px; color: var(--azul); font-weight: 600; text-decoration: underline; }
.atras { display: inline-flex; align-items: center; gap: var(--e2); min-height: var(--toque); color: var(--azul); font-weight: 600; text-decoration: none; }
.derecha { display: flex; justify-content: flex-end; }

label, .etiqueta { display: block; font-weight: 600; margin: var(--e5) 0 var(--e2); font-size: var(--t-base); }
.tarjeta > label:first-child, .tarjeta > .etiqueta:first-child, .tarjeta > div:first-child > .etiqueta:first-child,
.tarjeta > input[type=hidden] + label, .tarjeta > input[type=hidden] + .etiqueta, .tarjeta > input[type=hidden] + div > .etiqueta:first-child { margin-top: 0; }
.ayuda { display: block; color: var(--suave); font-size: var(--t-chico); margin: calc(-1 * var(--e1)) 0 var(--e2); font-weight: 400; }
input[type=text], input[type=tel], input[type=email], input[type=password], input[type=number], textarea, select {
  width: 100%; min-height: 56px; padding: var(--e3) var(--e4); border: 1.5px solid var(--linea-fuerte); border-radius: var(--radio-chico);
  background: var(--blanco); color: var(--texto); font: inherit; font-size: var(--t-medio);
}
textarea { min-height: 112px; font-size: var(--t-base); line-height: 1.45; }
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--azul); box-shadow: var(--foco); }
input::placeholder { color: #94A3B8; }
input.clave { letter-spacing: .4em; text-align: center; font-size: var(--t-titulo); font-weight: 700; }
input.grande { font-size: var(--t-titulo); font-weight: 600; letter-spacing: .06em; }
.campo-error input, .campo-error textarea, .campo-error .campo-clave { border-color: var(--rojo); }
.error { display: flex; gap: var(--e2); align-items: flex-start; color: var(--rojo); font-weight: 600; font-size: var(--t-chico); margin-top: var(--e2); }

.campo-clave { display: flex; align-items: center; border: 1.5px solid var(--linea-fuerte); border-radius: var(--radio-chico); background: var(--blanco); }
.campo-clave:focus-within { border-color: var(--azul); box-shadow: var(--foco); }
.campo-clave input { border: 0; flex: 1 1 auto; min-width: 0; box-shadow: none; background: transparent; padding-right: 0; }
.campo-clave input:focus { box-shadow: none; }
.campo-clave button { flex: none; min-height: var(--toque); min-width: 88px; margin-right: var(--e1); padding: 0 var(--e3); border: 0; border-radius: 10px;
  background: transparent; color: var(--azul); font: inherit; font-size: var(--t-chico); font-weight: 600; cursor: pointer; }
.campo-clave button:active { background: var(--fondo); }

.segmento { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e1); padding: var(--e1); border-radius: 14px; background: var(--fondo); border: 1px solid var(--linea); }
.segmento label { position: relative; margin: 0; font-weight: 600; font-size: var(--t-chico); }
.segmento input { position: absolute; opacity: 0; inset: 0; }
.segmento span { display: flex; align-items: center; justify-content: center; min-height: var(--toque); padding: var(--e1) var(--e2); border-radius: 10px;
  color: var(--suave); text-align: center; line-height: 1.25; cursor: pointer; }
.segmento input:checked + span { background: var(--blanco); color: var(--azul-oscuro); box-shadow: 0 1px 3px rgba(15, 23, 42, .12); }
.segmento input:focus-visible + span { box-shadow: var(--foco); }

.opciones { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e3); }
.opciones.tres .opcion:last-child { grid-column: 1 / -1; }
.opcion { position: relative; margin: 0; font-weight: 600; }
.opcion input { position: absolute; opacity: 0; inset: 0; }
.opcion span {
  display: flex; align-items: center; justify-content: center; min-height: 64px; padding: var(--e2) var(--e3);
  border: 1.5px solid var(--linea-fuerte); border-radius: var(--radio-chico); background: var(--blanco); text-align: center; line-height: 1.3; cursor: pointer;
}
.opcion input:checked + span { border-color: var(--azul); background: var(--azul-claro); color: var(--azul-oscuro); box-shadow: 0 0 0 1.5px var(--azul) inset; }
.opcion input:focus-visible + span { box-shadow: var(--foco); }

.casilla { display: flex; gap: var(--e3); align-items: flex-start; padding: var(--e4); border: 1.5px solid var(--linea); border-radius: var(--radio-chico); background: var(--blanco); font-weight: 400; margin: var(--e5) 0 0; cursor: pointer; }
.casilla input { width: 28px; height: 28px; flex: none; margin: 0; accent-color: var(--azul); }

.separador { display: flex; align-items: center; gap: var(--e3); margin: var(--e5) 0; color: var(--suave); font-size: var(--t-chico); }
.separador::before, .separador::after { content: ""; flex: 1; height: 1px; background: var(--linea-fuerte); }

.progreso { margin: var(--e1) 0 var(--e5); }
.progreso .texto { display: flex; justify-content: space-between; gap: var(--e3); font-size: var(--t-micro); color: var(--suave); font-weight: 600; margin-bottom: var(--e2); }
.progreso .barra { height: 6px; border-radius: 3px; background: var(--linea); overflow: hidden; }
.progreso .barra span { display: block; height: 100%; background: var(--azul); border-radius: 3px; }

.mensaje { display: flex; gap: var(--e3); align-items: flex-start; padding: var(--e3) var(--e4); border-radius: var(--radio-chico); margin-bottom: var(--e4); font-weight: 500; }
.mensaje .i { margin-top: 2px; }
.mensaje.ok { background: var(--verde-claro); color: var(--verde); }
.mensaje.error-caja { background: var(--rojo-claro); color: var(--rojo); }
.mensaje.aviso { background: var(--ambar-claro); color: var(--ambar); }
.mensaje.info { background: var(--azul-claro); color: var(--azul-oscuro); }
a.mensaje { text-decoration: none; }

.nota { display: flex; gap: var(--e3); align-items: flex-start; margin: var(--e5) 0 0; padding: var(--e3) var(--e4); border-radius: var(--radio-chico);
  background: var(--fondo); color: var(--suave); font-size: var(--t-chico); line-height: 1.45; }
.nota .i { color: var(--azul); margin-top: 2px; width: 20px; height: 20px; }
.nota p { margin: 0; }

.monto { font-size: var(--t-monto); font-weight: 700; line-height: 1.1; letter-spacing: -.02em; overflow-wrap: anywhere; }
.fila { display: flex; justify-content: space-between; align-items: baseline; gap: var(--e3); padding: var(--e3) 0; border-bottom: 1px solid var(--linea); }
.fila:last-child { border-bottom: 0; }
.fila span:first-child { color: var(--suave); flex: none; }
.fila span:last-child { font-weight: 600; text-align: right; min-width: 0; overflow-wrap: anywhere; }

.dato { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--e3); padding: var(--e3) 0; border-bottom: 1px solid var(--linea); }
.dato:last-child { border-bottom: 0; }
.dato > div { min-width: 0; }
.dato-etiqueta { display: block; font-size: var(--t-micro); font-weight: 600; letter-spacing: .02em; color: var(--suave); }
.dato-valor { display: block; font-weight: 600; overflow-wrap: anywhere; }
.dato-detalle { display: block; font-size: var(--t-chico); color: var(--suave); overflow-wrap: anywhere; }
.dato .enlace { flex: none; margin-top: calc(-1 * var(--e2)); }

.etiqueta-estado { display: inline-flex; align-items: center; gap: var(--e1); padding: var(--e1) var(--e3); border-radius: 999px; font-size: var(--t-micro); font-weight: 600; white-space: nowrap; }
.e-pendiente, .e-en_revision { background: var(--azul-claro); color: var(--azul-oscuro); }
.e-observado, .e-mora { background: var(--ambar-claro); color: var(--ambar); }
.e-aprobado, .e-pagado, .e-confirmado, .e-activo { background: var(--verde-claro); color: var(--verde); }
.e-rechazado { background: var(--rojo-claro); color: var(--rojo); }

.copiar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e3); padding: var(--e3) var(--e4); border: 1px solid var(--linea); border-radius: var(--radio-chico); background: var(--fondo); }
.copiar .numero { flex: 1 1 auto; min-width: 0; font-size: var(--t-medio); font-weight: 700; letter-spacing: .04em; }
.copiar .btn { width: auto; flex: none; min-height: var(--toque); font-size: var(--t-chico); padding: var(--e2) var(--e4); }

.pasos { list-style: none; padding: 0; margin: 0; }
.pasos li { position: relative; display: flex; gap: var(--e3); padding: 0 0 var(--e5) 0; }
.pasos li::before { content: ""; position: absolute; left: 15px; top: 36px; bottom: var(--e1); width: 2px; background: var(--linea); }
.pasos li:last-child { padding-bottom: 0; }
.pasos li:last-child::before { display: none; }
.pasos .punto { width: 32px; height: 32px; border-radius: 50%; flex: none; display: flex; align-items: center; justify-content: center;
  background: var(--linea); color: var(--suave); font-weight: 700; font-size: var(--t-chico); font-variant-numeric: tabular-nums; }
.pasos li.hecho .punto { background: var(--verde); color: #fff; }
.pasos li.actual .punto { background: var(--azul); color: #fff; }
.pasos b { display: block; }
.pasos + .copiar, .copiar + .nota, .nota + .pasos { margin-top: var(--e4); }

.linea-pasos { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; counter-reset: paso; }
.linea-pasos li { position: relative; display: grid; grid-template-columns: 44px 1fr; column-gap: var(--e4); padding-bottom: var(--e5); }
.linea-pasos li:last-child { padding-bottom: 0; }
.linea-pasos li::after { content: ""; position: absolute; left: 21px; top: 48px; bottom: var(--e1); width: 2px; background: var(--linea-fuerte); }
.linea-pasos li:last-child::after { display: none; }
.linea-pasos .num { grid-row: span 2; width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: var(--blanco); border: 2px solid var(--azul); color: var(--azul); font-weight: 700; font-size: var(--t-base); }
.linea-pasos li:last-child .num { background: var(--azul); color: #fff; }
.linea-pasos b { display: block; font-size: var(--t-base); line-height: 1.3; padding-top: var(--e2); }
.linea-pasos span:not(.num) { color: var(--suave); font-size: var(--t-chico); line-height: 1.45; }

.garantias { display: grid; gap: var(--e3); }
.garantia { display: grid; grid-template-columns: 44px 1fr; column-gap: var(--e3); align-items: start; padding: var(--e4); background: var(--blanco);
  border: 1px solid var(--linea); border-radius: var(--radio); }
.garantia .i { grid-row: span 2; width: 44px; height: 44px; padding: 11px; border-radius: var(--radio-chico); background: var(--verde-claro); color: var(--verde); }
.garantia b { display: block; line-height: 1.3; }
.garantia span { color: var(--suave); font-size: var(--t-chico); line-height: 1.45; }

.lista-requisitos { list-style: none; padding: 0; margin: 0 0 var(--e2); display: grid; gap: var(--e3); }
.lista-requisitos li { display: flex; gap: var(--e3); align-items: center; padding: var(--e3) var(--e4); background: var(--blanco); border: 1px solid var(--linea); border-radius: var(--radio-chico); }
.lista-requisitos .i { width: 36px; height: 36px; padding: var(--e2); border-radius: 10px; background: var(--azul-claro); color: var(--azul); }

.camara { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--e3);
  min-height: 256px; padding: var(--e5) var(--e4); border: 1.5px solid var(--linea-fuerte); border-radius: var(--radio); background: var(--blanco);
  color: var(--azul-oscuro); font-weight: 600; font-size: var(--t-base); text-align: center; cursor: pointer; overflow: hidden; margin: 0; }
.camara input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.camara .i { width: 48px; height: 48px; color: var(--azul); }
.guia-documento { width: 78%; aspect-ratio: 1.58; border: 2px solid var(--azul); border-radius: var(--radio-chico); opacity: .5; display: flex; align-items: center; justify-content: center; }
.guia-cara { width: 46%; aspect-ratio: .78; border: 2px solid var(--azul); border-radius: 50%; opacity: .5; }
.vista-previa { border-radius: var(--radio); overflow: hidden; background: #0B1220; }
.vista-previa img { width: 100%; max-height: 420px; object-fit: contain; margin: 0 auto; }
.consejos { list-style: none; padding: 0; margin: var(--e4) 0 0; display: grid; gap: var(--e2); font-size: var(--t-chico); }
.consejos li { display: flex; gap: var(--e2); align-items: center; }
.consejos .i { color: var(--verde); }

.fotos { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e3); }
.foto-miniatura { display: block; color: inherit; text-decoration: none; }
.foto-miniatura img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--radio-chico); background: var(--linea); }
.foto-miniatura .dato-etiqueta { margin-top: var(--e2); }

.accion-grande { display: flex; align-items: center; gap: var(--e4); padding: var(--e4); border-radius: var(--radio); text-decoration: none; color: var(--texto);
  background: var(--blanco); border: 1px solid var(--linea); box-shadow: var(--sombra); margin-bottom: var(--e4); min-height: 80px; }
.accion-grande > span { min-width: 0; }
.accion-grande .i { width: 44px; height: 44px; padding: 10px; border-radius: var(--radio-chico); background: var(--azul-claro); color: var(--azul); }
.accion-grande b { display: block; font-size: var(--t-base); line-height: 1.3; }
.accion-grande small { display: block; color: var(--suave); font-size: var(--t-chico); line-height: 1.4; margin-top: var(--e1); }
.accion-grande .flecha { margin-left: auto; width: 24px; height: 24px; padding: 0; background: none; color: var(--suave); }
.accion-grande.atencion { border: 1.5px solid var(--ambar); }
.accion-grande.atencion .i:not(.flecha) { background: var(--ambar-claro); color: var(--ambar); }
.accion-grande.verificar { border: 1.5px solid var(--verde); }
.accion-grande.verificar .i:not(.flecha) { background: var(--verde-claro); color: var(--verde); }

.aviso-item { padding: var(--e4); border-radius: var(--radio-chico); background: var(--blanco); border: 1px solid var(--linea); margin-bottom: var(--e3); }
.aviso-item.nuevo { border-left: 4px solid var(--azul); }
.aviso-item p { margin: var(--e2) 0 0; }
.aviso-item time { display: block; color: var(--suave); font-size: var(--t-micro); margin-top: var(--e2); }

.alternar { padding: 0; }
.alternar > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: var(--e3); min-height: 56px;
  padding: var(--e3) var(--e4); cursor: pointer; font-weight: 600; color: var(--azul); }
.alternar > summary::-webkit-details-marker { display: none; }
.alternar > summary .i { transition: transform 150ms ease-out; }
.alternar[open] > summary .i { transform: rotate(90deg); }
.alternar > form { padding: 0 var(--e4) var(--e5); }

.portada-hero { padding: var(--e6) var(--e5); }
.portada-hero h1 { font-size: 32px; margin-top: 0; }
.portada-hero .bajada { font-size: var(--t-base); }

.aparecer { animation: aparecer 400ms ease-out both; }
.aparecer:nth-child(2) { animation-delay: 80ms; }
.aparecer:nth-child(3) { animation-delay: 160ms; }
.aparecer:nth-child(4) { animation-delay: 240ms; }
@keyframes aparecer { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.ayuda-bloque { padding-bottom: var(--e4); }
.ayuda-bloque .accion-grande { margin: 0; }
.ayuda-bloque .accion-grande .i:not(.flecha) { background: var(--verde-claro); color: var(--verde); }

.privacidad h2 { margin-top: var(--e5); }
.privacidad h2:first-child { margin-top: 0; }
.privacidad p, .privacidad li { max-width: 68ch; }
.privacidad ul { padding-left: var(--e5); margin: 0 0 var(--e4); }
.privacidad li { margin-bottom: var(--e2); }

.pie { text-align: center; color: var(--suave); font-size: var(--t-chico); padding: var(--e3) 0; }
.pie-pagina { border-top: 1px solid var(--linea); background: var(--blanco); color: var(--suave); font-size: var(--t-micro); line-height: 1.5; }
.pie-pagina .contenedor { display: grid; gap: var(--e1); justify-items: center; text-align: center; padding-top: var(--e5); padding-bottom: var(--e5); }
.pie-pagina p { margin: 0; }
.pie-pagina .enlace { font-size: var(--t-micro); }

.cambiado { display: inline-flex; align-items: center; margin-top: var(--e1); padding: 2px var(--e2); border-radius: 999px; font-size: var(--t-micro);
  font-weight: 600; background: var(--azul-claro); color: var(--azul-oscuro); }

.oculto { display: none !important; }
[x-cloak] { display: none !important; }

@media (min-width: 600px) {
  main { padding-top: var(--e6); }
  .tarjeta { padding: var(--e5); }
}
@media (min-width: 840px) {
  .portada-hero { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--e6); align-items: center; padding: var(--e7); }
  .portada-hero h1 { font-size: 40px; }
  .portada-hero .botones { margin-top: 0; }
  .linea-pasos { grid-template-columns: repeat(4, 1fr); gap: var(--e5); }
  .linea-pasos li { grid-template-columns: 1fr; padding-bottom: 0; }
  .linea-pasos li::after { left: 52px; right: calc(-1 * var(--e5) + 4px); top: 21px; bottom: auto; width: auto; height: 2px; }
  .linea-pasos .num { grid-row: auto; margin-bottom: var(--e3); }
  .linea-pasos b { padding-top: 0; }
  .garantias { grid-template-columns: repeat(3, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
  .aparecer { animation: none; }
}
button.camara { width: 100%; font-family: inherit; }
.camara-vivo { position: relative; border-radius: var(--radio); overflow: hidden; background: #0B1220; aspect-ratio: 3 / 4; max-height: 70vh; margin: 0 auto; display: flex; align-items: center; justify-content: center; }
.camara-vivo.horizontal { aspect-ratio: 4 / 3; }
.camara-vivo video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.camara-vivo video.espejo { transform: scaleX(-1); }
.camara-vivo .guia-documento, .camara-vivo .guia-cara { position: relative; border-color: #fff; opacity: .85; box-shadow: 0 0 0 999px rgba(11, 18, 32, .35); }
.enlace-copiar { margin: 0 0 var(--e3); }
.enlace-copiar label { display: block; font-weight: 600; margin-bottom: var(--e2); }
.enlace-copiar > div { display: grid; gap: var(--e2); }
.suave { font-weight: 400; }