
@font-face{font-family:'Bricolage';src:url('/assets/fonts/bricolage.ttf');font-display:swap}
@font-face{font-family:'Instrument';src:url('/assets/fonts/instrument.ttf');font-display:swap}
:root{
  --ink:#20261F; --paper:#FBFAF6; --verde:#175447; --verde-esc:#0E3A30;
  --ambar:#E9A13B; --areia:#F0EADF; --neutro:#8E948E; --linha:#E4DFD3;
  --wa:#25D366; --raio:16px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Instrument',system-ui,sans-serif;background:var(--paper);color:var(--ink);
  font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,.disp{font-family:'Bricolage',sans-serif;font-weight:800;line-height:1.08;
  letter-spacing:-.015em}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- topo ---------- */
.topo{position:sticky;top:0;z-index:40;background:rgba(251,250,246,.92);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--linha)}
.topo .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-family:'Bricolage';font-weight:800;font-size:1.25rem;color:var(--verde)}
.logo em{font-style:normal;color:var(--ambar)}
.topo nav{display:flex;gap:18px;font-size:.92rem}
.topo nav a:hover{color:var(--verde)}
.topo .b-wa{display:none}
@media(min-width:760px){.topo .b-wa{display:inline-flex}}

/* ---------- hero ---------- */
.hero{padding:56px 0 8px}
.hero h1{font-size:clamp(2.1rem,6.5vw,3.6rem);max-width:14ch}
.hero h1 em{font-style:normal;color:var(--verde);
  background:linear-gradient(transparent 68%,rgba(233,161,59,.45) 0)}
