/* =========================================================
   AURIVA IMÓVEIS — estilos
   Paleta e fontes do Manual da Marca Auriva:
   Preto Auriva #1C1A18 · Dourado Champanhe #B4966E
   Off-white #F7F3ED · Areia #D9CFC0 · Branco #FFFFFF
   Cormorant Garamond 500 (títulos) · Montserrat 300/400 (textos)
   ========================================================= */
:root {
  --primaria: #1C1A18;        /* Preto Auriva — header escuro, rodapé, títulos */
  --primaria-2: #2A2724;      /* variação do preto (hover) */
  --destaque: #B4966E;        /* Dourado Champanhe — símbolo, botões, detalhes */
  --destaque-escuro: #8F7552; /* dourado mais escuro p/ texto sobre claro (contraste) */
  --champanhe: #D9CFC0;       /* Areia — fundos suaves */
  --fundo: #F7F3ED;           /* Off-white */
  --branco: #FFFFFF;
  --texto: #1C1A18;
  --texto-suave: #6B645C;
  --borda: #E6DED2;
  --whatsapp: #25D366;

  --fonte-titulo: "Cormorant Garamond", Georgia, serif;
  --fonte-texto: "Montserrat", system-ui, -apple-system, Segoe UI, sans-serif;
  --raio: 10px;
  --sombra: 0 10px 30px rgba(28, 26, 24, .10);
  --largura: 1240px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; font-family: var(--fonte-texto); color: var(--texto);
  background: var(--fundo); line-height: 1.55; font-size: 15px;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
.container { width: 100%; max-width: var(--largura); margin: 0 auto; padding: 0 16px; }
h1, h2, h3 { font-family: var(--fonte-titulo); font-weight: 500; color: var(--primaria); line-height: 1.15; margin: 0 0 .5em; }
h1, h2 { text-transform: uppercase; letter-spacing: .08em; }
.divisor { width: 64px; height: 1px; background: var(--destaque); border: 0; margin: 14px 0; }
.logo img { height: 46px; width: auto; }
.rodape .logo img { height: 56px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ---------- Top bar ---------- */
.topbar { background: var(--primaria); color: var(--champanhe); font-size: 13px; }
.topbar .container { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 38px; flex-wrap: wrap; }
.topbar a { display: inline-flex; align-items: center; gap: 6px; opacity: .9; }
.topbar a:hover { opacity: 1; color: var(--destaque); }
.topbar .contatos, .topbar .redes { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.topbar svg { width: 15px; height: 15px; fill: currentColor; }

/* ---------- Header ---------- */
.header { background: var(--branco); border-bottom: 1px solid var(--borda); position: relative; z-index: 50; }
.header .container { display: flex; align-items: center; justify-content: space-between; min-height: 76px; gap: 24px; }
.logo { display: flex; align-items: center; gap: 10px; }
.logo-marca { width: 42px; height: 42px; }
.logo-texto { font-family: var(--fonte-titulo); font-size: 28px; font-weight: 600; letter-spacing: .14em; color: var(--primaria); line-height: 1; }
.logo-texto small { display: block; font-family: var(--fonte-texto); font-size: 9.5px; letter-spacing: .42em; color: var(--destaque-escuro); margin-top: 4px; font-weight: 500; }
.nav { display: flex; gap: clamp(14px, 2.6vw, 38px); align-items: center; flex: 1; justify-content: center; }
.nav > .item { position: relative; }
.nav > .item > a, .nav > .item > button {
  background: none; border: 0; cursor: pointer; padding: 10px 14px; font-weight: 500; font-size: 14px;
  color: var(--primaria); border-radius: 6px; display: inline-flex; align-items: center; gap: 6px;
}
.nav > .item > a:hover, .nav > .item > button:hover { color: var(--destaque-escuro); }
.nav .sub {
  position: absolute; top: 100%; left: 0; min-width: 220px; background: var(--branco); border: 1px solid var(--borda);
  border-radius: var(--raio); box-shadow: var(--sombra); padding: 8px; display: none; z-index: 60;
}
.nav .item:hover .sub, .nav .item:focus-within .sub { display: block; }
.nav .sub a { display: block; padding: 9px 12px; border-radius: 6px; font-size: 14px; }
.nav .sub a:hover { background: var(--fundo); color: var(--destaque-escuro); }
.nav .sub .grupo { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-suave); padding: 8px 12px 4px; }
.btn-menu { display: none; background: none; border: 0; cursor: pointer; padding: 8px; }
.btn-menu span { display: block; width: 24px; height: 2px; background: var(--primaria); margin: 5px 0; }

/* ---------- Botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 22px; border-radius: 8px;
  border: 1px solid transparent; background: transparent; font-weight: 600; font-size: 14px; cursor: pointer; transition: .2s; white-space: nowrap;
}
.btn-ouro { background: var(--destaque); color: var(--primaria); }
.btn-ouro:hover { background: var(--destaque-escuro); color: var(--branco); }
.btn-escuro { background: var(--primaria); color: var(--branco); }
.btn-escuro:hover { background: var(--primaria-2); }
.btn-linha { background: transparent; border-color: var(--primaria); color: var(--primaria); }
.btn-linha:hover { background: var(--primaria); color: var(--branco); }
.btn-zap { background: var(--whatsapp); color: #fff; }
.btn-zap:hover { filter: brightness(.94); }
.btn svg { width: 17px; height: 17px; fill: currentColor; }
.btn-bloco { width: 100%; }

/* ---------- Hero + busca ---------- */
.hero {
  position: relative; min-height: 600px; display: flex; align-items: center; color: var(--branco);
  background: var(--primaria) center/cover no-repeat;
}
.hero::before { content: ""; pointer-events: none; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(28,26,24,.92) 0%, rgba(28,26,24,.65) 55%, rgba(28,26,24,.35) 100%); }
.hero::before { z-index: 1; }
.hero .container { position: relative; z-index: 2; padding-top: 60px; padding-bottom: 60px; }
.hero-midia { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.hero-midia video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-midia iframe { position: absolute; top: 50%; left: 50%; width: 100vw; height: 56.25vw; min-width: 177.78vh; min-height: 100%; transform: translate(-50%, -50%); border: 0; pointer-events: none; }
.hero.com-video { min-height: calc(100vh - 114px); }
.hero.com-video::before { background: linear-gradient(180deg, rgba(28,26,24,.55) 0%, rgba(28,26,24,.35) 45%, rgba(28,26,24,.75) 100%); }
.btn-som { position: absolute; right: 20px; bottom: 20px; z-index: 3; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255,255,255,.5); background: rgba(28,26,24,.4); color: #fff; cursor: pointer; font-size: 16px; }
.hero .kicker { color: var(--destaque); letter-spacing: .3em; text-transform: uppercase; font-size: 12px; font-weight: 600; }
.hero h1 { color: var(--branco); font-size: clamp(36px, 5.4vw, 64px); max-width: 760px; margin: 14px 0 12px; text-wrap: balance; }
.hero h1 em { color: var(--destaque); font-style: italic; }
.hero p.lead { max-width: 560px; color: rgba(255,255,255,.85); font-size: 17px; margin: 0 0 32px; text-wrap: pretty; }

.busca { background: var(--branco); color: var(--texto); border-radius: 14px; box-shadow: 0 20px 50px rgba(0,0,0,.25); max-width: none; }
.busca-abas { display: flex; border-bottom: 1px solid var(--borda); overflow-x: auto; }
.busca-abas button {
  background: none; border: 0; padding: 16px 22px; cursor: pointer; font-weight: 600; font-size: 14px; color: var(--texto-suave);
  border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap;
}
.busca-abas button.ativo { color: var(--primaria); border-color: var(--destaque); }
.busca-painel { padding: 20px; display: none; }
.busca-painel.ativo { display: block; }
.toggle-transacao { display: inline-flex; background: var(--fundo); border-radius: 8px; padding: 4px; margin-bottom: 16px; }
.toggle-transacao label { cursor: pointer; }
.toggle-transacao input { display: none; }
.toggle-transacao span { display: block; padding: 8px 20px; border-radius: 6px; font-weight: 600; font-size: 14px; color: var(--texto-suave); }
.toggle-transacao input:checked + span { background: var(--primaria); color: var(--branco); }
.grade-busca { display: grid; grid-template-columns: repeat(5, 1fr) auto; gap: 12px; align-items: end; }
.campo label { display: block; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; color: var(--texto-suave); margin-bottom: 6px; }
.campo select, .campo input, .campo textarea {
  width: 100%; padding: 11px 12px; border: 1px solid var(--borda); border-radius: 8px; background: var(--branco); font-size: 14px;
}
.campo select:focus, .campo input:focus, .campo textarea:focus { outline: 2px solid var(--destaque); outline-offset: -1px; border-color: transparent; }
.busca-extra { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; font-size: 13px; flex-wrap: wrap; gap: 8px; }
.busca-extra a { color: var(--destaque-escuro); font-weight: 600; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chip { padding: 8px 14px; border-radius: 999px; background: var(--fundo); border: 1px solid var(--borda); font-size: 13px; cursor: pointer; }
.chip:hover { border-color: var(--destaque); }
.vazio { color: var(--texto-suave); font-size: 14px; }

/* ---------- Seções ---------- */
.secao { padding: 72px 0; }
.secao-suave { background: var(--champanhe); }
.secao-escura { background: var(--primaria); color: var(--branco); }
.secao-escura h2 { color: var(--branco); }
.titulo-secao { display: flex; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: 32px; flex-wrap: wrap; }
.titulo-secao .kicker { color: var(--destaque-escuro); letter-spacing: .28em; text-transform: uppercase; font-size: 12px; font-weight: 600; }
.titulo-secao h2 { font-size: clamp(30px, 3.6vw, 42px); margin: 6px 0 0; }
.secao-escura .titulo-secao .kicker { color: var(--destaque); }

/* ---------- Carrossel oportunidades ---------- */
.carrossel { position: relative; }
.carrossel-trilho { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
.carrossel-trilho::-webkit-scrollbar { display: none; }
.carrossel-trilho > * { scroll-snap-align: start; flex: 0 0 calc((100% - 40px) / 3); }
.carrossel-nav { display: flex; gap: 8px; }
.carrossel-nav button {
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--primaria); background: transparent; cursor: pointer; color: var(--primaria);
  display: grid; place-items: center; font-size: 18px;
}
.carrossel-nav button:hover { background: var(--primaria); color: var(--branco); }
.oportunidade { position: relative; border-radius: 14px; overflow: hidden; aspect-ratio: 4/5; display: block; color: var(--branco); background: var(--primaria); }
.oportunidade img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.oportunidade:hover img { transform: scale(1.05); }
.oportunidade::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(28,26,24,.92) 0%, rgba(28,26,24,0) 60%); }
.oportunidade .info { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px; z-index: 1; }
.oportunidade .bairro { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--destaque); }
.oportunidade h3 { color: var(--branco); font-size: 24px; margin: 6px 0; }
.oportunidade .preco { font-weight: 600; font-size: 18px; }

