/*
Theme Name: SmartHub
Theme URI: https://smarthubmarketing.com.br
Author: EcomSmart
Description: Tema de blocos do smarthubmarketing.com.br (agência SmartHub, by EcomSmart) na identidade EcomSmart v2.4 (Figtree, azul #0A5BF0 e navy #0B1033, sempre clara, com painéis pastel no padrão dos cartões .recurso do EcomIA). Usa a camada es-ui da wp-plataforma (menu, tema, motion, formulários de lead, índice, tabelas, compartilhar) e define os tokens --es-* do contrato comum aos sites da plataforma. Depende do plugin smarthub-site e dos mu-plugins da wp-plataforma.
Version: 1.0.0
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: smarthub
*/

/* =============================================================================
   DESIGN SYSTEM SMARTCONVERSAS v3 — camadas (mesma ordem e mesmos títulos nos
   4 sites da wp-plataforma; cada camada só usa o que as anteriores definem):

   01 Fontes              Figtree self-hosted + fallback com métricas ajustadas
   02 Tokens              primitivos da marca (--shm-*) → semânticos (contrato
                          --es-* do es-ui + extensões) → escuro (só tokens) →
                          escalas (--fs-*, --esp-*, --raio-*, alvos de toque)
   03 Base e tipografia   reset, texto, rótulos
   04 Layout              container, seções, grades, cabeçalhos de seção
   05 Componentes         botões · chips · cartões · listas · números · logos ·
                          formulários · FAQ · tabelas · abas · mockups e cena do
                          produto · cabeçalho · rodapé · ícones
   06 Padrões de página   hero · LP (passos com linha, comparativo, preço,
                          monte seu plano, depoimentos, CTA) · blog · artigo ·
                          autoria · ferramentas · institucionais · 404
   07 Motion              o que é só deste site (o comum vem do es-ui.css):
                          cena do hero, loops dos mockups, revelação de títulos,
                          marquee, troca de tema; prefers-reduced-motion no fim
   08 Utilitários         ajustes do WordPress e do es-ui

   Regra: nada de cor solta fora da camada 02. Exceção: máscaras (ícones,
   degradês de "mask-image") usam preto só como canal alfa; a cor vem dos tokens.
   Motion: só opacity, transform e clip-path; nada esconde o LCP; zero CLS.
   ========================================================================== */

/* ============================================================ 01 Fontes */
/* Figtree variável (300–900) servida pelo próprio site, subconjunto latino.
   "Figtree Fallback" é Arial com métricas ajustadas: o texto não pula quando a fonte chega. */
@font-face{font-family:Figtree;font-style:normal;font-weight:300 900;font-display:swap;src:url(assets/fontes/figtree-latin.woff2) format("woff2")}
@font-face{font-family:"Figtree Fallback";src:local("Arial"),local("Helvetica");size-adjust:97%;ascent-override:98%;descent-override:26%;line-gap-override:0%}

/* ============================================================ 02 Tokens */
/* ---- 2a. primitivos da marca (--shm-*): só a camada 2b os usa */
:root{
 --shm-branco:#FFFFFF;
 --shm-azul-50:#EEF4FF;--shm-azul-100:#DCE7FF;--shm-azul-200:#B9CEFF;--shm-azul-300:#8DB0FF;--shm-azul-400:#5A8CFA;
 --shm-azul-500:#0A5BF0;--shm-azul-600:#0849C4;--shm-azul-700:#0A3FB0;
 --shm-navy-950:#070B1E;--shm-navy-900:#0B1033;
 --shm-cinza-50:#F6F8FC;--shm-cinza-100:#EEF1F7;--shm-cinza-200:#E1E6F0;--shm-cinza-300:#C9D1DF;--shm-cinza-500:#5C6780;--shm-cinza-600:#4A5670;
 --shm-verde-600:#16A34A;--shm-verde-400:#4ADE80;--shm-ambar-600:#D97706;--shm-ambar-400:#FBBF24;--shm-vermelho-600:#DC2626;--shm-vermelho-400:#F87171;--shm-roxo-600:#7C3AED;
 /* WhatsApp: #25D366 é a cor da marca (só em pontos e ícones); o botão com texto
    branco usa o verde escurecido, que passa no contraste AA (4,9:1). */
 --shm-wa-marca:#25D366;--shm-wa-700:#0C8340;
 /* pastéis dos painéis .recurso (mesma receita do EcomIA: fundo, cartão de trás, destaque) */
 --shm-verde-50:#EAF8EF;--shm-verde-200:#C6EDD4;
 --shm-creme-50:#FFF7E6;--shm-creme-200:#FFE7AE;--shm-creme-600:#E3A21A;--shm-creme-tinta:#1B1300;
 --shm-rosa-50:#FFF0F4;--shm-rosa-200:#FFD3E0;--shm-rosa-700:#BE185D;
 --shm-lilas-50:#F4F0FF;--shm-lilas-200:#DCD0FF;--shm-lilas-700:#6A2BD9;
}

/* ---- 2b. semânticos (claro): contrato es-ui + extensões com o mesmo prefixo */
:root{
 /* contrato es-ui (wp-plataforma/mu-plugins/es/es-editorial/assets/es-ui.css) */
 --es-primaria:var(--shm-azul-500);--es-primaria-texto:var(--shm-branco);
 --es-fundo:var(--shm-branco);--es-superficie:var(--shm-cinza-50);
 --es-texto:var(--shm-navy-900);--es-texto-2:var(--shm-cinza-600);
 --es-linha:var(--shm-cinza-200);--es-foco:var(--shm-azul-500);
 --es-raio:var(--raio-lg);--es-sombra:0 30px 70px -30px rgba(11,16,51,.35),0 2px 6px rgba(11,16,51,.06);
 --es-sombra-forte:0 24px 48px -28px rgba(11,16,51,.5);
 --es-wa:var(--shm-wa-700);
 /* extensões do site (mesmo prefixo, para os outros sites poderem adotar) */
 --es-superficie-2:var(--shm-cinza-100);
 --es-linha-forte:var(--shm-cinza-300);
 --es-texto-3:var(--shm-cinza-500);
 --es-primaria-hover:var(--shm-azul-600);
 --es-destaque:var(--shm-azul-500);--es-destaque-hover:var(--shm-azul-600);
 --es-suave:var(--shm-azul-50);--es-suave-2:var(--shm-azul-100);
 --es-sucesso:var(--shm-verde-600);--es-aviso:var(--shm-ambar-600);--es-erro:var(--shm-vermelho-600);
 --es-wa-marca:var(--shm-wa-marca);
 --es-vidro:color-mix(in srgb,var(--shm-branco) 88%,transparent);
 --es-nevoa:linear-gradient(180deg,var(--shm-branco),var(--shm-azul-50));
 --es-painel:radial-gradient(ellipse 70% 90% at 92% 110%,rgba(141,176,255,.42),transparent 60%),radial-gradient(ellipse 55% 70% at 0% -10%,rgba(37,211,102,.12),transparent 55%),linear-gradient(135deg,var(--shm-branco) 0%,var(--shm-azul-50) 55%,var(--shm-azul-100) 100%);
 --es-grade:rgba(11,16,51,.06);
 --es-logo-filtro:none;
 /* blocos de destaque (faixa de números, CTA, newsletter, resumo do plano): claros, azul pastel */
 --es-bloco:var(--shm-azul-50);--es-bloco-linha:var(--shm-azul-100);
 --es-bloco-texto:var(--shm-navy-900);--es-bloco-texto-2:var(--shm-cinza-600);--es-bloco-texto-3:var(--shm-cinza-500);
 --es-bloco-linha-2:rgba(11,16,51,.1);--es-bloco-vidro:rgba(255,255,255,.78);
 --es-destaque-2:var(--shm-azul-300);
 --es-branco-fixo:var(--shm-branco);--es-branco-fixo-hover:var(--shm-azul-50);--es-navy-fixo:var(--shm-navy-900);
 /* avatares e marcadores dos mockups */
 --es-cat-1:var(--shm-azul-500);--es-cat-2:var(--shm-verde-600);--es-cat-3:var(--shm-ambar-600);--es-cat-4:var(--shm-roxo-600);
 /* motion da marca: aurora atrás da cena, anel dos formulários, brilho de destaque */
 --es-aurora:radial-gradient(closest-side,color-mix(in srgb,var(--shm-azul-400) 34%,transparent),transparent 72%);
 --es-aurora-2:radial-gradient(closest-side,color-mix(in srgb,var(--shm-wa-marca) 16%,transparent),transparent 70%);
 --es-anel:conic-gradient(from 0deg,transparent 0 60%,var(--shm-azul-300) 76%,var(--shm-azul-500) 86%,var(--shm-wa-marca) 93%,transparent 100%);
 --es-fundo-chat:var(--shm-cinza-50);
 /* painéis pastel (.recurso): --pastel-<cor> fundo, -p cartão de trás, -a destaque (texto branco passa AA; no creme o texto é tinta) */
 --pastel-azul:var(--shm-azul-50);--pastel-azul-p:var(--shm-azul-100);--pastel-azul-a:var(--shm-azul-500);
 --pastel-verde:var(--shm-verde-50);--pastel-verde-p:var(--shm-verde-200);--pastel-verde-a:var(--shm-wa-700);
 --pastel-creme:var(--shm-creme-50);--pastel-creme-p:var(--shm-creme-200);--pastel-creme-a:var(--shm-creme-600);--pastel-creme-sobre:var(--shm-creme-tinta);
 --pastel-rosa:var(--shm-rosa-50);--pastel-rosa-p:var(--shm-rosa-200);--pastel-rosa-a:var(--shm-rosa-700);
 --pastel-lilas:var(--shm-lilas-50);--pastel-lilas-p:var(--shm-lilas-200);--pastel-lilas-a:var(--shm-lilas-700);
 --es-sobre-ac:var(--shm-branco);--es-balao:var(--shm-branco);--es-sombra-balao:0 20px 44px -18px rgba(11,16,51,.45);
 --es-reflexo:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%);
 color-scheme:light;
}

/* ---- 2c. só tema claro (v4, 29/09/2026: "evite dark, sempre clean"): sem tokens escuros */

/* ---- 2d. escalas: tipografia (--fs-*), espaço (--esp-*), raio (--raio-*), alvos */
:root{
 /* tipografia: base 16, razão ~1.2 no corpo; títulos fluidos */
 --fs-rot:12.5px;--fs-peq:14px;--fs-ui:15.5px;--fs-corpo:16px;--fs-lead:17px;--fs-xl:19px;--fs-2xl:21px;
 --fs-h3:18px;--fs-h2:clamp(26px,3.2vw,40px);--fs-display:clamp(34px,5vw,56px);--fs-h1:clamp(30px,4vw,44px);--fs-kpi:clamp(32px,3.6vw,40px);
 --lh:1.5;--lh-texto:1.7;--lh-titulo:1.15;
 --peso-medio:500;--peso-titulo:600;--peso-forte:700;
 /* espaço (múltiplos de 4) */
 --esp-1:4px;--esp-2:8px;--esp-3:12px;--esp-4:16px;--esp-5:24px;--esp-6:32px;--esp-7:48px;--esp-8:64px;
 --sec:56px;--gutter:20px;--container:1200px;
 /* raios */
 --raio-sm:10px;--raio-md:12px;--raio-lg:16px;--raio-xl:24px;--raio-pilula:999px;
 /* alvos de toque */
 --alvo:44px;--alvo-g:48px;
 /* altura do topo (âncoras e cabeçalho grudado) */
 --topo-h:68px;
}
@media(min-width:768px){:root{--sec:96px;--gutter:32px}}
@media(min-width:1024px){:root{--gutter:48px;--container:1296px}}

/* ============================================================ 03 Base e tipografia */
*,*:before,*:after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--topo-h) + 20px);interpolate-size:allow-keywords}
body{margin:0;font:400 var(--fs-corpo)/var(--lh) Figtree,"Figtree Fallback",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--es-texto);background:var(--es-fundo);overflow-x:clip;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;font-weight:var(--peso-titulo);line-height:var(--lh-titulo);letter-spacing:-.02em;text-wrap:balance;color:var(--es-texto)}
p{margin:0;color:var(--es-texto-2);text-wrap:pretty}
a{color:inherit;text-decoration:none}
img,svg,video{max-width:100%;display:block}
img{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--es-suave-2);color:var(--es-texto)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rotulo{display:inline-block;font-size:12px;font-weight:var(--peso-titulo);letter-spacing:.08em;text-transform:uppercase;color:var(--es-destaque)}
em.enfase,.enfase{font-style:normal;color:var(--es-destaque)}
.kpi,.num{font-weight:var(--peso-forte);font-variant-numeric:tabular-nums;letter-spacing:-.03em;color:var(--es-destaque)}
.nota{font-size:13.5px;color:var(--es-texto-3);margin-top:var(--esp-4)}
.nota a{color:var(--es-destaque);text-decoration:underline;text-underline-offset:3px}

/* ============================================================ 04 Layout */
.w{max-width:var(--container);margin:0 auto;padding-inline:var(--gutter)}
.sec{padding-block:var(--sec)}
.sec.fundo{background:var(--es-superficie)}
.cab{max-width:760px;margin:0 0 40px}
.cab.centro{text-align:center;margin-inline:auto}
.cab h2,.par h2{font-size:var(--fs-h2);margin-top:10px}
.cab p,.par p{margin-top:14px;font-size:var(--fs-lead)}
.par{display:grid;gap:16px 48px;margin-bottom:40px}
.par p{margin-top:0}
@media(min-width:900px){.par{grid-template-columns:1fr 1fr;align-items:end}}
.grade{display:grid;gap:var(--esp-4);grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.grade.dois{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.duo{display:grid;gap:40px;align-items:center}
@media(min-width:1024px){.duo{grid-template-columns:1fr 1fr;gap:64px}.duo.inv>:first-child{order:2}}
.duo h2{font-size:clamp(26px,3vw,36px);margin-top:10px}
.duo .txt>p{margin-top:14px;font-size:var(--fs-lead)}
.grade>*,.duo>*,.art>*,.hero-g>*,.par>*{min-width:0}

/* ============================================================ 05 Componentes */

/* ---- 5.1 botões (es-ui cuida do press e do estado "enviando") */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--alvo-g);padding:0 24px;border-radius:var(--raio-pilula);font-weight:var(--peso-titulo);font-size:var(--fs-ui);border:1px solid transparent;cursor:pointer;text-align:center;line-height:1.2;transition:background-color var(--es-dur-2,.3s),border-color var(--es-dur-2,.3s),color var(--es-dur-2,.3s),transform var(--es-dur-1,.16s),box-shadow var(--es-dur-2,.3s)}
.btn.pri{background:var(--es-primaria);color:var(--es-primaria-texto);box-shadow:0 10px 24px -14px var(--es-primaria)}
.btn.pri:hover{background:var(--es-primaria-hover)}
.btn.cont{background:transparent;border-color:var(--es-linha-forte);color:var(--es-texto)}
.btn.cont:hover{border-color:var(--es-destaque);color:var(--es-destaque)}
.btn.largo{width:100%}
.btn[disabled]{opacity:.6;cursor:not-allowed}
.btn[aria-disabled="true"]{opacity:.55;pointer-events:none}
.link-seta{color:var(--es-destaque);font-weight:var(--peso-titulo);display:inline-flex;gap:6px;align-items:center;min-height:var(--alvo)}
.link-seta:after{content:"→";display:inline-block;transition:transform var(--es-dur-2,.3s) var(--es-ease,ease)}
.link-seta:hover{text-decoration:underline;text-underline-offset:4px}
.link-seta:hover:after{transform:translateX(4px)}
.acoes{display:flex;flex-wrap:wrap;gap:var(--esp-3);margin-top:28px}
@media(max-width:520px){.acoes>.btn{flex:1 1 100%}}

