/* Página temporal de app.colcadoc.pe mientras se publica nsi-web. Solo tokens del kit. */
body.espera { margin: 0; min-height: 100svh; display: grid; place-items: center; background: var(--bg); font-family: var(--font); color: var(--ink); padding: var(--s-4); box-sizing: border-box; }
.mosaico-espera { width: min(960px, 100%); display: grid; grid-template-columns: 2fr 1fr; grid-auto-rows: minmax(150px, auto); gap: var(--s-3); }
.pz { border-radius: var(--r-l); padding: var(--s-6); display: flex; flex-direction: column; justify-content: space-between; gap: var(--s-4); text-decoration: none; min-width: 0; }
.pz.grande { grid-row: span 2; min-height: 340px; }
.pz b { font-size: var(--fs-2xl); font-weight: 800; letter-spacing: -.01em; overflow-wrap: anywhere; }
.pz h1 { font-size: clamp(2rem, 4.5vw, 3.2rem); line-height: 1.05; letter-spacing: -.02em; font-weight: 800; margin: 0 0 var(--s-3); }
.pz p { margin: 0; font-size: var(--fs-lg); max-width: 34ch; }
.marca { font-size: var(--fs-xl); font-weight: 800; }
.rotulo { font-size: var(--fs-xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; opacity: .8; }
.c-marca { background: var(--lime); color: var(--lime-ink); }
.c-acento { background: var(--accent); color: var(--accent-ink); transition: background 160ms; }
.c-acento:hover { background: var(--accent-hover); }
.c-tinta { background: var(--side-bg); color: var(--side-active-ink); }
.pz:focus-visible { outline: none; box-shadow: var(--focus); }
@media (max-width: 640px) {
  .mosaico-espera { grid-template-columns: 1fr; }
  .pz.grande { grid-row: auto; min-height: 280px; }
}