/* Aviso de cookies e medição (MultiLead). Tokens do design system: tinta #111820, ação #1C5E90, linhas #DFE4EA/#C9D1DA.
   Uma fonte só (herda a da página: Archivo na landing e nas páginas legais, Inter em /planos). Sem degradê, brilho nem
   desfoque. Os dois botões (Aceitar e Recusar) usam a MESMA classe: mesmo tamanho, cor e peso. */
.pbm-panel{position:fixed;z-index:2147483000;left:16px;right:16px;bottom:16px;max-width:520px;margin:0;padding:16px 18px 18px;border:1px solid #C9D1DA;border-radius:12px;background:#fff;color:#111820;box-shadow:0 1px 2px rgba(17,24,32,.08),0 6px 20px -8px rgba(17,24,32,.20);font-size:14.5px;line-height:1.5;font-family:inherit;box-sizing:border-box}
.pbm-panel *{box-sizing:border-box;font-family:inherit}
.pbm-panel[hidden]{display:none!important}
.pbm-panel h2{margin:0 0 6px;font-size:16px;line-height:1.3;font-weight:700;color:#111820}
.pbm-panel p{margin:0 0 8px;color:#3F4A56}
.pbm-panel a{display:inline-block;margin:0 0 12px;color:#1C5E90;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.pbm-estado{color:#111820!important;font-weight:600}
.pbm-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pbm-choice{appearance:none;-webkit-appearance:none;min-height:44px;padding:8px 12px;border:1.5px solid #1C5E90;border-radius:8px;background:#fff;color:#1C5E90;font-size:15px;font-weight:700;line-height:1.2;cursor:pointer;transition:background-color .16s}
.pbm-choice:hover{background:#E8F0F7}
.pbm-choice[aria-pressed="true"]{background:#E8F0F7}
.pbm-choice:focus-visible,.pbm-panel a:focus-visible,.pbm-fechar:focus-visible{outline:3px solid #1C5E90;outline-offset:2px}
.pbm-fechar{appearance:none;-webkit-appearance:none;margin:10px 0 0;padding:6px 2px;border:0;background:none;color:#3F4A56;font-size:13.5px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
/* Com a Publicidade ligada: aviso com 3 botões iguais (Aceitar, Recusar, Escolher) e preferências com uma chave por finalidade.
   Interruptor (único lugar com pílula, DESIGN-SYSTEM): trilho #E8ECF0 desligado, #1C5E90 ligado. */
.pbm-actions.pbm-tres{grid-template-columns:repeat(3,minmax(0,1fr))}
.pbm-actions.pbm-uma{grid-template-columns:1fr}
.pbm-chaves{display:grid;gap:8px;margin:0 0 10px}
.pbm-chave{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;min-height:44px;padding:10px 12px;border:1px solid #DFE4EA;border-radius:8px;cursor:pointer}
.pbm-chave-caixa{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:40px;height:24px;margin:1px 0 0;border:1.5px solid #C9D1DA;border-radius:12px;background:#E8ECF0;cursor:pointer;transition:background-color .16s,border-color .16s}
.pbm-chave-caixa::after{content:"";position:absolute;top:3px;left:3px;width:15px;height:15px;border-radius:50%;background:#5E6A77;transition:transform .16s,background-color .16s}
.pbm-chave-caixa:checked{border-color:#1C5E90;background:#1C5E90}
.pbm-chave-caixa:checked::after{transform:translateX(16px);background:#fff}
.pbm-chave-caixa:focus-visible{outline:3px solid #1C5E90;outline-offset:2px}
.pbm-chave-texto{display:grid;gap:2px;color:#3F4A56;font-size:13.5px;line-height:1.4}
.pbm-chave-texto b{color:#111820;font-size:14.5px;font-weight:700}
@media (min-width:900px){.pbm-panel{right:auto;width:520px}}
@media (max-width:420px){.pbm-panel{left:12px;right:12px;bottom:12px;padding:14px 14px 16px;max-height:80vh;overflow:auto}.pbm-panel p{font-size:14px}}
@media (max-width:360px){.pbm-actions.pbm-tres .pbm-choice{padding:8px 6px;font-size:14px}}
/* Celular pequeno com o painel de preferências (Google+Meta) mais alto que a tela: o botão "Salvar escolha" fica grudado no fim do painel */
@media (max-width:420px){.pbm-panel .pbm-actions.pbm-uma{position:sticky;bottom:-16px;margin:0 -14px -16px;padding:8px 14px 16px;background:#fff;border-radius:0 0 12px 12px}}
@media (prefers-reduced-motion:reduce){.pbm-choice,.pbm-chave-caixa,.pbm-chave-caixa::after{transition:none}}
/* Aviso de 3 botões (Publicidade ligada) como FAIXA BAIXA, para não cobrir os botões da 1ª tela. O cartão de 520 px escondia
   "Testar 24 horas grátis", "Ver como funciona" e "Ver os 3 planos" (computador) e a faixa de períodos de /planos (celular) até a
   pessoa escolher. Agora: computador = faixa de ponta a ponta (cerca de 70 px), título e link na 1ª linha, texto na 2ª e os três
   botões em linha à direita; celular = título e link na 1ª linha, texto e os três botões em linha (cerca de 150 px).
   Só vale para o aviso de 3 botões (.pbm-tres): as preferências (.pbm-uma) e o aviso simples de 2 botões ficam como eram. O texto
   aprovado não mudou. Aceitar, Recusar e Escolher seguem com a MESMA classe e o mesmo tamanho (colunas iguais). Navegador sem
   :has() mantém o cartão de antes. A reserva de espaço (--pbm-reserva) continua medida pelo JS e acompanha a nova altura. */
@supports selector(:has(*)){
  .pbm-panel:has(>.pbm-actions.pbm-tres){display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;align-items:baseline;left:12px;right:12px;bottom:12px;width:auto;max-width:none;padding:10px 12px;font-size:13px;line-height:1.4}
  .pbm-panel:has(>.pbm-actions.pbm-tres)>h2{grid-column:1;grid-row:1;margin:0 0 2px;font-size:15px;line-height:1.3}
  .pbm-panel:has(>.pbm-actions.pbm-tres)>a{grid-column:2;grid-row:1;margin:0;font-size:13px;white-space:nowrap}
  .pbm-panel:has(>.pbm-actions.pbm-tres)>p{grid-column:1/-1;grid-row:2;margin:0 0 6px;font-size:13px;line-height:1.4}
  .pbm-panel:has(>.pbm-actions.pbm-tres)>.pbm-actions{grid-column:1/-1;grid-row:3}
}
@media (min-width:600px){
  @supports selector(:has(*)){.pbm-panel:has(>.pbm-actions.pbm-tres){left:16px;right:16px;padding:10px 14px}}
}
@media (max-width:360px){
  @supports selector(:has(*)){
    .pbm-panel:has(>.pbm-actions.pbm-tres){left:8px;right:8px;padding:10px}
    .pbm-panel:has(>.pbm-actions.pbm-tres)>p{font-size:12.5px}
  }
}
@media (min-width:900px){
  @supports selector(:has(*)){
    .pbm-panel:has(>.pbm-actions.pbm-tres){grid-template-columns:auto minmax(0,1fr) auto;column-gap:16px;padding:12px 18px;font-size:13.5px}
    .pbm-panel:has(>.pbm-actions.pbm-tres)>h2{grid-column:1;margin:0;font-size:16px}
    .pbm-panel:has(>.pbm-actions.pbm-tres)>a{grid-column:2;justify-self:start;font-size:13.5px}
    .pbm-panel:has(>.pbm-actions.pbm-tres)>p{grid-column:1/3;margin:2px 0 0;font-size:13.5px;line-height:1.5}
    .pbm-panel:has(>.pbm-actions.pbm-tres)>.pbm-actions{grid-column:3;grid-row:1/3;align-self:center;grid-template-columns:repeat(3,minmax(96px,1fr))}
  }
}
/* link de rodapé e botão da página /cookies que abrem as preferências */
.pbm-abrir-botao{margin-top:6px;appearance:none;-webkit-appearance:none;min-height:44px;padding:8px 16px;border:1.5px solid #1C5E90;border-radius:8px;background:#fff;color:#1C5E90;font-size:15px;font-weight:700;line-height:1.2;font-family:inherit;cursor:pointer}
.pbm-abrir-botao:hover{background:#E8F0F7}
.pbm-abrir-botao[hidden]{display:none!important}
/* Espaço reservado para o aviso (só com a Publicidade ligada: o módulo mede o painel à vista, grava --pbm-reserva e põe a classe
   pbm-com-aviso no <html> enquanto ele existe): a página ganha no fim uma folga do tamanho dele, o foco e as âncoras param acima
   dele, e as barras fixas de compra (planos, landing) sobem junto. Assim o aviso nunca cobre o botão de envio de /contato nem a
   barra de compra. Sem a classe (flags vazias, ou aviso escondido) nada disto vale: a página fica como sempre foi. */
:root{--pbm-reserva:0px}
html.pbm-com-aviso{scroll-padding-bottom:var(--pbm-reserva)}
.pbm-espaco{display:block;width:100%;height:var(--pbm-reserva);pointer-events:none}
.pbm-espaco[hidden]{display:none!important}
html.pbm-com-aviso body .barra-plano,html.pbm-com-aviso body .barra-movel{bottom:var(--pbm-reserva)}
html.pbm-com-aviso body .barra-plano:not(.on),html.pbm-com-aviso body .barra-movel:not(.on){transform:translateY(calc(110% + var(--pbm-reserva)))}
/* O balão "Pergunte aqui" (e a conversa, no computador) do assistente da landing sobem junto com o aviso: a faixa de ponta a ponta
   não pode escondê-los (o balão é fixo e não dá para alcançar rolando). Os valores base são os do assistente.css. */
html.pbm-com-aviso body .as-raiz{--as-rodape:calc(20px + var(--pbm-reserva))}
@media (max-width:899px){
  html.pbm-com-aviso body .as-raiz{--as-rodape:calc(76px + env(safe-area-inset-bottom) + var(--pbm-reserva))}
  html.pbm-com-aviso body .as-raiz[data-contexto="lp"]{--as-rodape:calc(84px + env(safe-area-inset-bottom) + var(--pbm-reserva))}
  html.pbm-com-aviso body .as-painel{bottom:var(--pbm-reserva);height:calc(100dvh - var(--pbm-reserva))}
}
@media (min-width:900px){
  html.pbm-com-aviso body .as-painel{height:min(660px,calc(100dvh - var(--as-rodape) - 20px))}
}