/* ---- 5.2 chips, pílulas e condições */
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--esp-2)}
.chips li{border:1px solid var(--es-linha);background:var(--es-fundo);border-radius:var(--raio-pilula);padding:8px 14px;font-size:14.5px;color:var(--es-texto);font-weight:var(--peso-medio);transition:border-color var(--es-dur-2,.3s),transform var(--es-dur-2,.3s)}
@media(hover:hover){.chips li:hover{border-color:var(--es-destaque);transform:translateY(-2px)}}
.chips li.wa:before,.pilula.wa:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--es-wa-marca);margin-right:8px;vertical-align:1px}
.pilula{display:inline-flex;align-items:center;gap:5px;border-radius:var(--raio-pilula);padding:3px 9px;font-size:10.5px;font-weight:var(--peso-titulo);background:var(--es-suave);color:var(--es-destaque)}
.pilula.wa:before{width:6px;height:6px;margin-right:0}
.pilula.ok{background:color-mix(in srgb,var(--es-sucesso) 14%,transparent);color:color-mix(in srgb,var(--es-sucesso) 62%,var(--es-texto))}
.condicoes{list-style:none;margin:var(--esp-4) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:var(--fs-peq);color:var(--es-texto-3)}
.condicoes li{display:inline-flex;align-items:center;gap:6px}
.condicoes li:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--es-sucesso)}

/* ---- 5.3 cartões e ícones */
.card{background:var(--es-superficie);border:1px solid var(--es-linha);border-radius:var(--es-raio);padding:var(--esp-5);display:flex;flex-direction:column;gap:10px;position:relative}
.sec.fundo .card{background:var(--es-fundo)}
.card h3{font-size:var(--fs-h3);letter-spacing:-.01em}
.card p{font-size:15px}
a.card{transition:border-color var(--es-dur-2,.3s),transform var(--es-dur-2,.3s) var(--es-ease,ease),box-shadow var(--es-dur-2,.3s)}
a.card:hover{border-color:var(--es-destaque)}
a.card h3:after{content:"→";margin-left:.3em;color:var(--es-destaque);display:inline-block;transition:transform var(--es-dur-2,.3s) var(--es-ease,ease)}
a.card:hover h3:after{transform:translateX(4px)}
.card .n{font-size:13px;font-weight:var(--peso-forte);color:var(--es-destaque);font-variant-numeric:tabular-nums}
.ic{width:44px;height:44px;border-radius:50%;background:var(--es-suave);color:var(--es-destaque);display:grid;place-items:center;flex:none;transition:transform var(--es-dur-2,.3s) var(--es-ease-mola,ease)}
.ic svg{width:22px;height:22px}
a.card:hover .ic,.card:hover>.ic{transform:scale(1.08) rotate(-4deg)}
a.card:active{transform:scale(.985)}
.box{background:var(--es-superficie);border:1px solid var(--es-linha);border-radius:var(--es-raio);padding:20px}

/* ---- 5.4 listas: checks, dores, contato */
.checks{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:10px}
.checks li{position:relative;display:flex;gap:10px;align-items:flex-start;color:var(--es-texto)}
.checks li:before{content:"";flex:none;width:20px;height:20px;margin-top:2px;border-radius:50%;background:var(--es-suave)}
.checks li:after{content:"";position:absolute;left:7px;top:6px;width:5px;height:9px;border:solid var(--es-destaque);border-width:0 2.4px 2.4px 0;transform:rotate(45deg)}
.dores{list-style:none;margin:0;padding:0;display:grid;gap:var(--esp-3)}
.dores li{display:flex;gap:var(--esp-3);align-items:flex-start;padding:16px 18px;border:1px solid var(--es-linha);border-radius:var(--raio-md);background:var(--es-fundo);color:var(--es-texto)}
.dores li:before{content:"";flex:none;width:20px;height:20px;margin-top:2px;border-radius:50%;border:6px solid color-mix(in srgb,var(--es-erro) 16%,transparent);background:color-mix(in srgb,var(--es-erro) 60%,transparent)}
.ponte{margin-top:20px;font-weight:var(--peso-titulo);color:var(--es-texto);font-size:var(--fs-lead)}
.contato-lista{list-style:none;margin:var(--esp-5) 0 0;padding:0;display:grid;gap:var(--esp-3)}
.contato-lista li{display:flex;gap:var(--esp-3);align-items:center;color:var(--es-texto)}
.contato-lista a{color:var(--es-destaque);font-weight:var(--peso-titulo);display:inline-block;padding-block:6px}

/* ---- 5.5 faixa de números (superfície sempre escura) */
.numeros{background:var(--es-bloco);border:1px solid var(--es-bloco-linha);color:var(--es-bloco-texto);border-radius:var(--raio-xl);padding:var(--esp-6);display:grid;gap:var(--esp-5);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));position:relative;overflow:hidden;isolation:isolate}
.numeros:before{content:"";position:absolute;inset:auto -20% -60% auto;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--es-destaque-2) 26%,transparent),transparent);z-index:-1}
.numeros div{display:grid;gap:4px}
.numeros b{font-size:var(--fs-kpi);font-weight:var(--peso-forte);color:var(--es-destaque);font-variant-numeric:tabular-nums;letter-spacing:-.03em;line-height:1}
.numeros span{color:var(--es-bloco-texto-2);font-size:14.5px}
.numeros .fonte{grid-column:1/-1;font-size:var(--fs-rot);color:var(--es-bloco-texto-3);border-top:1px solid var(--es-bloco-linha-2);padding-top:14px}
@media(min-width:900px){.numeros{grid-template-columns:repeat(4,1fr)}}
@media(max-width:520px){.numeros{grid-template-columns:1fr 1fr;padding:var(--esp-5);gap:20px 16px}.numeros span{font-size:13.5px}}

/* ---- 5.6 logos de clientes */
.clientes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--esp-3)}
@media(min-width:700px){.clientes{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1024px){.clientes{grid-template-columns:repeat(6,1fr)}}
.clientes li{display:grid;place-items:center;height:76px;border:1px solid var(--es-linha);border-radius:var(--raio-md);padding:var(--esp-3);background:var(--es-fundo)}
.clientes img{max-height:40px;width:auto;max-width:100%;opacity:.75;filter:grayscale(1) var(--es-logo-filtro);transition:opacity var(--es-dur-2,.3s),filter var(--es-dur-2,.3s)}
@media(hover:hover){.clientes li:hover img{opacity:1}}
/* faixa corrida (logos reais do site antigo, sc/clientes variante "marquee"): a
   trilha tem a lista duas vezes (a segunda aria-hidden) e anda metade do caminho */
.marquee{overflow:hidden;margin-inline:calc(var(--gutter) * -1);padding-block:4px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.marquee-trilho{display:flex;gap:var(--esp-3);width:max-content;animation:sc-marquee 48s linear infinite}
.marquee.parado .marquee-trilho{animation-play-state:paused}
@media(hover:hover){.marquee:hover .marquee-trilho{animation-play-state:paused}}
.marquee .clientes{display:flex;gap:var(--esp-3);grid-template-columns:none}
.marquee .clientes li{width:168px;flex:none}
@media(max-width:600px){.marquee .clientes li{width:136px;height:68px}}

/* ---- 5.7 formulários (o envio, os passos e a validação são do es-ui) */
.form-sec .duo{align-items:start}
.form-lead{background:var(--es-fundo);border:1px solid var(--es-linha);border-radius:var(--es-raio);padding:var(--esp-5);display:grid;gap:14px;box-shadow:var(--es-sombra)}
@media(min-width:640px){.form-lead{padding:var(--esp-6)}}
/* anel de luz que gira em volta dos formulários de conversão (só transform) */
.form-sec .form-lead{position:relative;isolation:isolate;overflow:hidden;border-color:transparent}
.form-sec .form-lead:before{content:"";position:absolute;z-index:-2;left:50%;top:50%;width:max(160%,720px);aspect-ratio:1;margin:calc(max(160%,720px) / -2) 0 0 calc(max(160%,720px) / -2);background:var(--es-anel);animation:sc-gira 7s linear infinite}
.form-sec .form-lead:after{content:"";position:absolute;z-index:-1;inset:1.5px;border-radius:calc(var(--es-raio) - 1.5px);background:var(--es-fundo)}
.form-titulo{font-size:var(--fs-2xl);font-weight:var(--peso-titulo);color:var(--es-texto)}
.form-sub{font-size:14.5px;margin-top:-8px}
.form-lead .campo{display:grid;gap:6px;min-width:0}
.form-lead label{display:block;font-size:var(--fs-peq);font-weight:var(--peso-medio);color:var(--es-texto)}
.form-lead label small{font-weight:400;color:var(--es-texto-3)}
.form-lead label span[aria-hidden]{color:var(--es-erro);margin-left:2px}
.form-lead input,.form-lead select,.form-lead textarea,.calc-campos input,.calc-campos select,.calc-campos textarea{width:100%;min-height:var(--alvo-g);border-radius:var(--raio-sm);border:1px solid var(--es-linha-forte);padding:10px 14px;font-size:16px;background:var(--es-fundo);color:var(--es-texto);outline:none;transition:border-color var(--es-dur-1,.16s),box-shadow var(--es-dur-1,.16s)}
.form-lead textarea{resize:vertical}
.form-lead input:focus,.form-lead select:focus,.form-lead textarea:focus,.calc-campos input:focus,.calc-campos select:focus,.calc-campos textarea:focus{border-color:var(--es-destaque);box-shadow:0 0 0 3px color-mix(in srgb,var(--es-destaque) 22%,transparent)}
.form-lead [aria-invalid="true"]{border-color:var(--es-erro)}
.form-lead label.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:13.5px;line-height:1.45;color:var(--es-texto-2);cursor:pointer;padding-block:4px}
.form-lead label.check input{width:22px;height:22px;min-height:0;flex:none;margin:0;padding:0;accent-color:var(--es-primaria);box-shadow:none}
.form-lead label.check a{color:var(--es-destaque);text-decoration:underline}
.form-lead .duas{display:grid;gap:14px}
@media(min-width:560px){.form-lead .duas{grid-template-columns:1fr 1fr}}
.form-lead fieldset{border:0;margin:0;padding:0;display:grid;gap:14px;min-width:0}
.form-lead .passo:not([hidden]){animation:es-surge var(--es-dur-2,.3s) var(--es-ease,ease) both}
.form-acoes{display:flex;gap:10px;flex-wrap:wrap}
.form-acoes .btn{flex:1}
.form-acoes [data-voltar]{flex:0 0 auto}
.form-erro{color:var(--es-erro);font-size:var(--fs-peq)}
.form-alt{font-size:var(--fs-peq);color:var(--es-texto-3);text-align:center}
.form-alt a{color:var(--es-destaque);font-weight:var(--peso-titulo);text-decoration:underline;text-underline-offset:3px;display:inline-block;padding-block:6px}
.mel{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.passos-form{display:flex;align-items:center;gap:6px}
.passos-form i{flex:1;height:5px;border-radius:var(--raio-pilula);background:var(--es-superficie-2);position:relative;overflow:hidden}
.passos-form i:after{content:"";position:absolute;inset:0;background:var(--es-primaria);transform:scaleX(0);transform-origin:0 50%;transition:transform var(--es-dur-3,.7s) var(--es-ease,ease)}
.passos-form i.on:after{transform:none}
.passos-form span{font-size:12px;font-weight:var(--peso-titulo);color:var(--es-texto-3);margin-left:4px;font-variant-numeric:tabular-nums}
.sucesso{text-align:center;padding:16px 4px}
.sucesso .ok{width:52px;height:52px;border-radius:50%;background:color-mix(in srgb,var(--es-sucesso) 16%,transparent);color:var(--es-sucesso);display:grid;place-items:center;margin:0 auto;font-size:24px;font-weight:var(--peso-forte)}
.sucesso h3{margin-top:14px;font-size:var(--fs-2xl)}
.sucesso p{margin-top:8px}

/* ---- 5.8 FAQ (acordeão; um aberto por vez é do es-ui) */
.faq{max-width:860px;margin:0 auto;display:grid;gap:10px}
.faq details{border:1px solid var(--es-linha);border-radius:var(--raio-md);background:var(--es-fundo);padding:0 20px;transition:border-color var(--es-dur-2,.3s),box-shadow var(--es-dur-2,.3s)}
.faq details[open]{border-color:color-mix(in srgb,var(--es-destaque) 40%,var(--es-linha));box-shadow:0 12px 30px -24px var(--es-destaque)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:var(--alvo);padding:14px 0;font-weight:var(--peso-titulo);font-size:16.5px;color:var(--es-texto)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"";flex:none;width:24px;height:24px;border-radius:50%;background-color:var(--es-suave);background-image:linear-gradient(var(--es-destaque),var(--es-destaque)),linear-gradient(var(--es-destaque),var(--es-destaque));background-size:10px 2px,2px 10px;background-position:center;background-repeat:no-repeat;transition:transform var(--es-dur-2,.3s) var(--es-ease,ease)}
.faq details[open] summary:after{transform:rotate(45deg)}
.faq details p{padding-bottom:18px;font-size:var(--fs-ui)}
.faq details[open] p{animation:es-surge var(--es-dur-2,.3s) var(--es-ease,ease) both}
.faq details::details-content{block-size:0;overflow:clip;transition:block-size var(--es-dur-2) var(--es-ease),content-visibility var(--es-dur-2) allow-discrete}
.faq details[open]::details-content{block-size:auto}
@media(hover:hover){.faq details:not([open]):hover{border-color:var(--es-linha-forte)}}

/* ---- 5.9 tabelas (no celular viram cartões: classe .tabela-cartoes do es-ui) */
.tabela-rolagem,.eib-tablewrap{overflow-x:auto;margin:var(--esp-5) 0;border:1px solid var(--es-linha);border-radius:var(--raio-md)}
.tabela-rolagem table,.eib-tablewrap table,.texto table{border-collapse:collapse;width:100%;font-size:15px;min-width:480px}
.texto table{min-width:0}
.tabela-rolagem th,.tabela-rolagem td,.eib-tablewrap th,.eib-tablewrap td,.texto th,.texto td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--es-linha);vertical-align:top}
.tabela-rolagem th,.eib-tablewrap th,.texto th{background:var(--es-superficie);font-weight:var(--peso-titulo);color:var(--es-texto)}
.tabela-rolagem tr:last-child td,.eib-tablewrap tr:last-child td{border-bottom:0}
.tabela-rolagem caption,.eib-tablewrap caption{caption-side:top;text-align:left;padding:12px 14px 4px;font-weight:var(--peso-titulo);color:var(--es-texto)}
.eib-source,.fonte-tabela{font-size:13.5px;color:var(--es-texto-3)}
td.r,th.r{text-align:right;font-variant-numeric:tabular-nums}
@media(max-width:700px){
 .tabela-cartoes{min-width:0!important}
 .tabela-cartoes thead{display:none}
 .tabela-cartoes,.tabela-cartoes tbody,.tabela-cartoes tr,.tabela-cartoes td,.tabela-cartoes caption{display:block;width:100%}
 .tabela-cartoes tr{border:1px solid var(--es-linha);border-radius:var(--raio-md);padding:4px 14px;margin-bottom:10px;background:var(--es-fundo)}
 .tabela-cartoes td{border:0!important;padding:8px 0!important;border-bottom:1px solid var(--es-linha)!important}
 .tabela-cartoes td:last-child{border-bottom:0!important}
 .tabela-cartoes td[data-label]:before{content:attr(data-label);display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--es-texto-3);margin-bottom:2px}
 .eib-tablewrap:has(.tabela-cartoes),.tabela-rolagem:has(.tabela-cartoes){border:0;overflow:visible}
}

