/* /ia/ — sobre brand.css + producto.css */

/* Casos: texto + chat animado, alternando de lado */
.ia-case { padding: 96px 0; border-top: 1px solid var(--line); }
.ia-case__inner { display: grid; grid-template-columns: 1fr 1.05fr; gap: 56px; align-items: center; }
.ia-case--rev .ia-case__inner > :first-child { order: 2; }
.ia-case h2 { font-size: clamp(28px, 3.2vw, 38px); margin: 10px 0 12px; }
.ia-case p { color: var(--muted); font-size: 17px; line-height: 1.6; max-width: 520px; }
@media (max-width: 1023px) {
  .ia-case { padding: 64px 0; }
  .ia-case__inner { grid-template-columns: 1fr; gap: 28px; }
  .ia-case--rev .ia-case__inner > :first-child { order: 0; }
}

/* Chat "Tu IA · usando Balances" */
.chat { position: relative; background: var(--blue-soft); padding: 20px; border: 0; box-shadow: none; font-size: 14px; }
.chat__msgs { background: var(--white); border-radius: 18px 18px 0 0; padding: 16px 16px 8px; display: flex; flex-direction: column; gap: 10px; min-height: var(--chat-alto, 380px); transition: opacity .5s; }
.chat__msgs.fade { opacity: 0; }
/* El adjunto flota sobre el fondo vacío del chat: si sumara alto, la página saltaría. */
.chat__composer { background: var(--white); border-radius: 0 0 18px 18px; padding: 8px 16px 16px; position: relative; }
.chat__adjunto { position: absolute; left: 16px; bottom: 100%; display: flex; }
.chat__linea { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 18px; padding: 8px 8px 8px 14px; }
/* Una sola línea que se corre como un input real (si saltara a dos renglones, el chat crecería). */
.chat__texto { flex: 1; font-size: 14px; min-height: 1.4em; color: var(--ink); min-width: 0; white-space: nowrap; overflow: hidden; }
.chat__texto:empty::before { content: 'Preguntá lo que quieras'; color: #9AA5BC; }
.chat__texto.escribiendo::after { content: ''; display: inline-block; width: 1px; height: 1em; background: var(--ink); margin-left: 1px; vertical-align: -2px; animation: ia-cursor 1s steps(1) infinite; }
.chat__enviar { width: 30px; height: 30px; border-radius: 50%; background: #D5DCE8; color: var(--white); display: inline-grid; place-items: center; font-size: 15px; flex: none; transition: background .2s, transform .15s; }
.chat__enviar.listo { background: var(--blue); }
.chat__enviar.press, .chat .btn-chat.press { transform: scale(.9); }

.chat .file { align-self: flex-end; display: inline-flex; gap: 8px; align-items: center; border: 1px solid var(--line); border-radius: 12px; padding: 7px 11px; font-size: 13px; background: var(--white); }
.chat__adjunto .file { align-self: auto; }
.chat .file small { display: block; color: var(--muted); font-size: 11px; }
.chat .xls { background: #1D7A45; color: var(--white); font-size: 10px; font-weight: 600; border-radius: 6px; padding: 5px 6px; }
.chat .me { align-self: flex-end; background: #F1F3F7; border-radius: 16px; padding: 9px 13px; max-width: 85%; }
.chat .who { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.chat .who b { color: var(--blue); font-weight: 500; }
.chat .dot { width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(135deg, #7AA7FF, var(--blue)); flex: none; }
.chat .pensando span { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--muted); margin-left: 3px; animation: ia-pensar 1s infinite; }
.chat .pensando span:nth-child(2) { animation-delay: .15s; }
.chat .pensando span:nth-child(3) { animation-delay: .3s; }
.chat .resumen { font-size: 13px; }
.chat .row { display: flex; align-items: center; gap: 8px; padding: 5px 0; border-bottom: 1px solid #F0F2F6; font-size: 13px; min-width: 0; }
.chat .row__txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat .row__val { font-family: var(--ff-mono); font-size: 12px; white-space: nowrap; }
.chat .rubro { font-size: 11px; color: var(--blue); background: #EAF1FF; border-radius: 6px; padding: 2px 7px; white-space: nowrap; }
.chat .rubro.rev { color: #9A5B00; background: #FFF3DF; }
.chat .btn-chat { align-self: flex-start; display: inline-block; background: var(--blue); color: var(--white); border-radius: 999px; padding: 8px 16px; font-size: 13px; font-weight: 500; transition: transform .15s; }
.chat .ok { display: flex; gap: 9px; align-items: center; background: #F5F8FF; border-radius: 12px; padding: 11px 12px; font-weight: 600; }
.chat .check { width: 24px; height: 24px; border-radius: 50%; background: var(--blue); color: var(--white); display: inline-grid; place-items: center; font-size: 13px; flex: none; }
.chat .in { animation: ia-in .35s ease-out both; }
@keyframes ia-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes ia-pensar { 0%, 80%, 100% { opacity: .25; } 40% { opacity: 1; } }
@keyframes ia-cursor { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .chat * { animation: none !important; transition: none !important; } }
@media (max-width: 480px) {
  .chat { padding: 10px; font-size: 13px; }
  .chat__msgs { padding: 12px 12px 6px; }
  .chat__composer { padding: 6px 12px 12px; }
  .chat .row { gap: 6px; font-size: 12px; }
  .chat .row__val { font-size: 11px; }
  .chat .rubro { font-size: 10px; padding: 2px 5px; }
}

/* Conector para copiar */
.ia-conector { display: flex; gap: 8px; align-items: center; margin-top: 12px; font-family: var(--ff-mono); font-size: 13px; background: var(--blue-soft); border-radius: 10px; padding: 8px 10px; }
.ia-conector code { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.ia-conector button { font: inherit; font-family: var(--ff-body); font-size: 12px; border: 1px solid var(--line); background: var(--white); border-radius: 999px; padding: 4px 10px; cursor: pointer; flex: none; }
.p-steps--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1023px) { .p-steps--3 { grid-template-columns: 1fr; } }