/* Página de vendas padrão: o mesmo design da VSL, com o argumento em texto e o vídeo só se a pessoa clicar. */

.heroi{padding-bottom:40px}
.heroi-corpo{text-align:left}
.heroi .fita-topo{margin-top:6px}
.heroi-mock{display:block;width:calc(100% + 24px);max-width:none;height:auto;margin:22px -12px 0;filter:drop-shadow(0 26px 30px rgba(0,0,0,.55))}
.heroi-preco{margin-top:14px;text-align:center;color:var(--suave);font:italic 800 clamp(1.15rem,5vw,1.4rem)/1.15 var(--fi);font-stretch:90%;text-transform:uppercase}
.heroi-preco s{color:var(--suave-2);text-decoration-color:var(--acento);text-decoration-thickness:2px}
.heroi-preco b{color:var(--acento);font-weight:900;font-size:1.45em;white-space:nowrap}
.heroi .botao{margin-top:14px}
.heroi-mini{margin-top:12px;text-align:center;color:var(--suave-2);font-size:.84rem}

/* o convite do vídeo: um botão discreto, abaixo do botão de compra */
.ver-video{display:grid;grid-template-columns:58px 1fr;align-items:center;gap:14px;width:100%;margin-top:22px;padding:8px 18px 8px 8px;border:0;border-radius:16px;background:rgba(242,244,241,.05);box-shadow:inset 0 0 0 1px var(--fio);color:var(--texto);text-align:left;cursor:pointer;font:inherit;transition:box-shadow var(--mv-t-hover) var(--mv-chega)}
.ver-video[hidden]{display:none}
.ver-video:hover{box-shadow:inset 0 0 0 1.5px var(--acento)}
.ver-video:focus-visible{outline:3px solid var(--acento);outline-offset:3px}
.ver-thumb{position:relative;display:block;aspect-ratio:9/13;border-radius:10px;overflow:hidden;background:#0b0d0b}
.ver-thumb img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block;opacity:.75}
.ver-thumb i{position:absolute;left:50%;top:50%;width:28px;height:28px;margin:-14px 0 0 -14px;border-radius:50%;background:var(--acento)}
.ver-thumb i::after{content:"";position:absolute;left:11px;top:8px;border-style:solid;border-width:6px 0 6px 9px;border-color:transparent transparent transparent #030403}
.ver-txt b{display:block;font:italic 900 1.05rem/1.1 var(--fi);font-stretch:90%;text-transform:uppercase}
.ver-txt small{display:block;margin-top:5px;color:var(--suave);font-size:.86rem;line-height:1.3}

/* o vídeo: em cima da página, sem perder o lugar da rolagem */
.video-modal{width:min(100vw,calc((100dvh - 118px) * 9 / 16 + 24px));max-width:100vw;max-height:100dvh;margin:auto;padding:12px;border:0;background:none;color:var(--texto);overflow:visible}
.video-modal::backdrop{background:rgba(3,4,3,.94)}
.video-modal video{display:block;width:100%;aspect-ratio:9/16;max-height:calc(100dvh - 118px);border-radius:14px;background:#000;box-shadow:0 0 0 1px rgba(18,245,34,.35)}
.video-modal .botao{min-height:56px;margin-top:10px;font-size:1.05rem}
.video-fechar{position:absolute;z-index:2;left:20px;top:20px;width:42px;height:42px;border:0;border-radius:50%;background:rgba(3,4,3,.78);color:var(--texto);font-size:1.6rem;line-height:1;cursor:pointer}
.video-fechar:focus-visible{outline:3px solid var(--acento);outline-offset:2px}

/* o argumento em texto */
.problema,.historia,.tese{padding:64px 0 56px;background:var(--fundo)}
.historia{padding-top:0}
.grande{font:italic 900 clamp(1.95rem,8.2vw,3rem)/.96 var(--fi);font-stretch:88%;text-transform:uppercase;letter-spacing:-.008em;text-wrap:balance}
.grande span{display:block;margin-top:.12em;color:var(--acento);text-shadow:0 0 24px rgba(18,245,34,.35)}
.problema p:not(.grande),.historia p,.tese p{margin-top:16px;color:var(--suave);line-height:1.55;max-width:62ch}
.problema b,.tese b{color:var(--texto)}
.problema{padding-bottom:72px}

.render{margin:30px 0 8px;padding:24px 22px 26px;border-radius:18px;background:var(--fundo-2);box-shadow:0 0 0 1.5px var(--acento),0 30px 80px -30px rgba(18,245,34,.4)}
.historia .render p{margin:0;max-width:none}
.historia .render-rot{color:var(--suave);font-size:.9rem}
.historia .render-antes{margin-top:8px;color:var(--suave-2);font:italic 900 clamp(2rem,10vw,2.9rem)/1 var(--fi);font-stretch:85%;text-transform:uppercase}
.historia .render-depois{margin-top:10px;color:var(--acento);font:italic 900 clamp(3rem,15.5vw,4.8rem)/.92 var(--fi);font-stretch:90%;text-transform:uppercase;text-shadow:0 0 40px rgba(18,245,34,.35)}

.tipos{margin:26px 0 0}
.tipos>div{display:grid;gap:8px;padding:20px 0;border-top:1.5px dashed rgba(242,244,241,.22)}
.tipos>div:last-child{border-bottom:1.5px dashed rgba(242,244,241,.22)}
.tipos dt{color:var(--acento);font:italic 900 clamp(1.7rem,7vw,2.3rem)/1 var(--fi);font-stretch:88%;text-transform:uppercase}
.tipos dd{margin:0;color:var(--suave);line-height:1.55}
@media (min-width:560px){.tipos>div{grid-template-columns:150px 1fr;gap:18px;align-items:baseline}}
.tese .ver-video{margin-top:26px}
.tese-fecho{margin-top:26px!important}

/* o preço agora vem depois do argumento */
#preco{padding-top:56px}

/* a Black acabou: nada de preço nem botão na primeira dobra */
body:not([data-estado="aberto"]) .heroi,body:not([data-estado="aberto"]) .barra-preco{display:none!important}
