/* ===== ACRC Imóveis — identidade navy + laranja ===== */
:root{
  --navy-900:#081334;
  --navy-800:#0c1c44;
  --navy-700:#142a5e;
  --navy-600:#1d3a78;
  --orange:#f5821f;
  --orange-600:#e3700f;
  --orange-050:#fdf0e0;
  --cream:#faf7f1;
  --sand:#f1ebe0;
  --white:#ffffff;
  --ink:#16203a;
  --muted:#5d6678;
  --muted-2:#6b7280;
  --line:#e7e1d6;
  --line-2:#dcd5c8;
  --shadow-sm:0 1px 2px rgba(12,28,68,.06), 0 2px 8px rgba(12,28,68,.05);
  --shadow-md:0 8px 30px rgba(12,28,68,.10);
  --shadow-lg:0 22px 60px rgba(8,19,52,.22);
  --r-sm:8px; --r-md:14px; --r-lg:22px; --r-xl:30px;
  --maxw:1240px;
  --font-display:"Bricolage Grotesque", "Plus Jakarta Sans", system-ui, sans-serif;
  --font-sans:"Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
/* Acessibilidade: foco visível por teclado (não aparece em clique de mouse) */
:focus-visible{outline:2px solid var(--orange); outline-offset:2px; border-radius:3px;}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} *{animation-duration:.001ms !important; transition-duration:.001ms !important;} }
body{
  margin:0; background:var(--cream); color:var(--ink);
  font-family:var(--font-sans); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img{display:block; max-width:100%;}
a{color:inherit; text-decoration:none;}
button{font-family:inherit; cursor:pointer;}
h1,h2,h3,h4{margin:0; font-family:var(--font-display); font-weight:700; line-height:1.06; letter-spacing:-.02em;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}

/* ---------- Buttons ---------- */
.btn{display:inline-flex; align-items:center; gap:9px; font-weight:600; font-size:15px;
  padding:13px 22px; border-radius:999px; border:1.5px solid transparent; transition:.2s ease; white-space:nowrap;}
.btn svg{width:18px; height:18px;}
.btn-orange{background:var(--orange); color:#fff;}
.btn-orange:hover{background:var(--orange-600); transform:translateY(-2px); box-shadow:0 10px 24px rgba(245,130,31,.35);}
.btn-navy{background:var(--navy-800); color:#fff;}
.btn-navy:hover{background:var(--navy-700); transform:translateY(-2px);}
.btn-blue{background:#1f4dff; color:#fff;}
.btn-blue:hover{background:#1a3fd6; transform:translateY(-2px); box-shadow:0 10px 24px rgba(31,77,255,.35);}
.btn-ghost{background:transparent; color:var(--navy-800); border-color:var(--line-2);}
.btn-ghost:hover{border-color:var(--navy-800); background:#fff;}
.btn-white{background:#fff; color:var(--navy-800);}
.btn-white:hover{transform:translateY(-2px); box-shadow:var(--shadow-md);}
.btn-block{width:100%; justify-content:center;}

.kicker{display:inline-flex; align-items:center; gap:8px; font-family:var(--font-sans);
  font-weight:600; font-size:12.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--orange-600);}
.kicker::before{content:""; width:26px; height:2px; background:var(--orange); display:inline-block;}

/* ---------- Header ---------- */
.site-header{position:sticky; top:0; z-index:60; background:var(--navy-800);
  border-bottom:1px solid rgba(255,255,255,.08); transition:background .3s, box-shadow .3s;}
.site-header.scrolled{background:rgba(8,19,52,.92); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 6px 24px rgba(8,19,52,.25);}
.header-inner{display:flex; align-items:center; justify-content:space-between; height:58px; gap:24px;}
.brand-logo{height:34px; width:auto;}
.main-nav{display:flex; gap:30px; margin-left:38px; margin-right:auto;}
.nav-cta-group{display:none;}   /* só aparece quando o header esconde os botões (≤920px) */
.main-nav a{color:rgba(255,255,255,.82); font-weight:500; font-size:15px; position:relative; padding:6px 0;}
.main-nav a:hover{color:#fff;}
.main-nav a::after{content:""; position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--orange); transition:width .25s;}
.main-nav a:hover::after{width:100%;}
.header-cta{display:flex; align-items:center; gap:16px;}
.header-client{display:inline-flex; align-items:center; gap:7px; border:1.5px solid rgba(255,255,255,.38);
  color:#fff; padding:9px 16px; border-radius:999px; font-weight:600; font-size:14px; transition:.18s; white-space:nowrap;}
.header-client:hover{background:#fff; color:var(--navy-800); border-color:#fff;}
.header-phone{display:flex; flex-direction:column; line-height:1.15; text-align:right;}
.header-phone-label{font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--orange);}
.header-phone-num{font-size:16px; font-weight:600; color:#fff;}
.nav-toggle{display:none; flex-direction:column; gap:5px; background:none; border:0; padding:8px;}
.nav-toggle span{width:24px; height:2px; background:#fff; transition:.25s;}
@media (max-width:760px){
  .header-inner{height:50px;}
  .brand-logo{height:26px;}
}

/* ---------- Hero ---------- */
/* ocupa a tela inteira do navegador (menos a altura do header sticky), de forma
   responsiva — mobile e web — usando dvh p/ não sobrar/faltar por causa da barra
   de endereço do navegador mobile. */
.hero{position:relative; min-height:calc(100vh - 59px); min-height:calc(100dvh - 59px); display:flex; align-items:center;
  background:var(--navy-900); color:#fff;}
/* o vídeo/imagem de fundo (escalado 1.04x pra não deixar borda) precisa do próprio
   recorte — isolado do resto do hero, senão os menus da busca (que passam da borda
   do hero) ficavam cortados junto com o fundo */
.hero-media{position:absolute; inset:0; z-index:0; overflow:hidden;}
.hero-bg{position:absolute; inset:0; background-size:cover; background-position:center; transform:scale(1.04);}
.hero-video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.hero-slide{position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1.2s ease;}
.hero-slide.on{opacity:1;}
.hero-overlay{position:absolute; inset:0;
  background:linear-gradient(105deg, rgba(8,19,52,.93) 0%, rgba(8,19,52,.78) 42%, rgba(8,19,52,.45) 100%);}
.hero-inner{position:relative; z-index:2; padding-top:72px; padding-bottom:84px; width:100%;}
.hero-eyebrow{color:var(--orange);}
.hero h1{font-size:clamp(2.5rem,5.2vw,4.4rem); font-weight:600; max-width:26ch; text-wrap:balance; margin:18px 0 0;}
.hero h1 em{font-style:normal; color:var(--orange); font-weight:800;}
.hero-sub{font-size:clamp(1rem,1.5vw,1.18rem); color:rgba(255,255,255,.82); max-width:46ch; margin:20px 0 0;}

/* search card */
/* Busca branca e sólida. A versão translúcida deixava o vídeo do fundo passar
   por trás do texto: bonito parado, ilegível quando a cena do fundo mudava. */
.search-card{margin:36px auto 0; color:var(--ink);
  background:#fff; border:1px solid var(--line);
  border-radius:var(--r-lg); padding:20px 28px 22px; box-shadow:0 26px 64px rgba(8,19,52,.42); max-width:1000px;}
.search-card .fl-multi-field,
.search-card .sfield input, .search-card .sfield select,
.search-card .sfield-price .price-inline{background:#fff; border-color:var(--line-2, #d5cec1);}
.search-card .fl-multi-field.open, .search-card .fl-multi-field:focus-within{background:#fff; border-color:var(--orange);}
.search-card .sfield input:focus, .search-card .sfield select:focus{background:#fff;}
.search-card .fl-multi-field .multi-trigger svg{color:var(--navy-800);}
.search-card .price-inline .pf-cap-inline{color:var(--navy-800); opacity:.75;}
/* Abas Clássico/AI acima do card de busca — mesmo visual de pílula em vidro
   fosco usado no restante do site (loc-tabs), só que flutuando sobre o hero. */
.search-mode-tabs{display:flex; gap:4px; margin:36px auto -14px; padding:4px; width:max-content;
  background:rgba(255,255,255,.16); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.35); border-radius:999px; position:relative; z-index:1;}
.search-mode-tab{padding:8px 18px; border:0; border-radius:999px; background:none; cursor:pointer;
  font-family:inherit; font-size:13.5px; font-weight:700; color:#fff; opacity:.75; display:flex; align-items:center; gap:6px; transition:.15s;}
.search-mode-tab.active{background:#fff; color:var(--navy-800); opacity:1; box-shadow:var(--shadow-sm);}
.search-ai-card{padding-top:26px;}
.search-ai-label{display:block; font-size:17px; font-weight:800; color:var(--navy-800); margin-bottom:2px;}
.search-ai-hint{margin:0 0 16px; color:var(--muted); font-size:13.5px;}
.search-ai-row{display:flex; gap:16px; align-items:stretch; margin-bottom:16px;}
.search-ai-field{position:relative; flex:1;}
.search-ai-field textarea{width:100%; min-height:96px; padding:14px 16px; font-family:inherit; font-size:15px;
  color:var(--ink); border:1.5px solid var(--line-2, #d5cec1); border-radius:var(--r-md); resize:vertical; outline:none; box-sizing:border-box;}
.search-ai-field textarea:focus{border-color:var(--orange);}
.search-ai-count{position:absolute; right:12px; bottom:10px; font-size:11.5px; color:var(--muted-2);}
.search-ai-mic{flex:0 0 auto; width:88px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  border:1.5px solid var(--line-2, #d5cec1); border-radius:var(--r-md); background:var(--cream); color:var(--navy-800);
  font-family:inherit; font-size:12px; font-weight:600; cursor:pointer; transition:.15s;}
.search-ai-mic:hover{border-color:var(--orange);}
.search-ai-mic.ouvindo{background:var(--orange); color:#fff; border-color:var(--orange); animation:aiMicPulse 1.1s infinite;}
.search-ai-mic:disabled{opacity:.4; cursor:not-allowed;}
@keyframes aiMicPulse{0%,100%{box-shadow:0 0 0 0 rgba(245,130,31,.4);} 50%{box-shadow:0 0 0 8px rgba(245,130,31,0);}}
.search-ai-go{width:100%;}
.search-ai-spin{display:inline-block; vertical-align:-3px; margin-right:2px;
  width:16px; height:16px; border:2px solid rgba(255,255,255,.35); border-top-color:#fff;
  border-radius:50%; animation:ssSpin .7s linear infinite;}
.search-ai-msg{margin:10px 0 0; font-size:13.5px; text-align:center; color:#1f7a4d;}
.search-ai-msg.erro{color:#b03a2e;}
@media (max-width:640px){
  .search-ai-row{flex-direction:column;}
  .search-ai-mic{width:100%; flex-direction:row; padding:10px;}
}

.search-cats{display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-bottom:18px;}
.scat{display:inline-flex; align-items:center; gap:6px; padding:7px 14px; border-radius:99px;
  border:1.5px solid var(--line); background:var(--cream); color:var(--navy-800); font-size:13.5px;
  font-family:inherit; font-weight:500; cursor:pointer; transition:all .15s; white-space:nowrap;}
.scat svg{width:15px; height:15px; flex-shrink:0;}
.scat:hover{border-color:var(--orange); color:var(--orange);}
.scat.active{border-color:var(--orange); background:var(--orange); color:#fff;}
.search-row{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:14px;}
.sfield{position:relative; display:block;}
.sfield input, .sfield select{width:100%; height:50px; border:1px solid var(--line);
  border-radius:var(--r-md); background:var(--cream); padding:0 16px; font-family:inherit;
  font-size:15px; color:var(--ink); font-weight:500; outline:none; transition:.18s;
  appearance:none; -webkit-appearance:none;}
.sfield input::placeholder{color:var(--muted-2); font-weight:400;}
.sfield select{cursor:pointer; padding-right:40px;}
.sfield input:focus, .sfield select:focus{border-color:var(--orange); background:#fff;}
.sfield select:disabled{opacity:.6; cursor:not-allowed; color:var(--muted-2);}
.sfield.sel::after{content:""; position:absolute; right:18px; top:50%; width:8px; height:8px;
  border-right:2px solid var(--muted); border-bottom:2px solid var(--muted);
  transform:translateY(-70%) rotate(45deg); pointer-events:none;}
.search-pills-row{display:flex; gap:48px; flex-wrap:wrap; margin:8px 0 20px;}
.pill-group{display:flex; flex-direction:column; gap:11px;}
.pill-label{display:flex; align-items:center; gap:7px; font-size:13.5px; font-weight:600; color:var(--navy-700);}
.pill-label svg{width:17px; height:17px; color:var(--orange);}
.pills{display:flex; gap:8px;}
.pills button{width:42px; height:42px; border-radius:50%; border:1.5px solid var(--line-2);
  background:#fff; font-weight:600; font-size:14px; color:var(--navy-700); transition:.15s;}
.pills button:hover{border-color:var(--orange); color:var(--orange-600);}
.pills button.active{background:var(--navy-800); border-color:var(--navy-800); color:#fff;}
.search-submit{display:flex; justify-content:center;}
.search-submit .btn{padding:15px 50px; font-size:15px; letter-spacing:.06em; text-transform:uppercase;}

/* ---------- Carrossel de banners ---------- */
.promo{padding:48px 0 56px;}
.carousel{position:relative; border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-md); background:var(--navy-800);}
.carousel-track{display:flex; transition:transform .55s cubic-bezier(.4,0,.2,1);}
.slide{flex:0 0 100%; display:block; line-height:0;}
.slide img{width:100%; height:auto; display:block;}
.car-nav{position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%;
  background:rgba(255,255,255,.88); border:0; display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-sm); z-index:2; transition:.18s;}
.car-nav:hover{background:#fff; transform:translateY(-50%) scale(1.06);}
.car-nav svg{width:20px; height:20px; color:var(--navy-800);}
.car-nav.prev{left:16px;} .car-nav.next{right:16px;}
.car-dots{position:absolute; bottom:14px; left:50%; transform:translateX(-50%); display:flex; gap:8px; z-index:2;}
.car-dots button{width:9px; height:9px; border-radius:50%; border:0; background:rgba(255,255,255,.55); padding:0; cursor:pointer; transition:.2s;}
.car-dots button.active{background:#fff; width:26px; border-radius:5px;}

/* ---------- Sections ---------- */
section{padding:52px 0;}
.section-head{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:34px;}
.section-head h2{font-size:clamp(1.9rem,3.2vw,2.7rem); color:var(--navy-800); margin-top:12px;}
.section-head p{color:var(--muted); margin:8px 0 0; max-width:52ch;}

/* stats strip */
.stats{background:var(--navy-800); color:#fff; padding:46px 0;}
.stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:center;}
.stat .num{font-family:var(--font-display); font-size:clamp(2rem,4vw,3rem); font-weight:600; color:var(--orange);}
.stat .lbl{color:rgba(255,255,255,.78); font-size:14px; margin-top:4px;}

/* city chips */
.city-band{padding:0 0 8px;}
.chips{display:flex; flex-wrap:wrap; gap:10px;}
.chip{background:#fff; border:1px solid var(--line); border-radius:999px; padding:9px 18px;
  font-weight:500; font-size:14px; color:var(--navy-700); transition:.18s;}
.chip:hover{border-color:var(--orange); color:var(--orange-600); transform:translateY(-1px);}
.chip .c{color:var(--muted-2); font-weight:600;}

/* ---------- Property grid + card ---------- */
.cards{display:grid; grid-template-columns:repeat(auto-fill, minmax(290px,1fr)); gap:26px;}
.card{background:#fff; border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-sm);
  border:1px solid var(--line); transition:transform .25s, box-shadow .25s; display:flex; flex-direction:column;}
.card:hover{transform:translateY(-6px); box-shadow:var(--shadow-md);}
/* 16/11 no lugar de 4/3: a foto domina a altura do card, e alguns graus a menos
   nela encurtam a grade toda sem apertar o texto. */
.card-media{position:relative; aspect-ratio:16/11; overflow:hidden; background:var(--sand); cursor:pointer;}
.card-track{display:flex; height:100%; transition:transform .4s cubic-bezier(.4,0,.2,1);}
.card-slide{flex:0 0 100%; width:100%; height:100%; object-fit:cover; display:block;}
.card-arrow{position:absolute; top:50%; transform:translateY(-50%); width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,.92); border:0; display:flex; align-items:center; justify-content:center;
  cursor:pointer; opacity:0; transition:opacity .2s, background .2s; z-index:4;}
.card-arrow svg{width:18px; height:18px; color:var(--navy-800);}
.card-arrow:hover{background:#fff;}
.card-arrow.prev{left:10px;} .card-arrow.next{right:10px;}
.card-media:hover .card-arrow{opacity:1;}
.card-dots{position:absolute; bottom:12px; left:50%; transform:translateX(-50%); display:flex; gap:5px; z-index:4;}
.card-dots span{width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.6); transition:.2s;}
.card-dots span.active{background:#fff; width:16px; border-radius:3px;}
/* Tipo, finalidade e etiquetas ficam no corpo do card (fileira própria, entre o
   tipo e o endereço). "Novo" volta pra cima da foto (canto superior direito) —
   é o único selo que precisa chamar atenção de cara; Destaque não vira badge de
   texto (o card já ganha borda/glow própria via .card-featured, seria redundante). */
.card-tags-row{display:flex; flex-wrap:wrap; gap:6px; margin:6px 0 0;}
.card-badge{background:var(--orange); color:#fff; font-size:10.5px; font-weight:700; letter-spacing:.02em;
  text-transform:uppercase; padding:4px 9px; border-radius:999px; box-shadow:0 2px 8px rgba(245,130,31,.35);}
/* Código do imóvel no canto superior esquerdo da foto: é por ele que corretor e
   cliente se referem ao imóvel no telefone, e antes só aparecia abrindo o anúncio.
   Canto livre — "Novo" fica à direita, carrinho e contador de fotos embaixo. */
.card-code{position:absolute; top:12px; left:12px; z-index:4; background:rgba(8,19,52,.72);
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); color:#fff;
  font-size:11px; font-weight:700; letter-spacing:.04em; padding:4px 9px; border-radius:6px;
  font-variant-numeric:tabular-nums; pointer-events:none;}
.card-novo-badge{position:absolute; top:12px; right:12px; z-index:4; background:var(--orange); color:#fff;
  font-size:10.5px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; padding:4px 9px;
  border-radius:999px; box-shadow:0 2px 8px rgba(245,130,31,.35);}
/* Selo de destaque: menor que o "Novo" e no mesmo canto, na cor da borda azul
   do card em destaque. Quando o imóvel é novo E destaque, desce para a linha de
   baixo em vez de sobrepor. */
.card-destaque-badge{position:absolute; top:12px; right:12px; z-index:4; background:#1f4dff; color:#fff;
  font-size:9px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; padding:3px 8px;
  border-radius:999px; box-shadow:0 2px 8px rgba(31,77,255,.4);}
.card-destaque-badge.abaixo-do-novo{top:38px;}
.card-photos{position:absolute; bottom:12px; right:12px; background:rgba(8,19,52,.7); color:#fff;
  font-size:12px; font-weight:700; padding:4px 9px; border-radius:999px; display:flex; align-items:center; gap:5px;
  font-variant-numeric:tabular-nums;}
.tour-embed{position:relative; width:100%; aspect-ratio:16/9; border-radius:14px; overflow:hidden; background:#000;}
.tour-embed iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}

/* ---------- Pílulas de filtro da home (card + Aplicar, estilo Zillow) ---------- */
.pdd-row{display:flex; flex-wrap:wrap; align-items:center; gap:9px;}
/* pílulas de filtro ficam agrupadas à esquerda; "Mais filtros"+"Buscar" ancoram
   à direita — sem isso, sobrava um vão vazio à direita quando os filtros não
   preenchiam a largura toda do card. */
.pdd-row .pdd-more{margin-left:auto;}
.pdd{position:relative;}
.pdd-trig{display:inline-flex; align-items:center; gap:7px; height:46px; padding:0 15px;
  border-radius:999px; border:1.5px solid var(--line-2, #d5cec1); background:#fff;
  color:var(--navy-800); font-family:inherit; font-size:14.5px; font-weight:600; cursor:pointer;
  white-space:nowrap; transition:background .15s, border-color .15s, box-shadow .15s;}
.pdd-trig:hover{background:var(--sand, #f8f7f4);}
.pdd.open .pdd-trig{background:#fff; border-color:var(--orange); box-shadow:0 0 0 3px rgba(245,130,31,.16);}
.pdd.has-value .pdd-trig{background:#fff; border-color:var(--orange); color:var(--orange-600);}
.pdd-chev{flex:none; transition:transform .18s;}
.pdd.open .pdd-chev{transform:rotate(180deg);}
.pdd-pop{position:absolute; top:calc(100% + 9px); left:0; z-index:40; width:min(330px,86vw);
  background:#fff; border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:0 22px 60px rgba(8,19,52,.26); overflow:hidden;
  animation:pddIn .16s cubic-bezier(.2,.7,.3,1) both;}
.pdd-wide .pdd-pop{width:min(430px,92vw);}
.pdd-body{padding:14px 16px; max-height:min(56vh,420px); overflow-y:auto;}




@keyframes pddIn{from{opacity:0; transform:translateY(-6px);} to{opacity:1; transform:none;}}

/* listas dentro das pílulas */
.pdd .opt-list{display:flex; flex-direction:column; gap:1px;}
.pdd .opt-item{display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%;
  padding:10px 11px; border:0; border-radius:9px; background:none; cursor:pointer;
  font-family:inherit; font-size:14.5px; color:var(--navy-800); text-align:left;}
.pdd .opt-item:hover{background:var(--cream);}
.pdd .opt-item.sel{background:var(--orange-050); color:var(--orange-600); font-weight:700;}
.pdd .opt-item em{font-style:normal; font-size:12px; color:var(--muted-2); font-weight:500;}
.pdd .multi-opt{display:flex; align-items:center; gap:9px; padding:8px 11px; border-radius:9px;
  cursor:pointer; font-size:14.5px; color:var(--navy-800);}
.pdd .multi-opt:hover{background:var(--cream);}
.pdd .multi-opt:has(input:checked){background:var(--orange-050); color:var(--orange-600); font-weight:700;}
.pdd .multi-opt span{flex:1;}
.pdd .multi-opt em{font-style:normal; font-size:12px; color:var(--muted-2);}
.pdd .multi-empty{padding:14px 11px; color:var(--muted); font-size:14px;}

/* localização em dois níveis */
.loc-tabs{display:flex; gap:5px; padding:3px; margin-bottom:11px; background:var(--sand); border-radius:999px;}
/* contagem de bairros da região: informação de apoio, não compete com o nome */
.loc-regiao-n{margin-left:6px; font-style:normal; font-size:12px; font-weight:600; color:var(--muted-2);}
.loc-tab{flex:1; padding:8px 12px; border:0; border-radius:999px; background:none; cursor:pointer;
  font-family:inherit; font-size:13.5px; font-weight:600; color:var(--muted); transition:.15s;}
.loc-tab.active{background:#fff; color:var(--navy-800); box-shadow:var(--shadow-sm);}
/* [hidden] sozinho (especificidade 0,1,0) perde pra ".pdd .opt-list{display:flex}"
   (0,2,0) — a aba escondida ficava visível por baixo da outra. Precisa de mais
   especificidade que qualquer display: das duas abas pra realmente sumir. */
.pdd .loc-pane[hidden]{display:none;}

/* histograma de preço alinhado ao slider */
.ph-bars{display:flex; align-items:flex-end; gap:2px; height:62px; margin:2px 0 6px; padding:0 6px;}
.ph-bars span{flex:1; min-width:0; background:var(--navy-600); opacity:.28; border-radius:2px 2px 0 0;}

@media (max-width:760px){
  .pdd-row{gap:7px;}
  .pdd{flex:1 1 calc(50% - 4px);}
  .pdd-trig{width:100%; height:44px; justify-content:space-between; font-size:14px; padding:0 13px;}
  .pdd-pop{left:0; right:auto; width:min(340px,92vw);}
  .pdd-wide .pdd-pop{width:min(340px,92vw);}
  .pdd:nth-of-type(even) .pdd-pop{left:auto; right:0;}
  .pdd-row .pdd-more{flex:1 1 calc(50% - 4px); margin-left:0;}
  .pdd-row .pdd-go{flex:1 1 100%;}
  .ph-bars{height:52px;}
}

/* ---------- Overlay do imóvel sobre os resultados ---------- */
.dov{position:fixed; inset:0; z-index:100; display:flex; align-items:flex-start; justify-content:center;}
.dov-backdrop{position:absolute; inset:0; background:rgba(8,19,52,.55);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); animation:dovFade .18s ease both;}
.dov-panel{position:relative; z-index:1; display:flex; flex-direction:column;
  width:min(1200px,96vw); max-height:94vh; margin:3vh 0; background:var(--cream);
  border-radius:var(--r-lg); overflow-y:auto; overscroll-behavior:contain;
  box-shadow:0 30px 90px rgba(8,19,52,.45); animation:dovIn .22s cubic-bezier(.2,.7,.3,1) both;}
/* fundo travado sem perder a posição de rolagem da busca */
body.dov-open{position:fixed; left:0; right:0; width:100%; overflow:hidden;}
body.dov-open .compare-bar{display:none;}
body.dov-open .agent-fab{z-index:105;}
body.dov-open .side-backdrop{z-index:130;}
body.dov-open .side-panel{z-index:131;}
/* dentro do overlay o detalhe já tem margem própria do painel */
.dov-body .detail{padding-top:6px;}
@keyframes dovFade{from{opacity:0;} to{opacity:1;}}
@keyframes dovIn{from{opacity:0; transform:translateY(22px) scale(.985);} to{opacity:1; transform:none;}}
@media (prefers-reduced-motion:reduce){ .dov-backdrop, .dov-panel{animation:none;} }
@media (max-width:760px){
  .dov-panel{width:100vw; max-height:100vh; height:100dvh; margin:0; border-radius:0;}
  .dov-close{top:10px; margin:10px 10px -44px 0;}
}

/* ---------- Esqueleto do primeiro paint ---------- */
.boot-skeleton{background:var(--navy-900);}
.bs-hero{max-width:var(--maxw); margin:0 auto; padding:76px 24px 88px;}
.bs-line, .bs-card{background:linear-gradient(90deg, rgba(255,255,255,.07) 25%,
  rgba(255,255,255,.15) 37%, rgba(255,255,255,.07) 63%);
  background-size:400% 100%; animation:bsShimmer 1.5s ease infinite; border-radius:9px;}
.bs-line{height:17px; margin-bottom:15px;}
.bs-l0{width:min(300px,45%); height:12px; margin-bottom:22px;}
.bs-l1{width:min(560px,78%); height:40px;}
.bs-l2{width:min(400px,58%);}
.bs-card{height:168px; border-radius:22px; margin-top:36px;}
@keyframes bsShimmer{from{background-position:100% 50%;} to{background-position:0 50%;}}
@media (prefers-reduced-motion:reduce){ .bs-line, .bs-card{animation:none;} }
@media (max-width:760px){ .bs-hero{padding:34px 16px 44px;} .bs-card{height:210px;} }

/* ---------- Aviso global (M4) ---------- */
.global-notice{background:var(--orange); color:#fff; text-align:center; font-weight:600;
  font-size:14px; padding:9px 16px; position:relative; z-index:60;}

/* ---------- Manutenção (M4) ---------- */
.maint{min-height:70vh; display:grid; place-items:center; text-align:center; padding:60px 20px;}
.maint img{height:54px; margin-bottom:20px;}
.maint h1{font-family:var(--font-display,"Bricolage Grotesque"); color:var(--navy-800); margin:0 0 10px;}
.maint p{color:var(--muted,#6b7280); margin:0 0 22px;}

/* ---------- Depoimentos (M4) ---------- */
.depo-sec{padding:30px 0;}
.depo-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px;}
.depo-card{background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px; margin:0;}
.depo-stars{color:var(--orange); font-size:15px; letter-spacing:2px; margin-bottom:8px;}
.depo-card blockquote{margin:0 0 12px; font-size:15px; line-height:1.6; color:var(--ink,#1d2430);}
.depo-card figcaption{font-weight:700; color:var(--navy-800);}

/* ---------- Blog (M4) ---------- */
.blog-list{display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:20px; padding:30px 0 60px;}
.blog-card{display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:16px;
  overflow:hidden; text-decoration:none; color:inherit; transition:.18s;}
.blog-card:hover{transform:translateY(-3px); box-shadow:0 12px 30px rgba(12,28,68,.10);}
.blog-card img{width:100%; height:170px; object-fit:cover;}
.blog-card-b{padding:16px 18px;}
.blog-card-b h3{margin:0 0 6px; font-size:1.15rem; color:var(--navy-800);}
.blog-card-b p{margin:0; color:var(--muted,#6b7280); font-size:14px;}
.blog-post{padding:30px 0 60px;}
.blog-post .blog-hero{width:100%; max-height:380px; object-fit:cover; border-radius:18px; margin:16px 0 22px;}
.blog-post h1{font-family:var(--font-display,"Bricolage Grotesque"); color:var(--navy-800); margin:0 0 6px;}
.blog-meta{color:var(--muted,#6b7280); font-size:14px; margin-bottom:20px;}
.blog-body{max-width:720px; font-size:16px; line-height:1.75; color:var(--ink,#1d2430);}
.blog-body p{margin:0 0 16px;}

/* ---------- Favoritos / coração (M7) ---------- */
.card-fav{position:absolute; bottom:12px; left:12px; width:36px; height:36px; border-radius:50%;
  background:rgba(255,255,255,.92); border:0; display:grid; place-items:center; cursor:pointer;
  color:#0c1c44; box-shadow:0 2px 8px rgba(0,0,0,.18); transition:.15s; z-index:3;}
.card-fav svg{width:19px; height:19px;}
.card-fav:hover{transform:scale(1.1);}
.card-fav.on{color:#fff; background:#e0354b;}
.card-fav.on svg{fill:#fff; stroke:#fff;}

/* ---------- Seleção pra enviar (carrinho, no card + barra flutuante + drawer) ---------- */
.card-cart-btn{position:absolute; bottom:12px; left:12px; width:36px; height:36px; border-radius:50%;
  background:rgba(255,255,255,.92); border:0; display:grid; place-items:center; cursor:pointer;
  color:#0c1c44; box-shadow:0 2px 8px rgba(0,0,0,.18); transition:.15s; z-index:3;}
.card-cart-btn svg{width:18px; height:18px;}
.card-cart-btn:hover{transform:scale(1.1);}
.card-cart-btn.on{color:#fff; background:var(--orange);}

.cart-bar{position:fixed; bottom:18px; left:50%; transform:translateX(-50%); z-index:120; background:var(--navy,#0c1c44);
  color:#fff; border-radius:999px; padding:10px 12px 10px 22px; display:flex; align-items:center; gap:14px;
  box-shadow:0 10px 30px rgba(12,28,68,.3);}
.cart-bar span{font-weight:600; font-size:14px; white-space:nowrap; display:flex; align-items:center; gap:8px;}
.cart-bar span svg{width:17px; height:17px;}
.cart-clear{background:rgba(255,255,255,.15); border:0; color:#fff; width:30px; height:30px; border-radius:50%; cursor:pointer; display:grid; place-items:center;}
body.dov-open .cart-bar{display:none;}

.cart-items{display:flex; flex-direction:column; gap:10px;}
.cart-item{display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:8px;}
.cart-item img, .cart-item-noimg{width:56px; height:56px; border-radius:8px; object-fit:cover; background:var(--sand); flex-shrink:0;}
.cart-item-info{flex:1; min-width:0;}
.cart-item-price{font-weight:700; font-size:14px; color:var(--navy-800);}
.cart-item-meta{font-size:12.5px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.cart-item-rm{background:none; border:0; color:var(--muted); cursor:pointer; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; flex-shrink:0;}
.cart-item-rm:hover{background:#f2f0ec; color:#e0354b;}
.cart-send{margin-top:6px; padding-top:14px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:8px;}
.cart-send h4{margin:6px 0 0; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--muted-2,var(--muted));}
.cart-send h4:first-child{margin-top:0;}
.cart-send input, .cart-send textarea{padding:10px 12px; border:1px solid var(--line); border-radius:10px; font-family:inherit; font-size:14px; outline:none; resize:vertical;}
.cart-send input:focus, .cart-send textarea:focus{border-color:var(--navy-700,var(--navy));}

@media (max-width:640px){
  .cart-bar{max-width:calc(100vw - 20px); padding:8px 10px 8px 16px; gap:8px;}
  .cart-bar span{font-size:13px; white-space:normal;}
  .cart-bar .btn{padding:10px 14px; white-space:nowrap;}
}

/* ---------- Perfil público do corretor (M7) ---------- */
.corretor-profile{padding:80px 0 60px;}
.cp-head{display:flex; gap:24px; align-items:center; flex-wrap:wrap; background:#fff; border:1px solid var(--line);
  border-radius:18px; padding:26px;}
.cp-photo{width:130px; height:130px; border-radius:50%; object-fit:cover; background:var(--line); flex:0 0 auto;}
.cp-photo.cp-noimg{display:grid; place-items:center; color:var(--navy-800,#13245a);}
.cp-photo.cp-noimg svg{width:54px; height:54px;}
.cp-info{flex:1; min-width:240px;}
.cp-info h1{font-family:var(--font-display,"Bricolage Grotesque"); color:var(--navy-800); margin:0 0 4px;}
.cp-creci{color:var(--muted,#6b7280); font-weight:600; font-size:14px; margin-bottom:8px;}
.cp-bio{color:var(--ink,#1d2430); line-height:1.6; margin:0 0 16px;}
.cp-cta{display:flex; gap:10px; flex-wrap:wrap;}

/* ---------- M8: ferramentas do detalhe ---------- */
.detail-tools{display:flex; gap:8px; margin-top:4px;}
.detail-tools .btn{flex:1; justify-content:center; font-size:14px; padding:9px;}

/* Simulador de financiamento */
.finsim{display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-bottom:14px;}
.finsim label{display:flex; flex-direction:column; gap:5px; font-size:13px; font-weight:600; color:var(--navy-800,#13245a);}
.finsim input{padding:10px 12px; border:1.5px solid var(--line-2,#d8d3c7); border-radius:9px; font-size:15px; font-family:inherit;}
.finsim-out{background:var(--cream,#f6f4ef); border-radius:12px; padding:16px 18px;}
.finsim-pmt{display:flex; align-items:baseline; justify-content:space-between;}
.finsim-pmt span{color:var(--muted,#6b7280); font-weight:600;}
.finsim-pmt strong{font-family:var(--font-display,"Bricolage Grotesque"); font-size:1.8rem; color:var(--navy-800);}
.finsim-pmt small{font-size:.95rem; font-weight:600; color:var(--muted,#6b7280);}
.finsim-fin{color:var(--muted,#6b7280); font-size:14px; margin-top:4px;}
.finsim-note{font-size:12px; color:var(--muted,#6b7280); margin-top:10px;}

/* QR overlay */
.qr-overlay{position:fixed; inset:0; background:rgba(12,28,68,.6); z-index:200; display:grid; place-items:center; padding:20px;}
.qr-box{background:#fff; border-radius:18px; padding:28px; text-align:center; position:relative; max-width:300px;}
.qr-box h3{margin:0 0 16px; color:var(--navy-800,#13245a); font-family:var(--font-display,"Bricolage Grotesque");}
.qr-box #qrCanvas{display:flex; justify-content:center;}
.qr-box p{margin:14px 0 0; font-size:13px; color:var(--muted,#6b7280);}
.qr-close{position:absolute; top:10px; right:10px; background:none; border:0; cursor:pointer; color:var(--muted,#6b7280); padding:6px;}

/* Comparador */
.results-meta-actions{display:flex; align-items:center; gap:10px;}
.btn-map-toggle{display:inline-flex; align-items:center; gap:6px; padding:9px 14px; border:1.5px solid var(--line-2,#d8d3c7);
  background:#fff; border-radius:9px; font-weight:600; font-size:14px; color:var(--navy-800,#13245a); cursor:pointer; font-family:inherit;}
.btn-map-toggle svg{width:16px; height:16px;}
.btn-map-toggle.active{background:var(--navy,#0c1c44); color:#fff; border-color:var(--navy,#0c1c44);}
.results-map{width:100%; height:440px; border-radius:14px; overflow:hidden; margin-bottom:22px; border:1px solid var(--line);}
.results-map .leaflet-popup-content a{color:var(--navy,#0c1c44); text-decoration:none;}

/* botão "ver no mapa" no card (só nos resultados de busca) */
.card-mappin{display:none; position:absolute; bottom:12px; left:56px; width:36px; height:36px; border-radius:50%;
  background:rgba(255,255,255,.92); border:0; place-items:center; cursor:pointer; color:#0c1c44;
  box-shadow:0 2px 8px rgba(0,0,0,.18); transition:.15s; z-index:3;}
.card-mappin svg{width:19px; height:19px;}
.card-mappin:hover{transform:scale(1.1); background:var(--orange,#f5821f); color:#fff;}
.cards-map .card-mappin{display:grid;}
.compare-bar{position:fixed; bottom:18px; left:50%; transform:translateX(-50%); z-index:120; background:var(--navy,#0c1c44);
  color:#fff; border-radius:999px; padding:10px 12px 10px 22px; display:flex; align-items:center; gap:14px;
  box-shadow:0 10px 30px rgba(12,28,68,.3);}
.compare-bar span{font-weight:600; font-size:14px; white-space:nowrap;}
.compare-clear{background:rgba(255,255,255,.15); border:0; color:#fff; width:30px; height:30px; border-radius:50%; cursor:pointer; display:grid; place-items:center;}
.compare-wrap{overflow-x:auto;}
.compare-table{width:100%; border-collapse:collapse; min-width:480px; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden;}
.compare-table th, .compare-table td{padding:13px 16px; border-bottom:1px solid var(--line); text-align:left; font-size:14px;}
.compare-table thead th{background:#faf9f6; text-align:center; vertical-align:top;}
.compare-table thead img{width:120px; height:80px; object-fit:cover; border-radius:8px;}
.compare-table .ct-code{font-weight:700; color:var(--navy,#0c1c44); margin-top:6px;}
.compare-table tbody th{font-weight:600; color:var(--muted,#6b7280); width:130px;}
.compare-table tbody td{text-align:center; font-weight:600; color:var(--navy-800,#13245a);}

/* Marca d'água */
.watermarked .card-media{position:relative;}
.watermarked .card-media::after, .watermarked .gallery-main::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:2;
  background:url("assets/acrc-logo-white.png") center center no-repeat; background-size:46%;
  opacity:.28; filter:drop-shadow(0 1px 3px rgba(0,0,0,.4));}
.watermarked .gallery-main{position:relative;}

/* ---------- M5: captura de leads (detalhe público) ---------- */
.lead-box{background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px; margin-top:16px;}
.lead-box h3{margin:0 0 14px; font-size:1.15rem; color:var(--navy-800,#13245a);}
.lead-form{display:flex; flex-direction:column; gap:10px;}
.lead-form input, .lead-form textarea{padding:11px 13px; border:1.5px solid var(--line-2,#d8d3c7); border-radius:9px;
  font-size:15px; font-family:inherit; width:100%;}
.lead-form textarea{min-height:70px; resize:vertical;}
.lead-ok{background:#e7f5ee; color:#0d7a4e; border:1px solid #b6e2cb; border-radius:10px; padding:14px; font-weight:600; text-align:center;}

/* ---------- Redes sociais (home) ---------- */
.social-sec{padding:84px 0; background:#fff;}
.social-links{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:22px;}
.social-link{display:inline-flex; align-items:center; padding:9px 18px; border-radius:999px; border:1.5px solid var(--line-2,#d8d3c7);
  background:#fff; color:var(--navy-800,#13245a); font-weight:600; font-size:14px; text-decoration:none; transition:.15s;}
.social-link:hover{background:var(--navy,#0c1c44); color:#fff; border-color:var(--navy,#0c1c44);}
.social-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:16px;}
.social-card{display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:14px;
  overflow:hidden; text-decoration:none; color:inherit; transition:.18s;}
.social-card:hover{transform:translateY(-3px); box-shadow:0 12px 30px rgba(12,28,68,.10);}
.social-card img{width:100%; aspect-ratio:1/1; object-fit:cover;}
.social-cap{padding:12px 14px; font-size:14px; color:var(--ink,#1d2430);}
.card-photos svg{width:13px; height:13px;}
.card-body{padding:13px 18px 15px; display:flex; flex-direction:column; flex:1; color:inherit; text-decoration:none;}
/* Valor à esquerda, Venda/Locação encostado na direita: a informação que o
   olho procura primeiro e a que qualifica ela, na mesma linha. */
.card-price-row{display:flex; align-items:baseline; justify-content:space-between; gap:10px;}
/* nowrap: nome de edifício longo ("ALPHAVILLE RESIDENCE") quebrava a linha e
   deixava aquele card mais alto que os vizinhos. Agora ele corta com reticências
   e todos os cards da grade mantêm a mesma altura. */
.card-meta{display:flex; align-items:center; gap:8px; flex-wrap:nowrap; margin:4px 0 0; min-width:0;}
.card-meta .cm-type{flex:none;}
.card-meta .cm-type{font-size:11.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:var(--navy-700);}
.card-meta .cm-op{font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  padding:3px 9px; border-radius:999px;}
/* mesma cor de Venda/Locação do painel (azul/laranja) */
.card-meta .cm-op-sale{color:#1f4dff; background:rgba(31,77,255,.12);}
.card-meta .cm-op-rent{color:var(--orange-600); background:rgba(245,130,31,.13);}
.card-price{font-family:var(--font-display); font-size:1.5rem; font-weight:600; color:var(--navy-800); margin-bottom:0;}
.card-price-row .cm-op{flex:none;}
.card-price .per{font-family:var(--font-sans); font-size:.8rem; font-weight:500; color:var(--muted-2);}
.card-type{font-size:13px; font-weight:600; color:var(--orange-600); margin-top:2px;}
.card-loc{display:flex; align-items:center; gap:6px; color:var(--muted); font-size:14px; margin-top:6px;}
.card-loc svg{width:15px; height:15px; flex:none; color:var(--muted-2);}
.card-loc span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
/* Nome do prédio: linha própria logo acima do endereço e com a MESMA letra dele.
   Colado ao tipo e em caixa alta ficava competindo com o tipo do imóvel; aqui
   ele lê como o que é — parte da localização, uma linha antes do bairro.
   Alinhado à esquerda com o preço/tipo acima — sem o recuo que antes fingia
   acompanhar o ícone de pino do endereço. */
.card-building{color:var(--muted); font-size:14px; font-weight:600; margin-top:8px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.card-building + .card-loc{margin-top:1px;}
.card-specs{display:flex; gap:16px; margin-top:10px; padding-top:10px; border-top:1px solid var(--line);
  color:var(--navy-700); font-size:13.5px; font-weight:500;}
.card-specs .sp{display:flex; align-items:center; gap:6px;}
.card-specs svg{width:16px; height:16px; color:var(--muted-2);}
.card-link{position:absolute; inset:0; z-index:3;}
.card{position:relative;}

/* ---------- Results view ---------- */
.results-head{background:var(--navy-800); color:#fff; padding:16px 0 14px;}
.results-head h1{font-size:clamp(1.25rem,1.8vw,1.6rem); font-weight:600;}
.results-head .crumb{color:rgba(255,255,255,.6); font-size:13px; margin-bottom:4px;}
@media (max-width:760px){
  .results-head{padding:16px 0;}
  .results-head .crumb{display:none;}
  .results-head h1{font-size:1.25rem;}
}
.results-head .crumb a:hover{color:var(--orange);}
.filters{position:sticky; top:58px; z-index:40; background:var(--cream); border-bottom:1px solid var(--line);
  padding:16px 0;}
.filters-row{display:flex; flex-wrap:wrap; gap:12px; align-items:center;}
.fl{display:flex; flex-direction:column; gap:3px; background:#fff; border:1px solid var(--line);
  border-radius:var(--r-sm); padding:7px 12px; min-width:120px;}
.fl label{font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2);}
.fl input, .fl select{border:0; outline:none; background:transparent; font-family:inherit; font-size:14px; font-weight:500; color:var(--ink); appearance:none; -webkit-appearance:none;}
.fl-search{flex:1; min-width:200px;}
.filters .btn{padding:10px 18px; font-size:14px;}

/* filtros rápidos + mais filtros */
.filters-form{display:flex; flex-direction:column;}
.filters-quick{display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end;}
.filters-quick .fl{min-width:130px;}
.more-toggle.active{background:var(--navy-800); color:#fff; border-color:var(--navy-800);}
.filters-more, .search-more{margin-top:16px; padding-top:16px; border-top:1px solid var(--line);}
.mf-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px;}
.sfield-code{width:100%; border:1.5px solid var(--line); border-radius:var(--r-md); background:var(--cream); padding:14px 16px; font-family:inherit; font-size:15px; color:var(--ink); outline:none; transition:.18s;}
.sfield-code:focus{border-color:var(--orange); background:#fff;}
.search-row-code{margin-top:12px;}
.fl-code input{width:100%; border:1px solid var(--line); border-radius:var(--r-md); background:#fff; padding:12px 14px; font-family:inherit; font-size:14px; outline:none;}
.fl-code input:focus{border-color:var(--orange);}
.mf{display:flex; flex-direction:column; gap:3px; background:#fff; border:1px solid var(--line); border-radius:var(--r-sm); padding:7px 12px;}
.mf>span{font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2);}
.mf select, .mf input{border:0; outline:none; background:transparent; font-family:inherit; font-size:14px; font-weight:500; color:var(--ink); appearance:none; -webkit-appearance:none;}

/* widget de preço (slider) */
.price-field{position:relative;}
.fl-price{min-width:175px;}
.price-trigger{display:flex; flex-direction:column; align-items:flex-start; gap:2px; width:100%; background:#fff;
  border:1px solid var(--line); border-radius:var(--r-sm); padding:6px 30px 6px 12px; cursor:pointer; min-height:46px; text-align:left;}
.price-trigger .pf-cap{font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2);}
.price-trigger .pf-label{font-size:14px; font-weight:500; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;}
.price-trigger svg{position:absolute; right:10px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:var(--muted);}
.price-pop{position:absolute; top:calc(100% + 8px); left:0; z-index:55; width:300px; max-width:88vw; background:#fff;
  border:1px solid var(--line-2); border-radius:var(--r-md); box-shadow:var(--shadow-lg); padding:15px 16px 16px;}
.price-pop[hidden]{display:none;}
.pp-title{font-weight:600; font-size:14px; color:var(--navy-800); margin-bottom:14px;}
.pp-track{position:relative; height:4px; background:var(--line-2); border-radius:3px; margin:0 9px 16px;}
.pp-fill{position:absolute; height:100%; background:var(--orange); border-radius:3px;}
.pp-slider{position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:18px;
  -webkit-appearance:none; appearance:none; background:transparent; pointer-events:none; margin:0;}
.pp-slider::-webkit-slider-thumb{-webkit-appearance:none; pointer-events:auto; width:17px; height:17px; border-radius:50%;
  background:#fff; border:2px solid var(--orange); cursor:pointer; box-shadow:var(--shadow-sm);}
.pp-slider::-moz-range-thumb{pointer-events:auto; width:15px; height:15px; border-radius:50%; background:#fff; border:2px solid var(--orange); cursor:pointer;}
.pp-slider::-moz-range-track{background:transparent; border:0;}
.pp-inputs{display:flex; align-items:flex-end; gap:8px; margin-bottom:12px;}
.pp-inputs label{flex:1; display:flex; flex-direction:column; gap:4px; font-size:10px; font-weight:600; color:var(--muted-2); text-transform:uppercase; letter-spacing:.04em;}
.pp-inputs input{border:1px solid var(--line); border-radius:var(--r-sm); padding:8px 10px; font-family:inherit; font-size:13.5px; font-weight:600; color:var(--navy-800); outline:none; width:100%;}
.pp-inputs input:focus{border-color:var(--orange);}
.pp-dash{padding-bottom:10px; color:var(--muted-2);}
.price-pop .pp-apply{padding:10px; font-size:14px;}

/* hero: linha 2 + ações */
.search-row-4{grid-template-columns:repeat(4,1fr);}
.search-row-2{display:grid; grid-template-columns:1fr 1.25fr; gap:14px; margin-bottom:14px; align-items:start;}
.search-row-2.search-row-price{grid-template-columns:1fr;}
.pill-group-more{margin-bottom:16px;}
/* preço inline (sempre visível, sem popover) */
.price-inline{background:#fff; border:1.5px solid var(--line-2); border-radius:var(--r-sm); padding:13px 16px 12px;}
.price-inline .pf-cap-inline{display:block; font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2); margin-bottom:20px;}
.price-inline .pp-track{margin-bottom:14px;}
.price-inline .pp-inputs{margin-bottom:0;}
.sfield-price .price-inline{background:var(--cream);}
.search-actions{display:flex; gap:12px; justify-content:center; align-items:center; flex-wrap:wrap; margin-top:22px;}
.results-meta{display:flex; align-items:center; justify-content:space-between; gap:16px; margin:26px 0 22px; flex-wrap:wrap;}
.results-count{color:var(--muted); font-size:15px;}
.results-count strong{color:var(--navy-800); font-weight:700;}
.sort-sel{background:#fff; border:1px solid var(--line); border-radius:var(--r-sm); padding:9px 14px;
  font-family:inherit; font-size:14px; font-weight:500; color:var(--ink); outline:none;}

/* pagination */
.pager{display:flex; justify-content:center; align-items:center; gap:6px; margin:46px 0 0; flex-wrap:wrap;}
.pager button{min-width:42px; height:42px; padding:0 12px; border-radius:var(--r-sm); border:1px solid var(--line);
  background:#fff; font-weight:600; font-size:14px; color:var(--navy-700); transition:.15s;}
.pager button:hover:not(:disabled){border-color:var(--navy-800);}
.pager button.active{background:var(--navy-800); color:#fff; border-color:var(--navy-800);}
.pager button:disabled{opacity:.4; cursor:default;}
.pager .dots{border:0; background:none; cursor:default;}

/* ===== Resultados: filtros na lateral + rolagem infinita ===== */
.filter-panel-mob-hd{display:none;}
.results-layout{display:grid; grid-template-columns:300px minmax(0,1fr); gap:30px; align-items:start;
  padding-top:26px; padding-bottom:64px;}
.results-sidebar{position:sticky; top:90px; align-self:start; background:#fff; border:1px solid var(--line);
  border-radius:var(--r-md); padding:18px; max-height:calc(100vh - 106px); overflow-y:auto; overflow-x:visible;}
.results-sidebar .filters-quick{flex-direction:column; align-items:stretch; gap:12px;}
.results-sidebar .filters-quick .fl, .results-sidebar .fl-price{width:100%; min-width:0;}
.results-sidebar .filters-quick .btn{width:100%; justify-content:center;}
.results-main{min-width:0;}
.results-main .cards{grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:22px;}
.results-main .results-meta{margin:0 0 20px;}
.scroll-sentinel{display:flex; align-items:center; justify-content:center; gap:10px; padding:34px 0 6px;
  color:var(--muted); font-size:14px;}
.scroll-sentinel[hidden]{display:none;}
/* Chamada de busca personalizada, depois do último imóvel da lista */
.busca-cta{display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  margin:26px 0 8px; padding:24px 26px; border-radius:var(--r-lg);
  background:linear-gradient(135deg,var(--navy-800) 0%,var(--navy-600) 100%); color:#fff;}
.busca-cta[hidden]{display:none;}
.busca-cta h3{font-size:1.25rem; margin:0 0 6px;}
.busca-cta p{margin:0; color:rgba(255,255,255,.8); font-size:14.5px; max-width:56ch;}
.busca-cta .btn{flex:0 0 auto;}
@media (max-width:600px){
  .busca-cta{padding:20px; gap:14px;}
  .busca-cta .btn{width:100%; justify-content:center;}
}
/* Aviso legal dos encargos, só em anúncio de locação */
/* Saiu do card de preço (onde era letra miúda espremida) para depois da
   descrição. No corpo do anúncio ele tem largura inteira, então ganha um
   filete e respiro — continua discreto, mas legível. */
.aviso-encargos{margin:18px 0 0; padding:12px 14px; font-size:12.5px; line-height:1.5;
  color:var(--muted-2); background:#faf8f5; border-left:3px solid var(--line-2,#d5cec1);
  border-radius:0 8px 8px 0;}
.ss-spin{width:18px; height:18px; border:2px solid var(--line-2); border-top-color:var(--orange);
  border-radius:50%; animation:ssSpin .7s linear infinite;}
@keyframes ssSpin{to{transform:rotate(360deg);}}

.empty{text-align:center; padding:80px 20px; color:var(--muted);}
.empty h3{font-size:1.6rem; color:var(--navy-800); margin-bottom:8px;}

/* ---------- Detail view ---------- */
.detail{padding:0 0 80px;}

/* topo do imóvel: Voltar | logo | Compartilhar — sticky, à la Zillow */
.detail-topbar{position:sticky; top:0; z-index:6; display:grid; grid-template-columns:1fr auto 1fr;
  align-items:center; gap:12px; padding:14px 24px; background:#fff; border-bottom:1px solid var(--line);}
.detail-back, .detail-share{display:inline-flex; align-items:center; gap:6px; color:var(--navy-800);
  font-weight:600; font-size:14px; background:none; border:0; cursor:pointer; font-family:inherit; white-space:nowrap;}
.detail-back{justify-self:start;}
.detail-back:hover, .detail-share:hover{color:var(--orange-600);}
.detail-back svg, .detail-share svg{width:16px; height:16px; flex:none;}
.detail-logo{justify-self:center; display:flex; align-items:center;}
.detail-logo img{height:26px; width:auto; display:block;}
.detail-share{justify-self:end;}
.detail-share.copied{color:var(--orange-600);}
@media (max-width:640px){
  .detail-topbar{padding:12px 14px;}
  .detail-back span, .detail-share span{display:none;}
  .detail-logo img{height:22px;}
}
.detail-grid{display:grid; grid-template-columns:1.55fr 1fr; gap:40px; align-items:start; margin-top:24px;
  grid-template-areas:"gallery aside" "info aside";}
.detail-gallery{grid-area:gallery; min-width:0;}
.detail-grid > .detail-info-card{grid-area:info; min-width:0; margin-top:0;}
.detail-building{margin-top:8px; font-weight:700; color:var(--navy-800); font-size:1rem;}

/* gallery */
.gallery-main{position:relative; aspect-ratio:16/10; border-radius:var(--r-lg); overflow:hidden; background:var(--sand); box-shadow:var(--shadow-sm);}
.gallery-main img{width:100%; height:100%; object-fit:cover;}
.gallery-nav{position:absolute; top:50%; transform:translateY(-50%); width:46px; height:46px; border-radius:50%;
  background:rgba(255,255,255,.92); border:0; display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-sm); transition:.18s;}
.gallery-nav:hover{background:#fff; transform:translateY(-50%) scale(1.06);}
.gallery-nav svg{width:20px; height:20px; color:var(--navy-800);}
.gallery-nav.prev{left:14px;} .gallery-nav.next{right:14px;}
.gallery-count{position:absolute; bottom:14px; right:14px; background:rgba(8,19,52,.78); color:#fff;
  font-size:13px; font-weight:600; padding:5px 12px; border-radius:999px;}
.gallery-main img{cursor:zoom-in;}
.gallery-expand{position:absolute; top:14px; right:14px; width:40px; height:40px; border-radius:50%;
  background:rgba(8,19,52,.6); border:0; display:flex; align-items:center; justify-content:center; cursor:pointer;
  z-index:3; transition:.18s; -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);}
.gallery-expand svg{width:20px; height:20px; color:#fff;}
.gallery-expand:hover{background:rgba(8,19,52,.85); transform:scale(1.06);}

/* Lightbox (tela cheia) */
body.no-scroll{overflow:hidden;}
/* Coluna: palco (foto) ocupa o que sobra, tira de miniaturas fixa embaixo. */
.lightbox{position:fixed; inset:0; z-index:120; background:rgba(6,12,30,.94); display:flex;
  flex-direction:column; align-items:center; justify-content:center; gap:12px;
  padding:40px; animation:lbIn .2s ease;}
@keyframes lbIn{from{opacity:0;} to{opacity:1;}}
.lb-stage{position:relative; flex:1 1 auto; min-height:0; width:100%;
  display:flex; align-items:center; justify-content:center;}
.lb-img{max-width:94vw; max-height:100%; object-fit:contain; border-radius:6px; box-shadow:0 20px 60px rgba(0,0,0,.5);}
.lb-btn{position:absolute; background:rgba(255,255,255,.12); border:0; color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center; border-radius:50%; transition:background .18s;}
.lb-btn:hover{background:rgba(255,255,255,.25);}
/* O fechar é filho do .lightbox (não do palco), por isso fica fixo no canto. */
.lb-close{top:22px; right:22px; width:48px; height:48px; z-index:2;}
.lb-close svg{width:24px; height:24px;}
.lb-nav{top:50%; transform:translateY(-50%); width:54px; height:54px;}
.lb-nav svg{width:26px; height:26px;}
.lb-nav.prev{left:22px;} .lb-nav.next{right:22px;}
.lb-count{position:absolute; bottom:14px; left:50%; transform:translateX(-50%); color:#fff;
  font-size:14px; font-weight:600; background:rgba(6,12,30,.55); -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px); padding:6px 16px; border-radius:999px;}
/* Tira de miniaturas: navegar entre as fotos sem fechar a tela cheia. */
.lb-strip{flex:0 0 auto; display:flex; gap:8px; max-width:94vw; overflow-x:auto; overflow-y:hidden;
  padding:4px 2px; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.35) transparent;}
.lb-strip::-webkit-scrollbar{height:6px;}
.lb-strip::-webkit-scrollbar-thumb{background:rgba(255,255,255,.35); border-radius:99px;}
.lb-thumb{flex:0 0 auto; width:86px; height:60px; padding:0; border:0; border-radius:6px; overflow:hidden;
  cursor:pointer; background:none; opacity:.5; outline:2px solid transparent; outline-offset:-2px;
  transition:opacity .16s, outline-color .16s;}
.lb-thumb img{width:100%; height:100%; object-fit:cover; display:block;}
.lb-thumb:hover{opacity:.85;}
.lb-thumb.on{opacity:1; outline-color:var(--orange);}
@media (max-width:760px){
  .lightbox{padding:12px; gap:8px;}
  .lb-close{top:12px; right:12px; width:42px; height:42px;}
  .lb-nav{width:44px; height:44px;}
  .lb-nav.prev{left:8px;} .lb-nav.next{right:8px;}
  /* Miniaturas menores no celular: a foto continua sendo a estrela da tela. */
  .lb-thumb{width:62px; height:44px;}
  .lb-strip{gap:6px; max-width:100vw;}
}
.gallery-thumbs{display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-top:12px;}
.gallery-thumbs img{aspect-ratio:1; object-fit:cover; border-radius:var(--r-sm); cursor:pointer; opacity:.62; transition:.18s; border:2px solid transparent;}
.gallery-thumbs img:hover{opacity:1;}
.gallery-thumbs img.active{opacity:1; border-color:var(--orange);}

.detail-title{font-size:clamp(1.5rem,2.4vw,2.1rem); color:var(--navy-800); margin-top:26px;}
.detail-loc{display:flex; align-items:center; gap:7px; color:var(--muted); margin-top:10px; font-size:15px;}
.detail-loc svg{width:17px; height:17px; color:var(--orange);}
.detail-section{margin-top:34px;}
.detail-section h3{font-size:1.3rem; color:var(--navy-800); margin-bottom:14px;}
.detail-desc{color:#3a4257; line-height:1.75; white-space:pre-line;}
.feature-list{display:flex; flex-wrap:wrap; gap:10px;}
.feature-list .feat{background:#fff; border:1px solid var(--line); border-radius:999px; padding:8px 15px; font-size:14px; font-weight:500; color:var(--navy-700); display:flex; align-items:center; gap:7px;}
.feature-list .feat svg{width:14px; height:14px; color:var(--orange);}

/* vídeo do imóvel */
.detail-section h3 svg{width:19px; height:19px; vertical-align:-3px; color:var(--orange); margin-right:3px;}
.video-embed{position:relative; width:100%; border-radius:var(--r-lg); overflow:hidden; background:#000; aspect-ratio:16/9; box-shadow:var(--shadow-sm);}
.video-embed.vertical{max-width:360px; aspect-ratio:9/16;}
.video-embed.ig{background:#fff; max-width:400px; aspect-ratio:auto; height:560px; border:1px solid var(--line);}
.video-embed iframe, .video-embed video{position:absolute; inset:0; width:100%; height:100%; border:0;}

/* sticky sidebar */
.detail-aside{position:sticky; top:96px; grid-area:aside; display:flex; flex-direction:column; gap:18px;}
.price-card{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:26px; box-shadow:var(--shadow-md);}
.detail-neigh{margin-top:0; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:22px;}
.detail-neigh h3{font-size:1.1rem; margin-bottom:4px;}
.detail-neigh-sub{color:var(--muted); font-size:13.5px; margin-bottom:14px;}
/* Mapa de referência do bairro (Google Maps JS API). Mostra comércio, mercados
   e serviços públicos das redondezas — o centro é a mediana do bairro, nunca o
   endereço do imóvel (ver neighSummaryHTML em app.js). Altura fixa: o mapa
   precisa do container com altura antes de montar, senão nasce com 0px. */
.neigh-map{height:250px; border-radius:var(--r-md, 12px); overflow:hidden; margin-bottom:8px;
  background:var(--sand); border:1px solid var(--line); z-index:0;}
.neigh-map-note{color:var(--muted-2); font-size:11.5px; line-height:1.35; margin:0 0 14px;}
/* Comércio/serviços perto do bairro — SÓ o pino colorido, sem rótulo de texto:
   o mapa do Google já escreve o nome dos estabelecimentos, então a caixinha
   branca repetia a informação e as caixas se sobrepunham. O nome vai no title
   do pino. Overlay customizado (fromLatLngToDivPixel) porque a API não tem um
   "divIcon" pronto como o Leaflet. */
.neigh-poi-overlay{position:absolute; transform:translate(-11px, -11px);}
.neigh-poi-pin{display:flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%;
  font-size:12px; box-shadow:0 1px 4px rgba(0,0,0,.35), 0 0 0 2px #fff; flex:0 0 auto;}
/* Vídeo do YouTube fica escondido até o oEmbed confirmar que existe */
.detail-section.video-checking{display:none;}
/* Tudo encostado na MESMA margem esquerda: preço, etiquetas, ficha e botões.
   A sidebar tem ~416px e preço + etiquetas somam mais que isso, então elas
   sempre quebram para a linha de baixo — com margin-left:auto quebravam e
   ainda eram jogadas para a direita, ficando desalinhadas de todo o resto
   do card (era o que aparecia no anúncio: preço na esquerda, LOCAÇÃO/Cód.
   soltos no meio da linha seguinte). */
.price-head{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-top:0;}
.price-head-right{display:flex; align-items:center; gap:8px;}
.price-card .op-pill{display:inline-block; background:var(--orange-050); color:var(--orange-600); font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:5px 12px; border-radius:999px;}
.code-badge{display:inline-flex; align-items:center; gap:6px; background:var(--navy-800); color:#fff;
  font-size:13px; font-weight:600; padding:6px 13px; border-radius:999px; letter-spacing:.02em;}
.code-badge svg{width:14px; height:14px; color:var(--orange);}
.price-card .price{font-family:var(--font-display); font-size:2.2rem; font-weight:600; color:var(--navy-800); margin:0;}
.price-card .price .per{font-family:var(--font-sans); font-size:1rem; color:var(--muted-2); font-weight:500;}
.price-card .ref{color:var(--muted-2); font-size:13px;}
/* Mesma tipografia das linhas de IPTU/Condomínio logo abaixo, e colado nelas:
   nome do edifício, IPTU e condomínio são o mesmo tipo de dado do imóvel e
   agora formam um bloco só, em vez de três estilos diferentes empilhados. */
.price-building{margin-top:8px; font-weight:600; color:var(--muted); font-size:13.5px;}
.price-card .extra{display:flex; gap:18px; margin-top:3px; color:var(--muted); font-size:13.5px;}
.spec-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin:14px 0;}
.spec-item{background:var(--cream); border-radius:9px; padding:7px 8px; text-align:left; display:flex; flex-direction:column; align-items:flex-start; gap:1px;}
.spec-item svg{width:15px; height:15px; color:var(--navy-700);}
.spec-item .v{font-weight:700; color:var(--navy-800); font-size:14px; line-height:1.15;}
.spec-item .k{font-size:10px; color:var(--muted); line-height:1.1;}
.price-card .cta-stack{display:flex; flex-direction:column; gap:10px; margin-top:8px;}
/* Mesma cor do check nos cards da listagem (.card-cart-btn.on): sem isso o
   botão ficava cinza-fantasma tanto selecionado quanto não, e só o ícone/texto
   mudavam — fácil de não perceber que o imóvel já estava na seleção. */
#ctaCart.on{background:var(--orange); border-color:var(--orange); color:#fff;}
#ctaCart.on:hover{background:var(--orange-600,#d96c10); border-color:var(--orange-600,#d96c10);}
.price-card .wa{background:#25a55a; color:#fff;}
.price-card .wa:hover{background:#1f9450; transform:translateY(-2px); box-shadow:0 10px 24px rgba(37,165,90,.32);}
.price-card .ref-id{text-align:center; color:var(--muted-2); font-size:13px; margin-top:14px;}

/* ---------- Sobre ---------- */
.sobre{background:var(--cream);}
.sobre-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
.sobre-img{border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-md); position:relative;}
.sobre-img img{width:100%; height:100%; object-fit:cover;}
.sobre-badge{position:absolute; left:24px; bottom:24px; background:var(--orange); color:#fff; border-radius:var(--r-md);
  padding:16px 22px; box-shadow:var(--shadow-md);}
.sobre-badge b{font-family:var(--font-display); font-size:2rem; display:block; line-height:1;}
.sobre-badge span{font-size:13px;}
.sobre h2{font-size:clamp(1.9rem,3.2vw,2.7rem); color:var(--navy-800); margin:14px 0 0;}
.sobre p{color:var(--muted); margin:18px 0 0; line-height:1.75;}
.sobre-list{list-style:none; padding:0; margin:24px 0 0; display:grid; gap:12px;}
.sobre-list li{display:flex; gap:11px; align-items:flex-start; color:var(--ink);}
.sobre-list svg{width:20px; height:20px; color:var(--orange); flex:none; margin-top:2px;}
.sobre-list b{color:var(--navy-800); font-weight:700;}
.sobre-actions{margin-top:28px; display:flex; gap:12px; flex-wrap:wrap;}
.sobre-gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:50px;}
.sobre-gallery img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--r-lg); box-shadow:var(--shadow-sm); transition:transform .25s;}
.sobre-gallery img:hover{transform:translateY(-4px);}

/* ---------- Anuncie conosco ---------- */
/* A alternância clara/creme segue a ORDEM na página, não a seção: ao inverter
   Anuncie e Avaliação, as cores precisaram trocar junto, senão ficava
   branco-branco-creme-creme. Sequência atual: serviços(#fff) → anuncie(creme)
   → avaliação(#fff) → trabalhe(creme). */
.anuncie{background:var(--cream);}
.anuncie-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:54px; align-items:center;}
.anuncie h2{font-size:clamp(1.9rem,3.2vw,2.7rem); color:var(--navy-800); margin-top:12px;}
.anuncie p{color:var(--muted); margin-top:16px; line-height:1.75;}
.anuncie-steps{margin-top:28px; display:flex; flex-direction:column; gap:18px;}
.astep{display:flex; gap:15px; align-items:flex-start;}
.astep span{flex:none; width:40px; height:40px; border-radius:50%; background:var(--orange); color:#fff;
  font-family:var(--font-display); font-weight:700; font-size:1.05rem; display:flex; align-items:center; justify-content:center;}
.astep b{color:var(--navy-800); font-size:16px;}
.astep p{margin:3px 0 0; font-size:14px; color:var(--muted); line-height:1.55;}
.anuncie-actions{margin-top:32px; display:flex; gap:12px; flex-wrap:wrap;}
.anuncie-img img{width:100%; border-radius:var(--r-lg); box-shadow:var(--shadow-md);}

/* ---------- Avaliação ---------- */
.aval{background:#fff;}
.aval-top{display:grid; grid-template-columns:1.08fr .92fr; gap:50px; align-items:center;}
.aval-img img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--r-lg); box-shadow:var(--shadow-md);}
.aval-img-cap{margin-top:12px; font-size:13.5px; color:var(--muted); text-align:center; font-weight:500;}
.aval-head{max-width:620px;}
.aval-head h2{font-size:clamp(1.9rem,3.2vw,2.7rem); color:var(--navy-800); margin-top:12px;}
.aval-head p{color:var(--muted); margin-top:16px; line-height:1.75;}
.aval-stats{display:flex; gap:40px; margin-top:26px; flex-wrap:wrap;}
.aval-stats div{display:flex; flex-direction:column;}
.aval-stats b{font-family:var(--font-display); font-size:2.1rem; color:var(--orange); line-height:1;}
.aval-stats span{font-size:13px; color:var(--muted); margin-top:5px;}
.aval-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:46px;}
.aval-card{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:28px;
  box-shadow:var(--shadow-sm); transition:transform .2s, box-shadow .2s;}
.aval-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md);}
.aval-card svg{width:36px; height:36px; color:var(--orange); margin-bottom:14px;}
.aval-card h3{font-size:1.25rem; color:var(--navy-800); margin-bottom:8px;}
.aval-card p{color:var(--muted); font-size:14.5px; line-height:1.65;}
.aval-steps{margin-top:54px;}
.aval-steps-title{text-align:center; color:var(--navy-800); font-size:1.6rem; margin-bottom:30px;}
.steps{display:grid; grid-template-columns:repeat(5,1fr); gap:18px; position:relative;}
.step{text-align:center;}
.step .n{width:54px; height:54px; border-radius:50%; background:var(--navy-800); color:#fff;
  font-family:var(--font-display); font-size:1.35rem; font-weight:600; display:flex; align-items:center;
  justify-content:center; margin:0 auto 14px; box-shadow:var(--shadow-sm);}
.step .t{font-weight:600; color:var(--navy-800); font-size:15px;}
.step .d{font-size:13px; color:var(--muted); margin-top:4px;}
.aval-cta{display:flex; gap:14px; justify-content:center; margin-top:48px; flex-wrap:wrap;}

/* CTA band */
.cta-band{background:var(--navy-800); color:#fff; border-radius:var(--r-xl); padding:54px; text-align:center; position:relative; overflow:hidden;}
.cta-band::after{content:""; position:absolute; right:-60px; top:-60px; width:240px; height:240px; border-radius:50%; background:rgba(245,130,31,.16);}
.cta-band h2{font-size:clamp(1.8rem,3vw,2.5rem); position:relative;}
.cta-band p{color:rgba(255,255,255,.8); margin:14px auto 26px; max-width:54ch; position:relative;}
.cta-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; position:relative;}

/* ---------- Trabalhe conosco ---------- */
.trabalhe{background:var(--cream);}
.trabalhe-grid{display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:center;}
.trabalhe h2{font-size:clamp(1.9rem,3.2vw,2.7rem); color:var(--navy-800); margin-top:12px;}
.trabalhe p{color:var(--muted); margin-top:16px; line-height:1.75;}
.trabalhe-img img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--r-lg); box-shadow:var(--shadow-md);}

/* ---------- Área do cliente ---------- */
.area-cliente{background:var(--navy-900);}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy-900); color:rgba(255,255,255,.74); padding:64px 0 0; margin-top:0;}
.footer-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1.3fr; gap:40px; padding-bottom:44px;}
.footer-logo{height:34px; margin-bottom:18px;}
.footer-brand p{font-size:14.5px; line-height:1.7; max-width:34ch;}
.footer-social{display:flex; gap:18px; margin-top:18px;}
.footer-social a{color:var(--orange); font-weight:600; font-size:14px;}
.footer-col h4{font-family:var(--font-sans); font-weight:700; color:#fff; font-size:14px; letter-spacing:.04em; margin-bottom:16px;}
.footer-col a, .footer-col span{display:block; color:rgba(255,255,255,.7); font-size:14.5px; margin-bottom:10px; transition:.15s;}
.footer-col a:hover{color:var(--orange);}
.footer-contact address{font-style:normal; font-size:14px; line-height:1.7; margin-top:6px; color:rgba(255,255,255,.6);}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:22px; padding-bottom:26px;
  border-top:1px solid rgba(255,255,255,.1); font-size:13px; color:rgba(255,255,255,.5); flex-wrap:wrap; gap:8px;}

/* WhatsApp float */
.agent-fab{position:fixed; right:22px; bottom:22px; z-index:80; display:inline-flex; align-items:center; justify-content:center;
  width:58px; height:58px; padding:0; border:0; border-radius:50%; cursor:pointer;
  background:var(--orange); color:#fff;
  box-shadow:0 10px 28px rgba(240,110,20,.42); transition:transform .2s, box-shadow .2s;}
.agent-fab:hover{transform:translateY(-3px) scale(1.05); box-shadow:0 14px 34px rgba(240,110,20,.5);}
.agent-fab svg{width:26px; height:26px; flex:0 0 auto;}
.header-client-orange{background:var(--orange); color:#fff; border-color:var(--orange);}
.header-client-orange:hover{background:var(--orange-600,#d9600f); color:#fff; border-color:var(--orange-600,#d9600f);}

/* Faixa de cookies (LGPD) */
.cookie-consent{position:fixed; left:0; right:0; bottom:0; z-index:95; background:var(--navy-800);
  color:#fff; box-shadow:0 -8px 30px rgba(8,19,52,.28);}
.cookie-consent[hidden]{display:none;}
.cookie-inner{max-width:var(--maxw); margin:0 auto; padding:18px 24px; display:flex; align-items:center;
  justify-content:space-between; gap:28px; flex-wrap:wrap;}
.cookie-text strong{font-size:15px; font-weight:600;}
.cookie-text p{margin:5px 0 0; font-size:13px; color:rgba(255,255,255,.78); max-width:74ch; line-height:1.55;}
.cookie-text a{color:var(--orange); text-decoration:underline;}
.cookie-actions{display:flex; gap:10px; flex-shrink:0;}
.cookie-consent .btn{padding:11px 22px; font-size:14px;}
.cookie-reject{color:#fff; border-color:rgba(255,255,255,.4); background:transparent;}
.cookie-reject:hover{background:rgba(255,255,255,.1); border-color:#fff;}
@media (max-width:760px){
  .cookie-inner{flex-direction:column; align-items:flex-start; gap:14px; padding:16px 18px;}
  .cookie-actions{width:100%;}
  .cookie-actions .btn{flex:1; justify-content:center;}
}

/* Proteção básica de imagens (dissuasão de cópia) */
img{-webkit-user-drag:none; -khtml-user-drag:none; -moz-user-drag:none; user-drag:none;}
.card-media img, .gallery-main img, .gallery-thumbs img, .sobre-img img, .sobre-gallery img,
.aval-img img, .anuncie-img img, .trabalhe-img img, .slide img{
  -webkit-user-select:none; -moz-user-select:none; user-select:none;}

/* ---------- Mobile filter panel ---------- */
.filters-mob-bar { display:none; }
.filter-panel-mob-hd { display:none; }

/* entrance animation */
@keyframes rise{from{opacity:0; transform:translateY(16px);} to{opacity:1; transform:translateY(0);}}
.rise{animation:rise .6s cubic-bezier(.2,.7,.3,1) both;}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  /* No celular a coluna vira uma pilha, e a ordem passa a ser conteúdo editorial:
     foto → preço e contato → sobre o imóvel → sobre o bairro no fim.
     `display:contents` no aside solta o card de preço e o bloco do bairro como
     itens diretos da pilha, que é o que permite separá-los com `order` — dentro
     do aside eles seriam sempre vizinhos. */
  /* align-items:stretch é OBRIGATÓRIO aqui: a regra base do .detail-grid usa
     `align-items:start`, que no grid alinha na vertical — mas em flex-column o
     eixo cruzado é o HORIZONTAL. Sem sobrescrever, os filhos param de esticar,
     a galeria assume a largura natural do carrossel e estoura a tela para a
     direita, criando scroll lateral no celular. */
  .detail-grid{display:flex; flex-direction:column; align-items:stretch; gap:28px; grid-template-areas:none; min-width:0;}
  .detail-grid > *, .detail-aside > *{min-width:0; max-width:100%;}
  .detail-aside{display:contents;}
  .detail-gallery{order:1;}
  .detail-aside > .price-card{order:2;}
  .detail-grid > .detail-info-card{display:flex; flex-direction:column; order:3;}
  .detail-aside > .detail-neigh{order:4;}
  .detail-desc-section{order:99;}
  /* No celular a descrição é jogada para o fim da coluna (order:99). Sem isto
     o aviso de encargos, que no HTML vem DEPOIS dela, aparecia ANTES — porque
     order padrão é 0. 100 o mantém colado no rodapé da descrição. */
  .aviso-encargos{order:100;}
  .sobre-grid{grid-template-columns:1fr; gap:32px;}
  .anuncie-grid{grid-template-columns:1fr; gap:36px;}
  .trabalhe-grid{grid-template-columns:1fr; gap:32px;}
  .trabalhe-img{order:-1;}
  .aval-top{grid-template-columns:1fr; gap:30px;}
  .header-client{display:none;}
  /* botões Cliente/Corretor migram para o menu quando o header os esconde */
  .nav-cta-group{display:flex; gap:12px; align-items:center; margin-left:8px;}
  .nav-cta-m{display:inline-flex; align-items:center; justify-content:center; gap:7px;
    border:1.5px solid rgba(255,255,255,.4); border-radius:999px; padding:9px 16px; font-weight:600; white-space:nowrap;}
  .nav-cta-m::after{display:none;}
  .nav-cta-m.is-corretor{background:var(--orange); border-color:var(--orange); color:#fff;}
  .stats-grid{grid-template-columns:repeat(2,1fr); gap:30px;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .search-pills-row{gap:32px;}
}
@media (max-width:760px){
  /* ---- Menu mobile: card flutuante com design ---- */
  .main-nav{position:fixed; inset:80px 12px auto 12px; margin:0; flex-direction:column; gap:4px;
    background:linear-gradient(165deg,#1a3067 0%,#0c1c44 72%); border:1px solid rgba(255,255,255,.1);
    padding:12px; border-radius:22px; transform:translateY(-124%) scale(.98); opacity:0; pointer-events:none;
    transition:transform .38s cubic-bezier(.22,1,.36,1), opacity .26s ease;
    box-shadow:0 30px 70px rgba(6,14,40,.62), inset 0 1px 0 rgba(255,255,255,.08);}
  .main-nav.open{transform:none; opacity:1; pointer-events:auto;}
  .main-nav > a{display:flex; align-items:center; justify-content:space-between; padding:15px 16px; border-radius:14px;
    font-size:16px; font-weight:600; color:rgba(255,255,255,.9); border:0;}
  .main-nav > a::after{content:"\203A"; position:static; width:auto; height:auto; background:none;
    font-size:22px; line-height:1; color:rgba(255,255,255,.32); font-weight:400; transition:transform .16s, color .16s;}
  .main-nav > a:hover, .main-nav > a:active, .main-nav > a:focus-visible{background:rgba(255,255,255,.09); color:#fff;}
  .main-nav > a:hover::after, .main-nav > a:active::after{color:var(--orange); transform:translateX(4px);}
  .main-nav.open > a{animation:navItemIn .34s cubic-bezier(.22,1,.36,1) both;}
  .main-nav.open > a:nth-child(1){animation-delay:.05s;}
  .main-nav.open > a:nth-child(2){animation-delay:.09s;}
  .main-nav.open > a:nth-child(3){animation-delay:.13s;}
  .main-nav.open > a:nth-child(4){animation-delay:.17s;}
  .main-nav.open > a:nth-child(5){animation-delay:.21s;}
  .main-nav.open > a:nth-child(6){animation-delay:.25s;}
  .main-nav.open .nav-cta-group{animation:navItemIn .34s cubic-bezier(.22,1,.36,1) both; animation-delay:.29s;}
  @keyframes navItemIn{from{opacity:0; transform:translateY(-10px);} to{opacity:1; transform:none;}}
  .nav-cta-group{flex-direction:column; gap:10px; margin:8px 4px 4px; padding-top:16px; border-top:1px solid rgba(255,255,255,.12);}
  .nav-cta-group .nav-cta-m{width:100%; padding:14px 8px; border-bottom:0; font-size:15px;}
  .nav-toggle{display:flex;}
  .header-phone{display:none;}
  .nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav-toggle.open span:nth-child(2){opacity:0;}
  .nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  section{padding:40px 0;}
  /* Hero continua ocupando a tela inteira no mobile (ver regra base .hero) —
     só o conteúdo interno fica mais compacto pra não sobrar espaço em branco */
  .hero-inner{padding-top:20px; padding-bottom:24px;}
  .hero-eyebrow{font-size:12px;}
  .hero h1{font-size:1.7rem; line-height:1.12; margin:8px 0 0; max-width:none;}
  .hero-sub{font-size:.95rem; margin:9px 0 0; max-width:none;}
  .search-card{margin-top:15px; padding:13px 15px 15px;}
  .search-row{grid-template-columns:1fr; gap:9px; margin-bottom:9px;}
  .search-row-2{grid-template-columns:1fr; gap:9px; margin-bottom:9px;}
  .sfield input, .sfield select{height:46px;}
  .msel{min-height:46px;}
  .search-actions{margin-top:14px; gap:10px; flex-wrap:nowrap;}
  .search-actions .btn{flex:1; padding-left:10px; padding-right:10px;}
  .search-pills-row{flex-direction:column; gap:16px; margin:6px 0 18px;}
  .filters-quick .fl, .filters-quick .fl-price{flex:1 1 45%; min-width:130px;}
  .pills{justify-content:space-between;}
  .pills button{width:46px; height:46px;}
  .search-submit .btn{width:100%;}
  .section-head{flex-direction:column; align-items:flex-start;}
  .gallery-thumbs{grid-template-columns:repeat(4,1fr);}
  .cta-band{padding:38px 24px;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr;}
  .spec-grid{grid-template-columns:repeat(2,1fr);}
  .car-nav{display:none;}
  .card-arrow{opacity:.92;}
  .promo{padding:28px 0 34px;}
  .sobre-gallery{grid-template-columns:1fr; gap:14px;}
  .aval-cards{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr 1fr; gap:24px 14px;}
  .aval-stats{gap:26px;}
  .aval-cta .btn{width:100%;}

  /* filtros mobile */
  .results-layout{grid-template-columns:1fr; gap:0; padding-top:0;}
  .filters-mob-bar{display:flex; border-bottom:1px solid var(--line); background:var(--cream);}
  .filters-mob-bar .wrap{display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:10px; padding-bottom:10px;}
  .btn-filters-mob{display:inline-flex; align-items:center; gap:7px; padding:9px 16px; border-radius:999px;
    border:1.5px solid var(--line-2); background:#fff; font-weight:600; font-size:14px;
    color:var(--navy-800); font-family:inherit; cursor:pointer; transition:.15s; white-space:nowrap;}
  .btn-filters-mob svg{width:16px; height:16px;}
  .btn-filters-mob.active{background:var(--navy-800); color:#fff; border-color:var(--navy-800);}
  .fmb-sort{flex:1; max-width:160px; border:1.5px solid var(--line-2); border-radius:var(--r-sm);
    padding:9px 10px; background:#fff; font-family:inherit; font-size:14px; font-weight:500;
    color:var(--ink); outline:none; appearance:none; -webkit-appearance:none;}
  .results-sidebar{display:none; position:static; border:0; border-radius:0; padding:0; max-height:none; overflow:visible;}
  .results-sidebar.open{display:block; position:fixed; inset:0; z-index:70; height:100dvh; max-height:none; overflow-y:auto;
    background:var(--cream); padding-bottom:80px;}
  .results-sidebar.open .filters-form{padding:16px 20px;}
  .filter-panel-mob-hd{display:flex; align-items:center; justify-content:space-between;
    padding:16px 20px; background:var(--navy-800); color:#fff; position:sticky; top:0; z-index:2;}
  .filter-panel-mob-hd span{font-weight:600; font-size:16px;}
  .filter-panel-mob-hd button{background:none; border:0; color:#fff; cursor:pointer; padding:6px;
    display:flex; align-items:center; justify-content:center;}
  .filter-panel-mob-hd button svg{width:22px; height:22px;}
  .results-meta .sort-sel{display:none;}
}

/* ===== Detalhe: card de infos à esquerda ===== */
.detail-info-card{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:24px 26px; box-shadow:var(--shadow-sm); margin-top:22px;}
.detail-info-card .detail-title{margin-top:0;}
.detail-info-card .detail-section:first-of-type{border-top:0; padding-top:0; margin-top:16px;}

/* ===== Detalhe: botões agrupados ===== */
.cta-group{display:flex; flex-direction:column; gap:10px; margin-top:18px;}
.cta-group .cta-agent{font-size:15px;}
.cta-row{display:flex; gap:10px;}
.cta-row .btn{flex:1; justify-content:center;}

/* ===== Painéis laterais (chat especialista / agendar visita) ===== */
.side-backdrop{position:fixed; inset:0; background:rgba(15,23,50,.5); z-index:90; opacity:0; transition:opacity .25s;}
.side-backdrop.show{opacity:1;}
.side-backdrop[hidden]{display:none;}
.side-panel{position:fixed; top:0; right:0; height:100dvh; width:410px; max-width:94vw; background:#fff; z-index:91;
  display:flex; flex-direction:column; box-shadow:-8px 0 34px rgba(0,0,0,.18); transform:translateX(102%); transition:transform .26s ease;}
.side-panel.open{transform:translateX(0);}
.side-panel[hidden]{display:none;}
/* Header em degradê (algo parecido com widgets tipo JivoChat) — azul-marinho
   abrindo para um azul claro, com uma mancha decorativa sutil no canto. Era
   laranja→marinho, mas o laranja brigava com o botão flutuante e com os CTAs
   da página; em azul o widget fica calmo e a marca continua no FAB. */
.sp-head{position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:16px 18px; background:linear-gradient(135deg,var(--navy-800) 0%,var(--navy-600) 45%,#3f7fe0 100%); color:#fff;}
.sp-head::after{content:""; position:absolute; top:-30px; right:-24px; width:100px; height:100px; border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.22),transparent 70%); pointer-events:none;}
.sp-head strong{display:block; font-size:15.5px;}
.sp-sub{font-size:12px; opacity:.85; display:flex; align-items:center; gap:5px;}
.sp-sub .sp-dot{width:7px; height:7px; border-radius:50%; background:#3ddc84; box-shadow:0 0 0 2px rgba(255,255,255,.3); flex:0 0 auto;}
.sp-agent{position:relative; display:flex; align-items:center; gap:12px; z-index:1;}
.sp-avatar{width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.22); display:flex; align-items:center; justify-content:center; color:#fff; flex:0 0 auto; overflow:hidden;}
.sp-avatar svg{width:20px; height:20px;}
.sp-avatar img{width:100%; height:100%; object-fit:cover; border-radius:50%;}
.sp-close{position:relative; z-index:1; background:rgba(255,255,255,.16); border:0; color:#fff; width:34px; height:34px; border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center;}
.sp-close svg{width:20px; height:20px;}
.sp-body{flex:1; overflow-y:auto; padding:18px; background:var(--cream); display:flex; flex-direction:column; gap:12px;}
.sp-msg{display:flex; flex-direction:column; max-width:86%;}
.sp-msg.me{align-self:flex-end; align-items:flex-end;}
.sp-msg.bot{align-self:flex-start;}
.sp-bubble{padding:11px 14px; border-radius:16px; font-size:14px; line-height:1.5; box-shadow:var(--shadow-sm);}
.sp-msg.bot .sp-bubble{background:#fff; color:var(--ink); border-bottom-left-radius:5px;}
.sp-msg.me .sp-bubble{background:var(--navy-800); color:#fff; border-bottom-right-radius:5px;}
.sp-msg-time{font-size:10.5px; color:var(--muted-2); margin-top:3px; display:flex; align-items:center; gap:4px;}
.sp-msg.me .sp-msg-time{color:var(--muted);}
.sp-msg-time svg{width:12px; height:12px;}
.sp-typing{display:flex; gap:5px; align-items:center;}
.sp-typing span{width:7px; height:7px; border-radius:50%; background:var(--muted-2); animation:spDot 1s infinite;}
.sp-typing span:nth-child(2){animation-delay:.15s;}
.sp-typing span:nth-child(3){animation-delay:.3s;}
@keyframes spDot{0%,60%,100%{opacity:.3; transform:translateY(0);} 30%{opacity:1; transform:translateY(-3px);}}
.sp-suggests{display:flex; flex-direction:column; gap:8px; margin-top:8px;}
.sp-sug{display:flex; flex-direction:column; gap:2px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:10px 12px; transition:.15s;}
.sp-sug:hover{border-color:var(--orange); transform:translateY(-1px);}
.sp-sug-t{font-weight:600; font-size:13px; color:var(--navy-800);}
.sp-sug-p{font-size:12.5px; color:var(--muted);}
.sp-input{display:flex; gap:8px; padding:12px; border-top:1px solid var(--line); background:#fff;}
.sp-input input{flex:1; border:1px solid var(--line-2); border-radius:999px; padding:11px 16px; font-family:inherit; font-size:14px; outline:none;}
.sp-input input:focus{border-color:var(--orange);}
.sp-input button{width:44px; height:44px; border-radius:50%; border:0; background:var(--line-2); color:var(--muted); cursor:pointer; flex:0 0 auto; display:flex; align-items:center; justify-content:center; transition:.15s;}
.sp-input button.tem-texto{background:var(--orange); color:#fff;}
.sp-input button svg{width:20px; height:20px;}
/* corretor humano online: mesma estrutura de bolha, cor diferente da Luzia */
.sp-msg.corretor .sp-bubble{background:#1f4dff; color:#fff; border-bottom-left-radius:5px;}
.side-panel .lead-form{padding:4px 2px;}

/* O chat é um WIDGET, não uma gaveta de ponta a ponta: com 100dvh colado na
   direita ele tampava o cabeçalho e o menu do site inteiro. Vira um cartão
   flutuante logo acima do botão laranja, deixando a navegação à mostra.
   Só o #gAgentPanel muda — carrinho e agendamento seguem como gaveta cheia,
   que ali é o certo (são modais de verdade). */
/* Ancorado na BORDA DE BAIXO, não flutuando acima do balão: solto no meio
   sobrava um vão morto embaixo e o widget parecia descolado da tela. Encostado,
   ele cobre o próprio FAB (que fica atrás) — fechar é pelo X do cabeçalho. */
#gAgentPanel{top:auto; right:22px; bottom:0;
  width:376px; max-width:calc(100vw - 44px);
  height:min(560px, calc(100dvh - 120px));
  border-radius:16px 16px 0 0; overflow:hidden;
  box-shadow:0 -6px 40px rgba(15,23,50,.24);
  transform:translateY(18px); opacity:0;
  transition:transform .24s ease, opacity .2s ease;}
#gAgentPanel.open{transform:none; opacity:1;}
/* Sem escurecer nem bloquear a página: o objetivo é justamente poder continuar
   vendo e usando o site com a conversa aberta. Fechar é no X do cabeçalho. */
#gBackdrop{background:transparent; pointer-events:none;}

/* ===== Novidades (Instagram) — grade de posts ===== */
.insta-grid{display:flex; gap:14px; overflow-x:auto; scroll-behavior:smooth; flex:1 1 0; min-width:0;
  padding:4px 2px 10px; scroll-snap-type:x proximity; scrollbar-width:none; -ms-overflow-style:none;}
.insta-grid .insta-post{flex:0 0 clamp(160px,42vw,210px); scroll-snap-align:start;}
.insta-post{position:relative; aspect-ratio:1; border-radius:14px; overflow:hidden; display:block;
  background:linear-gradient(135deg,#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5);}
.insta-post img{width:100%; height:100%; object-fit:cover; transition:transform .3s;}
.insta-post:hover img{transform:scale(1.06);}
.insta-ov{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; color:#fff; text-align:center; padding:12px; background:rgba(20,25,60,.30); opacity:0; transition:opacity .25s;}
.insta-post:hover .insta-ov{opacity:1;}
.insta-post.insta-ph .insta-ov{opacity:1; background:transparent;}
.insta-ic{display:inline-flex;}
.insta-ic svg{width:30px; height:30px;}
.insta-cap{font-size:13px; font-weight:600; line-height:1.35; max-width:92%; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
.social-sec .btn svg{width:18px; height:18px;}

/* ===== Serviços — cards ===== */
.servicos-sec{background:#fff;}
.servicos-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(232px,1fr)); gap:18px;}
.servico-card{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:26px 22px;
  box-shadow:var(--shadow-sm); transition:transform .2s, box-shadow .2s, border-color .2s; display:flex; flex-direction:column;}
.servico-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--orange);}
.servico-ic{display:inline-flex; width:48px; height:48px; border-radius:12px; background:#fff3e8; color:var(--orange);
  align-items:center; justify-content:center; margin-bottom:14px;}
.servico-ic svg{width:24px; height:24px;}
.servico-card h3{font-size:1.12rem; color:var(--navy-800); margin:0 0 8px;}
.servico-card p{font-size:14px; color:var(--muted); line-height:1.55; margin:0 0 14px; flex:1;}
.servico-link{font-size:13.5px; font-weight:600; color:var(--orange); display:inline-flex; align-items:center; gap:6px;}
.servico-link svg{width:15px; height:15px;}

/* ===== Multi-select (tipo/bairro) ===== */
.fl-multi, .fl-single{position:relative;}
.multi-trigger{display:flex; align-items:center; justify-content:space-between; gap:6px; width:100%;
  border:0; background:transparent; font-family:inherit; font-size:14px; font-weight:500; color:var(--ink);
  cursor:pointer; padding:0; text-align:left;}
.multi-trigger svg{color:var(--muted); flex:0 0 auto; transition:transform .2s;}
.fl-multi.open .multi-trigger svg, .fl-single.open .multi-trigger svg{transform:rotate(180deg);}
.multi-lbl{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.multi-pop{position:absolute; top:calc(100% + 8px); left:0; right:0; z-index:60; background:#fff;
  border:1px solid var(--line-2); border-radius:var(--r-md); box-shadow:var(--shadow-lg);
  max-height:290px; overflow-y:auto; padding:6px;}
.multi-pop[hidden]{display:none;}
/* opções (single E multi) com o MESMO visual do modelo "Cidade": lista limpa,
   sem checkbox, item selecionado em destaque bege */
.multi-pop .multi-opt, .multi-pop .opt-item{display:block; width:100%; text-align:left; padding:8px 10px;
  border:0; background:transparent; border-radius:8px; cursor:pointer; font-family:inherit; font-size:14px;
  font-weight:500; color:var(--navy-800); text-transform:uppercase; letter-spacing:.02em;}
.multi-pop .multi-opt:hover, .multi-pop .opt-item:hover{background:var(--cream);}
.multi-opt input{position:absolute; opacity:0; width:0; height:0; pointer-events:none;}
.multi-pop .multi-opt:has(input:checked){background:var(--cream); font-weight:700;}
.multi-pop .opt-item.sel{background:var(--cream); font-weight:700; color:var(--navy-800);}
.multi-empty{padding:10px; color:var(--muted); font-size:13px;}

/* selects simples com a MESMA seta dos multi-selects (consistência na busca) */
.fl-sel{position:relative;}
.fl-sel::after{content:""; position:absolute; right:12px; top:50%; transform:translateY(-45%);
  width:16px; height:16px; pointer-events:none;
  background:no-repeat center/16px 16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235d6678' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");}
.fl-sel select{padding-right:22px;}

/* multi-select no estilo "campo" (busca principal / hero) */
.fl-multi-field{flex-direction:row; align-items:center; height:50px; padding:0 16px; gap:0;
  background:var(--cream); border:1px solid var(--line); border-radius:var(--r-md);}
.fl-multi-field .multi-trigger{height:100%; font-size:15px;}
.fl-multi-field .multi-trigger svg{color:var(--muted-2);}
.fl-multi-field.open, .fl-multi-field:focus-within{border-color:var(--orange); background:#fff;}

/* carrossel horizontal reutilizável (relacionados + Instagram) */
.rail-carousel{position:relative; display:flex; align-items:center; gap:10px;}
.rail-track{display:flex; gap:20px; overflow-x:auto; scroll-behavior:smooth; flex:1 1 0; min-width:0;
  padding:4px 2px 10px; scroll-snap-type:x proximity; scrollbar-width:none; -ms-overflow-style:none;}
.rail-track > .card{flex:0 0 clamp(240px,78vw,300px); scroll-snap-align:start;}
/* esconde a barra de rolagem dos carrosséis (navegação só pelos botões laterais) */
.insta-grid::-webkit-scrollbar, .rail-track::-webkit-scrollbar, .thumbs-carousel .gallery-thumbs::-webkit-scrollbar{display:none; width:0; height:0;}

/* ===== Mapa de imóveis ===== */
.map-view{height:72vh; min-height:440px; border-radius:18px; overflow:hidden; border:1px solid var(--line); z-index:0;}
.results-head-row{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;}
.results-head-row h1{margin:0;}
.btn-map{white-space:nowrap;}
.btn-map svg{width:16px; height:16px;}
.map-note{color:var(--muted); font-size:14px;}
.map-note a{color:var(--orange); font-weight:700; text-decoration:none;}
.map-note svg{width:14px; height:14px; vertical-align:middle;}
.map-pin-wrap{background:none !important; border:0 !important;}
.map-pin{position:relative; display:inline-block; background:#fff; color:var(--navy-800); font-weight:800; font-size:12.5px;
  padding:5px 10px; border-radius:999px; border:1.5px solid var(--navy-800); white-space:nowrap;
  box-shadow:0 3px 10px rgba(0,0,0,.22); transform:translate(-50%,-150%);}
.map-pin.rent{border-color:var(--orange); color:var(--orange);}
.map-pin:hover{z-index:1000; background:var(--navy-800); color:#fff; border-color:var(--navy-800);}
.map-pin.rent:hover{background:var(--orange); border-color:var(--orange);}
.map-pop{display:block; width:210px; text-decoration:none; color:var(--ink);}
.map-pop img{width:100%; height:120px; object-fit:cover; border-radius:8px; display:block; margin-bottom:8px;}
.map-pop-t{display:block; font-weight:700; color:var(--navy-800); font-size:14px;}
.map-pop-loc{display:block; color:var(--muted); font-size:12.5px; margin:2px 0;}
.map-pop-p{display:block; font-weight:800; color:var(--navy-800); font-size:15px; margin-top:4px;}
.map-pop-go{display:inline-flex; align-items:center; gap:4px; color:var(--orange); font-weight:700; font-size:13px; margin-top:6px;}
.map-pop-go svg{width:14px; height:14px;}
.leaflet-popup-content{margin:12px;}
.rail-nav{flex:0 0 auto; width:42px; height:42px; border-radius:50%; border:1px solid var(--line);
  background:#fff; color:var(--navy-800); cursor:pointer; display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(0,0,0,.12); transition:.15s;}
.rail-nav:hover{background:var(--navy-800); color:#fff; border-color:var(--navy-800);}
.rail-nav svg{width:20px; height:20px;}
@media (max-width:640px){ .rail-nav{width:36px; height:36px;} }

/* ===== Card em destaque ===== */
.card-featured{border:2px solid #1f4dff; box-shadow:0 0 0 1px rgba(31,77,255,.25), 0 0 14px rgba(31,77,255,.35);}
.card-featured:hover{box-shadow:0 0 0 1px rgba(31,77,255,.3), 0 0 18px rgba(31,77,255,.5), 0 16px 40px rgba(0,0,0,.12);}
/* Nos Destaques da home (cards-plain) o card fica sem a borda neon; na busca continua como está */
.cards-plain .card-featured{border:0; box-shadow:var(--shadow-sm);}
.cards-plain .card-featured:hover{box-shadow:var(--shadow-md);}
/* Endereço borrado na descrição (imóveis que não são apartamento) */
.addr-blur{filter:blur(5px); background:rgba(8,19,52,.07); border-radius:4px; padding:0 3px; user-select:none; -webkit-user-select:none;}

/* ===== Galeria: carrossel de miniaturas com botões laterais ===== */
.thumbs-carousel{display:flex; align-items:center; gap:8px; margin-top:12px;}
.thumbs-carousel .gallery-thumbs{display:flex; grid-template-columns:none; gap:10px; margin-top:0;
  overflow-x:auto; scroll-behavior:smooth; flex:1 1 0; min-width:0; padding:2px; scrollbar-width:none; -ms-overflow-style:none;}
.detail-left{min-width:0;}
.thumbs-carousel .gallery-thumbs img{flex:0 0 86px; width:86px; height:64px; aspect-ratio:auto;}
.thumbs-nav{flex:0 0 auto; width:36px; height:36px; border-radius:50%; border:1px solid var(--line);
  background:#fff; color:var(--navy-800); cursor:pointer; display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-sm); transition:.15s;}
.thumbs-nav:hover{border-color:var(--navy-800);}
.thumbs-nav svg{width:18px; height:18px;}

/* ===== Imóveis relacionados (página do imóvel) ===== */
.related{margin-top:48px; padding-top:32px; border-top:1px solid var(--line);}
.related .cards{grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:22px;}

/* ===== Ajustes finos de responsividade mobile (site público) ===== */
@media (max-width:760px){
  .compare-bar{max-width:calc(100vw - 20px); padding:8px 10px 8px 16px; gap:8px;}
  .compare-bar span{font-size:13px; white-space:normal;}
  .compare-bar .btn{padding:10px 14px; white-space:nowrap;}
}
@media (max-width:480px){
  .wrap{padding-left:16px; padding-right:16px;}
  .cards{grid-template-columns:1fr;}
  .finsim{grid-template-columns:1fr;}
}

/* Detalhe do imóvel, mobile — enxuga a primeira tela pra caber até o CTA sem
   rolar: foto mais baixa, tira o carrossel de miniaturas (as setas/contador
   na foto já bastam) e aperta os respiros do card de preço. Fica no fim do
   arquivo de propósito: as regras-base de .gallery-main/.price-card/etc. que
   isso sobrescreve vêm depois de onde essas regras moravam antes, e em CSS,
   com a mesma especificidade, quem vem depois no arquivo ganha — não importa
   se a de cima está dentro de @media e a de baixo não. */
@media (max-width:640px){
  .detail-grid{margin-top:12px;}
  /* width:100% junto com a altura fixa: sem ele o aspect-ratio herdado resolve
     a largura a partir da altura e a foto estoura a tela na horizontal. */
  .gallery-main{aspect-ratio:auto; height:27vh; min-height:170px; width:100%; max-width:100%;}
  .thumbs-carousel{display:none;}
  .price-card{padding:16px;}
  .price-card .price{font-size:1.7rem; margin:0 0 2px;}
  .price-head{margin-top:8px;}
  .price-building{margin-top:6px; font-size:14px;}
  .price-card .extra{margin-top:4px;}
  .spec-grid{margin:10px 0; gap:6px;}
  .cta-group{margin-top:12px; gap:8px;}
}

/* Carrosséis com setas (destaques da home, Instagram, relacionados) — no
   mobile as setas de 36px+gap tiravam espaço do trilho a ponto do card
   (78vw) não caber inteiro na área visível e parecer cortado. Escondidas: o
   trilho já rola por toque (swipe), que é o normal em touch. */
@media (max-width:640px){
  .rail-nav{display:none;}
}

/* No mobile, o CTA do imóvel fica só com o WhatsApp (o "Fale agora!" abre o
   agente de IA — no celular o WhatsApp já cobre bem esse contato direto). */
@media (max-width:640px){
  .cta-group .cta-agent{display:none;}
}



/* ---------- Agente de IA: desktop apenas ----------
   No celular o contato é WhatsApp e o formulário "Tenho interesse". O botão
   flutuante ainda disputava o canto da tela com o carrinho de seleção, e o
   "Fale agora!" abria um chat em cima de uma tela onde já havia dois caminhos
   mais curtos. Escondido por CSS (e não só no JS) para valer também em quem
   gira o aparelho ou redimensiona. */
@media (max-width:980px){
  .agent-fab,
  #gAgentPanel,
  #gBackdrop,
  .price-card .cta-agent{display:none !important;}
}

/* ---------- "Tenho interesse": janela do formulário (celular) ---------- */

.interesse-ov{position:fixed; inset:0; z-index:120; background:rgba(8,19,52,.55);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
  display:flex; align-items:flex-end; justify-content:center; animation:intFade .18s ease both;}
@keyframes intFade{from{opacity:0;} to{opacity:1;}}
/* Sobe de baixo: é onde o polegar está, e a folha nasce perto do botão que a abriu. */
.interesse-sheet{position:relative; width:100%; max-width:520px; background:#fff;
  border-radius:20px 20px 0 0; padding:24px 22px calc(22px + env(safe-area-inset-bottom));
  box-shadow:0 -12px 44px rgba(8,19,52,.3); animation:intUp .24s cubic-bezier(.2,.8,.3,1) both;}
@keyframes intUp{from{transform:translateY(26px); opacity:.6;} to{transform:translateY(0); opacity:1;}}
.interesse-sheet h3{margin:0 0 3px; font-size:1.3rem; color:var(--navy-800);}
.interesse-sub{margin:0 0 16px; font-size:13.5px; color:var(--muted);}
.interesse-x{position:absolute; top:14px; right:14px; width:34px; height:34px; border:0; border-radius:50%;
  background:var(--sand); color:var(--navy-800); display:grid; place-items:center; cursor:pointer;}
.interesse-x svg{width:17px; height:17px;}
.interesse-sheet form{display:flex; flex-direction:column; gap:10px;}
/* 16px de propósito: abaixo disso o iOS dá zoom na página ao focar o campo. */
.interesse-sheet input{width:100%; height:50px; padding:0 15px; font:inherit; font-size:16px;
  border:1.5px solid var(--line-2, #d5cec1); border-radius:12px; background:#fff; color:var(--ink);}
.interesse-sheet input:focus{outline:none; border-color:var(--orange); box-shadow:0 0 0 3px rgba(245,130,31,.16);}
.interesse-sheet textarea{width:100%; min-height:100px; padding:12px 15px; font:inherit; font-size:16px;
  border:1.5px solid var(--line-2, #d5cec1); border-radius:12px; background:#fff; color:var(--ink); resize:vertical;}
.interesse-sheet textarea:focus{outline:none; border-color:var(--orange); box-shadow:0 0 0 3px rgba(245,130,31,.16);}
.interesse-msg{margin:2px 0 0; font-size:14px; line-height:1.45; text-align:center; color:#1f7a4d;}
.interesse-msg.erro{color:#b03a2e;}
@media (min-width:520px){
  .interesse-ov{align-items:center;}
  .interesse-sheet{border-radius:18px; margin:0 16px;}
}

/* ---------- Primeira tela do anúncio no celular ----------
   Meta: foto, preço, ficha e os dois caminhos de contato (WhatsApp e "Tenho
   interesse") visíveis SEM rolar, inclusive com a barra do navegador ocupando
   ~150px. Cada regra abaixo existe só para ganhar altura; nenhuma vale no
   desktop, onde sobra espaço. */
@media (max-width:980px){
  /* a foto é o maior bloco: mais larga que alta rende dezenas de px.
     `width:100%` é essencial: sem ele o aspect-ratio resolve a largura A PARTIR
     da altura e a foto fica mais larga que o container, empurrando a página e
     criando scroll lateral. Com width fixado, a altura é que segue a proporção. */
  .gallery-main{aspect-ratio:16/9.6; width:100%; max-width:100%;}
  .price-card{padding:16px 16px 18px;}
  .price-card .price{font-size:1.9rem;}
  .price-card .price-head{gap:7px;}
  /* ficha em 3 colunas no celular também: 8 quadros viram 3 linhas, não 4 */
  .spec-grid{grid-template-columns:repeat(3,1fr); gap:6px; margin:11px 0;}
  .spec-item{padding:6px 4px;}
  .spec-item .l{font-size:10.5px;}
  .cta-group{gap:8px; margin-top:12px;}
  .detail-grid{margin-top:12px; gap:22px;}
}

@media (max-width:980px){
  /* Preço e etiquetas na MESMA linha: empilhados gastavam ~35px de altura para
     mostrar três coisas curtas que cabem lado a lado. */
  .price-card .price-head{flex-direction:row; flex-wrap:wrap; align-items:center; gap:6px 10px;}
  .price-card .price{font-size:1.65rem;}
  .price-card .price-head-right{display:flex; gap:8px; align-items:center;}
  /* No card do anuncio ficam so os dois caminhos de contato. A selecao continua
     nos cards da listagem, que e de onde ela e realmente usada. */
  .price-card .cta-group #ctaCart{display:none;}
  .price-card .op-pill{padding:4px 10px; font-size:11px;}
  .code-badge{padding:5px 10px; font-size:12px;}
  .gallery-main{aspect-ratio:16/9;}
}

/* ============================================================
   Página pública do corretor (/corretor/<slug>)
   ============================================================
   É cartão de visita: manda no WhatsApp, põe na bio do Instagram. Por isso a
   foto e o nome vêm antes de qualquer coisa, e a marca da ACRC aparece junto —
   o cliente precisa ver os dois, a pessoa e a imobiliária.
   A própria foto, ampliada e desfocada, faz o fundo: dá um plano de fundo
   coerente com a pessoa sem recorrer a imagem genérica de banco. */
.cp2{position:relative; padding:0 0 70px; isolation:isolate;}
.cp2-bg{position:absolute; inset:0 0 auto; height:340px; z-index:-1; overflow:hidden;
  background:var(--navy-800);}
.cp2-bg::before{content:""; position:absolute; inset:-40px; background-image:var(--cp-bg);
  background-size:cover; background-position:center; filter:blur(34px) saturate(1.2) brightness(.55);
  transform:scale(1.1);}
.cp2-bg::after{content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,19,52,.55) 0%, rgba(8,19,52,.82) 55%, var(--cream, #f8f7f4) 100%);}
.cp2-inner{position:relative;}
.cp2-back{display:inline-flex; align-items:center; gap:7px; color:rgba(255,255,255,.85);
  text-decoration:none; font-size:14px; font-weight:600; padding:22px 0 0;}
.cp2-back:hover{color:#fff;}
.cp2-back svg{width:17px; height:17px;}

/* --- hero: retrato + identidade --- */
.cp2-hero{display:grid; grid-template-columns:auto 1fr; gap:34px; align-items:center;
  padding:34px 0 40px;}
.cp2-photo-wrap{position:relative; flex:none;}
.cp2-photo{width:186px; height:186px; border-radius:50%; object-fit:cover; display:block;
  border:5px solid #fff; box-shadow:0 22px 54px rgba(8,19,52,.42);}
.cp2-noimg{display:grid; place-items:center; background:var(--sand); color:var(--muted-2);}
.cp2-noimg svg{width:64px; height:64px;}
/* selo da imobiliária preso ao retrato: pessoa e marca no mesmo objeto */
.cp2-selo{position:absolute; right:-6px; bottom:8px; display:inline-flex; align-items:center; gap:6px;
  background:#fff; color:var(--navy-800); font-size:11.5px; font-weight:800; letter-spacing:.08em;
  padding:6px 12px 6px 7px; border-radius:999px; box-shadow:0 6px 18px rgba(8,19,52,.24);}
.cp2-selo img{width:19px; height:19px; border-radius:5px;}

.cp2-id{min-width:0; color:#fff;}
.cp2-kicker{display:inline-block; font-size:11px; font-weight:800; letter-spacing:.16em;
  text-transform:uppercase; color:var(--orange); margin-bottom:10px;}
.cp2-nome{font-family:var(--font-display); font-size:clamp(2.1rem,5vw,3.3rem); line-height:1.03;
  margin:0 0 8px; color:#fff; letter-spacing:-.02em; text-wrap:balance;}
.cp2-titulo{font-size:clamp(1rem,1.7vw,1.2rem); color:rgba(255,255,255,.92); margin:0 0 10px;
  font-weight:500; max-width:46ch;}
.cp2-creci{display:inline-block; font-size:12px; font-weight:700; letter-spacing:.05em;
  color:rgba(255,255,255,.8); border:1px solid rgba(255,255,255,.32); padding:4px 11px;
  border-radius:999px; margin-bottom:12px;}
.cp2-bio{font-size:15px; line-height:1.6; color:rgba(255,255,255,.85); margin:0 0 20px; max-width:56ch;}
.cp2-cta{display:flex; flex-wrap:wrap; gap:10px;}
.cp2-cta .btn{height:50px; padding:0 22px; font-size:15px;}
.cp2-ligar{background:rgba(255,255,255,.14); color:#fff; border:1.5px solid rgba(255,255,255,.4);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);}
.cp2-ligar:hover{background:rgba(255,255,255,.24);}

/* --- lista de imóveis --- */
.cp2-lista{margin-top:6px;}
.cp2-lista-hd{display:flex; align-items:baseline; justify-content:space-between; gap:14px;
  margin:0 0 20px; flex-wrap:wrap;}
.cp2-lista-hd h2{font-size:clamp(1.3rem,2.4vw,1.7rem); margin:0; color:var(--navy-800);}
.cp2-count{font-size:13px; font-weight:700; color:var(--orange-600); background:rgba(245,130,31,.12);
  padding:5px 12px; border-radius:999px; white-space:nowrap;}
.cp2-vazio{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
  padding:44px 28px; text-align:center;}
.cp2-vazio p{color:var(--muted); margin:0 0 18px;}

.cp2-rodape{margin-top:52px; padding:32px 26px; background:#fff; border:1px solid var(--line);
  border-radius:var(--r-lg); text-align:center; display:flex; flex-direction:column;
  align-items:center; gap:14px;}
.cp2-rodape img{height:38px; width:auto;}
.cp2-rodape p{color:var(--muted); font-size:14.5px; margin:0; max-width:52ch;}

@media (max-width:760px){
  .cp2-bg{height:300px;}
  .cp2-hero{grid-template-columns:1fr; gap:20px; text-align:center; justify-items:center;
    padding:26px 0 32px;}
  .cp2-photo{width:142px; height:142px;}
  .cp2-bio{margin-left:auto; margin-right:auto;}
  .cp2-cta{justify-content:center;}
  .cp2-cta .btn{flex:1; min-width:150px; justify-content:center;}
}

/* ============================================================
   "Anuncie seu imóvel" (/anunciar)
   ============================================================
   Reaproveita .astep/.anuncie-steps (já existem na seção homônima da home) —
   é o mesmo processo de 3 passos, então é a mesma peça visual. Aqui só entram
   o hero e o formulário, que são específicos desta página. */
.anun-hero{background:var(--navy-800); color:#fff; padding:26px 0 44px;}
.anun-hero-inner{max-width:760px;}
/* .detail-back é inline-flex por padrão (herdado da página de imóvel), então
   sem display:block ele ficava na MESMA linha do "ANUNCIE CONOSCO" logo depois
   — nada os separava, já que nenhum dos dois é elemento de bloco. */
.anun-back{display:block; width:fit-content; color:rgba(255,255,255,.75); margin-bottom:18px;}
.anun-back:hover{color:#fff;}
.anun-hero .kicker{color:var(--orange);}
.anun-hero h1{font-family:var(--font-display); font-size:clamp(1.9rem,4.2vw,2.9rem); line-height:1.08;
  margin:10px 0 12px; color:#fff; letter-spacing:-.02em; text-wrap:balance;}
.anun-lead{color:rgba(255,255,255,.82); font-size:16px; line-height:1.6; max-width:52ch; margin:0;}
.anun-steps{margin-top:30px; display:flex; flex-direction:column; gap:16px;}
.anun-steps .astep b{color:#fff;}
.anun-steps .astep p{color:rgba(255,255,255,.7);}

.anun-form-section{padding:48px 0 70px;}
.anun-form-wrap{display:grid; grid-template-columns:1.35fr .9fr; gap:40px; align-items:start;}
.anun-form{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
  padding:30px 30px 26px; box-shadow:var(--shadow-md); display:flex; flex-direction:column; gap:16px;}
.anun-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.anun-row3{grid-template-columns:1fr 1fr 1fr;}
.anun-form .mf{display:flex; flex-direction:column; gap:6px;}
.anun-form .mf span{font-size:12.5px; font-weight:700; color:var(--navy-700); letter-spacing:.01em;}
.anun-form input, .anun-form select, .anun-form textarea{width:100%; padding:11px 13px; font:inherit; font-size:15px;
  border:1.5px solid var(--line-2, #d5cec1); border-radius:10px; background:#fff; color:var(--ink);}
.anun-form input:focus, .anun-form select:focus, .anun-form textarea:focus{outline:none; border-color:var(--orange);
  box-shadow:0 0 0 3px rgba(245,130,31,.14);}
.anun-form textarea{resize:vertical; font-family:inherit;}
/* Campo de arquivo: o input nativo não aceita o mesmo padding dos outros sem
   ficar desalinhado (o botão "Escolher arquivo" tem altura própria), então
   ganha padding menor e o texto do arquivo herda a fonte do formulário. */
.anun-form input[type="file"]{padding:9px 11px; font-size:14px; cursor:pointer;}
.anun-form input[type="file"]::file-selector-button{font:inherit; font-size:13.5px; font-weight:600;
  margin-right:10px; padding:7px 12px; border:1px solid var(--line-2,#d5cec1); border-radius:8px;
  background:#faf8f5; color:var(--navy-700); cursor:pointer;}
.anun-form input[type="file"]::file-selector-button:hover{background:#f2ede5;}
.mf-hint{font-style:normal; font-size:12px; color:var(--muted);}
.anun-submit{height:52px; font-size:16px; margin-top:6px;}
.anun-msg{margin:0; font-size:13.5px; text-align:center; color:#1f7a4d;}
.anun-msg.erro{color:#b03a2e;}
.anun-alt{margin:2px 0 0; text-align:center; font-size:13.5px; color:var(--muted);}
.anun-alt a{color:var(--orange-600); font-weight:600; text-decoration:none; display:inline-flex; align-items:center; gap:5px;}
/* Sem isto o SVG do WhatsApp (só viewBox, sem width/height) usa o tamanho
   intrínseco padrão do navegador — e vira aquele círculo laranja enorme. Os
   botões (.btn svg) já têm essa regra; aqui é um link solto, não um .btn. */
.anun-alt a svg{width:16px; height:16px; flex:none;}
.anun-alt a:hover{text-decoration:underline;}
.anun-ok{text-align:center; padding:38px 10px;}
.anun-ok h3{color:var(--navy-800); font-size:1.4rem; margin:0 0 10px;}
.anun-ok p{color:var(--muted); margin:0;}

.anun-side{position:sticky; top:96px; display:flex; flex-direction:column; gap:18px;}
.anun-side img{width:100%; border-radius:var(--r-lg); display:block; box-shadow:var(--shadow-sm);}
.anun-side-card{background:var(--cream); border-radius:var(--r-lg); padding:22px 24px;}
.anun-side-card b{display:block; color:var(--navy-800); font-size:15px; margin-bottom:6px;}
.anun-side-card p{margin:0; color:var(--muted); font-size:13.5px; line-height:1.6;}

@media (max-width:900px){
  .anun-form-wrap{grid-template-columns:1fr;}
  .anun-side{position:static; order:-1;}
  .anun-row, .anun-row3{grid-template-columns:1fr;}
  .anun-form{padding:24px 20px 22px;}
}