@import url("https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;500;600;700;800&display=swap");
:root{
  --bg0:#f7f7f9;
  --bg1:#ffffff;
  --card:#ffffff;
  --card2:#ffffff;
  --text:#111827;
  --muted:#6b7280;
  --border: rgba(17,24,39,.10);
  --shadow: 0 18px 60px rgba(17,24,39,.12);
  --shadowSoft: 0 10px 30px rgba(17,24,39,.08);
  --shadowHover: 0 22px 70px rgba(17,24,39,.16);
  --ring: 0 0 0 4px rgba(199,106,42,.18);

  /* Branding (corporativo moderno + toque premium) */
  --brand:#0B3D4A;       /* azul petróleo */
  --cta:#C76A2A;         /* laranja queimado (CTA) */
  --cta2:#E08A3B;
  --accent: var(--cta);
  --accent2: var(--brand);
  --danger:#e11d48;
  --radius:18px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:linear-gradient(180deg,var(--bg0),var(--bg1));
color:var(--text);
font-family: 'Work Sans', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
overflow-x:hidden;
}

a{color:inherit;text-decoration:none}
.container{width:min(1120px, calc(100% - 32px));margin:0 auto}

/* Full-width layout helper (used on the property page) */
.pageFull{width:100%;margin:0; padding: 0 0 40px; overflow-x:hidden;}
@media (min-width: 1200px){ .pageFull{padding-left: 28px; padding-right: 28px;} }

.sep{height:1px;background:var(--border);margin:18px 0}

.nav{
  position:sticky;top:0;z-index:20;
  backdrop-filter: blur(14px);
  background: rgba(255,255,255,.86);
  border-bottom:1px solid var(--border);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:12px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.2px}
.logo{
  width:34px;height:34px;border-radius:12px;
  background: radial-gradient(circle at 30% 30%, var(--cta2), var(--brand));
  box-shadow: 0 12px 26px rgba(11,61,74,.14);
}
.badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 12px;border: none;
border-radius:999px;
  font-size:12px;color:var(--muted);
  background: rgba(17,24,39,.03);
}
.badge strong{color:var(--text);font-weight:800}

.hero{padding:34px 0 12px}
.hero-grid{
  display:grid;gap:18px;align-items:start;
  grid-template-columns: 1fr;
}
@media (min-width: 920px){
  .hero-grid{grid-template-columns: 1.2fr .8fr}
}
.h1{
  font-size: 40px;line-height:1.05;margin:0 0 10px;
  letter-spacing:-.8px;
}
@media (max-width:480px){ .h1{font-size: 32px;} }
.p{margin:0;color:var(--muted);line-height:1.6;font-size:15px}
.kpis{
  display:grid;grid-template-columns: repeat(3, 1fr);gap:10px;margin-top:14px
}
.kpi{
  border: none;
border-radius: var(--radius);
  background: rgba(17,24,39,.03);
  padding:12px; box-shadow: 0 10px 28px rgba(17,24,39,.10);
}
.kpi .t{font-size:12px;color:var(--muted)}
.kpi .v{font-size:18px;font-weight:900;margin-top:4px}

.cta-box{
  border: none;
border-radius: calc(var(--radius) + 6px);
  background: linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.92));
  padding:16px;
  box-shadow: var(--shadow);
}
.cta-title{margin:0 0 8px;font-weight:900;font-size:16px}
.cta-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}

.input, .select, .button, textarea{
  width:100%;padding:12px 12px;border-radius:14px;border: none;
background: rgba(17,24,39,.03); color:var(--text); outline:none;
}
.input::placeholder{color: rgba(154,167,191,.7)}
.select{appearance:none;background-image:
  linear-gradient(45deg, transparent 50%, rgba(234,240,255,.8) 50%),
  linear-gradient(135deg, rgba(234,240,255,.8) 50%, transparent 50%);
  background-position: calc(100% - 18px) calc(1em + 2px), calc(100% - 13px) calc(1em + 2px);
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 34px;
}
.button{
  cursor:pointer;font-weight:900;letter-spacing:.15px;
  background: linear-gradient(180deg, var(--cta2), var(--cta));
  border-color: rgba(199,106,42,.45);
  color:#fff;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.button:hover{transform: translateY(-1px); background: linear-gradient(180deg, #E6944B, #D47633);}
.button.secondary{
  background: rgba(255,255,255,.04);
  border-color: var(--border);
  font-weight:800;
  color: var(--text);
}
.button.secondary:hover{transform: translateY(-1px); background: rgba(255,255,255,.06);}

.small{font-size:12px;color:var(--muted);line-height:1.5}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.chip{
  border: none;
background: rgba(17,24,39,.03);
  color: var(--muted);
  border-radius: 999px;
  padding:6px 10px;
  font-size:12px;
}
.chip b{color:var(--text)}

.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;padding:14px 0 28px}
.panel{
  grid-column: span 12;
  border: none;
border-radius: calc(var(--radius) + 6px);
  background: rgba(17,24,39,.03);
  box-shadow: 0 18px 55px rgba(17,24,39,.10);
  overflow:hidden;
}
.panel-h{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 14px;border-bottom:1px solid var(--border);
}
.panel-h .t{font-weight:900}
.panel-h .muted{color:var(--muted);font-size:12px}
.panel-b{padding:12px 14px}

.filters{
  display:grid;grid-template-columns:repeat(12,1fr);gap:10px
}
.filters .full{grid-column:span 12}
.filters .half{grid-column:span 6}
@media (min-width: 860px){
  .filters .q{grid-column:span 12}
  .filters .c{grid-column:span 4}
  .filters .b{grid-column:span 4}
  .filters .t{grid-column:span 4}
  .filters .r{grid-column:span 3}
  .filters .pmin{grid-column:span 3}
  .filters .pmax{grid-column:span 3}
  .filters .sort{grid-column:span 3}
}

.list{grid-column:span 12;display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.item{
  grid-column: span 12;
  background: linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.92));
  border: none;
border-radius: calc(var(--radius) + 6px);
  overflow:hidden;
  box-shadow: 0 18px 55px rgba(17,24,39,.10);
  transform: translateY(0);
  transition: transform .14s ease, border-color .14s ease;
}
.item:hover{transform: translateY(-3px); border-color: rgba(22,163,74,.30);}

.thumb{
  width:100%; aspect-ratio: 16/10; object-fit:cover; display:block;
  filter: saturate(1.05) contrast(1.02);
}
.card-pad{padding:14px}
.title{margin:0 0 6px;font-size:16px;line-height:1.25}
.meta{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:12px}
.price{margin-top:10px;font-weight:950;letter-spacing:.2px}
.tagrow{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:10px}
.pill{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;border-radius: 999px;border: none;
background: rgba(17,24,39,.03);
  font-size:12px;color:var(--muted);
}
.pill.destaque{border-color: rgba(14,165,233,.28); background: rgba(14,165,233,.10); color: rgba(234,240,255,.92)}
.pill.cod{border-color: rgba(255,255,255,.10);}

@media (min-width: 720px){ .item{grid-column:span 6} }
@media (min-width: 1040px){ .item{grid-column:span 4} }

.split{display:grid;grid-template-columns:1fr;gap:14px;padding:16px 0 30px}
@media (min-width: 920px){ .split{grid-template-columns:1.4fr .9fr} }

.card{background: rgba(17,24,39,.03); border: none;
border-radius: calc(var(--radius) + 6px); overflow:hidden; box-shadow: var(--shadow); }
.gallery{display:grid;grid-template-columns:2fr 1fr;gap:10px;padding:14px}
.gallery img{width:100%;height:100%;object-fit:cover;border-radius:14px;border:1px solid var(--border)}
.gallery .main{aspect-ratio:16/11}
.gallery .side{display:grid;grid-template-rows:1fr 1fr;gap:10px}

.kv{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.kv .k{
  background: rgba(17,24,39,.03); border: none;
border-radius:14px;padding:12px
}

.toast{
  position: fixed;
  right: 14px; bottom: 14px;
  max-width: 360px;
  padding: 12px 14px;
  border: none;
border-radius: 16px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 55px rgba(17,24,39,.16);
  display:none;
}
.toast.show{display:block; animation: pop .16s ease;}
@keyframes pop{from{transform:translateY(8px);opacity:.0} to{transform:translateY(0);opacity:1}}
.toast .t{font-weight:900}
.toast .m{color:var(--muted);font-size:12px;margin-top:4px}

.fab{
  position: fixed;
  left: 14px;
  bottom: 14px;
  display:flex;align-items:center;gap:10px;
  padding: 12px 14px;
  border-radius: 999px;
  background: rgba(22,163,74,.14);
  border: 1px solid rgba(22,163,74,.28);
  box-shadow: 0 18px 55px rgba(17,24,39,.16);
  font-weight:900;
}
.fab:hover{background: rgba(82,255,168,.18)}
.fab small{font-weight:700;color: rgba(234,240,255,.82);opacity:.9}

.footer{
  border-top:1px solid var(--border);
  padding:22px 0 46px;
  color:var(--muted);
  font-size:12px
}
.footer-grid{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width: 860px){ .footer-grid{grid-template-columns: 1fr 1fr} }
.footer a{color: rgba(234,240,255,.85)}

/* nav links */
.nav-links{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.nav-link{
  padding:8px 10px;border-radius:12px;border:1px solid transparent;
  color: rgba(234,240,255,.85); font-size:13px;
}
.nav-link:hover{border-color: rgba(255,255,255,.10); background: rgba(17,24,39,.03);}

.h2{margin:0 0 10px;font-size:22px;letter-spacing:-.3px}
.h3{margin:14px 0 8px;font-size:16px}
.ul{margin:10px 0 0 18px;color:var(--muted);line-height:1.6}
.ol{margin:10px 0 0 18px;color:var(--muted);line-height:1.6}

.two-col{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width: 920px){ .two-col{grid-template-columns: 1.2fr .8fr} }

.row{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width: 720px){ .row{grid-template-columns: 1fr 1fr} }

.form{display:grid;gap:10px;margin-top:10px}

/* card actions */
.card-actions{
  display:flex; gap:10px; padding: 12px 14px; border-top: 1px solid var(--border);
  background: rgba(255,255,255,.02);
}
.btn-icon{cursor:pointer}
.btn-icon.on{
  border-color: rgba(82,255,168,.35);
  background: rgba(82,255,168,.10);
  color: rgba(234,240,255,.92);
}

/* compare table */
.cmp{width:100%;border-collapse:separate;border-spacing:0;min-width: 720px}
.cmp th, .cmp td{border-bottom:1px solid var(--border); padding:12px; vertical-align:top}
.cmp th{position:sticky; top:0; background: rgba(255,255,255,.92); backdrop-filter: blur(10px)}
.cmp td{color: rgba(234,240,255,.88)}
.cmp tr:hover td{background: rgba(255,255,255,.02)}

/* FAQ */
.faq{display:grid;gap:10px}
.faq-q{
  text-align:left; width:100%;
  padding: 12px 14px;
  border-radius: 16px;
  border: none;
background: rgba(17,24,39,.03);
  color: var(--text);
  font-weight: 900;
  cursor:pointer;
}
.faq-q.open{border-color: rgba(106,166,255,.30); background: rgba(106,166,255,.08)}
.faq-a{
  padding: 0 14px;
  color: var(--muted);
  line-height: 1.6;
  display:none;
}
.faq-a.open{display:block; padding: 10px 14px 2px}

/* cookie banner */
.cookie{
  position: fixed; left:0; right:0; bottom:0;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--border);
  z-index: 50;
}
.cookie-inner{display:flex;gap:14px;justify-content:space-between;align-items:center;padding:14px 0;flex-wrap:wrap}

.topstrip{
  background: #ffffff;
  border-bottom:1px solid var(--border);
}
.topstrip-inner{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 0;
  flex-wrap:wrap;
}
.topstrip a{color: rgba(17,24,39,.86); text-decoration: underline; text-underline-offset: 2px}

/* Emobi-inspired (clean white) layout */

.topbar{
  background:#ffffff;
  border-bottom:1px solid var(--border);
  font-size:13px;
}
.topbar-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:10px 0; flex-wrap:wrap;
}
.topbar-left{display:flex; align-items:center; gap:10px; flex-wrap:wrap; color: var(--muted);}
.topbar-left a{color: rgba(17,24,39,.82); text-decoration:none}
.topbar-left a:hover{text-decoration:underline; text-underline-offset:2px}
.mini{opacity:.75}
.dot{opacity:.5}
.topbar-right{display:flex; gap:10px; flex-wrap:wrap}
.toplink{color: rgba(17,24,39,.82); text-decoration:none; padding:6px 8px; border-radius:10px}
.toplink:hover{background: rgba(17,24,39,.04)}

