/* ============================================================
   VSL: player sem barra de progresso e sem duração
   ============================================================ */
.stage.vsl { cursor: default; }
.stage.vsl .frame { background: #07060a; }
.stage.vsl video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: contain;
  background: #07060a;
}
.stage.vsl video::-webkit-media-controls { display: none !important; }

.vsl-overlay {
  position: absolute; inset: 0; z-index: 3;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  padding: 24px;
  border: 0;
  color: #fff;
  font: inherit;
  text-align: center;
  cursor: pointer;
}
.vsl-overlay[hidden] { display: none; }
.vsl-start {
  background:
    linear-gradient(180deg, rgba(7,6,10,.25), rgba(7,6,10,.7)),
    var(--vsl-poster, none) center / cover no-repeat,
    #07060a;
}
.vsl-start .play { position: relative; margin-bottom: 8px; }
.vsl-start:hover .play { transform: scale(1.07); }
.vsl-start .vtitle { font-family: var(--serif); font-weight: 800; font-size: clamp(1.1rem, 2.6vw, 1.6rem); }
.vsl-start .vmeta { color: rgba(255,255,255,.72); font-size: .88rem; font-weight: 600; }

.vsl-sound { background: rgba(7,6,10,.35); }
.vsl-sound strong,
.vsl-sound > span:last-child {
  display: block;
  padding: 0 18px;
}
.vsl-sound strong { font-family: var(--serif); font-size: clamp(1.15rem, 3vw, 1.7rem); font-weight: 800; }
.vsl-sound > span:last-child { font-size: .92rem; font-weight: 700; opacity: .9; }
.vsl-sound-ico {
  width: 64px; height: 64px; margin-bottom: 6px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--pink);
  box-shadow: 0 16px 40px -10px rgba(255,47,131,.75);
  animation: vslPulse 1.6s ease-in-out infinite;
}
.vsl-sound-ico svg { width: 28px; height: 28px; }
@keyframes vslPulse { 50% { transform: scale(1.08); } }

.vsl-resume {
  position: absolute; inset: 0; z-index: 4;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  padding: 20px;
  background: rgba(7,6,10,.82);
  color: #fff; text-align: center;
}
.vsl-resume[hidden] { display: none; }
.vsl-resume p { font-family: var(--serif); font-weight: 800; font-size: clamp(1.05rem, 2.6vw, 1.45rem); }
.vsl-resume > div { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.vsl-link { background: none; border: 0; color: rgba(255,255,255,.75); font: inherit; font-size: .88rem; font-weight: 700; text-decoration: underline; cursor: pointer; }

/* barra de controles: sem progresso, sem tempo */
.vsl-bar {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  display: flex; align-items: center; gap: 6px;
  padding: 26px 10px 10px;
  background: linear-gradient(180deg, transparent, rgba(7,6,10,.75));
  opacity: 0;
  transition: opacity .25s ease;
}
.stage.vsl.started .vsl-bar { opacity: 1; }
.stage.vsl.started.playing.idle .vsl-bar { opacity: 0; }
.vsl-bar button {
  min-width: 44px; height: 40px;
  display: grid; place-items: center;
  padding: 0 10px;
  border: 0; border-radius: 10px;
  background: rgba(255,255,255,.12);
  color: #fff;
  font: inherit; font-size: .86rem; font-weight: 800;
  cursor: pointer;
}
.vsl-bar button:hover { background: rgba(255,47,131,.55); }
.vsl-bar svg { width: 20px; height: 20px; }
.vsl-grow { flex: 1; }
.vsl-speed { letter-spacing: .02em; }
.stage.vsl .i-play, .stage.vsl.paused .i-pause { display: none; }
.stage.vsl.paused .i-play { display: block; }
.stage.vsl .i-mute, .stage.vsl.muted .i-vol { display: none; }
.stage.vsl.muted .i-mute { display: block; }

/* tela cheia simulada (iOS) */
.stage.vsl.pseudo-full {
  position: fixed; inset: 0; z-index: 100;
  width: 100%; margin: 0; border-radius: 0; border: 0;
  display: grid; place-items: center;
  background: #000;
}
.stage.vsl.pseudo-full .frame {
  position: absolute; inset: 0;
  width: auto; height: auto; aspect-ratio: auto;
}
.stage.vsl:fullscreen .frame { height: 100%; aspect-ratio: auto; }

/* ============================================================
   Trava: mapa e oferta só depois do pitch
   ============================================================ */
body:not(.vsl-open) .vsl-gated,
body:not(.vsl-open) .sticky { display: none !important; }
body.vsl-open .vsl-locked { display: none; }
body.vsl-open .sticky { display: flex; }

.vsl-locked { padding: 34px 0 80px; text-align: center; }
.vsl-locked .wrap {
  width: min(560px, calc(100% - 32px));
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  padding: 26px 22px;
  border: 1.5px dashed rgba(189,70,126,.45);
  border-radius: 18px;
  color: rgba(255,240,223,.72);
  line-height: 1.5;
}
.vsl-locked b { color: var(--cream, #fff0df); }
.vsl-lock-ico { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,47,131,.12); color: var(--pink); }
.vsl-lock-ico svg { width: 20px; height: 20px; }

.vsl-unlocked-note {
  display: none;
  width: fit-content;
  margin: 14px auto 0;
  padding: 9px 16px;
  border-radius: 999px;
  background: var(--pink);
  color: #fff;
  font-size: .88rem; font-weight: 800;
}
body.vsl-open.just-unlocked .vsl-unlocked-note { display: block; animation: vslPulse 1.6s ease-in-out 3; }

.offer-cash { margin: -10px 0 16px; color: var(--muted); font-size: .9rem; font-weight: 700; }

@media (max-width: 700px) {
  .vsl-bar button { min-width: 42px; height: 38px; }
  .sticky .s-txt span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .vsl-sound-ico, body.vsl-open.just-unlocked .vsl-unlocked-note { animation: none; }
}

/* Texto do card de oferta estava creme sobre fundo claro */
.offer-card .offer-eyebrow { color: var(--pink); }
.offer-card .offer-sub { color: var(--muted); }