
body.page-answers{
  --paper:#061631; --paper-2:rgba(255,255,255,0.04);
  --ink:#F4F6FB; --muted:#AEBBD6; --line:rgba(255,255,255,0.12);
  --navy-600:#8DB0F5; --gold-700:#D9A94D;
  background:#030A1C;
}
body.page-answers::before{content:""; position:fixed; inset:0; z-index:-1; background:linear-gradient(rgba(0,0,0,.38), rgba(0,0,0,.38)), url("../assets/images/fundo-liquido.webp") center / cover no-repeat;}
.answers{padding:20px 0 40px;}
.answers-grid{display:grid; grid-template-columns:minmax(0, 0.85fr) minmax(0, 1.15fr); gap:48px; align-items:start;}
.ans-list{list-style:none; margin:0; padding:0; border-top:1px solid var(--line);}
.ans-q{
  display:grid; grid-template-columns:1fr; gap:4px 16px; width:100%; padding:20px 4px; text-align:left; cursor:pointer;
  background:none; border:0; border-bottom:1px solid var(--line); color:var(--ink); font:inherit;
  transition:background-color .3s ease, padding-left .3s ease;
}
.ans-q .cluster{grid-column:1; font-size:.78rem; font-weight:700; color:var(--gold-400); letter-spacing:.04em;}
.ans-q-text{grid-column:1; font-family:'Doppio One', system-ui, sans-serif; font-size:1.12rem; line-height:1.3;}
.ans-card{position:relative;}
.ans-q-go{
  position:absolute; left:-30px; top:50%; display:flex; color:#E6B02B; pointer-events:none;
  opacity:0; transform:translate(-8px, -50%); transition:transform .3s ease, opacity .3s ease;
}
.ans-card .ans-q{position:relative;}
.ans-q-go svg{width:13px; height:18px; fill:currentColor; stroke:currentColor; stroke-width:1.2; stroke-linejoin:round;}
.ans-q:hover, .ans-q.is-active{background:linear-gradient(90deg, rgba(76,141,255,.14), rgba(76,141,255,0)); padding-left:16px;}
.ans-q:hover .ans-q-go, .ans-card.is-open .ans-q-go{opacity:1; transform:translate(0, -50%);}
.ans-q-go svg{transition:transform .45s cubic-bezier(.34,1.56,.64,1);}
.ans-card.is-open .ans-q-go svg{transform:rotate(90deg);}
@media (max-width:720px){
  .ans-q-go{left:-17px;}
  .ans-q-go svg{width:10px; height:14px;}
}
.ans-card{border-bottom:1px solid var(--line); transition:background-color .3s ease;}
.ans-card .ans-q{border-bottom:0;}
.ans-card.is-open{background:linear-gradient(90deg, rgba(76,141,255,.14), rgba(76,141,255,0));}
.ans-card.is-open .ans-q{padding-left:16px; background:none;}
.ans-card.is-open .ans-q-text{color:#FFFFFF;}
.ans-more{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s cubic-bezier(.2,.7,.2,1);}
.ans-card.is-open .ans-more{grid-template-rows:1fr;}
.ans-more-inner{min-height:0; overflow:hidden;}
.ans-more-list{display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:0 16px 18px;}
.ans-sub{
  position:relative; padding:7px 0 7px 18px; text-align:left; cursor:pointer;
  background:none; border:0; color:#AEBBD6; font:inherit; font-size:.95rem; line-height:1.35;
  transition:color .25s ease, transform .25s ease;
}
.ans-sub::before{content:""; position:absolute; left:0; top:50%; width:9px; height:1.5px; background:#E6B02B; opacity:.6; transition:width .25s ease, opacity .25s ease;}
.ans-sub:hover{color:#FFFFFF; transform:translateX(3px);}
.ans-sub:hover::before{opacity:1; width:12px;}
.ans-sub.is-active{color:#E6B02B;}
.ans-sub.is-active::before{opacity:1; width:12px;}
.ans-q.is-active .ans-q-text{color:#FFFFFF;}
.ans-window{
  position:sticky; top:28px; border-radius:14px; overflow:hidden; background:#FFFFFF; color:#1F2937;
  box-shadow:0 30px 80px rgba(0,0,0,.45), 0 0 60px rgba(76,141,255,.2); border:1px solid rgba(169,194,245,.25);
}
.ans-window-bar{display:flex; align-items:center; gap:14px; padding:11px 14px; background:linear-gradient(#222B40, #182035);}
.ans-window-url{flex:1; min-width:0; padding:4px 12px; border-radius:999px; background:rgba(255,255,255,.07); color:#AEBBD6;
  font-family:'IBM Plex Mono', monospace; font-size:.74rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ans-page{position:relative; min-height:520px; padding:22px 28px 30px; font-family:Arial, "Helvetica Neue", sans-serif;}
.ans-search{position:relative; display:grid; grid-template-columns:auto 1fr; align-items:center; gap:14px 18px; padding-bottom:12px; border-bottom:1px solid #E5E7EB;}
.ans-search-logo{height:14px; width:auto;}
.ans-search-bar{
  position:relative; display:flex; align-items:center; gap:10px; min-height:44px; padding:0 18px; border-radius:999px;
  border:1px solid #DFE1E5; box-shadow:0 1px 6px rgba(32,33,36,.18); font-size:.95rem; color:#202124; overflow:hidden;
}
.ans-search-bar svg{flex:none; width:18px; height:18px; fill:none; stroke:#5F6368; stroke-width:2; stroke-linecap:round;}
.ans-query{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ans-caret{flex:none; width:1.5px; height:20px; background:#1B4DA6; margin-left:-8px; animation:ans-blink 1s steps(1) infinite;}
.ans-placeholder{position:absolute; left:46px; color:#70757A; pointer-events:none;}
.ans-window.has-query .ans-placeholder{display:none;}
.ans-tabs{grid-column:2; display:flex; gap:22px; font-size:.82rem; color:#5F6368;}
.ans-tabs span{padding-bottom:8px; margin-bottom:-13px;}
.ans-tabs .is-on{color:#1B4DA6; border-bottom:3px solid #1B4DA6;}
.ans-loading{position:absolute; left:0; bottom:-1px; height:2px; width:0; background:linear-gradient(90deg, #FFC64D, #4C8DFF);}
.ans-window.is-loading .ans-loading{animation:ans-load .55s ease-out forwards;}
.ans-meta{margin:14px 0 6px; font-size:.78rem; color:#70757A; opacity:0; transition:opacity .3s ease;}
.ans-window.has-answer .ans-meta{opacity:1;}
.ans-result{display:none; padding:18px 20px 20px; margin-top:6px; border:1px solid #E5E7EB; border-radius:12px;}
.ans-result.is-open{display:block; animation:ans-in .45s cubic-bezier(.2,.7,.2,1);}
.ans-source{display:flex; align-items:center; gap:10px; font-size:.82rem; color:#202124;}
.ans-source small{display:block; color:#4D5156; font-size:.75rem;}
.ans-favicon{display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#0A1F3D; color:#FFC64D; font-family:'Doppio One', system-ui, sans-serif; font-size:.85rem;}
.ans-result h2{margin:10px 0 0; font-family:Arial, "Helvetica Neue", sans-serif; font-size:1.25rem; font-weight:400; color:#1A0DAB; letter-spacing:0; line-height:1.3;}
.ans-lead{margin:10px 0 0; font-size:.95rem; line-height:1.6; color:#202124;}
.ans-result ul{margin:12px 0 0; padding-left:20px; font-size:.9rem; line-height:1.55; color:#3C4043;}
.ans-result li{margin-bottom:5px;}
.ans-close{margin:12px 0 0; font-size:.9rem; color:#3C4043; font-style:italic;}
.ans-text{margin:10px 0 0; font-size:.9rem; line-height:1.6; color:#3C4043;}
.ans-result code{padding:1px 5px; border-radius:4px; background:#F1F3F4; font-family:'IBM Plex Mono', monospace; font-size:.85em; color:#202124; white-space:nowrap;}
.ans-link{display:inline-block; margin-top:14px; font-size:.88rem; font-weight:700; color:#1B4DA6;}
.ans-link::after{content:" →";}
.ans-link:hover{text-decoration:underline; text-underline-offset:3px;}
.ans-related{display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; padding-top:14px; border-top:1px solid #E5E7EB;}
.ans-related > span{width:100%; font-size:.78rem; color:#70757A;}
.ans-related-q{padding:7px 14px; border-radius:999px; border:1px solid #DADCE0; background:#F8F9FA; color:#202124; font:inherit; font-size:.82rem; cursor:pointer; text-align:left;}
.ans-related-q:hover{background:#EEF3FD; border-color:#A9C2F5;}
.ans-empty{position:absolute; inset:150px 28px 30px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:#70757A; text-align:center;}
.ans-empty svg{width:42px; height:42px; fill:none; stroke:#C7CCD4; stroke-width:1.6; stroke-linecap:round;}
.ans-empty p{margin:0; font-size:.92rem;}
.ans-window.has-query .ans-empty{display:none;}
@media (max-width:960px){
  .answers-grid{grid-template-columns:1fr; gap:28px;}
  .ans-window{position:relative; top:auto;}
  .ans-page{padding:18px 16px 24px; min-height:420px;}
  .ans-search{grid-template-columns:1fr;}
  .ans-tabs{grid-column:1;}
  .ans-empty{inset:170px 16px 24px;}
}
@keyframes ans-blink{50%{opacity:0;}}
@keyframes ans-load{from{width:0; opacity:1;} 80%{width:100%; opacity:1;} to{width:100%; opacity:0;}}
@keyframes ans-in{from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;}}
