/* A financial answer stays in the conversation, with the page's WhatsApp palette. */
#ofCardConversa .of-stage-conversa {
  align-items: center;
  min-height: 427px;
  padding-bottom: 30px;
  overflow: visible;
}
.ofqa {
  width: 100%;
  max-width: 340px;
  color: #e9edef;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.ofqa * { box-sizing: border-box; }
.ofqa-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 0 14px;
  border-bottom: 1px solid #ffffff1c;
}
.ofqa-header > img { width: 34px; height: 34px; border-radius: 50%; flex: none; }
.ofqa-contact { display: grid; gap: 4px; }
.ofqa-contact b { display: flex; align-items: center; gap: 5px; font-size: 15px; line-height: 18px; font-weight: 600; }
.ofqa-contact > span { font-size: 11px; line-height: 13px; color: #a5a7a8; }
.ofqa-verified { display: block; width: 13px; height: 13px; flex: none; }
.ofqa-viewport { height: 320px; margin-top: 18px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; }
.ofqa-viewport::-webkit-scrollbar { display: none; }
.ofqa.is-playing .ofqa-viewport { overflow: hidden; }
.ofqa-thread { display: flex; flex-direction: column; gap: 13px; padding: 1px 1px 2px; transition: opacity 240ms ease; }
.ofqa [data-message][hidden] { display: none !important; }
.ofqa [data-message] { transition: opacity 300ms ease, transform 440ms cubic-bezier(.22,1,.36,1); }
.ofqa [data-message].is-entering { opacity: 0; transform: translateY(7px); }
.ofqa-question, .ofqa-answer {
  position: relative;
  padding: 12px 14px 9px;
  border-radius: 13px;
  transition: opacity 300ms ease, transform 440ms cubic-bezier(.22,1,.36,1);
}
.ofqa-question { max-width: 87%; align-self: flex-end; background: rgba(0,168,132,.25); border: 1px solid rgba(0,255,170,.15); }
.ofqa-question, .ofqa-answer { -webkit-backdrop-filter: blur(12px) saturate(1.2); backdrop-filter: blur(12px) saturate(1.2); }
.ofqa-question p, .ofqa-answer p { margin: 0; font-size: 14px; line-height: 1.45; font-weight: 400; color: #e9edef; }
.ofqa-time { display: flex; justify-content: flex-end; align-items: center; gap: 4px; margin-top: 4px; color: #a5a7a8; font-size: 9px; line-height: 11px; font-variant-numeric: tabular-nums; }
.ofqa-question .ofqa-time { color: rgba(233,237,239,.65); }
.ofqa-time svg { width: 15px; height: 11px; color: #53bdeb; }
.ofqa-answer-slot { position: relative; width: 94%; }
.ofqa-answer { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.2); color: #e9edef; }
.ofqa-answer p { color: inherit; }
.ofqa-agent { display: flex; align-items: center; gap: 6px; margin-bottom: 9px; white-space: nowrap; }
.ofqa-agent img { width: 24px; height: 24px; object-fit: cover; border-radius: 50%; flex: none; }
.ofqa-agent b { font-size: 13px; font-weight: 600; color: #fff; }
.ofqa-agent .ofqa-verified { width: 11px; height: 11px; }
.ofqa-agent small { color: rgba(233,237,239,.65); font-size: 11px; font-weight: 400; }
.ofqa-answer p strong { color: #fff; font-weight: 600; white-space: nowrap; }
.ofqa-projection { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin: 17px 0 12px; }
.ofqa-month { display: flex; flex-direction: column; align-items: center; min-width: 0; }
.ofqa-bar-space { display: flex; align-items: flex-end; justify-content: center; width: 100%; height: 45px; border-bottom: 1px solid #ffffff20; }
.ofqa-bar-space i {
  display: block; width: 28px; height: var(--height); border-radius: 3px 3px 0 0;
  background: #bdbdc5; transform-origin: bottom;
  transition: transform 650ms cubic-bezier(.22,1,.36,1);
  transition-delay: var(--delay);
}
.ofqa-month:nth-child(2) .ofqa-bar-space i { background: #93939d; }
.ofqa-month:nth-child(3) .ofqa-bar-space i { background: #6d6d78; }
.ofqa-month b { margin-top: 6px; font-size: 11px; line-height: 14px; font-weight: 500; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ofqa-month > span:last-child { margin-top: 2px; color: #a8a8b0; font-size: 10px; line-height: 13px; }
.ofqa-answer .ofqa-time { color: rgba(233,237,239,.6); }
.ofqa-projection { transition: opacity 300ms ease; }
.ofqa-typing {
  display: none; align-items: center; gap: 4px;
  height: 32px; padding: 0 12px; border-radius: 11px; border-top-left-radius: 3px;
  background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.2);
}
.ofqa-typing i { width: 4px; height: 4px; border-radius: 50%; background: #a8a8b0; }
.ofqa-answer-slot.is-typing .ofqa-answer { display: none; }
.ofqa-answer-slot.is-typing .ofqa-typing { display: inline-flex; }
.ofqa-answer-slot.is-typing .ofqa-typing i { animation: ofqaTyping 900ms ease-in-out infinite; }
.ofqa-typing i:nth-child(2) { animation-delay: 130ms !important; }
.ofqa-typing i:nth-child(3) { animation-delay: 260ms !important; }
.ofqa-projection.is-pending { opacity: 0; }
.ofqa-projection.is-pending .ofqa-bar-space i { transform: scaleY(0); }
.ofqa.is-leaving .ofqa-thread { opacity: 0; }
.ofqa.is-priming *, .ofqa.is-priming *:before { transition: none !important; }
@keyframes ofqaTyping { 0%, 80%, 100% { opacity: .4; } 40% { opacity: 1; } }
@media (min-width: 961px) and (max-width: 1100px) {
  .ofqa-question p, .ofqa-answer p { font-size: 13px; }
  .ofqa-question, .ofqa-answer { padding: 10px 11px 8px; }
  .ofqa-projection { gap: 8px; }
  .ofqa-month b { font-size: 10px; }
  .ofqa-agent small { font-size: 10px; }
}
@media (max-width: 600px) {
  #ofCardConversa .of-stage-conversa { flex: none; min-height: 380px; padding: 0 6px 28px; }
}
@media (max-width: 360px) {
  .ofqa-answer-slot { width: 97%; }
  .ofqa-question, .ofqa-answer { padding-inline: 11px; }
  .ofqa-projection { gap: 8px; }
  .ofqa-month b { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .ofqa *, .ofqa *:before { transition: none !important; animation: none !important; }
}
