:root{
  --green:#148245;
  --green-dark:#0d532c;
  --gray-100:#f7f8f8;
  --gray-200:#e5e7eb;
  --shadow:0 12px 32px rgba(0,0,0,.15);
}

/* reset básico */
*{ box-sizing:border-box; }
body{ margin:0; font-family:"Roboto",system-ui,-apple-system,Segoe UI,Arial,sans-serif; color:#111; background:#fff; }
#app-header,#app-footer{ width:100%; }

    
/* 1) Neutraliza a regra global só para o hero */
main > .hero-empreendimento{
  padding:0 !important;
  margin:0 !important;           /* zera o margin-top/bottom da regra global */
}

/* 2) Full-bleed estável (sem deslocar por causa da barra de rolagem) */
.hero-empreendimento{
  position: relative;
  width: 100vw;
  margin-inline: calc(50% - 50vw);   /* encosta nas laterais da viewport */
  height: 70vh;
  min-height: 420px;
  overflow: hidden;
  background:#000;                   /* só para o fade da imagem */
}

/* 3) Imagem ocupando 100% do hero (sem “bordas”) */
.hero-empreendimento .hero-img{
  position:absolute;
  inset:0;                           /* top/right/bottom/left = 0 */
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:brightness(.9);
}

/* 4) Se quiser que o hero suba e encoste no header fixo, remova o padding-top global
      e aplique aqui só no que vem DEPOIS do header. Alternativa simples: compense no hero */
body{ padding-top: 6rem; } /* mantém seu layout atual */
.hero-empreendimento{ margin-top: -2rem; } /* tira o “respiro” que vinha do main section (opcional) */

/* 5) Garante que o card fique DENTRO do hero */
.destaque-card{
  position:absolute; left:50%; bottom:24px; transform:translateX(-50%);
  width:min(92%,1100px);
  background:#fff; border:1px solid var(--gray-200);
  border-radius:18px; box-shadow:var(--shadow);
  padding:14px 18px 18px;
}
.destaque-card::after{
  content:""; position:absolute; left:12%; right:12%; bottom:-12px; height:18px;
  border-radius:999px; filter:blur(8px);
  background:radial-gradient(closest-side, rgba(0,0,0,.28), transparent 65%);
  z-index:-1;
}

/* faixa superior do card */
.decorado-bar{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  background:#f5f4f4; border:1px solid #6d6d6d;
  padding:10px 12px; border-radius:12px; margin-bottom:10px;
}
.decorado-bar strong{ color:#111; }
.decorado-bar .decorado-local{ color:#3a3a3a; }
.decorado-bar .btn-outline{
  margin-left:auto; padding:8px 14px; border-radius:999px;
  border:2px solid var(--green); color:var(--green); text-decoration:none; font-weight:800;
  transition:.2s transform,.2s filter;
}
.decorado-bar .btn-outline:hover{ transform:translateY(-1px); filter:brightness(1.05); }

/* linha única de features */
.destaque-features{
  list-style:none; margin:0; padding:0;
  display:flex; gap:24px; align-items:center; color:#000000;
  white-space:nowrap; overflow:auto;
}

/* ========== SOBRE (texto + vídeo 50vw) ========== */
.sobre-empreendimento{
  position:relative; width:min(1200px,92vw);
  margin:3.5rem auto; display:grid;
  grid-template-columns:1fr 1fr; gap:clamp(18px,3vw,32px); align-items:stretch;
}
.sobre-empreendimento .decor{
  position:absolute; z-index:-1; border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(20,130,69,.18),transparent 60%);
  filter:blur(2px);
}
.sobre-empreendimento .decor.tl{ width:300px; height:190px; top:-50px; left:-60px; }
.sobre-empreendimento .decor.br{ width:340px; height:220px; right:-80px; bottom:-50px; }

.sobre-col{
  display:flex; flex-direction:column; background:#fff;
  border:1px solid var(--gray-200); border-radius:16px;
  padding:clamp(16px,2.6vw,22px); box-shadow:0 10px 24px rgba(0,0,0,.06);
}
.sobre-header h2{
  margin:0 0 8px; color:var(--green); font-weight:900;
  font-size:clamp(1.4rem,3.2vw,1.9rem);
}
.sobre-header p{ margin:0; color:#444; line-height:1.65; font-size:1.05rem; }

.btn-ficha{
  margin-top:14px; align-self:flex-start; padding:.7rem 1.4rem;
  border:2px solid var(--green); background:var(--green); color:#fff;
  border-radius:999px; font-weight:800; cursor:pointer;
  box-shadow:0 10px 20px rgba(20,130,69,.18);
  transition:.2s transform,.2s filter;
}
.btn-ficha:hover{ transform:translateY(-2px); filter:brightness(1.05); }

.ficha-tecnica{
  margin-top:12px; background:var(--gray-100);
  border:1px solid var(--gray-200); border-radius:12px; padding:14px;
}
.ficha-tecnica ul{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }

/* vídeo 50vw */
.video-col{ display:flex; flex-direction:column; align-items:flex-end; }
.video-frame{
  width:50vw; max-width:100%; aspect-ratio:16/9;
  border-radius:16px; overflow:hidden; background:#000;
  box-shadow:0 10px 24px rgba(0,0,0,.08);
}
.video-frame video{ width:100%; height:100%; display:block; pointer-events:none; }

/* ========== MAPA ========== */
.mapa-empreendimento{
  width:min(1120px,92vw); margin:2rem auto 4rem; text-align:center;
}
.mapa-empreendimento h2{
  margin:0 0 .8rem; color:var(--green);
  font-size:clamp(1.2rem,2.6vw,1.6rem); font-weight:900; letter-spacing:.2px;
}
.mapa-empreendimento .map-box{
  border:1px solid rgba(17,24,39,.08);
  box-shadow:0 16px 34px rgba(0,0,0,.10); border-radius:16px; overflow:hidden;
}
.mapa-empreendimento iframe{ width:100%; height:420px; border:0; display:block; }

/* ========== GALERIA (16:9) ========== */
.galeria-empreendimento{
  width:min(1200px,92vw); margin:0 auto 4rem;
}
.galeria-empreendimento h2{
  margin:.5rem 0 1rem; color:var(--green); font-weight:900;
}
.grid-galeria{
  display:grid; gap:14px;
  grid-template-columns:repeat(3,1fr);
}
.gal-item{
  position:relative; width:100%; aspect-ratio:16/9;
  border-radius:12px; overflow:hidden; background:#eee;
  box-shadow:0 8px 20px rgba(0,0,0,.06); transition:.2s transform,.2s box-shadow;
}
.gal-item:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(0,0,0,.1); }
.gal-item img{ width:100%; height:100%; object-fit:cover; display:block; }

/* responsivo */
@media (max-width:1000px){
  .whats-float.right{ right:-14px; }
  .whats-float .avatar{ width:60px; height:60px; }
}
@media (max-width:900px){
  .whats-float.right{ position:relative; right:auto; top:auto; transform:none; margin-top:8px; padding-left:68px; }
  .sobre-empreendimento{ grid-template-columns:1fr; }
  .video-frame{ width:100%; }
  .grid-galeria{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:600px){
  .grid-galeria{ grid-template-columns:1fr; }
}
.destaque-features li.spec-quartos::before { background-image:url(/imagens/vetor.cama.png); }
.destaque-features li.spec-m2::before      { background-image:url(/imagens/vetor.m2.png); }
.destaque-features li.spec-jardim::before  { background-image:url(/imagens/vetor.jardim.png); }
.destaque-features li.spec-garagem::before { background-image:url(/imagens/vetor.garagem.png); }
.destaque-features li.spec-piscina::before { background-image:url(/imagens/vetor.piscina.png); }
.destaque-features li.spec-quadra::before  { background-image:url(/imagens/vetor.quadra.png); }
.destaque-features li.spec-arearecreativa::before { background-image:url(/imagens/vetor.arearecreativa.png); }
.destaque-features li.spec-parquinho::before { background-image:url(/imagens/vetor.parquinho.png); }