/* G2b · home. Ocho bloques; escenas con estado final legible sin JS. */

/* Presencia por paso (la escena declara data-paso; sin JS queda el estado final del HTML) */
.escena[data-paso="1"] .solo-p2:not(.solo-p1), .escena[data-paso="1"] .solo-p3:not(.solo-p1),
.escena[data-paso="2"] .solo-p1:not(.solo-p2), .escena[data-paso="2"] .solo-p3:not(.solo-p2),
.escena[data-paso="3"] .solo-p1:not(.solo-p3), .escena[data-paso="3"] .solo-p2:not(.solo-p3) { display: none !important; }

.bloque { padding: var(--bloque) 0; position: relative; }
/* Grids de una columna: la pista nunca crece más que su contenedor */
.hero__texto, .bloque__texto, .crm__texto, .equipo__texto, .confianza__texto, .cierre__texto, .ventana-crm__contenido, .propuesta, .cambio,
.panel-nora__resultado, .panel-nora__espera, .panel-nora__cuerpo, .siguiente-paso, .correo__lectura, .borrador, .reunion__registro, .reunion__docs,
.doc, .doc__lista, .compromisos, .compromiso, .escena--equipo, .ventana-equipo .app__cuerpo, .credenciales, .controles, .entregas { grid-template-columns: minmax(0, 1fr); }

.bloque__texto { display: grid; gap: 1.25rem; align-content: start; }
.titulo-bloque { max-width: 15em; }