.nav-light{background: rgba(255,255,255,.96)}
.footer-light{background:#ffffff}

.breadcrumb{
  color: var(--muted);
  font-size:13px;
  display:flex; gap:8px; align-items:center; flex-wrap:wrap;
  padding: 8px 0;
}
.breadcrumb a{color: rgba(17,24,39,.78); text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}
.breadcrumb span{opacity:.7}

.page-title{
  margin: 6px 0 10px;
  font-size: 28px;
  letter-spacing: -.4px;
}
.page-sub{margin:0 0 14px; color:var(--muted)}
@media(max-width:520px){ .page-title{font-size:24px;} }

.results-bar{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding: 10px 0 14px; flex-wrap:wrap;
  border-bottom:1px solid var(--border);
}
.results-actions{display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap}
.sortbox{display:flex; flex-direction:column; gap:6px}

.btn-sm{padding:10px 12px; border-radius:12px}
.select-sm{padding:10px 34px 10px 12px; border-radius:12px}

.layout{
  display:grid;
  grid-template-columns: 1fr;
  gap: 18px;
  padding: 16px 0 38px;
}
@media(min-width: 980px){
  .layout{grid-template-columns: 320px 1fr;}
}

.sidebar{
  border: none;
border-radius: 16px;
  background:#fff;
  box-shadow: var(--shadow);
  overflow:hidden;
  display:none;
}
.sidebar.open{display:block}
@media(min-width: 980px){
  .sidebar{display:block; position:sticky; top: 14px; height: fit-content;}
}

.sidebar-head{
  display:flex; align-items:center; justify-content:space-between;
  padding: 12px 14px;
  border-bottom:1px solid var(--border);
}
.sidebar-head .t{font-weight:900}
.sidebar-body{padding: 12px 14px}
.field{margin-bottom:12px}
.label{font-size:12px; color: var(--muted); margin-bottom:6px}
.row2{display:grid; grid-template-columns: 1fr 1fr; gap:10px}

.input-sm{padding:10px 12px; border-radius:12px}
.noscroll{overflow:hidden}

/* cards list (row style) */
.cards{display:grid; gap:14px}
.card-row{
  display:grid;
  grid-template-columns: 1fr;
  border: none;
border-radius: 16px;
  overflow:hidden;
  background:#fff;
  box-shadow: 0 10px 28px rgba(17,24,39,.08);
}
@media(min-width: 760px){
  .card-row{grid-template-columns: 320px 1fr;}
  .card-img img{aspect-ratio: 3/4;}
  .card-info{display:flex; flex-direction:column;}
  .actions{margin-top:auto;}
}

.card-img{position:relative; display:block; background:#f3f4f6}
.card-img img{width:100%; height:auto; object-fit:cover; display:block; aspect-ratio: 4/5; object-position:50% 25%}
.badges{
  position:absolute; left:10px; top:10px;
  display:flex; gap:8px; flex-wrap:wrap;
}
.badge2{
  background: rgba(22,163,74,.12);
  border: 1px solid rgba(22,163,74,.24);
  color: rgba(17,24,39,.86);
  padding: 6px 10px;
  border-radius: 999px;
  font-size:12px;
  font-weight: 900;
}
.tag{
  background: rgba(14,165,233,.10);
  border: 1px solid rgba(14,165,233,.22);
  color: rgba(17,24,39,.86);
  padding: 6px 10px;
  border-radius: 999px;
  font-size:12px;
  font-weight: 800;
}

.card-info{padding: 14px 14px 12px}
.card-title{
  font-size:16px;
  font-weight: 900;
  color: rgba(17,24,39,.92);
  text-decoration:none;
}
.card-title:hover{text-decoration:underline; text-underline-offset:2px}
.code{margin-top:6px}

.price-line{margin-top:10px; font-weight:900}
.price-line .kind{color: rgba(17,24,39,.82); margin-right:8px}
.price-line .to{font-size:18px}
.price-line .from{color: var(--muted); text-decoration: line-through; margin: 0 8px}
.price-line .save{
  background: rgba(225,29,72,.10);
  border: 1px solid rgba(225,29,72,.18);
  color: rgba(17,24,39,.86);
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  margin-right: 10px;
}
.cost{margin-top:6px}

.stats{
  display:flex; flex-wrap:wrap; gap:12px;
  margin-top: 10px;
  color: rgba(17,24,39,.82);
  font-size:13px;
}
.actions{
  display:flex; gap:10px; align-items:center; justify-content:flex-start;
  margin-top: 12px;
}
.btn-more{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 10px 14px;
  border-radius: 12px;
  background: rgba(17,24,39,.06);
  border: 1px solid rgba(17,24,39,.10);
  color: rgba(17,24,39,.88);
  font-weight: 900;
  text-decoration:none;
}
.btn-more:hover{background: rgba(17,24,39,.08)}
.btn-mini{
  width: 40px; height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(17,24,39,.10);
  background: #fff;
  cursor:pointer;
}
.btn-mini.on{
  border-color: rgba(22,163,74,.28);
  background: rgba(22,163,74,.08);
}

.chip-btn{
  cursor:pointer;
  border:1px solid rgba(17,24,39,.10);
  background: rgba(17,24,39,.03);
  color: rgba(17,24,39,.78);
}
.chip-btn.on{
  border-color: rgba(22,163,74,.30);
  background: rgba(22,163,74,.10);
  color: rgba(17,24,39,.88);
}

/* pagination */
.pagination{
  display:flex; align-items:center; justify-content:center;
  gap:10px; padding: 18px 0 0;
}
.pag-btn{
  width: 38px; height: 38px; border-radius: 12px;
  border: 1px solid rgba(17,24,39,.10);
  background: #fff; cursor:pointer;
}
.pag-pages{display:flex; gap:8px}
.pag-num{
  width: 38px; height: 38px; border-radius: 12px;
  border: 1px solid rgba(17,24,39,.10);
  background: #fff; cursor:pointer; font-weight:900;
}
.pag-num.on{
  border-color: rgba(22,163,74,.30);
  background: rgba(22,163,74,.10);
}

/* page grid for forms */
.page-grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width: 980px){ .page-grid{grid-template-columns: 1.2fr .8fr} }
.page-card{box-shadow: var(--shadow)}

/* Homepage hero + featured */
/* Utilbras-like hero (entrada) */
.heroU{
  /* colado com a barra vermelha (sem espaço acima) */
  margin-top: 0;
  margin-bottom: 8px;

  /* IMPORTANTE: o HERO está DENTRO do <main class="container">.
     Então aqui NÃO usamos 100vw / margin calc (isso causa scroll horizontal).
     Mantemos 100% para alinhar perfeitamente com o restante do site. */
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  /*
    O HERO precisa cortar o fundo (slider) e o overlay, mas o carrossel
    de coverflow pode precisar "vazar" para mostrar os slides laterais.
    Por padrão mantemos hidden e liberamos no mobile via media query.
  */
  overflow: hidden;

  border: none;
  /* sem arredondar no topo para encostar no header */
  border-radius: 18px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;

  /* Fundo ocupando a área inteira */
  background: #0B3D4A;
  background-color: #e5e7eb;
  box-shadow: 0 18px 60px rgba(17,24,39,.10);
  position:relative;
}

/* Preferir WebP quando suportado (mantém JPG como fallback) */
/* Mobile: deixa o coverflow aparecer nas laterais (igual no PC) */
@media (max-width: 759px){
  .heroU{
    overflow: visible;
  }
}

/* Desktop: HERO full-bleed (remove faixas brancas laterais) sem criar scrollbar */
@media (min-width: 760px){
  .heroU{
    width:100vw;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    border-radius:0;
    overflow-x:clip;
  }
  /* Usa dvw quando disponível (evita o 100vw incluir a largura do scrollbar) */
  @supports (width: 100dvw){
    .heroU{
      width:100dvw;
      margin-left:calc(50% - 50dvw);
      margin-right:calc(50% - 50dvw);
    }
  }

  /* Ajusta também os overlays para não deixar cantos arredondados no full-bleed */
  .heroU::before,
  .heroU-slider{ border-radius: 0 !important; }
}



.heroU::before{
  content:"";
  position:absolute; inset:0;
  border-radius: 18px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  /* overlay leve para o texto ficar legível sem "lavar" a imagem */
  background: linear-gradient(90deg,
    rgba(17,24,39,.46) 0%,
    rgba(17,24,39,.22) 52%,
    rgba(17,24,39,.10) 100%);
  pointer-events:none;
}

/* HERO SLIDER (autoplay) */
/* === Premium clean: remove hero background photo behind coverflow === */
.heroU-slider{ display:none !important; }


.heroU-slider{
  position:absolute; inset:0;
  z-index:0;
  pointer-events:none;
  border-radius: 18px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  overflow: hidden;
}
.heroU-slider .heroSlide{
  position:absolute; inset:0;
  background-size:cover;
  background-position:center;
  opacity:0;
  transition: opacity 900ms ease;
  transform: scale(1.02);
}
.heroU-slider .heroSlide.isActive{ opacity:1; }

/* garante camadas: slider (0) -> overlay (1) -> conteúdo (2) */
.heroU::before{ z-index:1; }
.heroU-inner{ z-index:2; }
.heroU-inner{
  position:relative;
  /* padding e gaps responsivos também por ALTURA (evita "cortar" em telas baixas) */
  padding: clamp(14px, 2.4vh, 28px);
  display: grid;
  gap: clamp(14px, 2.8vh, 28px);
  align-items: center;
  justify-items: center;
  max-width: 1120px;
  margin: 0 auto;
  grid-template-columns: 1fr;
}
@media(min-width: 760px){
  .heroU-inner{
    /* mantém layout em coluna no desktop; só aumenta levemente o respiro */
    padding: clamp(18px, 2.6vh, 32px);
    gap: clamp(18px, 3vh, 34px);
  }
}
.heroU-copy{
  color: rgba(255,255,255,.98);
  text-shadow: 0 6px 24px rgba(0,0,0,.35);
  max-width: 820px;
  text-align:center;
  margin: 0 auto;
}
@media(min-width: 760px){
  .heroU-copy{ padding: 0; }
}
.heroU-h1{
  font-size: clamp(28px, 3.2vw, 46px);
  font-weight: 1000;
  letter-spacing: -0.9px;
  line-height: 1.05;
  margin: 0;
}
.heroU-sub{
  margin: 0 0 10px 0;
  color: rgba(255,255,255,.84);
  font-weight: 800;
}


.heroU-desc{
  margin: 12px auto 18px auto;
  max-width: 680px;
  color: rgba(255,255,255,.92);
  font-weight: 650;
  font-size: 16px;
}

.heroU-cta{
  display:flex;
  gap: 12px;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  margin-top: 10px;
}

.heroU-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 14px 22px;
  border-radius: 999px;
  text-decoration:none;
  font-weight: 900;
  letter-spacing: .2px;
  transition: transform .12s ease, opacity .12s ease;
  will-change: transform;
}

.heroU-btn:hover{
  transform: translateY(-1px);
  opacity: .96;
}

.heroU-btnPrimary{
  background: #25D366;
  color: #fff;
  box-shadow: 0 12px 28px rgba(0,0,0,.25);
}

.heroU-btnGhost{
  background: transparent;
  color: #fff;
  border: 2px solid rgba(255,255,255,.92);
}

@media (max-width: 480px){
  .heroU-btn{ width: 100%; }
  .heroU-desc{ font-size: 15px; }
}


/* HERO - destaque de imagens (no meio) */
.heroU-media{
  position:relative;
  z-index: 2;
  width:100%;
  max-width: 1120px;
  margin: 0 auto;
  /* remove a borda/caixa externa do hero */
  border-radius: 0;
  overflow: visible;
  border: none;
  background: transparent;
  box-shadow: none;
}

.heroApartSlider{
  position: relative;
  perspective: 1200px;
  width: 100%;
  /* altura real vem do .swiper (vh/clamp). Evita "forçar" altura fixa. */
  min-height: 0;
}

/* === HERO Coverflow background (Opção 3: blur dinâmico da imagem ativa) === */
.heroApartSlider .cf-bg{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-size:cover;
  background-position:50% 20%;
  filter: blur(28px) brightness(0.55) saturate(1.10);
  transform: scale(1.12);
  opacity: 1;
  transition: background-image 180ms ease, opacity 180ms ease;
}

/* Vinheta suave nas laterais para “sumir” o verde e focar no centro */
.heroApartSlider .cf-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(ellipse at center, rgba(8,10,12,0.20) 0%, rgba(8,10,12,0.62) 72%, rgba(8,10,12,0.78) 100%);
}

/* Mantém o coverflow sempre acima do fundo blur */
.heroApartSlider .cf-track{
  z-index: 2;
}

/* --- HERO coverflow (Swiper) --- */

/* --- Swiper core minimal (scoped ao HERO) ---
   (Garante que o carrossel funcione mesmo sem importar o CSS oficial do Swiper) */
.heroApartSlider.swiper{
  position: relative;
  overflow: visible; /* deixa o glow e coverflow aparecer */
}
.heroApartSlider.swiper .swiper-wrapper{
  display: flex;
  width: 100%;
  height: 100%;
  box-sizing: content-box;
  align-items: center;
}
.heroApartSlider.swiper .swiper-slide{
  flex-shrink: 0;
}

.heroApartSlider.swiper{
  /* Responsivo por ALTURA: nunca deixa o slide ativo "cortar" em telas baixas */
  height: clamp(460px, 74vh, 860px);
  padding: 10px 0 56px;
}
@media(min-width: 760px){
  .heroApartSlider.swiper{
    height: clamp(520px, 74vh, 900px);
  }
}

/* Cards do coverflow (tamanho base + escala no conteúdo interno) */
.heroApartSlider.swiper .swiper-wrapper{ align-items: center; }

/* Mantém TODOS os slides com o MESMO tamanho "base" (evita o Swiper deslocar/ desalinha ao trocar o ativo).
   O destaque (maior/menor) é feito no conteúdo interno (.heroSlideInner) via scale, sem mexer na largura do slide. */
