/* ==========================================================================
   XNAIA · TEMA LIGHT  (override do clone da home)
   --------------------------------------------------------------------------
   Não altera o app.css original. Este arquivo entra DEPOIS dele e vira só a
   base de near-black para branco, mantendo o layout, a tipografia e os
   accents da marca (brandbook: azul, violeta, laranja, verde WhatsApp).
   Referência de tokens: brand/brand-kit/tokens.css  ->  tema WHITE.
   ========================================================================== */
:root{
  /* gradientes da marca (brand-kit/tokens.css) */
  --grad-text:linear-gradient(135deg,#0081fe 0%,#7732ff 50%,#f15928 100%);
  --grad-cta:linear-gradient(120deg,#0081fe 0%,#7732ff 100%);
  --grad-wa:linear-gradient(45deg,#117108,#0fb900,#117108);
  --lt-bg:#ffffff;
  --lt-alt:#f8f8f8;
  --lt-ink:#0b0f10;
  --lt-ink-2:#3a3e4a;
  --lt-ink-3:#6b6f7c;
  --lt-line:#e2e5ee;
  --lt-line-2:rgba(11,15,16,.14);
  --lt-card:linear-gradient(109deg,rgba(11,15,16,.045) -.84%,rgba(11,15,16,.012) 79.83%);
  --lt-shadow:0 1px 2px rgba(11,15,16,.04),0 10px 30px rgba(11,15,16,.05);
}

html,body{background-color:var(--lt-bg)!important;color:var(--lt-ink)}

/* ==========================================================================
   1. FUNDOS DAS SEÇÕES (alternância branco / off-white)
   ========================================================================== */
.elementor-508 .elementor-element.elementor-element-72567ff:not(.x){         /* hero */
  background-color:#ffffff!important;
  background-image:url("hero-light.webp")!important;
  background-position:top center!important;background-repeat:no-repeat!important;
  background-size:cover!important}
.elementor-508 .elementor-element.elementor-element-dd533ca:not(.x){background-color:var(--lt-alt)!important}   /* demo */
.elementor-508 .elementor-element.elementor-element-c962949:not(.x){background-color:#fff!important}            /* problema */
.elementor-508 .elementor-element.elementor-element-4586852:not(.x){                                            /* cerebro nativo */
  background-color:var(--lt-alt)!important;
  background-image:url("sec-light.webp")!important;
  background-position:bottom center!important;background-repeat:no-repeat!important}
.elementor-508 .elementor-element.elementor-element-9285a63:not(.x){background-color:#fff!important}            /* así funciona */
.elementor-508 .elementor-element.elementor-element-a691018:not(.x){                                            /* comparativo */
  background-color:var(--lt-alt)!important;
  background-image:url("band-light.webp")!important}
.elementor-508 .elementor-element.elementor-element-da07774:not(.x){background-color:#fff!important}            /* es para ti si */
.elementor-508 .elementor-element.elementor-element-da07774:after{background-image:linear-gradient(to bottom,#fff,transparent)!important}
.elementor-508 .elementor-element.elementor-element-8aa7bbd:not(.x){background-color:var(--lt-alt)!important}   /* ancla de precio */
.elementor-508 .elementor-element.elementor-element-e55f266:not(.x){background-color:#fff!important}            /* garantía */
.elementor-508 .elementor-element.elementor-element-f734cee:not(.x){background-color:var(--lt-alt)!important}   /* Mario */
.elementor-508 .elementor-element.elementor-element-f0a4566:not(.x){background-color:#fff!important}            /* FAQ */
.elementor-508 .elementor-element.elementor-element-f0a4566:after{background-image:linear-gradient(to bottom,#fff,transparent)!important}
.elementor-508 .elementor-element.elementor-element-29ae3b2:not(.x){background-color:var(--lt-alt)!important}   /* rodapé */

/* qualquer resto de preto que tenha escapado */
.elementor-508 .e-con[style*="background-color:#000"],
.elementor-508 .e-con[style*="background-color: #000"]{background-color:#fff!important}

/* ==========================================================================
   2. TEXTO
   ========================================================================== */
.elementor-508 .elementor-heading-title:not(.elementor-button),
.elementor-508 .elementor-image-box-title,
.elementor-508 .e-n-accordion-item-title-text,
.elementor-508 .elementor-icon-box-title{color:var(--lt-ink)!important}

.elementor-508 .elementor-icon-list-text,
.elementor-508 .elementor-image-box-description,
.elementor-508 .elementor-widget-text-editor,
.elementor-508 .elementor-widget-text-editor p,
.elementor-508 .e-n-accordion-item p,
.elementor-508 .elementor-tab-content{color:var(--lt-ink-2)!important}

/* subtítulos que eram brancos a 60% ficam em cinza-tinta */
.elementor-508 .elementor-element-24fd1f4 .elementor-heading-title,
.elementor-508 .elementor-element-ea69bc6 .elementor-heading-title{color:var(--lt-ink-3)!important}

/* ícones de lista (check) */
.elementor-508 .elementor-icon-list-icon svg,
.elementor-508 .elementor-icon-list-icon i{fill:var(--violet,#7732ff)!important;color:#7732ff!important}

/* ==========================================================================
   3. SUPERFÍCIES DE VIDRO -> cartão claro
   ========================================================================== */
.elementor-508 [class*="elementor-element-"][style*="rgba(255,255,255"],
.elementor-508 .elementor-element.elementor-element-558c679,
.elementor-508 .elementor-element.elementor-element-a6dc6fb{
  background:var(--lt-card)!important;
  box-shadow:var(--lt-shadow)}

/* bordas que eram claras passam a ser escuras e sutis */
.elementor-508 .elementor-element.elementor-element-a6da811>.e-n-accordion>.e-n-accordion-item>.e-n-accordion-item-title{
  background-color:#fff!important;border-color:var(--lt-line)!important;box-shadow:var(--lt-shadow)}
.elementor-508 .e-n-accordion-item{background:transparent!important}

/* ==========================================================================
   4. BARRA FIXA DO TOPO
   ========================================================================== */
.top-bar{background:rgba(255,255,255,.78)!important;border-bottom:1px solid var(--lt-line)!important}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .top-bar{background:rgba(255,255,255,.96)!important}}
.top-bar a{color:var(--lt-ink)!important;border-color:var(--lt-line-2)!important}
.top-bar a:hover,.top-bar a:focus{background:rgba(11,15,16,.05)!important;border-color:rgba(11,15,16,.3)!important;color:var(--lt-ink)!important}

/* ==========================================================================
   5. SEÇÃO DE DEPOIMENTOS (bloco custom)
   ========================================================================== */
.tst-sec{background-color:#fff!important}
.tst-sec h2{color:var(--lt-ink)!important}
.tst-sec .tst-sub{color:var(--lt-ink-3)!important}
.tst-card{background:#fff!important;border:1px solid var(--lt-line)!important;box-shadow:var(--lt-shadow)}
.tst-card video{background:#eef0f5!important}
.tst-quote{color:var(--lt-ink-2)!important}
.tst-name{color:var(--lt-ink)!important}
.tst-div{filter:invert(1)}

/* ==========================================================================
   6. IMAGENS QUE PRECISAM VIRAR (divisores pretos)
   ========================================================================== */
.elementor-508 img[src$="Group-87.svg"],
.elementor-508 img[src$="divisor345345.svg"]{filter:invert(1)}

/* ==========================================================================
   7. AJUSTES FINOS
   ========================================================================== */
/* linhas divisórias internas */
.elementor-508 .elementor-divider-separator{border-color:var(--lt-line)!important}
/* seleção de texto com a cor da marca */
::selection{background:rgba(119,50,255,.18)}

/* ==========================================================================
   8. TEXTURAS INTERNAS (banners e cartões que eram escuros)
   Versões claras geradas a partir das originais: o brilho vira tinta suave
   sobre branco, mantendo o hue da marca.
   ========================================================================== */
.elementor-508 .elementor-element.elementor-element-12e26f2:not(.x),
.elementor-508 .elementor-element.elementor-element-8cb8634:not(.x){
  background-image:url("bg346ghfg-light.webp")!important;background-color:#fff!important}
.elementor-508 .elementor-element.elementor-element-a0a42b6:not(.x){
  background-image:url("badtfy-light.webp"),url("bg346fsgjs-light.webp")!important;
  background-color:#fff!important}
.elementor-508 .elementor-element.elementor-element-c727d59:not(.x){
  background-image:url("bgdf67457-light.webp"),url("bg4567ssfg-light.webp")!important;
  background-color:#fff!important}

/* contorno suave nos cartões/banners que perderam o contraste do fundo escuro */
.elementor-508 .elementor-element.elementor-element-12e26f2,
.elementor-508 .elementor-element.elementor-element-8cb8634,
.elementor-508 .elementor-element.elementor-element-a0a42b6,
.elementor-508 .elementor-element.elementor-element-c727d59{
  border:1px solid var(--lt-line)!important;box-shadow:var(--lt-shadow)}

/* ==========================================================================
   9. CARTÕES PRETOS COM BORDA EM DEGRADÊ -> cartão branco
   (a borda em degradê continua: fica ainda melhor sobre o branco)
   ========================================================================== */
.elementor-508 .elementor-element.elementor-element-883e465:not(.x),
.elementor-508 .elementor-element.elementor-element-d0e58cb:not(.x),
.elementor-508 .elementor-element.elementor-element-4e01ebd:not(.x),
.elementor-508 .elementor-element.elementor-element-8540fb8:not(.x),
.elementor-508 .elementor-element.elementor-element-ce7ccf4:not(.x),
.elementor-508 .elementor-element.elementor-element-bae9538:not(.x),
.elementor-508 .elementor-element.elementor-element-6f9df42:not(.x),
.elementor-508 .elementor-element.elementor-element-0e4925d:not(.x){
  background-color:#ffffff!important;box-shadow:var(--lt-shadow)}

/* ==========================================================================
   10. CLASSES UTILITÁRIAS DA PÁGINA
   ========================================================================== */
.branco{color:var(--lt-ink)!important;font-weight:600!important}
.destaque{color:var(--lt-ink)!important}

/* ==========================================================================
   11. EXCEÇÕES: texto que continua BRANCO por estar sobre degradê da marca
   ========================================================================== */
.elementor-508 .elementor-element.elementor-element-b42c925 .elementor-image-box-title,
.elementor-508 .elementor-element.elementor-element-b42c925 .elementor-image-box-description{
  color:#ffffff!important}

/* acordeão aberto: o corpo ganha o mesmo cartão do título */
.elementor-508 .e-n-accordion-item[open]>.e-n-accordion-item-title{
  border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}
.elementor-508 .e-n-accordion-item[open] .elementor-element:not(.elementor-hidden){
  background:#fff}

/* ==========================================================================
   12. CAMADAS DE BRILHO (glow) DO TEMA ESCURO
   São overlays absolutos com mix-blend-mode:plus-lighter por cima do
   conteúdo. No preto elas acendem; no branco elas apagam o que está embaixo
   (era isso que estava lavando o mockup do celular). No tema light saem.
   ========================================================================== */
.elementor-508 .elementor-element.elementor-element-40a84b1,
.elementor-508 .elementor-element.elementor-element-caadff1,
.elementor-508 .elementor-element.elementor-element-71ea83d,
.elementor-508 .elementor-element.elementor-element-1cdbd96,
.elementor-508 .elementor-element.elementor-element-d6e7be0,
.elementor-508 .elementor-element.elementor-element-ca7a3b3,
.elementor-508 .elementor-element.elementor-element-26432ae{display:none!important}

/* grão de ruído branco do tema escuro: vira grão de tinta bem leve */
html::before{background-image:radial-gradient(at 20% 80%,#0b0f10 1px,transparent 0px)!important;
  opacity:.030!important;mix-blend-mode:normal!important}

/* aura colorida atrás dos planos: suavizada para o fundo branco */
.elementor-508 .elementor-element.elementor-element-1ade6ba{opacity:.16!important}

/* ==========================================================================
   13. COPY ENXUTA (versão aprovada) — hero em 2 níveis
   O H1 do clone carregava a promessa + o diferencial + a prova social num
   bloco só. Agora: promessa grande, diferencial em corpo menor logo abaixo,
   e a prova social vira uma linha discreta embaixo dos botões.
   ========================================================================== */
.elementor-508 h1 .sub-h1{
  display:block;margin:24px auto 0;max-width:42ch;
  font-size:.46em;line-height:1.38;font-weight:400;letter-spacing:0;
  color:var(--lt-ink-2)!important}
.elementor-508 h1 .sub-h1 b{font-weight:600;color:var(--lt-ink)}
@media(max-width:767px){.elementor-508 h1 .sub-h1{font-size:.52em;margin-top:16px}}

.proof-line{width:100%;text-align:center;margin:18px 0 0;
  font-family:"Outfit",sans-serif;font-size:15px;line-height:1.5;color:var(--lt-ink-3)}
.proof-line b{color:var(--lt-ink);font-weight:600}

/* ==========================================================================
   14. CTA, ÂNCORAS E RODAPÉ (alinhados à proposta aprovada)
   ========================================================================== */
/* kicker do hero */
.kicker-hero{width:100%;text-align:center;margin:0 0 18px;
  font-family:"Outfit",sans-serif;font-size:12.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--violet)}
.kicker-hero::before{content:"";display:block;height:0}

/* botão 1 do hero passa a ser o do WhatsApp; o 2 vira secundário */
.elementor-508 .elementor-element.elementor-element-a83f989 .elementor-button{
  background-image:var(--grad-wa)!important;background-size:400% 200%}
.elementor-508 .elementor-element.elementor-element-039d6a3 .elementor-button{
  background-image:none!important;background-color:#fff!important;
  color:var(--lt-ink)!important;border:1px solid var(--lt-line-2)!important;
  box-shadow:var(--lt-shadow)}

/* selo "Más elegido" no plano anual */
.tag-elegido{display:block;width:max-content;margin:0 auto 12px;padding:5px 13px;border-radius:999px;
  background:var(--grad-text);color:#fff!important;font-size:11.5px;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;line-height:1.2}

/* CTA de fechamento, depois das perguntas */
.cta-final{background:#fff;text-align:center;padding:8px 20px 72px}
.cta-final-btn{display:inline-flex;align-items:center;justify-content:center;
  font-family:"Outfit",sans-serif;font-size:17px;font-weight:600;color:#fff;text-decoration:none;
  padding:18px 34px;border-radius:20px;background:var(--grad-wa);background-size:400% 200%;
  box-shadow:0 12px 30px rgba(17,113,8,.26);transition:transform .15s,box-shadow .2s}
.cta-final-btn:hover{transform:translateY(-2px);box-shadow:0 18px 38px rgba(17,113,8,.32);color:#fff}
.cta-final p{margin:16px 0 0;font-family:"Outfit",sans-serif;font-size:14px;color:var(--lt-ink-3)}

/* rodapé: o bloco de contato tinha texto branco injetado por script */
#contact-section{border-bottom:1px solid var(--lt-line)!important}
.destaque{color:var(--lt-ink)!important}
.email{color:var(--lt-ink-2)!important}

/* botões dos planos: o anual leva o verde do WhatsApp (é o teste grátis),
   o mensal fica secundário */
.elementor-508 .elementor-element.elementor-element-e81cdd1 .elementor-button{
  background-image:var(--grad-wa)!important;background-size:400% 200%}
.elementor-508 .elementor-element.elementor-element-4de4f7b .elementor-button{
  background-image:none!important;background-color:#fff!important;
  color:var(--lt-ink)!important;border:1px solid var(--lt-line-2)!important;
  box-shadow:var(--lt-shadow)}

/* os dois botões de plano falam a mesma língua */
.elementor-508 .elementor-element.elementor-element-e81cdd1 .elementor-button,
.elementor-508 .elementor-element.elementor-element-4de4f7b .elementor-button{
  text-transform:none!important;letter-spacing:0}

/* ==========================================================================
   15. AJUSTES DA PAULA (05/ago/2026)
   ========================================================================== */

/* 15.1 · hierarquia do hero.
   Estava 40 / 18,4 / 18 px: o parágrafo de apoio empatava com a segunda linha
   do titular. Agora 48 / 25 / 15,5 — as duas mensagens principais na frente,
   o apoio atrás. */
.elementor-508 .elementor-element.elementor-element-c09217e .elementor-heading-title{
  font-size:48px!important;line-height:1.08em!important}
.elementor-508 h1 .sub-h1{font-size:.52em;margin-top:26px;max-width:40ch}
.elementor-508 .elementor-element.elementor-element-0bbc582 .elementor-heading-title{
  font-size:15.5px!important;line-height:1.55em!important}
@media(max-width:767px){
  .elementor-508 .elementor-element.elementor-element-c09217e .elementor-heading-title{
    font-size:7.4vw!important}
  .elementor-508 .elementor-element.elementor-element-0bbc582 .elementor-heading-title{
    font-size:3.5vw!important}
}

/* 15.2 · só o teste grátis no hero. O "Ver planes y precios" sai:
   a página inteira já leva para o mesmo lugar. */
.elementor-508 .elementor-element.elementor-element-039d6a3{display:none!important}

/* 15.3 · CTA no fim de cada seção.
   O fundo de cada faixa acompanha o da seção que ela fecha, para ler como
   parte dela e não como um bloco solto. */
/* o !important é necessário: o bundle do Elementor traz um reset de padding
   com especificidade maior, e sem ele a faixa fica da altura do botão e o
   título da seção seguinte sobe por cima */
.cta-strip{text-align:center;background:#fff;
  padding:4px 20px 72px!important;position:relative;z-index:120}
.cta-strip--alt{background:var(--lt-alt)}
.cta-strip a,.cta-final-btn{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:"Outfit",sans-serif;font-size:17px;font-weight:600;color:#fff!important;
  text-decoration:none;padding:17px 34px;border-radius:20px;
  background:var(--grad-wa);background-size:400% 200%;
  box-shadow:0 12px 30px rgba(17,113,8,.24);
  transition:transform .15s ease,box-shadow .2s ease}
.cta-strip a:hover,.cta-final-btn:hover{
  transform:translateY(-2px);box-shadow:0 18px 38px rgba(17,113,8,.32)}
@media(max-width:767px){
  .cta-strip{padding-bottom:52px}
  .cta-strip a,.cta-final-btn{width:100%;max-width:420px;font-size:16px;padding:16px 20px}
}

/* faixa que vive DENTRO da seção (usada no comparativo): sem fundo próprio e
   sem z-index, porque quem manda no empilhamento ali é a própria seção */
.cta-strip--dentro{background:transparent!important;z-index:auto!important;
  padding:44px 20px 0!important}

/* ==========================================================================
   16. CARTÕES DE PREÇO (Paula, 05/ago/2026)
   Caixa alta trocada por caixa mista, valor em destaque com a moeda menor,
   cartão mais baixo e os dois botões substituídos por um só embaixo.
   ========================================================================== */
/* título do plano: caixa mista, não gritar */
.elementor-508 .elementor-element.elementor-element-dd6632c .elementor-heading-title,
.elementor-508 .elementor-element.elementor-element-ffff8d2 .elementor-heading-title{
  text-transform:none!important;font-size:22px!important;font-weight:600!important;
  letter-spacing:-.01em;line-height:1.25em!important;color:var(--lt-ink-3)!important}

/* valor grande, moeda pequena ao lado */
.elementor-508 .elementor-element.elementor-element-fd524cc .elementor-heading-title,
.elementor-508 .elementor-element.elementor-element-9ec4eb4 .elementor-heading-title{
  font-size:66px!important;font-weight:700!important;letter-spacing:-.04em;
  line-height:1.05em!important;text-transform:none!important}
.moneda{font-size:.32em;font-weight:600;letter-spacing:0;color:var(--lt-ink-3);
  margin-left:.22em;vertical-align:.42em}

/* cartão mais baixo */
.elementor-508 .elementor-element.elementor-element-8cb8634,
.elementor-508 .elementor-element.elementor-element-558c679{
  --padding-top:38px;--padding-bottom:38px}

/* os botões saem de dentro dos cartões */
.elementor-508 .elementor-element.elementor-element-e81cdd1,
.elementor-508 .elementor-element.elementor-element-4de4f7b{display:none!important}

/* o botão único encosta nos cartões em vez de abrir outra seção */
.cta-strip--planes{padding-top:0!important;margin-top:-46px}
@media(max-width:767px){.cta-strip--planes{margin-top:-24px}}

/* a linha de equivalência quebrava com uma palavra órfã na segunda linha */
.elementor-508 .elementor-element.elementor-element-e753132 .elementor-heading-title,
.elementor-508 .elementor-element.elementor-element-9d13ecd .elementor-heading-title,
.elementor-508 .elementor-element.elementor-element-8cb8634 p.elementor-heading-title,
.elementor-508 .elementor-element.elementor-element-558c679 p.elementor-heading-title{
  text-wrap:balance;font-size:15px!important;line-height:1.5em!important;
  color:var(--lt-ink-3)!important}
