/* ───────────── El traslado privado: pedir cotización por WhatsApp ─────────────
 *
 * Un encabezado (título, lema, promesa de respuesta y «Cómo funciona» en modal)
 * y una ficha arena con dos pasos numerados con círculos del sistema. Los
 * campos son los del buscador —misma altura, mismo borde—, en una columna
 * hasta 30 rem y en dos desde ahí. El encabezado es siempre UNA columna de
 * texto: sólo en pantallas anchas (64 rem) se queda a la izquierda, pegajoso,
 * y el formulario ocupa el resto; nunca hay tres columnas.
 *
 * El envío lo gobierna WaCta (ver iniciarCotiza en frontend.js); su mensaje de
 * error se pinta con su propia hoja.
 */
.ihb-privado { display: grid; gap: 1rem; margin: 0 0 2rem; }

.ihb-privado__cabecera {
	display: grid;
	justify-items: start;
	gap: 0.4rem;
	max-width: 60ch;
	margin-block-start: 16px;
}

.ihb-privado__h1 { margin: 0; font-size: clamp(1.5rem, 6vw, 2rem); line-height: 1.15; }
.ihb-privado__lema { margin: 0; font-size: 0.95rem; color: var(--ihb-tinta-suave); }
.ihb-privado__promesa { margin: 0; font-size: 0.875rem; line-height: 1.4; color: var(--ihb-tinta-suave); }
.ihb-privado__pasos { margin: 0 0 0.75rem; padding-left: 1.25rem; display: grid; gap: 0.35rem; }

.ihb-cotiza { display: grid; gap: 1.1rem; padding: 1rem; min-width: 0; }
.ihb-cotiza__grupo { margin: 0; padding: 0; border: 0; min-width: 0; }

.ihb-cotiza__paso {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 0.6rem;
	padding: 0;
	font-size: 1rem;
	font-weight: 800;
	color: var(--ihb-marino);
}

.ihb-cotiza__paso .ihb-circulo { font-size: 0.75rem; font-weight: 800; }
.ihb-cotiza__rejilla { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.6rem; }

.ihb-campo { display: block; min-width: 0; }
.ihb-campo--ancho { grid-column: 1 / -1; }
.ihb-campo[hidden] { display: none; }
.ihb-campo__nombre { display: block; margin-bottom: 0.2rem; font-size: 0.8125rem; font-weight: 600; color: var(--ihb-tinta); }
.ihb-campo__nombre small { font-size: 0.75rem; font-weight: 400; color: var(--ihb-tinta-suave); }
.ihb-campo__ayuda { display: block; margin-top: 0.25rem; font-size: 0.75rem; line-height: 1.4; color: var(--ihb-tinta-suave); }
.ihb-campo__error { display: block; margin-top: 0.25rem; font-size: 0.8125rem; line-height: 1.4; color: var(--ihb-alerta); }
.ihb-campo__error[hidden] { display: none; }
.ihb-cotiza input,
.ihb-cotiza select,
.ihb-cotiza textarea { box-sizing: border-box; width: 100%; min-width: 0; max-width: 100%; }
.ihb-cotiza [aria-invalid="true"] { border-color: var(--ihb-alerta); }
.ihb-cotiza textarea { resize: vertical; min-height: 4.25rem; line-height: 1.4; }

.ihb-cotiza__pie { display: grid; gap: 0.5rem; justify-items: start; }
.ihb-cotiza__enviar { gap: 0.5rem; }
.ihb-cotiza__enviar svg { width: 1.25rem; height: 1.25rem; flex: none; }
.ihb-cotiza__nota { margin: 0; font-size: 0.875rem; color: var(--ihb-tinta-suave); }

.ihb-cotiza__aviso:empty { display: none; }
.ihb-cotiza__aviso { font-size: 0.9375rem; }
.ihb-cotiza__aviso.is-error { color: var(--ihb-alerta); font-weight: 600; }

.ihb-cotiza__listo {
	display: grid;
	gap: 0.6rem;
	justify-items: start;
	padding: 0.8rem 1rem;
	border-left: 4px solid var(--ihb-ok);
	border-radius: var(--ihb-radio-ficha-chica);
	background: var(--ihb-papel);
}

.ihb-cotiza__listo p { margin: 0; }
.ihb-cotiza__resultado { display: grid; gap: 0.6rem; justify-items: start; padding: 0.8rem 1rem; }
.ihb-cotiza__resultado p { margin: 0; }
.ihb-cotiza__resultado.is-error { --ihb-acento: var(--ihb-alerta); }
.ihb-cotiza .wacta-form-error { margin: 0; }

/* La trampa de miel, fuera de la vista también cuando WaCta no está. */
.ihb-miel { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }


@media (min-width: 48rem) {
	.ihb-privado__cabecera { margin-block-start: 24px; }
}

@media (min-width: 64rem) {
	.ihb-privado { grid-template-columns: minmax(16rem, 20rem) minmax(0, 1fr); gap: 2rem; align-items: start; }
	.ihb-privado__cabecera { position: sticky; top: 4rem; align-content: start; }
	.ihb-privado__lema { margin: 0.25rem 0 0; }
	.ihb-cotiza { padding: 1.25rem; margin-top: max(1.5rem, 24px); }
}

@media (max-width: 30rem) {
	.ihb-cotiza__rejilla { grid-template-columns: 1fr; }
	.ihb-privado { gap: 0.75rem; margin-bottom: 1.25rem; }
	.ihb-cotiza { gap: 0.9rem; }
}