.heroApartSlider.swiper .swiper-slide{
  width: clamp(300px, 36vw, 520px);
  height: clamp(420px, 64vh, 760px);
  display:flex;
  align-items:center;
  justify-content:center;
  background: transparent;
  overflow: visible; /* deixa o "glow" aparecer */
  /* Evita "hairline"/linhas fantasmas por composição 3D (Chrome/GPU) */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Conteúdo interno do card (aqui sim tem borda arredondada, sombra e o recorte da imagem) */
.heroApartSlider.swiper .heroSlideInner{
  border-radius: 26px;
  overflow: hidden;
  background: transparent;
  /* remove clip-path to avoid anti-alias halo on some GPUs */
  clip-path: none;
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Imagem sempre preenche o card (sem variar altura entre slides) */
.heroApartSlider.swiper .heroSlideInner img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  /* estabiliza o raster sob transform 3D */
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Slides não-ativos: menores (coverflow) sem mudar o tamanho real do slide */
.heroApartSlider.swiper .swiper-slide:not(.swiper-slide-active) .heroSlideInner{
  transform: translateZ(0) scale(.60);
  opacity: .78;
  box-shadow: 0 10px 35px rgba(0,0,0,.45);
}
.heroApartSlider.swiper .swiper-slide:not(.swiper-slide-active) .heroSlideInner img{
  /* blur subpixel costuma criar um halo na borda recortada; mantemos só cor/contraste */
  filter: saturate(.95) contrast(1.0);
}

/* Slide ativo: brilho/realce */
.heroApartSlider.swiper .swiper-slide-active .heroSlideInner{
  transform: translateZ(0) scale(1);
  opacity: 1;
}

/* responsivo coverflow */
@media(max-width: 759px){
  .heroApartSlider.swiper{
    /* em mobile/telas baixas, usa vh para nunca estourar */
    height: clamp(380px, 62vh, 520px);
  }
  .heroApartSlider.swiper .swiper-slide{
    width: clamp(240px, 78vw, 340px);
    height: clamp(360px, 60vh, 520px);
  }
  .heroApartSlider.swiper .swiper-slide:not(.swiper-slide-active) .heroSlideInner{
    transform: translateZ(0) scale(.70);
  }
}

.heroApartSlider.swiper .swiper-slide:not(.swiper-slide-active){
  opacity: .72;
}

.heroApartSlider.swiper .swiper-slide:not(.swiper-slide-active) img{
  filter: saturate(.95) contrast(1.0);
}


/* responsivo coverflow */


/* navegação */
.heroC-nav{
  position:absolute;
  left:0; right:0; bottom: 10px;
  display:flex;
  justify-content:center;
  gap: 10px;
  z-index: 5;
}

/* Remove setas/paginação do Swiper (garantia extra) */
.heroApartSlider .swiper-button-next,
.heroApartSlider .swiper-button-prev,
.heroApartSlider .swiper-pagination{
  display: none !important;
}
.heroC-btn{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(17,24,39,.12);
  background: rgba(255,255,255,.92);
  cursor: pointer;
  font-size: 22px;
  line-height: 44px;
  box-shadow: 0 10px 24px rgba(17,24,39,.12);
}

/* --- fallback antigo (sem Swiper) --- */
.heroApartSlider:not(.swiper){
  aspect-ratio: 16/7;
  min-height: 220px;
}
.heroApartSlider:not(.swiper) .heroApartSlide{
  position:absolute; inset:0;
  opacity:0;
  transition: opacity 900ms ease;
}
.heroApartSlider:not(.swiper) .heroApartSlide.isActive{ opacity:1; }
.heroApartSlider:not(.swiper) .heroApartSlide img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
}

.heroU-card{
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: 860px;
  border: 1px solid rgba(17,24,39,.10);
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  box-shadow: 0 20px 60px rgba(17,24,39,.14);
  padding: 14px;
  margin: 0 auto;
}

/* Busca abaixo do Hero (fora da área das imagens) */
/* Aumenta o espaçamento para garantir que o coverflow não "invada" a área da busca */
.heroSearch{
  margin-top: 32px;
}
@media(min-width: 760px){
  .heroSearch{ margin-top: 44px; }
}


/* Mobile: esconder a caixa de busca do Hero (mantém no desktop) */
@media (max-width: 759px){
  .heroU-card{ display:block; }
  /* ajusta espaçamento quando a busca some */
  .heroU-inner{ gap: 16px; padding-bottom: 22px; min-height: unset; }
  .heroApartSlider:not(.swiper){ min-height: 200px; aspect-ratio: 16/9; }
  .heroU-fields{grid-template-columns: 1fr 1fr;}
  .huSpan2{grid-column: span 2;}
}

.heroU-tabs{
  display:inline-flex;
  gap: 8px;
  padding: 6px;
  border-radius: 14px;
  background: rgba(17,24,39,.06);
}
.hutab{
  border: 1px solid transparent;
  background: transparent;
  padding: 10px 14px;
  border-radius: 12px;
  font-weight: 1000;
  cursor:pointer;
  color: rgba(17,24,39,.82);
}
.hutab.on{
  background:#fff;
  border-color: rgba(17,24,39,.12);
  box-shadow: 0 8px 20px rgba(17,24,39,.10);
}
.heroU-fields{
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 12px;
}
@media(min-width: 760px){
  .heroU-fields{grid-template-columns: 1fr 1.2fr 0.8fr 0.9fr; align-items:end;}
  .huSpan2{grid-column: span 2;}
}
.huField{display:grid; gap:6px}
.huLabel{font-size: 12px; font-weight: 1000; color: rgba(17,24,39,.72)}
.huBtn{
  width: 100%;
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  font-weight: 1000;
  letter-spacing:.3px;
}
.heroU-help{
  margin-top: 10px;
  color: rgba(17,24,39,.62);
}

.hero2{
  margin-top: 10px;
  border: none;
border-radius: 18px;
  background: linear-gradient(180deg, #ffffff, #fbfbfd);
  box-shadow: 0 18px 60px rgba(17,24,39,.10);
}
.hero2-inner{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
  padding: 16px;
}
@media(min-width: 980px){
  .hero2-inner{grid-template-columns: 1.25fr .75fr; align-items:stretch;}
}
.kicker{font-size:12px; color: var(--muted); font-weight:900; letter-spacing:.2px}
.hero2-title{font-size:28px; font-weight: 1000; letter-spacing:-.6px; margin-top:8px}
.hero2-sub{color: var(--muted); margin-top:8px; line-height:1.55}
.hero2-search{display:flex; gap:10px; margin-top:12px; flex-wrap:wrap}
.hero-input{flex:1; min-width: 220px}
.hero-btn{padding: 12px 14px; border-radius: 12px}
.hero2-quick{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px}
.hero-card{
  border: none;
border-radius: 16px;
  background:#fff;
  padding: 14px;
}
.hc-title{font-weight:1000}
.hc-actions{display:flex; gap:10px; margin-top:12px; flex-wrap:wrap}

.featured{margin-top:16px}
.featured-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:12px; flex-wrap:wrap;
  padding: 10px 0;
}
.featured-title{font-size:18px; font-weight:1000}
.featured-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
@media(min-width: 760px){
  .featured-grid{grid-template-columns: repeat(3, 1fr);}
}
.feat{
  border: none;
border-radius: 16px;
  overflow:hidden;
  background:#fff;
  box-shadow: 0 10px 28px rgba(17,24,39,.08);
}
.feat-img{position:relative; display:block; background:#f3f4f6}
.feat-img img{width:100%; height: 180px; object-fit:cover; display:block}
.feat-info{padding:12px}
.feat-title{display:block; font-weight:1000; color: rgba(17,24,39,.92); text-decoration:none}
.feat-title:hover{text-decoration:underline; text-underline-offset:2px}
.feat-price{margin-top:8px; font-weight:1000; font-size:18px}
.feat-actions{display:flex; gap:10px; align-items:center; margin-top:10px}

.comparebar{
  position: sticky;
  bottom: 0;
  z-index: 40;
  background: rgba(255,255,255,.92);
  border-top: 1px solid var(--border);
  backdrop-filter: blur(10px);
  display:none;
}
.comparebar-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding: 10px 0; flex-wrap:wrap;
}
.comparebar-actions{display:flex; gap:10px; flex-wrap:wrap}

.footer-cols{
  display:grid;
  grid-template-columns: 1fr;
  gap: 16px;
  padding: 18px 0;
  border-top: 1px solid var(--border);
}
@media(min-width: 980px){
  .footer-cols{grid-template-columns: 1.2fr 1fr 1fr 1fr;}
}
.foot-brand{font-weight:1000; font-size:18px; color: rgba(17,24,39,.92)}
.foot-title{font-weight:1000; margin-bottom:10px}
.foot-links{display:grid; gap:8px}
.foot-links a{color: rgba(17,24,39,.82); text-decoration:none}
.foot-links a:hover{text-decoration:underline; text-underline-offset:2px}
.news{display:flex; gap:10px; margin-top:10px; flex-wrap:wrap}
.foot-bottom{
  padding: 12px 0 18px;
  display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
  border-top: 1px solid var(--border);
}

/* Active filters */
.active-filters{margin: 12px 0 0}
.af-wrap{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.af-chip{background:#fff; border:1px solid rgba(17,24,39,.12)}
.af-chip .x{opacity:.7; margin-left:6px}
.af-clear{background: rgba(17,24,39,.06); border:1px solid rgba(17,24,39,.10)}

/* Floating WhatsApp */
.floating-wa{
  position: fixed;
  right: 14px;
  bottom: 78px;
  z-index: 60;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 12px 14px;
  border-radius: 999px;
  background: rgba(22,163,74,.92);
  color: #fff;
  text-decoration:none;
  font-weight: 1000;
  box-shadow: 0 18px 46px rgba(17,24,39,.22);
  border: 1px solid rgba(255,255,255,.22);
}
.floating-wa:hover{filter: brightness(1.02)}
.floating-wa .w{font-size:18px; display:inline-flex; align-items:center; justify-content:center;}
.floating-wa .waFabIcon{width:28px; height:28px; display:block;}
.floating-wa .t{font-size:13px; letter-spacing:.2px}
@media(min-width: 980px){
  .floating-wa{bottom: 22px;}
}
@media (max-width: 759px){
  /* no celular: vira botao flutuante pequeno para nao cobrir rodape */
  .floating-wa{
    right: 12px;
    bottom: 16px;
    width: 54px;
    height: 54px;
    padding: 0;
    justify-content: center;
    gap: 0;
  }
  .floating-wa .t{display:none;}
}

/* nao mostrar o floating WA na pagina do imovel (ja tem barra fixa) */
.page-imovel .floating-wa{display:none !important;}

@media(max-width: 640px){
  /* no celular: vira botao flutuante pequeno para nao cobrir rodape */
  .floating-wa{
    right: 12px;
    bottom: 16px;
    width: 54px;
    height: 54px;
    padding: 0;
    justify-content: center;
    gap: 0;
  }
  .floating-wa .t{display:none;}
}

/* nao mostrar o floating WA na pagina do imovel (ja tem barra fixa) */
.page-imovel .floating-wa{display:none !important;}

@media(max-width: 640px){
  /* no celular: vira botao flutuante pequeno para nao cobrir rodape */
  .floating-wa{
    right: 12px;
    bottom: 16px;
    width: 54px;
    height: 54px;
    padding: 0;
    justify-content: center;
    gap: 0;
  }
  .floating-wa .t{display:none;}
}

/* nao mostrar o floating WA na pagina do imovel (ja tem barra fixa) */
.page-imovel .floating-wa{display:none !important;}

@media(max-width: 640px){
  /* no celular: vira botao flutuante pequeno para nao cobrir rodape */
  .floating-wa{
    right: 12px;
    bottom: 16px;
    width: 54px;
    height: 54px;
    padding: 0;
    justify-content: center;
    gap: 0;
  }
  .floating-wa .t{display:none;}
}

/* nao mostrar o floating WA na pagina do imovel (ja tem barra fixa) */
.page-imovel .floating-wa{display:none !important;}

@media(max-width: 640px){
  /* no celular: vira botao flutuante pequeno para nao cobrir rodape */
  .floating-wa{
    right: 12px;
    bottom: 16px;
    width: 54px;
    height: 54px;
    padding: 0;
    justify-content: center;
    gap: 0;
  }
  .floating-wa .t{display:none;}
}

/* nao mostrar o floating WA na pagina do imovel (ja tem barra fixa) */
.page-imovel .floating-wa{display:none !important;}

@media(max-width: 640px){
  /* no celular: vira botao flutuante pequeno para nao cobrir rodape */
  .floating-wa{
    right: 12px;
    bottom: 16px;
    width: 54px;
    height: 54px;
    padding: 0;
    justify-content: center;
    gap: 0;
  }
  .floating-wa .t{display:none;}
}

/* nao mostrar o floating WA na pagina do imovel (ja tem barra fixa) */
.page-imovel .floating-wa{display:none !important;}

@media(max-width: 640px){
  /* no celular: vira botao flutuante pequeno para nao cobrir rodape */
  .floating-wa{
    right: 12px;
    bottom: 16px;
    width: 54px;
    height: 54px;
    padding: 0;
    justify-content: center;
    gap: 0;
  }
  .floating-wa .t{display:none;}
}

/* nao mostrar o floating WA na pagina do imovel (ja tem barra fixa) */
.page-imovel .floating-wa{display:none !important;}


/* Trust section */
.trust{margin-top:16px}
.trust-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:12px;
}
@media(min-width: 980px){
  .trust-grid{grid-template-columns: 1.15fr .85fr;}
}
.trust-card{
  border: none;
border-radius: 16px;
  background:#fff;
  box-shadow: 0 10px 28px rgba(17,24,39,.08);
  padding: 14px;
}
.trust-title{font-weight:1000; font-size:16px}
.trust-sub{margin-top:6px}
.trust-kpis{display:grid; grid-template-columns: repeat(3, 1fr); gap:10px; margin-top:12px}
.kpi{
  border:1px solid rgba(17,24,39,.10);
  border-radius: 12px;
  padding: 8px;
  font-size: 13px;
  background: rgba(17,24,39,.02);
}
.kpi .n{font-weight:1000; font-size:18px}
.kpi .s{font-size:12px; color: var(--muted); margin-top:2px}
.trust-quotes{display:grid; gap:10px; margin-top:12px}
.quote{
  border-left: 3px solid rgba(17,24,39,.12);
  padding-left: 10px;
}
.quote .q{font-weight:800; color: rgba(17,24,39,.86)}
.quote .who{font-size:12px; color: var(--muted); margin-top:4px}

/* Purpose tabs (Venda/Locação) */
.purpose-tabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
}
.ptab{
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(17,24,39,.12);
  background: rgba(255,255,255,.9);
  font-weight: 1000;
  font-size: 12px;
  cursor:pointer;
}
.ptab.on{
  background: rgba(17,24,39,.92);
  color:#fff;
  border-color: rgba(17,24,39,.92);
}

/* Property gallery (emobi-like) */
.galleryPro{position:relative}
.sharebar{
  position:absolute;
  left: -52px;
  top: 18px;
  display:flex;
  flex-direction:column;
  gap:8px;
  z-index: 20;
}
@media(max-width: 980px){
  /* Mobile clean: remove floating social/share buttons */
  .sharebar{display:none !important;}
}
.sb{
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid rgba(17,24,39,.12);
  background:#fff;
  display:flex; align-items:center; justify-content:center;
  font-weight: 1000;
  color: rgba(17,24,39,.78);
  cursor:pointer;
  text-decoration:none;
  box-shadow: 0 10px 26px rgba(17,24,39,.10);
}
.sb:hover{filter:brightness(1.02)}
.sb.fb{background:#1877f2;color:#fff;border-color:rgba(0,0,0,0)}
.sb.tw{background:#111827;color:#fff;border-color:rgba(0,0,0,0)}
.sb.in{background:#0a66c2;color:#fff;border-color:rgba(0,0,0,0)}
.sb.wa{background:#22c55e;color:#fff;border-color:rgba(0,0,0,0)}
.sb.pr{background:#f8fafc}
.sb.lk{background:#f8fafc}

.galleryGrid{
  position:relative;
  display:grid;
  grid-template-columns: 1.45fr 1fr;
  /* vídeo: sem “linhas” entre as fotos */
  gap: 0;
  border-radius: 0;
  overflow:hidden;
  background: transparent;
  height: clamp(260px, 34vw, 460px);
}
@media(max-width: 980px){
  .galleryGrid{grid-template-columns: 1fr; height:auto; }
  .gMainWrap{height: 260px;}
  .gSide{grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .gSpan2{grid-column: 1 / -1;}
}
.gMainWrap{height: 100%; background:#e5e7eb}
.gCell{position:relative; overflow:hidden}
.gCell::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.35);
  opacity: 0;
  transition: opacity .18s ease;
  pointer-events:none;
}
/* Por padrão, o mosaico da direita fica levemente escuro (estilo vídeo) */
.gSide .gCell::after{opacity:.25}
.gMainWrap::after{opacity:0}

/* Hover: tudo escurece e o item focado fica claro */
.galleryGrid.is-hovering .gCell::after{opacity:.60}
.galleryGrid.is-hovering .gCell.is-active::after{opacity:0}
.gMain{
  width:100%;
  height: 100%;
  object-fit: cover;
  display:block;
  cursor: zoom-in;
}
.gSide{
  display:grid;
  grid-template-columns: 1fr 1fr .82fr;
  grid-template-rows: 1fr 1fr;
  /* vídeo: sem “linhas” entre as fotos */
  gap: 0;
  padding: 0;
  background: transparent;
  height: 100%;
}
@media(max-width: 980px){
  .gSide{padding: 0}
}
.gThumb{
  width:100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  display:block;
  cursor: zoom-in;
  background:#e5e7eb;
}
.gSpan2{grid-column: 1 / span 2;}
.gMore{position:relative}


/* === NOVO: Galeria em carrossel (igual ao vídeo) === */
.galleryRail{
  position:relative;
  display:block;
  height: clamp(260px, 34vw, 460px);
  background: #fff;
  overflow:hidden;
}
.galleryRail .gViewport{height:100%; overflow:hidden}
.galleryRail .gTrack{height:100%; display:flex; gap:0; will-change:transform; transform: translate3d(0,0,0)}
.galleryRail .gSlide{
  flex: 0 0 clamp(320px, 42vw, 760px);
  height:100%;
  position:relative;
  border-right: 2px solid rgba(255,255,255,.95);
  overflow:hidden;
}
.galleryRail .gSlide:last-child{border-right:none}
.galleryRail .gSlideImg{width:100%; height:100%; object-fit:cover; display:block; cursor: zoom-in; background:#e5e7eb}

.galleryRail .gNav{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width: 54px;
  height: 54px;
  border-radius: 999px;
  border: 0;
  background: rgba(0,0,0,.28);
  color:#fff;
  font-size: 40px;
  line-height: 0;
  cursor:pointer;
  z-index: 30;
  display:flex;
  align-items:center;
  justify-content:center;
  backdrop-filter: blur(8px);
}
.galleryRail .gNav:hover{background: rgba(0,0,0,.36)}
.galleryRail .gNav.prev{left: 14px}
.galleryRail .gNav.next{right: 14px}

/* botão "Visualizar Fotos" mantém o estilo já existente */
.galleryRail .viewPhotos{z-index: 30}

/* Thumbnails row (nível "imobiliária grande") */
.galleryRail .gThumbs{
  position:absolute;
  left: 14px;
  right: 14px;
  bottom: 14px;
  display:flex;
  align-items:center;
  gap: 10px;
  z-index: 29;
  pointer-events: none; /* permite clicar nas fotos sem perder */
}
.galleryRail .gThumbTrack{
  display:flex;
  gap: 10px;
  overflow:auto;
  padding: 6px;
  border-radius: 12px;
  background: rgba(17,24,39,.18);
  backdrop-filter: blur(10px);
  pointer-events: auto;
  scrollbar-width: none;
}
.galleryRail .gThumbTrack::-webkit-scrollbar{display:none}
.galleryRail .gThumb{
  flex: 0 0 auto;
  width: 78px;
  height: 52px;
  border-radius: 10px;
  border: 2px solid rgba(255,255,255,.28);
  overflow:hidden;
  cursor:pointer;
  opacity: .82;
  background: rgba(255,255,255,.12);
}
.galleryRail .gThumb:hover{opacity:.96}
.galleryRail .gThumb.on{
  opacity: 1;
  border-color: rgba(255,255,255,.92);
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}
.galleryRail .gThumb img{width:100%; height:100%; object-fit:cover; display:block}

@media(max-width: 980px){
  .galleryRail .gThumbs{bottom: 10px; left: 10px; right: 10px}
  .galleryRail .gThumb{width: 66px; height: 46px}
}
/* No mobile, dá prioridade ao botão "Visualizar Fotos" */
@media(max-width: 640px){
  .galleryRail .gThumbs{bottom: 56px}
}


@media(max-width: 980px){
  /* Mobile clean: esconder miniaturas e deixar apenas o botão "Visualizar Fotos" */
  .galleryRail .gThumbs{display:none !important;}
  .viewPhotos{
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    padding: 12px 16px;
  }
}

@media(max-width: 980px){
  .galleryRail{height: 300px}
  .galleryRail .gSlide{flex-basis: 88vw}
  .galleryRail .gNav{width:48px;height:48px;font-size:36px}
}
.viewPhotos{
  position:absolute;
  right: 14px;
  bottom: 14px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(17,24,39,.12);
  background: rgba(255,255,255,.95);
  font-weight: 1000;
  cursor:pointer;
  box-shadow: 0 12px 30px rgba(17,24,39,.12);
}
.viewPhotos:hover{filter:brightness(1.02)}

.favTop{
  position:absolute;
  right: 14px;
  top: 14px;
  z-index: 25;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(17,24,39,.35);
  color:#fff;
  font-weight: 1000;
  cursor:pointer;
  backdrop-filter: blur(10px);
}
.favTop.on{background: rgba(239,68,68,.85);}

/* Icon bar under gallery */
.iconbar{
  display:grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
  border-top: 1px solid rgba(17,24,39,.10);
  background:#fff;
}
@media(max-width: 980px){
  .iconbar{grid-template-columns: repeat(3, 1fr)}
}
.ic{
  display:flex;
  gap:10px;
  align-items:center;
  padding: 12px 10px;
  border-right: 1px solid rgba(17,24,39,.08);
}
.ic:last-child{border-right:none}
.ico{font-size:18px}
.ic .k{font-size:11px; color: var(--muted); font-weight:900}
.ic .v{font-size:14px; font-weight:1000; color: rgba(17,24,39,.90); margin-top:2px}

/* Lightbox */
.lightbox{
  position: fixed;
  inset: 0;
  background: rgba(10,10,10,.94);
  overflow:hidden;
  display:none;
  align-items:center;
  justify-content:center;
  z-index: 120;
}
.lightbox.show{display:flex}

.lb-bg{
  position:absolute;
  inset:0;
  background-size: cover;
  background-position: center;
  filter: blur(44px) brightness(.55) saturate(1.15);
  transform: scale(1.15);
  opacity: .95;
  pointer-events:none;
  z-index: 0;

  display:none !important;
}
/* vinheta leve para dar contraste */
.lightbox::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(ellipse at center, rgba(0,0,0,.18), rgba(0,0,0,.55));
  pointer-events:none;
  z-index: 1;
}
/* garante que conteúdo fique acima do blur */
.lb-img, .lb-close, .lb-nav, .lb-count, .lb-thumbs{
  position: relative;
  z-index: 2;
}
.lb-img{
  max-width: min(1100px, 92vw);
  max-height: 86vh;
  border-radius: 14px;
  object-fit: contain;
  box-shadow: 0 24px 80px rgba(0,0,0,.45);
}
.lb-close{
  position:absolute;
  top: 16px;
  right: 16px;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.10);
  color:#fff;
  font-size: 28px;
  cursor:pointer;
}
.lb-nav{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 52px;
  height: 52px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.10);
  color:#fff;
  font-size: 34px;
  cursor:pointer;
}
.lb-nav.prev{left: 16px}
.lb-nav.next{right: 16px}
.lb-count{
  position:absolute;
  bottom: 18px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  color:#fff;
  padding: 8px 10px;
  border-radius: 999px;
  font-weight: 1000;
  font-size: 12px;
}


/* Lightbox thumbs (emobi-like) */
.lb-thumbs{
  position:absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px 0 14px;
  background: rgba(0,0,0,.55);
  border-top: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
}
.lb-track{
  display:flex;
  gap: 8px;
  overflow-x:auto;
  padding: 0 12px;
  scrollbar-width: thin;
}
.lb-track::-webkit-scrollbar{height: 10px}
.lb-track::-webkit-scrollbar-thumb{background: rgba(255,255,255,.22); border-radius: 999px}
.lb-thumb{
  flex: 0 0 auto;
  width: 110px;
  height: 74px;
  border-radius: 12px;
  overflow:hidden;
  border: 2px solid transparent;
  opacity: .78;
  cursor:pointer;
}
.lb-thumb:hover{opacity: .95}
.lb-thumb.on{border-color:#fff; opacity: 1}
.lb-thumb img{width:100%;height:100%;object-fit:cover;display:block}

/* Ajusta a imagem para caber com a faixa de miniaturas */
.lightbox.show .lb-img{max-height: 72vh;}
@media(max-width: 640px){
  .lb-thumb{width: 86px; height: 60px; border-radius: 10px}
  .lightbox.show .lb-img{max-height: 64vh;}
}

/* Property page: gallery full width */
.split-below{padding-top: 0}
@media (min-width: 920px){ .split-below{padding-top: 16px;} }

/* Break the hero gallery card out of the default container width */
.page-imovel .heroFull{
  /* full viewport width without triggering horizontal scrollbars */
  width: calc(100vw - (100vw - 100%));
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  border-radius: 0;
  box-shadow: none;
  border: 0;
}

/* === FIX (mobile): evita "quebra" no hero full-bleed e garante 1 foto por vez na galeria === */
@media (max-width: 640px){
  /* Alguns navegadores mobile tratam 100vw de forma diferente (barra de endereço), causando corte/overflow. */
  .page-imovel .heroFull{
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  /* Galeria: 1 slide por vez ocupando 100% da largura */
  .galleryRail{height: min(360px, 56vw); min-height: 240px;}
  .galleryRail .gSlide{flex: 0 0 100%; border-right: 0;}

  /* Evita qualquer scroll horizontal que "quebra" a visão no celular */
  html, body{overflow-x:hidden; overscroll-behavior-x:none; touch-action: pan-y; width:100%; max-width:100%;}
}

/* Gallery sizing is controlled by .galleryGrid + children at 100% */
.gMainWrap{min-height: unset}
.gMain{min-height: unset}
.gThumb{height: 100%}

/* Emobi-like property header */
.propHead{margin-top: 10px}
.ph-top{
  display:flex;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  align-items:flex-end;
  padding: 10px 0 6px;
}
.ph-title{font-size: 32px; font-weight: 1000; letter-spacing:-.6px; margin: 0}
.ph-address{margin-top: 8px; color: var(--muted); font-weight:800}
.ph-pricebox{
  border: none;
border-radius: 16px;
  background:#fff;
  padding: 10px 12px;
  min-width: 260px;
}
.ph-type{font-weight:1000; color: rgba(17,24,39,.70)}
.ph-price{font-weight:1000; font-size: 22px; margin-top:4px}
.ph-code{margin-top:6px; font-size:12px; color: var(--muted); font-weight:900}

.ph-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding: 10px 0 16px;
  border-bottom: 1px solid rgba(17,24,39,.08);
}
.pill{
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(17,24,39,.12);
  background: #fff;
  font-weight: 1000;
  cursor:pointer;
}
.pill:hover{filter:brightness(1.01)}
.pill.primary{
  background: rgba(22,163,74,.12);
  border-color: rgba(22,163,74,.25);
}
.pill.on{background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.25)}

/* Hide duplicate crumbs inside the summary card (keep header crumbs) */
.card-pad .crumbs{display:none}

/* Modals */
.modal{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.58);
  display:none;
  align-items:center;
  justify-content:center;
  z-index: 130;
  padding: 16px;
}
.modal.show{display:flex}
.modal-card{
  width: min(560px, 92vw);
  border-radius: 18px;
  background:#fff;
  border: 1px solid rgba(17,24,39,.12);
  box-shadow: 0 28px 90px rgba(0,0,0,.28);
  padding: 16px;
  position: relative;
}
.modal-x{
  position:absolute;
  top:10px; right:10px;
  width: 40px; height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(17,24,39,.10);
  background: #fff;
  font-size: 26px;
  cursor:pointer;
}
.modal-title{font-weight:1000; font-size: 14px}
.modal-opts{display:flex; gap:12px; margin-top:10px; flex-wrap:wrap}
.opt{font-weight:900; color: rgba(17,24,39,.78); font-size: 13px}
.modal-form{display:grid; gap:10px; margin-top:12px}
.modal-or{margin: 12px 0; text-align:center; color: var(--muted); font-weight:1000}
.share-row{display:flex; gap:10px; margin-top:12px; flex-wrap:wrap}
.modal-note{margin-top:12px}

/* Property page: main + sticky sidebar */
.propLayout{
  display:grid;
  grid-template-columns: 1.65fr 1fr;
  gap: 18px;
  margin-top: 18px;
  align-items:start;
}

.page-imovel .propLayout{padding: 0 18px;}
@media (min-width: 1200px){ .page-imovel .propLayout{padding: 0 28px;} }
@media(max-width: 980px){
  .propLayout{grid-template-columns: 1fr; margin-bottom: 64px}
}
.propSide{position:relative}
.sideCard{
  border: 1px solid rgba(17,24,39,.12);
  border-radius: 16px;
  background:#fff;
  box-shadow: 0 12px 34px rgba(17,24,39,.08);
  padding: 10px;
  position: sticky;
  top: 12px;
}
@media(max-width: 980px){
  .sideCard{position: static; box-shadow:none}
}
.sideTop{padding-bottom: 8px; border-bottom: 1px solid rgba(17,24,39,.08)}
.sidePrice{font-size: 20px; font-weight: 1000; letter-spacing:-.2px}
.sideCode{margin-top: 4px; color: var(--muted); font-weight: 900; font-size: 11px}
.sideAddress{margin-top: 6px; color: rgba(17,24,39,.78); font-weight: 900; font-size: 12px}
.sideKpis{display:grid; grid-template-columns: repeat(2, 1fr); gap:8px; margin-top: 10px; margin-bottom: 12px}
.sk{
  border:1px solid rgba(17,24,39,.10);
  border-radius: 12px;
  padding: 8px;
  font-size: 13px;
  background: rgba(17,24,39,.02);
  font-weight: 1000;
  color: rgba(17,24,39,.90);
}
.sideActions{display:flex; gap:8px; flex-wrap:wrap; margin-top: 10px}
.button.wa{background:#22c55e; border-color: rgba(0,0,0,0); color:#fff}
.button.wa:hover{filter:brightness(1.02)}
.sideNote{margin-top: 10px; color: var(--muted)}

/* Bottom actions (mobile) */
.mobileBar{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px;
  background: rgba(255,255,255,.92);
  border-top: 1px solid rgba(17,24,39,.10);
  backdrop-filter: blur(10px);
  display:none;
  gap: 10px;
  z-index: 140;
}
.mobileBar .mb{
  flex: 1;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(17,24,39,.12);
  background:#fff;
  font-weight: 1000;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  cursor:pointer;
}
.mobileBar .mb-wa{background:#22c55e; color:#fff; border-color: rgba(0,0,0,0)}
.mobileBar .mb-fav{max-width: 58px; flex: 0 0 58px}
.mobileBar .mb-fav.on{background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.25)}
@media(max-width: 980px){
  .mobileBar{display:flex}
}

.remember{
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(17,24,39,.10);
  background: rgba(17,24,39,.02);
  color: rgba(17,24,39,.82);
  font-weight: 800;
}


/* ===== Detalhe do imóvel: descrição/itens (estilo anúncio) ===== */
.desc-text{margin-top:10px;color:var(--text);line-height:1.7;font-size:15px}
.desc-text p{margin:0 0 10px}
.desc-text ul{margin:8px 0 14px 0;padding-left:18px}
.desc-text li{margin:6px 0;color:var(--text)}

.announce{padding:0}
.announce .card-pad{padding:18px}

.hotBox{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(239,68,68,.55);
  background: rgba(239,68,68,.08);
  color: rgba(185,28,28,.95);
  font-weight: 900;
}
.hotIcon{font-size:16px}

.propH1{
  margin:14px 0 8px;
  font-size: clamp(22px, 3.6vw, 34px);
  line-height: 1.1;
  letter-spacing: -.02em;
}

.propBadges{display:flex; gap:8px; flex-wrap:wrap; margin: 0 0 10px;}
.badgeOutline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 7px 10px;
  border-radius: 12px;
  border: 1px solid rgba(239,68,68,.35);
  background: #fff;
  color: rgba(185,28,28,.95);
  font-weight: 900;
  font-size: 12px;
}

.propMeta{
  margin-top: 10px;
  color: rgba(17,24,39,.74);
  font-weight: 800;
  font-size: 13px;

/* ===== Detalhes (texto) + Mapa ===== */
.detailSection{margin-top:14px}
.detailText{
  margin-top: 10px;
  border: 1px solid rgba(17,24,39,.10);
  border-radius: 16px;
  padding: 14px;
  background: rgba(17,24,39,.02);
}
.detailText p{margin: 10px 0; line-height: 1.55; color: rgba(17,24,39,.85);}
.detailLead{margin-bottom: 10px;}
.detailTitle{font-weight: 1100; color: var(--text); font-size: 15px; line-height: 1.35;}
.detailHint{margin-top: 6px; color: rgba(17,24,39,.72); font-size: 12px;}
.detailPrices{
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed rgba(17,24,39,.14);
  display:grid;
  gap: 6px;
  color: rgba(17,24,39,.85);
  font-weight: 900;
}

/* Mantido para compatibilidade (caso algum layout ainda use o grid antigo) */
.detailKVs{
  margin-top: 10px;
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
@media (min-width: 640px){
  .detailKVs{grid-template-columns: 1fr 1fr;}
}
@media (min-width: 1020px){
  .detailKVs{grid-template-columns: 1fr 1fr 1fr;}
}
.kvItem{
  border: 1px solid rgba(17,24,39,.10);
  border-radius: 16px;
  padding: 12px;
  background: rgba(17,24,39,.02);
}
.kvItem .k{
  color: var(--muted);
  font-weight: 1000;
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.kvItem .v{
  margin-top: 4px;
  font-weight: 1000;
  color: var(--text);
  font-size: 14px;
}

.mapSection{margin-top:16px}
.mapWrap{
  margin-top: 10px;
  border-radius: 16px;
  overflow:hidden;
  border: 1px solid rgba(17,24,39,.10);
  background: rgba(17,24,39,.03);
  min-height: 220px;
  aspect-ratio: 16/9;
}
.mapWrap iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
}

}

.secTitle{font-size:18px; margin:18px 0 10px}

.tickGrid{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns: 1fr;
  gap:10px 22px;
}
@media (min-width: 860px){
  .tickGrid{grid-template-columns: 1fr 1fr;}
}
.tickGrid li{display:flex; gap:10px; align-items:flex-start; color:var(--text)}
.tickGrid li::before{
  content:"✓";
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;height:18px;
  border-radius:999px;
  border:1px solid rgba(239,68,68,.55);
  color:#ef4444;
  background: rgba(239,68,68,.10);
  font-weight:900;
  font-size:12px;
  flex:0 0 18px;
  margin-top:2px;
}

.featWrap.alt{
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(17,24,39,.08);
  background: rgba(17,24,39,.03);
}


/* ===== Header compacto (estilo 'barra vermelha') ===== */
.headerRed{
  position: sticky;
  top: 0;
  z-index: 30;
  background: var(--brand);
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.headerRed .brand{color:#fff}
.headerRed .logo{
  background-image: url('/assets/logo.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-color: transparent;
  box-shadow: none;
  border: 1px solid rgba(255,255,255,.20);
}

.brand-invert{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.2px}

.headerRed-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  padding: 12px 0;
}

/* Desktop: header ocupa toda a largura (sem "container" centralizado) */
@media (min-width: 760px){
  header.headerRed .container.headerRed-inner{
    width: 100%;
    max-width: none;
    margin: 0;
  }
  /* dá um respiro mínimo; ajuste para 0 se quiser colado 100% */
  header.headerRed .headerRed-inner{
    padding-left: 16px;
    padding-right: 16px;
  }
}

.headerActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 12px;
  flex-wrap:wrap;
}
.hPhone{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color: rgba(255,255,255,.94);
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
}
.hLink{
  font-size:13px;
  color: rgba(255,255,255,.96);
  padding: 6px 8px;
  border-radius: 10px;
}
.hLink:hover{background: rgba(255,255,255,.10)}

.hSocial{display:flex;align-items:center;gap:8px}
.hSoc{
  width:30px;height:30px;border-radius:10px;
  display:grid;place-items:center;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.14);
  color:#fff;
  font-weight:900;
  font-size:12px;
}

.hSoc svg{width:18px;height:18px;display:block;fill:currentColor}
.navToggle{
  width:36px;height:36px;border-radius:12px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color:#fff;
  cursor:pointer;
  font-size:18px;
  line-height:1;
}
.navToggle:hover{background: rgba(255,255,255,.16)}

.drawer{
  display:none;
  position:absolute;
  left:0; right:0;
  top: 100%;
  background: rgba(255,255,255,.98);
  color: var(--text);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 18px 60px rgba(17,24,39,.18);
}
.drawer.open{display:block}
.drawer-inner{padding: 14px 0}
.drawer-grid{
  display:grid;
  gap: 18px;
  grid-template-columns: 1fr;
}
@media (min-width: 860px){
  .drawer-grid{grid-template-columns: 1fr 1fr}
}
.drawer-col{
  border: none;
border-radius: calc(var(--radius) + 4px);
  background: #fff;
  overflow:hidden;
}
.drawer-h{
  padding: 12px 14px;
  font-weight: 900;
  border-bottom: 1px solid var(--border);
  background: rgba(17,24,39,.03);
}
.drawer-a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
}
.drawer-a:last-child{border-bottom:none}
.drawer-a:hover{background: rgba(17,24,39,.03)}
.drawer-note{
  padding: 12px 14px;
  font-size: 12px;
  color: var(--muted);
  background: rgba(17,24,39,.02);
}

@media (max-width: 720px){
  .hLink{display:none}
  .hSocial{display:none}
  .hPhone{display:none}
  #top_primary_wa{display:inline-flex}
}



/* Evita que o botão flutuante (WhatsApp) cubra o conteúdo */
.page-imovel main{padding-bottom:90px;}


/* --- Property feature blocks (Caracteristicas / Infraestrutura) --- */
.featureBlocks{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin: 18px 0 6px;
}
.featBlock{padding:0}
.featList{
  list-style:none;
  padding:0;
  margin: 8px 0 0;
  columns: 2;
  column-gap: 28px;
}
.featList li{
  break-inside: avoid;
  display:flex;
  align-items:flex-start;
  gap: 10px;
  margin: 8px 0;
  font-size: 14px;
  color: rgba(20,25,35,.92);
}
.featDot{
  width:18px;
  height:18px;
  border-radius: 999px;
  border: 1.5px solid #d32f2f;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top: 2px;
  flex: 0 0 auto;
}
.featDot svg{display:block}
@media (max-width: 860px){
  .featureBlocks{grid-template-columns: 1fr; gap: 16px}
  .featList{columns: 1}
}


/* Compact right-side summary card (property page) */
.sideCard.compact{padding:10px}
.sideCard.compact .sidePrice{font-size:20px}
.sideCard.compact .sideCode{font-size:11px;margin-top:4px}
.sideCard.compact .sideAddress{font-size:12px;margin-top:6px}
.sideCard.compact .sideKpis{gap:8px;margin-top:10px}
.sideCard.compact .sk{padding:8px;border-radius:12px;font-size:13px}
.sideCard.compact .button{padding:10px 12px;border-radius:12px;font-size:13px}
.sideCard.compact .chip{padding:5px 9px;font-size:11px}
.sideCard.compact .sideActions{gap:8px;margin-top:10px}

/* Related suggestions carousel (imovel) */
.relWrap{position:relative}
.relViewport{
  overflow-x:auto;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width:none;
  padding: 6px 44px;
}
.relViewport::-webkit-scrollbar{display:none}
.relTrack{display:flex; gap:12px}

.relCard{
  flex: 0 0 auto;
  width: 320px;
  display:grid;
  grid-template-columns: 132px 1fr;
  border: none;
border-radius: 16px;
  overflow:hidden;
  background:#fff;
  box-shadow: 0 14px 40px rgba(17,24,39,.10);
  text-decoration:none;
  color: inherit;
}
@media(max-width: 420px){ .relCard{width: 260px; grid-template-columns: 118px 1fr;} }

.relThumb{background:#f3f4f6}
.relThumb img{width:100%; height:100%; object-fit:cover; display:block; min-height: 108px}

.relBody{padding: 10px 10px 8px}
.relTitle{font-size: 13px; font-weight: 950; line-height: 1.2; margin: 0 0 4px}
.relMeta{font-size: 11px; color: var(--muted); line-height: 1.2}
.relKpis{margin-top:4px; font-size:11px; color: var(--muted)}
.relPrice{margin-top:8px; font-size: 13px; font-weight: 950}

.relNav{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: none;
background: rgba(255,255,255,.94);
  backdrop-filter: blur(8px);
  box-shadow: 0 14px 40px rgba(17,24,39,.14);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 20px;
  font-weight: 950;
  cursor:pointer;
}
.relNav.prev{left: 10px}
.relNav.next{right: 10px}
.relNav:disabled{opacity:.45; cursor:default}


/* ===== Fix mobile overlays (WhatsApp flutuante) ===== */
@media(max-width: 640px){
  .floating-wa{
    right: 12px;
    bottom: 16px;
    width: 54px;
    height: 54px;
    padding: 0;
    justify-content: center;
    gap: 0;
  }
  .floating-wa .t{display:none;}
}

.page-imovel .floating-wa{display:none !important;}


/* ===== Mobile fixes: padronização do anúncio (apenas celular) ===== */
@media (max-width: 980px){
  /* evita “quebra” por largura/overflow em elementos do anúncio */
  .page-imovel .propLayout{padding: 0 12px;}
  .page-imovel .propMain, .page-imovel .propSide{min-width: 0;}
  .page-imovel .sideCard{padding: 12px; border-radius: 16px; overflow: hidden;}
  .page-imovel .sideTop{padding-bottom: 10px;}
  .page-imovel .sidePrice{font-size: 22px; line-height: 1.15;}
  .page-imovel .sideAddress, .page-imovel .sideCode{word-break: break-word;}
  .page-imovel .sideKpis{grid-template-columns: repeat(2, minmax(0,1fr));}
  .page-imovel .sk{min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

  /* botões principais sempre com o mesmo “padrão” */
  .page-imovel #sideContato,
  .page-imovel #sideProposta{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-align:center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* ações (Favoritar/Comparar/Compartilhar) padronizadas em grade */
  .page-imovel .sideActions{
    display:grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
  }
  .page-imovel .sideActions .chip{
    justify-content:center;
    text-align:center;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 10px 8px;
    font-size: 12px;
  }

  /* garante espaço para a barra fixa do mobile */
  .page-imovel main{padding-bottom: 74px;}
}



/* === Mobile: ajustar espaçamento e tamanho dos botões do anúncio (não afeta desktop) === */
@media (max-width: 768px) {

  /* botões principais */
  #sideContato,
  #sideProposta{
    width: 100%;
    padding: 10px 12px;
    min-height: 44px;
    font-size: 16px;
    line-height: 1.15;
    border-radius: 16px;
  }

  #sideContato{ margin-top: 10px; margin-bottom: 12px; }
  #sideProposta{ margin-top: 0; margin-bottom: 12px; }

  /* área dos chips: Favoritar / Comparar / Compartilhar */
  .sideActions{
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
    margin-top: 6px !important;
  }

  .sideActions .chip{
    width: 100%;
    padding: 10px 8px;
    min-height: 40px;
    font-size: 13px;
    border-radius: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}



/* ===== FIX: desktop property layout (only /imovel page) ===== */
@media (min-width: 981px){
  /* keep columns stable and prevent overlap/overflow */
  .page-imovel .propLayout{
    grid-template-columns: minmax(0, 1fr) 340px !important;
    gap: 24px !important;
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
  }
  .page-imovel .propMain{ min-width: 0; }
  .page-imovel .propSide{ min-width: 0; }
}


/* MOBILE: alinhar HERO + carrossel + busca no centro */
@media (max-width: 759px){
  /* MOBILE ONLY: manter tudo visível e centralizado, sem quebrar o desktop */

  /* 1) O Hero não pode ficar "por baixo" do header vermelho */
  .heroU{
    margin-top: 0px;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    /* precisa "vazar" para o coverflow mostrar as laterais (igual desktop) */
    overflow: visible;
    overflow-x: clip; /* evita scroll horizontal em alguns aparelhos */
    border-radius: 0 0 18px 18px;
  }
  .heroU::before,
  .heroU-slider{
    border-radius: 0 0 18px 18px;
  }

  /* 2) Layout do conteúdo em coluna (texto -> carrossel) */
  .heroU-inner{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    padding: 18px 12px 20px;
    max-width: 100%;
    margin: 0 auto;
  }

  .heroU-copy{
    position: relative;
    width: 100%;
    max-width: min(620px, calc(100% - 24px));
    text-align: center;
    z-index: 3;
  }

  /* 3) Carrossel SEMPRE visível */
  .heroU-media,
  #heroApartSlider,
  #heroApartWrapper,
  .heroApartSlider,
  .heroApartSlider.swiper{
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .heroU-media{
    width: 100%;
    max-width: min(620px, calc(100% - 24px));
    margin: 0 auto;
    z-index: 2;
  }

  /* Swiper no mobile: menor para caber no viewport e não "sumir" */
  .heroApartSlider.swiper{
    width: 100%;
    height: clamp(240px, 40vh, 380px);
    padding: 6px 0 20px;
    overflow: visible;
  }
  .heroApartSlider.swiper .swiper-slide{
    width: min(84vw, 360px);
    height: clamp(210px, 34vh, 330px);
  }
  .heroApartSlider.swiper .heroSlideInner{
    border-radius: 20px;
  }

  /* 4) Busca e destaques no mesmo eixo do miolo do hero */
  .heroSearch .container,
  .destaques .container,
  .highlights .container{
    width: min(620px, calc(100% - 24px));
    margin-left: auto;
    margin-right: auto;
  }
}




@media (max-width: 759px){
  /* Mobile: dá respiro abaixo do header vermelho */
  .heroU{ margin-top: 0px; border-top-left-radius: 0; border-top-right-radius: 0; }
  .heroU::before, .heroU-slider{ border-top-left-radius: 0; border-top-right-radius: 0; }
  /* Garante que o carrossel não fique escondido */
  #heroApartSlider{ display:block !important; visibility:visible !important; opacity:1 !important; }
}



/* ===== HERO Coverflow (custom, sem Swiper) ===== */
.heroApartSlider{
  position: relative;
  perspective: 1200px;
  display: block;
  width: 100%;
  /* altura padrão */
  height: clamp(420px, 64vh, 760px);
  overflow: visible;
}
@media (max-width: 759px){
  .heroApartSlider{ height: clamp(360px, 60vh, 520px); }
}

.heroApartSlider .cf-track{
  position: relative;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.heroApartSlider .cf-slide{
  transform-style: preserve-3d;
  position: absolute;
  left: 50%;
  top: 50%;
  width: clamp(320px, 44vw, 620px);
  height: clamp(420px, 64vh, 760px);
  transform: translate(-50%, -50%);
  transition: transform 520ms ease, opacity 520ms ease;
  will-change: transform, opacity;
  pointer-events: none; /* o swipe fica no container */
}
@media (max-width: 759px){
  .heroApartSlider .cf-slide{
  transform-style: preserve-3d;
    width: clamp(240px, 78vw, 340px);
    height: clamp(360px, 60vh, 520px);
  }
  /* Mobile: preserva o enquadramento original (sem puxar topo) */
  .heroApartSlider .cf-inner img{ object-position: 50% 50%; }
}

.heroApartSlider .cf-inner{
  width: 100%;
  height: 100%;
  border-radius: 26px;

  /* recorte mais estável que apenas overflow+radius (evita "hairline" no Chrome) */
  overflow: hidden;
  /* clip-path removido: evitava, mas em alguns GPUs cria 'linha/halo' nas bordas */

  /* Fundo sólido real evita halo/ghosting nas quinas (clip-path + 3D) */
  background-color: #0b0f14;
  /* Fallback/preview enquanto o <img> carrega (usa --cfbg injetado no inline style) */
  background-image: var(--cfbg);
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;

  box-shadow: 0 28px 70px rgba(0,0,0,.55), inset 0 0 0 1px rgba(11,15,20,1);
  /* mascara subpixel: elimina bleed dos slides atrás */
  box-shadow: 0 28px 70px rgba(0,0,0,.55), inset 0 0 0 1px rgba(11,15,20,1);

  /* estabiliza rasterização sob 3D/scale */
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  outline: none;
  isolation: isolate;

  transform-origin: center;
  transition: transform .55s ease, box-shadow .55s ease, filter .55s ease, opacity .55s ease;
}
.heroApartSlider .cf-inner.isActive{
  box-shadow: 0 36px 92px rgba(0,0,0,.62), inset 0 0 0 1px rgba(255,255,255,.06);
}
.heroApartSlider .cf-inner img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  display: block;
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;

}

/* botões (opcionais) */
.heroApartSlider .cf-btn{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.35);
  background: rgba(255,255,255,.18);
  color: rgba(255,255,255,.95);
  font-size: 28px;
  line-height: 44px;
  cursor: pointer;
  z-index: 20;
  backdrop-filter: blur(8px);
}
.heroApartSlider .cf-prev{ left: 8px; }
.heroApartSlider .cf-next{ right: 8px; }
@media (max-width: 759px){
  .heroApartSlider .cf-btn{
    top: 60%;
    width: 40px; height: 40px; line-height: 40px; font-size: 26px;
    background: rgba(255,255,255,.12);
  }
}
/* ===== /HERO Coverflow (custom) ===== */



/* WhatsApp icon-only */
.srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
#top_primary_wa{display:inline-flex;align-items:center;justify-content:center;padding:8px 10px;border-radius:999px;}
#top_primary_wa .waIcon{width:22px;height:22px;display:block;}
/* FAB: só ícone em qualquer tamanho de tela */
.fab{
  width:54px;
  height:54px;
  padding:0;
  border-radius:999px;
  justify-content:center;
  gap:0;
}
.fab span,
.fab small{display:none !important;}
.fab .waFabIcon{width:30px;height:30px;display:block;}


/* ===== Mobile: HERO (refinado, colado no header) ===== */
@media (max-width: 759px){
  /* Encosta no header (sem barra branca) e evita "vazar" para baixo */
  .heroU{
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    border-radius: 0 !important;
    overflow-x: visible;
    overflow-y: hidden;
  }

  /* Sem cantos arredondados no fundo/overlay no mobile */
  .heroU::before,
  .heroU-slider{ border-radius: 0 !important; }

  /* Puxa tudo um pouco mais pra cima e reduz o "vazio" */
  .heroU-inner{
    padding-top: 4px !important;
    padding-bottom: 8px !important;
    gap: 8px !important;
  }

  /* Texto: mais limpo, centralizado e menor (sem aquele "bloco gigante") */
  .heroU-copy{
    max-width: 92vw;
    margin: 0 auto;
    padding: 8px 12px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(0,0,0,.32), rgba(0,0,0,.14));
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: 0 10px 26px rgba(0,0,0,.22);
    backdrop-filter: blur(8px);
  }
  .heroU-sub{
    font-size: 13px;
    margin: 0 0 6px 0;
    letter-spacing: .2px;
    color: rgba(255,255,255,.90);
  }
  .heroU-h1{
    font-size: clamp(24px, 8.5vw, 38px);
    line-height: 1.02;
    letter-spacing: -0.6px;
    text-shadow: 0 10px 28px rgba(0,0,0,.35);
  }

  /* Faz a área do carrossel encostar nos cantos */
  .heroU-media{
    width:100%;
    max-width:100%;
    margin-left:0;
    margin-right:0;
    overflow-x: clip;
  }
  /* @supports (width:100dvw) heroU-media disabled to avoid mobile horizontal overflow */

  /* Carrossel: mais alto e mais "hero" sem ficar exagerado */
  .heroApartSlider{
    height: clamp(360px, 58vh, 520px) !important;
  }
  .heroApartSlider .cf-slide{
    width: clamp(250px, 88vw, 380px) !important;
    height: clamp(360px, 58vh, 520px) !important;
  }
  .heroApartSlider .cf-inner{
    border-radius: 24px !important;
    box-shadow: 0 22px 60px rgba(0,0,0,.58) !important;
  }

  /* Botões de navegação mais discretos e levemente mais baixos */
  .heroApartSlider .cf-btn{
    width: 40px;
    height: 40px;
    font-size: 24px;
    line-height: 40px;
    background: rgba(255,255,255,.18);
    border: 1px solid rgba(255,255,255,.38);
  }
  .heroApartSlider .cf-prev{ left: 10px; top: 62%; }
  .heroApartSlider .cf-next{ right: 10px; top: 62%; }

  /* Se existir qualquer "faixa" abaixo do hero no mobile, remove */
  .heroU + *{ margin-top: 0 !important; }
}


/* ===== PATCH v57: HERO full-bleed no mobile (remove faixa branca laterais) ===== */
@media (max-width: 759px){
  /* Faz a SECTION inteira do hero ocupar 100% da viewport, mesmo dentro do .container */
  .heroU{
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow-x: clip;
  }
  @supports (width: 100dvw){
    .heroU{
      width: 100dvw !important;
      max-width: 100dvw !important;
      margin-left: calc(50% - 50dvw) !important;
      margin-right: calc(50% - 50dvw) !important;
    }
  }

  /* Garante que o fundo/overlay do hero também vá até os cantos */
  .heroU::before,
  .heroU-slider{
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    border-radius: 0 !important;
  }

  /* Evita qualquer "fiapo" lateral por overflow */
  html, body{ overflow-x: hidden; }
}


/* ===== PERF: renderização progressiva abaixo da dobra ===== */
@supports (content-visibility: auto){
  main.container > section:not(.heroU):not(.heroSearch){
    content-visibility: auto;
    contain-intrinsic-size: 1000px;
  }
}



/* === HERO (CTA dominante) - Mobile comercial forte === */
@media (max-width: 759px){
  /* deixa o HERO mais "curto" e com a copy sobreposta ao carrossel */
  .heroU-inner{
    padding: 0;
    gap: 0;
  }

  .heroU-copy{
    position: absolute;
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 22px);
    max-width: 520px;
    z-index: 5;
    text-align: center;

    background: rgba(0,0,0,.32);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 18px;
    padding: 16px 14px;
    text-shadow: none;
  }

  .heroU-sub{
    font-size: 12px;
    margin-bottom: 6px;
    opacity: .92;
  }

  .heroU-h1{
    font-size: 30px;
    line-height: 1.12;
    letter-spacing: -0.6px;
  }

  .heroU-desc{
    font-size: 14px;
    margin: 10px auto 14px auto;
    font-weight: 650;
  }

  .heroU-cta{
    margin-top: 8px;
  }

  /* 1 CTA só no mobile (mais conversão e menos poluição) */
  .heroU-btnGhost{ display:none; }

  .heroU-btn{
    width: 100%;
    padding: 14px 16px;
    font-size: 16px;
    box-shadow: 0 10px 22px rgba(0,0,0,.18);
  }

  /* carrossel mais compacto no mobile */
  .heroApartSlider.swiper{
    height: clamp(320px, 56vh, 520px);
    padding: 120px 0 34px; /* espaço pro card de texto por cima */
  }
}

/* Ajuste extra para telas bem pequenas */
@media (max-width: 380px){
  .heroU-h1{ font-size: 26px; }
  .heroU-desc{ font-size: 13px; }
}



/* =========================
   MOBILE HERO — COMERCIAL FORTE (v2)
   Objetivo: menos altura, 1 CTA dominante, visual clean.
   ========================= */
@media (max-width: 759px){
  /* deixa o topo mais compacto */
  .heroU-inner{
    padding: 14px 12px 14px !important;
    gap: 12px !important;
  }

  /* card do texto (glass) */
  .heroU-copy{
    background: rgba(0,0,0,.44) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 18px;
    padding: 16px 14px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
  }

  .heroU-sub{
    font-size: 13px !important;
    margin-bottom: 6px !important;
    opacity: .92;
  }

  .heroU-h1{
    font-size: 30px !important;
    line-height: 1.12 !important;
    margin: 0 0 8px 0 !important;
  }

  .heroU-desc{
    font-size: 14px !important;
    line-height: 1.35 !important;
    margin-bottom: 14px !important;
    opacity: .96;
  }

  /* só 1 CTA no mobile */
  .heroU-btnGhost{ display:none !important; }

  .heroU-cta{
    display: grid !important;
    gap: 10px !important;
  }

  .heroU-btnPrimary{
    width: 100% !important;
    padding: 14px 16px !important;
    font-size: 16px !important;
    border-radius: 999px !important;
    box-shadow: 0 10px 22px rgba(37,211,102,.35);
  }

  /* carrossel mais baixo pra não ocupar a tela inteira */
  .heroApartSlider.swiper{
    height: clamp(210px, 34vh, 320px) !important;
    padding-bottom: 12px !important;
  }
  .heroApartSlider.swiper .swiper-slide{
    height: clamp(190px, 30vh, 280px) !important;
  }

  /* overlay um pouco menos pesado */
  .heroU::before{
    background: linear-gradient(180deg,
      rgba(17,24,39,.55) 0%,
      rgba(17,24,39,.20) 55%,
      rgba(17,24,39,.10) 100%) !important;
  }
}

/* === MOBILE HERO: COMERCIAL FORTE (v3) === */
@media (max-width: 768px) {

  .heroU{
    height: 70vh !important;
  }

  .heroU-copy{
    background: rgba(0,0,0,0.35) !important;
    -webkit-backdrop-filter: blur(3px) !important;
    backdrop-filter: blur(3px) !important;
    border-radius: 18px !important;
    padding: 18px !important;
    margin: 0 15px !important;
  }

  .heroU-copy h1,
  .heroU-h1{
    font-size: 26px !important;
    line-height: 1.2 !important;
    margin-bottom: 10px !important;
  }

  .heroU-desc{
    font-size: 14px !important;
    margin-bottom: 18px !important;
  }

  .heroU-btnGhost{
    display: none !important;
  }

  .heroU-btnPrimary{
    width: 100% !important;
    padding: 16px !important;
    font-size: 17px !important;
    border-radius: 50px !important;
    box-shadow: 0 10px 25px rgba(37,211,102,0.45) !important;
  }

}


/* MOBILE: HERO ULTRA LIMPO (override) */
@media (max-width: 768px){

  .heroU{
    height: 58vh !important;
    min-height: 420px !important;
  }

  .heroU-copy{
    background: rgba(0,0,0,0.28) !important;
    backdrop-filter: blur(2px) !important;
    border-radius: 16px !important;
    padding: 14px 14px 16px !important;
    margin: 0 14px !important;
    box-shadow: none !important;
  }

  /* esconde textos extras no mobile (deixa limpo) */
  .heroU-sub,
  .heroU-desc{
    display: none !important;
  }

  .heroU-h1{
    font-size: 24px !important;
    line-height: 1.15 !important;
    margin: 0 0 12px !important;
    letter-spacing: -0.3px !important;
  }

  .heroU-btnGhost{
    display: none !important;
  }

  .heroU-btnPrimary{
    width: 100% !important;
    padding: 14px 16px !important;
    font-size: 16px !important;
    border-radius: 999px !important;
    box-shadow: 0 10px 22px rgba(37,211,102,0.35) !important;
  }
}


/* ===== LOGO OVERRIDE (garante no header vermelho) ===== */
header.headerRed .logo{background-image:url('/assets/logo.png') !important; background-repeat:no-repeat !important; background-position:center !important; background-size:contain !important; background-color:transparent !important;}


/* ===== PATCH: remover o card/CTA do HERO no MOBILE (mantém DESKTOP intacto) ===== */
@media (max-width: 768px){
  /* Remove TUDO do print (titulo + botao + card glass) apenas no celular */
  .heroU-copy{ display: block !important; }

  /* Como a copy some, não force altura grande no HERO */
  .heroU{ height:auto !important; min-height: unset !important; }

  /* Garante que o carrossel continue visível e centralizado */
  #heroApartSlider{ display:block !important; visibility:visible !important; opacity:1 !important; }
  .heroU-inner{ padding-top: 10px !important; padding-bottom: 10px !important; }
}



/* ============================
   HERO COVERFLOW (HOME) — AJUSTE SOMENTE DESKTOP
   Objetivo: carrossel mais alto/largo, slide central dominante,
   sem mexer no mobile.
   ============================ */
@media (min-width: 1024px){

  /* Faz o HERO ocupar mais a tela no desktop */
  .heroU{
    min-height: calc(100vh - 90px); /* desconta header */
  }
  .heroU-inner{
    min-height: calc(100vh - 90px);
  }

  /* Área do carrossel dentro do HERO */
  .heroU-media{
    max-width: 1600px; /* mais largo no desktop */
  }

  /* Garante que o container do coverflow tenha "altura" para não colapsar */
  #heroApartSlider.heroApartSlider{
    min-height: calc(100vh - 220px);
  }
  #heroApartSlider.heroApartSlider .cf-track{
    min-height: calc(100vh - 220px);
  }

  /* Slide (card) maior no desktop */
  #heroApartSlider.heroApartSlider .cf-slide{
    width: clamp(520px, 62vw, 980px);
    height: clamp(560px, 78vh, 980px);
  }

  /* Prédio/Imagem inteira dominante — só desktop (frame premium + sem halo) */
  #heroApartSlider.heroApartSlider .cf-inner{
    position: relative;
    background-color: rgba(9,12,14,.55);
    background-image: var(--cfbg);
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
  }
  #heroApartSlider.heroApartSlider .cf-inner::before{ content: none !important; }
  #heroApartSlider.heroApartSlider .cf-inner img{
    position: relative; z-index: 1;
    object-fit: contain;
    object-position: 50% 10%;
    background: transparent;
    display: block;
  }
}