/* ---------- Cards de imóvel ---------- */
.grade-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.card { background: var(--branco); border-radius: 14px; overflow: hidden; border: 1px solid var(--borda); display: flex; flex-direction: column; transition: .25s; }
.card:hover { box-shadow: var(--sombra); transform: translateY(-3px); }
.card-midia { position: relative; aspect-ratio: 16/11; background: var(--champanhe); overflow: hidden; }
.card-midia .slides { display: flex; height: 100%; transition: transform .4s; }
.card-midia .slides img { flex: 0 0 100%; width: 100%; height: 100%; object-fit: cover; }
.card-midia .seta {
  position: absolute; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(255,255,255,.88); color: var(--primaria); opacity: 0; transition: .2s; font-size: 15px; display: grid; place-items: center;
}
.card:hover .seta { opacity: 1; }
.card-midia .seta.ant { left: 10px; } .card-midia .seta.prox { right: 10px; }
.selo { position: absolute; top: 12px; left: 12px; background: var(--primaria); color: var(--destaque); font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; padding: 6px 10px; border-radius: 6px; }
.btn-fav {
  position: absolute; top: 10px; right: 10px; width: 38px; height: 38px; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(255,255,255,.92); display: grid; place-items: center; color: var(--primaria);
}
.btn-fav svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; }
.btn-fav.ativo { color: #C0392B; } .btn-fav.ativo svg { fill: currentColor; }
.card-corpo { padding: 18px 18px 14px; display: flex; flex-direction: column; flex: 1; }
.card-preco { font-family: var(--fonte-titulo); font-size: 26px; font-weight: 700; color: var(--primaria); }
.card-preco small { font-family: var(--fonte-texto); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--destaque-escuro); font-weight: 600; display: block; }
.card-taxas { font-size: 12px; color: var(--texto-suave); margin-top: 2px; }
.card-titulo { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; margin: 10px 0 4px; color: var(--texto); line-height: 1.4; }
.card-local { font-size: 13px; color: var(--texto-suave); display: flex; justify-content: space-between; gap: 8px; }
.card-icones { display: flex; gap: 14px; flex-wrap: wrap; border-top: 1px solid var(--borda); margin-top: auto; padding-top: 12px; font-size: 13px; color: var(--texto-suave); }
.card-icones span { display: inline-flex; align-items: center; gap: 5px; }
.card-icones svg { width: 16px; height: 16px; fill: var(--destaque-escuro); }
.card-acoes { display: flex; gap: 8px; padding: 0 18px 18px; }
.card-acoes .btn { padding: 10px 14px; flex: 1; }
.card-acoes .btn-icone { flex: 0 0 auto; width: 42px; padding: 0; }
.espaco-cards { margin-top: 14px; }