/* ---- 5.10 mockups do produto (HTML com nomes fictícios; animação na camada 07) */
.moldura{position:relative;background:var(--es-fundo);border:1px solid var(--es-linha);border-radius:var(--es-raio);box-shadow:var(--es-sombra);overflow:hidden;font-size:13px}
.moldura .barra-jan{display:flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-bottom:1px solid var(--es-linha);background:var(--es-superficie)}
.moldura .barra-jan i{width:9px;height:9px;border-radius:50%;background:var(--es-linha-forte)}
.moldura .barra-jan span{margin-left:10px;font-size:11.5px;color:var(--es-texto-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.app{display:grid;grid-template-columns:44px 170px 1fr;min-height:360px}
.app .trilho{background:var(--es-bloco);display:flex;flex-direction:column;align-items:center;gap:14px;padding:14px 0}
.app .trilho i{width:20px;height:20px;border-radius:6px;background:var(--es-bloco-linha-2)}
.app .trilho i.on{background:var(--es-primaria)}
.app .trilho .simb{width:20px;height:22px;background:none}
.app .lista{border-right:1px solid var(--es-linha);padding:10px 8px;display:flex;flex-direction:column;gap:4px;background:var(--es-fundo)}
.app .lista .busca{height:28px;border-radius:8px;background:var(--es-superficie);margin-bottom:6px}
.conv{display:grid;grid-template-columns:28px 1fr;gap:8px;align-items:center;padding:8px;border-radius:var(--raio-sm)}
.conv.on{background:var(--es-suave)}
.conv>div{min-width:0}
.conv b{display:block;font-size:12px;font-weight:var(--peso-titulo);color:var(--es-texto);line-height:1.2}
.conv small{display:block;font-size:11px;color:var(--es-texto-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:var(--peso-forte);color:var(--es-branco-fixo);background:var(--es-cat-1);flex:none}
.av.b{background:var(--es-cat-2)}.av.c{background:var(--es-cat-3)}.av.d{background:var(--es-cat-4)}
.chat{display:flex;flex-direction:column;background:var(--es-superficie);min-width:0}
.chat .cab-chat{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--es-linha);background:var(--es-fundo);flex-wrap:wrap;row-gap:4px;min-width:0}
.chat .cab-chat>div{min-width:0}
.chat .cab-chat b{font-size:12.5px;color:var(--es-texto)}
.chat .cab-chat small{font-size:11px;color:var(--es-texto-3)}
.chat .cab-chat small,.chat .cab-chat b{display:block;line-height:1.3}
.cab-chat .pilula{margin-left:auto}
.msgs{display:flex;flex-direction:column;gap:8px;padding:14px;flex:1}
.msg{max-width:84%;padding:8px 11px;border-radius:var(--raio-md);border-top-left-radius:4px;background:var(--es-fundo);border:1px solid var(--es-linha);color:var(--es-texto);font-size:12.5px;line-height:1.4}
.msg small{display:block;font-size:10px;color:var(--es-texto-3);margin-top:3px}
.msg.eu,.msg.ia{align-self:flex-end;background:var(--es-suave);border-color:transparent;border-top-left-radius:var(--raio-md);border-top-right-radius:4px}
.msg.ia{border-left:3px solid var(--es-sucesso)}
.msg .quem{display:block;font-size:10px;font-weight:var(--peso-forte);color:var(--es-destaque);margin-bottom:2px;letter-spacing:.02em}
.evento{align-self:center;font-size:10.5px;color:var(--es-texto-3);background:var(--es-fundo);border:1px solid var(--es-linha);border-radius:var(--raio-pilula);padding:3px 10px;text-align:center}
.digitar{position:relative;margin:0 14px 14px;height:34px;border-radius:var(--raio-pilula);background:var(--es-fundo);border:1px solid var(--es-linha);display:flex;align-items:center;padding:0 14px;font-size:11px;color:var(--es-texto-3)}
@media(max-width:640px){.app{grid-template-columns:1fr;min-height:0}.app .trilho,.app .lista{display:none}}
.flutua{position:absolute;z-index:2;background:var(--es-fundo);border:1px solid var(--es-linha);border-radius:14px;padding:10px 12px;box-shadow:var(--es-sombra);font-size:12px;display:flex;gap:10px;align-items:center}
.flutua b{display:block;font-size:12.5px;color:var(--es-texto)}
.flutua span{color:var(--es-texto-3)}
.flutua .ic{width:30px;height:30px}
/* ---- 5.10b cena viva do produto (hero): o cliente chama, a IA responde, o lead
   entra no funil e a venda fecha. Estado final no HTML (sem JS ou com menos
   movimento, fica tudo visível); o site.js adiciona .viva e toca a sequência. */
.cena{position:relative;padding:26px 0 44px;max-width:640px;margin-inline:auto;width:100%}
@media(min-width:1024px){.cena{padding:34px 30px 50px 0;max-width:none}}
.cena-brilho{position:absolute;z-index:-1;inset:-6% -14% -4% 4%;pointer-events:none;background:var(--es-aurora)}
.cena-brilho:after{content:"";position:absolute;width:46%;aspect-ratio:1;left:-8%;bottom:-6%;background:var(--es-aurora-2)}
.cena .moldura{box-shadow:var(--es-sombra),0 0 0 1px var(--es-linha)}
.cena .app{min-height:392px}
.cena .chat{background:var(--es-fundo-chat)}
.cena .msgs{justify-content:flex-start}
.cena .conv .badge{margin-left:auto;min-width:18px;height:18px;padding:0 5px;border-radius:var(--raio-pilula);background:var(--es-wa-marca);color:var(--es-navy-fixo);font-size:10px;font-weight:var(--peso-forte);display:grid;place-items:center}
.cena .conv{grid-template-columns:28px 1fr auto}
.cena .msg.ia{position:relative;isolation:isolate;background:transparent;border-color:transparent}
.cena .msg.ia:before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--es-suave);border-left:3px solid var(--es-sucesso);transform-origin:100% 0;transition:opacity var(--es-dur-2) var(--es-ease),transform var(--es-dur-3) var(--es-ease-mola)}
.cena .pontos{position:absolute;right:0;top:0;height:30px;padding:0 12px;display:flex;align-items:center;gap:4px;border-radius:var(--raio-md) 4px var(--raio-md) var(--raio-md);background:var(--es-suave);opacity:0;transition:opacity var(--es-dur-1)}
.cena .pontos i{width:6px;height:6px;border-radius:50%;background:var(--es-destaque);animation:sc-ponto 1s ease-in-out infinite}
.cena .pontos i:nth-child(2){animation-delay:.15s}.cena .pontos i:nth-child(3){animation-delay:.3s}
.cena .digitar{color:var(--es-texto-3)}
.cena .flutua{position:absolute;z-index:2;background:var(--es-vidro);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--es-linha);border-radius:var(--raio-lg);box-shadow:var(--es-sombra);font-size:12px}
.cena-oficial{left:-24px;top:-8px;display:flex;gap:10px;align-items:center;padding:10px 14px 10px 10px}
.cena-oficial .ic{width:30px;height:30px}
.cena-oficial b,.cena-venda b{display:block;font-size:12.5px;color:var(--es-texto);line-height:1.3}
.cena-oficial span,.cena-venda span{color:var(--es-texto-3);line-height:1.3}
.cena-funil{display:block;left:-26px;bottom:96px;width:232px;padding:12px}
.cena-funil>b{display:flex;justify-content:space-between;font-size:11.5px;color:var(--es-texto-2);font-weight:var(--peso-titulo);margin-bottom:8px}
.cena-funil>b span{color:var(--es-sucesso)}
.mini-k{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mini-k>div{display:grid;gap:6px;align-content:start}
.mini-k small{font-size:10.5px;color:var(--es-texto-3);font-weight:var(--peso-medio)}
.mini-k .vaga{height:46px;border-radius:var(--raio-sm);border:1.5px dashed var(--es-linha-forte)}
.mini-cartao{position:absolute;left:0;bottom:0;width:calc(50% - 4px);height:46px;padding:7px 9px;border-radius:var(--raio-sm);background:var(--es-fundo);border:1px solid var(--es-linha);box-shadow:var(--es-sombra-forte);display:grid;align-content:center;gap:2px;transition:transform .9s var(--es-ease-mola)}
.mini-cartao b{font-size:11.5px;color:var(--es-texto);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25}
.mini-cartao small{font-size:10px;color:var(--es-destaque);font-weight:var(--peso-titulo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25}
.mini-cartao.movido,html:not(.js) .mini-cartao{transform:translateX(calc(100% + 8px))}
@media(prefers-reduced-motion:reduce){.cena .mini-cartao{transform:translateX(calc(100% + 8px))}}
.cena-venda{right:6%;bottom:0;display:flex;gap:10px;align-items:center;padding:10px 16px 10px 10px}
.cena-venda .ok{position:relative;width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--es-sucesso);color:var(--es-fundo);font-weight:var(--peso-forte);font-size:16px}
.cena-venda .ok:after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--es-sucesso);opacity:0}
.cena-venda .v{color:var(--es-sucesso);font-weight:var(--peso-forte);font-variant-numeric:tabular-nums}
@media(max-width:1180px){.cena-oficial{display:none}}
@media(max-width:640px){
 .cena{padding:18px 0 40px}
 .cena .app{min-height:340px}
 .cena{padding-bottom:40px}
 .cena-funil{left:auto;right:-2px;top:0;bottom:auto;width:184px;padding:10px}
 .cena-venda{right:auto;left:8px;bottom:0}
}
/* rótulo da cena para leitores de tela (a cena em si é aria-hidden) */
.cena-legenda{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- 5.10c canais convergindo numa caixa só (/canais/) */
.canais-vis{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:18px;align-items:center;padding:22px;background:var(--es-superficie)}
.canais-vis ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.canal{position:relative;display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:var(--raio-md);background:var(--es-fundo);border:1px solid var(--es-linha);font-size:12.5px;font-weight:var(--peso-titulo);color:var(--es-texto)}
.canal:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--c,var(--es-cat-1));flex:none}
.canal:after{content:"";position:absolute;left:100%;top:50%;width:18px;height:2px;background:linear-gradient(90deg,var(--c,var(--es-cat-1)),transparent);transform-origin:0 50%}
.canal.c1{--c:var(--es-wa-marca)}.canal.c2{--c:var(--es-cat-4)}.canal.c3{--c:var(--es-cat-1)}.canal.c4{--c:var(--es-cat-3)}
.caixa-unica{background:var(--es-fundo);border:1px solid var(--es-linha);border-radius:var(--raio-lg);padding:12px;display:grid;gap:6px;box-shadow:var(--es-sombra-forte)}
.caixa-unica>b{font-size:12px;color:var(--es-texto-2);padding:2px 4px 6px}
.caixa-unica .conv{grid-template-columns:28px 1fr auto;background:var(--es-superficie)}
.caixa-unica .conv i{font-style:normal;font-size:10px;font-weight:var(--peso-titulo);padding:2px 7px;border-radius:var(--raio-pilula);background:color-mix(in srgb,var(--c) 16%,transparent);color:var(--es-texto-2);white-space:nowrap}
@media(max-width:520px){.canais-vis{grid-template-columns:1fr}.canal:after{display:none}.canais-vis ul{grid-template-columns:1fr 1fr}}

/* ---- 5.10d abas de funcionalidades (padrão smarthub/abas-funcionalidades).
   Painéis empilhados na mesma célula da grade: a altura é a do maior e a troca
   não mexe no layout. O indicador desliza com clip-path (site.js). */
