/* Trilion — botão flutuante de WhatsApp do site (fora de /signature/, que tem o seu próprio).
   Mesmo gesto da Signature: círculo, cartão creme que "amanhece" a partir do botão, uma só pergunta (nome).
   Aqui o círculo é branco com o ícone preto, porque o fundo do site é preto; cartão e detalhes seguem o bege e o dourado da Signature.
   Tudo com prefixo tw- e especificidade própria, para não colidir com o CSS do site. */

.tw{--tw-onyx:#1A1612;--tw-cream:#F7F2E8;--tw-ink:#1A1612;--tw-ink2:#5E5546;--tw-bronze:#8B7339;--tw-gold:#C9A84C;--tw-gold-l:#E4D4A0;--tw-out:cubic-bezier(.16,1,.3,1);
  --tw-body:"Inter","Helvetica Neue",Arial,sans-serif;--tw-disp:"Fraunces",Georgia,"Times New Roman",serif}

/* ---------- botão ---------- */
.tw .tw-btn{position:fixed;z-index:9990;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));
  display:inline-flex;flex-direction:row-reverse;align-items:center;height:54px;min-width:54px;padding:0;margin:0;border:0;border-radius:27px;
  background:#fff;color:#000;box-shadow:0 0 0 1px rgba(201,168,76,.55),0 10px 30px -10px rgba(0,0,0,.7);
  font:500 12px/1 var(--tw-body);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;cursor:pointer;
  opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .8s var(--tw-out),box-shadow .25s}