/* ---------- Abas de vitrine ---------- */
.abas-vitrine { display: flex; gap: 8px; flex-wrap: wrap; }
.abas-vitrine button { padding: 9px 16px; border-radius: 999px; border: 1px solid var(--borda); background: var(--branco); cursor: pointer; font-size: 13px; font-weight: 600; }
.abas-vitrine button.ativo { background: var(--primaria); color: var(--branco); border-color: var(--primaria); }

/* ---------- Listas laterais (recentes, visitados, favoritos) ---------- */
.tres-colunas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.painel { background: var(--branco); border-radius: 14px; border: 1px solid var(--borda); padding: 22px; }
.painel h3 { font-size: 24px; display: flex; align-items: center; gap: 10px; }
.painel h3::before { content: ""; width: 26px; height: 2px; background: var(--destaque); }
.mini { display: grid; grid-template-columns: 76px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--borda); align-items: center; }
.mini:last-child { border-bottom: 0; }
.mini img { width: 76px; height: 58px; object-fit: cover; border-radius: 8px; }
.mini .t { font-size: 13px; font-weight: 600; line-height: 1.3; }
.mini .s { font-size: 12px; color: var(--texto-suave); }
.mini .p { font-size: 13px; font-weight: 700; color: var(--destaque-escuro); }
.mini .rank { font-size: 11px; color: var(--texto-suave); }

/* ---------- Bairros ---------- */
.grade-bairros { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.bairro-card { position: relative; border-radius: 12px; overflow: hidden; aspect-ratio: 1/1; color: #fff; }
.bairro-card img { width: 100%; height: 100%; object-fit: cover; transition: .6s; }
.bairro-card:hover img { transform: scale(1.06); }
.bairro-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(28,26,24,.85), rgba(28,26,24,.05)); }
.bairro-card div { position: absolute; bottom: 16px; left: 16px; right: 16px; z-index: 1; }
.bairro-card strong { font-family: var(--fonte-titulo); font-size: 22px; display: block; }
.bairro-card span { font-size: 12px; color: var(--destaque); letter-spacing: .1em; text-transform: uppercase; }

