/* Tema Lar — imobiliária: limpo, azul-petróleo, areia e cartões de imóveis */
@font-face { font-family: "Poppins"; src: url("/assets/fontes/poppins-800.woff2") format("woff2"); font-weight: 800; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/assets/fontes/poppins-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
:root {
  --cor: #0f5c6e; --cor-2: #0b4655; --areia: #d9b98c; --fundo: #ffffff; --fundo-2: #f4f1ec; --tinta: #13262e; --texto: #5c6b71; --linha: #e5e1d8;
  --raio: 18px; --raio-botao: 12px; --fonte: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; --titulo: "Poppins", sans-serif; --rodape-fundo: #0c2329;
}
h1, h2 { font-weight: 800; letter-spacing: -.03em; }
h3 { font-weight: 600; }

.hero { min-height: clamp(600px, 86svh, 860px); display: flex; align-items: center; background-size: cover; background-position: center; position: relative; color: #fff; padding: 110px 0 80px; }
.hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8, 28, 34, .45), rgba(8, 28, 34, .78)); }
.hero-conteudo { position: relative; text-align: center; }
.hero h1 { color: #fff; max-width: 15em; margin-inline: auto; animation: subir 1s both; }
.hero-sub { font-size: 1.2rem; max-width: 36em; margin: 0 auto 36px; color: rgba(255, 255, 255, .9); animation: subir 1s .15s both; }
@keyframes subir { from { opacity: 0; transform: translateY(30px); } }
.busca { display: grid; grid-template-columns: 1fr 1fr 1.4fr auto; gap: 12px; align-items: end; background: #fff; border-radius: 22px; padding: 18px; max-width: 980px; margin: 0 auto; text-align: left; box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .6); animation: subir 1s .3s both; }
.busca label { display: block; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--texto); margin: 0 0 6px 4px; }
.busca select, .busca input { width: 100%; height: 52px; border: 1px solid var(--linha); border-radius: 12px; padding: 0 14px; font: inherit; font-size: 16px; color: var(--tinta); background: var(--fundo-2); }

.cabeca-linha { max-width: none; display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; }
.cabeca-linha h2 { margin-bottom: 0; }
.abas { margin: 0; }
.imovel { background: #fff; border-radius: var(--raio); overflow: hidden; border: 1px solid var(--linha); transition: transform .35s, box-shadow .35s; }
.imovel:hover { transform: translateY(-6px); box-shadow: 0 30px 50px -34px rgba(19, 38, 46, .55); }
.imovel figure { position: relative; overflow: hidden; }
.imovel img { width: 100%; aspect-ratio: 18/13; object-fit: cover; transition: transform .7s; }
.imovel:hover img { transform: scale(1.07); }
.imovel figcaption { position: absolute; left: 14px; top: 14px; background: #fff; color: var(--cor); font-weight: 700; font-size: .78rem; padding: 6px 12px; border-radius: 999px; }
.imovel > div { padding: 20px 22px 24px; }
.imovel .preco { font-family: var(--titulo); font-weight: 800; font-size: 1.45rem; color: var(--cor); margin: 0 0 4px; }
.imovel h3 { font-size: 1.1rem; margin-bottom: 6px; }
.local { margin: 0; font-size: .92rem; }
.local::before { content: "📍 "; }
.caract { margin: 12px 0 0; padding-top: 12px; border-top: 1px solid var(--linha); font-size: .9rem; color: var(--tinta); font-weight: 600; }

.num { display: block; font-family: var(--titulo); font-weight: 800; font-size: 2.2rem; color: var(--areia); line-height: 1; margin-bottom: 14px; }
.numeros.mini { grid-template-columns: repeat(3, 1fr); text-align: left; margin-top: 30px; }
.numeros.mini strong { font-size: 2.4rem; }
.foto-moldura { position: relative; isolation: isolate; }
.foto-moldura::before { content: ""; position: absolute; inset: -20px 40px 40px -20px; background: var(--areia); border-radius: var(--raio); z-index: -1; opacity: .5; }
.foto-moldura img { aspect-ratio: 4/3; }
.depoimento { background: #fff; }
@media (max-width: 900px) { .busca { grid-template-columns: 1fr 1fr; } .busca input, .busca .botao { grid-column: 1 / -1; } }
@media (max-width: 580px) { .busca { grid-template-columns: 1fr; } .numeros.mini { grid-template-columns: repeat(3, 1fr); } .numeros.mini strong { font-size: 1.8rem; } }