/* Lista de interessados do lançamento (31/10/2026). Usa as variáveis de tokens.css. */
.li-sec{padding:72px 20px}
.li-card{position:relative;max-width:1080px;margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;background:#1A1C1A;color:#F7F4E6;border-radius:28px;padding:56px 56px 56px 72px;overflow:hidden;box-shadow:0 30px 80px rgba(26,28,26,.18)}
.li-fita{position:absolute;left:0;top:0;bottom:0;width:14px;display:flex;flex-direction:column}
.li-fita i{flex:1}.li-fita i:nth-child(1){background:#C9453D}.li-fita i:nth-child(2){background:#E8BE3A}.li-fita i:nth-child(3){background:#3C74B4}.li-fita i:nth-child(4){background:#55924F}
.li-kicker{margin:0;font:600 13px/1.2 Archivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#E8BE3A}
.li-tit{margin:14px 0 0;font:800 44px/1.05 Archivo,system-ui,sans-serif;letter-spacing:-1px;color:#F7F4E6}
.li-tit em{font-family:'Source Serif 4',Georgia,serif;font-style:italic;font-weight:600;letter-spacing:-.5px}
.li-sub{margin:18px 0 0;font:400 18px/1.55 'Source Serif 4',Georgia,serif;color:#D8DBD4}
.li-pontos{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:8px;font:500 15px Archivo,system-ui,sans-serif;color:#C9CDC6}
.li-pontos li::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#55924F;margin-right:10px;vertical-align:1px}
.li-form{background:#F7F4E6;color:#1A1C1A;border-radius:20px;padding:28px;display:grid;gap:14px}
.li-campo{display:grid;gap:6px;font:600 13px Archivo,system-ui,sans-serif;color:#4A4F4B}
.li-campo input{font:400 17px Archivo,system-ui,sans-serif;color:#1A1C1A;background:#FBFBF9;border:1.5px solid #D6D9D1;border-radius:12px;padding:13px 14px;min-height:48px;outline:none}
.li-campo input:focus{border-color:#1A1C1A;box-shadow:0 0 0 3px rgba(232,190,58,.45)}
.li-ok{display:flex;gap:10px;align-items:flex-start;font:400 14px/1.45 Archivo,system-ui,sans-serif;color:#4A4F4B;cursor:pointer}
.li-ok input{width:20px;height:20px;margin:1px 0 0;accent-color:#1A1C1A;flex:none}
.li-btn{font:700 17px Archivo,system-ui,sans-serif;color:#F7F4E6;background:#1A1C1A;border:0;border-radius:999px;min-height:52px;padding:0 24px;cursor:pointer}
.li-btn:hover{background:#000}.li-btn:focus-visible{outline:3px solid #E8BE3A;outline-offset:2px}
.li-btn[disabled]{opacity:.6;cursor:wait}
.li-msg{margin:0;min-height:1.2em;font:600 14px Archivo,system-ui,sans-serif}
.li-msg.ok{color:#2F6B2A}.li-msg.erro{color:#B4322B}
.li-lgpd{margin:0;font:400 12.5px/1.4 Archivo,system-ui,sans-serif;color:#767C77}
.li-lgpd a{color:inherit}
.li-form.feito .li-campo,.li-form.feito .li-ok,.li-form.feito .li-btn,.li-form.feito .cf-turnstile{display:none}
.li-feito{display:none}
.li-form.feito .li-feito{display:block;text-align:center;padding:18px 6px}
.li-feito b{display:block;font:800 26px Archivo,system-ui,sans-serif}
.li-feito span{display:block;margin-top:8px;font:400 16px/1.5 'Source Serif 4',Georgia,serif;color:#4A4F4B}
@media (max-width:820px){
  .li-sec{padding:48px 16px}
  .li-card{grid-template-columns:1fr;gap:28px;padding:36px 22px 24px 34px;border-radius:22px}
  .li-tit{font-size:34px}
  .li-sub{font-size:17px}
  .li-form{padding:20px}
}
/* pub-claude-merge-20261007: host do Turnstile montado por js/turnstile.js e botão «Criar conta» depois do lançamento. */
.li-form.feito .li-turnstile{display:none}
.li-turnstile{min-height:65px}
a.li-btn-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;justify-self:start}
.li-campo small{font-weight:400;color:#767C77}
/* Faixa «Lançamento em 31/10» (pub-cadastro-31out): estilo que estava embutido no HTML, bloqueado pela CSP. Mesmos valores. */
#pp-lancamento-home{background:var(--card,#FBFBF9);border-bottom:1px solid var(--rule,#D6D9D1);border-left:4px solid #E8BE3A;font-size:14px;line-height:1.45;padding:10px 16px;text-align:center}
#pp-lancamento-home[hidden]{display:none}
/* pub-precad-mobile-fix-20261007: no celular o bloco estourava a borda direita. Causa: a coluna do grid (1fr = minmax(auto,1fr)) crescia
   até o mínimo do conteúdo (Turnstile 300px + 2x20px do formulário = 340px), maior que o espaço dentro do cartão (302px em 390px).
   O cartão tem overflow:hidden, então texto e formulário eram cortados à direita. Só celular/tablet; desktop igual. */
@media (max-width:820px){
  .li-card{grid-template-columns:minmax(0,1fr)}
  .li-texto,.li-form{min-width:0}
}
@media (max-width:480px){
  .li-sec{padding:40px 10px}
  .li-card{padding:30px 12px 14px 26px;gap:24px}
  .li-form{padding:18px 12px}
  .li-turnstile{margin-inline:-12px;display:flex;justify-content:center}
}

/* pub-lista-conversao-20261011: botão «Quero ser avisado» na primeira tela do celular, só com o cadastro fechado. Usa .btn/.btn-p da home. */
.li-hero-cta{display:none}
@media (max-width:820px){
  .pp-cadastro-fechado .li-hero-cta{display:flex;margin:22px 0 22px}
  .pp-cadastro-fechado .li-hero-cta .btn{flex:1 1 100%}
  .pp-lista-off .li-hero-cta{display:none}
}
