.mapa-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}
.mapa-chip{padding:.38rem .9rem;border-radius:99px;border:1px solid rgba(255,255,255,.22);background:var(--vidro);color:var(--branco);font-size:.82rem;cursor:pointer;transition:border-color .2s,transform .2s}
.mapa-chip:hover{border-color:rgba(255,255,255,.36);transform:translateY(-2px)}
.mapa-chip.ativo{background:var(--vermelho);border-color:transparent}
.mapa-caixa{position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--vidro-borda);height:420px}
#mapa{position:absolute;inset:0}
.mapa-falhou{padding:3rem;text-align:center;color:var(--cinza-azul)}
.leaflet-container{background:#0a1929;font-family:var(--sans)}
.leaflet-control-attribution{background:rgba(2,19,46,.82)!important;color:#7f97b6!important;font-size:.66rem!important}
.leaflet-control-attribution a{color:#9fb3ce!important}
.leaflet-bar a{background:#062449!important;color:#f6f8fb!important;border-color:rgba(255,255,255,.14)!important}
.leaflet-bar a:hover{background:var(--azul-700)!important}
.pino{width:34px;height:34px;border-radius:50% 50% 50% 0;background:var(--vermelho);border:2.5px solid #fff;display:flex;align-items:center;justify-content:center;transform:rotate(-45deg);box-shadow:0 2px 8px rgba(0,0,0,.5)}
.pino b{transform:rotate(45deg);color:#fff;font-size:.75rem;font-family:var(--sans)}
.pino.vendido{background:rgba(255,255,255,.35)}
.leaflet-popup-content-wrapper{background:#062449;color:var(--branco);border-radius:12px;border:1px solid var(--vidro-borda);box-shadow:0 8px 32px rgba(0,0,0,.5)}
.leaflet-popup-tip{background:#062449}
.leaflet-popup-content{margin:.95rem 1.05rem;font-size:.9rem;line-height:1.45}
.leaflet-popup-close-button{color:var(--cinza-azul)!important}
.pop-bairro{font-size:.75rem;color:var(--cinza-azul);margin:0 0 .25rem}
.pop-tit{font-family:var(--serif);font-size:1.05rem;margin:0 0 .3rem}
.pop-preco{color:var(--vermelho-claro);font-weight:600;margin:0 0 .25rem}
.pop-dados{font-size:.8rem;color:var(--cinza-azul);margin:0 0 .7rem}
.pop-link{display:inline-block;padding:.35rem .85rem;background:var(--vermelho);color:#fff;border-radius:8px;font-size:.82rem;text-decoration:none}
.mapa-obs{margin-top:1rem;font-size:.79rem;color:var(--cinza-azul)}

/* ============================================================
   ASSISTENTE (CHAT)
   ============================================================ */
.chat-abre{
  position:fixed;right:clamp(1rem,3vw,1.9rem);
  bottom:calc(clamp(1rem,3vw,1.9rem) + 4.3rem);z-index:60;
  display:flex;align-items:center;gap:.6rem;cursor:pointer;
  background:var(--azul-800);color:var(--branco);
  border:1px solid var(--vidro-borda);
  padding:.8rem 1.2rem;border-radius:100px;
  font:inherit;font-size:.92rem;font-weight:500;
  box-shadow:0 12px 34px -12px rgba(0,0,0,.75);
  transition:transform .25s ease,border-color .25s ease;
}
.chat-abre:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.34)}
.chat-abre svg{width:1.2rem;height:1.2rem;flex-shrink:0}
.chat-abre.escondido{opacity:0;pointer-events:none;transform:translateY(8px)}
@media(max-width:520px){.chat-abre span{display:none}.chat-abre{padding:.92rem;border-radius:50%}}

.chat{
  position:fixed;right:clamp(1rem,3vw,1.9rem);bottom:clamp(1rem,3vw,1.9rem);z-index:80;
  width:min(390px,calc(100vw - 2rem));
  height:min(580px,calc(100dvh - 2rem));
  display:flex;flex-direction:column;
  background:rgba(2,19,46,.97);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  border:1px solid var(--vidro-borda);border-radius:18px;overflow:hidden;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.85);
  opacity:0;transform:translateY(16px) scale(.97);pointer-events:none;
  transition:opacity .3s cubic-bezier(.16,1,.3,1),transform .3s cubic-bezier(.16,1,.3,1);
}
.chat.aberto{opacity:1;transform:none;pointer-events:auto}
.chat-topo{
  display:flex;align-items:center;gap:.85rem;
  padding:1rem 1.1rem;border-bottom:1px solid rgba(255,255,255,.11);
  background:rgba(0,61,165,.16);flex-shrink:0;
}
.chat-selo{
  width:2.3rem;height:2.3rem;border-radius:50%;flex-shrink:0;
  background:var(--vermelho);display:grid;place-items:center;
  font-family:var(--serif);font-size:1.15rem;color:#fff;
}
.chat-topo b{display:block;font-weight:500;font-size:.95rem}
.chat-topo small{display:block;font-size:.76rem;color:var(--cinza-azul)}
.chat-fecha{
  margin-left:auto;background:none;border:none;cursor:pointer;
  color:var(--cinza-azul);font-size:1.5rem;line-height:1;padding:.2rem .4rem;border-radius:8px;
}
.chat-fecha:hover{color:var(--branco);background:rgba(255,255,255,.08)}
.chat-corpo{flex:1;overflow-y:auto;padding:1.1rem;display:flex;flex-direction:column;gap:.75rem;overscroll-behavior:contain}
.chat-bolha{
  max-width:85%;padding:.75rem .95rem;border-radius:14px;
  font-size:.9rem;line-height:1.5;white-space:pre-wrap;
  animation:sobe-bolha .35s cubic-bezier(.16,1,.3,1) both;
}
@keyframes sobe-bolha{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.chat-bolha.bot{background:var(--vidro);border:1px solid var(--vidro-borda);border-bottom-left-radius:4px;align-self:flex-start}
.chat-bolha.eu{background:var(--vermelho);border-bottom-right-radius:4px;align-self:flex-end}
.chat-bolha a{color:#ffd9dd}
.chat-digita{display:flex;gap:.28rem;align-self:flex-start;padding:.85rem .95rem;background:var(--vidro);border:1px solid var(--vidro-borda);border-radius:14px;border-bottom-left-radius:4px}
.chat-digita i{width:.4rem;height:.4rem;border-radius:50%;background:var(--cinza-azul);animation:pisca 1.3s infinite}
.chat-digita i:nth-child(2){animation-delay:.18s}
.chat-digita i:nth-child(3){animation-delay:.36s}
@keyframes pisca{0%,60%,100%{opacity:.28;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.chat-sugestoes{display:flex;flex-wrap:wrap;gap:.45rem;padding:0 1.1rem .9rem;flex-shrink:0}
.chat-sug{
  font:inherit;font-size:.8rem;cursor:pointer;
  background:transparent;border:1px solid rgba(255,255,255,.24);color:var(--branco);
  padding:.42rem .85rem;border-radius:100px;transition:background .2s ease,border-color .2s ease;
}
.chat-sug:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.4)}
.chat-baixo{display:flex;gap:.55rem;padding:.9rem 1.1rem 1.1rem;border-top:1px solid rgba(255,255,255,.11);flex-shrink:0}
.chat-baixo input{
  flex:1;min-width:0;font:inherit;font-size:.9rem;
  background:rgba(2,19,46,.6);border:1px solid var(--vidro-borda);
  color:var(--branco);padding:.7rem .9rem;border-radius:100px;
}
.chat-baixo input:focus{outline:none;border-color:var(--vermelho-claro)}
.chat-baixo input::placeholder{color:#6e83a0}
.chat-envia{
  flex-shrink:0;width:2.6rem;height:2.6rem;border-radius:50%;cursor:pointer;
  background:var(--vermelho);border:none;color:#fff;display:grid;place-items:center;
  transition:background .2s ease,transform .2s ease;
}
.chat-envia:hover{background:var(--vermelho-claro);transform:translateY(-1px)}
.chat-envia svg{width:1.05rem;height:1.05rem}

@media(max-width:900px){
  .ava{grid-template-columns:1fr}
  .ava-resultado{position:static}
}
@media(max-width:560px){
  .ava-dupla{grid-template-columns:1fr}
}

/* ============================================================
   AVISO DE COOKIES (LGPD)
   ============================================================ */
.cookies{
  position:fixed;left:clamp(1rem,3vw,1.9rem);bottom:clamp(1rem,3vw,1.9rem);
  z-index:80;max-width:26rem;width:calc(100% - 2rem);
  background:rgba(6,36,73,.97);border:1px solid var(--vidro-borda);
  border-radius:14px;padding:1.25rem 1.35rem;
  box-shadow:0 18px 48px rgba(0,0,0,.55);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  transform:translateY(140%);opacity:0;pointer-events:none;
  transition:transform .5s cubic-bezier(.16,1,.3,1),opacity .4s ease;
}
.cookies.aberto{transform:translateY(0);opacity:1;pointer-events:auto}
.cookies h4{
  font-family:var(--serif);font-weight:400;font-size:1.15rem;
  margin:0 0 .5rem;letter-spacing:-.01em;
}
.cookies p{font-size:.83rem;line-height:1.5;color:#cbd8e8;margin:0 0 1rem}
.cookies p a{color:var(--vermelho-claro);text-decoration:underline}
.cookies-botoes{display:flex;gap:.6rem;flex-wrap:wrap}
.cookies-botoes button{
  flex:1 1 auto;min-width:7rem;padding:.6rem 1rem;border-radius:99px;
  font-family:var(--sans);font-size:.85rem;cursor:pointer;
  transition:background .2s ease,border-color .2s ease,transform .2s ease;
}
.cookies-botoes button:hover{transform:translateY(-1px)}
.ck-aceita{background:var(--vermelho);border:none;color:#fff;font-weight:500}
.ck-aceita:hover{background:var(--vermelho-claro)}
.ck-recusa{background:transparent;border:1px solid rgba(255,255,255,.25);color:var(--branco)}
.ck-recusa:hover{border-color:rgba(255,255,255,.45)}
.cookies-detalhe{
  margin-top:.9rem;padding-top:.9rem;border-top:1px solid rgba(255,255,255,.1);
  font-size:.76rem;color:var(--cinza-azul);line-height:1.5;
}
.cookies-detalhe b{color:#cbd8e8;font-weight:500}
.ck-link{
  background:none;border:none;color:var(--cinza-azul);font-size:.78rem;
  text-decoration:underline;cursor:pointer;padding:0;margin-top:.7rem;
  font-family:var(--sans);
}
.ck-link:hover{color:var(--branco)}
@media(max-width:560px){
  .cookies{left:.75rem;right:.75rem;bottom:.75rem;width:auto;max-width:none}
}

/* ============================================================
   ABERTURA — cortina + marca
   ============================================================ */
.abertura{
  position:fixed;inset:0;z-index:200;
  background:var(--azul-900);
  display:grid;place-items:center;
  transition:opacity .7s ease,visibility .7s;
}
.abertura::before,.abertura::after{
  content:"";position:absolute;left:0;right:0;height:50.5%;
  background:var(--azul-900);
  transition:transform 1.05s cubic-bezier(.76,0,.24,1);
}
.abertura::before{top:0}
.abertura::after{bottom:0}
.abertura-marca{
  position:relative;z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:1.1rem;
  opacity:0;transform:translateY(14px) scale(.97);
  transition:opacity .8s ease,transform .8s cubic-bezier(.16,1,.3,1);
}
.abertura-marca img{height:clamp(56px,11vw,92px);width:auto}
.abertura-traco{
  width:0;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--azul-700),var(--vermelho));
  transition:width 1.15s cubic-bezier(.16,1,.3,1) .25s;
}
.abertura.entra .abertura-marca{opacity:1;transform:none}
.abertura.entra .abertura-traco{width:min(220px,42vw)}
.abertura.sai::before{transform:translateY(-101%)}
.abertura.sai::after{transform:translateY(101%)}
.abertura.sai .abertura-marca{opacity:0;transform:translateY(-10px) scale(.98);transition-duration:.45s}
.abertura.fim{opacity:0;visibility:hidden}
body.travado{overflow:hidden}

/* ---- título do herói: palavras subindo ---- */
.palavra{display:inline-block;overflow:hidden;vertical-align:bottom}
.palavra i{
  display:inline-block;font-style:normal;
  transform:translateY(105%);
  transition:transform .95s cubic-bezier(.16,1,.3,1);
}
.revelado .palavra i{transform:none}

/* ---- reveal por seção, com escalonamento ---- */
[data-sobe]{
  opacity:0;transform:translateY(34px);
  transition:opacity .85s ease,transform .95s cubic-bezier(.16,1,.3,1);
  transition-delay:var(--atraso,0ms);
}
[data-sobe].visivel{opacity:1;transform:none}

/* ---- camadas de parallax ---- */
[data-lento]{will-change:transform}

/* ---- brilho que corre no card ao entrar ---- */
.card{position:relative;overflow:hidden}
.card::after{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.13) 50%,transparent 62%);
  transform:translateX(-120%);
}
.card.visivel::after{transition:transform 1.25s cubic-bezier(.16,1,.3,1) .28s;transform:translateX(120%)}

/* ---- barra de progresso da leitura ---- */
.progresso{
  position:fixed;top:0;left:0;height:2px;z-index:70;
  width:100%;transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,var(--azul-700),var(--vermelho));
  pointer-events:none;
}

@media(prefers-reduced-motion: reduce){
  .abertura{display:none}
  [data-sobe]{opacity:1;transform:none}
  .palavra i{transform:none}
  .card::after{display:none}
}

/* No cabeçalho não há espaço acima, então o balão desce.
   Também respeita a borda direita da tela para não vazar. */
.nav [data-dica]::after{
  bottom:auto;top:calc(100% + .7rem);
  left:auto;right:0;
  transform:translate(0,-8px);
  max-width:min(17rem,calc(100vw - 2rem));
  white-space:normal;text-align:right;
}
.nav [data-dica]::before{
  bottom:auto;top:calc(100% + .35rem);
  left:auto;right:1.4rem;
  transform:translate(0,-8px) rotate(225deg);
}
.nav [data-dica]:hover::after,.nav [data-dica]:focus-visible::after{transform:translate(0,0)}
.nav [data-dica]:hover::before,.nav [data-dica]:focus-visible::before{transform:translate(0,0) rotate(225deg)}

/* o balão nunca deve cobrir o botão do chat ou o WhatsApp */
.chat-abre[data-dica]::after,.zap[data-dica]::after{white-space:normal;max-width:14rem}

/* ============================================================
   RETRATO DO HERÓI — Gabriel recortado, à direita
   Cabe inteiro dentro da seção de apresentação, sem corte,
   e continua presente no celular como camada de fundo.
   ============================================================ */
.heroi{position:relative;overflow:hidden}
.retrato{
  position:absolute;right:clamp(0rem,1.5vw,3rem);bottom:0;
  height:min(86vh,850px);width:auto;max-width:50vw;object-fit:contain;
  object-position:bottom center;
  z-index:1;pointer-events:none;user-select:none;
  filter:drop-shadow(-26px 18px 44px rgba(0,0,0,.55));
  opacity:0;transform:translateY(46px) scale(.985);
  transition:opacity 1.1s ease .15s,transform 1.25s cubic-bezier(.16,1,.3,1) .15s;
}
.pronto .retrato{opacity:1;transform:none}
/* o painel de texto sempre por cima do retrato */
.heroi .wrap{position:relative;z-index:2}
.heroi .painel{max-width:min(42rem,52vw)}

/* telas largas: sobra espaço, o retrato respira mais */
@media(min-width:1500px){
  .retrato{height:min(88vh,940px);right:clamp(2rem,5vw,7rem)}
}

/* laptop: encolhe e encosta na borda para não brigar com o texto */
@media(max-width:1200px){
  .retrato{height:min(74vh,640px);right:-2.5rem;max-width:46vw;opacity:.94}
  .pronto .retrato{opacity:.94}
  .heroi .painel{max-width:min(38rem,58vw)}
}

/* ---- CELULAR E TABLET ----
   O texto precisa da largura toda, então o retrato vira camada
   de fundo: sai parcialmente pela borda, perde peso e ganha um
   desvanecer na base para se fundir com o fundo da página. */
@media(max-width:900px){
  /* No celular ele passa PARA A FRENTE do painel e atravessa o
     vidro: sólido na borda direita, translúcido onde cruza o
     texto. Duas máscaras se cruzam para chegar nisso. */
  .retrato{
    z-index:3;
    height:min(62vh,520px);max-width:none;
    right:-6%;bottom:0;opacity:.78;
    filter:drop-shadow(-18px 14px 34px rgba(0,0,0,.6)) saturate(1.06);

    -webkit-mask-image:
      linear-gradient(180deg,#000 0%,#000 68%,rgba(0,0,0,.4) 90%,transparent 100%),
      linear-gradient(270deg,#000 0%,#000 38%,rgba(0,0,0,.55) 66%,rgba(0,0,0,.22) 88%,transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:
      linear-gradient(180deg,#000 0%,#000 68%,rgba(0,0,0,.4) 90%,transparent 100%),
      linear-gradient(270deg,#000 0%,#000 38%,rgba(0,0,0,.55) 66%,rgba(0,0,0,.22) 88%,transparent 100%);
    mask-composite:intersect;
  }
  .pronto .retrato{opacity:.78}

  /* o painel recua um pouco para abrir espaço à direita */
  .heroi .painel{max-width:44rem;padding-right:clamp(4.5rem,26vw,9rem)}

  /* brilho por trás, para a silhueta não sumir no fundo escuro */
  .heroi::after{
    content:"";position:absolute;right:0;bottom:0;z-index:0;
    width:76%;height:66%;pointer-events:none;
    background:radial-gradient(70% 80% at 80% 86%,rgba(120,160,210,.18),transparent 72%);
  }
}
@media(max-width:620px){
  .retrato{height:min(56vh,430px);right:-12%;opacity:.72}
  .pronto .retrato{opacity:.72}
  .heroi .painel{padding-right:clamp(3.5rem,22vw,7rem)}
}
@media(max-width:420px){
  .retrato{height:min(50vh,350px);right:-16%;opacity:.68}
  .pronto .retrato{opacity:.68}
  .heroi .painel{padding-right:clamp(2.6rem,19vw,5.5rem)}
}