.abas{display:grid;gap:var(--esp-6)}
.abas-lista{position:relative;display:flex;gap:2px;padding:6px;border:1px solid var(--es-linha);border-radius:var(--raio-pilula);background:var(--es-fundo);overflow-x:auto;scrollbar-width:none;max-width:100%;width:max-content;margin-inline:auto;box-shadow:0 10px 30px -24px var(--es-destaque)}
.abas-lista::-webkit-scrollbar{display:none}
.abas-lista [role=tab]{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;min-height:var(--alvo);padding:0 16px;border:0;border-radius:var(--raio-pilula);background:none;color:var(--es-texto-2);font-weight:var(--peso-titulo);font-size:var(--fs-ui);white-space:nowrap;cursor:pointer;transition:color var(--es-dur-2) var(--es-ease)}
.abas-lista [role=tab]:hover{color:var(--es-texto)}
.abas-lista [role=tab] .ic{width:22px;height:22px;background:none;color:inherit}
.abas-lista [role=tab] .ic[data-i]:before{width:18px;height:18px}
.abas-lista [aria-selected=true],.abas-lista [aria-selected=true]:hover{color:var(--es-primaria-texto)}
.abas:not(.pronta) [aria-selected=true]{background:var(--es-primaria)}
/* indicador: pseudo-elemento da lista (--iw largura rolável, --il/--ir bordas da aba ativa) */
.abas.pronta .abas-lista:before{content:"";position:absolute;z-index:0;left:6px;top:6px;bottom:6px;width:var(--iw,calc(100% - 12px));border-radius:var(--raio-pilula);background:var(--es-primaria);clip-path:inset(0 calc(100% - var(--ir,0px)) 0 var(--il,0px) round 999px);transition:clip-path var(--es-dur-3) var(--es-ease-mola);pointer-events:none}
.abas-prog{position:absolute;left:16px;right:16px;bottom:5px;height:2px;border-radius:2px;background:currentColor;opacity:0;transform:scaleX(0);transform-origin:0 50%}
.abas.auto [aria-selected=true] .abas-prog{opacity:.45;animation:sc-prog 7s linear forwards}
.abas-paineis{display:grid}
.aba-painel{grid-area:1/1;display:grid;gap:var(--esp-6);align-items:center;transition:opacity var(--es-dur-2) var(--es-ease),transform var(--es-dur-3) var(--es-ease),visibility 0s linear var(--es-dur-2)}
@media(min-width:960px){.aba-painel{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:var(--esp-8)}}
.aba-painel:not(.on){opacity:0;visibility:hidden;transform:translateY(14px);pointer-events:none}
.aba-painel.on{transition-delay:.08s,.08s,0s}
.aba-painel h3{font-size:clamp(22px,2.4vw,30px);letter-spacing:-.02em}
.aba-painel .txt>p{margin-top:12px;font-size:var(--fs-lead)}
.aba-painel .link-seta{margin-top:16px}
.aba-vis{min-width:0}
.aba-vis .moldura{padding:0}
.aba-painel.on .aba-vis [data-i-v]{animation:es-surge var(--es-dur-3) var(--es-ease) both;animation-delay:calc(var(--v,0) * 90ms + 120ms)}
@media(max-width:700px){.abas-lista{width:auto;margin-inline:calc(var(--gutter) * -1);border-radius:0;border-inline:0;padding-inline:var(--gutter);box-shadow:none;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}.abas.pronta .abas-lista:before{left:var(--gutter)}}
/* visuais das abas (nomes fictícios, sem dado de cliente) */
.v-corpo{padding:16px;display:grid;gap:10px;background:var(--es-superficie)}
.v-linha{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--raio-md);background:var(--es-fundo);border:1px solid var(--es-linha);font-size:12.5px;color:var(--es-texto);min-width:0}
.v-linha>span:not(.av):not(.pilula):not(.ic){min-width:0;flex:1}
.v-linha small{display:block;font-size:11px;color:var(--es-texto-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v-linha b{display:block;font-weight:var(--peso-titulo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v-linha .pilula{flex:none}
.v-contato{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;padding:14px;border-radius:var(--raio-md);background:var(--es-fundo);border:1px solid var(--es-linha)}
.v-contato .av{width:42px;height:42px;font-size:14px}
.v-contato b{font-size:15px;color:var(--es-texto)}
.v-contato small{display:block;font-size:12px;color:var(--es-texto-3)}
.v-tags{display:flex;flex-wrap:wrap;gap:6px}
.v-hist{list-style:none;margin:0;padding:4px 0 0 14px;display:grid;gap:10px;border-left:2px solid var(--es-linha)}
.v-hist li{position:relative;font-size:12.5px;color:var(--es-texto-2)}
.v-hist li:before{content:"";position:absolute;left:-20px;top:4px;width:10px;height:10px;border-radius:50%;background:var(--es-fundo);border:2px solid var(--es-destaque)}
.v-hist b{color:var(--es-texto);font-weight:var(--peso-titulo)}
.v-sug{display:flex;gap:8px;align-items:center;padding:10px 12px;border-radius:var(--raio-md);border:1px dashed color-mix(in srgb,var(--es-destaque) 50%,var(--es-linha));background:var(--es-suave);font-size:12.5px;color:var(--es-texto)}
.v-sug .ic{width:26px;height:26px;background:var(--es-fundo)}
.v-sug .ic[data-i]:before{width:15px;height:15px}
.v-fluxo{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.v-fluxo li{position:relative;display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:var(--raio-md);background:var(--es-fundo);border:1px solid var(--es-linha);font-size:12.5px;color:var(--es-texto)}
.v-fluxo li:not(:last-child):after{content:"";position:absolute;left:26px;top:100%;width:2px;height:14px;background:var(--es-linha-forte)}
.v-fluxo .ic{width:30px;height:30px}
.v-fluxo .ic[data-i]:before{width:16px;height:16px}
.v-fluxo small{display:block;font-size:11px;color:var(--es-texto-3)}
.v-fluxo li.fim{border-style:dashed}
.v-cats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.v-cats div{padding:12px;border-radius:var(--raio-md);background:var(--es-fundo);border:1px solid var(--es-linha)}
.v-cats b{display:block;font-size:13px;color:var(--es-texto)}
.v-cats small{font-size:11.5px;color:var(--es-texto-3)}
.v-selo{display:flex;align-items:center;gap:12px;padding:14px;border-radius:var(--raio-md);background:var(--es-bloco);color:var(--es-bloco-texto)}
.v-selo .ic{background:var(--es-bloco-vidro);color:var(--es-destaque)}
.v-selo b{display:block;color:var(--es-bloco-texto)}
.v-selo small{color:var(--es-bloco-texto-2);font-size:12px}
/* kanban: cartões com a mesma altura, para o cartão que muda de coluna encaixar no espaço */
.kanban{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:14px;background:var(--es-superficie);overflow:hidden}
.col-k{display:flex;flex-direction:column;gap:8px;min-width:0}
.col-k>b{font-size:11.5px;font-weight:var(--peso-titulo);color:var(--es-texto-2);display:flex;justify-content:space-between;height:16px}
.col-k>b span{color:var(--es-texto-3);font-weight:var(--peso-medio)}
.cartao{background:var(--es-fundo);border:1px solid var(--es-linha);border-radius:var(--raio-sm);padding:9px 10px;display:grid;gap:3px;align-content:start;height:68px;position:relative;z-index:1}
.cartao b,.cartao small{line-height:1.4}
.cartao b{font-size:12px;color:var(--es-texto);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cartao small{font-size:10.5px;color:var(--es-texto-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cartao .v{font-size:11.5px;font-weight:var(--peso-titulo);color:var(--es-destaque);font-variant-numeric:tabular-nums}
.cartao.vaga{background:transparent;border:1.5px dashed var(--es-linha-forte);z-index:0}
@media(max-width:640px){.kanban{grid-template-columns:repeat(2,minmax(0,1fr))}.col-k:nth-child(n+3){display:none}}
/* painel do gestor */
.painel-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px;background:var(--es-superficie)}
.painel-kpis div{background:var(--es-fundo);border:1px solid var(--es-linha);border-radius:var(--raio-sm);padding:12px;min-width:0}
.painel-kpis small{display:block;font-size:11px;color:var(--es-texto-3)}
.painel-kpis b{font-size:clamp(14px,1.6vw,20px);font-weight:var(--peso-forte);color:var(--es-texto);letter-spacing:-.02em}
.barras{display:flex;align-items:flex-end;gap:6px;height:90px;padding:0 14px 14px;background:var(--es-superficie)}
.barras i{flex:1;border-radius:6px 6px 0 0;background:var(--es-suave-2);transform-origin:50% 100%}
.barras i.on{background:var(--es-primaria)}
.mock-legenda{font-size:12.5px;color:var(--es-texto-3);margin-top:var(--esp-3);text-align:center}

/* ---- 5.11 cabeçalho (.topo-fixo: gruda, ganha sombra e some ao descer no celular — es-ui) */
header.topo-fixo{background:var(--es-vidro);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--es-linha)}
.topo{display:flex;align-items:center;gap:20px;min-height:68px}
.logo{display:flex;align-items:center;flex:none;min-height:var(--alvo)}
.logo img{height:26px;width:auto}
.topo .logo{view-transition-name:sc-logo}
.nav{display:flex;align-items:center;gap:4px;margin-left:auto;font-size:15px}
.nav>a,.nav summary{min-height:var(--alvo);padding:10px 12px;border-radius:var(--raio-pilula);color:var(--es-texto-2);cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:6px;transition:color var(--es-dur-1,.16s),background-color var(--es-dur-1,.16s)}
.nav summary::-webkit-details-marker{display:none}
.nav>a{position:relative}
.nav>a:after{content:"";position:absolute;left:14px;right:14px;bottom:7px;height:2px;border-radius:2px;background:var(--es-destaque);transform:scaleX(0);transform-origin:0 50%;transition:transform var(--es-dur-2) var(--es-ease)}
.nav>a:hover:after,.nav>a.on:after{transform:none}
.nav>a:hover,.nav summary:hover,.nav a.on,.nav details.on summary{color:var(--es-texto);background:var(--es-superficie)}
.nav summary:after{content:"";width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform var(--es-dur-2,.3s) var(--es-ease,ease)}
.nav details[open] summary:after{transform:rotate(-135deg) translateY(-2px)}
.menu-sub{position:relative}
.menu-sub .painel{position:absolute;top:calc(100% + 10px);left:-12px;width:580px;background:var(--es-fundo);border:1px solid var(--es-linha);border-radius:var(--es-raio);padding:var(--esp-3);display:grid;grid-template-columns:1fr 1fr;gap:4px;box-shadow:var(--es-sombra)}
.menu-sub[open] .painel{animation:es-surge var(--es-dur-2,.3s) var(--es-ease,ease) both}
.menu-sub .painel a{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:var(--raio-md);transition:background-color var(--es-dur-1,.16s)}
.menu-sub .painel a:hover,.menu-sub .painel a.on{background:var(--es-superficie)}
.menu-sub .painel .ic{width:36px;height:36px}
.menu-sub .painel .ic[data-i]:before{width:18px;height:18px}
.menu-sub .painel b{display:block;font-weight:var(--peso-titulo);color:var(--es-texto);font-size:15px}
.menu-sub .painel span:not(.ic){display:block;font-size:13.5px;color:var(--es-texto-3);line-height:1.4;margin-top:2px}
.topo-acoes{display:flex;align-items:center;gap:8px}
.topo-acoes .btn{min-height:var(--alvo);padding:0 18px;font-size:14.5px}
.burger{display:inline-grid;place-items:center;width:var(--alvo);height:var(--alvo);border-radius:var(--raio-pilula);border:1px solid var(--es-linha);background:transparent;cursor:pointer;color:var(--es-texto-2);transition:color var(--es-dur-1,.16s),border-color var(--es-dur-1,.16s)}
.burger:hover{color:var(--es-destaque);border-color:var(--es-destaque)}
.burger{display:none;color:var(--es-texto)}
.burger svg{width:20px;height:20px}
.burger path{transition:transform var(--es-dur-2,.3s) var(--es-ease,ease),opacity var(--es-dur-1,.16s);transform-origin:12px 12px}
.aberto .burger .b1{transform:translateY(5px) rotate(45deg)}
.aberto .burger .b2{opacity:0}
.aberto .burger .b3{transform:translateY(-5px) rotate(-45deg)}
.nav .entrar-cel,.nav .teste-cel{display:none}
@media(max-width:1080px){
 .nav{display:none}
 .burger{display:inline-grid}
 .topo-acoes{margin-left:auto}
 .topo-acoes .entrar{display:none}
 .topo.aberto{flex-wrap:wrap;padding-bottom:var(--esp-4)}
 .topo.aberto .nav{display:flex;order:5;width:100%;flex-direction:column;align-items:stretch;gap:2px;margin:6px 0 0;max-height:calc(100dvh - 90px);overflow:auto;animation:es-surge var(--es-dur-2,.3s) var(--es-ease,ease) both}
 .topo.aberto .nav>a,.topo.aberto .nav summary{padding:12px 8px;border-radius:var(--raio-sm);font-size:var(--fs-lead)}
 .menu-sub .painel{position:static;width:auto;grid-template-columns:1fr;box-shadow:none;border:0;padding:0 0 0 4px;background:transparent}
 .topo.aberto .nav .entrar-cel{display:flex}
}
@media(max-width:640px){
 .topo-acoes .teste{display:none}
 .topo.aberto .nav .teste-cel{display:inline-flex;margin-top:10px}
 .logo img{height:20px}
 .topo{gap:10px}
}

/* ---- 5.12 rodapé */
.rodape{padding:0 0 var(--esp-5)}
.rodape .bloco{background:var(--es-superficie);border:1px solid var(--es-linha);border-radius:var(--raio-xl);padding:var(--esp-6) var(--esp-5);display:grid;gap:var(--esp-6) var(--esp-4);grid-template-columns:1fr 1fr}
.rodape .marca{grid-column:1/-1}
@media(min-width:900px){.rodape .bloco{grid-template-columns:1.4fr repeat(4,1fr);padding:var(--esp-7)}.rodape .marca{grid-column:auto}}
.rodape .marca p{font-size:14.5px;margin-top:14px;max-width:320px}
.rodape .marca .logo img{height:auto;width:100%;max-width:240px}
.rodape h2{font-size:13px;font-weight:var(--peso-titulo);letter-spacing:.08em;text-transform:uppercase;color:var(--es-texto-3);margin-bottom:6px}
.rodape ul{list-style:none;margin:0;padding:0;display:grid}
.rodape li a{display:inline-block;padding:9px 0;line-height:1.35;font-size:14.5px;color:var(--es-texto-2);transition:color var(--es-dur-1,.16s)}
.rodape li a:hover{color:var(--es-destaque)}
.rodape .contato-lista{gap:0}
.rodape .contato-lista li{font-size:14.5px;color:var(--es-texto-2)}
.rodape .base{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;align-items:center;padding:20px 4px 0;font-size:13px;color:var(--es-texto-3)}
.rodape .by{display:inline-flex;align-items:center;gap:8px}
.rodape .by img{height:16px;width:auto}

/* ---- 5.12b painéis pastel .recurso (mesmos nomes de classe do EcomIA: .recurso .g .txt
   .tag .lista .btn.ac .palco .tela .balao; cores .azul .verde .creme .rosa .lilas; .inv
   troca o lado; .pilha empilha no desktop). A tela é o mockup do produto, inclinada. */
.azul{--c:var(--pastel-azul);--p:var(--pastel-azul-p);--a:var(--pastel-azul-a);--ac:var(--a)}
.verde{--c:var(--pastel-verde);--p:var(--pastel-verde-p);--a:var(--pastel-verde-a);--ac:var(--a)}
.creme{--c:var(--pastel-creme);--p:var(--pastel-creme-p);--a:var(--pastel-creme-a);--ac:var(--a)}
.rosa{--c:var(--pastel-rosa);--p:var(--pastel-rosa-p);--a:var(--pastel-rosa-a);--ac:var(--a)}
.lilas{--c:var(--pastel-lilas);--p:var(--pastel-lilas-p);--a:var(--pastel-lilas-a);--ac:var(--a)}
.tag{display:inline-flex;align-items:center;border-radius:var(--raio-sm);padding:4px 10px;font-size:11px;font-weight:var(--peso-titulo);letter-spacing:.06em;text-transform:uppercase;background:var(--es-texto);color:var(--es-fundo)}
.btn.ac{background:var(--ac);color:var(--es-sobre-ac);box-shadow:0 10px 24px -14px var(--ac)}
.btn.ac:hover{filter:brightness(1.08)}
.recurso .lista{list-style:none;padding:0;margin:22px 0 28px;display:grid;gap:12px}
.recurso .lista li{display:flex;gap:12px;align-items:flex-start;color:var(--es-texto)}
.recurso .lista li:before{content:"✓";width:22px;height:22px;margin-top:1px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:11.5px;font-weight:var(--peso-forte);color:var(--es-sobre-ac);background:var(--ac,var(--es-primaria))}
.creme .btn.ac,.creme .lista li:before,.creme .balao .ic{color:var(--pastel-creme-sobre)}
.pilha{display:grid;gap:24px}
@media(min-width:768px){.pilha{gap:32px}}
.recurso{position:relative;border-radius:var(--raio-xl);padding:24px;background:var(--c);border:1px solid var(--es-linha)}
.recurso+.recurso{margin-top:24px}
@media(min-width:768px){.recurso{padding:48px}.recurso+.recurso{margin-top:32px}}
.pilha>.recurso+.recurso{margin-top:0}
.recurso .g{display:grid;gap:40px;align-items:center}
.recurso .g>*{min-width:0}
@media(min-width:1024px){.recurso .g{grid-template-columns:1fr 1fr;gap:56px}.recurso.inv .txt{order:2}}
.recurso :is(h2,h3){font-size:clamp(24px,2.8vw,34px);font-weight:var(--peso-forte);letter-spacing:-.025em;line-height:1.12;margin-top:18px;max-width:480px}
.recurso .txt>p{margin-top:14px;max-width:480px;font-size:var(--fs-lead)}
@media(min-width:1024px){
 .pilha .recurso{position:sticky;top:calc(var(--topo-h) + 24px + var(--i,0) * 18px);box-shadow:0 -24px 60px -48px rgba(11,16,51,.45)}
 .pilha .recurso:nth-child(2){--i:1}.pilha .recurso:nth-child(3){--i:2}.pilha .recurso:nth-child(4){--i:3}.pilha .recurso:nth-child(5){--i:4}.pilha .recurso:nth-child(6){--i:5}
}
.palco{position:relative;margin:34px 16px}
.palco:before{content:"";position:absolute;inset:-16px;border-radius:var(--raio-xl);background:var(--p);transform:translate3d(0,var(--pp,0px),0) rotate(var(--pr,-2deg)) scale(var(--ps,1));transition:transform var(--es-dur-3) var(--es-ease)}
.inv .palco:before{--pr:2deg}
@media(hover:hover){.recurso:hover .palco:before{--pr:1deg;--ps:1.01}.recurso.inv:hover .palco:before{--pr:-1deg}}
.tela{position:relative;background:var(--es-fundo);border-radius:var(--raio-lg);border:1px solid var(--es-linha);box-shadow:var(--es-sombra-forte);padding:20px;display:grid;gap:12px;font-size:13px;transform:perspective(1000px) rotate(var(--rz,1.2deg)) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform var(--es-dur-3) var(--es-ease-mola)}
.inv .tela{--rz:-1.2deg}
.tela .msg{max-width:86%;font-size:13px}
.tela .msg.ia,.tela .msg.eu{justify-self:end}
.tela .kanban{padding:0;background:none;grid-template-columns:repeat(3,minmax(0,1fr))}
.tela .exemplo{font-size:11px;color:var(--es-texto-3);text-align:right}
.tela .preco-mini{display:flex;align-items:baseline;gap:6px}
.tela .preco-mini b{font-size:34px;font-weight:var(--peso-forte);letter-spacing:-.03em;color:var(--es-texto)}
.tela .preco-mini span{color:var(--es-texto-3)}
.tela table{width:100%;border-collapse:collapse;font-size:12.5px}
.tela th,.tela td{text-align:left;padding:8px 6px;border-bottom:1px solid var(--es-linha)}
.tela th{color:var(--es-texto-3);font-weight:var(--peso-medio)}
.tela td.r,.tela th.r{text-align:right}
.balao{display:flex;align-items:center;gap:12px;background:var(--es-balao);color:var(--es-texto);border-radius:var(--raio-lg);padding:12px 16px;box-shadow:var(--es-sombra-balao);font-size:12px;line-height:1.3;text-align:left}
.palco .balao .ic{width:34px;height:34px;border-radius:50%;color:var(--es-sobre-ac);background:var(--ac,var(--es-primaria));font-size:12px;font-weight:var(--peso-forte)}
.palco .balao .ic[data-i]:before{width:17px;height:17px}
.palco .balao b{display:block;font-weight:var(--peso-titulo);font-size:13px;color:var(--es-texto)}
.palco .balao span:not(.ic){color:var(--es-texto-3)}
.palco>.balao{position:absolute;left:24px;bottom:-38px;z-index:2}
.palco>.balao.topo-dir{left:auto;right:-6px;top:-38px;bottom:auto}
@media(max-width:767px){.palco>.balao,.palco>.balao.topo-dir{position:relative;left:auto;bottom:auto;right:auto;top:auto;margin-top:18px;width:max-content;max-width:100%}.tela{--rz:.6deg}.inv .tela{--rz:-.6deg}}
@media(max-width:520px){.tela .kanban{grid-template-columns:repeat(2,minmax(0,1fr))}.tela .kanban .col-k:nth-child(n+3){display:none}}

/* ---- 5.13 ícones (máscara, cor = currentColor) */
.ic[data-i]:before{content:"";width:22px;height:22px;background:currentColor;-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat}
.ic[data-i="chat"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H8l-4 4z'/%3E%3C/svg%3E")}
.ic[data-i="equipe"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Ccircle cx='17' cy='9' r='2.5'/%3E%3Cpath d='M3 20c0-3.3 2.7-6 6-6s6 2.7 6 6M15 14.5c3 0 6 2 6 5.5'/%3E%3C/svg%3E")}
.ic[data-i="ia"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8z'/%3E%3Cpath d='M19 16l.8 2.2L22 19l-2.2.8L19 22l-.8-2.2L16 19l2.2-.8z'/%3E%3C/svg%3E")}
.ic[data-i="funil"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5h18l-7 8v6l-4 2v-8z'/%3E%3C/svg%3E")}
.ic[data-i="raio"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2L4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E")}
.ic[data-i="escudo"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v6c0 4-3 7-7 9-4-2-7-5-7-9V6z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E")}
.ic[data-i="tomada"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 2v6M15 2v6M6 8h12v4a6 6 0 0 1-12 0zM12 18v4'/%3E%3C/svg%3E")}
.ic[data-i="grafico"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V10M10 20V4M16 20v-7M22 20H2'/%3E%3C/svg%3E")}
.ic[data-i="celular"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2' width='10' height='20' rx='2'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E")}
.ic[data-i="relogio"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E")}
.ic[data-i="etiqueta"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12V4h8l10 10-8 8z'/%3E%3Ccircle cx='7.5' cy='8.5' r='1.5'/%3E%3C/svg%3E")}
.ic[data-i="envio"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 2L11 13M22 2l-7 20-4-9-9-4z'/%3E%3C/svg%3E")}
.ic[data-i="caixa"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13h5l2 3h4l2-3h5M5 5h14l2 8v6H3v-6z'/%3E%3C/svg%3E")}
.ic[data-i="mic"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3'/%3E%3C/svg%3E")}
.ic[data-i="lupa"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E")}
.ic[data-i="check"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
.ic[data-i="link"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 14a4 4 0 0 0 6 0l3-3a4 4 0 0 0-6-6l-1 1M14 10a4 4 0 0 0-6 0l-3 3a4 4 0 0 0 6 6l1-1'/%3E%3C/svg%3E")}
.ic[data-i="calc"]{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='2' width='14' height='20' rx='2'/%3E%3Cpath d='M8 6h8M8 11h2M14 11h2M8 15h2M14 15h2M8 19h2M14 19h2'/%3E%3C/svg%3E")}

/* ============================================================ 06 Padrões de página */

/* ---- 6.1 hero */
.hero{position:relative;background:var(--es-nevoa);overflow:hidden;border-bottom:1px solid var(--es-linha)}
.hero:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(to right,var(--es-grade) 1px,transparent 1px),linear-gradient(to bottom,var(--es-grade) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 0%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse 80% 70% at 50% 0%,#000 30%,transparent 75%)}
.hero:after{content:"";position:absolute;width:520px;height:520px;right:-160px;top:-200px;border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,color-mix(in srgb,var(--es-destaque) 16%,transparent),transparent);animation:sc-respira 14s ease-in-out infinite alternate}
.hero .w{position:relative;z-index:1}
.hero-g{display:grid;gap:40px;align-items:center;padding-block:40px 56px}
@media(min-width:1024px){.hero-g{grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:56px;padding-block:72px 88px}}
.hero h1{font-size:var(--fs-display);font-weight:var(--peso-forte);letter-spacing:-.03em;line-height:1.06;margin-top:14px}
.hero .sub{font-size:clamp(17px,1.6vw,19px);margin-top:18px;max-width:600px;color:var(--es-texto-2)}
.hero h1 .enfase{position:relative;white-space:nowrap}
.hero h1 .enfase:after{content:"";position:absolute;left:0;right:0;bottom:-.02em;height:.12em;border-radius:.1em;background:linear-gradient(90deg,var(--es-destaque),color-mix(in srgb,var(--es-destaque) 20%,transparent));transform-origin:0 50%;animation:sc-risca .9s var(--es-ease) .55s both;opacity:.55}
@media(max-width:520px){.hero h1 .enfase{white-space:normal}.hero h1 .enfase:after{display:none}}
.hero.centro .hero-g,.hero.curto .hero-g{grid-template-columns:minmax(0,1fr)}
.hero.curto .hero-txt{max-width:860px}
.hero.centro .hero-txt{text-align:center;max-width:820px;margin:0 auto}
.hero.centro .acoes,.hero.centro .condicoes{justify-content:center}
.hero.curto .hero-g{padding-block:40px 48px}
.hero.curto h1{font-size:var(--fs-h1)}
.migalha{font-size:13.5px;color:var(--es-texto-3);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.migalha a{color:var(--es-texto-2);padding-block:4px}
.migalha a:hover{color:var(--es-destaque)}
.migalha span[aria-hidden]{opacity:.6}
.resposta{margin-top:20px;padding:16px 18px;border-left:3px solid var(--es-destaque);background:color-mix(in srgb,var(--es-fundo) 70%,transparent);border-radius:0 var(--raio-md) var(--raio-md) 0;font-size:var(--fs-corpo);color:var(--es-texto-2);max-width:620px}

/* ---- 6.2 LP: passos, IA, comparativo, depoimentos, preço, CTA */
.passos{list-style:none;margin:0;padding:0;display:grid;gap:var(--esp-3);counter-reset:p}
@media(min-width:900px){.passos{grid-template-columns:repeat(4,1fr);gap:var(--esp-4)}.passos.tres{grid-template-columns:repeat(3,1fr)}}
.passos li{counter-increment:p;padding:var(--esp-5);border-radius:var(--es-raio);border:1px solid var(--es-linha);background:var(--es-fundo);position:relative}
.passos li:before{content:"0" counter(p);display:block;font-size:32px;font-weight:var(--peso-forte);color:var(--es-destaque);letter-spacing:-.03em;font-variant-numeric:tabular-nums;line-height:1;margin-bottom:14px}
.passos h3{font-size:17px}
.passos p{font-size:15px;margin-top:6px}
@media(max-width:899px){
 .passos li{display:grid;grid-template-columns:44px 1fr;column-gap:14px;padding:18px}
 .passos li:before{grid-row:span 2;font-size:24px;margin:0;padding-top:2px}
 .passos li:not(:last-child):after{content:"";position:absolute;left:39px;bottom:-13px;width:2px;height:14px;background:var(--es-linha-forte)}
}
/* [data-linha]: linha do tempo. Marcador redondo com o número; a linha (::before
   trilho, ::after preenchimento) liga o primeiro ao último e enche com a rolagem. */
.passos[data-linha]{position:relative;isolation:isolate;gap:var(--esp-6) var(--esp-5)}
.passos[data-linha] li{background:none;border:0;padding:0;display:grid;grid-template-columns:44px 1fr;column-gap:16px;align-content:start}
.passos[data-linha] li:after{display:none}
.passos[data-linha] li:before{position:relative;z-index:2;grid-row:span 2;width:44px;height:44px;margin:0;border-radius:50%;display:grid;place-items:center;font-size:15px;letter-spacing:0;background:var(--es-fundo);border:2px solid var(--es-linha-forte);color:var(--es-texto-3);transition:background-color var(--es-dur-2),border-color var(--es-dur-2),color var(--es-dur-2),transform var(--es-dur-3) var(--es-ease-mola),box-shadow var(--es-dur-3)}
.passos[data-linha] li.on:before,.passos[data-linha]:not(.linha-pronta) li:before{background:var(--es-primaria);border-color:var(--es-primaria);color:var(--es-primaria-texto);box-shadow:0 0 0 6px color-mix(in srgb,var(--es-primaria) 16%,transparent)}
.passos[data-linha] li.on:before{transform:scale(1.06)}
.passos[data-linha] li>*{transition:color var(--es-dur-3) var(--es-ease)}
.passos.linha-pronta li:not(.on)>*{color:var(--es-texto-3)}
.passos[data-linha] h3{padding-top:11px}
.passos[data-linha]:before,.passos[data-linha]:after{content:"";position:absolute;z-index:1;left:21px;top:var(--la,22px);width:2px;height:var(--lt,0px);border-radius:2px;background:var(--es-linha);transform-origin:50% 0}
.passos[data-linha]:after{background:linear-gradient(180deg,var(--es-primaria),var(--es-destaque-2));transform:scaleY(var(--p,0))}
@media(min-width:900px){
 .passos[data-linha] li{grid-template-columns:1fr;row-gap:16px}
 .passos[data-linha] li:before{grid-row:auto}
 .passos[data-linha] h3{padding-top:0}
 .passos[data-linha]:before,.passos[data-linha]:after{left:var(--la,22px);top:21px;height:2px;width:var(--lt,0px);transform-origin:0 50%}
 .passos[data-linha]:after{background:linear-gradient(90deg,var(--es-primaria),var(--es-destaque-2));transform:scaleX(var(--p,0))}
}
.passos[data-linha]:not(.linha-pronta):before,.passos[data-linha]:not(.linha-pronta):after{display:none}
.ia-papeis{display:grid;gap:var(--esp-3);margin-top:var(--esp-5)}
.ia-papeis div{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;padding:var(--esp-4);border:1px solid var(--es-linha);border-radius:var(--raio-md);background:var(--es-fundo)}
.ia-papeis .ic{grid-row:span 2}
.ia-papeis b{color:var(--es-texto);font-weight:var(--peso-titulo)}
.ia-papeis p{font-size:14.5px}
.compara{display:grid;gap:var(--esp-4)}
@media(min-width:900px){.compara{grid-template-columns:1fr 1fr}}
.compara>div{border-radius:var(--es-raio);padding:28px;border:1px solid var(--es-linha)}
.compara .bom{background:var(--es-suave);border-color:transparent}
.compara h3{font-size:var(--fs-h3);margin-bottom:var(--esp-4)}
.compara ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.compara li{display:flex;gap:10px;color:var(--es-texto)}
.compara .bom li:before{content:"✓";color:var(--es-destaque);font-weight:var(--peso-forte)}
.compara .ruim li{color:var(--es-texto-2)}
.compara .ruim li:before{content:"✕";color:var(--es-texto-3);font-weight:var(--peso-forte)}
.compara li{transition:opacity var(--es-dur-3) var(--es-ease),transform var(--es-dur-3) var(--es-ease)}
.compara .escondido li{opacity:0;transform:translateX(-10px)}
.compara li:nth-child(2){transition-delay:60ms}.compara li:nth-child(3){transition-delay:120ms}.compara li:nth-child(4){transition-delay:180ms}.compara li:nth-child(5){transition-delay:240ms}.compara li:nth-child(6){transition-delay:300ms}
.compara .bom{position:relative;overflow:hidden;isolation:isolate}
.compara .bom:after{content:"";position:absolute;inset:0;z-index:-1;background:var(--es-reflexo);transform:translateX(-100%)}
.compara .bom:not(.escondido):after{animation:sc-reflexo 1.6s var(--es-ease) .5s both}
/* depoimentos em vídeo: no celular viram carrossel com rolagem própria (a página não rola de lado) */
.videos{list-style:none;margin:0;padding:0;display:grid;gap:var(--esp-4);grid-template-columns:repeat(2,1fr)}
@media(min-width:900px){.videos{grid-template-columns:repeat(6,1fr)}}
@media(max-width:899px){
 .videos{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:min(42%,220px);overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gutter) * -1);padding:0 var(--gutter) 8px;scroll-padding-inline:var(--gutter);scrollbar-width:thin}
 .videos li{scroll-snap-align:start}
}
.video{position:relative;display:block;width:100%;aspect-ratio:9/16;border:0;border-radius:var(--es-raio);overflow:hidden;cursor:pointer;background:var(--es-bloco);padding:0}
.video img,.video iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;transition:transform var(--es-dur-3,.7s) var(--es-ease,ease)}
@media(hover:hover){.video:hover img{transform:scale(1.04)}}
.video .play{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:var(--es-branco-fixo);transition:transform var(--es-dur-2,.3s) var(--es-ease-mola,ease)}
.video:hover .play{transform:scale(1.1)}
.video .play:after{content:"";position:absolute;left:22px;top:17px;border-left:16px solid var(--es-navy-fixo);border-top:11px solid transparent;border-bottom:11px solid transparent}
.videos p{margin-top:10px;font-size:var(--fs-peq)}
.videos p b{display:block;color:var(--es-texto)}
.videos p span{color:var(--es-texto-3)}
.preco{position:relative;isolation:isolate;display:grid;border:1px solid transparent;border-radius:var(--raio-xl);overflow:hidden;background:var(--es-fundo);box-shadow:var(--es-sombra)}
.preco:before{content:"";position:absolute;z-index:-2;left:50%;top:50%;width:max(150%,900px);aspect-ratio:1;margin:calc(max(150%,900px) / -2) 0 0 calc(max(150%,900px) / -2);background:var(--es-anel);animation:sc-gira 9s linear infinite}
.preco:after{content:"";position:absolute;z-index:-1;inset:1.5px;border-radius:calc(var(--raio-xl) - 1.5px);background:var(--es-fundo)}
@media(min-width:900px){.preco{grid-template-columns:.9fr 1.1fr}}
.preco-valor{position:relative;padding:var(--esp-6);background:var(--es-suave);overflow:hidden}
.preco-valor:after{content:"";position:absolute;inset:0;background:var(--es-reflexo);transform:translateX(-100%);pointer-events:none}
@media(hover:hover){.preco:hover .preco-valor:after{animation:sc-reflexo 1.2s var(--es-ease) both}}
.preco-valor .kpi{font-size:clamp(44px,5vw,60px);line-height:1;margin:12px 0}
.preco-valor .kpi small{font-size:18px;font-weight:var(--peso-titulo);color:var(--es-texto-2);letter-spacing:0}
.preco-lista{padding:var(--esp-6)}
.preco-lista h3{font-size:var(--fs-xl)}
@media(max-width:520px){.preco-valor,.preco-lista{padding:var(--esp-5)}}
.cta-final{padding-block:var(--sec)}
.cta-final .banner{position:relative;overflow:hidden;isolation:isolate;background:var(--es-painel);border:1px solid var(--es-bloco-linha);border-radius:var(--raio-xl);padding:48px 24px;color:var(--es-bloco-texto);text-align:center}
@media(min-width:768px){.cta-final .banner{padding:72px 48px}}
.cta-final .banner:before{content:"";position:absolute;width:60%;aspect-ratio:1;left:-10%;top:-40%;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--es-destaque-2) 30%,transparent),transparent);animation:sc-respira 12s ease-in-out infinite alternate}
.cta-final .banner:after{content:"";position:absolute;right:-40px;bottom:-60px;width:260px;height:282px;opacity:.05;background:no-repeat center/contain url("assets/marca/simbolo-azul.svg")}
.cta-final .rotulo{color:var(--es-destaque)}
.cta-final h2{color:var(--es-bloco-texto);font-size:clamp(28px,4vw,48px);font-weight:var(--peso-forte);letter-spacing:-.03em;margin-top:12px}
.cta-final h2 em{font-style:normal;color:var(--es-destaque)}
.cta-final p{color:var(--es-bloco-texto-2);max-width:560px;margin:14px auto 0;font-size:var(--fs-lead)}
.cta-final .acoes{justify-content:center}
.cta-final .condicoes{justify-content:center;color:var(--es-bloco-texto-2)}
.cta-final .banner>*{position:relative}
.cta-final .banner .btn.pri{position:relative;overflow:hidden}
.cta-final .banner .btn.pri:after{content:"";position:absolute;inset:0;background:var(--es-reflexo);transform:translateX(-100%);animation:sc-reflexo 3.6s var(--es-ease) 1.2s infinite}

/* ---- 6.2b monte seu plano (/planos/, bloco sc/monte-plano): sem preço inventado;
   o resumo vai junto com o pedido de proposta (campo "plano" do formulário) */
.monte{display:grid;gap:var(--esp-5);align-items:start}
@media(min-width:1024px){.monte{grid-template-columns:minmax(0,1.35fr) minmax(0,.9fr);gap:var(--esp-6)}}
.monte-campos{display:grid;gap:var(--esp-4)}
.contadores{display:grid;gap:var(--esp-3)}
@media(min-width:640px){.contadores{grid-template-columns:1fr 1fr}}
.contador{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--es-linha);border-radius:var(--raio-lg);background:var(--es-fundo)}
.contador>span{flex:1;min-width:0;font-weight:var(--peso-titulo);color:var(--es-texto);line-height:1.3}
.contador>span small{display:block;font-weight:400;font-size:13px;color:var(--es-texto-3)}
.contador button{width:var(--alvo);height:var(--alvo);flex:none;border-radius:50%;border:1px solid var(--es-linha-forte);background:var(--es-superficie);color:var(--es-texto);font-size:20px;line-height:1;cursor:pointer;transition:border-color var(--es-dur-1),color var(--es-dur-1),transform var(--es-dur-1)}
.contador button:hover{border-color:var(--es-destaque);color:var(--es-destaque)}
.contador button:active{transform:scale(.9)}
.contador output{min-width:2ch;text-align:center;font-size:22px;font-weight:var(--peso-forte);color:var(--es-texto);font-variant-numeric:tabular-nums}
.modulos{border:0;margin:0;padding:0;display:grid;gap:var(--esp-3);grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.modulos legend{font-weight:var(--peso-titulo);color:var(--es-texto);margin-bottom:10px;font-size:var(--fs-lead)}
.mod{position:relative;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;padding:16px;border:1px solid var(--es-linha);border-radius:var(--raio-lg);background:var(--es-fundo);cursor:pointer;transition:border-color var(--es-dur-2),background-color var(--es-dur-2),transform var(--es-dur-2) var(--es-ease),box-shadow var(--es-dur-2)}
.mod input{position:absolute;opacity:0;width:1px;height:1px}
.mod .caixa{grid-row:span 2;width:24px;height:24px;margin-top:1px;border-radius:7px;border:2px solid var(--es-linha-forte);display:grid;place-items:center;transition:background-color var(--es-dur-2),border-color var(--es-dur-2)}
.mod .caixa:after{content:"";width:6px;height:11px;margin-top:-3px;border:solid var(--es-primaria-texto);border-width:0 2.4px 2.4px 0;transform:rotate(45deg) scale(0);transition:transform var(--es-dur-2) var(--es-ease-mola)}
.mod b{color:var(--es-texto);font-weight:var(--peso-titulo)}
.mod small{font-size:13.5px;color:var(--es-texto-2);line-height:1.45}
@media(hover:hover){.mod:hover{border-color:var(--es-linha-forte);transform:translateY(-2px)}}
.mod:has(input:checked){border-color:var(--es-destaque);background:var(--es-suave);box-shadow:0 14px 30px -24px var(--es-destaque)}
.mod:has(input:checked) .caixa{background:var(--es-primaria);border-color:var(--es-primaria)}
.mod:has(input:checked) .caixa:after{transform:rotate(45deg) scale(1)}
.mod:has(input:focus-visible){outline:2px solid var(--es-foco);outline-offset:3px}
.monte-resumo{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--raio-xl);padding:var(--esp-6) var(--esp-5);background:var(--es-painel);color:var(--es-bloco-texto);box-shadow:var(--es-sombra)}
@media(min-width:1024px){.monte-resumo{position:sticky;top:calc(var(--topo-h) + 24px)}}
.monte-resumo .rotulo{color:var(--es-destaque)}
.monte-resumo .kpi{font-size:clamp(34px,4vw,46px);line-height:1;margin:10px 0 4px;color:var(--es-bloco-texto)}
.monte-resumo .kpi small{font-size:16px;font-weight:var(--peso-titulo);color:var(--es-bloco-texto-2);letter-spacing:0}
.monte-resumo>p{color:var(--es-bloco-texto-2);font-size:14.5px}
.monte-resumo ul{list-style:none;margin:18px 0;padding:14px 0 0;border-top:1px solid var(--es-bloco-linha-2);display:grid;gap:8px}
.monte-resumo li{display:flex;gap:10px;align-items:baseline;color:var(--es-bloco-texto);font-size:15px}
.monte-resumo li:before{content:"✓";color:var(--es-destaque);font-weight:var(--peso-forte)}
.monte-resumo li.novo{animation:sc-entra var(--es-dur-3) var(--es-ease-mola) both}
.monte-resumo li.fixo{color:var(--es-bloco-texto-2)}
.monte-resumo .btn{width:100%}
.monte-resumo .nota{color:var(--es-bloco-texto-3)}
.monte-resumo:before{content:"";position:absolute;z-index:-1;width:70%;aspect-ratio:1;right:-30%;top:-30%;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--es-destaque-2) 30%,transparent),transparent);animation:sc-respira 12s ease-in-out infinite alternate}
.bump{animation:sc-pulsa var(--es-dur-2) var(--es-ease-mola)}

/* ---- 6.3 blog: filtros das trilhas, cartões, destaque, paginação, newsletter */
.filtros{display:flex;gap:var(--esp-2);flex-wrap:wrap;margin-bottom:var(--esp-6)}
.filtros a{display:inline-flex;align-items:center;min-height:var(--alvo);border:1px solid var(--es-linha);background:var(--es-fundo);border-radius:var(--raio-pilula);padding:0 16px;font-size:14.5px;color:var(--es-texto-2);white-space:nowrap;transition:border-color var(--es-dur-1,.16s),color var(--es-dur-1,.16s)}
.filtros a:hover{border-color:var(--es-destaque);color:var(--es-destaque)}
.filtros a.on{background:var(--es-texto);border-color:var(--es-texto);color:var(--es-fundo)}
@media(max-width:700px){.filtros{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(var(--gutter) * -1);padding:0 var(--gutter) 6px;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}.filtros::-webkit-scrollbar{display:none}}
.cards .wp-block-post-template,.grade-cards{list-style:none;margin:0;padding:0;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.cards .wp-block-post-template>li,.card-post{margin:0;background:var(--es-fundo);border:1px solid var(--es-linha);border-radius:var(--es-raio);overflow:hidden;display:flex;flex-direction:column;position:relative;transition:border-color var(--es-dur-2,.3s),transform var(--es-dur-2,.3s) var(--es-ease,ease),box-shadow var(--es-dur-2,.3s)}
.cards .wp-block-post-template>li:hover,.card-post:hover{border-color:var(--es-destaque)}
@media(hover:hover){.cards .wp-block-post-template>li:hover,.card-post:hover{transform:translateY(-4px);box-shadow:var(--es-sombra-forte)}}
.capa{position:relative;aspect-ratio:16/10;background:var(--es-suave);display:grid;place-items:center;overflow:hidden;margin:0}
.capa>span{background:var(--es-fundo);border-radius:var(--raio-pilula);padding:6px 12px;font-size:12.5px;font-weight:var(--peso-titulo);color:var(--es-texto)}
.capa.com-imagem img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform var(--es-dur-3,.7s) var(--es-ease,ease)}
@media(hover:hover){.cards li:hover .capa img,.card-post:hover .capa img{transform:scale(1.04)}}
.chip-trilha{position:absolute;left:12px;bottom:12px;z-index:1;background:var(--es-fundo);color:var(--es-texto);border-radius:var(--raio-pilula);padding:5px 11px;font-size:12px;font-weight:var(--peso-titulo)}
.cards .corpo,.card-post .corpo{padding:18px 20px 22px;display:grid;gap:8px;align-content:start}
.cards .wp-block-post-title,.card-post h3,.cards h2{font-size:var(--fs-h3);line-height:1.3;margin:0;letter-spacing:-.01em}
.cards .wp-block-post-title a:after,.card-post h3 a:after{content:"";position:absolute;inset:0;z-index:2}
.cards .wp-block-post-excerpt{margin:0}
.cards .wp-block-post-excerpt__excerpt{font-size:14.5px;color:var(--es-texto-2);margin:0}
.wp-block-post-excerpt__more-link{display:none}
.meta-artigo{font-size:13px;color:var(--es-texto-3);margin:0}
body:not(.paged) .cards.com-destaque .wp-block-post-template>li:first-child{grid-column:1/-1}
@media(min-width:900px){
 body:not(.paged) .cards.com-destaque .wp-block-post-template>li:first-child{display:grid;grid-template-columns:1.2fr 1fr}
 body:not(.paged) .cards.com-destaque li:first-child .capa{aspect-ratio:auto;min-height:320px}
 body:not(.paged) .cards.com-destaque li:first-child .wp-block-post-title{font-size:clamp(22px,2.4vw,30px)}
 body:not(.paged) .cards.com-destaque li:first-child .corpo{padding:40px;align-content:center}
}
/* celular: depois do destaque, cartões compactos (foto à esquerda) — menos rolagem */
@media(max-width:599px){
 .cards.com-destaque .wp-block-post-template>li:not(:first-child),body.paged .cards.com-destaque .wp-block-post-template>li,.cards.compacto .wp-block-post-template>li,.grade-cards>li{display:grid;grid-template-columns:112px 1fr;align-items:stretch}
 .cards.com-destaque li:not(:first-child) .capa,body.paged .cards.com-destaque li .capa,.cards.compacto li .capa,.grade-cards .capa{aspect-ratio:auto;height:100%;min-height:112px}
 .cards.com-destaque li:not(:first-child) .chip-trilha,.cards.compacto .chip-trilha,.grade-cards .chip-trilha{display:none}
 .cards.com-destaque li:not(:first-child) .corpo,.cards.compacto .corpo,.grade-cards .corpo{padding:14px 16px;gap:6px}
 .cards.com-destaque li:not(:first-child) .wp-block-post-title,.cards.compacto .wp-block-post-title,.grade-cards h3{font-size:15.5px}
 .cards.com-destaque li:not(:first-child) .wp-block-post-excerpt,.cards.compacto .wp-block-post-excerpt{display:none}
 .cards .wp-block-post-template,.grade-cards{gap:var(--esp-3)}
}
.wp-block-query-pagination{display:flex;justify-content:center;gap:8px;margin-top:40px;font-size:15px;flex-wrap:wrap}
.wp-block-query-pagination a,.wp-block-query-pagination .current{display:inline-grid;place-items:center;min-width:var(--alvo);height:var(--alvo);padding:0 14px;border-radius:var(--raio-pilula);border:1px solid var(--es-linha)}
.wp-block-query-pagination .current{background:var(--es-primaria);color:var(--es-primaria-texto);border-color:var(--es-primaria)}
.vazio{text-align:center;color:var(--es-texto-2);padding:var(--esp-6);border:1px dashed var(--es-linha-forte);border-radius:var(--es-raio)}
/* newsletter por WhatsApp (bloco sc/newsletter → es-crm, newsletter: true) */
.news{display:grid;gap:var(--esp-5);align-items:center;padding:var(--esp-6) var(--esp-5);border-radius:var(--raio-xl);background:var(--es-painel);color:var(--es-bloco-texto);position:relative;overflow:hidden;isolation:isolate}
@media(min-width:900px){.news{grid-template-columns:1fr 1fr;padding:var(--esp-7);gap:var(--esp-7)}}
.news .rotulo{color:var(--es-destaque)}
.news h2{color:var(--es-bloco-texto);font-size:clamp(24px,2.8vw,34px);margin-top:10px}
.news .txt>p{color:var(--es-bloco-texto-2);margin-top:12px;font-size:var(--fs-lead)}
.news .condicoes{color:var(--es-bloco-texto-2)}
.news .form-lead{box-shadow:none;border-color:transparent}
.news-balao{margin-top:var(--esp-5);display:flex;gap:10px;align-items:flex-start;max-width:420px}
.news-balao .av{background:var(--es-wa-marca);color:var(--es-navy-fixo)}
.news-balao div{background:var(--es-bloco-vidro);border:1px solid var(--es-bloco-linha-2);border-radius:4px var(--raio-md) var(--raio-md);padding:10px 12px;font-size:13.5px;color:var(--es-bloco-texto-2);line-height:1.45}
.news-balao b{color:var(--es-bloco-texto)}
.news-art{margin-top:var(--esp-7);padding:var(--esp-5);border-radius:var(--es-raio);background:var(--es-suave);border:1px solid var(--es-linha)}
.news-art .rotulo{margin:0!important;color:var(--es-destaque)!important}
.news-art h2{font-size:22px!important;margin:6px 0 6px!important}
.news-art>p{margin:0 0 14px!important;font-size:15.5px;color:var(--es-texto-2)!important}
.news-art .form-lead{box-shadow:none;font-size:var(--fs-corpo);line-height:var(--lh)}
.news-art .form-lead p{margin:0}

/* ---- 6.4 artigo */
.hero-artigo .wp-block-post-title{font-size:clamp(30px,4.2vw,46px);font-weight:var(--peso-forte);letter-spacing:-.03em;line-height:1.08;margin-top:14px}
.hero-artigo .wp-block-post-excerpt__excerpt,.hero .wp-block-term-description p{font-size:18px;color:var(--es-texto-2);margin:16px 0 0;max-width:720px}
.hero-artigo .eyb-artigo{display:flex;gap:6px;flex-wrap:wrap;align-items:center;font-size:13.5px;color:var(--es-texto-3)}
.hero-artigo .eyb-artigo a{color:var(--es-destaque);font-weight:var(--peso-titulo);display:inline-block;padding-block:6px}
.capa-artigo{margin:32px auto 0;max-width:1000px;overflow:hidden;border-radius:var(--raio-xl)}
.capa-artigo img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--raio-xl);background:var(--es-suave)}
.art{display:grid;gap:48px;grid-template-columns:minmax(0,1fr)}
@media(min-width:1024px){.art{grid-template-columns:minmax(0,1fr) 300px;gap:64px}}
.texto{max-width:720px;font-size:18px;line-height:var(--lh-texto);color:var(--es-texto)}
.texto>*{max-width:720px}
.texto p{color:var(--es-texto);margin:0 0 20px}
.texto h2{font-size:clamp(24px,2.6vw,30px);margin:48px 0 14px}
.texto h3{font-size:var(--fs-2xl);margin:32px 0 10px}
.texto ul,.texto ol{padding-left:22px;margin:0 0 20px}
.texto li{margin-bottom:8px}
.texto a{color:var(--es-destaque);text-decoration:underline;text-underline-offset:3px}
.texto a.btn{text-decoration:none}
.texto strong{font-weight:var(--peso-titulo)}
.texto blockquote{margin:28px 0;padding:18px 22px;border-left:3px solid var(--es-destaque);background:var(--es-superficie);border-radius:0 var(--raio-md) var(--raio-md) 0;font-size:var(--fs-lead)}
.texto .em-resumo{background:var(--es-suave);border-radius:var(--es-raio);padding:20px 24px;margin:32px 0}
.texto .em-resumo h2{margin-top:0;font-size:20px}
.texto .em-resumo ul{margin:0}
.texto .banner-conv{border:1px solid var(--es-linha);border-radius:var(--es-raio);padding:22px 24px;margin:36px 0;background:var(--es-superficie)}
.texto .banner-conv p{margin:0 0 12px}
.fig-artigo{margin:36px 0}
.fig-artigo img{width:100%;border-radius:var(--es-raio)}
.fig-artigo figcaption{margin-top:10px;font-size:var(--fs-peq);color:var(--es-texto-3);text-align:center}
.lado{display:grid;gap:var(--esp-4);align-content:start;position:sticky;top:92px}
.lado .box h2{font-size:var(--fs-peq);font-weight:var(--peso-titulo);margin:0 0 10px;letter-spacing:0}
.lado .box p{font-size:14.5px}
.lado .box .btn{margin-top:14px;min-height:var(--alvo);font-size:14.5px;width:100%}
.compartilhar{display:flex;gap:var(--esp-2);flex-wrap:wrap}
.compartilhar .btn{min-height:var(--alvo);padding:0 16px;font-size:14.5px;width:auto;margin:0}
.lado .compartilhar .btn{width:auto;margin:0}
.box.cta-lado{background:var(--es-suave);border-color:transparent}
.indice a{display:block;padding:6px 0 6px 12px;font-size:14.5px;color:var(--es-texto-2);line-height:1.4;border-left:2px solid var(--es-linha)}
.indice a:hover{color:var(--es-destaque)}
.indice a.on{border-left-color:var(--es-destaque);font-weight:var(--peso-medio)}
.indice-celular{display:none}
@media(max-width:1023px){
 .indice-celular{display:block;margin:0 0 28px;background:var(--es-superficie);border:1px solid var(--es-linha);border-radius:var(--raio-md);padding:0 18px}
 .indice-celular summary{cursor:pointer;list-style:none;min-height:var(--alvo-g);padding:12px 0;font-weight:var(--peso-titulo);font-size:15px;display:flex;justify-content:space-between;align-items:center}
 .indice-celular summary::-webkit-details-marker{display:none}
 .indice-celular summary:after{content:"+";color:var(--es-destaque);font-size:20px;transition:transform var(--es-dur-2,.3s) var(--es-ease,ease)}
 .indice-celular[open] summary:after{transform:rotate(45deg)}
 .indice-celular a{display:block;padding:11px 0;border-top:1px solid var(--es-linha);font-size:15px;line-height:1.4;color:var(--es-texto-2);text-decoration:none!important}
 .lado .indice{display:none}
 .lado{position:static}
}
/* autoria, perguntas e "continue aprendendo" (es-editorial) */
.assinatura{display:flex;align-items:center;gap:12px;margin-top:22px}
.assinatura img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.assinatura .nome{color:var(--es-texto);font-weight:var(--peso-titulo);font-size:15px}
.assinatura .meta-artigo{margin:2px 0 0}
.caixa-autor{display:grid;grid-template-columns:96px 1fr;gap:20px;align-items:start;margin:48px 0 0;padding:var(--esp-5);border-radius:var(--es-raio);background:var(--es-superficie);border:1px solid var(--es-linha)}
.caixa-autor img{width:96px;height:96px;border-radius:50%;object-fit:cover}
.caixa-autor .eyb{font-size:12px;font-weight:var(--peso-titulo);letter-spacing:.08em;text-transform:uppercase;color:var(--es-destaque)}
.caixa-autor h2{font-size:22px;margin:4px 0 8px}
.caixa-autor h2 a{text-decoration:none;color:var(--es-texto)}
.caixa-autor p{font-size:15.5px;margin:0 0 10px;color:var(--es-texto-2);line-height:1.6}
.caixa-autor .como-feito{font-size:13.5px;color:var(--es-texto-3);border-top:1px solid var(--es-linha);padding-top:12px;margin:12px 0 0}
@media(max-width:640px){.caixa-autor{grid-template-columns:1fr}.caixa-autor img{width:72px;height:72px}}
.autor-perfil img{width:128px;height:128px;border-radius:50%;object-fit:cover;margin:0 0 16px;border:4px solid var(--es-fundo)}
.autor-perfil h1{font-size:var(--fs-h1);font-weight:var(--peso-forte);letter-spacing:-.03em}
.autor-perfil p{font-size:var(--fs-lead);margin-top:12px;max-width:680px}
.perfis-autor{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 6px}
.perfis-autor a{display:inline-flex;align-items:center;justify-content:center;width:var(--alvo);height:var(--alvo);border-radius:50%;border:1px solid var(--es-linha);color:var(--es-destaque);background:var(--es-fundo);text-decoration:none!important}
.perfis-autor a:hover{background:var(--es-primaria);border-color:var(--es-primaria);color:var(--es-primaria-texto)}
.faq-artigo{margin-top:48px}
.faq-artigo h2{font-size:24px;margin:0 0 8px}
.faq-artigo .pergunta{padding:16px 0;border-top:1px solid var(--es-linha)}
.faq-artigo h3{font-size:var(--fs-h3);margin:0 0 6px}
.faq-artigo p{margin:0}
.continue-trilha{margin-top:40px;padding:22px 26px;border-radius:var(--es-raio);background:var(--es-suave)}
.continue-trilha h2{font-size:20px;margin:0 0 12px}
.continue-trilha ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.continue-trilha li{margin:0}
.continue-trilha a{color:var(--es-destaque);font-weight:var(--peso-titulo);text-decoration:none;display:inline-block;padding-block:6px}
.continue-trilha a:hover{text-decoration:underline}
.continue-trilha .trilha{margin-top:4px;padding-top:10px;border-top:1px solid var(--es-linha)}
/* posts do gerador (es-conteudo) */
.eib-info{margin:32px 0;padding:28px;border-radius:var(--raio-xl);background:var(--es-painel);color:var(--es-bloco-texto)}
.eib-info-cab{display:flex;flex-direction:column;gap:4px;margin-bottom:20px}
.eib-info-cab .eyb{color:var(--es-destaque);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.eib-info-cab strong{font-size:22px;line-height:1.25}
.eib-info-cab>span:last-child{color:var(--es-bloco-texto-2);font-size:15px}
.eib-info-itens{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--esp-3)}
.eib-info-itens li{background:var(--es-bloco-vidro);border:1px solid var(--es-bloco-linha-2);border-radius:var(--es-raio);padding:16px;display:flex;flex-direction:column;gap:4px}
.eib-info-itens b{font-size:30px;line-height:1.1;font-weight:var(--peso-forte);color:var(--es-destaque);font-variant-numeric:tabular-nums}
.eib-info-itens span{font-weight:var(--peso-titulo);color:var(--es-bloco-texto)}
.eib-info-itens small{color:var(--es-bloco-texto-2);font-size:13px}
.eib-info .eib-source{color:var(--es-bloco-texto-3);margin:16px 0 0}
.eib-fontes{font-size:14.5px;padding-left:20px}
.eib-fontes li{margin:6px 0;color:var(--es-texto-2)}
.eib-fontes a{color:var(--es-destaque);text-decoration:underline}

/* ---- 6.5 ferramentas (calculadora e gerador de link) */
.calc,.gerador{display:grid;gap:20px;align-items:start;grid-template-columns:minmax(0,1fr)}
.calc>*,.gerador>*{min-width:0}
@media(min-width:960px){.calc,.gerador{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}
.calc-campos{display:grid;gap:14px;background:var(--es-superficie);border:1px solid var(--es-linha);border-radius:var(--es-raio);padding:var(--esp-5)}
.calc-campos label{display:grid;gap:6px;font-size:14.5px;font-weight:var(--peso-medio);color:var(--es-texto)}
.calc-campos small{font-weight:400;color:var(--es-texto-3)}
.calc-campos input{font-variant-numeric:tabular-nums}
.calc-resultado{border:1px solid var(--es-linha);border-radius:var(--es-raio);padding:var(--esp-5);background:var(--es-fundo);box-shadow:var(--es-sombra)}
@media(min-width:960px){.calc-resultado{position:sticky;top:96px}}
.calc-resultado .kpi{font-size:clamp(36px,4.4vw,52px);line-height:1;margin:10px 0 6px;transition:color var(--es-dur-2,.3s)}
.calc-resultado .kpi.mudou{animation:sc-pulsa var(--es-dur-2,.3s) var(--es-ease-mola,ease)}
.calc-sub{font-size:14.5px}
.calc-comparacao{margin-top:12px;font-size:15px;color:var(--es-texto)}
.calc-comparacao b{font-variant-numeric:tabular-nums}
.calc .tabela-rolagem table{min-width:0;font-size:14px}
.calc-barras{list-style:none;margin:18px 0 6px;padding:0;display:grid;gap:10px}
.calc-barras li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;font-size:13.5px;color:var(--es-texto-2)}
.calc-barras li b{font-variant-numeric:tabular-nums;color:var(--es-texto);font-weight:var(--peso-titulo)}
.calc-barras i{grid-column:1/-1;height:8px;border-radius:var(--raio-pilula);background:var(--es-superficie-2);overflow:hidden}
.calc-barras i:after{content:"";display:block;height:100%;border-radius:inherit;background:var(--c,var(--es-primaria));transform:scaleX(var(--f,0));transform-origin:0 50%;transition:transform var(--es-dur-3) var(--es-ease-mola)}
.calc-barras li:nth-child(2){--c:var(--es-cat-2)}.calc-barras li:nth-child(3){--c:var(--es-cat-3)}.calc-barras li:nth-child(4){--c:var(--es-cat-4)}
.link-gerado{margin-top:10px;padding:14px;border-radius:var(--raio-md);background:var(--es-superficie);font-weight:var(--peso-medio);color:var(--es-texto);word-break:break-all;font-variant-numeric:tabular-nums;transition:background-color var(--es-dur-2)}
.link-gerado.pronto{background:var(--es-suave);color:var(--es-destaque)}
.link-gerado.mudou{animation:sc-pulsa var(--es-dur-2) var(--es-ease-mola)}
[data-gl-copiar].copiado{background:var(--es-sucesso);border-color:var(--es-sucesso);animation:sc-pulsa var(--es-dur-2) var(--es-ease-mola)}
/* prévia de como o cliente vê a mensagem */
.gl-previa{margin-top:18px;border-radius:var(--raio-xl);border:1px solid var(--es-linha);overflow:hidden;background:var(--es-fundo-chat)}
.gl-previa .cab-chat{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--es-bloco);color:var(--es-bloco-texto)}
.gl-previa .cab-chat b{display:block;font-size:13px;color:var(--es-bloco-texto)}
.gl-previa .cab-chat small{display:block;font-size:11px;color:var(--es-bloco-texto-3)}
.gl-previa .av{background:var(--es-wa-marca);color:var(--es-navy-fixo)}
.gl-previa .corpo{padding:18px 14px 20px;display:flex;flex-direction:column;align-items:flex-end;min-height:120px;justify-content:flex-end}
.gl-previa .balao{max-width:88%;padding:9px 12px 6px;border-radius:var(--raio-md) 4px var(--raio-md) var(--raio-md);background:var(--es-suave);color:var(--es-texto);font-size:14px;line-height:1.45;white-space:pre-wrap;word-break:break-word}
.gl-previa .balao small{display:block;text-align:right;font-size:10.5px;color:var(--es-texto-3);margin-top:2px}
.gl-previa .balao.mudou{animation:sc-entra var(--es-dur-2) var(--es-ease-mola)}
.gl-previa .dica{align-self:center;font-size:11px;color:var(--es-texto-3);margin-bottom:10px}
@media(max-width:560px){.calc th:nth-child(3),.calc td:nth-child(3){display:none}.calc-resultado{padding:18px}.calc-campos{padding:18px}}

/* ---- 6.6 institucionais e 404 */
.conteudo-pagina{max-width:760px;font-size:var(--fs-lead);line-height:var(--lh-texto)}
.conteudo-pagina h2{font-size:24px;margin:40px 0 12px}
.conteudo-pagina h3{font-size:var(--fs-xl);margin:28px 0 8px}
.conteudo-pagina p{margin:0 0 16px;color:var(--es-texto-2)}
.conteudo-pagina ul{padding-left:22px;color:var(--es-texto-2)}
.conteudo-pagina a{color:var(--es-destaque);text-decoration:underline}
.erro-404{text-align:center}
.chat-404{max-width:520px;margin:32px auto 0;display:flex;flex-direction:column;gap:10px;text-align:left}
.chat-404 .msg{max-width:88%;font-size:15px;padding:11px 14px}
.chat-404 .msg.ia{align-self:flex-start;border-radius:4px var(--raio-md) var(--raio-md);border-left:3px solid var(--es-sucesso)}
.chat-404 .msg.cli{align-self:flex-end;background:var(--es-suave);border-color:transparent;border-radius:var(--raio-md) 4px var(--raio-md) var(--raio-md)}
.chat-404 .respostas{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.chat-404 .respostas a{min-height:var(--alvo);display:inline-flex;align-items:center;padding:0 16px;border-radius:var(--raio-pilula);border:1px solid var(--es-destaque);color:var(--es-destaque);font-weight:var(--peso-titulo);font-size:14.5px;background:var(--es-fundo);transition:background-color var(--es-dur-1),color var(--es-dur-1),transform var(--es-dur-1)}
.chat-404 .respostas a:hover{background:var(--es-primaria);color:var(--es-primaria-texto)}
.chat-404 .respostas a:active{transform:scale(.96)}
.chat-404>*{animation:es-surge var(--es-dur-3) var(--es-ease) both}
.chat-404>:nth-child(2){animation-delay:.9s}.chat-404>:nth-child(3){animation-delay:1.6s}.chat-404>:nth-child(4){animation-delay:2.1s}

/* ---- 6.7 SmartHub: mega-menu, catálogo de serviços, portfólio, mockups dos painéis */
@media(min-width:1024px){.menu-sub.mega .painel{width:min(820px,calc(100vw - 2*var(--gutter)));grid-template-columns:repeat(3,1fr)}}
.grade.servicos{display:grid;gap:var(--esp-4);grid-template-columns:1fr}
@media(min-width:700px){.grade.servicos{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.grade.servicos{grid-template-columns:repeat(4,1fr)}}
.grade.servicos .card{display:flex;flex-direction:column;gap:var(--esp-2)}
.grade.servicos h3 a{color:inherit;text-decoration:none}
.grade.servicos h3 a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.grade.servicos .card{position:relative}
.grade.servicos .filhas{list-style:none;margin:auto 0 0;padding:var(--esp-3) 0 0;border-top:1px solid var(--es-linha);display:flex;flex-direction:column;gap:6px;position:relative;z-index:1}
.grade.servicos .filhas a{font-size:var(--fs-peq);color:var(--es-destaque);text-decoration:none;font-weight:var(--peso-medio)}
.grade.servicos .filhas a:hover{text-decoration:underline}
.portfolio{list-style:none;margin:0;padding:0;display:grid;gap:var(--esp-5);grid-template-columns:1fr}
@media(min-width:900px){.portfolio{grid-template-columns:repeat(2,1fr)}}
.portfolio .caso{border:1px solid var(--es-linha);border-radius:var(--raio-xl);overflow:hidden;background:var(--es-fundo);display:flex;flex-direction:column}
.portfolio .quadro{aspect-ratio:16/10;background:var(--es-superficie);border-bottom:1px solid var(--es-linha);overflow:hidden}
.portfolio .quadro img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.portfolio .corpo{padding:var(--esp-5);display:flex;flex-direction:column;gap:var(--esp-2);flex:1}
.portfolio .corpo h3{margin:0}
.portfolio .corpo>p:not(.rotulo){margin:0;color:var(--es-texto-2)}
.portfolio .chips{display:flex;flex-wrap:wrap;gap:6px;margin:var(--esp-2) 0}
.portfolio .btn.ac{align-self:flex-start;margin-top:auto}
.v-busca{display:flex;align-items:center;gap:10px;border:1px solid var(--es-linha);border-radius:var(--raio-pilula);padding:10px 16px;background:var(--es-fundo);font-size:var(--fs-peq)}
.v-busca .ic{width:22px;height:22px}
.v-anuncio{margin-top:12px;border:1px solid var(--es-linha);border-radius:var(--raio-md);padding:14px 16px;background:var(--es-fundo);display:flex;flex-direction:column;gap:4px}
.v-anuncio small{font-size:11px;color:var(--es-texto-3)}
.v-anuncio b{color:var(--es-destaque);font-size:16px}
.v-anuncio span{font-size:var(--fs-peq);color:var(--es-texto-2)}
.v-nota{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--es-linha);border-radius:var(--raio-md);padding:12px 16px;background:var(--es-fundo);margin-bottom:8px}
.v-nota b{font-size:22px;font-weight:var(--peso-forte);color:var(--es-sucesso);font-variant-numeric:tabular-nums}
.v-lp{border:1px solid var(--es-linha);border-radius:var(--raio-md);padding:20px;background:var(--es-fundo);display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.v-lp b{font-size:18px;line-height:1.2}
.v-lp span{font-size:var(--fs-peq);color:var(--es-texto-2)}
.v-lp i{display:block;height:10px;width:100%;border-radius:6px;background:var(--es-superficie-2)}
.v-lp i+i{width:70%}
.v-lp em{font-style:normal;background:var(--es-primaria);color:var(--es-primaria-texto);border-radius:var(--raio-pilula);padding:8px 16px;font-size:var(--fs-peq);font-weight:var(--peso-titulo)}
/* .resposta-curta só agrupa: o visual (filete azul, fundo) é o da .resposta (6.1) */
.resposta-curta{max-width:72ch}
.resposta-curta .resposta{max-width:none}
.hero.centro .resposta-curta{margin-inline:auto;text-align:left}
.texto-longo{max-width:72ch}
.texto-longo h2{margin-top:var(--esp-7)}
.texto-longo h2:first-child{margin-top:0}
.texto-longo h3{margin-top:var(--esp-5)}
.tabela-simples{width:100%;border-collapse:collapse;font-size:var(--fs-peq);margin:var(--esp-4) 0}
.tabela-simples th,.tabela-simples td{border-bottom:1px solid var(--es-linha);padding:10px 12px;text-align:left;vertical-align:top}
.tabela-simples th{background:var(--es-superficie);font-weight:var(--peso-titulo)}

/* ============================================================ 07 Motion */
/* Entrada ao rolar, cascata, surge do hero, lift, brilho, contadores, barra de
   leitura e transição entre páginas vêm do es-ui. Aqui só o que é deste site.
   Tudo em opacity/transform/clip-path (sem CLS) e nada esconde o LCP. Quem pede
   menos movimento vê tudo parado e visível (bloco no fim). */
@keyframes sc-respira{to{transform:translate(-60px,40px) scale(1.12)}}
@keyframes sc-pulsa{50%{transform:scale(1.045)}}
@keyframes sc-flutua{50%{transform:translateY(-7px)}}
@keyframes sc-gira{to{transform:rotate(360deg)}}
@keyframes sc-ponto{0%,60%,100%{transform:none;opacity:.4}30%{transform:translateY(-3px);opacity:1}}
@keyframes sc-risca{from{transform:scaleX(0)}}
@keyframes sc-reflexo{to{transform:translateX(100%)}}
@keyframes sc-marquee{to{transform:translateX(calc(-50% - var(--esp-3) / 2))}}
@keyframes sc-prog{to{transform:scaleX(1)}}
@keyframes sc-entra{from{opacity:0;transform:translateY(6px) scale(.97)}}
@keyframes sc-anel{0%{opacity:.8;transform:scale(.9)}100%{opacity:0;transform:scale(1.5)}}

/* 7.1 títulos de seção: revelação por máscara quando o bloco [data-rev] entra */
[data-rev] h2,[data-rev]>.rotulo,[data-rev]>div>.rotulo{transition:clip-path var(--es-dur-3) var(--es-ease),transform var(--es-dur-3) var(--es-ease);transition-delay:calc(var(--i,0) * var(--es-cascata,70ms) + 80ms)}
[data-rev].escondido h2{clip-path:inset(0 0 100% 0);transform:translateY(.45em)}
[data-rev].escondido>.rotulo,[data-rev].escondido>div>.rotulo{clip-path:inset(0 100% 0 0)}
.texto>[data-rev]{transition-duration:var(--es-dur-3)}

/* 7.2 cena viva do hero: html.js (posto no <head>) já esconde as etapas antes da
   primeira pintura, sem piscar o estado final; o site.js liga cada [data-passo]
   na hora dele. Sem JS ou com menos movimento, fica o estado final. */
.cena [data-passo]{transition:opacity var(--es-dur-2) var(--es-ease),transform var(--es-dur-3) var(--es-ease-mola)}
@media(prefers-reduced-motion:no-preference){
 .js .cena [data-passo]:not(.on){opacity:0;transform:translateY(10px) scale(.97)}
 .js .cena .flutua[data-passo]:not(.on){transform:translateY(14px) scale(.92)}
 .js .cena .msg.ia:not(:has(.corpo.on)):before{opacity:0;transform:scale(.25)}
 .js .cena .msg.ia.on:not(:has(.corpo.on)) .pontos{opacity:1}
 .js .cena .corpo[data-passo]:not(.on){transform:none}
}
.cena.viva .cena-venda.on .ok:after{animation:sc-anel 1.2s var(--es-ease) .1s 2}
.cena.saindo [data-passo]{opacity:0!important;transition-duration:var(--es-dur-3)!important}
.cena-oficial{animation:sc-flutua 7s ease-in-out 1s infinite}
.cena-brilho{animation:sc-respira 16s ease-in-out infinite alternate}

/* 7.3 mockups em loop (kanban e painel das LPs) */
/* kanban: o lead novo passa para "Em conversa" e ocupa a vaga tracejada, ciclo de 9 s */
@keyframes sc-move{0%,26%{transform:none;box-shadow:none;opacity:1}
 34%{transform:translate(calc(50% + 5px),-6px) rotate(2deg);box-shadow:var(--es-sombra-forte)}
 44%,82%{transform:translateX(calc(100% + 10px));box-shadow:none;opacity:1}
 88%{transform:translateX(calc(100% + 10px));opacity:0}
 89%{transform:none;opacity:0}
 96%,100%{transform:none;opacity:1}}
.anima .cartao.move{animation:sc-move 9s var(--es-ease,ease) infinite;z-index:2}
/* painel: barras respirando */
@keyframes sc-barra{from{transform:scaleY(.72)}to{transform:none}}
.anima .barras i{animation:sc-barra 2.6s ease-in-out infinite alternate}
.anima .barras i:nth-child(2){animation-delay:.2s}.anima .barras i:nth-child(3){animation-delay:.4s}
.anima .barras i:nth-child(4){animation-delay:.6s}.anima .barras i:nth-child(5){animation-delay:.8s}
.anima .barras i:nth-child(6){animation-delay:1s}.anima .barras i:nth-child(7){animation-delay:1.2s}
/* canais: cada canal pisca e a conversa dele acende na caixa única, ciclo de 8 s */
@keyframes sc-canal{0%,100%{transform:none;box-shadow:none}6%{transform:translateX(4px);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 22%,transparent)}14%{transform:none;box-shadow:none}}
@keyframes sc-fio{0%,100%{transform:scaleX(.2);opacity:.3}8%{transform:scaleX(1);opacity:1}16%{transform:scaleX(.2);opacity:.3}}
@keyframes sc-chega{0%,100%{background:var(--es-superficie)}9%,16%{background:var(--es-suave)}}
.anima .canal{animation:sc-canal 8s var(--es-ease) infinite}
.anima .canal:after{animation:sc-fio 8s var(--es-ease) infinite}
.anima .caixa-unica .conv{animation:sc-chega 8s var(--es-ease) infinite}
.anima .canal.c2,.anima .canal.c2:after,.anima .caixa-unica .conv:nth-of-type(2){animation-delay:2s}
.anima .canal.c3,.anima .canal.c3:after,.anima .caixa-unica .conv:nth-of-type(3){animation-delay:4s}
.anima .canal.c4,.anima .canal.c4:after,.anima .caixa-unica .conv:nth-of-type(4){animation-delay:6s}

/* 7.4 painéis .recurso: o mockup monta em cascata (mensagens chegando), o balão
   entra com mola; no desktop a tela inclina com o ponteiro e o cartão de trás
   anda um pouco com a rolagem (site.js: --rx/--ry na tela, --pp no palco) */
.recurso .tela>*{transition:opacity var(--es-dur-3) var(--es-ease),transform var(--es-dur-3) var(--es-ease-mola);transition-delay:calc(var(--k,0) * 120ms + 260ms)}
.recurso .tela>:nth-child(2){--k:1}.recurso .tela>:nth-child(3){--k:2}.recurso .tela>:nth-child(4){--k:3}.recurso .tela>:nth-child(5){--k:4}
.recurso.escondido .tela>*{opacity:0;transform:translateY(14px) scale(.98)}
.recurso .palco>.balao{transition:opacity var(--es-dur-2) var(--es-ease) .75s,transform .8s var(--es-ease-mola) .75s}
.recurso.escondido .palco>.balao{opacity:0;transform:translateY(18px) scale(.7)}
.recurso .tela.segue{transition:transform .25s var(--es-ease)}

/* 7.5 parallax leve das fotos (site.js, só telas largas): a imagem sobra 8% */
[data-parallax]{transform:translate3d(0,var(--py,0px),0) scale(1.08);will-change:transform}

@media(prefers-reduced-motion:reduce){
 .anima .cartao.move,.anima .barras i,.anima .canal,.anima .canal:after,.anima .caixa-unica .conv,.hero:after,.cta-final .banner:before,.cta-final .btn:after,
 .cena-oficial,.cena-brilho,.marquee-trilho,.recurso .tela>*,.form-sec .form-lead:before,.preco:before,.monte-resumo:before,.hero h1 .enfase:after{animation:none!important}
 [data-rev].escondido h2,[data-rev].escondido>.rotulo,[data-rev].escondido>div>.rotulo{clip-path:none;transform:none}
 .compara .escondido li{opacity:1;transform:none}
 .marquee{-webkit-mask-image:none;mask-image:none;margin-inline:0}
 .marquee-trilho{width:auto}
 .marquee-trilho .clientes{flex-wrap:wrap;justify-content:center}
 .marquee-trilho .clientes[aria-hidden]{display:none}
 [data-parallax]{transform:none}
 .recurso.escondido .tela>*,.recurso.escondido .palco>.balao{opacity:1;transform:none}
 .tela{transform:rotate(var(--rz,1.2deg))}
 .palco:before{transform:rotate(var(--pr,-2deg))}
 .chat-404>*{animation:none}
}

/* ============================================================ 08 Utilitários */
.wp-site-blocks{padding:0}
.wp-site-blocks>*+*{margin-block-start:0}
.wp-block-group{margin-block:0}
.centro-txt{text-align:center}
/* es-ui: pular para o conteúdo, barra de leitura e WhatsApp com os tokens do site */
.es-progresso{background:linear-gradient(90deg,var(--es-primaria),var(--es-destaque-2))}
.es-wa{font-family:inherit}
@media(max-width:640px){.rodape{padding-bottom:88px}}