/* ---------- Institucional / diferenciais ---------- */
.dois { display: grid; grid-template-columns: 1.05fr 1fr; gap: 56px; align-items: center; }
.foto-moldura { position: relative; }
.foto-moldura img { border-radius: 14px; aspect-ratio: 4/5; object-fit: cover; width: 100%; }
.foto-moldura::before { content: ""; position: absolute; inset: 18px -18px -18px 18px; border: 1px solid var(--destaque); border-radius: 14px; z-index: -1; }
.numeros { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 28px 0; }
.numeros strong { font-family: var(--fonte-titulo); font-size: 40px; color: var(--destaque-escuro); display: block; line-height: 1; }
.numeros span { font-size: 13px; color: var(--texto-suave); }
.diferenciais { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.diferencial { border: 1px solid rgba(180,150,110,.35); border-radius: 14px; padding: 26px; }
.diferencial .ic { width: 46px; height: 46px; border-radius: 50%; background: rgba(180,150,110,.15); display: grid; place-items: center; margin-bottom: 14px; }
.diferencial .ic svg { width: 22px; height: 22px; fill: var(--destaque); }
.diferencial h3 { color: var(--branco); font-size: 22px; }
.diferencial p { color: rgba(255,255,255,.75); font-size: 14px; margin: 0; }

/* ---------- Equipe ---------- */
.grade-equipe { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.pessoa { background: var(--branco); border-radius: 14px; overflow: hidden; border: 1px solid var(--borda); text-align: center; }
.pessoa img { width: 100%; aspect-ratio: 1/1; object-fit: cover; object-position: center top; }
.pessoa div { padding: 18px; }
.pessoa h3 { font-size: 22px; margin-bottom: 2px; }
.pessoa p { margin: 0 0 12px; font-size: 13px; color: var(--texto-suave); }

/* ---------- CTA anuncie ---------- */
.cta-faixa { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.form-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.form-grade .inteiro { grid-column: 1 / -1; }

/* ---------- Página de listagem ---------- */
.cabecalho-pagina { background: var(--primaria); color: var(--branco); padding: 40px 0; }
.cabecalho-pagina h1 { color: var(--branco); font-size: clamp(30px, 4vw, 44px); margin: 6px 0 0; }
.migalhas { font-size: 13px; color: rgba(255,255,255,.7); }
.migalhas a:hover { color: var(--destaque); }
.layout-lista { display: grid; grid-template-columns: 300px 1fr; gap: 28px; padding: 36px 0 72px; align-items: start; }
.filtros { background: var(--branco); border: 1px solid var(--borda); border-radius: 14px; padding: 20px; position: sticky; top: 96px; max-height: calc(100vh - 116px); overflow-y: auto; }
.filtros h3 { font-size: 22px; }
.filtros .campo { margin-bottom: 14px; }
.duplo { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.opcoes-num { display: flex; gap: 6px; }
.opcoes-num label { flex: 1; }
.opcoes-num input { display: none; }
.opcoes-num span { display: block; text-align: center; padding: 8px 0; border: 1px solid var(--borda); border-radius: 8px; font-size: 13px; cursor: pointer; }
.opcoes-num input:checked + span { background: var(--primaria); color: var(--branco); border-color: var(--primaria); }
.checks label { display: flex; align-items: center; gap: 8px; font-size: 14px; padding: 4px 0; cursor: pointer; }
.checks input { accent-color: var(--destaque-escuro); width: 16px; height: 16px; }
.lista-caracteristicas { max-height: 180px; overflow-y: auto; border: 1px solid var(--borda); border-radius: 8px; padding: 8px 10px; }
.barra-resultados { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
.barra-resultados .qtd { font-weight: 600; }
.ordenar { display: flex; gap: 6px; flex-wrap: wrap; }
.ordenar button { padding: 8px 14px; border-radius: 8px; border: 1px solid var(--borda); background: var(--branco); cursor: pointer; font-size: 13px; }
.ordenar button.ativo { border-color: var(--destaque); color: var(--destaque-escuro); font-weight: 600; }
.lista-cards { grid-template-columns: repeat(2, 1fr); }
.btn-filtros-mobile { display: none; }

/* ---------- Página do imóvel ---------- */
.galeria { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 220px 220px; gap: 10px; border-radius: 14px; overflow: hidden; margin-top: 24px; position: relative; }
.galeria button { padding: 0; border: 0; cursor: zoom-in; background: var(--champanhe); overflow: hidden; }
.galeria img { width: 100%; height: 100%; object-fit: cover; transition: .4s; }
.galeria button:hover img { transform: scale(1.04); }
.galeria button:first-child { grid-row: 1 / 3; }
.galeria .ver-todas { position: absolute; right: 14px; bottom: 14px; }
.cabecalho-imovel { display: flex; justify-content: space-between; gap: 24px; align-items: start; margin-top: 26px; flex-wrap: wrap; }
.cabecalho-imovel h1 { font-size: clamp(26px, 3.2vw, 38px); max-width: 760px; }
.cod { display: inline-block; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--destaque-escuro); font-weight: 600; }
.acoes-topo { display: flex; gap: 8px; flex-wrap: wrap; }
.acoes-topo .btn { padding: 10px 14px; }
.layout-imovel { display: grid; grid-template-columns: 1fr 380px; gap: 36px; padding: 10px 0 72px; align-items: start; }
.bloco { background: var(--branco); border: 1px solid var(--borda); border-radius: 14px; padding: 26px; margin-bottom: 22px; }
.bloco h2 { font-size: 28px; }
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.stat { background: var(--fundo); border-radius: 10px; padding: 16px; text-align: center; }
.stat svg { width: 24px; height: 24px; fill: var(--destaque-escuro); }
.stat strong { display: block; font-size: 20px; color: var(--primaria); }
.stat span { font-size: 12px; color: var(--texto-suave); }
.tabela-detalhes { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
.tabela-detalhes div { display: flex; justify-content: space-between; padding: 11px 0; border-bottom: 1px solid var(--borda); font-size: 14px; gap: 10px; }
.tabela-detalhes dt { color: var(--texto-suave); } .tabela-detalhes dd { margin: 0; font-weight: 600; text-align: right; }
.lista-check { columns: 2; padding: 0; margin: 0; list-style: none; }
.lista-check li { padding: 6px 0 6px 24px; position: relative; font-size: 14px; break-inside: avoid; }
.lista-check li::before { content: "✓"; position: absolute; left: 0; color: var(--destaque-escuro); font-weight: 700; }
.mapa iframe { width: 100%; height: 340px; border: 0; border-radius: 10px; }
.lateral { position: sticky; top: 96px; }
.caixa-preco { background: var(--primaria); color: var(--branco); border-radius: 14px; padding: 26px; margin-bottom: 18px; }
.caixa-preco small { letter-spacing: .2em; text-transform: uppercase; font-size: 11px; color: var(--destaque); font-weight: 600; }
.caixa-preco .valor { font-family: var(--fonte-titulo); font-size: 40px; font-weight: 700; line-height: 1.1; margin: 4px 0 10px; }
.caixa-preco .taxas { display: flex; justify-content: space-between; font-size: 13px; color: rgba(255,255,255,.75); border-top: 1px solid rgba(255,255,255,.15); padding-top: 12px; margin-bottom: 16px; gap: 10px; }
.caixa-preco .btn + .btn { margin-top: 8px; }
.corretor { display: flex; gap: 14px; align-items: center; margin-bottom: 14px; }
.corretor img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: center top; border: 2px solid var(--destaque); }
.corretor strong { display: block; font-size: 16px; }
.corretor span { font-size: 12px; color: var(--texto-suave); }
.encomende { background: var(--champanhe); border-radius: 14px; padding: 22px; text-align: center; }
.encomende h3 { font-size: 22px; }

/* ---------- Simulador ---------- */
.simulador { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.simulador .range-linha { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 4px; }
.simulador input[type=range] { width: 100%; accent-color: var(--destaque-escuro); }
.resultado-sim { background: var(--primaria); color: var(--branco); border-radius: 14px; padding: 24px; }
.resultado-sim .grande { font-family: var(--fonte-titulo); font-size: 42px; color: var(--destaque); font-weight: 700; line-height: 1.1; }
.resultado-sim dl { display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; font-size: 14px; margin: 18px 0 0; }
.resultado-sim dt { color: rgba(255,255,255,.7); } .resultado-sim dd { margin: 0; font-weight: 600; text-align: right; }
.tabela-bancos { width: 100%; border-collapse: collapse; font-size: 14px; margin-top: 10px; }
.tabela-bancos th, .tabela-bancos td { padding: 10px 8px; border-bottom: 1px solid var(--borda); text-align: left; }
.tabela-bancos th { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--texto-suave); }
.aviso { font-size: 12px; color: var(--texto-suave); margin-top: 12px; }

/* ---------- Modais e lightbox ---------- */
.modal { position: fixed; inset: 0; background: rgba(20, 18, 16, .7); z-index: 100; display: none; align-items: center; justify-content: center; padding: 16px; }
.modal.aberto { display: flex; }
.modal-caixa { background: var(--branco); border-radius: 16px; width: 100%; max-width: 520px; max-height: 92vh; overflow-y: auto; padding: 28px; position: relative; }
.modal-caixa h3 { font-size: 28px; }
.modal-fechar { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--fundo); cursor: pointer; font-size: 20px; }
.modal-caixa .campo { margin-bottom: 12px; }
.lista-zap a { display: flex; justify-content: space-between; align-items: center; padding: 14px; border: 1px solid var(--borda); border-radius: 10px; margin-bottom: 10px; }
.lista-zap a:hover { border-color: var(--whatsapp); }
.lightbox { position: fixed; inset: 0; background: rgba(14, 13, 12, .96); z-index: 110; display: none; align-items: center; justify-content: center; }
.lightbox.aberto { display: flex; }
.lightbox img { max-width: 92vw; max-height: 84vh; border-radius: 6px; }
.lightbox button { position: absolute; background: rgba(255,255,255,.1); color: #fff; border: 0; width: 50px; height: 50px; border-radius: 50%; cursor: pointer; font-size: 22px; }
.lightbox .lb-fechar { top: 18px; right: 18px; }
.lightbox .lb-ant { left: 18px; top: 50%; } .lightbox .lb-prox { right: 18px; top: 50%; }
.lightbox .lb-cont { position: absolute; bottom: 20px; color: #fff; font-size: 14px; }

.toast { position: fixed; bottom: 96px; left: 50%; transform: translateX(-50%) translateY(20px); background: var(--primaria); color: #fff; padding: 12px 20px; border-radius: 10px; opacity: 0; pointer-events: none; transition: .3s; z-index: 120; font-size: 14px; }
.toast.ver { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ---------- WhatsApp flutuante ---------- */
.zap-flutuante { position: fixed; right: 20px; bottom: 20px; z-index: 90; width: 60px; height: 60px; border-radius: 50%; background: var(--whatsapp); display: grid; place-items: center; box-shadow: 0 8px 24px rgba(37,211,102,.45); border: 0; cursor: pointer; }
.zap-flutuante svg { width: 32px; height: 32px; fill: #fff; }

/* ---------- Rodapé ---------- */
.rodape { background: var(--primaria); color: rgba(255,255,255,.75); padding: 64px 0 24px; font-size: 14px; }
.rodape .grade { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 40px; }
.rodape h4 { color: var(--destaque); font-size: 12px; letter-spacing: .22em; text-transform: uppercase; margin: 0 0 16px; }
.rodape ul { list-style: none; padding: 0; margin: 0; }
.rodape li { margin-bottom: 9px; }
.rodape a:hover { color: var(--destaque); }
.rodape .logo-texto { color: var(--branco); }
.rodape .redes { display: flex; gap: 10px; margin-top: 18px; }
.rodape .redes a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255,255,255,.2); display: grid; place-items: center; }
.rodape .redes svg { width: 16px; height: 16px; fill: currentColor; }
.rodape .base { border-top: 1px solid rgba(255,255,255,.12); margin-top: 44px; padding-top: 20px; display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 12px; }

/* ---------- Responsivo ---------- */

/* Cabeçalho fixo no topo ao rolar (corrige o sticky preso no wrapper #site-header) */
#site-header { position: sticky; top: 0; z-index: 50; }

/* miniatura da tabela de imóveis (painel) */
#tabela th:first-child, #tabela td:first-child { width: 64px; padding-right: 6px; }
#tabela td img { width: 56px; height: 44px; object-fit: cover; border-radius: 6px; display: block; }

/* barra de filtros do painel — organizada e clean */
.ferramentas { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; margin-bottom: 22px; }
.ferramentas .campo { margin-bottom: 0; }
.ferramentas .campo:first-child { flex: 1 1 240px; min-width: 200px; }
.ferramentas .campo-filtro { flex: 0 0 190px; }
.ferramentas select, .ferramentas input { width: 100%; }

/* tabela do painel: responsiva no celular */
.tabela-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ===== Impressão da ficha do imóvel (apresentável, P&B) ===== */
.so-print { display: none; }

/* ===== Marca d'água: logo branco AURIVA em todas as fotos de imóvel ===== */
.card-midia::after, .oportunidade::before, .galeria button:not(.ver-todas)::after, .lightbox::before {
  content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 34%; aspect-ratio: 383.5 / 270.1; max-width: 220px;
  background: url("../img/logo-vertical-branco.svg") center / contain no-repeat;
  opacity: .55; pointer-events: none; z-index: 1;
}
.galeria button { position: relative; }
.galeria button:not(:first-child)::after { width: 46%; }
.oportunidade::before { top: 38%; width: 46%; }
.lightbox::before { width: min(30vw, 260px); max-width: none; z-index: 111; opacity: .55; }
.card-midia .selo, .card-midia .btn-fav, .card-midia .seta { z-index: 2; }

/* ===== Seletor de fotos da ficha ===== */
.ff-ov { position: fixed; inset: 0; background: rgba(20,19,17,.72); z-index: 200; display: flex; align-items: center; justify-content: center; padding: 20px; }
.ff-cx { background: var(--branco); border-radius: 16px; padding: 24px; max-width: 560px; width: 100%; max-height: 86vh; overflow-y: auto; box-shadow: var(--sombra); }
.ff-cx h3 { font-family: var(--fonte-titulo); font-size: 22px; margin: 0 0 6px; }
.ff-ajuda { font-size: 13px; color: var(--texto-suave); margin: 0 0 16px; line-height: 1.5; }
.ff-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 10px; }
.ff-item { position: relative; aspect-ratio: 4/3; border-radius: 8px; overflow: hidden; border: 2px solid transparent; cursor: pointer; padding: 0; background: var(--champanhe); }
.ff-item img { width: 100%; height: 100%; object-fit: cover; }
.ff-item.on { border-color: var(--destaque); }
.ff-item .ff-n { position: absolute; top: 5px; left: 5px; min-width: 20px; height: 20px; border-radius: 50%; background: var(--destaque); color: #fff; font-size: 12px; font-weight: 700; align-items: center; justify-content: center; display: none; }
.ff-item.on .ff-n { display: flex; }
.ff-acoes { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; flex-wrap: wrap; }
.ff-imprimir:disabled { opacity: .5; pointer-events: none; }


/* ============================================================
   MEDIA QUERIES — responsivo e impressão (consolidados)
   ============================================================ */

/* ---------- RESPONSIVO — até 1080px (tablets grandes) ---------- */
@media (max-width: 1080px) {
  .grade-busca { grid-template-columns: repeat(3, 1fr); }
  .grade-busca .btn { grid-column: 1 / -1; }
  .diferenciais, .grade-bairros { grid-template-columns: repeat(2, 1fr); }
  .layout-imovel { grid-template-columns: 1fr; }
  .lateral { position: static; }
  .rodape .grade { grid-template-columns: 1fr 1fr; }
}

/* ---------- RESPONSIVO — até 900px (tablets) ---------- */
@media (max-width: 900px) {
  .nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--branco); flex-direction: column; align-items: stretch; padding: 12px 16px 18px; border-bottom: 1px solid var(--borda); box-shadow: var(--sombra); }
  .nav.aberto { display: flex; }
  .nav .sub { position: static; display: block; box-shadow: none; border: 0; padding: 0 0 0 12px; }
  .btn-menu { display: block; }
  .header .btn-ouro { display: none; }
  .grade-cards, .tres-colunas, .grade-equipe { grid-template-columns: 1fr 1fr; }
  .carrossel-trilho > * { flex-basis: calc((100% - 20px) / 2); }
  .dois, .cta-faixa, .simulador { grid-template-columns: 1fr; gap: 32px; }
  .layout-lista { grid-template-columns: 1fr; }
  .filtros { position: fixed; inset: 0; z-index: 95; border-radius: 0; max-height: none; display: none; }
  .filtros.aberto { display: block; }
  .btn-filtros-mobile { display: inline-flex; }
  .galeria { grid-template-columns: 1fr 1fr; grid-template-rows: 240px 120px; }
  .galeria button:first-child { grid-column: 1 / 3; grid-row: 1; }
  .galeria button:nth-child(n+4) { display: none; }
}

/* ---------- RESPONSIVO — até 620px (celular) ---------- */
@media (max-width: 620px) {
  .topbar .redes { display: none; }
  .grade-busca, .grade-cards, .tres-colunas, .grade-equipe, .lista-cards, .diferenciais, .form-grade { grid-template-columns: 1fr; }
  .grade-bairros { grid-template-columns: 1fr 1fr; }
  .carrossel-trilho > * { flex-basis: 85%; }
  .stats { grid-template-columns: 1fr 1fr; }
  .tabela-detalhes { grid-template-columns: 1fr; }
  .lista-check { columns: 1; }
  .rodape .grade { grid-template-columns: 1fr; }
  .hero { min-height: 0; }
  .hero h1 { font-size: 30px; letter-spacing: .04em; }
  .titulo-secao h2 { letter-spacing: .04em; }
  .busca-abas button { padding: 14px 14px; }
  .secao { padding: 52px 0; }
  .numeros strong { font-size: 32px; }

  .ferramentas { flex-direction: column; align-items: stretch; gap: 12px; }
  .ferramentas .campo, .ferramentas .campo-filtro { flex: 1 1 auto; width: 100%; max-width: none; }

  .tabela-wrap { overflow-x: visible; }
  #tabela { min-width: 0; display: block; }
  #tabela thead { display: none; }
  #tabela tbody { display: block; }
  #tabela tr { display: grid; grid-template-columns: 84px 1fr; column-gap: 14px; row-gap: 2px; align-items: start; border: 1px solid var(--borda); border-radius: 14px; padding: 12px; margin-bottom: 12px; background: var(--branco); }
  #tabela td { display: block; border: none; padding: 0; min-width: 0; overflow-wrap: anywhere; }
  #tabela td:nth-child(1) { grid-column: 1; grid-row: 1 / span 4; }
  #tabela td img { width: 84px; height: 84px; max-width: none; border-radius: 10px; }
  #tabela td:nth-child(2) { grid-column: 2; font-size: 12px; color: var(--texto-suave); }
  #tabela td:nth-child(3) { grid-column: 2; }
  #tabela td:nth-child(4) { display: none; }
  #tabela td:nth-child(5) { grid-column: 2; font-weight: 700; color: var(--primaria); font-size: 15px; }
  #tabela td:nth-child(6) { grid-column: 2; }
  #tabela td.acoes-linha { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--borda); }
  #tabela .t-titulo { font-size: 14px; font-weight: 600; line-height: 1.3; }
  #tabela td small { font-size: 12px; color: var(--texto-suave); }
  .titulo-secao { align-items: flex-start; }
}

/* ---------- IMPRESSÃO — ficha do imóvel (PDF) ---------- */
@media print {
  @page { margin: 1.2cm; }
  html, body { background: #fff !important; color: #141414 !important; }
  body { font-size: 11pt; }
  .so-print { display: block !important; }
  #site-header, #site-footer, .migalhas, .acoes-topo, .ver-todas, .secao-suave,
  .bloco.mapa, #simular, #sim-embutido, .encomende, #lightbox, .toast,
  .lateral .btn, .lateral button { display: none !important; }
  .container { max-width: 100% !important; margin: 0 !important; padding: 0 !important; }
  .print-marca { text-align: center; margin: 0 0 12px; }
  .print-marca img { height: 44px; }
  .galeria { display: block !important; margin: 8px 0 14px; }
  .galeria button { display: none !important; }
  .galeria button:first-child { display: block !important; width: 100%; padding: 0; border: 0; }
  .galeria button:first-child img { width: 100%; height: 300px; object-fit: cover; border-radius: 8px; }
  .cabecalho-imovel { display: block !important; }
  .cabecalho-imovel h1 { font-size: 20pt; margin: 4px 0; }
  .layout-imovel { display: block !important; }
  .layout-imovel > div, .lateral { display: block !important; width: 100% !important; }
  .bloco { break-inside: avoid; page-break-inside: avoid; box-shadow: none !important; border: 1px solid #e6e2d9 !important; background: #fff !important; margin: 10px 0; padding: 12px !important; }
  .bloco h2 { font-size: 13pt; }
  .stats { display: flex !important; gap: 18px; }
  .caixa-preco { background: #fff !important; color: #141414 !important; border: 1px solid #cfc7b8; padding: 12px; }
  .caixa-preco .valor, .caixa-preco small, .caixa-preco .taxas { color: #141414 !important; }
  .corretor span, .corretor strong { color: #141414 !important; }
  a[href]:after { content: "" !important; }
  .print-rodape { margin-top: 16px; border-top: 1px solid #cfc7b8; padding-top: 8px; font-size: 9pt; text-align: center; color: #666; }

  /* esconder a marca d'água na ficha impressa (o logo do topo já identifica) */
  .card-midia::after, .oportunidade::before, .galeria button::after, .galeria button:not(.ver-todas)::after, .lightbox::before { display: none !important; background: none !important; }
  /* capa vertical => 2 fotos lado a lado; horizontal => 1 (padrão) */
  .galeria.capa-vertical { display: flex !important; gap: 8px; }
  .galeria.capa-vertical button:nth-child(1), .galeria.capa-vertical button:nth-child(2) { display: block !important; flex: 1 1 0; padding: 0; border: 0; }
  .galeria.capa-vertical button:nth-child(1) img, .galeria.capa-vertical button:nth-child(2) img { width: 100%; height: 420px; object-fit: cover; border-radius: 8px; }
  .galeria.capa-vertical button:nth-child(n+3) { display: none !important; }

  /* compactar a ficha: menos folha, blocos fluindo */
  @page { margin: 1cm; }
  body { font-size: 9.5pt !important; }
  .print-marca { margin: 0 0 6px !important; }
  .print-marca img { height: 36px !important; }
  .galeria { margin: 6px 0 8px !important; }
  .galeria button:first-child img { height: 210px !important; }
  .galeria.capa-vertical button:nth-child(1) img, .galeria.capa-vertical button:nth-child(2) img { height: 280px !important; }
  .cabecalho-imovel h1 { font-size: 16pt !important; margin: 2px 0 !important; line-height: 1.1 !important; }
  .cabecalho-imovel .cod { font-size: 8.5pt !important; }
  .bloco { margin: 6px 0 !important; padding: 8px 12px !important; break-inside: auto !important; page-break-inside: auto !important; }
  .bloco h2 { font-size: 11.5pt !important; margin: 0 0 3px !important; }
  .divisor { margin: 3px 0 !important; }
  .stats, .caixa-preco { break-inside: avoid !important; page-break-inside: avoid !important; }
  .tabela-detalhes { gap: 0 24px !important; }
  .tabela-detalhes div { padding: 3px 0 !important; font-size: 9pt !important; }
  .lista-check { font-size: 9pt !important; }
  .print-rodape { margin-top: 8px !important; }

  /* blocos de valor e stats mais finos */
  .caixa-preco { padding: 7px 12px !important; }
  .caixa-preco small { font-size: 7.5pt !important; letter-spacing: .12em !important; }
  .caixa-preco .valor { font-size: 17pt !important; margin: 1px 0 !important; line-height: 1.05 !important; }
  .caixa-preco .taxas { font-size: 8pt !important; margin-top: 2px !important; }
  .bloco .stats { padding: 7px 12px !important; gap: 8px !important; }
  .bloco .stats .stat { padding: 0 !important; gap: 1px !important; }
  .bloco .stats .stat strong { font-size: 12pt !important; margin: 0 !important; }
  .bloco .stats .stat span { font-size: 7.5pt !important; }
  .bloco .stats svg, .bloco .stats .stat svg { width: 16px !important; height: 16px !important; }

  /* uniformizar espessura: valor e stats iguais ao bloco de características */
  .caixa-preco, .bloco .stats { padding: 8px 12px !important; }

  /* tirar o espaço vago dentro do bloco de valor (margem dos botões ocultos) */
  .caixa-preco .taxas { margin-bottom: 0 !important; padding-top: 6px !important; }
  .caixa-preco .btn, .caixa-preco .btn + .btn { margin: 0 !important; }
  .bloco .stats .stat strong { margin-bottom: 0 !important; }

  /* stats discretos: linha horizontal compacta, sem caixa */
  .bloco .stats { display: flex !important; flex-wrap: wrap !important; gap: 4px 22px !important; padding: 2px 0 !important; justify-content: flex-start !important; }
  .layout-imovel .bloco:has(.stats), .bloco.bloco-stats { border: none !important; padding: 0 !important; margin: 4px 0 8px !important; }
  .bloco .stats .stat { background: none !important; display: flex !important; flex-direction: row !important; align-items: center !important; gap: 5px !important; padding: 0 !important; text-align: left !important; }
  .bloco .stats .stat strong { display: inline !important; font-size: 9pt !important; font-weight: 600 !important; margin: 0 !important; }
  .bloco .stats .stat span { display: inline !important; font-size: 8pt !important; color: #777 !important; }
  .bloco .stats svg, .bloco .stats .stat svg { width: 13px !important; height: 13px !important; }

  /* bloco de valor discreto, mesma ideia dos stats */
  .caixa-preco { border: none !important; padding: 2px 0 !important; margin: 6px 0 !important; }
  .caixa-preco small { font-size: 7.5pt !important; color: #777 !important; letter-spacing: .12em !important; }
  .caixa-preco .valor { font-size: 15pt !important; margin: 1px 0 3px !important; }
  .caixa-preco .taxas { border-top: none !important; padding-top: 2px !important; font-size: 8pt !important; color: #777 !important; }
}