/* ============================================================
   Yezzex · chat do site ("Pergunte à Yezzex")
   Referência de interação: jota.ai/chat — página própria, opções em
   pílulas, resposta que surge palavra a palavra, cartões ricos.
   ============================================================ */
.chat-page{min-height:100vh;display:flex;flex-direction:column}
.chat-top{position:sticky;top:0;z-index:20;background:rgba(247,249,252,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.chat-top .in{max-width:1320px;margin:0 auto;padding:18px 32px;display:flex;align-items:center;justify-content:space-between}
.close-chat{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink);background:#fff;border:1px solid var(--bd);border-radius:999px;padding:9px 16px;transition:border-color .15s}
.close-chat:hover{border-color:var(--ink)}
.close-chat svg{width:14px;height:14px}

.chat-main{flex:1;width:100%;max-width:880px;margin:0 auto;padding:0 24px 200px}

/* tela inicial */
.chat-intro{padding:16vh 0 40px;text-align:center}
.chat-intro h1{font-family:'Sora',sans-serif;font-weight:600;font-size:clamp(42px,6.4vw,84px);line-height:1.02;letter-spacing:-.05em;margin:0;color:var(--ink)}
.chat-intro p{font-size:17px;color:var(--tx-2);margin:16px 0 0}
.opts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:30px}
.opt{display:inline-flex;align-items:center;gap:8px;font-family:'Manrope',sans-serif;font-size:14.5px;font-weight:600;color:var(--ink);background:#fff;border:0;border-radius:999px;padding:11px 17px;box-shadow:0 6px 20px -12px rgba(16,24,38,.35);cursor:pointer;transition:transform .15s,box-shadow .15s}
.opt:hover{transform:translateY(-1px);box-shadow:0 10px 24px -12px rgba(16,24,38,.45)}
.opt svg{width:16px;height:16px;color:var(--blue)}
.chat-field{margin-top:64px;height:220px;border-radius:40px}

/* conversa */
.thread{display:flex;flex-direction:column;gap:22px;padding-top:28px}
.q-bub{align-self:flex-end;max-width:78%;background:var(--surface-2);color:var(--ink);font-size:15.5px;font-weight:500;padding:12px 18px;border-radius:22px 22px 6px 22px}
.ans{align-self:stretch;display:flex;flex-direction:column;gap:18px}
.ans-txt{font-size:17px;line-height:1.6;color:var(--ink);max-width:680px}
.ans-txt b{font-weight:700}
.w{display:inline;opacity:0;filter:blur(6px);transition:opacity .35s,filter .35s}
.w.on{opacity:1;filter:none}
.ans-note{font-size:12.5px;color:var(--tx-3)}
.ans-more{font-size:14px;font-weight:600;color:var(--tx-2);margin-top:6px}
.ans .opts{justify-content:flex-start;margin-top:0}
.ans .opt{font-size:13.5px;padding:9px 14px}
.cta-row{display:flex;gap:10px;flex-wrap:wrap}
.reveal-up{opacity:0;transform:translateY(10px);transition:opacity .45s,transform .45s}
.reveal-up.on{opacity:1;transform:none}

/* cartões das respostas */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.c{background:#fff;border:1px solid var(--bd);border-radius:22px;padding:20px 22px;box-shadow:0 14px 34px -26px rgba(16,24,38,.4)}
.c-hd{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13px;font-weight:600;color:var(--tx-2)}
.c-hd small{font-size:11.5px;color:var(--tx-3);font-weight:500}
.c-big{font-family:'Sora',sans-serif;font-weight:600;font-size:22px;letter-spacing:-.03em;color:var(--ink);margin:6px 0 2px}
.c-sub{font-size:12.5px;color:var(--tx-3)}
.c-list{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.c-list li{display:flex;align-items:flex-start;gap:12px;font-size:14px;color:var(--ink)}
.c-list li small{display:block;font-size:12.5px;color:var(--tx-2)}
.c-ic{width:30px;height:30px;border-radius:50%;flex:none;background:#E5EDFC;color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}
.c-ic svg{width:15px;height:15px}
.c-ic.ok{background:#E3F4EA;color:#1B7A45}
.c-chat{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.c-chat .b{max-width:86%;font-size:13.5px;line-height:1.45;padding:9px 13px;border-radius:16px}
.c-chat .b.ag{align-self:flex-start;background:var(--surface);border-bottom-left-radius:5px}
.c-chat .b.me{align-self:flex-end;background:var(--blue);color:#fff;font-weight:600;border-bottom-right-radius:5px}
.c-chat .b.sys{align-self:center;font-size:11.5px;font-weight:700;color:var(--tx-2);border:1px dashed var(--bd-2);border-radius:999px;padding:4px 11px}
.c-code{font-family:var(--mono);font-size:12.5px;line-height:1.75;background:var(--surface);border-radius:14px;padding:12px 14px;margin-top:12px;white-space:pre;overflow:auto;color:var(--ink)}
.c-code .k{color:var(--blue-deep)}.c-code .v{color:#1B7A45}.c-code .m{color:var(--tx-3)}
.c-appr{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;background:var(--surface);border-radius:14px;padding:12px 14px}
.c-appr b{display:block;font-size:13.5px}
.c-appr span{font-size:12px;color:var(--tx-2)}
.c-appr .bt{display:flex;gap:6px}
.c-appr .bt i{font-style:normal;font-size:12.5px;font-weight:600;padding:7px 12px;border-radius:999px;border:1px solid var(--bd-2);background:#fff}
.c-appr .bt i.y{background:var(--ink);border-color:var(--ink);color:#fff}
.c.ink{background:var(--ink);border-color:var(--ink);color:#fff;display:flex;align-items:center;gap:22px}
.c.ink svg{width:64px;height:64px;flex:none}
.c.ink .eq{font-family:'Sora',sans-serif;font-weight:600;font-size:44px;letter-spacing:-.05em;line-height:1}
.c.ink .eq sup{color:var(--blue-soft);font-size:.5em}
.c.ink p{margin:6px 0 0;font-size:13.5px;color:#8FA0BC}
.c-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:2px}
.c-steps div{background:var(--surface);border-radius:14px;padding:12px 14px}
.c-steps b{display:block;font-size:12px;color:var(--blue)}
.c-steps span{display:block;font-family:'Sora',sans-serif;font-weight:600;font-size:15px;letter-spacing:-.02em;margin-top:2px}
.c-steps small{display:block;font-size:12px;color:var(--tx-2);margin-top:2px}

.typing-dots{display:inline-flex;gap:4px;padding:6px 0}
.typing-dots i{width:7px;height:7px;border-radius:50%;background:var(--tx-3);animation:tp 1s infinite}
.typing-dots i:nth-child(2){animation-delay:.15s}.typing-dots i:nth-child(3){animation-delay:.3s}

/* campo fixo embaixo */
.composer{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:18px 24px 22px;background:linear-gradient(180deg,rgba(247,249,252,0),var(--bg) 38%)}
.composer .ask{border:1px solid var(--bd);box-shadow:0 18px 44px -20px rgba(16,24,38,.3)}
.composer .disc{text-align:center;font-size:12px;color:var(--tx-3);margin-top:10px}
.composer .disc a{color:var(--tx-2);text-decoration:underline}

@media (max-width:680px){
  .chat-top .in{padding:14px 16px}
  .chat-main{padding:0 16px 190px}
  .chat-intro{padding:9vh 0 24px;text-align:left}
  .chat-intro .opts{justify-content:flex-start}
  .chat-field{height:160px;border-radius:28px;margin-top:40px}
  .q-bub{max-width:88%}
  .c-steps{grid-template-columns:1fr 1fr}
  .composer{padding:14px 12px 16px}
}