/* Indicadores comunes */
.girador { width: 13px; height: 13px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; display: inline-block; animation: girar .9s linear infinite; flex-shrink: 0; }
.girador--claro { color: var(--blanco); }
@keyframes girar { to { transform: rotate(360deg); } }
.punto-vivo { width: 8px; height: 8px; border-radius: 50%; background: var(--cian); box-shadow: 0 0 0 3px rgba(6, 182, 212, .22); display: inline-block; flex-shrink: 0; }
.esqueleto { display: block; height: 10px; border-radius: 5px; background: linear-gradient(90deg, #EEF2F7, #F6F8FB); }
.esqueleto--corto { width: 60%; }
.app-cuenta { font-size: 12px; font-weight: 500; color: #5A6779; background: #E9EEF5; min-width: 22px; line-height: 22px; border-radius: 6px; text-align: center; display: inline-block; padding: 0 5px; }

/* ── 1 · Hero ─────────────────────────────────────────── */
.hero { min-height: max(660px, min(100svh, 940px)); display: flex; align-items: center; padding: calc(72px + clamp(1rem, 4svh, 3rem)) 0 clamp(2rem, 5svh, 4rem); overflow: clip; }
.hero__grilla { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 4.5vw, 5rem); align-items: center; width: min(100% - 2 * var(--margen), 1320px); }
.hero__texto { display: grid; gap: clamp(1rem, 2.2svh, 1.5rem); align-content: center; }
.hero .titulo-hero { font-size: min(clamp(2.6rem, 1rem + 3.6vw, 4.75rem), 10svh); max-width: 9.5em; }
.hero__apoyo { font-size: clamp(1.05rem, .95rem + .35vw, 1.25rem); max-width: 27em; }
.hero__acciones { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: .25rem; }
.hero__control { font-size: .9375rem; line-height: 1.5; color: var(--sobre-azul); max-width: 30em; padding-left: .9rem; border-left: 2px solid var(--cian); }

.escena--hero { position: relative; aspect-ratio: 1.08; width: 100%; max-height: calc(100svh - 112px); }
.llamada {
  position: absolute; left: 0; top: 0; width: 100%; margin: 0; transform-origin: 0 0;
  background: var(--azul-noche); border-radius: 16px; overflow: hidden; display: grid; grid-template-rows: auto 1fr auto auto; grid-template-columns: minmax(0, 1fr);
  box-shadow: var(--sombra-ventana-azul); border: 1px solid rgba(165, 180, 252, .16); color: var(--blanco);
  font-family: var(--f-app); font-size: 13px; line-height: 18px; aspect-ratio: 1.56;
}
.llamada__barra { display: flex; align-items: center; gap: 10px; padding: 10px 14px; min-height: 42px; }
.llamada__titulo { font-weight: 600; }
.llamada__hora { color: #C7D2FE; font-family: var(--f-mono); font-size: 12px; flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.llamada__titulo { white-space: nowrap; }
.rotulo-demo { flex-shrink: 0; margin-left: auto; font-size: 11px; line-height: 16px; color: #C7D2FE; border: 1px solid rgba(199, 210, 254, .35); border-radius: 999px; padding: 1px 8px; white-space: nowrap; }
.llamada__mosaico { position: relative; display: grid; grid-template-columns: 1fr 1fr .52fr; gap: 6px; padding: 0 8px; min-height: 0; }
.llamada__persona { position: relative; border-radius: 10px; overflow: hidden; background: #1B2A5C; min-height: 0; }
.loop-video { display: block; }
/* G2d · el vídeo va encima del retrato y solo se ve cuando ya está reproduciendo; el retrato nunca se oculta.
   Sin fundido: el retrato es el cuadro 0 del clip, así que el cambio no mezcla dos poses */
.llamada__persona .loop-video { position: absolute; inset: 0; opacity: 0; }
.llamada__persona .loop-video--visible { opacity: 1; }
.llamada__persona img, .llamada__persona video { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.llamada__nombre { position: absolute; left: 8px; bottom: 8px; font-size: 12px; line-height: 16px; padding: 2px 8px; border-radius: 6px; background: rgba(9, 16, 40, .62); color: var(--blanco); max-width: calc(100% - 16px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.llamada__nora { position: relative; border-radius: 10px; background: var(--azul); display: grid; place-items: center; align-content: center; gap: 12px; border: 1px solid rgba(165, 243, 252, .28); color: var(--blanco); min-height: 0; }
.llamada__nora .marca-iso { width: 46%; max-width: 64px; height: auto; aspect-ratio: 1; color: var(--blanco); }
.llamada__nora-estado { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--cian-claro); }
.llamada__nora .punto-vivo { width: 7px; height: 7px; }
.escena[data-paso="2"] .llamada__nora-estado, .escena[data-paso="3"] .llamada__nora-estado { visibility: hidden; }
.llamada__fin { position: absolute; inset: 0 8px; border-radius: 10px; background: rgba(12, 22, 56, .3); pointer-events: none; }
.escena[data-paso="3"] .llamada__fin { display: none; }
.llamada__controles { display: flex; justify-content: center; gap: 10px; padding: 10px 0 12px; }
.llamada__control { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .1); color: #E0E7FF; }
.llamada__control .icono { width: 16px; height: 16px; }
.llamada__control--salir { background: #B42318; color: var(--blanco); width: 48px; border-radius: 18px; }
.llamada__linea { display: flex; align-items: center; gap: 10px; padding: 4px 14px 16px; color: #C7D2FE; font-family: var(--f-mono); font-size: 12px; }
.llamada__linea-pista { position: relative; flex: 1; height: 2px; background: rgba(199, 210, 254, .3); border-radius: 2px; }
.llamada__marca { position: absolute; left: var(--pos); top: 50%; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: var(--cian); box-shadow: 0 0 0 4px rgba(6, 182, 212, .25); }
.escena[data-reducida] .llamada, .escena[data-paso="2"] .llamada, .escena[data-paso="3"] .llamada { width: 58%; }
.escena[data-paso="2"] .llamada__controles { display: none; }
.nombre-corto { display: none; }
.escena[data-reducida] .nombre-largo, .escena[data-paso="2"] .nombre-largo, .escena[data-paso="3"] .nombre-largo { display: none; }
.escena[data-reducida] .nombre-corto, .escena[data-paso="2"] .nombre-corto, .escena[data-paso="3"] .nombre-corto { display: inline; }
.escena[data-paso="3"] .llamada__controles { display: none; }

.panel-nora { position: absolute; right: 0; bottom: 0; width: 52%; min-height: 0; display: grid; grid-template-rows: auto 1fr; z-index: 2; }
.panel-nora .app__cabeza { gap: 8px; }
.panel-nora__estado { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; white-space: nowrap; }
.panel-nora__estado .icono { width: 14px; height: 14px; color: var(--ok-texto); }
.panel-nora__estado .girador { color: var(--cian-profundo); width: 11px; height: 11px; }
.panel-nora__cuerpo { display: grid; align-content: start; }
.panel-nora__espera { display: grid; gap: 10px; }
.panel-nora__resultado { display: grid; gap: 12px; }
.siguiente-paso { border: 1px solid var(--app-linea); border-radius: 10px; padding: 12px 14px; display: grid; gap: 6px; background: var(--blanco); position: relative; }
.siguiente-paso::before { content: ''; position: absolute; left: -1px; top: 10px; bottom: 10px; width: 3px; border-radius: 3px; background: var(--cian); }
.siguiente-paso__titulo { font-size: 16px; line-height: 22px; font-weight: 600; letter-spacing: -.01em; }
.siguiente-paso__meta { display: flex; gap: 8px; align-items: center; }
.siguiente-paso__recordatorio { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--app-mutado); }
.siguiente-paso__recordatorio .icono { width: 14px; height: 14px; color: var(--cian-profundo); }
.entregas { display: grid; gap: 4px; }
.entregas li { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--app-texto); padding: 6px 2px; border-top: 1px solid #EEF2F6; }
.entregas .icono { width: 15px; height: 15px; color: #66758A; }

.hilo { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 3; }
.hilo__trazo { fill: none; stroke: var(--cian); stroke-width: 2; stroke-linecap: round; }
.hilo__punta { fill: var(--cian); filter: drop-shadow(0 0 6px rgba(6, 182, 212, .9)); }
.sin-js .hilo, .escena--hero:not([data-paso="3"]) .hilo { display: none; }

.escena__control { position: absolute; left: 0; bottom: 0; max-width: 47%; display: flex; align-items: center; gap: 8px 12px; flex-wrap: wrap; }
.pasos { display: flex; gap: 4px; }
.pasos button { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 12px 0 10px; border-radius: 999px; font-size: 13px; font-weight: 500; color: var(--sobre-azul); }
.pasos button::before { content: ''; width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid currentColor; }
.pasos button[aria-current="step"] { color: var(--blanco); background: rgba(255, 255, 255, .12); }
.pasos button[aria-current="step"]::before { background: var(--cian); border-color: var(--cian); }
.escena__boton { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 12px; border-radius: 999px; font-size: 13px; font-weight: 500; color: var(--blanco); border: 1px solid rgba(220, 230, 255, .35); }
.escena__boton .icono { width: 14px; height: 14px; }
.escena__boton:hover { border-color: var(--blanco); }
.sin-js .escena__control { display: none; }

/* ── 2 · Tu correo ────────────────────────────────────── */
.correo { display: grid; grid-template-columns: minmax(0, 4.4fr) minmax(0, 7.6fr); gap: clamp(2rem, 5vw, 5.5rem); align-items: center; }
.reparto { display: flex; gap: 2rem; margin-top: .5rem; flex-wrap: wrap; }
.reparto div { display: grid; gap: .15rem; }
.reparto dt { font-size: .875rem; color: var(--gris); }
.reparto dd { margin: 0; font-weight: 600; font-size: 1.05rem; }
.reparto div:first-child dd { color: var(--cian-profundo); }
.ventana-correo { min-height: 360px; display: grid; grid-template-rows: auto 1fr; }
.correo__app { display: grid; grid-template-columns: 0.95fr 1.25fr; min-height: 0; }
.correo__lista { border-right: 1px solid var(--app-linea); background: var(--blanco); overflow: hidden; }
.correo__item { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 12px 14px; border-bottom: 1px solid #EEF2F6; position: relative; background: var(--blanco); }
.correo__item.activo { background: #F3F7FC; }
.correo__item.activo::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--app-azul); }
.correo__de { font-weight: 600; font-size: 13px; }
.correo__item time { color: var(--app-mutado); font-size: 11.5px; text-align: right; }
.correo__asunto { grid-column: 1 / -1; font-size: 13px; color: var(--app-mutado); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.correo__item .app-categoria { grid-column: 1 / -1; justify-self: start; margin-top: 4px; }
.correo__lectura { padding: 18px 20px; display: grid; gap: 16px; align-content: start; background: var(--app-fondo); }
.correo__mensaje { font-size: 14px; line-height: 21px; color: var(--app-texto); background: var(--blanco); border: 1px solid var(--app-linea); border-radius: 10px; padding: 12px 14px; }
.borrador { background: var(--blanco); border: 1px solid #BAE6FD; border-radius: 10px; padding: 12px 14px; display: grid; gap: 10px; box-shadow: 0 0 0 3px rgba(6, 182, 212, .08); }
.borrador__cabeza { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.borrador__cabeza .marca-iso { width: 14px; height: 14px; }
.borrador__texto { font-size: 14px; line-height: 22px; }
.borrador__pie { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.borrador__enviar { opacity: .9; }

/* ── 3 · Tu reunión ───────────────────────────────────── */
.bloque--reunion { background: var(--lienzo); }
.reunion { display: grid; gap: clamp(2.5rem, 5vw, 4rem); }
.reunion__texto { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2rem, 5vw, 5rem); align-items: end; }
.reunion__texto .titulo-bloque { grid-row: span 2; max-width: 13em; }
.sin-corte { white-space: nowrap; }
.ventana-reunion { display: grid; grid-template-rows: auto 1fr; }
.reunion__app { position: relative; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); min-height: 340px; }
.hilo--reunion { z-index: 2; }
.sin-js .hilo--reunion, .escena--reunion[data-paso="1"] .hilo--reunion { display: none; }
.reunion__registro { padding: 18px; border-right: 1px solid var(--app-linea); display: grid; gap: 18px; align-content: start; background: var(--app-fondo); }
.reunion__miniaturas { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.reunion__miniatura { position: relative; aspect-ratio: 16 / 11; border-radius: 9px; overflow: hidden; background: #1B2A5C; }
.reunion__miniatura img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 28%; }
.reunion__miniatura span { position: absolute; left: 6px; bottom: 6px; font-size: 11px; line-height: 15px; padding: 1px 6px; border-radius: 5px; background: rgba(9, 16, 40, .6); color: var(--blanco); }
.linea-tiempo { position: relative; height: 44px; margin: 0 6px; }
.linea-tiempo__pista { position: absolute; left: 0; right: 0; top: 12px; height: 2px; border-radius: 2px; background: #D5DEE9; }
.linea-tiempo__marca { position: absolute; left: var(--pos); top: 0; transform: translateX(-50%); display: grid; justify-items: center; gap: 2px; min-width: 44px; min-height: 44px; padding-top: 6px; }
.linea-tiempo__marca::before { content: ''; width: 12px; height: 12px; border-radius: 50%; background: var(--blanco); border: 2px solid #94A3B8; }
.linea-tiempo__marca.activo::before { background: var(--cian); border-color: var(--cian); box-shadow: 0 0 0 4px rgba(6, 182, 212, .2); }
.linea-tiempo__marca time { font-size: 11px; color: var(--app-mutado); }
.linea-tiempo__marca.activo time { color: var(--cian-profundo); font-weight: 600; }
.cita { font-size: 15px; line-height: 22px; color: var(--app-texto); padding: 12px 14px; background: var(--blanco); border: 1px solid var(--app-linea); border-left: 3px solid var(--cian); border-radius: 8px; }
.cita cite { display: block; margin-top: 6px; font-style: normal; font-size: 12px; color: var(--app-mutado); }
.reunion__docs { padding: 16px 20px 20px; display: grid; gap: 16px; align-content: start; }
.reunion__docs .app-tab { min-height: 36px; }
.reunion__procesando { display: flex; align-items: center; gap: 8px; color: var(--cian-profundo); font-size: 13px; padding: 24px 0; }
.doc { display: grid; gap: 14px; }
.doc__lista { display: grid; gap: 10px; }
.doc__lista li { font-size: 14px; line-height: 21px; padding-left: 16px; position: relative; }
.doc__lista li::before { content: ''; position: absolute; left: 2px; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: #94A3B8; }
.doc__accion { justify-self: start; }
.doc__privado { display: inline-flex; align-items: center; gap: 6px; }
.doc__privado .icono { width: 13px; height: 13px; }
.compromisos { display: grid; gap: 10px; }
.compromiso { border: 1px solid var(--app-linea); border-radius: 10px; padding: 12px 14px; display: grid; gap: 6px; transition: border-color .2s, box-shadow .2s; }
.compromiso.activo { border-color: #67E8F9; box-shadow: 0 0 0 3px rgba(6, 182, 212, .12); }
.compromiso__titulo { font-weight: 600; font-size: 15px; }
.compromiso__meta { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--app-mutado); flex-wrap: wrap; }

/* ── 4 · CRM (Nora Teams) ─────────────────────────────── */
.aprobacion { display: grid; grid-template-columns: minmax(0, 7.8fr) minmax(0, 4.2fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.aprobacion .crm__texto { order: 2; padding-top: clamp(1rem, 4vw, 4rem); }
.aprobacion .escena--crm { order: 1; }
.crm__texto { display: grid; gap: 1.25rem; align-content: start; }
.etiqueta-plan { justify-self: start; font-size: .875rem; font-weight: 600; color: var(--azul); background: #E8EEFF; border-radius: 999px; padding: .2rem .75rem; }
.crm__titulo { font-size: clamp(2.3rem, 1.2rem + 3vw, 4rem); max-width: 8em; }
.crm__pro { font-size: .9375rem; color: var(--gris-oscuro); padding-top: 1rem; border-top: 1px solid rgba(15, 23, 42, .1); max-width: 26em; }
.ventana-crm__marco { display: flex; min-height: 400px; }
.ventana-crm__contenido { flex: 1; min-width: 0; padding: 20px 22px; display: grid; gap: 16px; align-content: start; background: var(--app-fondo); }
.ventana-crm__encabezado { display: flex; align-items: center; justify-content: space-between; }
.ventana-crm__h { font-size: 16px !important; line-height: 24px !important; font-weight: 600 !important; }
.propuesta { background: var(--blanco); border: 1px solid var(--app-linea); border-radius: 12px; padding: 16px; display: grid; gap: 14px; }
.cambio { display: grid; gap: 8px; }
.cambio div { display: grid; grid-template-columns: 110px 1fr; gap: 10px; font-size: 13px; line-height: 19px; }
.cambio dt { color: var(--app-mutado); }
.cambio dd { margin: 0; font-weight: 500; }
.cambio s { color: #94A3B8; font-weight: 400; margin-right: 6px; }
.respaldo summary { cursor: pointer; color: var(--app-azul); font-size: 13px; min-height: 32px; display: flex; align-items: center; }
.respaldo blockquote { margin: 6px 0 0; padding: 10px 12px; border-left: 2px solid var(--cian); background: var(--app-fondo); font-size: 13px; line-height: 19px; color: var(--app-texto); }
.respaldo cite { font-style: normal; color: var(--app-mutado); font-size: 12px; }
.propuesta__acciones { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.propuesta__aprobar { position: relative; min-width: 252px; min-height: 40px; overflow: hidden; }
.propuesta__texto { display: none; align-items: center; gap: 7px; }
[data-crm-estado="pendiente"] [data-crm-texto="pendiente"], [data-crm-estado="escribiendo"] [data-crm-texto="escribiendo"],
[data-crm-estado="registrada"] [data-crm-texto="registrada"], [data-crm-estado="atencion"] [data-crm-texto="atencion"] { display: inline-flex; }
.propuesta[data-crm-estado="registrada"] .propuesta__aprobar.app-boton, .propuesta[data-crm-estado="registrada"] .propuesta__aprobar.app-boton:hover { background: var(--ok-fondo); border-color: #B7DFCC; color: var(--ok-texto); cursor: default; }
.propuesta[data-crm-estado="atencion"] .propuesta__aprobar.app-boton, .propuesta[data-crm-estado="atencion"] .propuesta__aprobar.app-boton:hover { background: var(--error-fondo); border-color: var(--error-borde); color: var(--error-texto); cursor: default; }
.propuesta[data-crm-estado="escribiendo"] .propuesta__aprobar.app-boton, .propuesta[data-crm-estado="escribiendo"] .propuesta__aprobar.app-boton:hover { background: var(--app-azul-hover); border-color: var(--app-azul-hover); color: var(--blanco); cursor: progress; }
[data-crm-estado="registrada"] .propuesta__despues, [data-crm-estado="escribiendo"] .propuesta__despues, [data-crm-estado="atencion"] .propuesta__despues { visibility: hidden; }
.propuesta__error { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.otra-propuesta { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: var(--blanco); border: 1px solid var(--app-linea); border-radius: 12px; }
.crm__demo { display: flex; gap: 1.25rem; justify-content: flex-end; margin-top: 14px; flex-wrap: wrap; }
.enlace-demo { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-size: .9375rem; font-weight: 500; color: var(--gris-oscuro); text-decoration: underline; text-underline-offset: .2em; text-decoration-color: rgba(71, 85, 105, .4); }
.enlace-demo:hover { color: var(--tinta); }
.enlace-demo .icono { width: 15px; height: 15px; }

/* ── 5 · Tu equipo ────────────────────────────────────── */
.equipo { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.equipo__texto { display: grid; gap: 1.25rem; align-content: start; }
.equipo__texto .titulo-bloque { max-width: 12em; }
.equipo__acciones { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; margin-top: .5rem; }
.escena--equipo { display: grid; gap: 16px; }
.ventana-equipo .app__cuerpo { display: grid; gap: 14px; background: var(--app-fondo); }
.equipo__filtro { justify-self: start; }
.equipo__filtro button { min-height: 32px; padding: 4px 12px; }
.equipo__lista { position: relative; }
.equipo__lista .app-fila { align-items: center; }
.equipo__lista .app-fila[hidden] { display: none; }
.avatar { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: #EEF1F6; color: #3E495B; font-size: 11px; font-weight: 600; flex-shrink: 0; }
.equipo__nota { margin-top: -2px; }
.anotaciones { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.anotaciones li { display: inline-flex; align-items: center; gap: 8px; font-size: .9375rem; font-weight: 500; color: var(--sobre-azul); }
.anotaciones li::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--cian); }

/* ── 6 · Confianza ────────────────────────────────────── */
.confianza { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); grid-template-areas: "texto controles" "credenciales credenciales"; gap: clamp(2rem, 4vw, 3.5rem) clamp(2rem, 6vw, 6rem); align-items: start; }
.confianza__texto { display: grid; gap: 1.25rem; align-content: start; grid-area: texto; }
.controles { grid-area: controles; }
.credenciales { grid-area: credenciales; }
.controles { display: grid; gap: 0; align-content: start; }
.controles li { display: flex; align-items: center; gap: 14px; padding: 18px 0; border-bottom: 1px solid rgba(15, 23, 42, .1); font-size: 1.15rem; font-weight: 500; letter-spacing: -.01em; }
.controles li:first-child { border-top: 1px solid rgba(15, 23, 42, .1); }
.controles .icono { width: 22px; height: 22px; color: var(--azul); }
.credenciales { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; padding-top: 28px; border-top: 1px solid rgba(15, 23, 42, .1); }
.credenciales .enlace { margin-left: auto; }
.credenciales__titulo { font-size: .875rem; color: var(--gris); }
.credenciales__lista { display: grid; grid-template-columns: repeat(2, minmax(0, 340px)); gap: 12px; }
.credencial { display: grid; gap: 2px; padding: 12px 16px; border: 1px solid rgba(30, 58, 138, .3); border-radius: 12px; }
.credencial__nombre { font-weight: 700; font-size: 1.05rem; letter-spacing: -.01em; color: var(--azul); }
.credencial__detalle { font-size: .875rem; color: var(--gris-oscuro); }


/* ── 7 · Preguntas ────────────────────────────────────── */
.bloque--preguntas { background: var(--lienzo); }
.preguntas { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 5vw, 5rem); }
.preguntas__lista { border-top: 1px solid rgba(15, 23, 42, .12); }
.pregunta { border-bottom: 1px solid rgba(15, 23, 42, .12); }
.pregunta summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 64px; padding: .75rem 0; font-size: 1.15rem; font-weight: 600; letter-spacing: -.012em; }
.pregunta summary::-webkit-details-marker { display: none; }
.pregunta summary::after { content: ''; width: 12px; height: 12px; border-right: 2px solid var(--azul); border-bottom: 2px solid var(--azul); transform: rotate(45deg) translate(-3px, -3px); flex-shrink: 0; transition: transform .2s; }
.pregunta[open] summary::after { transform: rotate(225deg) translate(-3px, -3px); }
.pregunta p { padding: 0 0 1.25rem; max-width: 40em; color: var(--gris-oscuro); font-size: 1.025rem; }

/* ── 8 · Cierre ───────────────────────────────────────── */
.bloque--cierre { padding-bottom: calc(var(--bloque) * .8); }
.cierre { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.cierre__objeto { position: relative; aspect-ratio: 1; max-width: 300px; width: 100%; justify-self: center; display: grid; place-items: center; }
.cierre__objeto::after { content: ''; position: absolute; left: 14%; right: 14%; bottom: -4%; height: 9%; border-radius: 50%; background: radial-gradient(closest-side, rgba(15, 23, 42, .22), rgba(15, 23, 42, 0)); z-index: -1; }
.cierre__objeto picture { position: relative; z-index: 1; }
.cierre__objeto picture, .cierre__objeto img { width: 100%; height: 100%; object-fit: contain; }
.cierre__iso-plano { display: none; width: 62%; height: auto; aspect-ratio: 1; color: var(--azul); }
.cierre__objeto.sin-3d picture { display: none; }
.cierre__objeto.sin-3d .cierre__iso-plano { display: block; }
.cierre__texto { display: grid; gap: 1.75rem; }
.cierre__texto .titulo-bloque { font-size: clamp(2.3rem, 1.2rem + 3.2vw, 4.4rem); max-width: 10em; }
.cierre__acciones { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }

/* ── Responsive ───────────────────────────────────────── */
@media (max-width: 1100px) {
  .hero__grilla { grid-template-columns: minmax(0, 1fr); }
  .hero { min-height: 0; }
  .hero .titulo-hero { max-width: 11em; font-size: clamp(2.5rem, 1.2rem + 5vw, 4.4rem); }
  .escena--hero { max-width: 760px; }
  .correo, .aprobacion, .equipo, .cierre { grid-template-columns: minmax(0, 1fr); }
  .reunion__texto { grid-template-columns: minmax(0, 1fr); }
  .reunion__texto .titulo-bloque { grid-row: auto; }
  .confianza { grid-template-columns: minmax(0, 1fr); grid-template-areas: "texto" "controles" "credenciales"; }
  .preguntas { grid-template-columns: minmax(0, 1fr); }
  .cierre__objeto { max-width: 300px; justify-self: start; }
}
@media (max-width: 760px) {
  .hero { padding-top: calc(64px + 1.75rem); padding-bottom: 2.5rem; }
  .hero__texto { gap: 1rem; }
  .hero__acciones .boton { flex: 1 1 auto; }
  .escena--hero { aspect-ratio: auto; height: auto; display: grid; gap: 12px; }
  .llamada { position: relative; width: 100%; aspect-ratio: 1.3; }
  .escena[data-reducida] .llamada, .escena[data-paso="2"] .llamada, .escena[data-paso="3"] .llamada { width: 100%; aspect-ratio: auto; }
  .escena[data-paso="2"] .llamada__mosaico { height: 34vw; max-height: 170px; }
  .llamada__mosaico { grid-template-columns: 1fr 1fr; }
  .llamada__nora { position: absolute; right: 14px; bottom: 6px; top: auto; width: 36px; height: 36px; border-radius: 9px; gap: 0; box-shadow: 0 2px 8px rgba(4, 10, 30, .45); }
  .llamada__nora .marca-iso { width: 22px; max-width: none; }
  .llamada__persona:nth-child(2) .llamada__nombre { max-width: calc(100% - 64px); }
  .llamada__nora .llamada__nombre, .llamada__nora-estado { display: none; }
  .hilo { display: none !important; }
  .escena__control { max-width: none; }
  .escena[data-paso="3"] .llamada__mosaico { height: 34vw; max-height: 170px; }
  .llamada__nombre { font-size: 11px; }
  .rotulo-demo { font-size: 10px; padding: 0 6px; }
  .llamada__titulo { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .llamada__barra .llamada__hora { display: none; }
  .panel-nora { position: relative; right: auto; bottom: auto; width: 100%; min-height: 0; }
  .escena__control { position: relative; }
  .pasos button { padding: 0 10px 0 8px; font-size: 12px; min-height: 40px; }
  .correo__app { grid-template-columns: minmax(0, 1fr); }
  .correo__lista { border-right: 0; border-bottom: 1px solid var(--app-linea); }
  .correo__item:nth-child(n+3) { display: none; }
  .reunion__app { grid-template-columns: minmax(0, 1fr); }
  .hilo--reunion { display: none; }
  .reunion__sub { display: none; }
  .aprobacion .crm__texto { order: 0; padding-top: 0; }
  .credenciales__lista { grid-template-columns: minmax(0, 1fr); width: 100%; }
  .credenciales .enlace { margin-left: 0; }
  .reunion__registro { border-right: 0; border-bottom: 1px solid var(--app-linea); }
  .ventana-crm__contenido { padding: 14px; }
  .cambio div { grid-template-columns: 92px 1fr; }
  .propuesta__aprobar { min-width: 0; flex: 1 1 100%; min-height: 44px; }
  .propuesta__despues { min-height: 44px; }
  .crm__demo { justify-content: flex-start; }
  .equipo__lista .app-fila { flex-wrap: wrap; }
  .equipo__lista .app-fila .app-plazo { margin-left: 42px; }
  .controles li { font-size: 1.05rem; }
  .pregunta summary { font-size: 1.05rem; }
}
@media (max-width: 380px) {
  .pasos button span { font-size: 11.5px; }
  .escena__control { gap: 6px; }
}

/* Objetivos táctiles ≥ 44 px en pantallas táctiles (sin cambiar el tamaño visual del texto) */
@media (pointer: coarse), (max-width: 760px) {
  .pasos button, .escena__boton, .enlace-demo { min-height: 44px; }
  .equipo__filtro button { min-height: 44px; padding-block: 10px; }
  .reunion__docs .app-tab { min-height: 44px; }
  .respaldo summary { min-height: 44px; }
  .cierre__acciones .enlace, .equipo__acciones .enlace, .credenciales .enlace { display: inline-flex; align-items: center; min-height: 44px; }
  .app-segmentado button { min-height: 44px; }
}


/* ═════════ G2c ═════════ */

/* Hero · desenlace: acuerdos → propuesta con destino → aprobado → registrado (Teams) | seguimiento (Pro) */
.acuerdos { display: grid; gap: 6px; }
.acuerdo { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--app-linea); border-radius: 9px; font-size: 13px; }
.acuerdo--clave { border-color: #67E8F9; box-shadow: 0 0 0 3px rgba(6, 182, 212, .1); }
.acuerdo__texto { font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.desenlace { position: relative; margin-top: 10px; padding: 10px 12px; border-radius: 10px; border: 1px solid #D6E1EC; background: #F5F8FC; display: grid; gap: 6px; font-size: 13px; }
.escena--hero[data-modo="teams"] .desenlace--pro, .escena--hero[data-modo="pro"] .desenlace--teams { display: none !important; }
.desenlace__destino { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.desenlace__destino strong { color: var(--app-azul); font-weight: 500; }
.desenlace__cambio { color: var(--app-texto); }
.desenlace__cambio s { color: #94A3B8; margin-right: 6px; }
.desenlace__accion { display: flex; align-items: center; min-height: 34px; }
.desenlace__accion > [data-hero-texto] { display: none; }
.desenlace__accion[data-hero-crm="pendiente"] > [data-hero-texto="pendiente"],
.desenlace__accion[data-hero-crm="escribiendo"] > [data-hero-texto="escribiendo"],
.desenlace__accion[data-hero-crm="registrada"] > [data-hero-texto="registrada"] { display: inline-flex; }
.desenlace__boton { min-height: 32px; padding: 5px 12px; }
.desenlace__ok { font-weight: 600; }
.desenlace__linea { display: flex; align-items: center; gap: 8px; }
.desenlace__linea .icono { width: 15px; height: 15px; color: var(--cian-profundo); }
.cursor-demo { position: absolute; left: 0; top: 0; display: none; align-items: flex-start; gap: 2px; pointer-events: none; z-index: 4; }
.cursor-demo__flecha { width: 18px; height: 18px; fill: var(--tinta); stroke: var(--blanco); stroke-width: 1.2; }
.cursor-demo span { font-family: var(--f-app); font-size: 11px; line-height: 15px; padding: 1px 6px; border-radius: 5px; background: var(--tinta); color: var(--blanco); margin-top: 12px; }
.panel-nora__modo { padding: 0 16px 14px; }
.panel-nora__modo .app-segmentado button { min-height: 30px; }
.hilo__trazo--b { opacity: .95; }

/* CRM a ancho completo: un solo foco */
.crm-g { display: grid; gap: clamp(2rem, 4vw, 3rem); }
.crm-g__texto { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2rem, 5vw, 5rem); align-items: end; }
.crm-g__texto .etiqueta-plan { grid-column: 1 / -1; margin-bottom: .75rem; }
.crm-g__texto .crm__titulo { max-width: 9em; }
.propuestas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.propuesta__tipo { display: flex; align-items: center; justify-content: space-between; font-weight: 600; font-size: 15px; }
.propuesta__cambio { font-size: 13px; line-height: 19px; font-weight: 500; }
.propuesta__cambio s { color: #94A3B8; font-weight: 400; margin-right: 6px; }
.propuesta__aprobar { min-width: 0; width: 100%; }
.estado-crm { font-size: 13px; color: var(--app-mutado); padding-top: 4px; }
.estado-crm span { font-weight: 600; color: var(--app-texto); font-variant-numeric: tabular-nums; }

/* Equipo: valor de Teams como operación visible */
.equipo-g { display: grid; gap: clamp(2rem, 4vw, 3rem); }
.equipo-g__texto { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2rem, 5vw, 5rem); align-items: end; }
.equipo-g__texto .titulo-bloque { max-width: 12em; }
.escena--equipo { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 18px; align-items: start; }
.rotulo-ejemplo { margin-left: auto; font-size: 11px; color: var(--app-mutado); border: 1px solid var(--app-linea); border-radius: 999px; padding: 0 8px; line-height: 18px; }
.tabla-equipo { width: 100%; border-collapse: collapse; background: var(--blanco); border: 1px solid var(--app-linea); border-radius: 12px; overflow: hidden; font-size: 13px; }
.tabla-equipo th { text-align: left; font-weight: 500; color: var(--app-mutado); font-size: 12px; padding: 8px 12px; background: var(--app-fondo); border-bottom: 1px solid var(--app-linea); }
.tabla-equipo td { padding: 10px 12px; border-bottom: 1px solid var(--app-linea); vertical-align: middle; }
.tabla-equipo tr:last-child td { border-bottom: 0; }
.tabla-equipo tr[hidden] { display: none; }
.tabla-equipo td:nth-child(2) { white-space: nowrap; }
.tabla-equipo td:nth-child(2) .avatar { display: inline-grid; width: 24px; height: 24px; font-size: 10px; margin-right: 6px; vertical-align: middle; }
.tabla-equipo td:nth-child(3) .crm { margin-right: 4px; }
.tarjeta-reunion .cubierto { display: grid; padding: 6px 14px; }
.cubierto li { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid #EEF2F6; font-size: 13px; font-weight: 500; }
.cubierto li:last-child { border-bottom: 0; }
.cubierto li > :last-child { margin-left: auto; }
.cubierto .avatar { width: 26px; height: 26px; font-size: 10px; }
.cubierto__pie { padding: 0 14px 14px; }
.valor-teams { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--linea-azul); }
.valor-teams div { padding: 18px 18px 4px 0; display: grid; gap: 6px; align-content: start; }
.valor-teams div + div { padding-left: 18px; border-left: 1px solid var(--linea-azul); }
.valor-teams dt { font-weight: 600; font-size: 1.02rem; letter-spacing: -.01em; color: var(--blanco); }
.valor-teams dt::before { content: ''; display: block; width: 18px; height: 3px; border-radius: 2px; background: var(--cian); margin-bottom: 10px; }
.valor-teams dd { margin: 0; font-size: .9rem; line-height: 1.45; color: var(--sobre-azul); }

/* Pro */
.etiqueta-plan--pro { background: #EEF2F7; color: var(--tinta); }
.reunion__texto .etiqueta-plan { grid-column: 1 / -1; justify-self: start; margin-bottom: .25rem; }
.compromiso__recordatorio { display: inline-flex; align-items: center; gap: 4px; color: var(--cian-profundo); }
.compromiso__recordatorio .icono { width: 13px; height: 13px; }
.bandeja-linea { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; font-size: .9375rem; color: var(--gris-oscuro); }
.bandeja-linea .icono { width: 18px; height: 18px; color: var(--azul); }

@media (max-width: 1100px) {
  .crm-g__texto, .equipo-g__texto { grid-template-columns: minmax(0, 1fr); row-gap: 1rem; }
  .escena--equipo { grid-template-columns: minmax(0, 1fr); }
  .valor-teams { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .valor-teams div, .valor-teams div + div { padding: 16px 16px 8px 0; border-left: 0; border-top: 1px solid var(--linea-azul); }
}
@media (max-width: 760px) {
  .propuestas { grid-template-columns: minmax(0, 1fr); }
  .valor-teams { grid-template-columns: minmax(0, 1fr); border-top: 0; }
  .tabla-equipo thead { display: none; }
  .tabla-equipo, .tabla-equipo tbody, .tabla-equipo tr, .tabla-equipo td { display: block; }
  .tabla-equipo tr { padding: 10px 12px; border-bottom: 1px solid var(--app-linea); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 8px; }
  .tabla-equipo tr[hidden] { display: none; }
  .tabla-equipo td { padding: 0; border: 0; }
  .tabla-equipo td:first-child { grid-column: 1 / -1; font-weight: 500; }
  .tabla-equipo td:nth-child(4) { grid-column: 2; grid-row: 2 / span 2; align-self: center; }
  .panel-nora { bottom: auto; }
  .acuerdo__texto { white-space: normal; }
}
@media (pointer: coarse), (max-width: 760px) {
  .panel-nora__modo .app-segmentado button { min-height: 44px; }
}

.escena--hero .escena__control { max-width: 46%; }
.escena--hero .pasos button { white-space: nowrap; padding: 0 10px 0 8px; font-size: 12.5px; }
@media (max-width: 760px) { .escena--hero .escena__control { max-width: none; } }
/* Angosto: la escena guarda el alto de su paso más alto (lo fija escenas.js) y el control queda abajo, para que el panel
   no empuje el control ni la página en cada vuelta. Sin el tope de alto de la composición superpuesta: con bloques
   apilados, ese tope recortaba la llamada y el panel en vistas bajas */
@media (max-width: 760px) {
  .escena--hero { grid-template-rows: auto auto 1fr; max-height: none; }
  .escena--hero .escena__control { grid-row: 3; align-self: end; }
}
.escena--hero .pasos { gap: 0; }
.escena--hero .pasos button { padding: 0 8px 0 6px; gap: 6px; }
.escena--hero[data-paso="2"] .llamada__hora, .escena--hero[data-paso="3"] .llamada__hora { display: none; }
.escena--hero[data-paso="2"] .llamada__nora .llamada__nombre, .escena--hero[data-paso="3"] .llamada__nora .llamada__nombre { font-size: 10px; padding: 1px 5px; left: 5px; bottom: 5px; }

/* G2c · correcciones tras la revisión independiente */
.escena--hero[data-modo="teams"] .solo-pro, .escena--hero[data-modo="pro"] .solo-teams { display: none; }
.desenlace__recordatorio { color: var(--app-mutado); }
.panel-esqueleto { display: none; gap: 10px; padding: 4px 0 10px; }
.escena--hero[data-procesando] .panel-esqueleto { display: grid; }
.escena--hero[data-procesando] .acuerdos { display: none; }
.propuestas { align-items: start; }
.ventana-crm__encabezado .rotulo-ejemplo { margin-left: auto; }
.equipo-g .valor-teams { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.estados-lider { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: 13px; color: var(--app-mutado); }
.tarjeta-reunion__nora { display: flex; align-items: center; gap: 8px; margin: 12px 14px 4px; padding: 8px 10px; border-radius: 9px; background: var(--azul); color: var(--blanco); font-size: 13px; font-weight: 500; }
.tarjeta-reunion__nora .marca-iso { width: 16px; height: 16px; }
.tarjeta-reunion .cubierto { padding-bottom: 10px; }
@media (max-width: 760px) {
  .reunion__docs .app-tabs { overflow-x: auto; scrollbar-width: none; gap: 16px; }
  .reunion__docs .app-tabs::-webkit-scrollbar { display: none; }
  .reunion__docs .app-tab { flex-shrink: 0; }
}
@media (max-width: 1100px) { .equipo-g .valor-teams { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .equipo-g .valor-teams { grid-template-columns: minmax(0, 1fr); } }

@media (max-width: 760px) {
  .reunion__docs { position: relative; }
  .reunion__docs .app-tabs { padding: 4px 28px 0 4px; margin: -4px -4px 0; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 32px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 32px), transparent); }
}
@media (max-width: 760px) { .reunion__docs .app-tabs { scroll-padding-inline: 4px 32px; } }
.estados-lider [data-cero] { color: var(--app-mutado); background: transparent; }