/* =====================================================================
   wa-contacto.css · La ventana «¿Con quién hablamos?» antes de abrir WhatsApp (D-94 · 1)
   Usa los tokens de comparendoia.css (claro y oscuro) y el botón czia-btn--amber.
   Encima de todo, también del asistente a pantalla completa. Lo pinta wa-contacto.js.
   ===================================================================== */
html.czwa-abierta{ overflow:hidden; }
.czwa[hidden]{ display:none !important; }
.czwa{ position:fixed; inset:0; z-index:2147483640; display:flex; align-items:center; justify-content:center; padding:16px; font-family:var(--czia-body, system-ui, sans-serif); }
.czwa__fondo{ position:absolute; inset:0; background:rgba(12,13,16,.58); }
.czwa__caja{ position:relative; width:100%; max-width:420px; max-height:calc(100vh - 32px); overflow:auto; margin:0; padding:24px 20px 18px;
  border-radius:var(--czia-radio, 18px); background:var(--czia-surface, #fff); color:var(--czia-fg, #15161A); box-shadow:var(--czia-sombra, 0 24px 60px rgba(14,15,18,.12)); }
.czwa__x{ position:absolute; top:8px; right:8px; width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; padding:0; border:0; border-radius:12px;
  background:transparent; color:var(--czia-fg, #15161A); font-size:28px; line-height:1; cursor:pointer; }
.czwa__x:hover{ background:var(--czia-surface-2, #F2EDE9); }
.czwa__t{ margin:0 44px 6px 0; font-family:var(--czia-display, inherit); font-size:1.3rem; line-height:1.25; font-weight:800; color:var(--czia-fg, #15161A); }
.czwa__p{ margin:0 0 16px; font-size:.95rem; line-height:1.45; color:var(--czia-muted, #5C5651); }
.czwa__fila{ display:grid; grid-template-columns:minmax(84px, 96px) 1fr; gap:10px; }
.czwa__campo{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.czwa__campo label{ margin:0; font-size:.85rem; font-weight:700; color:var(--czia-fg, #15161A); }
.czwa__campo select, .czwa__campo input{ width:100%; min-height:48px; margin:0; padding:10px 12px; border:1px solid var(--czia-line-2, rgba(40,22,12,.17)); border-radius:12px;
  background:var(--czia-surface, #fff); color:var(--czia-fg, #15161A); font-size:1rem; line-height:1.2; }
.czwa__campo input[aria-invalid="true"]{ border-color:var(--czia-fuerte, #15161A); }
.czwa__err{ margin:6px 0 0; font-size:13px; font-weight:600; line-height:1.35; color:var(--czia-amber-ink, #5E4800); }
.czwa__check{ display:flex; gap:10px; align-items:flex-start; margin:14px 0 0; font-size:.88rem; line-height:1.45; font-weight:400; color:var(--czia-fg, #15161A); cursor:pointer; }
.czwa__check input{ flex:0 0 auto; width:22px; height:22px; margin:1px 0 0; accent-color:var(--czia-amber-deep, #725800); }
.czwa__check input[aria-invalid="true"] + span{ color:var(--czia-amber-ink, #5E4800); }
.czwa__check a{ color:var(--czia-amber-deep, #725800); font-weight:700; text-decoration:underline; }
.czwa__ir{ margin:18px 0 0; min-height:52px; font-size:1rem; font-weight:800; border-radius:14px; }
.czwa__nota{ margin:10px 0 0; font-size:.8rem; line-height:1.4; color:var(--czia-muted, #5C5651); text-align:center; }
.czwa :focus-visible{ outline:3px solid var(--czia-amber-deep, #725800); outline-offset:2px; }
@media (max-width:480px){
  .czwa{ align-items:flex-end; padding:0; }
  .czwa__caja{ max-width:none; max-height:92vh; padding:22px 16px calc(18px + env(safe-area-inset-bottom)); border-radius:var(--czia-radio-l, 26px) var(--czia-radio-l, 26px) 0 0; }
}
@media (prefers-reduced-motion:no-preference){
  .czwa__caja{ animation:czwa-entra .18s ease-out; }
  @keyframes czwa-entra{ from{ transform:translateY(12px); opacity:0; } to{ transform:none; opacity:1; } }
}