/* =========================================================
   AJUSTE FINAL — SOMENTE DESKTOP (preserva 100% o mobile)
   Objetivo:
   - Subir o carrossel (tirar o "respiro" vertical do HERO)
   - Remover frase + botões acima/abaixo do carrossel no desktop
   Observação: NÃO altera @media (max-width: 759px)
   ========================================================= */
@media (min-width: 1024px){

  /* Remove completamente o bloco de texto/CTA no desktop */
  .heroU .heroU-copy{
    display: block !important;
  }

  /* Sobe o carrossel: reduz padding/gap APENAS no desktop */
  .heroU .heroU-inner{
    padding-top: 6px !important;
    padding-bottom: 10px !important;
    gap: 10px !important;
  }

  /* Evita qualquer margem extra na área de mídia */
  .heroU .heroU-media{
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Garante que o carrossel encoste no topo do HERO */
  .heroU .heroApartSlider.swiper{
    margin-top: 0 !important;
  }
}


/* ===== Premium polish (v2) ===== */
:where(a, button, input, select, textarea){transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease, opacity .18s ease}
:where(a, button){cursor:pointer}
:where(a, button):focus-visible, :where(input, select, textarea):focus-visible{outline:none; box-shadow: var(--ring)}
/* Buttons */
.btn, .heroU-btn, .ctaBtn, .hLink, .badge, .pill, .chip{ -webkit-tap-highlight-color: transparent; }
.heroU-btnPrimary{box-shadow: 0 14px 34px rgba(199,106,42,.28)}
.heroU-btnPrimary:hover{transform: translateY(-1px); box-shadow: 0 18px 44px rgba(199,106,42,.34)}
.heroU-btnGhost:hover{transform: translateY(-1px)}
/* Cards */
.card-row{box-shadow: var(--shadowSoft)}
.card-row:hover{transform: translateY(-2px); box-shadow: var(--shadowHover)}
.card-img img{filter:saturate(1.04) contrast(1.02)}
.badge2,.tag,.tag2{backdrop-filter: blur(10px)}
/* Featured cards */
.featured-card{box-shadow: var(--shadowSoft)}
.featured-card:hover{transform: translateY(-2px); box-shadow: var(--shadowHover)}
/* Header polish */
.headerRed{box-shadow: 0 10px 30px rgba(17,24,39,.06)}
.headerRed .hLink:hover{opacity:.95; transform: translateY(-1px)}
/* Section rhythm */
section{scroll-margin-top: 92px}
@media (prefers-reduced-motion: reduce){
  :where(a, button, input, select, textarea){transition:none !important}
  .card-row:hover,.featured-card:hover,.heroU-btnPrimary:hover{transform:none !important}
}


/* === Premium property cards (inspired by Property template) === */
.property-item{
  overflow: visible;
  background: transparent;
  box-shadow: none;
}
.property-link{ display:block; color: inherit; text-decoration: none; }
.property-thumb{
  border-radius: calc(var(--radius) + 10px);
  box-shadow: 0 18px 55px rgba(17,24,39,.14);
  aspect-ratio: 16/11;
}
.property-content{
  margin: -44px 14px 0;
  padding: 14px 14px 12px;
  background: rgba(255,255,255,.98);
  border-radius: calc(var(--radius) + 8px);
  box-shadow: 0 16px 40px rgba(17,24,39,.12);
  backdrop-filter: blur(10px);
}
.property-item:hover .property-thumb{ filter: saturate(1.12) contrast(1.06); }
.property-item:hover .property-content{ transform: translateY(-2px); }
.property-content{ transition: transform .14s ease, box-shadow .14s ease; }
.property-badges{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.property-actions{ margin-top: 10px; padding: 0 14px 14px; }
@media (max-width: 520px){
  .property-content{ margin: -38px 12px 0; }
  .property-actions{ padding: 0 12px 12px; }
}


/* === Visual upgrades v10 (Hero + Cards + Footer) === */
.heroU{
  min-height: 520px;
}
.heroU-inner{ padding: 26px 22px 22px; }
.heroU-copy{ max-width: 560px; }
.heroU-sub{ letter-spacing: .2px; opacity:.95; }
.heroU-h1{
  font-size: clamp(32px, 4.4vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 10px 0 10px;
}
.heroU-desc{ font-size: 16px; max-width: 46ch; opacity: .95; }
.heroU-cta{ gap: 12px; flex-wrap: wrap; }
.heroU-btn{ border-radius: 14px; }
.heroU-btnPrimary{
  box-shadow: 0 18px 50px rgba(0,0,0,.22);
}
.heroU-trust{
  margin-top: 14px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}
.trust-item{
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.96);
  font-size: 13px;
  backdrop-filter: blur(10px);
}
@media (max-width: 520px){
  .heroU{ min-height: 460px; }
  .heroU-inner{ padding: 20px 16px 16px; }
}

/* Cards: more premium */
.card-row{
  transition: transform .14s ease, box-shadow .14s ease;
  box-shadow: 0 14px 46px rgba(17,24,39,.10);
}
.card-img::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0; height: 46%;
  background: linear-gradient(to top, rgba(17,24,39,.28), rgba(17,24,39,0));
  pointer-events:none;
}
.card-row:hover{ transform: translateY(-3px); box-shadow: 0 18px 56px rgba(17,24,39,.14); }
.card-row:hover .card-img img{ transform: scale(1.03); filter: saturate(1.05) contrast(1.03); }
.card-img img{ transition: transform .22s ease, filter .22s ease; }
.badge2{
  backdrop-filter: blur(10px);
  background: rgba(22,163,74,.14);
  border-color: rgba(22,163,74,.22);
  box-shadow: 0 10px 26px rgba(17,24,39,.10);
}
.tag{
  backdrop-filter: blur(10px);
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.20);
}

