/* Correções de layout: os rótulos em português são mais largos que os textos
   originais em inglês, e o Framer fixou a largura dos botões nesses textos. */

/* Botão link (header, "Saiba mais", planos...) */
.framer-1Qhmj[class*="framer-v-"] .framer-u9nypq { flex: none; width: auto; }
.framer-1Qhmj[class*="framer-v-"] .framer-1qciqsl { white-space: nowrap; width: auto; }
.framer-1Qhmj.framer-1eml92v { min-width: max-content; }

/* Contêineres que limitavam a largura ao tamanho do texto em inglês */
.framer-vABq5 .framer-1uhimye-container,
.framer-cmudN .framer-1c5gnh1-container,
.framer-fMxL4 .framer-1qzcma8-container,
.framer-kIByZ .framer-av32jv-container { max-width: max-content; }

/* Botão do formulário (hero) */
.framer-YIk0w[class*="framer-v-"] .framer-1yuwjuw,
.framer-YIk0w[class*="framer-v-"] .framer-1l1s3ef { flex: none; width: auto; }
.framer-YIk0w[class*="framer-v-"] .framer-trrl99 { white-space: nowrap; width: auto; }
.framer-YIk0w .framer-91vqmg { flex: none; width: 16px; }
.framer-YIk0w.framer-aorlt6 { min-width: max-content; }
@media (min-width: 810px) { .framer-Vj8lO .framer-1co9fvh-container { width: max-content; max-width: none; } }

/* Hero: títulos em português ocupam mais largura; mantém 2 linhas como o original
   para o feixe verde continuar encostando na imagem do painel. */
@media (min-width: 810px) {
  .framer-Vj8lO .framer-1bmhfw7 { width: 100%; max-width: 880px; }
  .framer-Vj8lO .framer-xhhv9l { width: 100%; max-width: 680px; }
}

/* Seção de conteúdos do template (artigos fictícios) fica oculta */
.framer-1gwqv87 { display: none !important; }

