/* LG Business — identidade baseada no logo (índigo, azul e ciano) */
:root {
  --indigo: #3b3477;
  --indigo-escuro: #2a2459;
  --azul: #1b6fb3;
  --ciano: #00a4e6;
  --fundo: #ffffff;
  --suave: #f3f6fb;
  --linha: #e3e8f1;
  --texto: #1d2033;
  --cinza: #5b6275;
  --whats: #1f8b4c;
  --largura: 70rem;
  --medida: 36rem;
  --raio: 10px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 1.0625rem;
  line-height: 1.65;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--azul); text-underline-offset: 3px; }
a:hover { color: var(--indigo); }
:focus-visible { outline: 3px solid var(--ciano); outline-offset: 3px; border-radius: 4px; }

.pular { position: absolute; left: -999px; top: 0; background: var(--indigo); color: #fff; padding: .6rem 1rem; }
.pular:focus { left: 1rem; top: 1rem; z-index: 10; }

.conteiner { max-width: var(--largura); margin: 0 auto; padding: 0 1.5rem; }

h1, h2, h3 { color: var(--indigo); line-height: 1.15; margin: 0 0 .6em; letter-spacing: -.015em; }
h1 { font-size: clamp(2.2rem, 5vw, 3.5rem); font-weight: 800; }
h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 800; }
h3 { font-size: 1.15rem; font-weight: 700; }
p { margin: 0 0 1em; max-width: var(--medida); }
.lead { font-size: 1.18rem; color: var(--cinza); }

/* Cabeçalho */
.topo { background: rgba(255,255,255,.96); border-bottom: 1px solid var(--linha); position: sticky; top: 0; z-index: 5; backdrop-filter: saturate(1.2) blur(6px); }
.topo .conteiner { display: flex; align-items: center; gap: 1.5rem; min-height: 4.75rem; }
.marca { display: block; flex: none; }
.marca img { height: 62px; width: auto; }
.menu { margin-left: auto; display: flex; gap: 1.4rem; align-items: center; }
.menu a { text-decoration: none; color: var(--texto); font-size: .95rem; font-weight: 500; white-space: nowrap; }
.menu a:hover { color: var(--azul); }
.menu a[aria-current="page"] { color: var(--indigo); font-weight: 700; }
.botao-menu { display: none; margin-left: auto; background: none; border: 1px solid var(--linha); border-radius: 999px; padding: .5rem 1rem; font: inherit; font-weight: 600; color: var(--indigo); cursor: pointer; }