/* Footer: more structured/premium */
.footer{
  border-top: 1px solid rgba(15,23,42,.10);
  background:
    radial-gradient(800px 260px at 12% 0%, rgba(0,85,85,.14), rgba(0,0,0,0)),
    radial-gradient(800px 260px at 88% 0%, rgba(0,32,74,.14), rgba(0,0,0,0)),
    linear-gradient(#ffffff, #ffffff);
}
.footer .foot-brand{ font-size: 20px; letter-spacing: -0.01em; }
.footer .foot-title{ font-weight: 700; }
.footer .foot-links a{ opacity:.92; }
.footer .foot-links a:hover{ opacity:1; }
.foot-bottom{
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(15,23,42,.08);
}
.foot-social{
  margin-top: 10px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}
.foot-social-link{
  font-size: 13px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(2,6,23,.04);
  border: 1px solid rgba(2,6,23,.06);
  text-decoration:none;
}
.foot-social-link:hover{ background: rgba(2,6,23,.06); }


/* ==== V11 PREMIUM POLISH (Hero + Cards + Footer) ==== */
.heroU{
  position:relative;
  overflow:hidden;
}
.heroU::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(1100px 520px at 15% 25%, rgba(0,85,85,.18), transparent 60%),
    radial-gradient(900px 460px at 85% 20%, rgba(0,32,74,.14), transparent 55%),
    linear-gradient(180deg, rgba(17,24,39,.02), rgba(17,24,39,.00));
  pointer-events:none;
  z-index:0;
}
#heroSlider{ z-index:0; }
.heroU-inner{ position:relative; z-index:1; }
.heroU-copy{
  backdrop-filter: blur(10px);
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.66));
  border: 1px solid var(--border);
  border-radius: 22px;
  box-shadow: var(--shadowSoft);
}
.heroU-h1{ letter-spacing:-.02em; }
.heroU-btnPrimary{
  box-shadow: 0 18px 50px rgba(0,85,85,.22);
}
.heroU-btnPrimary:hover{ transform: translateY(-1px); }
.heroU-trust > div{
  border: 1px solid rgba(17,24,39,.10);
  background: rgba(255,255,255,.7);
}

