@import url("tokens.css");
/* Formulário de captura, 07/10/2026: download dos modelos em /templates/,
   lista de espera da plataforma e newsletter da home (#novidades).
   Envia para /api/captura (painel OSF). Comportamento em captura.js.
   Segue SISTEMA-VISUAL.md: tokens, canto de 4px, traço de 1px, sem sombra.
   Erro sem depender de cor: borda mais grossa e mensagem escrita. */

.captura{display:grid;gap:18px;min-width:0;font-family:var(--mono)}
.captura-campos{display:grid;gap:16px;min-width:0}
.captura-linha{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.captura-campo{display:grid;gap:6px;min-width:0}
.captura-rotulo,.captura-opcoes legend{
  padding:0;color:var(--tinta);font:600 11px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;
}
.captura-rotulo small{color:var(--tinta-fraca);font-weight:500;text-transform:none;letter-spacing:0}

.captura input[type=email],.captura input[type=text],.captura select{
  width:100%;min-height:44px;margin:0;padding:10px 12px;border:1px solid var(--linha);border-radius:4px;
  background:var(--fundo);color:var(--tinta);font:400 16px/1.4 var(--mono);
}
.captura input::placeholder{color:var(--tinta-fraca)}
.captura-select{position:relative;display:block}
.captura select{appearance:none;-webkit-appearance:none;padding-right:36px;cursor:pointer}
.captura-select::after{
  content:"";position:absolute;top:50%;right:14px;width:7px;height:7px;margin-top:-6px;pointer-events:none;
  border-right:1.5px solid var(--tinta-fraca);border-bottom:1.5px solid var(--tinta-fraca);transform:rotate(45deg);
}
.captura input:focus,.captura select:focus{outline:2px solid var(--tinta);outline-offset:1px;border-color:var(--tinta)}
.captura [aria-invalid="true"]{border-color:var(--tinta);border-width:2px}
.captura-erro{margin:0;color:var(--tinta);font:600 12px/1.5 var(--mono)}
.captura-erro::before{content:"↳ "}

/* escolha do modelo: cartões de rádio */
.captura-opcoes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;min-width:0;margin:0;padding:0;border:0}
.captura-opcoes legend{margin-bottom:6px;grid-column:1/-1}
.captura-opcao{position:relative;display:block;min-width:0;cursor:pointer}
.captura-opcao input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.captura-opcao span{
  display:grid;gap:2px;min-height:56px;padding:10px 12px;border:1px solid var(--linha);border-radius:4px;
  background:var(--fundo);color:var(--tinta);font:600 14px/1.3 var(--mono);
}
.captura-opcao small{color:var(--tinta-fraca);font:500 11px/1.4 var(--mono)}
.captura-opcao:hover span{border-color:var(--tinta)}
.captura-opcao input:checked+span{border-color:var(--escuro);background:var(--escuro);color:var(--no-escuro)}
.captura-opcao input:checked+span small{color:var(--no-escuro-fraco)}
.captura-opcao input:focus-visible+span{outline:2px solid var(--tinta);outline-offset:2px}

.captura-aceite{
  display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;align-items:start;
  color:var(--corpo);font:400 13px/1.55 var(--mono);cursor:pointer;
}
.captura-aceite input{width:16px;height:16px;margin:2px 0 0;accent-color:var(--escuro)}

.captura-botao,.captura-download{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;justify-self:start;min-height:44px;
  padding:8px 20px;border:1px solid var(--tinta);border-radius:4px;background:var(--tinta);color:var(--fundo);
  font:600 14px/1.4 var(--mono);text-decoration:none;cursor:pointer;
}
.captura-botao:hover,.captura-download:hover{background:var(--escuro-elevado)}
.captura-botao[disabled]{opacity:.6;cursor:progress}
.captura-botao:focus-visible,.captura-download:focus-visible{outline:2px solid var(--tinta);outline-offset:3px}

.captura-finalidade{max-width:64ch;margin:0;color:var(--tinta-fraca);font:400 12px/1.6 var(--mono)}
.captura-finalidade a{color:inherit}