.hero p{margin-top:14px;color:#565C55;max-width:46ch}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 6px}
.chip{border:1.5px solid var(--linha);background:#fff;border-radius:999px;
  padding:7px 14px;font-size:.88rem;cursor:pointer;color:#454B44;transition:.15s}
.chip:hover{border-color:var(--verde)}
.chip.on{background:var(--verde);border-color:var(--verde);color:#fff}
select.chip{appearance:none;-webkit-appearance:none;padding-right:26px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23454B44' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center}

/* ---------- trilho de destaques (assinatura: swipe estilo stories) ---------- */
.sec-t{display:flex;align-items:baseline;gap:12px;margin:34px 0 14px}
.sec-t h2{font-size:1.35rem}
.sec-t .cnt{color:var(--neutro);font-size:.85rem}
.trilho{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:14px;
  overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 20px 18px;
  margin:0 -20px;scrollbar-width:none}
.trilho::-webkit-scrollbar{display:none}
.trilho>*{scroll-snap-align:center}
@media(min-width:640px){.trilho{grid-auto-columns:42%}}
@media(min-width:1000px){.trilho{grid-auto-columns:31.5%}}

/* ---------- cards ---------- */
.grade{display:grid;gap:22px;grid-template-columns:1fr;padding-bottom:8px}
@media(min-width:640px){.grade{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.grade{grid-template-columns:1fr 1fr 1fr}}
.card{border-radius:var(--raio);overflow:hidden;background:#fff;
  border:1px solid var(--linha);transition:transform .18s, box-shadow .18s}
.card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(23,84,71,.13)}
.card .ft{position:relative;aspect-ratio:4/5;background:var(--areia)}
.card .ft img{width:100%;height:100%;object-fit:cover}
.card.locado .ft img{filter:grayscale(.55) brightness(.92)}
.badge{position:absolute;top:12px;left:12px;border-radius:999px;padding:5px 12px;
  font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.badge.disp{background:var(--ambar);color:#3A2A08}
.badge.loc{background:rgba(32,38,31,.82);color:#fff}
/* etiqueta-chaveiro (assinatura) */
.tag-preco{position:absolute;left:12px;bottom:12px;background:var(--paper);
  border-radius:10px;padding:8px 14px 8px 26px;font-family:'Bricolage';
  font-weight:800;font-size:1.05rem;color:var(--verde-esc);
  box-shadow:0 4px 14px rgba(0,0,0,.22)}
.tag-preco::before{content:"";position:absolute;left:9px;top:50%;width:9px;height:9px;
  transform:translateY(-50%);border:2.5px solid var(--ambar);border-radius:50%}
.tag-preco small{display:block;font-family:'Instrument';font-weight:500;
  font-size:.68rem;color:#6A7069;margin-top:-2px}
.card .info{padding:14px 16px 16px}
.card .info h3{font-size:1.02rem;font-weight:700}
.card .meta{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;
  color:#5B615A;font-size:.85rem}
.card .bairro{color:var(--verde);font-size:.82rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}

/* ---------- página do imóvel ---------- */
.galeria{display:grid;grid-auto-flow:column;grid-auto-columns:100%;gap:8px;
  overflow-x:auto;scroll-snap-type:x mandatory;border-radius:var(--raio);
  scrollbar-width:none;background:var(--areia)}
.galeria::-webkit-scrollbar{display:none}
.galeria>*{scroll-snap-align:center;aspect-ratio:4/3;position:relative}
.galeria img,.galeria video{width:100%;height:100%;object-fit:cover;border-radius:var(--raio)}
@media(min-width:900px){.galeria{grid-auto-columns:58%}.galeria>*{aspect-ratio:4/3.2}}
.gal-dica{color:var(--neutro);font-size:.8rem;margin:8px 2px}
.det{display:grid;gap:34px;margin-top:26px}
@media(min-width:900px){.det{grid-template-columns:1.5fr 1fr}}
.det h1{font-size:clamp(1.5rem,4vw,2.2rem)}
.linha-meta{display:flex;flex-wrap:wrap;gap:8px 20px;margin:14px 0;color:#4B514A}
.desc{white-space:pre-line;color:#3C423B;margin-top:10px}
.painel{border:1px solid var(--linha);border-radius:var(--raio);background:#fff;
  padding:22px;position:sticky;top:84px;height:fit-content}
.painel .disp{font-size:2rem;color:var(--verde-esc)}
.painel .disp small{font-family:'Instrument';font-weight:500;font-size:.9rem;color:var(--neutro)}
.breakdown{margin:14px 0;border-top:1px dashed var(--linha);padding-top:12px;font-size:.92rem}
.breakdown div{display:flex;justify-content:space-between;padding:3px 0;color:#4B514A}
.breakdown .tot{border-top:1px solid var(--linha);margin-top:8px;padding-top:9px;
  font-weight:700;color:var(--ink)}
.b-wa,.b-mail,.b-avise{display:flex;align-items:center;justify-content:center;gap:9px;
  border-radius:12px;padding:13px 18px;font-weight:700;font-size:.98rem;width:100%;
  margin-top:10px;transition:filter .15s;border:0;cursor:pointer}
.b-wa{background:var(--wa);color:#fff}
.b-mail{background:var(--paper);border:1.5px solid var(--linha);color:var(--ink)}
.b-avise{background:var(--verde);color:#fff}
.b-wa:hover,.b-mail:hover,.b-avise:hover{filter:brightness(.95)}
.topo .b-wa{width:auto;margin:0;padding:8px 16px;font-size:.88rem}
.mapa{margin-top:30px}
.mapa iframe{width:100%;height:340px;border:0;border-radius:var(--raio)}
.mapa .aviso{color:var(--neutro);font-size:.8rem;margin-top:6px}
.selo-loc{background:var(--areia);border-radius:12px;padding:14px 16px;margin-bottom:14px;
  font-size:.92rem;color:#4B514A}

/* barra fixa mobile (conversão) */
.barra-m{position:fixed;left:0;right:0;bottom:0;z-index:50;background:#fff;
  border-top:1px solid var(--linha);padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  display:flex;align-items:center;gap:14px}
.barra-m .p{font-family:'Bricolage';font-weight:800;font-size:1.15rem;color:var(--verde-esc)}
.barra-m .p small{display:block;font-family:'Instrument';font-weight:500;
  font-size:.7rem;color:var(--neutro)}
.barra-m .b-wa,.barra-m .b-avise{margin:0;flex:1;padding:11px}
@media(min-width:900px){.barra-m{display:none}}
body.tem-barra{padding-bottom:84px}
@media(min-width:900px){body.tem-barra{padding-bottom:0}}

/* ---------- institucional ---------- */
.inst{background:var(--verde-esc);color:#EDEBE2;margin-top:64px;padding:56px 0}
.inst h2{color:#fff;font-size:1.6rem;margin-bottom:12px}
.inst p{max-width:60ch;white-space:pre-line;color:#C9CFC5}
.inst .duo{display:grid;gap:44px}
@media(min-width:900px){.inst .duo{grid-template-columns:1fr 1fr}}
.inst .b-wa{width:auto;display:inline-flex;margin-top:18px}
.rodape{background:var(--verde-esc);color:#9DB0A6;padding:26px 0 34px;
  border-top:1px solid rgba(255,255,255,.12);font-size:.85rem}
.rodape .wrap{display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:space-between}
.rodape a{color:#C9CFC5}
.sem-res{color:var(--neutro);padding:30px 0;text-align:center;display:none}

:focus-visible{outline:2.5px solid var(--ambar);outline-offset:2px}