/* Planos: seletor próprio (Mensal / Trimestral / Anual) no lugar do alternador original */
#vz-planos [data-framer-name="Buttons"] { display: none !important; }
.vz-period {
  align-self: center; display: inline-flex; gap: 4px; padding: 8px; margin: 0 auto;
  border: 1px solid rgba(70, 150, 50, .35); border-radius: 999px; background: rgba(8, 14, 8, .9);
}
.vz-period button {
  appearance: none; border: 0; cursor: pointer; font: 500 16px/24px Inter, system-ui, sans-serif; color: #fff;
  padding: 8px 24px; border-radius: 999px; background: transparent; transition: background .3s, box-shadow .3s;
}
.vz-period button[aria-pressed="true"] {
  background: linear-gradient(180deg, #62c242 0%, #3a8a28 55%, #2c6b1f 100%);
  box-shadow: inset 0 1px 6px rgba(255, 255, 255, .35);
}
.vz-period button:focus-visible { outline: 2px solid #8be36b; outline-offset: 2px; }
.framer-pipfz { justify-content: center; }
.framer-cmudN .framer-pipfz > [class*="-container"] { flex: 0 1 460px; width: auto; max-width: 100%; }
.framer-pipfz[data-vz-period="0"] > :nth-child(n+2) { display: none !important; }
.framer-pipfz[data-vz-period="1"] > :nth-child(1),
.framer-pipfz[data-vz-period="1"] > :nth-child(3) { display: none !important; }
.framer-pipfz[data-vz-period="2"] > :nth-child(-n+2) { display: none !important; }

/* Planos: céu estrelado em todos os cards, com movimento bem lento */
@keyframes vz-sky {
  0% { transform: scale(1.06) translate3d(0, 0, 0); }
  100% { transform: scale(1.16) translate3d(-2.5%, 2%, 0); }
}
.framer-OplxN [data-framer-background-image-wrapper] img {
  animation: vz-sky 80s ease-in-out infinite alternate; will-change: transform;
}

/* Painel do hero: imagem real do VoraZap tem proporção 2000:1089 (o mockup original era 4188:2979) */
.framer-Vj8lO .framer-195ejxk { aspect-ratio: 2000 / 1085; }

/* Logo do header: o Framer fixava o contêiner em 167px */
.framer-cmudN .framer-vABq5 .framer-1nuxl4o { flex: 0 0 auto; width: clamp(135px, 11vw, 172px); max-width: none; align-self: center; }
.framer-cmudN .framer-vABq5 .framer-uuy879 { flex: 0 0 auto; width: 100%; height: auto; aspect-ratio: 6020 / 1520; }

/* "Como funciona": os 4 cards pequenos ficam com a mesma altura e alinhados ao card grande */
.framer-12rkijh { grid-auto-rows: 1fr; align-items: stretch; }
.framer-12rkijh > [class*="-container"] { height: 100%; }
.framer-12rkijh > [class*="-container"] > * { height: 100%; }
.framer-cmudN .framer-mw9egf { align-items: stretch; }
.framer-cmudN .framer-12rkijh { height: auto; }

/* Seção de artigos oculta: devolve o respiro entre as dúvidas e o CTA final */
section[data-framer-name="CTA"] { margin-top: clamp(64px, 8vw, 128px); }

/* Rodapé: sem o nome gigante */
div:has(> div > img[alt="synthchat"]), .framer-vvz6gg { display: none !important; }

/* Seção "Recursos" do template (mockup de código) removida */
.framer-1f1c38c { display: none !important; }

/* Hover do menu e dos botões: o rótulo duplicado do efeito de rolagem está oculto, então o rótulo
   principal não pode sair do lugar (isso fazia o texto sumir e os itens do header tremerem). */
.framer-cmudN .framer-vABq5 .framer-NtAq7[class*="framer-v-"].hover .framer-v8m51z,
.framer-cmudN .framer-1Qhmj[class*="framer-v-"].hover .framer-1qciqsl {
  position: relative !important; top: auto !important; left: auto !important; transform: none !important;
}
.framer-cmudN .framer-vABq5 .framer-NtAq7 { transition: opacity .2s ease; }
.framer-cmudN .framer-vABq5 .framer-NtAq7:hover { opacity: .72; }

/* Casos de uso: ícones por segmento (definidos em local-performance.js) */
[data-framer-name="Casos de uso"] img[alt="Avatar"] { object-fit: contain !important; border-radius: 50%; }

/* Barra de confiança: sem logos de empresas fictícias, só as categorias atendidas */
[data-framer-name="Brands Section"] [data-framer-name="Logos"] { display: none !important; }
.vz-cats { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 0 20px; margin-top: 28px; }
.vz-cats span {
  padding: 8px 18px; border-radius: 999px; border: 1px solid rgba(70, 150, 50, .35);
  background: rgba(255, 255, 255, .04); color: #cdccd0; font: 500 16px/24px Inter, system-ui, sans-serif;
}

/* Barra de confiança: nenhum logo fictício em nenhum tamanho de tela */
[data-framer-name="Brands Section"] ul,
[data-framer-name="Brands Section"] [data-framer-name*="Logo"] { display: none !important; }

@media (max-width: 809.98px) {
  /* Título da barra de confiança: quebra de linha e centralizado, sem cortar nas pontas */
  .framer-cmudN [data-framer-name="Brands Section"] .framer-1um8je9,
  .framer-cmudN [data-framer-name="Brands Section"] .framer-1um8je9 p { white-space: normal !important; text-align: center; width: auto; max-width: 100%; }
  .framer-cmudN [data-framer-name="Brands Section"] .framer-1gzg858 { flex-wrap: wrap; justify-content: center; padding: 0 20px; box-sizing: border-box; gap: 12px; }
  .framer-cmudN [data-framer-name="Brands Section"] .framer-18mask7,
  .framer-cmudN [data-framer-name="Brands Section"] .framer-167ss78 { display: none; }
  /* Painel de tags (aurora com pílulas) removido no mobile */
  .framer-cmudN .framer-16f6o0c { display: none !important; }
}

/* Ícone do template removido do card "Seu funcionário digital para WhatsApp" */
.framer-cmudN .framer-kgrdy7 { display: none !important; }

/* Seletor de período cabe em telas pequenas */
.vz-period { max-width: calc(100% - 40px); box-sizing: border-box; }
@media (max-width: 809.98px) {
  .vz-period { width: calc(100% - 40px); max-width: 420px; justify-content: space-between; padding: 6px; gap: 2px; }
  .vz-period button { flex: 1 1 0; min-width: 0; padding: 8px 4px; font-size: 15px; white-space: nowrap; }
}

/* Logo do header maior no mobile (a arte do SVG tem margem interna) */
@media (max-width: 809.98px) {
  .framer-cmudN .framer-vABq5 .framer-1nuxl4o { width: clamp(145px, 43vw, 176px); }
  /* Header mobile: desfoque mais leve */
  .framer-cmudN .framer-v8hdf4 { -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
}