.tw.is-in .tw-btn{opacity:1;transform:none}
.tw .tw-btn:hover{box-shadow:0 0 0 1px var(--tw-gold),0 14px 34px -10px rgba(0,0,0,.75)}
.tw .tw-btn:focus-visible{outline:2px solid var(--tw-gold);outline-offset:3px}
.tw .tw-btn:active{transform:scale(.97)}
.tw .tw-ico{flex:none;display:grid;place-items:center;width:54px;height:54px}
.tw .tw-ico svg{width:26px;height:26px;fill:#000}
.tw .tw-lab{display:block;overflow:hidden;max-width:0;opacity:0;white-space:nowrap;padding:0;margin:0;color:#000;transition:max-width .6s var(--tw-out),opacity .4s,margin .6s var(--tw-out)}
.tw.is-hint .tw-lab,.tw .tw-btn:hover .tw-lab,.tw .tw-btn:focus-visible .tw-lab{max-width:220px;opacity:1;margin-left:22px}
/* um único pulso dourado ao entrar (não repete) */
.tw .tw-btn:before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(201,168,76,.55);pointer-events:none}
.tw.is-in .tw-btn:before{animation:tw-pulse 1.8s .9s ease-out 1 both}
@keyframes tw-pulse{0%{box-shadow:0 0 0 0 rgba(201,168,76,.55)}100%{box-shadow:0 0 0 18px rgba(201,168,76,0)}}

/* ---------- cartão ---------- */
html.tw-lock{overflow:hidden}
.tw .tw-dlg{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;
  color:var(--tw-ink);overflow:hidden;overflow:clip;overscroll-behavior:contain;font-family:var(--tw-body);color-scheme:light}
.tw .tw-dlg:not([open]){display:none}
.tw .tw-dlg::backdrop{background:transparent}
.tw .tw-scrim{position:absolute;inset:0;background:rgba(16,13,10,.5)}
.tw .tw-ring{display:none;position:absolute;background:var(--tw-gold);border-radius:6px;pointer-events:none}
.tw .tw-card{position:absolute;right:max(20px,env(safe-area-inset-right));bottom:calc(max(20px,env(safe-area-inset-bottom)) + 70px);
  width:min(384px,calc(100% - 32px));padding:34px 30px 30px;background:var(--tw-cream);border-radius:6px;overflow:hidden;overflow:clip;box-sizing:border-box;text-align:left;
  box-shadow:0 0 0 1px rgba(26,22,18,.06),0 24px 48px -12px rgba(16,13,10,.5),0 60px 120px -30px rgba(16,13,10,.55)}
.tw .tw-x{position:absolute;top:10px;right:10px;width:44px;height:44px;border:0;border-radius:50%;background:none;color:var(--tw-ink2);display:grid;place-items:center;padding:0;margin:0;cursor:pointer;transition:background-color .2s,color .2s}
.tw .tw-x svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.tw .tw-x:hover{background:rgba(26,22,18,.07);color:var(--tw-ink)}
.tw .tw-x:focus-visible,.tw .tw-card input:focus-visible,.tw .tw-go:focus-visible,.tw .tw-card a:focus-visible{outline:2px solid var(--tw-bronze);outline-offset:3px}
.tw .tw-card .tw-kick{display:block;margin:0;font:500 11px/1 var(--tw-body);letter-spacing:.24em;text-transform:uppercase;color:var(--tw-bronze)}
.tw .tw-card h2{font:300 27px/1.1 var(--tw-disp);letter-spacing:0;text-transform:none;margin:12px 0 12px;padding:0 34px 0 0;color:var(--tw-ink);outline:none}
.tw .tw-card h2 em{font-style:italic;color:var(--tw-bronze)}
.tw .tw-card p.tw-ap{margin:0 0 22px;font:400 14.5px/1.55 var(--tw-body);letter-spacing:0;text-transform:none;color:var(--tw-ink2)}
.tw .tw-card label{display:grid;gap:6px;margin:0;font:500 11px/1.2 var(--tw-body);letter-spacing:.2em;text-transform:uppercase;color:var(--tw-bronze)}
.tw .tw-card input{font:300 17px/1.5 var(--tw-body);letter-spacing:0;text-transform:none;color:var(--tw-ink);background:transparent;border:0;border-bottom:1px solid #CDBF9C;border-radius:0;
  padding:9px 0;margin:0;width:100%;height:auto;box-sizing:border-box;box-shadow:none}
.tw .tw-card input::placeholder{color:#9A8F7B;opacity:1}
.tw .tw-card input:focus-visible{outline:none;border-bottom-color:var(--tw-bronze);box-shadow:0 1px 0 var(--tw-bronze)}
.tw .tw-card input[aria-invalid="true"]{border-bottom-color:#A4503A;box-shadow:0 1px 0 #A4503A}
.tw .tw-err{min-height:1.4em;margin:8px 0 14px;font:400 13px/1.4 var(--tw-body);color:#A4503A}
.tw .tw-go{display:flex;align-items:center;justify-content:center;width:100%;margin:2px 0 0;padding:16px 24px;box-sizing:border-box;border:0;border-radius:2px;
  background:var(--tw-onyx);color:var(--tw-gold-l);font:500 12px/1 var(--tw-body);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background-color .25s,color .25s}
.tw .tw-go:hover{background:#2b241c;color:#fff}
.tw .tw-ok[hidden]{display:none}
.tw .tw-ok{outline:none}
.tw .tw-ok .tw-go{margin-top:4px}

@media (max-width:560px){
  /* no topo: o teclado do celular não cobre o formulário */
  .tw .tw-card{inset:100px 12px auto 12px;width:auto;border-radius:16px;padding:30px 22px 26px;box-shadow:0 24px 60px -16px rgba(16,13,10,.6)}
  .tw .tw-card h2{font-size:28px}
  .tw .tw-btn{right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){
  .tw .tw-btn,.tw .tw-lab,.tw .tw-x{transition:none}
  .tw.is-in .tw-btn:before{animation:none}
  .tw .tw-btn{transform:none}
}
@media (forced-colors:active){
  .tw .tw-btn{border:1px solid ButtonText;background:ButtonFace;color:ButtonText;box-shadow:none}
  .tw .tw-card{border:1px solid CanvasText}
}
@media print{.tw{display:none}}