/* property cards: make image feel premium */
.property-link{
  position:relative;
  display:block;
  border-radius: 18px;
  overflow:hidden;
}
.property-link::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.00) 45%, rgba(0,0,0,.42) 100%);
  opacity:.65;
  pointer-events:none;
  z-index:1;
}
.property-thumb{
  transition: transform .35s ease, filter .35s ease;
  filter: saturate(1.05) contrast(1.02);
}
.property-item:hover .property-thumb{
  transform: scale(1.03);
  filter: saturate(1.1) contrast(1.04);
}
.property-content{
  position:relative;
  z-index:2;
  border-radius: 16px;
  box-shadow: 0 16px 46px rgba(17,24,39,.12);
}
.property-content .title{ font-weight: 700; }
.property-content .price{
  font-weight: 800;
  letter-spacing: -.01em;
}
.property-badges .badge{
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.22);
}
.property-badges .badge.destaque{
  box-shadow: 0 18px 40px rgba(0,85,85,.20);
}

/* testimonials polish */
.trust-quotes .quote{
  padding: 14px 14px 12px;
  border-radius: 16px;
  border: 1px solid rgba(17,24,39,.10);
  background: rgba(255,255,255,.72);
}
.trust-quotes .who{
  display:flex;
  gap:10px;
  align-items:center;
  margin-top:10px;
  color: var(--muted);
}
.trust-quotes .stars{
  font-size: 13px;
  letter-spacing: 1px;
  color: #f59e0b; /* amber for stars */
}
.trust-quotes .person{ font-weight: 600; color: rgba(17,24,39,.72); }