.captura-retorno{display:grid;gap:12px;justify-items:start;padding:16px;border:1px solid var(--linha);border-radius:4px;background:var(--suave);color:var(--tinta);font:400 14px/1.6 var(--mono)}
.captura-retorno:empty{display:none}
.captura-retorno p{margin:0}
.captura-retorno[data-tipo="erro"]{border:2px solid var(--tinta)}
.captura-retorno small{color:var(--tinta-fraca);font-size:12px}

/* isca contra robô: fora da tela, nunca type=hidden */
.captura-isca{position:absolute!important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}

/* inscrição concluída: some o formulário, fica a confirmação */
.captura-concluida .captura-campos,.captura-concluida .captura-botao,.captura-concluida .captura-finalidade{display:none}

/* variante sobre fundo escuro */
.captura-escura .captura-rotulo,.captura-escura legend{color:var(--no-escuro)}
.captura-escura .captura-rotulo small,.captura-escura .captura-finalidade{color:var(--no-escuro-fraco)}
.captura-escura input[type=email],.captura-escura input[type=text]{border-color:rgba(255,255,255,.24);background:var(--escuro-elevado);color:var(--no-escuro)}
.captura-escura input::placeholder{color:var(--no-escuro-fraco)}
.captura-escura input:focus{outline-color:var(--no-escuro);border-color:var(--no-escuro)}
.captura-escura [aria-invalid="true"]{border-color:var(--no-escuro)}
.captura-escura .captura-erro{color:var(--no-escuro)}
.captura-escura .captura-botao{border-color:var(--no-escuro);background:var(--no-escuro);color:var(--escuro)}
.captura-escura .captura-botao:hover{background:var(--cinza)}
.captura-escura .captura-botao:focus-visible{outline-color:var(--no-escuro)}
.captura-escura .captura-retorno{border-color:rgba(255,255,255,.24);background:var(--escuro-elevado);color:var(--no-escuro)}
.captura-escura .captura-retorno[data-tipo="erro"]{border-color:var(--no-escuro)}
.captura-escura .captura-retorno small{color:var(--no-escuro-fraco)}

@media (max-width:640px){
  .captura-linha{grid-template-columns:1fr}
  .captura-opcoes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .captura-botao{justify-self:stretch}
}
@media (prefers-reduced-motion:reduce){.captura *{transition:none!important}}

/* Seção #novidades da home PT, depois de #parceiros: convite ao blog e à
   newsletter. Mesma moldura da seção de parceiros (parceiros.css). */
.novidades{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:40px;align-items:start;
  margin-top:32px;padding:32px;border:1px solid var(--linha);background:var(--fundo);
}
.novidades-rotulo{margin:0 0 12px;color:var(--tinta-fraca);font:600 11px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em}
.novidades-intro h2{max-width:24ch;margin:0 0 12px;color:var(--tinta);font:700 24px/1.3 var(--mono);letter-spacing:-.035em}
.novidades-intro p{max-width:52ch;margin:0 0 12px;color:var(--corpo);font:400 13px/1.6 var(--mono)}
.novidades-blog{padding-bottom:2px;border-bottom:1px solid var(--linha);color:var(--tinta);font-weight:600;text-decoration:none}
.novidades-blog:hover{border-bottom-color:var(--tinta)}
.novidades-blog:focus-visible{outline:2px solid var(--tinta);outline-offset:4px}
.novidades-tipos{display:grid;gap:0;margin:20px 0 0;padding:0;border-top:1px solid var(--linha);list-style:none}
.novidades-tipos li{display:grid;gap:2px;padding:12px 0;border-bottom:1px solid var(--linha)}
.novidades-tipos b{color:var(--tinta);font:600 13px/1.5 var(--mono)}
.novidades-tipos span{color:var(--tinta-fraca);font:400 12px/1.5 var(--mono)}
@media(max-width:780px){
  .novidades{grid-template-columns:1fr;gap:28px;padding:24px}
}
@media(max-width:520px){
  .novidades{margin-top:24px;padding:24px 20px}
}