/* VSL Player — Imóvel em Dólar
   A barra e o botão ficam FORA do vídeo (abaixo). Nada cobre a imagem. */
.vslp { --vslp-ouro:#D4A63C; --vslp-ouro-hi:#F2CE66; width:100%; }

.vslp__palco{
  position:relative; width:100%; aspect-ratio:var(--vslp-ratio,16/9); background:#000;
  border-radius:14px; overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,.38);
}
.vslp__video{ width:100%; height:100%; display:block; object-fit:cover; cursor:pointer; background:#000; }

/* ---- aviso de som (único elemento sobre o vídeo, e some ao clicar) ---- */
.vslp__som{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(6,8,12,.55); cursor:pointer; z-index:3; backdrop-filter:blur(2px);
}
.vslp__som-caixa{
  display:flex; align-items:center; gap:16px; color:#fff;
  background:linear-gradient(135deg,rgba(10,13,18,.94),rgba(16,20,28,.88));
  border:2px solid var(--vslp-ouro); border-radius:999px; padding:16px 30px;
  box-shadow:0 14px 44px rgba(0,0,0,.55); animation:vslp-pulsa 2.1s ease-in-out infinite;
}
.vslp__som-caixa svg{ color:var(--vslp-ouro-hi); flex:0 0 auto; }
.vslp__som-caixa span{ display:flex; flex-direction:column; line-height:1.25; font-size:16px; font-weight:600; }
.vslp__som-caixa b{ color:var(--vslp-ouro-hi); font-size:18px; }
@keyframes vslp-pulsa{ 0%,100%{ transform:scale(1) } 50%{ transform:scale(1.045) } }

/* ---- controles ABAIXO do vídeo: barra fina + velocidade. Sem relógio. ---- */
.vslp__controles{
  display:flex; align-items:center; gap:12px;
  margin-top:10px; padding:0 2px;
}
.vslp__barra{
  flex:1 1 auto; height:4px; border-radius:3px;
  background:rgba(140,150,170,.28); overflow:hidden;
  pointer-events:none;                 /* visual: não dá para arrastar */
}
.vslp__preenche{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg,var(--vslp-ouro),var(--vslp-ouro-hi));
  transition:width .25s linear;
}
.vslp__vel{
  flex:0 0 auto; cursor:pointer;
  border:1px solid rgba(140,150,170,.45); background:transparent;
  color:inherit; opacity:.75;
  font-size:12px; font-weight:700; line-height:1;
  border-radius:999px; padding:5px 11px;
}
.vslp__vel:hover{ opacity:1; border-color:var(--vslp-ouro); color:var(--vslp-ouro); }

/* ---- CTA: abaixo dos controles, fora do vídeo, discreto ----
   O espaço fica reservado desde o começo (o botão só fica invisível), assim
   a página não "pula" quando ele aparece perto do fim do vídeo. */
.vslp__cta{
  display:flex; align-items:center; justify-content:center;
  margin-top:12px; min-height:44px;
}
.vslp__cta[hidden]{ display:flex; }
.vslp__cta[hidden] .vslp__botao{ visibility:hidden; pointer-events:none; }
.vslp__botao{
  display:inline-block; text-align:center; text-decoration:none;
  background:linear-gradient(135deg,#D4A63C,#F2CE66 55%,#C79A2E);
  color:#12161D; font-weight:800;
  font-size:15px; letter-spacing:.01em;
  padding:12px 30px; border-radius:10px;
  box-shadow:0 6px 18px rgba(0,0,0,.22);
  animation:vslp-entra .5s cubic-bezier(.2,.9,.3,1.2) both;
}
.vslp__botao:hover{ filter:brightness(1.06); }
@keyframes vslp-entra{ from{ opacity:0; transform:translateY(12px) } to{ opacity:1; transform:none } }

/* ---- elementos da página que só aparecem para quem assistiu ---- */
.vsl-trancado{ display:none !important; }
.vsl-liberado .vsl-trancado{ display:revert !important; }

@media (max-width:640px){
  .vslp__palco{ border-radius:10px; }
  .vslp__som-caixa{ padding:13px 20px; gap:11px; }
  .vslp__som-caixa span{ font-size:14px; }
  .vslp__som-caixa b{ font-size:15px; }
  .vslp__botao{ font-size:14px; padding:11px 24px; }
  .vslp__controles{ margin-top:8px; }
}