/* footer polish (subtle) */
footer{
  border-top: 1px solid rgba(17,24,39,.10);
  background:
    radial-gradient(900px 420px at 10% 20%, rgba(0,85,85,.10), transparent 55%),
    radial-gradient(900px 420px at 90% 10%, rgba(0,32,74,.10), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,1));
}


/* v14.1 spacing fix */
.sideCard.compact #sideWA{display:flex; align-items:center; justify-content:center; gap:8px; margin-top: 12px;}

/* ============================================================
   IMÓVEL (MOBILE): manter SOMENTE o botão flutuante (FAB)
   - Remove a barra fixa inferior (WhatsApp + coração)
   - Evita duplicação com botão lateral
   - Não afeta outras páginas
   ============================================================ */
@media (max-width: 980px){
  body.page-imovel #mobileBar,
  body.page-imovel .mobileBar{
    display: none !important;
  }
  body.page-imovel #sideWA{
    display: none !important;
  }
  /* Garante que o FAB aparece acima de tudo */
  body.page-imovel .floating-wa{
    display: flex !important;
    z-index: 9999 !important;
  }
}


/* ============================================================
   v14_8 - WA FAB: força visibilidade no mobile do /imovel
   - resolve casos de cache/regras antigas escondendo o botão
   - safe-area para Android/iOS
   ============================================================ */
