/* CHAT · El teléfono de FV: pantalla de mensajería, gris carbón, burbujas verde y gris, cadena de custodia */
.fmt--chat { --bg: #101B21; --bg-2: #18262E; --fg: #E9EDEF; --mute: #8FA0AA; --acc: #25D366; --acc-2: #53BDEB; --line-x: rgba(233,237,239,.14);
  --f-display: 'Manrope', system-ui, sans-serif; --f-body: 'Source Serif 4', Georgia, serif; --f-mono: 'IBM Plex Mono', ui-monospace, monospace; --f-label: 'Manrope', system-ui, sans-serif; }
.fmt--chat::after { mix-blend-mode: screen; opacity: .04; }
.fmt--chat .topbar { background: rgba(16,27,33,.9); }
.fmt--chat .footer { background: #0A1216; }
.fmt--chat .htitle, .fmt--chat .cap__title, .fmt--chat .fmod__head h2 { font-weight: 800; letter-spacing: -.045em; }
.fmt--chat .htitle em, .fmt--chat .cap__title em, .fmt--chat .fmod__head h2 em { font-style: normal; font-weight: 400; color: var(--acc); }
.hero--chat { padding: 100px 0 40px; background: radial-gradient(ellipse 50% 60% at 80% 40%, rgba(37,211,102,.12), transparent 60%), var(--bg); }
.hero--chat .htitle { font-size: clamp(48px, 8vw, 118px); }
.hero--chat .hdeck { color: #CDD6DB; font-size: clamp(16px, 1.3vw, 19px); }
.hero--chat .hstats b { color: var(--acc); font-family: var(--f-label); font-weight: 800; }
.phone { width: min(100%, 360px); margin-left: auto; background: #0B141A; border: 10px solid #1F2C34; border-radius: 40px; overflow: hidden; box-shadow: 0 50px 90px -40px rgba(0,0,0,.8); animation: card 1.2s var(--ease-out) .3s both; }
@keyframes card { from { opacity: 0; transform: translateY(40px) rotate(3deg); } }
.phone__top { display: grid; grid-template-columns: 34px 1fr; gap: 2px 12px; align-items: center; padding: 14px 16px; background: #1F2C34; font-family: var(--f-label); }
.phone__top i { grid-row: span 2; width: 34px; height: 34px; border-radius: 50%; background: #3A4A54; }
.phone__top b { font-size: 14px; } .phone__top span { font-size: 11px; color: var(--mute); }
.phone__body { padding: 16px 12px 22px; display: grid; gap: 8px; background: #0B141A url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Ccircle cx='30' cy='30' r='1' fill='%231f2c34'/%3E%3C/svg%3E"); min-height: 300px; align-content: end; }
.burbuja { max-width: 86%; padding: 8px 12px 6px; border-radius: 10px; font-family: var(--f-label); font-size: 13.5px; line-height: 1.4; position: relative; opacity: 0; transform: translateY(12px); transition: opacity .4s, transform .4s; }
.phone .burbuja { animation: rise .5s var(--ease-out) forwards; animation-delay: calc(1s + var(--i) * .7s); }
.burbuja.in { opacity: 1; transform: none; }
.burbuja.otro { background: #202C33; align-self: start; border-top-left-radius: 2px; }
.burbuja.yo { background: #005C4B; align-self: end; justify-self: end; border-top-right-radius: 2px; }
.burbuja p { margin: 0; } .burbuja time { display: block; text-align: right; font-size: 10px; color: rgba(233,237,239,.6); margin-top: 3px; }
.fmt--chat .fnav { background: rgba(16,27,33,.94); }
.fmt--chat .fnav a { text-transform: none; letter-spacing: 0; font-size: 13px; font-weight: 600; }
.fmt--chat .fnav a b { color: var(--acc); }
.fmt--chat .cap__num { color: var(--acc); }
.fmt--chat .ftext { color: #DCE3E7; }
.fmt--chat .estado, .fmt--chat .fper, .fmt--chat .fresp li, .fmt--chat .hito { background: var(--bg-2); }
.cadena { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); counter-reset: c; }
.cadena li { counter-increment: c; position: relative; padding: 18px 16px 18px 0; border-top: 2px solid var(--acc); }
.cadena li::before { content: counter(c); position: absolute; top: -14px; left: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--acc); color: #0B141A; display: grid; place-items: center; font-family: var(--f-label); font-weight: 800; font-size: 12px; }
.cadena b { display: block; font-family: var(--f-label); font-weight: 800; font-size: 15px; margin: 10px 0 6px; }
.cadena p { margin: 0; font-family: var(--f-label); font-size: 13px; line-height: 1.5; color: var(--mute); }
.convs { display: grid; gap: 22px; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.conv { background: #0B141A; border: 1px solid var(--line-x); border-radius: 14px; overflow: hidden; display: grid; align-content: start; }
.conv header { padding: 12px 16px; background: #1F2C34; font-family: var(--f-label); font-weight: 700; font-size: 14px; }
.conv .burbuja { margin: 8px 12px; }
.conv .burbuja.yo { margin-left: auto; }
.conv .burbuja:last-child { margin-bottom: 16px; }
.fmt--chat .fcita { border-left-color: var(--acc); }
.fmt--chat .fdato b { color: var(--acc); font-family: var(--f-label); font-weight: 800; }
.fmt--chat .cierre { background: #0B141A; border-radius: 14px; }
.fmt--chat .cierre__lineas li { background: #202C33; border: 0; border-radius: 10px; padding: 12px 14px; margin-bottom: 8px; }