/*
 * GringoLock · «Descargá la app». Lo propio de esta página: las tiendas, el QR y el teléfono.
 * Todo lo demás sale de gl.css.
 */


/* ── Las tiendas: dos botones de borde a borde en el celular, en fila en la compu ────────────────────── */
.dsc-tiendas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.dsc-tienda { flex: 1 1 240px; min-height: 54px; }
.dsc-tienda svg { flex: none; }

/* ── El QR: sólo desde 720 px, como en la página vieja ───────────────────────────────────────────────── */
.dsc-qr { display: none; align-items: center; gap: 24px; margin-top: 32px; }
@media (min-width: 720px) { .dsc-qr { display: flex; } }
.dsc-qr__codigo {
  flex: none;
  width: 160px;
  height: 160px;
  padding: 10px;
  box-sizing: content-box;
  background: #f7f2e6;
  border-radius: 14px;
}
.dsc-qr__codigo svg { display: block; width: 100%; height: 100%; }
.dsc-qr p { margin: 0; color: var(--gl-texto-2); }

/* ── El teléfono: centrado, debajo del texto en el celular y al costado en la compu ──────────────────── */
.dsc-telefono { display: flex; justify-content: center; }
.dsc-telefono .gl-telefono { --w: min(260px, 72vw); }

/* ── Cómo entra el vecino: dos tarjetas ───────────────────────────────────────────────────────────────── */
.dsc-pasos { list-style: none; margin: 32px 0 0; padding: 0; display: grid; gap: var(--gl-hueco); }
@media (min-width: 720px) { .dsc-pasos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.dsc-pasos > li { display: grid; gap: 10px; align-content: start; }
.dsc-pasos > li .gl-rotulo { justify-self: start; }
.dsc-pasos p { margin: 0; }
.dsc-paso__n {
  font-family: var(--gl-letra-mono);
  font-size: var(--gl-t-chico);
  font-weight: 600;
  color: var(--gl-marca-oro);
}