@media (max-width: 1140px) {
  .botao-menu { display: block; }
  .menu { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; background: #fff; border-bottom: 1px solid var(--linha); padding: .5rem 1.5rem 1.25rem; }
  .menu.aberto { display: flex; }
  .menu a { padding: .8rem 0; border-bottom: 1px solid var(--linha); }
  .menu .botao { margin-top: 1rem; text-align: center; border-bottom: 0; }
}

/* Botões */
.botao { display: inline-block; padding: .85rem 1.4rem; border-radius: 999px; background: var(--indigo); color: #fff; text-decoration: none; font-weight: 700; border: 2px solid var(--indigo); line-height: 1.2; }
.botao:hover { background: var(--indigo-escuro); border-color: var(--indigo-escuro); color: #fff; }
.botao.whats { background: var(--whats); border-color: var(--whats); }
.botao.whats:hover { background: #18703d; border-color: #18703d; }
.botao.claro { background: transparent; color: var(--indigo); border-color: var(--linha); }
.botao.claro:hover { border-color: var(--indigo); background: transparent; color: var(--indigo); }
.menu .botao { padding: .6rem 1.1rem; color: #fff; }
.acoes { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.75rem; align-items: center; }
.link-seta { font-weight: 700; text-decoration: none; }
.link-seta:hover { text-decoration: underline; }

/* Seções: brancas com respiro; .escura vira faixa suave */
.secao { padding: clamp(3.5rem, 8vw, 6rem) 0; }
.secao.escura { background: var(--suave); }
.secao.marca-faixa { background: var(--indigo); color: #e9e7f7; }
.secao.marca-faixa h2 { color: #fff; }
.secao.marca-faixa p { color: #d6d3ee; }
.secao.marca-faixa .botao { background: #fff; color: var(--indigo); border-color: #fff; }
.secao.marca-faixa .botao:hover { background: var(--suave); }
.secao.marca-faixa .botao.whats { background: var(--whats); border-color: var(--whats); color: #fff; }

.cabeca-pagina { padding: clamp(3rem, 7vw, 5rem) 0 1rem; }
.cabeca-pagina .lead { margin-bottom: 0; }

/* Herói */
.heroi { padding: clamp(3.5rem, 9vw, 7rem) 0 clamp(3rem, 7vw, 5rem); position: relative; overflow: hidden; }
.heroi::after {
  content: ""; position: absolute; right: -8rem; top: -6rem; width: 34rem; height: 34rem; border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, rgba(0,164,230,.16), rgba(59,52,119,.06) 60%, transparent 70%);
  pointer-events: none;
}
.heroi .conteiner { position: relative; z-index: 1; }
.heroi h1 { max-width: 15ch; }
.heroi .lead { max-width: 34rem; }
.heroi h1 .traco { display: block; width: 4.5rem; height: 5px; border-radius: 3px; margin-bottom: 1.5rem; background: linear-gradient(90deg, var(--ciano), var(--indigo)); }

.fatos { list-style: none; padding: 0; margin: clamp(2.5rem, 6vw, 4rem) 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; max-width: 52rem; }
.fatos strong { display: block; color: var(--indigo); font-size: 1.35rem; font-weight: 800; }
.fatos span { color: var(--cinza); font-size: .95rem; }
@media (max-width: 700px) { .fatos { grid-template-columns: 1fr; gap: 1.25rem; } }

/* Áreas em grade 2x2, sem bordas pesadas */
.areas { list-style: none; margin: 2.5rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.areas li { background: var(--suave); border-radius: var(--raio); padding: 1.75rem; display: flex; flex-direction: column; }
.areas h3 { margin-bottom: .4rem; }
.areas p { color: var(--cinza); margin-bottom: 1.25rem; }
.areas a.ver { margin-top: auto; font-weight: 700; text-decoration: none; }
.areas a.ver:hover { text-decoration: underline; }
.secao.escura .areas li, .secao.escura .credenciais li { background: #fff; box-shadow: 0 1px 2px rgba(29,32,51,.05); }
@media (max-width: 760px) { .areas { grid-template-columns: 1fr; } }

/* Planos */
.planos { display: grid; gap: 1.25rem; margin-top: 2rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.plano { background: #fff; border: 1px solid var(--linha); border-radius: var(--raio); padding: 1.75rem; display: flex; flex-direction: column; color: var(--texto); }
.plano.destaque { border: 2px solid var(--ciano); }
.plano h3 { margin-bottom: .25rem; }
.plano .para { color: var(--cinza); font-size: .95rem; margin-bottom: 1.1rem; }
.preco { font-size: 2.3rem; font-weight: 800; line-height: 1; color: var(--indigo); }
.preco small { font-size: 1rem; font-weight: 500; color: var(--cinza); }
.plano ul { padding-left: 1.1rem; margin: 1.25rem 0 1.5rem; color: var(--cinza); }
.plano li { margin-bottom: .35rem; }
.plano .botao { margin-top: auto; text-align: center; }
@media (max-width: 860px) { .planos { grid-template-columns: 1fr; } }
.nota { font-size: .92rem; color: var(--cinza); margin-top: 1.25rem; }

/* Passos (sequência real) */
.passos { counter-reset: passo; list-style: none; padding: 0; margin: 2.25rem 0 0; display: grid; gap: 2rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.passos li { counter-increment: passo; }
.passos li::before { content: counter(passo); display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: #fff; border: 2px solid var(--ciano); color: var(--indigo); font-weight: 800; margin-bottom: .9rem; }
.passos h3 { margin-bottom: .3rem; }
.passos p { margin: 0; color: var(--cinza); font-size: .97rem; }
@media (max-width: 860px) { .passos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .passos { grid-template-columns: 1fr; } }

.duas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 5rem); align-items: start; }
@media (max-width: 860px) { .duas { grid-template-columns: 1fr; } }

.lista-check { list-style: none; padding: 0; margin: 0; }
.lista-check li { padding: .5rem 0 .5rem 1.75rem; position: relative; }
.lista-check li::before { content: ""; position: absolute; left: 0; top: .95rem; width: .75rem; height: .4rem; border-left: 2.5px solid var(--ciano); border-bottom: 2.5px solid var(--ciano); transform: rotate(-45deg); }

/* Perguntas frequentes */
.faq { margin-top: 1.5rem; max-width: 46rem; }
.faq details { border-bottom: 1px solid var(--linha); }
.faq summary { cursor: pointer; padding: 1.15rem 2rem 1.15rem 0; font-weight: 600; list-style: none; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: .25rem; top: .9rem; font-size: 1.4rem; color: var(--ciano); }
.faq details[open] summary::after { content: "–"; }
.faq details p { padding-bottom: 1.15rem; margin: 0; color: var(--cinza); }

/* Formulário que monta mensagem de WhatsApp */
.formulario { display: grid; gap: 1rem; max-width: 30rem; }
.formulario label { display: grid; gap: .35rem; font-weight: 600; font-size: .95rem; }
.formulario input, .formulario select, .formulario textarea { font: inherit; padding: .75rem .9rem; border: 1px solid #cdd5e3; border-radius: 8px; background: #fff; color: var(--texto); }
.formulario textarea { min-height: 6rem; resize: vertical; }
.formulario .ajuda { font-size: .88rem; color: var(--cinza); margin: 0; }
.formulario button { justify-self: start; cursor: pointer; font: inherit; font-weight: 700; }

/* Credenciais */
.credenciais { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.credenciais li { background: var(--suave); border-radius: var(--raio); padding: 1.1rem 1.25rem; }
.credenciais strong { display: block; font-size: 1.3rem; color: var(--indigo); }
.credenciais span { color: var(--cinza); font-size: .95rem; }

/* Imóveis */
.filtros { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.25rem 0; }
.filtros button { font: inherit; font-size: .93rem; cursor: pointer; padding: .5rem 1rem; border: 1px solid var(--linha); border-radius: 999px; background: #fff; color: var(--texto); }
.filtros button[aria-pressed="true"] { background: var(--indigo); border-color: var(--indigo); color: #fff; }
.contagem { color: var(--cinza); font-size: .95rem; }
.imoveis { list-style: none; padding: 0; margin: 0; }
.imovel { display: grid; grid-template-columns: 7rem minmax(0, 1fr) auto auto; gap: .5rem 1.5rem; align-items: center; padding: 1rem 0; border-bottom: 1px solid var(--linha); }
.imovel .miniatura img, .imovel .sem-foto { width: 7rem; height: 5.25rem; object-fit: cover; border-radius: 8px; background: var(--suave); }
.imovel .sem-foto { display: grid; place-items: center; color: var(--cinza); font-size: .8rem; }
.imovel .titulo-imovel { font-weight: 700; color: var(--indigo); text-decoration: none; }
.imovel .titulo-imovel:hover { text-decoration: underline; }
.imovel .det { display: block; color: var(--cinza); font-size: .92rem; }
.imovel .valor { font-weight: 700; white-space: nowrap; text-align: right; }
.imovel .valor small { display: block; font-weight: 400; color: var(--cinza); font-size: .85rem; }
.imovel .ver-imovel { white-space: nowrap; font-weight: 700; font-size: .95rem; text-decoration: none; }
@media (max-width: 700px) {
  .imovel { grid-template-columns: 6rem minmax(0, 1fr); }
  .imovel .miniatura img, .imovel .sem-foto { width: 6rem; height: 4.5rem; }
  .imovel .valor { text-align: left; grid-column: 2; }
  .imovel .ver-imovel { grid-column: 2; }
}

.galeria { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; }
.galeria a:first-child { grid-column: span 2; grid-row: span 2; }
.galeria img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; background: var(--suave); }
@media (max-width: 700px) { .galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.caixa-preco { background: var(--suave); border-radius: var(--raio); padding: 1.75rem; }
.caixa-preco .preco + .preco { margin-top: .75rem; }

/* Rodapé */
.rodape { background: var(--suave); color: var(--cinza); padding: 3.5rem 0 2rem; font-size: .95rem; border-top: 1px solid var(--linha); }
.rodape a { color: var(--texto); text-decoration: none; }
.rodape a:hover { color: var(--azul); text-decoration: underline; }
.rodape .colunas { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 2.5rem; }
.rodape .logo-rodape { height: 56px; width: auto; margin-bottom: 1rem; }
.rodape h2 { font-size: 1rem; color: var(--indigo); margin-bottom: .75rem; }
.rodape ul { list-style: none; padding: 0; margin: 0; }
.rodape li { margin-bottom: .45rem; }
.rodape .legal { border-top: 1px solid var(--linha); margin-top: 2.5rem; padding-top: 1.25rem; font-size: .85rem; }
.rodape .legal p { max-width: none; }
@media (max-width: 760px) { .rodape .colunas { grid-template-columns: 1fr; } }

/* WhatsApp flutuante no celular */
.whats-flutuante { display: none; position: fixed; right: 1rem; bottom: 1rem; z-index: 6; background: var(--whats); color: #fff; text-decoration: none; font-weight: 700; padding: .8rem 1.15rem; border-radius: 999px; box-shadow: 0 6px 18px rgba(29,32,51,.22); }
@media (max-width: 760px) { .whats-flutuante { display: block; } body { padding-bottom: 4rem; } }

.aviso-cookies { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 7; max-width: 34rem; background: #fff; border: 1px solid var(--linha); border-radius: var(--raio); padding: 1rem 1.1rem; box-shadow: 0 8px 24px rgba(29,32,51,.16); font-size: .93rem; }
.aviso-cookies p { margin: 0 0 .75rem; }
.aviso-cookies .acoes { margin: 0; gap: .5rem; }
.aviso-cookies button { font: inherit; cursor: pointer; padding: .5rem 1rem; }