.floating-wa{
  width:56px !important;
  height:56px !important;
  padding:0 !important;
  border-radius:50% !important;
  justify-content:center !important;
  gap:0 !important;
  right:20px !important;
  bottom: calc(16px + env(safe-area-inset-bottom)) !important;
  z-index: 9999 !important;
}
.floating-wa .t{display:none !important;}
.floating-wa .waFabIcon{width:28px !important; height:28px !important;}

/* Se alguma regra antiga esconder no /imovel, sobrescreve */
body.page-imovel .floating-wa{display:inline-flex !important;}
@media (max-width: 980px){
  body.page-imovel .floating-wa{display:flex !important;}
}

/* HERO premium vitrine fix (remove faixas escuras e deixa 'vitrine' centralizada) */
.heroApartSlider.swiper .heroSlideInner{border: none}
.heroApartSlider.swiper{max-width: 1080px; margin: 0 auto;}
@media(max-width: 759px){ .heroApartSlider.swiper{max-width: 100%;} }

/* ===== HERO: fundo sincronizado com o carrossel (SOMENTE DESKTOP) ===== */
@media (min-width: 992px){
  /* remove qualquer fundo fixo (ex: "sala") no desktop */
  .heroU{
    background-color: #0B3D4A !important;
    background-image: none !important;
  }

  /* fundo blur vindo do slide ativo (JS seta --heroBg) */
  .heroU::before{
    content:"";
    position:absolute;
    inset:-32px;              /* evita bordas do blur */
    background-image: var(--heroBg);
    background-size: cover;
    background-position: center;
    filter: blur(20px);
    transform: scale(1.10);
    opacity: .22;             /* destaque baixo */
    z-index: 0;
    pointer-events:none;
  }

  /* overlay pra assentar o fundo */
  .heroU::after{
    content:"";
    position:absolute;
    inset:0;
    background: linear-gradient(180deg, rgba(11,61,74,.55), rgba(11,61,74,.20));
    z-index: 0;
    pointer-events:none;
  }

  /* conteúdo acima do fundo */
  .heroU > *{
    position: relative;
    z-index: 1;
  }
}
/* ===== /HERO BG SYNC ===== */




/* ===== PATCH: remove hairline/halo on coverflow cards (Hostinger/CDN safe) =====
   Root cause: border-radius + overflow/clip-path + 3D transform + blur causes subpixel anti-alias halos.
   Fix: remove clip-path + dark inner background; avoid blur on images; force stable rasterization.
*/
.heroApartSlider.swiper .heroSlideInner{
  background: transparent !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  /* keep rounding but clip via border-radius only */
  border-radius: 26px !important;
  overflow: hidden !important;
  outline: none !important;
  box-shadow: 0 28px 70px rgba(0,0,0,.55);
  transform: translateZ(0) scale(1) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

.heroApartSlider.swiper .heroSlideInner img{
  filter: none !important;
  -webkit-filter: none !important;
  transform: translateZ(0) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

/* Non-active slides: keep contrast without blur (blur creates a halo at the clip edge) */
.heroApartSlider.swiper .swiper-slide:not(.swiper-slide-active) img{
  filter: saturate(.95) contrast(1.0) !important;
  -webkit-filter: saturate(.95) contrast(1.0) !important;
}

/* If any global rules add borders/outlines to images inside the hero, neutralize */
.heroApartSlider img{
  border: 0 !important;
  outline: 0 !important;
}




/* ===== PATCH: same halo fix for custom coverflow (.cf-inner) ===== */
.heroApartSlider .cf-inner{
  background: transparent !important;
  outline: none !important;
  border: 0 !important;
  overflow: hidden !important;
  border-radius: 26px !important;
  transform: translateZ(0) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

.heroApartSlider .cf-inner img{
  filter: none !important;
  -webkit-filter: none !important;
  transform: translateZ(0) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}



/* HERO background: lock solid (remove hero-bg image to avoid 'sala') */
.heroU{background-color:#062E37; background-image:none;}


/* ===== HERO: VIGNETTE LATERAL (v7) =====
   Objetivo: reduzir sensação de "vazio" nas laterais sem mudar geometria do carrossel.
   Implementação segura: usa ::after (não mexe no ::before já usado por blur/overlay).
*/
.heroU{ position: relative; }
.heroU::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1; /* acima do fundo/blur, abaixo do conteúdo */
  background:
    radial-gradient(1200px 520px at 50% 50%, rgba(0,0,0,0.00) 0%, rgba(0,0,0,0.10) 55%, rgba(0,0,0,0.38) 100%),
    linear-gradient(to right, rgba(0,0,0,0.52) 0%, rgba(0,0,0,0.16) 22%, rgba(0,0,0,0.16) 78%, rgba(0,0,0,0.52) 100%);
}
.heroU-inner{ position:relative; z-index:2; }


/* HERO headline above coverflow (v8) */
.heroU .heroU-copy{
  /* keeps it away from top border via heroU-inner padding; just fine-tunes proximity to carousel */
  margin-top: 0;
  margin-bottom: -6px;
}
@media (max-width: 759px){
  .heroU .heroU-copy{ margin-bottom: -4px; }
}

/* === FIX (v15): mobile - remover “linhas pretas” nas bordas (anti-alias) e tirar faixa inferior === */
/* Mantém headline em overlay (mesmo comportamento do v14) */
.heroU .heroU-copy{
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;

  position: absolute;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;

  width: min(980px, calc(100% - 20px));
  margin: 0;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;

  padding: 0;
  pointer-events: none;
}

.heroU .heroU-h1{
  margin: 0;
  padding: 0;

  font-size: clamp(22px, 3.1vw, 46px);
  line-height: 1.08;

  color: rgba(255,255,255,.98);
  text-align: center;

  text-shadow: 0 10px 28px rgba(0,0,0,.55), 0 2px 6px rgba(0,0,0,.55);
  white-space: normal;
  overflow: visible;
  text-overflow: initial;
}

/* Remove “respiros” que empurram o carrossel */
.heroU .heroU-inner{
  padding-top: 0 !important;
  margin-top: 0 !important;
  gap: 8px !important;
}
.heroU .heroU-media,
#heroApartSlider{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Mobile: correções anti-alias (bordas) + remove faixa inferior do Swiper */
@media (max-width: 768px){
  .heroU .heroU-copy{ top: 4px; }
  .heroU .heroU-h1{ font-size: clamp(20px, 6.8vw, 34px); line-height: 1.12; }

  /* 1) tira a “faixa” inferior criada pelo padding do swiper */
  .heroApartSlider.swiper{
    padding: 0 !important;              /* antes: 10px 0 56px */
    height: clamp(420px, 70vh, 760px) !important;
  }

  /* 2) evita hairlines na borda arredondada: imagem “vaza” 2–3% para cobrir pixels */
  .heroApartSlider.swiper .heroSlideInner{
    border-radius: 22px !important;
    background: transparent !important;
    transform: translateZ(0);
  }
  .heroApartSlider.swiper .heroSlideInner img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transform: translateZ(0) scale(1.03);  /* cobre as bordas */
    transform-origin: 50% 50%;
  }

  /* 3) suaviza a vinheta no mobile (menos “preto” nas laterais) */
  .heroApartSlider .cf-bg::after{
    background: radial-gradient(ellipse at center,
      rgba(8,10,12,0.10) 0%,
      rgba(8,10,12,0.40) 72%,
      rgba(8,10,12,0.55) 100%) !important;
  }
}


/* ===== HERO MOBILE: CENTRALIZAÇÃO GARANTIDA (FIX) ===== */
@media (max-width: 768px) {
  .heroU-copy{
    left: 50% !important;
    transform: translateX(-50%) !important;
    text-align: center !important;
    width: calc(100% - 20px) !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }
  .heroU-h1{
    text-align: center !important;
  }
}


/* ===== HERO / CARROSSEL - MOBILE: remover “barras pretas” (laterais e base) ===== */
@media (max-width: 768px) {
  /* Clareia o fundo blur no mobile para não parecer barra preta */
  .heroApartSlider .cf-bg{
    filter: blur(28px) brightness(0.82) saturate(1.05) !important;
    transform: scale(1.10) !important;
  }
  /* Suaviza a vinheta no mobile */
  .heroApartSlider .cf-bg::after{
    background: radial-gradient(ellipse at center,
      rgba(8,10,12,0.08) 0%,
      rgba(8,10,12,0.28) 70%,
      rgba(8,10,12,0.38) 100%) !important;
  }
  /* Remove a “faixa” inferior (era padding-bottom alto) */
  .heroApartSlider.swiper{
    padding-bottom: 16px !important;
  }
}


/* ===== HERO MOBILE OPTION 1 (SLIDE MAIS LARGO) ===== */
@media (max-width: 768px) {
  .heroApartSlider .swiper-slide {
    width: 92vw !important;
  }

  .heroApartSlider.swiper {
    padding-bottom: 10px !important;
  }
}


/* ===== FIX: IMAGENS DOS DESTAQUES (FEATURED) NÃO "ACHATADAS" =====
   Motivo: altura fixa (180px) deixa o recorte curto em desktop/mobile.
   Solução: usar aspect-ratio no wrapper e imagem ocupando 100% do box.
*/
.feat-img{
  aspect-ratio: 16 / 9;
}
.feat-img img{
  height: 100% !important;
}

/* Ajuste fino: um pouco mais alto no mobile sem distorcer */
@media (max-width: 759px){
  .feat-img{ aspect-ratio: 4 / 3; }
}


/* ===== FIX FINAL: IMAGENS DOS DESTAQUES EM FORMATO "PORTAL" (MAIS ALTAS) =====
   Alvo: .feat-img (wrapper da imagem nos cards de destaque)
   Resultado: imagem "cheia" e alta, como no exemplo enviado (mobile e desktop).
*/
.feat-img{
  aspect-ratio: 3 / 4 !important; /* desktop/tablet: alto sem exagero */
}
.feat-img img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

/* Mobile: ainda mais "portal" (quase vertical) */
@media (max-width: 759px){
  .feat-img{ aspect-ratio: 4 / 5 !important; }
}


/* ===== Tenants (MASTER): Template selector ===== */
.tenant-template{ margin-top: 10px; padding-top: 10px; border-top: 1px dashed rgba(0,0,0,0.08); }
.tenant-template .k{ font-size:12px; opacity:.7; margin-bottom:6px; }
.tenant-template .tpl-row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.tenant-template .tpl-select{ padding:6px 10px; border-radius:10px; border:1px solid rgba(0,0,0,0.12); background:#fff; }
