/* gerado por moldes/la-por-que/escopar.cjs a partir do CSS da referência (site.linkaffiliattes.com/por-que-link-affiliattes, 11/11/2026) — não editar à mão; ajuste vai em acabamento.css */

/* ---- la.css ---- */
/* Link Affiliattes — LP de recrutamento de parceiros. Mobile-first; o celular copia a composição do computador. */

.mx-la{
  --bg:#000;--bg2:#0c0e11;--card:#101317;--card2:#14181d;
  --line:rgba(255,255,255,.09);--line2:rgba(255,255,255,.16);
  --tx:#f4f5f7;--mut:#a3abb5;--dim:#8a939e;
  --red:#2a4ae8;--red-d:#1f3bc4;--red-hi:#5b7bff;--ok:#35d07f;
  --r:24px;
  --ease:cubic-bezier(.22,1,.36,1);
  --shell:1200px;
  --pad:clamp(16px,4vw,32px);
  --sec:clamp(44px,6.5vw,96px);
  --f-h1:clamp(2.4rem,1.2rem + 6vw,5.6rem);
  --f-h2:clamp(1.85rem,1.2rem + 3vw,4rem);
}
.mx-la *:where(:not(.mx-ferramenta *)), .mx-la *:where(:not(.mx-ferramenta *))::before, .mx-la *:where(:not(.mx-ferramenta *))::after{box-sizing:border-box}
.mx-la{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
.mx-la{position:relative;margin:0;background:var(--bg);color:var(--tx);font:400 1rem/1.55 "Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
/* um fundo só, de ponta a ponta: preto puro (o mesmo do planeta da hero) com um grão que nunca para numa borda de seção.
   Fica na camada de baixo da raiz (z-index -1): por cima do fundo e dos brilhos de encontro (.enc), por baixo de todo conteúdo.
   Nenhuma seção pinta fundo próprio de ponta a ponta (18/10/2026: "não pode ser cinza o fundo das páginas"). */
.mx-la:where(:not(.mx-ferramenta *))::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.03;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E")}
.mx-la img:where(:not(.mx-ferramenta *)), .mx-la svg:where(:not(.mx-ferramenta *)), .mx-la canvas:where(:not(.mx-ferramenta *)){display:block;max-width:100%}
.mx-la a:where(:not(.mx-ferramenta *)){color:inherit;text-decoration:none}
.mx-la button:where(:not(.mx-ferramenta *)){font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.mx-la h1:where(:not(.mx-ferramenta *)), .mx-la h2:where(:not(.mx-ferramenta *)), .mx-la h3:where(:not(.mx-ferramenta *)), .mx-la h4:where(:not(.mx-ferramenta *)), .mx-la p:where(:not(.mx-ferramenta *)), .mx-la ul:where(:not(.mx-ferramenta *)), .mx-la ol:where(:not(.mx-ferramenta *)){margin:0;padding:0}
.mx-la ul:where(:not(.mx-ferramenta *)), .mx-la ol:where(:not(.mx-ferramenta *)){list-style:none}
.mx-la em:where(:not(.mx-ferramenta *)){font-style:normal}
.mx-la :focus-visible:where(:not(.mx-ferramenta *)){outline:2px solid var(--red-hi);outline-offset:3px;border-radius:8px}
.mx-la .ic:where(:not(.mx-ferramenta *)){width:1.15em;height:1.15em;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.mx-la .skip:where(:not(.mx-ferramenta *)){position:absolute;left:-999px;top:8px;z-index:100;background:#fff;color:#000;padding:10px 14px;border-radius:10px}
.mx-la .skip:focus:where(:not(.mx-ferramenta *)){left:8px}
.mx-la .la-wrap:where(:not(.mx-ferramenta *)){width:min(100% - var(--pad)*2,var(--shell));margin-inline:auto}

/* ---------- botões (luz = fundo animado, nunca caixa) ---------- */
.mx-la .btn:where(:not(.mx-ferramenta *)){position:relative;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:46px;padding:0 1.35em;border-radius:999px;font-weight:600;font-size:1rem;letter-spacing:-.01em;color:#fff;
  background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.3) 50%,transparent 62%) 160% 0/260% 100% no-repeat,linear-gradient(180deg,#2b4ef0,var(--red) 55%,var(--red-d));
  box-shadow:0 0 0 1px rgba(255,255,255,.12) inset,0 10px 24px -10px rgba(0,0,0,.7);
  transition:transform .18s var(--ease),background-position .7s var(--ease),box-shadow .3s}
.mx-la .btn:active:where(:not(.mx-ferramenta *)){transform:scale(.98)}
.mx-la .btn .ic:where(:not(.mx-ferramenta *)){transition:transform .25s var(--ease)}
.mx-la .btn-sm:where(:not(.mx-ferramenta *)){min-height:44px;padding:0 1.1em;font-size:.95rem}
.mx-la .btn-lg:where(:not(.mx-ferramenta *)){min-height:56px;padding:0 1.7em;font-size:1.05rem}
.mx-la .btn-ghost:where(:not(.mx-ferramenta *)){background:rgba(255,255,255,.06);box-shadow:0 0 0 1px var(--line2) inset}
.mx-la .link-more:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;gap:.5em;min-height:44px;font-weight:600;color:var(--tx)}
.mx-la .link-more .ic:where(:not(.mx-ferramenta *)){transition:transform .25s var(--ease);color:var(--red-hi)}
@media (hover:hover) and (pointer:fine){
  .mx-la .btn:hover:where(:not(.mx-ferramenta *)){background-position:-60% 0,0 0;box-shadow:0 0 0 1px rgba(255,255,255,.18) inset,0 14px 30px -10px rgba(0,0,0,.8)}
  .mx-la .btn:hover .ic:where(:not(.mx-ferramenta *)), .mx-la .link-more:hover .ic:where(:not(.mx-ferramenta *)){transform:translateX(4px)}
  .mx-la .btn-ghost:hover:where(:not(.mx-ferramenta *)){background-color:rgba(255,255,255,.1)}
}

/* ---------- botão neon: o "Abrir conta" da Kesef/BlackCat no vermelho da marca (27/10/2026) ----------
   Corpo d93224 → c8271b → a41d14 (matiz 4,2°, a de --red): atrás do texto o branco dá 5,36:1 parado e 4,72:1 no pior quadro
   da luz que passa (fundo animado, rgb 255 214 205 a 11%), medido em 390 e 1440 px na hero e na barra (27/10/2026); o topo
   mais claro do degradê fica acima da linha do texto. O hover cresce o brilho e não clareia.
   Aro de luz (27/10/2026, pedido do Victor: o "brilho que vai passando devagarzinho" do selo "Cadastro de parceiros" nos botões
   de criar conta): o cônico do .selo, girando a cada 4 s, corre a borda de 1px de todo botão de cadastro; o vidro (entrar)
   fica sem, para o olho ir ao cadastro. Sobre a borda rosada do neon o núcleo de um ponto só sumia (no selo a borda é escura):
   aqui o branco ocupa 4% da volta e a cauda começa em 50%, medido ampliado em 3x (27/10/2026). Camadas, de cima para baixo: a
   luz que varre, o corpo (só por dentro da borda), o aro (na borda) e a borda de base, 28% de branco já composto sobre o corpo.
   Com "menos movimento" o aro fica parado. */
.mx-la .btn-neon:where(:not(.mx-ferramenta *)){position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:5px 5px 5px 18px;border:1px solid transparent;border-radius:100px;font-size:15px;font-weight:500;line-height:1;letter-spacing:-.01em;white-space:nowrap;color:#fff;
  background-color:var(--red);
  background-image:linear-gradient(105deg,transparent 0%,transparent 40%,rgba(205,214,255,.11) 50%,transparent 60%,transparent 100%),linear-gradient(180deg,#2a4ae8 0%,#2545d8 45%,#142ea4 100%),conic-gradient(from var(--sa),transparent 0 50%,rgba(205,214,255,.5) 64%,rgba(234,238,255,.95) 73%,#fff 76% 80%,rgba(234,238,255,.95) 83%,transparent 95%),linear-gradient(180deg,#5f7cf0 0%,#5a73e0 45%,#5669bd 100%);
  background-origin:border-box;background-clip:border-box,padding-box,border-box,border-box;background-repeat:no-repeat;background-size:250% 100%,100% 100%,100% 100%,100% 100%;background-position:130% 0,0 0,0 0,0 0;
  box-shadow:0 0 75px rgba(48,86,255,.2),0 0 42px rgba(48,86,255,.22),0 0 20px rgba(48,86,255,.28),0 0 6px rgba(48,86,255,.45),0 2px 8px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.7),inset 0 0 6px rgba(205,214,255,.42),inset 0 -2px 3px rgba(0,6,40,.28);
  animation:la-luz 5.5s cubic-bezier(.45,0,.25,1) 1.6s infinite,selo 4s linear infinite;
  transition:transform .18s var(--ease),box-shadow .3s ease}
/* fora da tela (la.js): a luz e o aro param */
.mx-la .btn-neon.pausa:where(:not(.mx-ferramenta *)){animation-play-state:paused}
.mx-la .btn-neon>span:first-child:where(:not(.mx-ferramenta *)){color:inherit}
.mx-la .cta-seta:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border-radius:50%;background:#03061a;color:var(--red-hi)}
.mx-la .cta-seta svg:where(:not(.mx-ferramenta *)){width:18px;height:18px}
/* fora da hero (barra): círculo de 32px = 44px de altura */
.mx-la .btn-neon-sm:where(:not(.mx-ferramenta *)){font-size:14px;gap:8px;padding:5px 5px 5px 16px}
.mx-la .btn-neon-sm .cta-seta:where(:not(.mx-ferramenta *)){width:32px;height:32px}
.mx-la .btn-neon-sm .cta-seta svg:where(:not(.mx-ferramenta *)){width:17px;height:17px}
@keyframes la-luz{0%{background-position:130% 0,0 0,0 0,0 0}38%,100%{background-position:-30% 0,0 0,0 0,0 0}}
.mx-la .btn-neon:focus-visible:where(:not(.mx-ferramenta *)){outline:2px solid var(--red-hi);outline-offset:3px;border-radius:100px}
@media (hover:hover) and (pointer:fine){
  .mx-la .btn-neon:hover:where(:not(.mx-ferramenta *)){transform:translateY(-1px);box-shadow:0 0 90px rgba(48,86,255,.28),0 0 50px rgba(48,86,255,.3),0 0 24px rgba(48,86,255,.36),0 0 8px rgba(48,86,255,.55),0 4px 12px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.7),inset 0 0 6px rgba(205,214,255,.42),inset 0 -2px 3px rgba(0,6,40,.28)}
}
.mx-la .btn-neon:active:where(:not(.mx-ferramenta *)){transform:scale(.98)}
@media (prefers-reduced-motion:reduce){
  /* luz parada fora do botão e aro parado; sem deslocamento no hover */
  .mx-la .btn-neon:where(:not(.mx-ferramenta *)){animation:none;background-position:130% 0,0 0,0 0,0 0}
  .mx-la .btn-neon:hover:where(:not(.mx-ferramenta *)){transform:none}
}

/* ---------- navbar (cápsula flutuante) ---------- */
.mx-la .nav-wrap:where(:not(.mx-ferramenta *)){position:fixed;inset:12px 0 auto;z-index:50;display:flex;flex-direction:column;align-items:center;gap:8px;padding-inline:clamp(12px,2.4vw,40px);pointer-events:none}
.mx-la .nav:where(:not(.mx-ferramenta *)){pointer-events:auto;width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px;padding:8px 10px 8px 18px;border-radius:999px;background:transparent;box-shadow:none;transition:background-color .3s,box-shadow .3s}
.mx-la .nav-wrap.scrolled .nav:where(:not(.mx-ferramenta *)){width:min(100%,1120px);background:rgba(14,16,19,.72);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);box-shadow:0 0 0 1px var(--line) inset,0 12px 40px -12px rgba(0,0,0,.7)}
.mx-la .nav-logo:where(:not(.mx-ferramenta *)){display:inline-flex}
.mx-la .nav-logo img:where(:not(.mx-ferramenta *)){height:auto;width:clamp(112px,34vw,148px)}
.mx-la .nav-links:where(:not(.mx-ferramenta *)){display:none}
.mx-la .nav-actions:where(:not(.mx-ferramenta *)){display:flex;align-items:center;gap:8px}
/* "Entrar" em vidro, o secundário da hero da Kesef/BlackCat (27/10/2026): pílula de raio 100px, degradê lateral a 7%,
   borda a 14% e ícone de entrar; some abaixo de 900px e na faixa do menu do celular, onde o "Criar conta" ao lado leva à mesma tela de acesso */
.mx-la .nav-login:where(:not(.mx-ferramenta *)){display:none;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px 0 14px;border-radius:100px;border:1px solid color-mix(in srgb,currentColor 14%,transparent);background:linear-gradient(90deg,color-mix(in srgb,currentColor 7%,transparent) 0%,transparent 50.48%,color-mix(in srgb,currentColor 7%,transparent) 100%);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--tx);font-size:14px;font-weight:500;line-height:1;letter-spacing:-.01em;white-space:nowrap;transition:transform .18s var(--ease),border-color .25s ease,background-color .25s ease,box-shadow .3s ease}
.mx-la .nav-login-ic:where(:not(.mx-ferramenta *)){flex:none;width:17px;height:17px;color:color-mix(in srgb,var(--red-hi) 62%,currentColor)}
.mx-la .nav-login:focus-visible:where(:not(.mx-ferramenta *)){outline:2px solid var(--red-hi);outline-offset:3px;border-radius:100px}
.mx-la .nav-burger:where(:not(.mx-ferramenta *)){display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.07);box-shadow:0 0 0 1px var(--line) inset}
.mx-la .nav-burger .ic:where(:not(.mx-ferramenta *)){width:22px;height:22px}
.mx-la .nav-sheet:where(:not(.mx-ferramenta *)){pointer-events:auto;width:min(100%,1120px);border-radius:24px;padding:10px;background:rgba(14,16,19,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--line) inset;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mx-la .nav-sheet[hidden]:where(:not(.mx-ferramenta *)){display:none}
.mx-la .nav-sheet a:where(:not(.mx-ferramenta *)){display:flex;align-items:center;min-height:48px;padding:0 16px;border-radius:14px;font-weight:600;background:rgba(255,255,255,.04)}
/* celular estreito (27/10/2026, pedido do Victor: logo maior): em 320px o "Criar conta" e o menu (186px) espremiam o logo a 70px.
   Menos respiro na cápsula, entre as ações e dentro do neon devolve a largura ao logo; o toque continua com 44px.
   O logo da barra pede 148px e cede aos botões o que faltar (min-width:0 aqui, max-width:100% na imagem): medido 104px em 320,
   138 em 360 e 148 a partir de 370. O do rodapé fica com a regra de cima */
@media (max-width:429px){
  .mx-la .nav-wrap:where(:not(.mx-ferramenta *)){padding-inline:8px}
  .mx-la .nav:where(:not(.mx-ferramenta *)){gap:10px;padding:8px 6px 8px 12px}
  .mx-la .nav .nav-logo:where(:not(.mx-ferramenta *)){min-width:0}
  .mx-la .nav .nav-logo img:where(:not(.mx-ferramenta *)){width:148px}
  .mx-la .nav-actions:where(:not(.mx-ferramenta *)){gap:6px}
  .mx-la .nav-actions .btn-neon-sm:where(:not(.mx-ferramenta *)){gap:6px;padding-left:12px}
}
@media (max-width:339px){.mx-la .nav-actions .btn-neon-sm:where(:not(.mx-ferramenta *)){font-size:13px}}
@media (min-width:900px){
  .mx-la .nav:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
  .mx-la .nav-wrap.scrolled .nav:where(:not(.mx-ferramenta *)){width:min(100% - 80px,1120px)}
  .mx-la .nav-actions:where(:not(.mx-ferramenta *)){justify-self:end}
  .mx-la .nav-links:where(:not(.mx-ferramenta *)){display:flex;gap:4px}
  .mx-la .nav-links a:where(:not(.mx-ferramenta *)){display:flex;align-items:center;min-height:44px;padding:0 clamp(8px,1.1vw,14px);border-radius:999px;color:var(--mut);font-weight:500;transition:color .2s,background .2s}
  .mx-la .nav-login:where(:not(.mx-ferramenta *)){display:inline-flex}
  .mx-la .nav-burger:where(:not(.mx-ferramenta *)), .mx-la .nav-sheet:where(:not(.mx-ferramenta *)){display:none!important}
}
@media (hover:hover) and (pointer:fine){
  .mx-la .nav-links a:hover:where(:not(.mx-ferramenta *)){color:var(--tx);background:rgba(255,255,255,.06)}
  .mx-la .nav-login:hover:where(:not(.mx-ferramenta *)){transform:translateY(-1px);border-color:color-mix(in srgb,currentColor 26%,transparent);background-color:color-mix(in srgb,currentColor 5%,transparent);box-shadow:0 0 24px rgba(91,123,255,.12)}
}
.mx-la .nav-login:active:where(:not(.mx-ferramenta *)){transform:scale(.98)}
@media (prefers-reduced-motion:reduce){.mx-la .nav-login:hover:where(:not(.mx-ferramenta *)){transform:none}}
/* barra estreita (27/10/2026): com o "Entrar" em vidro e o "Criar conta" neon (240px juntos), as abas da home só cabem
   CENTRADAS a partir de 1020px, também na cápsula rolada (que tira 80px). Até 1019 vale o menu do celular; de 1020 a 1139
   as abas e o "Entrar" encolhem um pouco (folga medida >= 12px). As páginas-guia têm rótulos mais largos: faixas próprias no lp.css */
@media (min-width:900px) and (max-width:1019px){
  .mx-la .nav:where(:not(.mx-ferramenta *)){display:flex}
  .mx-la .nav-links:where(:not(.mx-ferramenta *)), .mx-la .nav-login:where(:not(.mx-ferramenta *)){display:none}
  .mx-la .nav-burger:where(:not(.mx-ferramenta *)){display:grid!important}
  .mx-la .nav-sheet:not([hidden]):where(:not(.mx-ferramenta *)){display:grid!important}
}
@media (min-width:1020px) and (max-width:1139px){
  .mx-la .nav-links:where(:not(.mx-ferramenta *)){gap:2px}
  .mx-la .nav-links a:where(:not(.mx-ferramenta *)){padding-inline:6px;font-size:.9375rem}
  .mx-la .nav-login:where(:not(.mx-ferramenta *)){padding:0 12px 0 10px;gap:6px}
  .mx-la .nav-actions:where(:not(.mx-ferramenta *)){gap:6px}
}

/* ---------- hero (cobre a tela inteira; composição da referência: selo, título, apoio, 2 botões e o horizonte do planeta) ---------- */
@property --sa{syntax:"<angle>";inherits:false;initial-value:0deg}
.mx-la .hero:where(:not(.mx-ferramenta *)){--gw:min(100vw,1600px,max(min(100vw,1600px) * .62,(100vh - 540px) * 4.2));--gf:clamp(0px,(100vw - var(--gw)) * .8,12%);position:relative;isolation:isolate;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:112px 0 calc(var(--gw) * .43);overflow:hidden;contain:paint;background:radial-gradient(70% 46% at 50% 0,rgba(43,78,240,.05) 0,transparent 72%)}
.mx-la .sky:where(:not(.mx-ferramenta *)){position:absolute;inset:0;z-index:-1;overflow:hidden}

/* o Lynk gigante atrás do horizonte (camadas da mesma imagem 1672x941; posições em % dela) */
@supports (height:1svh){.mx-la .hero:where(:not(.mx-ferramenta *)){--gw:min(100vw,1600px,max(min(100vw,1600px) * .62,(100svh - 540px) * 4.2))}}
/* no celular ele passa da tela: o corte leva o braço, os dedos ficam no planeta */
@media (max-width:599px){.mx-la .hero:where(:not(.mx-ferramenta *)){--gw:128vw}}
/* a base do gigante passa um pouco da hero: o esmaecer de baixo acontece dentro dela */
.mx-la .gig:where(:not(.mx-ferramenta *)){position:absolute;left:50%;bottom:calc(var(--gw) * -.06);width:var(--gw);margin-left:calc(var(--gw) * -.5);aspect-ratio:1672/941;pointer-events:none;-webkit-mask:linear-gradient(#000 72%,#0000 89%);mask:linear-gradient(#000 72%,#0000 89%)}
.mx-la .gig img:where(:not(.mx-ferramenta *)){display:block;max-width:none}
/* quando ele fica mais estreito que a tela, corpo e planeta somem nas laterais; as mãos nunca */
.mx-la .gig-c:where(:not(.mx-ferramenta *)), .mx-la .gig-planeta:where(:not(.mx-ferramenta *)){-webkit-mask:linear-gradient(90deg,#0000,#000 var(--gf),#000 calc(100% - var(--gf)),#0000);mask:linear-gradient(90deg,#0000,#000 var(--gf),#000 calc(100% - var(--gf)),#0000)}
.mx-la .gig-c:where(:not(.mx-ferramenta *)){position:absolute;left:0;top:0;width:100%;height:76.514%;animation:gig-sobe 2.6s var(--ease) .3s both}
.mx-la .gig-corpo:where(:not(.mx-ferramenta *)){width:100%;height:100%;-webkit-mask:linear-gradient(#0000 13%,#000 33%);mask:linear-gradient(#0000 13%,#000 33%)}
.mx-la .gig-planeta:where(:not(.mx-ferramenta *)){position:absolute;left:0;top:53.135%;width:100%;height:46.865%;animation:nasce 1.6s var(--ease) .1s both}
.mx-la .gig-m:where(:not(.mx-ferramenta *)){position:absolute;inset:0}
.mx-la .gig-mao:where(:not(.mx-ferramenta *)){position:absolute;top:45.696%;height:auto;animation:gig-pousa .9s ease-out 2.3s both}
.mx-la .gig-mao.e:where(:not(.mx-ferramenta *)){left:0;width:24.522%}
.mx-la .gig-mao.d:where(:not(.mx-ferramenta *)){left:75.957%;width:24.043%}
/* viseira: um reflexo que segue o cursor e uma luz que atravessa de tempos em tempos */
.mx-la .gig-vis:where(:not(.mx-ferramenta *)){position:absolute;left:35.71%;top:28.47%;width:27.03%;height:38.89%;border-radius:48%/50%;overflow:hidden;mix-blend-mode:screen}
.mx-la .gig-luz:where(:not(.mx-ferramenta *)){position:absolute;left:22%;top:4%;width:56%;height:56%;border-radius:50%;background:radial-gradient(closest-side,rgba(232,236,255,.12),rgba(232,236,255,0));transition:transform .7s var(--ease)}
.mx-la .gig-varre:where(:not(.mx-ferramenta *)){position:absolute;inset:-20% -60%;background:linear-gradient(100deg,transparent 43%,rgba(222,228,255,.16) 50%,transparent 57%);transform:translateX(-70%);animation:gig-varre 9s ease-in-out 3.2s 3}
/* os elos dos fones acendem quando o sinal sai de uma mão e chega na outra */
.mx-la .gig-eco:where(:not(.mx-ferramenta *)){position:absolute;width:7%;aspect-ratio:1;border-radius:50%;translate:-50% -50%;background:radial-gradient(closest-side,rgba(232,236,255,.5),rgba(232,236,255,0));mix-blend-mode:screen;opacity:0;animation:gig-eco 7s ease-in-out 3s infinite}
.mx-la .gig-eco.e:where(:not(.mx-ferramenta *)){left:29.9%;top:52.1%}
.mx-la .gig-eco.d:where(:not(.mx-ferramenta *)){left:69.3%;top:53.5%;animation-name:gig-eco-d}
/* o sinal corre o horizonte de uma mão à outra: gira em volta do centro do planeta (só transform) */
.mx-la .gig-sinal:where(:not(.mx-ferramenta *)){position:absolute;left:49.545%;top:301.71%;width:0;height:0;opacity:0;transform:rotate(-10.5deg);animation:gig-sinal 7s cubic-bezier(.45,0,.25,1) 3s infinite}
.mx-la .gig-sinal i:where(:not(.mx-ferramenta *)){position:absolute;left:calc(var(--gw) * -.09);bottom:calc(var(--gw) * 1.3832 - 2px);width:calc(var(--gw) * .09);height:3px;border-radius:3px;background:linear-gradient(90deg,rgba(48,86,255,0),rgba(120,145,255,.8) 70%,#f4f6ff)}
@keyframes gig-sobe{from{translate:0 36%;opacity:0}30%{opacity:1}}
@keyframes gig-pousa{from{opacity:0}}
@keyframes gig-varre{0%{transform:translateX(-70%)}22%,100%{transform:translateX(70%)}}
@keyframes gig-eco{0%{opacity:0}5%{opacity:.9}18%,100%{opacity:0}}
@keyframes gig-eco-d{0%,52%{opacity:0}60%{opacity:.9}75%,100%{opacity:0}}
@keyframes gig-sinal{0%{opacity:0;transform:rotate(-10.5deg)}6%,55%{opacity:1}60%{opacity:0;transform:rotate(10.6deg)}100%{opacity:0;transform:rotate(10.6deg)}}
/* ao rolar, ele solta o planeta e afunda de volta atrás do horizonte */
@keyframes gig-afunda{to{transform:translateY(46%)}}
@keyframes gig-solta{to{opacity:0}}
@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:scroll()){
  .mx-la .gig-c:where(:not(.mx-ferramenta *)){animation:gig-sobe 2.6s var(--ease) .3s both,gig-afunda linear both;animation-timeline:auto,scroll(root);animation-range:normal,0 80vh}
  .mx-la .gig-m:where(:not(.mx-ferramenta *)){animation:gig-solta linear both;animation-timeline:scroll(root);animation-range:0 38vh}
  .mx-la .hero.off .gig-c:where(:not(.mx-ferramenta *)), .mx-la .hero.off .gig-m:where(:not(.mx-ferramenta *)){animation-play-state:running!important}
}}
/* o horizonte do planeta é a linha que separa os botões das IAs: a borda acesa fica no topo do bloco .ask */
.mx-la .globe:where(:not(.mx-ferramenta *)){position:absolute;left:0;top:0;width:100%;height:100%;-webkit-mask:linear-gradient(#0000 10%,#000 13%,#0000 27%);mask:linear-gradient(#0000 10%,#000 13%,#0000 27%);pointer-events:none}
.mx-la .globe img:where(:not(.mx-ferramenta *)){width:100%;height:100%;object-fit:contain;animation:nasce 1.6s var(--ease) .25s both,respira 7s ease-in-out 1.9s infinite alternate}
@keyframes nasce{from{opacity:0;transform:translateY(6%)}}
@keyframes respira{to{opacity:.78}}

.mx-la .hero-c:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(18px,2.2vw,28px)}
.mx-la .selo:where(:not(.mx-ferramenta *)){display:inline-flex;padding:1px;border-radius:999px;background:conic-gradient(from var(--sa),transparent 0 62%,rgba(91,123,255,.9) 74%,#fff 78%,rgba(91,123,255,.9) 82%,transparent 94%),rgba(255,255,255,.1);animation:selo 4s linear infinite}
@keyframes selo{to{--sa:360deg}}
.mx-la .selo-in:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;gap:10px;min-height:40px;padding:0 6px 0 12px;border-radius:999px;background:linear-gradient(90deg,#120a0a,#0d0809);font-size:.9rem;font-weight:500;color:#e6e9f2}
.mx-la .selo-ic:where(:not(.mx-ferramenta *)){width:18px;height:18px;color:var(--red-hi);animation:gira 9s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
.mx-la .selo b:where(:not(.mx-ferramenta *)){font-size:max(12px,.74rem);font-weight:600;letter-spacing:.06em;padding:6px 10px;border-radius:999px;background:rgba(48,86,255,.16);color:#8ea5ff}
.mx-la .rw:where(:not(.mx-ferramenta *)){font-size:var(--f-h1);line-height:1;font-weight:500;letter-spacing:-.045em}
.mx-la .rw .line:where(:not(.mx-ferramenta *)){display:block}
.mx-la .hero .rw:where(:not(.mx-ferramenta *)){font-size:clamp(2.5rem,1.6rem + 3.2vw,3.9rem);line-height:1.12;letter-spacing:-.03em;color:#eef0f6}
.mx-la .acc:where(:not(.mx-ferramenta *)){color:var(--red-hi)}
.mx-la .lede:where(:not(.mx-ferramenta *)){max-width:36em;font-size:clamp(1.02rem,.95rem + .4vw,1.25rem);color:#c9cfd6;line-height:1.5}
.mx-la .cta-row:where(:not(.mx-ferramenta *)){display:flex;align-items:center;gap:12px 20px;flex-wrap:wrap}
/* hero das guias (27/10/2026): o mesmo par da home, neon de cadastro + vidro, no tamanho deles (sem esticar), lado a lado e
   centralizado em toda largura; rótulo curto (.sm) abaixo de 600px. Os ajustes de celular ficam junto dos da .hero-ctas */
.mx-la .hero-cta:where(:not(.mx-ferramenta *)){justify-content:center;flex-wrap:nowrap;gap:10px;width:100%;margin-top:4px}
.mx-la .hero-cta>a:where(:not(.mx-ferramenta *)){flex:0 0 auto;min-width:0}
.mx-la .hero-cta .sm:where(:not(.mx-ferramenta *)){display:inline}.mx-la .hero-cta .lg:where(:not(.mx-ferramenta *)){display:none}
@media (min-width:600px){
  .mx-la .hero-cta:where(:not(.mx-ferramenta *)){gap:16px}
  .mx-la .hero-cta .sm:where(:not(.mx-ferramenta *)){display:none}.mx-la .hero-cta .lg:where(:not(.mx-ferramenta *)){display:inline}
}

/* ---------- hero no molde da Kesef/BlackCat (27/10/2026): título em degradê, apoio, neon + vidro e entrada escalonada ----------
   O título sai do .rw: o la.js parte o .rw em palavras com transform e opacity, e isso apaga o background-clip:text.
   O selo fica como estava (mesmo espaço até o título). Contrastes sobre o preto da hero: pontas do título #8c7774 5,01
   (centro #fff 21) · apoio #ab9c9a 7,95 · branco no neon 5,36 parado e 4,72 com a luz passando · seta #ff5448 no círculo
   #150403 6,30. */
.mx-la .hero-bc:where(:not(.mx-ferramenta *)){gap:0}
.mx-la .hero-bc .selo:where(:not(.mx-ferramenta *)){margin-bottom:clamp(18px,2.2vw,28px)}
.mx-la .hero-titulo:where(:not(.mx-ferramenta *)){font-size:clamp(34px,calc(27.8px + 2.1vw),64px);line-height:1.08;font-weight:500;letter-spacing:-.02em;text-wrap:balance}
.mx-la .hero-titulo .line:where(:not(.mx-ferramenta *)){display:block}
/* o degradê numa caixa do tamanho do texto (inline-block): as pontas escuras caem nas pontas das letras */
.mx-la .titulo-luz:where(:not(.mx-ferramenta *)){display:inline-block;max-width:100%;background-image:linear-gradient(90deg,#747c8c 0%,#fff 50%,#747c8c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
@supports not ((-webkit-background-clip:text) or (background-clip:text)){.mx-la .titulo-luz:where(:not(.mx-ferramenta *)){background:none;color:#eef0f6;-webkit-text-fill-color:currentColor}}
.mx-la .hero-texto:where(:not(.mx-ferramenta *)){max-width:min(100%,620px);margin-top:22px;font-size:17px;font-weight:500;line-height:1.6;letter-spacing:-.02em;color:#9ba1b0;text-wrap:balance}
/* par de botões: lado a lado e centralizado em toda largura */
.mx-la .hero-ctas:where(:not(.mx-ferramenta *)){display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:10px;max-width:100%;margin-top:32px}
.mx-la .hero-ctas>a:where(:not(.mx-ferramenta *)){flex:0 0 auto}
.mx-la .hero-ctas .sm:where(:not(.mx-ferramenta *)){display:inline}.mx-la .hero-ctas .lg:where(:not(.mx-ferramenta *)){display:none}
/* secundário: o vidro da referência, com o ícone na frente */
.mx-la .btn-vidro:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px 0 14px;border:1px solid rgba(255,255,255,.1);border-radius:100px;background:linear-gradient(90deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,0) 50.48%,rgba(255,255,255,.06) 100%);font-size:15px;font-weight:500;line-height:1;letter-spacing:-.01em;white-space:nowrap;color:var(--tx);transition:transform .18s var(--ease),border-color .25s ease,background-color .25s ease,box-shadow .3s ease}
.mx-la .btn-vidro .ic:where(:not(.mx-ferramenta *)){width:18px;height:18px;color:var(--red-hi)}
/* âncora na mesma página ("Ver como sacar"): a seta do vidro aponta para baixo */
.mx-la .btn-vidro .ic-desce:where(:not(.mx-ferramenta *)){rotate:90deg}
.mx-la .btn-vidro:focus-visible:where(:not(.mx-ferramenta *)){outline:2px solid var(--red-hi);outline-offset:3px;border-radius:100px}
@media (hover:hover) and (pointer:fine){.mx-la .btn-vidro:hover:where(:not(.mx-ferramenta *)){transform:translateY(-1px);border-color:rgba(255,255,255,.22);background-color:rgba(255,255,255,.04);box-shadow:0 0 24px rgba(91,123,255,.12)}}
.mx-la .btn-vidro:active:where(:not(.mx-ferramenta *)){transform:scale(.98)}
/* entrada: fade + 16px, 400ms, 60ms entre título, apoio e botões; aparece sem JS (fill both) */
@keyframes la-hero-entra{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes la-hero-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:no-preference){
  .mx-la .hero-bc .hero-titulo:where(:not(.mx-ferramenta *)), .mx-la .hero-bc .hero-texto:where(:not(.mx-ferramenta *)), .mx-la .hero-bc .hero-ctas:where(:not(.mx-ferramenta *)){animation:la-hero-entra 400ms var(--ease) both}
  .mx-la .hero-bc .hero-titulo:where(:not(.mx-ferramenta *)){animation-delay:140ms}
  .mx-la .hero-bc .hero-texto:where(:not(.mx-ferramenta *)){animation-delay:200ms}
  .mx-la .hero-bc .hero-ctas:where(:not(.mx-ferramenta *)){animation-delay:260ms}
}
@media (prefers-reduced-motion:reduce){
  /* sem deslocamento, com um fade curto (o "menos movimento" geral zera a duração; aqui ela volta a 200ms) */
  .mx-la .hero-bc .hero-titulo:where(:not(.mx-ferramenta *)), .mx-la .hero-bc .hero-texto:where(:not(.mx-ferramenta *)), .mx-la .hero-bc .hero-ctas:where(:not(.mx-ferramenta *)){animation:la-hero-fade 200ms ease-out both;animation-duration:200ms!important}
  .mx-la .btn-vidro:hover:where(:not(.mx-ferramenta *)){transform:none}
}
@media (min-width:600px){.mx-la .hero-ctas .sm:where(:not(.mx-ferramenta *)){display:none}.mx-la .hero-ctas .lg:where(:not(.mx-ferramenta *)){display:inline}}
/* celular: o bloco encolhe para o horizonte do planeta continuar na 1ª tela; botões lado a lado com rótulo curto.
   Vale para todo par neon + vidro: hero da home (.hero-ctas), hero das guias (.hero-cta) e fechamento (.cta-row.c) */
@media (max-width:47.99rem){
  .mx-la .hero-titulo:where(:not(.mx-ferramenta *)){line-height:1.05}
  .mx-la .hero-texto:where(:not(.mx-ferramenta *)){margin-top:12px;font-size:16px;line-height:1.5}
  .mx-la .hero-ctas:where(:not(.mx-ferramenta *)){margin-top:16px;gap:8px}
  .mx-la :is(.hero-ctas,.hero-cta,.cta-row.c) .btn-neon:where(:not(.mx-ferramenta *)){font-size:14px;gap:8px;padding:5px 5px 5px 15px}
  .mx-la :is(.hero-ctas,.hero-cta,.cta-row.c) .cta-seta:where(:not(.mx-ferramenta *)){width:32px;height:32px}
  .mx-la :is(.hero-ctas,.hero-cta,.cta-row.c) .cta-seta svg:where(:not(.mx-ferramenta *)){width:17px;height:17px}
  .mx-la .btn-vidro:where(:not(.mx-ferramenta *)){font-size:14px;gap:7px;padding:0 15px 0 12px}
  .mx-la .btn-vidro .ic:where(:not(.mx-ferramenta *)){width:17px;height:17px}
}
/* aparelho de 320–339px: os dois continuam lado a lado, com menos respiro (letra no piso de 13px) */
@media (max-width:21.24rem){
  .mx-la .hero-ctas:where(:not(.mx-ferramenta *)), .mx-la .hero-cta:where(:not(.mx-ferramenta *)), .mx-la .cta-row.c:where(:not(.mx-ferramenta *)){gap:6px}
  .mx-la :is(.hero-ctas,.hero-cta,.cta-row.c) .btn-neon:where(:not(.mx-ferramenta *)){font-size:13px;gap:6px;padding-left:12px}
  .mx-la :is(.hero-ctas,.hero-cta,.cta-row.c) .cta-seta:where(:not(.mx-ferramenta *)){width:30px;height:30px}
  .mx-la .btn-vidro:where(:not(.mx-ferramenta *)){font-size:13px;gap:6px;padding:0 12px 0 10px}
}
.mx-la .cta-row.c:where(:not(.mx-ferramenta *)){justify-content:center;flex-wrap:nowrap;width:100%}
.mx-la .cta-row.c>*:where(:not(.mx-ferramenta *)){flex:0 0 auto;min-width:0}

/* demonstração: o palco que saiu da hero, com o Lynk */
.mx-la .hero-grid:where(:not(.mx-ferramenta *)){display:grid;gap:36px;align-items:center}
.mx-la .hero-grid>*:where(:not(.mx-ferramenta *)){min-width:0}
.mx-la .hero-copy:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.mx-la .proof:where(:not(.mx-ferramenta *)){display:none;gap:10px;margin-top:6px}
@media (min-width:600px){.mx-la .proof:where(:not(.mx-ferramenta *)){display:grid}}
.mx-la .proof li:where(:not(.mx-ferramenta *)){display:flex;align-items:center;gap:10px;color:#cfd4da;font-size:.95rem}
.mx-la .proof .ic:where(:not(.mx-ferramenta *)){color:var(--red-hi);width:1.25em;height:1.25em}

/* palco do painel */
.mx-la .stage:where(:not(.mx-ferramenta *)){position:relative;display:grid;gap:14px;justify-items:center;padding-bottom:6px;margin-top:calc(min(.405 * (100vw - 2 * var(--pad)), 220px) + 8px);container-type:inline-size}
.mx-la .tilt:where(:not(.mx-ferramenta *)){grid-area:1/1;z-index:2;--rx:0deg;--ry:0deg;position:relative;width:100%;transform:perspective(1400px) rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .35s var(--ease);will-change:transform}
.mx-la .p-top:where(:not(.mx-ferramenta *)){display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.mx-la .eyebrow:where(:not(.mx-ferramenta *)){font-size:.8rem;font-weight:600;color:var(--mut);letter-spacing:-.005em}
.mx-la .tag-ex:where(:not(.mx-ferramenta *)){font-size:max(12px,.75rem);padding:3px 9px;border-radius:999px;background:rgba(255,255,255,.07);color:var(--mut)}
.mx-la .p-stats:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mx-la .s:where(:not(.mx-ferramenta *)){position:relative;text-align:center;padding:10px 12px;border-radius:12px;background:var(--card);box-shadow:0 0 0 1px var(--line) inset;transition:box-shadow .4s,background .4s}
.mx-la .s span:where(:not(.mx-ferramenta *)){display:block;font-size:max(12px,.74rem);color:var(--dim)}
.mx-la .s b:where(:not(.mx-ferramenta *)){display:flex;align-items:center;justify-content:center;gap:7px;font-size:1.4rem;font-weight:600;letter-spacing:-.04em;font-variant-numeric:tabular-nums;margin-top:2px}
.mx-la .stage[data-step="0"] .s0:where(:not(.mx-ferramenta *)), .mx-la .stage[data-step="1"] .s1:where(:not(.mx-ferramenta *)), .mx-la .stage[data-step="2"] .s2:where(:not(.mx-ferramenta *)){background:#1a1214;box-shadow:0 0 0 1px rgba(91,123,255,.6) inset}
.mx-la .p-bal:where(:not(.mx-ferramenta *)){position:relative;padding:14px;border-radius:14px;background:linear-gradient(135deg,#1e3cc4,#10237a 70%);box-shadow:0 0 0 1px rgba(255,255,255,.16) inset;transition:box-shadow .4s}
.mx-la .stage[data-step="3"] .p-bal:where(:not(.mx-ferramenta *)){box-shadow:0 0 0 1px rgba(255,255,255,.3) inset,0 18px 40px -16px rgba(0,0,0,.8)}
.mx-la .bal-head:where(:not(.mx-ferramenta *)){display:flex;align-items:center;justify-content:space-between;gap:8px}
.mx-la .p-bal .eyebrow:where(:not(.mx-ferramenta *)){color:#fff}
.mx-la .chip:where(:not(.mx-ferramenta *)){font-size:max(12px,.74rem);font-weight:600;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.2);color:#fff}
.mx-la .bal-val:where(:not(.mx-ferramenta *)){font-size:clamp(1.7rem,1.2rem + 2vw,2.3rem);font-weight:600;letter-spacing:-.04em;line-height:1.1;margin:6px 0 2px;font-variant-numeric:tabular-nums}
.mx-la .bal-note:where(:not(.mx-ferramenta *)){font-size:max(12px,.78rem);color:#fff;line-height:1.35}
.mx-la .bal-row:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.2)}
.mx-la .bal-row span:where(:not(.mx-ferramenta *)){display:block;font-size:max(12px,.7rem);color:#e3e9ff}
.mx-la .bal-row b:where(:not(.mx-ferramenta *)){font-size:.84rem;font-weight:600;font-variant-numeric:tabular-nums}

.mx-la .push:where(:not(.mx-ferramenta *)){position:absolute;z-index:3;left:8px;right:8px;bottom:-18px;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:16px;background:rgba(30,33,38,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--line2) inset,0 20px 40px -10px rgba(0,0,0,.8);opacity:0;transform:translateY(14px) scale(.97);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.mx-la .push img:where(:not(.mx-ferramenta *)){width:36px;height:36px;border-radius:9px}
.mx-la .push small:where(:not(.mx-ferramenta *)){display:block;font-size:max(12px,.72rem);color:var(--dim)}
.mx-la .push b:where(:not(.mx-ferramenta *)){display:block;font-size:.9rem;font-weight:600;line-height:1.2}
.mx-la .push p:where(:not(.mx-ferramenta *)){font-size:max(12px,.78rem);color:var(--mut);line-height:1.3}
.mx-la .stage:not([data-step="0"]) .push:where(:not(.mx-ferramenta *)){opacity:1;transform:none}
@keyframes bob{50%{transform:translateY(-6px)}}
@keyframes float{50%{transform:translateY(-8px)}}
.mx-la .stepper:where(:not(.mx-ferramenta *)){grid-area:2/1;display:grid;grid-template-columns:repeat(4,1fr) 44px;gap:6px;width:100%;margin-top:22px}
.mx-la .st:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:56px;padding:6px 4px;border-radius:14px;background:rgba(19,21,25,.9);box-shadow:0 0 0 1px var(--line) inset;color:#c9cfd6;font-size:.82rem;font-weight:600;position:relative;min-width:0;clip-path:inset(0 round 14px);transition:background .25s,box-shadow .25s}
.mx-la .st b:where(:not(.mx-ferramenta *)){display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:max(12px,.74rem)}
.mx-la .st.on:where(:not(.mx-ferramenta *)){background:#161d3b;color:#fff;box-shadow:0 0 0 1px rgba(91,123,255,.7) inset}
.mx-la .st.on b:where(:not(.mx-ferramenta *)){background:var(--red);color:#fff}
.mx-la .stage[data-playing="true"] .st.on:where(:not(.mx-ferramenta *)){background-image:linear-gradient(var(--red-hi),var(--red-hi));background-repeat:no-repeat;background-size:200% 3px;background-position:100% 100%;animation:fill var(--dur,3.6s) linear forwards}
@keyframes fill{from{background-position:100% 100%}to{background-position:0 100%}}
.mx-la .playbtn:where(:not(.mx-ferramenta *)){display:grid;place-items:center;min-height:56px;border-radius:14px;background:rgba(19,21,25,.9);box-shadow:0 0 0 1px var(--line) inset}
.mx-la .playbtn .ic:where(:not(.mx-ferramenta *)){fill:currentColor;stroke:none;width:16px;height:16px}
.mx-la .stage-cap:where(:not(.mx-ferramenta *)){grid-area:3/1;font-size:.88rem;color:#e1e5ea;text-align:center;max-width:30em}

@media (min-width:900px){
  .mx-la .stage:where(:not(.mx-ferramenta *)){margin-top:84px}
  .mx-la .hero-grid:where(:not(.mx-ferramenta *)){grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(24px,4vw,64px)}
}

/* ---------- seções ---------- */
.mx-la .sec:where(:not(.mx-ferramenta *)){padding-block:var(--sec)}
/* o pulso do Lynk (escala 1,7 a 94% da largura dele) e a órbita passavam da borda direita em 1280–1440 e criavam rolagem lateral; a seção de ponta a ponta recorta o efeito na lateral */
.mx-la .demo:where(:not(.mx-ferramenta *)), .mx-la .split:where(:not(.mx-ferramenta *)){overflow-x:clip}
/* a faísca do horizonte do rodapé (.ft-hz::before) atravessa a linha e saía até 152px pela direita no fim da página; o rodapé recorta só na lateral */
.mx-la .foot:where(:not(.mx-ferramenta *)){overflow-x:clip}
.mx-la .sec-head:where(:not(.mx-ferramenta *)){display:grid;gap:14px;justify-items:start;margin-bottom:clamp(28px,5vw,56px);max-width:48rem}
.mx-la .kicker:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:.95rem;color:var(--red-hi)}
.mx-la h2:where(:not(.mx-ferramenta *)){font-size:var(--f-h2);line-height:1.06;font-weight:500;letter-spacing:-.035em;text-wrap:balance}
.mx-la h2:has(br):where(:not(.mx-ferramenta *)){text-wrap:pretty} /* com <br> a 1ª linha já ocupa a largura toda e balance não estreita nada; pretty puxa a penúltima palavra para a última linha */
/* 18/10/2026: 1.04 apertava as duas linhas no celular (abaixo de 1.05) e "painel." e "você." caíam sozinhos na última linha; balance divide a frase por igual */
.mx-la h2 em:where(:not(.mx-ferramenta *)){color:var(--mut)}
.mx-la .desc:where(:not(.mx-ferramenta *)){font-size:clamp(1.02rem,.95rem + .35vw,1.2rem);color:var(--mut);max-width:38em}
.mx-la .cap:where(:not(.mx-ferramenta *)){margin-top:18px;font-size:.9rem;color:var(--dim);max-width:44em}
.mx-la.js-ok .rv:where(:not(.mx-ferramenta *)){opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.mx-la.js-ok .rv.in:where(:not(.mx-ferramenta *)){opacity:1;transform:none}
.mx-la.js-ok .rw .w:where(:not(.mx-ferramenta *)){display:inline-block;opacity:0;transform:translateY(.28em);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i)*55ms)}
.mx-la.js-ok .rw.in .w:where(:not(.mx-ferramenta *)){opacity:1;filter:none;transform:none}

/* nichos */
.mx-la .vit:where(:not(.mx-ferramenta *)){padding:clamp(14px,3vw,28px);border-radius:var(--r);background:linear-gradient(180deg,var(--card),var(--bg2));box-shadow:0 0 0 1px var(--line) inset}
.mx-la .vit-top:where(:not(.mx-ferramenta *)){display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.mx-la .vit-top h3:where(:not(.mx-ferramenta *)){font-size:1.25rem;font-weight:600;letter-spacing:-.03em}
.mx-la .chips:where(:not(.mx-ferramenta *)){display:flex;flex-wrap:wrap;gap:8px}
.mx-la .chip-f:where(:not(.mx-ferramenta *)){min-height:44px;padding:0 16px;border-radius:999px;background:rgba(255,255,255,.05);box-shadow:0 0 0 1px var(--line) inset;font-size:.9rem;font-weight:600;color:var(--mut);transition:background .2s,color .2s,box-shadow .2s}
.mx-la .chip-f[aria-pressed="true"]:where(:not(.mx-ferramenta *)){background:rgba(43,78,240,.22);color:#fff;box-shadow:0 0 0 1px rgba(91,123,255,.7) inset}
.mx-la .vit-grid:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.mx-la .vit-grid article:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:18px;background:var(--card2);box-shadow:0 0 0 1px var(--line) inset;transition:box-shadow .3s,opacity .3s,transform .3s var(--ease)}
.mx-la .vit-grid h4:where(:not(.mx-ferramenta *)){font-size:1rem;font-weight:600;letter-spacing:-.025em;line-height:1.2}
.mx-la .vit-grid p:where(:not(.mx-ferramenta *)){display:none;font-size:.88rem;color:var(--mut);line-height:1.4}
.mx-la .vit.filtering article:where(:not(.mx-ferramenta *)){opacity:.4}
.mx-la .vit.filtering article.hit:where(:not(.mx-ferramenta *)){opacity:1;box-shadow:0 0 0 1px rgba(91,123,255,.7) inset;transform:translateY(-2px)}
.mx-la .viz:where(:not(.mx-ferramenta *)){height:64px;border-radius:12px;background:rgba(255,255,255,.03);display:flex;align-items:flex-end;gap:5px;padding:10px;overflow:hidden}
.mx-la .viz i:where(:not(.mx-ferramenta *)){flex:1;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,var(--red-hi),var(--red-d));transform-origin:bottom;animation:grow 3.2s var(--ease) infinite alternate}
.mx-la .v-com i:nth-child(1):where(:not(.mx-ferramenta *)){height:30%}.mx-la .v-com i:nth-child(2):where(:not(.mx-ferramenta *)){height:48%;animation-delay:.1s}.mx-la .v-com i:nth-child(3):where(:not(.mx-ferramenta *)){height:62%;animation-delay:.2s}.mx-la .v-com i:nth-child(4):where(:not(.mx-ferramenta *)){height:78%;animation-delay:.3s}.mx-la .v-com i:nth-child(5):where(:not(.mx-ferramenta *)){height:100%;animation-delay:.4s}
@keyframes grow{from{transform:scaleY(.55)}to{transform:scaleY(1)}}
.mx-la .v-conv:where(:not(.mx-ferramenta *)){align-items:center;justify-content:center}
.mx-la .v-conv svg:where(:not(.mx-ferramenta *)){width:44px;height:44px;transform:rotate(-90deg)}
.mx-la .v-conv circle:where(:not(.mx-ferramenta *)){fill:none;stroke:rgba(255,255,255,.1);stroke-width:5}
.mx-la .v-conv .arc:where(:not(.mx-ferramenta *)){stroke:var(--red-hi);stroke-linecap:round;stroke-dasharray:38 100;animation:none}
.mx-la .v-prazo i:where(:not(.mx-ferramenta *)){background:linear-gradient(180deg,#b5c5ff,var(--red))}
.mx-la .v-prazo i:nth-child(1):where(:not(.mx-ferramenta *)){height:90%}.mx-la .v-prazo i:nth-child(2):where(:not(.mx-ferramenta *)){height:75%}.mx-la .v-prazo i:nth-child(3):where(:not(.mx-ferramenta *)){height:60%}.mx-la .v-prazo i:nth-child(4):where(:not(.mx-ferramenta *)){height:46%}.mx-la .v-prazo i:nth-child(5):where(:not(.mx-ferramenta *)){height:34%}.mx-la .v-prazo i:nth-child(6):where(:not(.mx-ferramenta *)){height:24%}
.mx-la .v-mer:where(:not(.mx-ferramenta *)){gap:3px}.mx-la .v-mer i:nth-child(1):where(:not(.mx-ferramenta *)){height:18%}.mx-la .v-mer i:nth-child(2):where(:not(.mx-ferramenta *)){height:30%}.mx-la .v-mer i:nth-child(3):where(:not(.mx-ferramenta *)){height:44%}.mx-la .v-mer i:nth-child(4):where(:not(.mx-ferramenta *)){height:36%}.mx-la .v-mer i:nth-child(5):where(:not(.mx-ferramenta *)){height:58%}.mx-la .v-mer i:nth-child(6):where(:not(.mx-ferramenta *)){height:70%}.mx-la .v-mer i:nth-child(7):where(:not(.mx-ferramenta *)){height:62%}.mx-la .v-mer i:nth-child(8):where(:not(.mx-ferramenta *)){height:84%}.mx-la .v-mer i:nth-child(9):where(:not(.mx-ferramenta *)){height:100%}
.mx-la .v-pla:where(:not(.mx-ferramenta *)){align-items:center}.mx-la .v-pla i:where(:not(.mx-ferramenta *)){height:34%;border-radius:8px;animation:none;opacity:.55}.mx-la .v-pla i:nth-child(2):where(:not(.mx-ferramenta *)){height:62%;opacity:1}.mx-la .v-pla i:nth-child(3):where(:not(.mx-ferramenta *)){height:48%;opacity:.75}
.mx-la .v-vag:where(:not(.mx-ferramenta *)){align-items:center;gap:4px}.mx-la .v-vag i:where(:not(.mx-ferramenta *)){height:auto;max-width:16px;aspect-ratio:1;border-radius:3px;background:rgba(255,255,255,.12);animation:none}.mx-la .v-vag i.f:where(:not(.mx-ferramenta *)){background:var(--red-hi)}
.mx-la .v-bri:where(:not(.mx-ferramenta *)){flex-direction:column;justify-content:center;align-items:stretch;gap:5px}.mx-la .v-bri i:where(:not(.mx-ferramenta *)){flex:none;height:6px;border-radius:3px;background:rgba(255,255,255,.14);animation:none}.mx-la .v-bri i:nth-child(1):where(:not(.mx-ferramenta *)){width:90%;background:var(--red-hi)}.mx-la .v-bri i:nth-child(2):where(:not(.mx-ferramenta *)){width:100%}.mx-la .v-bri i:nth-child(3):where(:not(.mx-ferramenta *)){width:78%}.mx-la .v-bri i:nth-child(4):where(:not(.mx-ferramenta *)){width:56%}
.mx-la .v-demo:where(:not(.mx-ferramenta *)){align-items:center;justify-content:center}.mx-la .v-demo .ic:where(:not(.mx-ferramenta *)){width:34px;height:34px;color:var(--red-hi);stroke-width:1.5}
@media (min-width:600px){.mx-la .vit-grid p:where(:not(.mx-ferramenta *)){display:block}}
@media (min-width:768px){.mx-la .vit-grid:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(4,1fr);gap:12px}}

/* rede / calculadora (sem faixa clara própria: o fundo é o da página) */
.mx-la .split:where(:not(.mx-ferramenta *)){padding-block:var(--sec)}
.mx-la .lab:where(:not(.mx-ferramenta *)){display:grid;gap:16px;margin-bottom:22px}
.mx-la .lab-ctl:where(:not(.mx-ferramenta *)), .mx-la .lab-out:where(:not(.mx-ferramenta *)){padding:clamp(16px,3vw,28px);border-radius:var(--r);background:var(--card);box-shadow:0 0 0 1px var(--line) inset;min-width:0}
.mx-la .lab-ctl:where(:not(.mx-ferramenta *)){display:grid;gap:22px;align-content:start}
.mx-la .lab-ctl label span:where(:not(.mx-ferramenta *)){display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:6px;font-weight:500;color:var(--mut);font-size:.95rem}
.mx-la .lab-ctl strong:where(:not(.mx-ferramenta *)){font-size:1.3rem;font-weight:600;color:var(--tx);letter-spacing:-.04em;font-variant-numeric:tabular-nums;white-space:nowrap}
.mx-la input[type=range]:where(:not(.mx-ferramenta *)){-webkit-appearance:none;appearance:none;display:block;width:100%;height:44px;margin:0;background:transparent;cursor:pointer;--p:50%}
.mx-la input[type=range]:where(:not(.mx-ferramenta *))::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:linear-gradient(90deg,var(--red-hi) var(--p),rgba(255,255,255,.14) var(--p))}
.mx-la input[type=range]:where(:not(.mx-ferramenta *))::-moz-range-track{height:6px;border-radius:3px;background:linear-gradient(90deg,var(--red-hi) var(--p),rgba(255,255,255,.14) var(--p))}
.mx-la input[type=range]:where(:not(.mx-ferramenta *))::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-10px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(91,123,255,.35),0 4px 12px rgba(0,0,0,.5)}
.mx-la input[type=range]:where(:not(.mx-ferramenta *))::-moz-range-thumb{width:26px;height:26px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(91,123,255,.35)}
.mx-la .fine:where(:not(.mx-ferramenta *)){font-size:.88rem;color:var(--dim);line-height:1.45}
.mx-la .lab-out:where(:not(.mx-ferramenta *)){display:grid;gap:14px;align-content:start}
.mx-la .tree:where(:not(.mx-ferramenta *)){display:none}
@media (min-width:600px){.mx-la .tree:where(:not(.mx-ferramenta *)){display:block}}
.mx-la .tree svg:where(:not(.mx-ferramenta *)){width:100%;height:auto;max-height:150px}
.mx-la .tl path:where(:not(.mx-ferramenta *)){stroke:var(--line2);stroke-dasharray:4 5;animation:dash 6s linear infinite}
.mx-la .tree circle:where(:not(.mx-ferramenta *)){stroke-width:1.5}
.mx-la .n-you:where(:not(.mx-ferramenta *)){fill:var(--red);stroke:rgba(255,255,255,.4)}
.mx-la .n-sub:where(:not(.mx-ferramenta *)){fill:#1b1f25;stroke:var(--red-hi)}
.mx-la .tree text:where(:not(.mx-ferramenta *)){fill:#fff;font:600 11px "Plus Jakarta Sans",sans-serif}
.mx-la .tree .pc:where(:not(.mx-ferramenta *)){font-size:9px}
.mx-la .bar:where(:not(.mx-ferramenta *)){position:relative;height:12px;border-radius:6px;clip-path:inset(0 round 6px);background:#cfd4da}
.mx-la .b-you:where(:not(.mx-ferramenta *)){background:linear-gradient(90deg,var(--red-d),var(--red-hi));position:absolute;inset:0;transform-origin:left;transform:scaleX(.6);transition:transform .35s var(--ease)}
.mx-la .b-sub:where(:not(.mx-ferramenta *)){display:none}
.mx-la .rec:where(:not(.mx-ferramenta *)){display:grid;gap:10px}
.mx-la .rec>div:where(:not(.mx-ferramenta *)){display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:rgba(255,255,255,.04)}
.mx-la .rec>div>div:where(:not(.mx-ferramenta *)){flex:1;min-width:0}
.mx-la .rec strong:where(:not(.mx-ferramenta *)){display:block;font-weight:600}
.mx-la .rec small:where(:not(.mx-ferramenta *)){display:block;color:var(--dim);font-size:.84rem;line-height:1.3}
.mx-la .rec b:where(:not(.mx-ferramenta *)){font-size:1.35rem;font-weight:600;letter-spacing:-.04em;font-variant-numeric:tabular-nums;white-space:nowrap}
.mx-la .ri:where(:not(.mx-ferramenta *)){display:grid;place-items:center;width:40px;height:40px;border-radius:12px;flex:none}
.mx-la .ri.you:where(:not(.mx-ferramenta *)){background:var(--red);color:#fff}.mx-la .ri.sub:where(:not(.mx-ferramenta *)){background:#cfd4da;color:#0b0d10}
@media (min-width:900px){.mx-la .lab:where(:not(.mx-ferramenta *)){grid-template-columns:1fr 1fr;align-items:stretch}}

/* abas */
.mx-la .tabs:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}
.mx-la .tabs button:where(:not(.mx-ferramenta *)){display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 10px;border-radius:16px;background:rgba(255,255,255,.04);box-shadow:0 0 0 1px var(--line) inset;font-weight:600;font-size:.95rem;color:var(--mut);transition:background .25s,color .25s,box-shadow .25s}
.mx-la .tabs button[aria-selected="true"]:where(:not(.mx-ferramenta *)){background:rgba(43,78,240,.2);color:#fff;box-shadow:0 0 0 1px rgba(91,123,255,.7) inset}
.mx-la .tpanel:where(:not(.mx-ferramenta *)){display:grid;gap:18px;padding:clamp(18px,3vw,36px);border-radius:var(--r);background:linear-gradient(135deg,var(--card),var(--bg2));box-shadow:0 0 0 1px var(--line) inset}
.mx-la .tp-lead:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 12px;align-items:center;align-content:start}
.mx-la .tp-ic:where(:not(.mx-ferramenta *)){display:grid;place-items:center;color:var(--red-hi)}
.mx-la .tp-ic .ic:where(:not(.mx-ferramenta *)){width:30px;height:30px}
.mx-la .tp-lead h3:where(:not(.mx-ferramenta *)){font-size:clamp(1.4rem,1.1rem + 1.2vw,2.1rem);font-weight:500;letter-spacing:-.045em;line-height:1.1}
.mx-la .tp-lead p:where(:not(.mx-ferramenta *)){grid-column:1/-1;color:var(--mut)}
/* telas reais do painel */
.mx-la .shot:where(:not(.mx-ferramenta *)){display:grid;gap:12px;margin:0 0 clamp(20px,3vw,32px)}
.mx-la .shot .tabs:where(:not(.mx-ferramenta *)){margin:0;width:min(100%,24rem)}
.mx-la .shot .tabs button:where(:not(.mx-ferramenta *)){white-space:nowrap}
.mx-la .shot-win:where(:not(.mx-ferramenta *)){border-radius:var(--r);clip-path:inset(0 round var(--r));background:#0a0b0d;box-shadow:0 0 0 1px var(--line) inset}
.mx-la .shot-win img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:auto;-webkit-mask-image:linear-gradient(#000 88%,transparent);mask-image:linear-gradient(#000 88%,transparent)}
.mx-la .shot figcaption:where(:not(.mx-ferramenta *)){font-size:.88rem;color:var(--mut)}
@media (max-width:599px){.mx-la .shot-win img:where(:not(.mx-ferramenta *)){aspect-ratio:780/1180;object-fit:cover;object-position:top;-webkit-mask-image:linear-gradient(#000 84%,transparent);mask-image:linear-gradient(#000 84%,transparent)}}
/* passos 1-2-3: faixa de 3 também no celular (copy de apoio some só lá) */
.mx-la .tp-steps:where(:not(.mx-ferramenta *)){position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.mx-la .tp-steps:where(:not(.mx-ferramenta *))::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(var(--red-hi),var(--red-hi)) 0 0/calc((100% - 16px)/3) 100% no-repeat,var(--line2);pointer-events:none}
.mx-la .tp-steps li:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;gap:6px;padding:16px 4px 0}
.mx-la .tp-steps li>span:where(:not(.mx-ferramenta *)){font-size:1.3rem;font-weight:600;letter-spacing:-.04em;color:var(--red-hi);line-height:1}
.mx-la .tp-steps strong:where(:not(.mx-ferramenta *)){display:block;font-weight:600;line-height:1.25;font-size:.92rem}
.mx-la .tp-steps p:where(:not(.mx-ferramenta *)){display:none;color:var(--mut);font-size:.92rem;line-height:1.4;margin-top:3px}
.mx-la .tpanel.swap:where(:not(.mx-ferramenta *)){animation:swap .45s var(--ease)}
@keyframes swap{from{opacity:.2;transform:translateY(8px)}}
@media (min-width:600px){
  .mx-la .tabs:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(4,1fr)}
  .mx-la .tp-steps p:where(:not(.mx-ferramenta *)){display:block}
  .mx-la .tp-steps li:where(:not(.mx-ferramenta *)){padding:18px 8px 0}
  .mx-la .tp-steps li>span:where(:not(.mx-ferramenta *)){font-size:1.4rem}
  .mx-la .tp-steps strong:where(:not(.mx-ferramenta *)){font-size:1rem}
}
@media (min-width:900px){.mx-la .tpanel:where(:not(.mx-ferramenta *)){grid-template-columns:1fr 1.5fr;gap:36px;align-items:center}}

/* painel (módulos) */
.mx-la .mods:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.mx-la .mods article:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:14px 6px;border-radius:20px;background:var(--card);box-shadow:0 0 0 1px var(--line) inset;transition:box-shadow .3s,transform .3s var(--ease)}
.mx-la .mods .ic:where(:not(.mx-ferramenta *)){width:26px;height:26px;color:var(--red-hi);stroke-width:1.6}
.mx-la .mods h3:where(:not(.mx-ferramenta *)){font-size:clamp(1rem,.85rem + .6vw,1.25rem);font-weight:600;letter-spacing:-.03em}
.mx-la .mods p:where(:not(.mx-ferramenta *)){display:none;font-size:.9rem;color:var(--mut);line-height:1.4}
@media (min-width:600px){.mx-la .mods:where(:not(.mx-ferramenta *)){gap:14px}.mx-la .mods article:where(:not(.mx-ferramenta *)){align-items:flex-start;text-align:left;padding:22px}.mx-la .mods p:where(:not(.mx-ferramenta *)){display:block}}
@media (hover:hover) and (pointer:fine){
  .mx-la .mods article:hover:where(:not(.mx-ferramenta *)), .mx-la .vit-grid article:hover:where(:not(.mx-ferramenta *)){box-shadow:0 0 0 1px rgba(91,123,255,.5) inset,0 20px 40px -20px rgba(0,0,0,.7);transform:translateY(-3px)}
}

/* faq */
.mx-la .la-faq h2:where(:not(.mx-ferramenta *)){font-size:clamp(1.85rem,1rem + 2.6vw,3.2rem)}
.mx-la .la-faq:where(:not(.mx-ferramenta *)){display:grid;gap:28px;padding-block:var(--sec)}
.mx-la .la-faq>*:where(:not(.mx-ferramenta *)){min-width:0}
.mx-la .faq-l:where(:not(.mx-ferramenta *)){display:grid;gap:16px;align-content:start;justify-items:start}
.mx-la .faq-r:where(:not(.mx-ferramenta *)){display:grid;gap:10px;align-content:start}
.mx-la .la-faq details:where(:not(.mx-ferramenta *)){border-radius:18px;background:var(--card);box-shadow:0 0 0 1px var(--line) inset;overflow:hidden}
.mx-la .la-faq summary:where(:not(.mx-ferramenta *)){display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:14px 18px;font-weight:600;font-size:1.02rem;letter-spacing:-.02em;cursor:pointer;list-style:none}
.mx-la .la-faq summary:where(:not(.mx-ferramenta *))::-webkit-details-marker{display:none}
.mx-la .la-faq summary .ic:where(:not(.mx-ferramenta *)){width:22px;height:22px;color:var(--red-hi);transition:transform .3s var(--ease)}
.mx-la .la-faq details[open] summary .ic:where(:not(.mx-ferramenta *)){transform:rotate(45deg)}
.mx-la .la-faq details p:where(:not(.mx-ferramenta *)){padding:0 18px 18px;color:var(--mut)}
.mx-la .la-faq .more-q:where(:not(.mx-ferramenta *)){display:none}
.mx-la .faq-r.open .more-q:where(:not(.mx-ferramenta *)){display:block}
.mx-la .more:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;justify-content:center;gap:8px;justify-self:center;min-height:48px;padding:0 22px;border-radius:999px;background:rgba(255,255,255,.06);box-shadow:0 0 0 1px var(--line2) inset;font-weight:600}
@media (min-width:900px){.mx-la .la-faq:where(:not(.mx-ferramenta *)){grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,96px)}.mx-la .faq-l:where(:not(.mx-ferramenta *)){position:sticky;top:var(--faq-top,96px);align-self:start}}

/* fechamento */
.mx-la .closing:where(:not(.mx-ferramenta *)){--gw:clamp(800px,100vw,1440px);position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(56px,8vw,112px) clamp(36px,4vw,56px);text-align:center;contain:paint}
.mx-la .close-light:where(:not(.mx-ferramenta *)){position:absolute;z-index:-1;left:50%;top:calc(var(--gw) * -.086);width:var(--gw);margin-left:calc(var(--gw) * -.5);aspect-ratio:1440/954;pointer-events:none}
.mx-la .close-in:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:minmax(0,1fr);gap:22px;justify-items:center;text-align:center}
.mx-la .close-sym:where(:not(.mx-ferramenta *)){width:44px;height:44px}
/* título e apoio com a copy da hero (27/10/2026): a mesma luz no título (.titulo-luz, sem o vermelho da 2ª linha) e o tom,
   o peso e o corpo do apoio da hero. Sai do .rw pelo mesmo motivo da hero (palavra partida apaga o background-clip:text).
   A caixa da luz desce sob a perna das letras da última linha (g, p, ç) e sobe sobre o acento: o degradê só pinta dentro
   dela, e com entrelinha 1 a perna passa da linha; padding e margem negativa se anulam, o desenho não mexe */
.mx-la .close-titulo:where(:not(.mx-ferramenta *)){font-size:clamp(2.2rem,1rem + 6vw,5.4rem);line-height:1;font-weight:500;letter-spacing:-.045em;text-wrap:balance}
.mx-la .close-titulo .line:where(:not(.mx-ferramenta *)){display:block}
.mx-la .close-titulo .titulo-luz:where(:not(.mx-ferramenta *)){padding-block:.08em .2em;margin-block:-.08em -.2em}
.mx-la .closing .desc:where(:not(.mx-ferramenta *)){max-width:min(100%,620px);margin-inline:auto;font-size:17px;font-weight:500;line-height:1.6;letter-spacing:-.02em;color:#9ba1b0;text-wrap:balance}
@media (max-width:47.99rem){.mx-la .closing .desc:where(:not(.mx-ferramenta *)){font-size:16px;line-height:1.5}}
/* entrada como a da hero (fade + 16px, 400ms, 60ms entre título, apoio e botões), quando o bloco chega à tela: o la.js
   põe .in no .entra assim que o título, o apoio ou os botões cruzam a tela (quem chega de baixo vê os botões primeiro).
   Sem JS fica tudo à vista; com menos movimento, o fade curto da hero (200ms, sem deslocamento) */
.mx-la.js-ok .close-titulo.entra:not(.in):where(:not(.mx-ferramenta *)), .mx-la.js-ok .close-titulo.entra:not(.in)~:is(.desc,.cta-row):where(:not(.mx-ferramenta *)){opacity:0}
@media (prefers-reduced-motion:no-preference){
  .mx-la .close-titulo.entra.in:where(:not(.mx-ferramenta *)), .mx-la .close-titulo.entra.in~:is(.desc,.cta-row):where(:not(.mx-ferramenta *)){animation:la-hero-entra 400ms var(--ease) both}
  .mx-la .close-titulo.entra.in~.desc:where(:not(.mx-ferramenta *)){animation-delay:60ms}
  .mx-la .close-titulo.entra.in~.cta-row:where(:not(.mx-ferramenta *)){animation-delay:120ms}
}
@media (prefers-reduced-motion:reduce){
  /* o "menos movimento" geral zera a duração; aqui ela volta a 200ms, como na hero */
  .mx-la .close-titulo.entra.in:where(:not(.mx-ferramenta *)), .mx-la .close-titulo.entra.in~:is(.desc,.cta-row):where(:not(.mx-ferramenta *)){animation:la-hero-fade 200ms ease-out both;animation-duration:200ms!important}
}
.mx-la .la-note:where(:not(.mx-ferramenta *)){display:flex;align-items:center;justify-content:center;gap:8px;color:var(--mut);font-size:.92rem;text-align:left}
.mx-la .la-note .ic:where(:not(.mx-ferramenta *)){color:var(--red-hi)}
.mx-la .ask:where(:not(.mx-ferramenta *)){position:relative;margin-top:clamp(18px,3vw,34px);padding-top:clamp(34px,4vw,48px);width:100%;max-width:820px;display:grid;gap:12px;justify-items:center}
.mx-la .ask p:where(:not(.mx-ferramenta *)){color:var(--mut);font-size:.95rem;text-wrap:balance}
/* as três IAs: logo oficial, a cor de cada marca na luz que gira pela borda (a mesma do selo da hero) e no brilho de dentro */
.mx-la .ask ul:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,1.4vw,14px);width:100%;max-width:760px}
.mx-la .ia:where(:not(.mx-ferramenta *)){display:block;padding:1px;border-radius:16px;background:conic-gradient(from var(--sa),transparent 0 58%,rgba(var(--c),.95) 72%,#fff 77%,rgba(var(--c),.95) 82%,transparent 94%),rgba(var(--c),.3);box-shadow:0 16px 30px -18px rgba(0,0,0,.9);animation:selo 4.2s linear var(--d,0s) infinite;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.mx-la .ia-in:where(:not(.mx-ferramenta *)){position:relative;display:flex;align-items:center;justify-content:center;gap:10px;min-height:60px;padding:0 14px;border-radius:15px;background:radial-gradient(120% 150% at 50% -40%,rgba(var(--c),.34),transparent 62%),radial-gradient(70% 90% at 50% 140%,rgba(var(--c),.22),transparent 70%),linear-gradient(180deg,#131518,#0b0c0e);color:#fff;font-size:1.02rem;font-weight:600;letter-spacing:-.01em}
.mx-la .ia-logo:where(:not(.mx-ferramenta *)){flex:none;width:22px;height:22px;fill:currentColor;color:var(--l,#fff)}
.mx-la .ia-sai:where(:not(.mx-ferramenta *)){flex:none;width:15px;height:15px;opacity:.55;transition:transform .2s var(--ease),opacity .2s}
.mx-la .ia:active:where(:not(.mx-ferramenta *)){transform:scale(.98)}
@media (hover:hover) and (pointer:fine){.mx-la .ia:hover:where(:not(.mx-ferramenta *)){transform:translateY(-2px);box-shadow:0 20px 34px -18px rgba(0,0,0,.95)}.mx-la .ia:hover .ia-sai:where(:not(.mx-ferramenta *)){opacity:1;transform:translate(2px,-2px)}}
/* celular: as três continuam lado a lado, com o logo em cima do nome */
@media (max-width:599px){.mx-la .ia-in:where(:not(.mx-ferramenta *)){flex-direction:column;gap:7px;min-height:76px;padding:10px 6px;font-size:.9rem}.mx-la .ia-logo:where(:not(.mx-ferramenta *)){width:24px;height:24px}.mx-la .ia-sai:where(:not(.mx-ferramenta *)){position:absolute;top:8px;right:8px;width:12px;height:12px}}

/* rodapé */
.mx-la .foot:where(:not(.mx-ferramenta *)){padding-block:28px 20px;border-top:1px solid var(--line)}
.mx-la .foot-top:where(:not(.mx-ferramenta *)){display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:20px}
.mx-la .foot-top p:where(:not(.mx-ferramenta *)){margin-top:12px;max-width:32em;color:var(--mut);font-size:.95rem}
.mx-la .foot-cols:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-block:20px}
.mx-la .foot-cols h3:where(:not(.mx-ferramenta *)){font-size:.95rem;font-weight:600;margin-bottom:10px}
.mx-la .foot-cols a:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;min-height:44px;color:var(--mut);font-size:.95rem}
.mx-la .foot-bot:where(:not(.mx-ferramenta *)){display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center;justify-content:center;text-align:center;padding-top:20px;border-top:1px solid var(--line);color:var(--dim);font-size:.9rem}
@media (min-width:700px){.mx-la .foot-cols:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(3,1fr)}}
/* celular: o terceiro grupo ocupa a linha toda com os links em duas colunas, sem coluna órfã */
@media (max-width:699px){.mx-la .foot-cols>div:last-child:where(:not(.mx-ferramenta *)){grid-column:1/-1}.mx-la .foot-cols>div:last-child ul:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:1fr 1fr;column-gap:16px}}
@media (hover:hover) and (pointer:fine){.mx-la .foot-cols a:hover:where(:not(.mx-ferramenta *)){color:var(--tx)}}

/* Lynk, o mascote do sistema: de pé ao lado do painel, com olhos vivos */
.mx-la .lynk:where(:not(.mx-ferramenta *)){--lw:min(44cqw,240px);grid-area:1/1;align-self:start;justify-self:end;position:relative;width:var(--lw);height:0;margin-right:-1cqw;pointer-events:none}
.mx-la .lynk-in:where(:not(.mx-ferramenta *)){position:absolute;left:0;top:calc(var(--lw) * -.917);width:100%}
.mx-la .lynk-body:where(:not(.mx-ferramenta *)){position:relative;z-index:1;container-type:inline-size;animation:float 6s ease-in-out infinite;pointer-events:none}
.mx-la .lynk-toque:where(:not(.mx-ferramenta *)){position:absolute;left:26%;top:0;width:72%;height:62%;border-radius:40% 40% 30% 30%;pointer-events:auto;cursor:pointer;-webkit-tap-highlight-color:transparent}
.mx-la .lynk-body img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:auto;filter:drop-shadow(0 18px 26px rgba(0,0,0,.55))}
.mx-la .face:where(:not(.mx-ferramenta *)){position:absolute;inset:0;transform:translate(calc(var(--lx,0) * 1.8cqw),calc(var(--ly,0) * 1.4cqw));transition:transform .45s var(--ease)}
.mx-la .eye:where(:not(.mx-ferramenta *)){position:absolute;display:block;transform-origin:50% 55%;animation:blink 5.2s infinite}
.mx-la .e1:where(:not(.mx-ferramenta *)){left:46.15%;top:18.6%;width:4.65%;height:7.37%}
.mx-la .e2:where(:not(.mx-ferramenta *)){left:64.23%;top:18.17%;width:5.32%;height:7.46%}
.mx-la .eye b:where(:not(.mx-ferramenta *)){position:absolute;inset:0;border-radius:999px;background:#fff;box-shadow:0 0 1.2cqw rgba(255,255,255,.3);transition:transform .3s var(--ease),opacity .25s}
.mx-la .eye:where(:not(.mx-ferramenta *))::after{content:"";position:absolute;left:0;right:0;top:0;bottom:46%;border:1.15cqw solid #fff;border-bottom:0;border-radius:999px 999px 0 0;opacity:0;transition:opacity .25s}
.mx-la .lynk[data-humor="surpreso"] .eye b:where(:not(.mx-ferramenta *)){transform:scale(1.14)}
.mx-la .lynk[data-humor="feliz"] .eye b:where(:not(.mx-ferramenta *)){opacity:0}
.mx-la .lynk[data-humor="feliz"] .eye:where(:not(.mx-ferramenta *))::after{opacity:1}
@keyframes blink{0%,93%,100%{transform:scaleY(1)}96%{transform:scaleY(.08)}}
.mx-la .ping:where(:not(.mx-ferramenta *)){position:absolute;left:94.4%;top:21.1%;width:16%;aspect-ratio:1;margin:-8% 0 0 -8%;border-radius:50%;box-shadow:0 0 0 .7cqw rgba(91,123,255,.85) inset;opacity:0;pointer-events:none}
.mx-la .lynk.pinga .ping:where(:not(.mx-ferramenta *)){animation:ping 1.1s var(--ease) both}
.mx-la .lynk.pinga .p2:where(:not(.mx-ferramenta *)){animation-delay:.28s}
@keyframes ping{0%{opacity:.95;transform:scale(.35)}100%{opacity:0;transform:scale(1.7)}}
.mx-la .orbit:where(:not(.mx-ferramenta *)){position:absolute;z-index:0;left:-45%;top:44%;width:190%;height:auto;overflow:visible;transform:translateY(-50%) rotate(-14deg);pointer-events:none}
.mx-la .bubble:where(:not(.mx-ferramenta *)){position:absolute;z-index:4;right:90%;bottom:56%;width:max-content;max-width:150px;padding:7px 11px;border-radius:14px 14px 4px 14px;background:#fff;color:#0b0d10;font-size:max(12px,.78rem);font-weight:600;line-height:1.25;box-shadow:0 10px 24px -8px rgba(0,0,0,.6)}
@media (min-width:900px) and (max-width:1199px){.mx-la .stage:where(:not(.mx-ferramenta *)){margin-top:clamp(160px,20vw,228px)}}
@media (min-width:1200px){
  .mx-la .demo:where(:not(.mx-ferramenta *)){padding-bottom:calc(var(--sec) + 72px)}
  .mx-la .hero-grid:where(:not(.mx-ferramenta *)){grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);width:min(100% - var(--pad) * 2,1320px)}
  .mx-la .stage:where(:not(.mx-ferramenta *)){margin-top:0;justify-items:start}
  .mx-la .tilt:where(:not(.mx-ferramenta *)), .mx-la .stepper:where(:not(.mx-ferramenta *)), .mx-la .stage-cap:where(:not(.mx-ferramenta *)){width:64%}
  .mx-la .lynk:where(:not(.mx-ferramenta *)){--lw:min(52cqw,400px,calc(64svh / 1.479));align-self:end;margin-right:-4cqw}
  .mx-la .lynk-body:where(:not(.mx-ferramenta *)){z-index:3}
  .mx-la .lynk-in:where(:not(.mx-ferramenta *)){top:calc(-14px - var(--lw) * .674)}
  .mx-la .lynk-body img:where(:not(.mx-ferramenta *)){-webkit-mask-image:linear-gradient(#000 86%,transparent 99%);mask-image:linear-gradient(#000 86%,transparent 99%)}
  .mx-la .bubble:where(:not(.mx-ferramenta *)){right:auto;left:30%;bottom:calc(100% + 6px);max-width:200px;border-radius:14px 14px 14px 4px;font-size:.84rem}
}

/* telas estreitas */
@media (max-width:420px){
  .mx-la .hero:where(:not(.mx-ferramenta *)){padding-top:100px}
  .mx-la .stepper:where(:not(.mx-ferramenta *)){gap:5px}
  .mx-la .st:where(:not(.mx-ferramenta *)){font-size:max(12px,.75rem);padding-inline:2px}
  .mx-la .bubble:where(:not(.mx-ferramenta *)){max-width:138px;font-size:.8rem}
}

/* menos movimento */
@media (prefers-reduced-motion:reduce){
  .mx-la *:where(:not(.mx-ferramenta *)), .mx-la *:where(:not(.mx-ferramenta *))::before, .mx-la *:where(:not(.mx-ferramenta *))::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .mx-la.js-ok .rv:where(:not(.mx-ferramenta *)), .mx-la.js-ok .rw .w:where(:not(.mx-ferramenta *)){opacity:1;filter:none;transform:none}
  .mx-la .gig-c:where(:not(.mx-ferramenta *)), .mx-la .gig img:where(:not(.mx-ferramenta *)), .mx-la .gig-sinal:where(:not(.mx-ferramenta *)){animation-delay:0s!important}
}

/* hero fora da tela: animações param */
.mx-la .hero.off *:where(:not(.mx-ferramenta *)), .mx-la .hero.off:where(:not(.mx-ferramenta *)), .mx-la .demo.off *:where(:not(.mx-ferramenta *)), .mx-la .demo.off:where(:not(.mx-ferramenta *)){animation-play-state:paused!important}

/* ---- la-c.css ---- */
/* Link Affiliattes — camada que eleva #painel, #faq e o rodapé ao nível da hero e do fechamento.
   Mobile-first, só transform/opacity em movimento (o rodapé ainda desenha o elo por @property);
   hover só com mouse; "menos movimento" vira um fade curto. Os tokens são os do la.css. */

@property --mx{syntax:"<length>";inherits:true;initial-value:-999px}
@property --my{syntax:"<length>";inherits:true;initial-value:-999px}
@property --dr{syntax:"<number>";inherits:true;initial-value:0}
@property --pv-sx{syntax:"<percentage>";inherits:false;initial-value:130%}

/* ================= PAINEL: a seção ================= */
/* o que sai da caixa para os lados (luz, chips, grade de pontos) fica preso aqui dentro: zero rolagem lateral.
   Para baixo, não: o halo da janela atravessa a fronteira e se apaga já dentro do FAQ (recortado ali, virava degrau) */
.mx-la #painel:where(:not(.mx-ferramenta *)){--pe:cubic-bezier(.16,1,.3,1);position:relative;isolation:isolate;contain:paint}
@supports (overflow:clip){.mx-la #painel:where(:not(.mx-ferramenta *)){contain:none;overflow-x:clip;overflow-y:visible}}
/* sem fundo próprio (o brilho branco do topo e o grão da caixa faziam a faixa cinza e o degrau nas duas fronteiras): o fundo e o grão são os da página */
.mx-la .pnl-fundo:where(:not(.mx-ferramenta *)){display:none}
.mx-la #painel .pnl-head:where(:not(.mx-ferramenta *)){justify-items:center;text-align:center;margin-inline:auto}
.mx-la .pnl-sub:where(:not(.mx-ferramenta *)){display:none;max-width:38rem;color:var(--mut);font-size:clamp(1rem,.95rem + .25vw,1.12rem);line-height:1.55}
@media (min-width:600px){.mx-la .pnl-sub:where(:not(.mx-ferramenta *)){display:block}}

/* ================= PAINEL: vitrine das telas reais ================= */
.mx-la #painel .pv:where(:not(.mx-ferramenta *)){gap:clamp(14px,2vw,20px);margin-bottom:clamp(22px,3.4vw,44px)}
.mx-la .pv-bar:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;align-items:center;gap:10px}
.mx-la .pv-bar figcaption:where(:not(.mx-ferramenta *)){font-size:.88rem;color:var(--mut);text-align:center}

/* abas num trilho só, com o indicador vermelho que desliza (transform) e a barra do avanço automático */
.mx-la .pv-tabs:where(:not(.mx-ferramenta *)){position:relative;display:grid;grid-template-columns:1fr 1fr;width:min(100%,22rem);padding:4px;border-radius:999px;background:rgba(255,255,255,.04);box-shadow:0 0 0 1px var(--line) inset}
.mx-la .pv-tabs button:where(:not(.mx-ferramenta *)){position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:0;padding:0 12px;border-radius:999px;font-weight:600;font-size:.95rem;white-space:nowrap;color:var(--mut);transition:color .35s var(--pe),transform .18s var(--pe)}
.mx-la .pv-tabs button .ic:where(:not(.mx-ferramenta *)){width:18px;height:18px}
.mx-la .pv-tabs button[aria-selected="true"]:where(:not(.mx-ferramenta *)){color:#fff}
.mx-la .pv-tabs button:active:where(:not(.mx-ferramenta *)){transform:scale(.98)}
.mx-la .pv-ind:where(:not(.mx-ferramenta *)){position:absolute;left:4px;top:4px;bottom:4px;width:calc(50% - 4px);border-radius:999px;overflow:hidden;pointer-events:none;
  background:linear-gradient(180deg,#2b4ef0,var(--red) 55%,var(--red-d));box-shadow:0 0 0 1px rgba(255,255,255,.14) inset,0 8px 18px -8px rgba(0,0,0,.8);transition:transform .6s var(--pe)}
.mx-la .pv[data-on="b"] .pv-ind:where(:not(.mx-ferramenta *)){transform:translateX(100%)}
.mx-la .pv-prog:where(:not(.mx-ferramenta *)){position:absolute;left:16px;right:16px;bottom:5px;height:2px;border-radius:2px;background:rgba(255,255,255,.6);transform:scaleX(0);transform-origin:left;opacity:0}
.mx-la .pv-ind.roda .pv-prog:where(:not(.mx-ferramenta *)){opacity:1;animation:pv-prog 6.5s linear both}
.mx-la .pv.pausa .pv-prog:where(:not(.mx-ferramenta *)){animation-play-state:paused}
@keyframes pv-prog{to{transform:scaleX(1)}}
@media (hover:hover) and (pointer:fine){.mx-la .pv-tabs button[aria-selected="false"]:hover:where(:not(.mx-ferramenta *)){color:var(--tx)}}

/* a cena: grade de pontos, luz volumétrica que nasce da borda de baixo da janela, cantos de mira e chips em profundidade */
.mx-la .pv-cena:where(:not(.mx-ferramenta *)){--fora:-2%;--mo:8px;--pb:clamp(34px,6vw,76px);position:relative;isolation:isolate;perspective:1800px;padding:clamp(22px,3.4vw,46px) 0 var(--pb)}
.mx-la .pv-cena:where(:not(.mx-ferramenta *))::before{content:"";position:absolute;z-index:-2;inset:-4% -30% 0;pointer-events:none;
  background:radial-gradient(circle,rgba(255,255,255,.10) 1px,transparent 1.5px) 50% 50%/22px 22px;
  -webkit-mask-image:radial-gradient(52% 58% at 50% 46%,#000 20%,transparent 78%);mask-image:radial-gradient(52% 58% at 50% 46%,#000 20%,transparent 78%)}
.mx-la .pv-luz:where(:not(.mx-ferramenta *)){position:absolute;z-index:-1;left:0;right:0;top:0;bottom:var(--pb);pointer-events:none}
/* o halo: o centro mora na borda de baixo da janela (o fim desta caixa) e se espalha para os lados e para baixo */
.mx-la .pv-luz:where(:not(.mx-ferramenta *))::before{content:"";position:absolute;inset:0 -38% -42%;
  background:radial-gradient(16% 13% at 50% 70.4%,rgba(150,169,255,.34),transparent 72%),
    radial-gradient(42% 30% at 50% 70.4%,rgba(43,78,240,.5),rgba(43,78,240,.14) 52%,transparent 80%),
    radial-gradient(closest-side at 50% 70.4%,rgba(43,78,240,.12),transparent 92%)}
/* no celular a janela é alta e o halo descia até 280px abaixo dela, por cima do começo do FAQ: ali ele se apaga em 150px,
   atravessando a fronteira sem corte (o #painel não recorta para baixo) */
@media (max-width:599px){.mx-la .pv-luz:where(:not(.mx-ferramenta *))::before{-webkit-mask:linear-gradient(#000 70.4%,rgba(0,0,0,.5) calc(70.4% + 56px),transparent calc(70.4% + 150px));mask:linear-gradient(#000 70.4%,rgba(0,0,0,.5) calc(70.4% + 56px),transparent calc(70.4% + 150px))}}
/* feixes parados que sobem da borda (volume), apagando antes das pontas; um a cada 8deg, sem gradiente repetido */
.mx-la .pv-raios:where(:not(.mx-ferramenta *)){position:absolute;left:-30%;right:-30%;top:-8%;bottom:0;opacity:.9;
  background:conic-gradient(from -90deg at 50% 100%,transparent 0deg,transparent 3deg,rgba(110,140,255,.075) 3.6deg,rgba(110,140,255,.075) 4.4deg,transparent 5deg,transparent 11deg,rgba(110,140,255,.075) 11.6deg,rgba(110,140,255,.075) 12.4deg,transparent 13deg,transparent 19deg,rgba(110,140,255,.075) 19.6deg,rgba(110,140,255,.075) 20.4deg,transparent 21deg,transparent 27deg,rgba(110,140,255,.075) 27.6deg,rgba(110,140,255,.075) 28.4deg,transparent 29deg,transparent 35deg,rgba(110,140,255,.075) 35.6deg,rgba(110,140,255,.075) 36.4deg,transparent 37deg,transparent 43deg,rgba(110,140,255,.075) 43.6deg,rgba(110,140,255,.075) 44.4deg,transparent 45deg,transparent 51deg,rgba(110,140,255,.075) 51.6deg,rgba(110,140,255,.075) 52.4deg,transparent 53deg,transparent 59deg,rgba(110,140,255,.075) 59.6deg,rgba(110,140,255,.075) 60.4deg,transparent 61deg,transparent 67deg,rgba(110,140,255,.075) 67.6deg,rgba(110,140,255,.075) 68.4deg,transparent 69deg,transparent 75deg,rgba(110,140,255,.075) 75.6deg,rgba(110,140,255,.075) 76.4deg,transparent 77deg,transparent 83deg,rgba(110,140,255,.075) 83.6deg,rgba(110,140,255,.075) 84.4deg,transparent 85deg,transparent 91deg,rgba(110,140,255,.075) 91.6deg,rgba(110,140,255,.075) 92.4deg,transparent 93deg,transparent 99deg,rgba(110,140,255,.075) 99.6deg,rgba(110,140,255,.075) 100.4deg,transparent 101deg,transparent 107deg,rgba(110,140,255,.075) 107.6deg,rgba(110,140,255,.075) 108.4deg,transparent 109deg,transparent 115deg,rgba(110,140,255,.075) 115.6deg,rgba(110,140,255,.075) 116.4deg,transparent 117deg,transparent 123deg,rgba(110,140,255,.075) 123.6deg,rgba(110,140,255,.075) 124.4deg,transparent 125deg,transparent 131deg,rgba(110,140,255,.075) 131.6deg,rgba(110,140,255,.075) 132.4deg,transparent 133deg,transparent 139deg,rgba(110,140,255,.075) 139.6deg,rgba(110,140,255,.075) 140.4deg,transparent 141deg,transparent 147deg,rgba(110,140,255,.075) 147.6deg,rgba(110,140,255,.075) 148.4deg,transparent 149deg,transparent 155deg,rgba(110,140,255,.075) 155.6deg,rgba(110,140,255,.075) 156.4deg,transparent 157deg,transparent 163deg,rgba(110,140,255,.075) 163.6deg,rgba(110,140,255,.075) 164.4deg,transparent 165deg,transparent 171deg,rgba(110,140,255,.075) 171.6deg,rgba(110,140,255,.075) 172.4deg,transparent 173deg,transparent 179deg,rgba(110,140,255,.075) 179.6deg,rgba(110,140,255,.075) 180.4deg,transparent 181deg,transparent 180deg);
  -webkit-mask-image:radial-gradient(48% 92% at 50% 100%,#000 8%,transparent 74%);mask-image:radial-gradient(48% 92% at 50% 100%,#000 8%,transparent 74%)}
/* o horizonte: uma linha acesa na borda de baixo, visível dos dois lados da janela */
.mx-la .pv-horiz:where(:not(.mx-ferramenta *)){position:absolute;left:-6%;right:-6%;bottom:0;height:1px;
  background:linear-gradient(90deg,rgba(91,123,255,0),rgba(91,123,255,.85) 22%,#d6dfff 50%,rgba(91,123,255,.85) 78%,rgba(91,123,255,0))}
.mx-la .pv-palco:where(:not(.mx-ferramenta *)){position:relative;transform-style:preserve-3d;margin-inline:auto}
.mx-la .pv-giro:where(:not(.mx-ferramenta *)){position:relative;transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform 1.2s var(--pe)}
.mx-la .pv-win:where(:not(.mx-ferramenta *)){position:relative;padding:1px;border-radius:calc(var(--r) + 1px);
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,.08) 22%,rgba(255,255,255,.06) 68%,rgba(91,123,255,.75));
  box-shadow:0 60px 110px -50px rgba(0,0,0,.95),0 30px 60px -30px rgba(0,0,0,.8)}
.mx-la .pv-in:where(:not(.mx-ferramenta *)){border-radius:var(--r);overflow:hidden;background:#0a0b0d}
.mx-la .pv-top:where(:not(.mx-ferramenta *)){position:relative;display:flex;align-items:center;gap:7px;height:34px;padding:8px 14px;background:linear-gradient(#15181d,#0f1215);border-bottom:1px solid var(--line)}
.mx-la .pv-top>i:where(:not(.mx-ferramenta *)){display:none;width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.16)}
.mx-la .pv-url:where(:not(.mx-ferramenta *)){position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.05);font-size:.76rem;color:#c3c9d1;white-space:nowrap}
.mx-la .pv-url .ic:where(:not(.mx-ferramenta *)){width:12px;height:12px;color:var(--ok)}
/* celular: a tela do app inteira, como ela é (barra de baixo inclusive), nada cortado */
.mx-la .pv-tela:where(:not(.mx-ferramenta *)){position:relative;display:grid;aspect-ratio:780/1688;overflow:hidden;background:#0a0b0d}
.mx-la .pv-shot:where(:not(.mx-ferramenta *)){grid-area:1/1;display:block;min-width:0}
.mx-la .pv-shot img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0}
.mx-la .pv-varre:where(:not(.mx-ferramenta *)){position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;
  background:linear-gradient(100deg,transparent 40%,rgba(110,137,255,.16) 50%,transparent 60%) var(--pv-sx) 0/260% 100% no-repeat}
.mx-la .pv-tela.troca .pv-varre:where(:not(.mx-ferramenta *)){animation:pv-varre 1s var(--pe)}
@keyframes pv-varre{0%{opacity:1;--pv-sx:130%}100%{opacity:0;--pv-sx:-30%}}
/* com o script, as duas telas ficam no mesmo lugar e trocam por esmaecimento */
.mx-la.lc-js .pv-shot:where(:not(.mx-ferramenta *)){opacity:0;transform:scale(.985);transition:opacity .6s var(--pe),transform .9s var(--pe)}
.mx-la.lc-js .pv-shot.on:where(:not(.mx-ferramenta *)){opacity:1;transform:none}

/* cantos de mira: chegam de fora e travam na janela */
.mx-la .pv-mira:where(:not(.mx-ferramenta *)){position:absolute;inset:calc(-1 * var(--mo));pointer-events:none}
.mx-la .pv-mira i:where(:not(.mx-ferramenta *)){position:absolute;width:clamp(14px,2vw,26px);aspect-ratio:1;border:0 solid rgba(91,123,255,.85)}
.mx-la .pv-mira i:nth-child(1):where(:not(.mx-ferramenta *)){left:0;top:0;border-width:1.5px 0 0 1.5px;border-top-left-radius:6px;--ox:-12px;--oy:-12px}
.mx-la .pv-mira i:nth-child(2):where(:not(.mx-ferramenta *)){right:0;top:0;border-width:1.5px 1.5px 0 0;border-top-right-radius:6px;--ox:12px;--oy:-12px}
.mx-la .pv-mira i:nth-child(3):where(:not(.mx-ferramenta *)){left:0;bottom:0;border-width:0 0 1.5px 1.5px;border-bottom-left-radius:6px;--ox:-12px;--oy:12px}
.mx-la .pv-mira i:nth-child(4):where(:not(.mx-ferramenta *)){right:0;bottom:0;border-width:0 1.5px 1.5px 0;border-bottom-right-radius:6px;--ox:12px;--oy:12px}
.mx-la.lc-js .pv-mira i:where(:not(.mx-ferramenta *)){opacity:0;transform:translate(var(--ox),var(--oy)) scale(1.25);transition:opacity .7s var(--pe),transform 1.2s var(--pe)}
.mx-la.lc-js .pv-cena.in .pv-mira i:where(:not(.mx-ferramenta *)){opacity:1;transform:none}

/* chips da interface: vidro fosco, borda fina, em profundidade (translateZ) para a paralaxe sair do 3D */
.mx-la .pv-chips:where(:not(.mx-ferramenta *)){position:absolute;inset:0;pointer-events:none;transform-style:preserve-3d}
.mx-la .pv-chip:where(:not(.mx-ferramenta *)){position:absolute;display:flex;align-items:center;gap:.65em;padding:.6em .85em;border-radius:1em;font-size:12px;line-height:1.2;white-space:nowrap;color:var(--tx);
  background:rgba(14,16,20,.8);-webkit-backdrop-filter:blur(8px) saturate(1.3);backdrop-filter:blur(8px) saturate(1.3);
  border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 22px 44px -20px rgba(0,0,0,.95);
  transform:translateZ(var(--z,46px))}
.mx-la .pc-1:where(:not(.mx-ferramenta *)){display:none;left:var(--fora);top:16%;--z:60px}
.mx-la .pc-2:where(:not(.mx-ferramenta *)){right:var(--fora);top:46%;--z:80px}
.mx-la .pc-3:where(:not(.mx-ferramenta *)){left:calc(var(--fora) + 6%);bottom:-3%;--z:52px}
.mx-la .pc-4:where(:not(.mx-ferramenta *)){display:none;right:calc(var(--fora) + 8%);top:-4%;--z:40px;padding:.4em}
.mx-la .pc-tx:where(:not(.mx-ferramenta *)){display:grid;gap:.15em;min-width:0}
.mx-la .pc-tx b:where(:not(.mx-ferramenta *)){font-weight:600;font-size:1.1em;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.mx-la .pc-tx small:where(:not(.mx-ferramenta *)){color:var(--mut);font-size:max(12px,.86em)}
.mx-la .pc-tx small:first-child:where(:not(.mx-ferramenta *)){font-weight:600}
.mx-la .pc-ic:where(:not(.mx-ferramenta *)){display:grid;place-items:center;flex:none;width:2.4em;height:2.4em;border-radius:50%;border:1px solid rgba(255,255,255,.18);color:var(--red-hi)}
.mx-la .pc-ic .ic:where(:not(.mx-ferramenta *)){width:1.15em;height:1.15em}
.mx-la .pc-ic.ok:where(:not(.mx-ferramenta *)){color:var(--ok);border-color:rgba(53,208,127,.4)}
.mx-la .pc-val:where(:not(.mx-ferramenta *)){margin-left:.3em;font-style:normal;font-weight:700;font-size:1.05em;color:var(--red-hi);font-variant-numeric:tabular-nums}
.mx-la .pc-spark:where(:not(.mx-ferramenta *)){width:4.4em;height:1.7em;fill:none;stroke:var(--ok);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.mx-la .pc-btn:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;gap:.5em;padding:.6em 1.05em;border-radius:999px;font-weight:600;color:#fff;background:linear-gradient(180deg,#2b4ef0,var(--red) 55%,var(--red-d));box-shadow:0 0 0 1px rgba(255,255,255,.14) inset}
.mx-la .pc-busca:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;gap:.6em;min-width:15em;padding:.55em .9em;border-radius:.7em;border:1px solid rgba(255,255,255,.14);color:var(--mut)}
.mx-la .pc-btn .ic:where(:not(.mx-ferramenta *)), .mx-la .pc-busca .ic:where(:not(.mx-ferramenta *)){width:1.15em;height:1.15em}
/* um conjunto de chips por aba; sem o script, ficam os da primeira tela */
.mx-la .pv-chip[data-tela="b"]:where(:not(.mx-ferramenta *)){opacity:0}
.mx-la.lc-js .pv-chip:where(:not(.mx-ferramenta *)){opacity:0;scale:.9;transition:opacity .7s var(--pe),scale 1s var(--pe);transition-delay:calc(var(--k) * 110ms + 150ms)}
.mx-la.lc-js .pv-cena.in .pv-chip[data-tela="a"]:where(:not(.mx-ferramenta *)){opacity:1;scale:1}
.mx-la.lc-js .pv[data-on="b"] .pv-cena.in .pv-chip[data-tela="a"]:where(:not(.mx-ferramenta *)){opacity:0;scale:.9;transition-delay:0s}
.mx-la.lc-js .pv[data-on="b"] .pv-cena.in .pv-chip[data-tela="b"]:where(:not(.mx-ferramenta *)){opacity:1;scale:1}

@media (min-width:600px){
  .mx-la .pv-cena:where(:not(.mx-ferramenta *)){--fora:-2.5%;--mo:12px}
  .mx-la .pv-top:where(:not(.mx-ferramenta *)){height:38px}
  .mx-la .pv-top>i:where(:not(.mx-ferramenta *)){display:block}
  .mx-la .pv-url:where(:not(.mx-ferramenta *)){font-size:.8rem;height:24px}
  /* computador: recorte no vão entre dois blocos: no início, logo abaixo da jornada e do "Copiar link", antes do "Resumo em números"; no financeiro, antes dos títulos do extrato */
  .mx-la .pv-tela:where(:not(.mx-ferramenta *)){aspect-ratio:2880/1612}
  .mx-la .pv-tela:where(:not(.mx-ferramenta *))::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3.5%;z-index:1;pointer-events:none;background:linear-gradient(rgba(10,11,13,0),#0a0b0d)}
  .mx-la .pv-chip:where(:not(.mx-ferramenta *)){font-size:12px}
  .mx-la .pc-1:where(:not(.mx-ferramenta *)), .mx-la .pc-4:where(:not(.mx-ferramenta *)){display:flex}
  .mx-la .pc-3:where(:not(.mx-ferramenta *)){bottom:-6%;left:calc(var(--fora) + 9%)}
}
@media (min-width:1024px){
  .mx-la .pv-cena:where(:not(.mx-ferramenta *)){--fora:-5.5%;--mo:16px}
  .mx-la .pv-palco:where(:not(.mx-ferramenta *)){width:90%}
  .mx-la .pv-chip:where(:not(.mx-ferramenta *)){font-size:clamp(12.5px,.55rem + .45vw,14.5px)}
}

/* a janela chega inclinada e se endireita com a rolagem; os chips andam em velocidades diferentes (paralaxe) */
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .mx-la .pv-palco:where(:not(.mx-ferramenta *)){animation:pv-ergue linear both;animation-timeline:view();animation-range:cover 0% cover 32%}
    .mx-la .pv-luz:where(:not(.mx-ferramenta *)){animation:pv-acende linear both;animation-timeline:view();animation-range:cover 0% cover 42%}
    .mx-la .pv-chip:where(:not(.mx-ferramenta *)){animation:pc-paralaxe linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
  }
  @supports not (animation-timeline:view()){
    .mx-la.lc-js .pv-palco:where(:not(.mx-ferramenta *)){transition:transform 1.1s var(--pe)}
    .mx-la.lc-js .pv:not(.in) .pv-palco:where(:not(.mx-ferramenta *)){transform:rotateX(16deg) scale(.93) translateY(36px)}
  }
}
@keyframes pv-ergue{from{transform:rotateX(18deg) scale(.92) translateY(40px)}to{transform:none}}
@keyframes pv-acende{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}
@keyframes pc-paralaxe{from{translate:0 calc(var(--d,24) * 1px)}to{translate:0 calc(var(--d,24) * -1px)}}

/* entrada do rodapé: as colunas sobem e o elo se desenha */
@keyframes bt-entra{to{opacity:1;translate:none}}
@keyframes bt-desenha{from{--dr:100}to{--dr:0}}

/* ================= FAQ ================= */
.mx-la .fq:where(:not(.mx-ferramenta *)){position:relative;isolation:isolate;interpolate-size:allow-keywords}
/* a luz quente mora no bloco do título e anda com ele quando ele acompanha a rolagem */
.mx-la .fq .faq-l:where(:not(.mx-ferramenta *)){isolation:isolate}
@media (max-width:899px){.mx-la .fq .faq-l:where(:not(.mx-ferramenta *)){position:relative}}
.mx-la .fq .faq-l:where(:not(.mx-ferramenta *))::before{content:"";position:absolute;z-index:-1;inset:-35% 0;pointer-events:none;
  background:radial-gradient(closest-side,rgba(43,78,240,.14),transparent)}
.mx-la .fq details:where(:not(.mx-ferramenta *)){position:relative;background:linear-gradient(180deg,#121519,var(--card));transition:box-shadow .35s var(--ease),transform .35s var(--ease)}
.mx-la .fq details[open]:where(:not(.mx-ferramenta *)){background:linear-gradient(180deg,#191114,#121417 70%);box-shadow:0 0 0 1px rgba(91,123,255,.42) inset,0 24px 44px -30px rgba(0,0,0,.9)}
.mx-la .fq summary:where(:not(.mx-ferramenta *)){position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;min-height:64px;padding:12px 14px 12px 18px;transition:transform .18s var(--ease)}
.mx-la .fq summary:active:where(:not(.mx-ferramenta *)){transform:scale(.99)}
.mx-la .fq summary:focus-visible:where(:not(.mx-ferramenta *)){outline-offset:-3px}
.mx-la .ft .nav-logo:where(:not(.mx-ferramenta *)){min-height:44px;align-items:center}
.mx-la .fq-n:where(:not(.mx-ferramenta *)){font-size:.82rem;font-weight:600;letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--dim);transition:color .3s}
.mx-la .fq details[open] .fq-n:where(:not(.mx-ferramenta *)){color:var(--red-hi)}
.mx-la .fq-q:where(:not(.mx-ferramenta *)){min-width:0}
.mx-la .fq-x:where(:not(.mx-ferramenta *)){position:relative;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;box-shadow:0 0 0 1px var(--line2) inset}
.mx-la .fq-x:where(:not(.mx-ferramenta *))::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--red);transform:scale(0);transition:transform .4s var(--ease)}
.mx-la .fq summary .fq-x .ic:where(:not(.mx-ferramenta *)){position:relative;width:18px;height:18px;color:var(--red-hi);transition:transform .45s var(--ease),color .3s}
.mx-la .fq details[open] .fq-x:where(:not(.mx-ferramenta *))::before{transform:scale(1)}
.mx-la .fq details[open] summary .fq-x .ic:where(:not(.mx-ferramenta *)){transform:rotate(135deg);color:#fff}
.mx-la .fq details p:where(:not(.mx-ferramenta *)){padding:0 18px 20px 52px;color:#b7bec7;line-height:1.6}
.mx-la .fq details[open] p:where(:not(.mx-ferramenta *)){animation:fq-resp .55s var(--ease) both .06s}
@keyframes fq-resp{from{opacity:0;transform:translateY(-6px)}}
/* abertura com altura suave onde o navegador sabe animar o conteúdo do <details> */
@supports selector(::details-content){
  .mx-la .fq details::details-content:where(:not(.mx-ferramenta *)){block-size:0;overflow-y:clip;transition:block-size .5s var(--ease),content-visibility .5s allow-discrete}
  .mx-la .fq details[open]::details-content:where(:not(.mx-ferramenta *)){block-size:auto}
}
/* "ver mais": a mesma borda de luz que gira do selo da hero */
.mx-la .fq .fq-mais:where(:not(.mx-ferramenta *)){min-height:48px;margin-top:6px;border:1px solid transparent;box-shadow:0 12px 26px -16px rgba(0,0,0,.9);
  background:linear-gradient(#121418,#121418) padding-box,
    conic-gradient(from var(--sa),transparent 0 62%,rgba(91,123,255,.9) 74%,#fff 78%,rgba(91,123,255,.9) 82%,transparent 94%) border-box,
    linear-gradient(var(--line2),var(--line2)) border-box;
  animation:selo 5s linear 2 both;transition:transform .18s var(--ease)}
.mx-la .fq .fq-mais .ic:where(:not(.mx-ferramenta *)){color:var(--red-hi);transition:transform .35s var(--ease)}
.mx-la .fq .fq-mais:active:where(:not(.mx-ferramenta *)){transform:scale(.98)}
.mx-la .faq-r.open .more-q:where(:not(.mx-ferramenta *)){animation:fq-entra .55s var(--ease) both}
.mx-la .faq-r.open .more-q:nth-of-type(7):where(:not(.mx-ferramenta *)){animation-delay:.07s}
.mx-la .faq-r.open .more-q:nth-of-type(8):where(:not(.mx-ferramenta *)){animation-delay:.14s}
/* aberto, o "+" do botão vira "×" e o botão fecha a lista */
.mx-la .fq .fq-mais[aria-expanded="true"] .ic:where(:not(.mx-ferramenta *)){transform:rotate(45deg)}
@keyframes fq-entra{from{opacity:0;transform:translateY(12px)}}
@media (min-width:600px){.mx-la .fq summary:where(:not(.mx-ferramenta *)){padding-inline:22px 16px;gap:18px}.mx-la .fq details p:where(:not(.mx-ferramenta *)){padding:0 22px 22px 60px}}
@media (max-width:599px){.mx-la .fq details p:where(:not(.mx-ferramenta *)){padding-left:18px}}
@media (hover:hover) and (pointer:fine){
  .mx-la .fq details:not([open]):hover:where(:not(.mx-ferramenta *)){transform:translateY(-2px);box-shadow:0 0 0 1px rgba(255,255,255,.18) inset,0 18px 36px -26px rgba(0,0,0,.9)}
  .mx-la .fq details:not([open]):hover .fq-n:where(:not(.mx-ferramenta *)){color:var(--mut)}
  .mx-la .fq .fq-mais:hover:where(:not(.mx-ferramenta *)){transform:translateY(-2px)}
  .mx-la .fq .fq-mais:hover .ic:where(:not(.mx-ferramenta *)){transform:rotate(90deg)}
}

/* ================= RODAPÉ ================= */
.mx-la .ft:where(:not(.mx-ferramenta *)){position:relative;isolation:isolate;border-top:0;padding-top:clamp(32px,4vw,48px)}
.mx-la .ft-hz:where(:not(.mx-ferramenta *)){position:absolute;left:0;right:0;top:0;height:1px;pointer-events:none;transform-origin:50% 50%;
  background:linear-gradient(90deg,rgba(91,123,255,0),rgba(91,123,255,.75) 50%,rgba(91,123,255,0)),var(--line)}
.mx-la .ft-hz:where(:not(.mx-ferramenta *))::after{content:"";position:absolute;left:10%;right:10%;top:0;height:90px;background:radial-gradient(50% 100% at 50% 0,rgba(43,78,240,.16),transparent 72%)}
.mx-la .ft-hz:where(:not(.mx-ferramenta *))::before{content:"";position:absolute;left:0;top:-1px;width:16%;height:3px;border-radius:3px;opacity:0;transform:translateX(-100%);
  background:linear-gradient(90deg,rgba(120,145,255,0),rgba(120,145,255,.9) 70%,#f4f6ff)}
.mx-la .ft-elo:where(:not(.mx-ferramenta *)){display:none;position:absolute;z-index:-1;right:0;bottom:78px;width:clamp(150px,15vw,210px);height:auto;fill:none;stroke-width:28;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;--dr:0}
.mx-la .ft-elo path:where(:not(.mx-ferramenta *)){stroke-dasharray:100;stroke-dashoffset:var(--dr)}
.mx-la .ft-elo .r:where(:not(.mx-ferramenta *)){stroke:rgba(48,86,255,.26)}
.mx-la .ft-elo .b:where(:not(.mx-ferramenta *)){stroke:rgba(246,245,242,.09)}
.mx-la .ft .foot-cols h3:where(:not(.mx-ferramenta *)){color:var(--tx)}
.mx-la .ft .foot-cols a:where(:not(.mx-ferramenta *)){position:relative;transition:color .25s}
.mx-la .ft .foot-cols a:where(:not(.mx-ferramenta *))::after{content:"";position:absolute;left:0;right:0;bottom:10px;height:1px;background:var(--red-hi);transform:scaleX(0);transform-origin:100% 50%;transition:transform .4s var(--ease)}
.mx-la .ft .foot-cols a:active:where(:not(.mx-ferramenta *)){transform:scale(.98)}
.mx-la .ft .foot-bot:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:12px}
.mx-la .ft .foot-bot>span:where(:not(.mx-ferramenta *)){grid-column:2}
.mx-la .ft-topo:where(:not(.mx-ferramenta *)){grid-column:3;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--tx);box-shadow:0 0 0 1px var(--line2) inset;transition:transform .25s var(--ease)}
.mx-la .ft-topo .ic:where(:not(.mx-ferramenta *)){width:18px;height:18px;transform:rotate(-90deg);color:var(--red-hi)}
.mx-la .ft-topo:active:where(:not(.mx-ferramenta *)){transform:scale(.96)}
@media (min-width:700px){.mx-la .ft-elo:where(:not(.mx-ferramenta *)){display:block}}
/* entrada: a linha acende do centro, a faísca corre o horizonte uma vez, as colunas sobem e o elo se desenha */
.mx-la.lc-js .ft .ft-hz:where(:not(.mx-ferramenta *)){transform:scaleX(0)}
.mx-la.lc-js .ft.in .ft-hz:where(:not(.mx-ferramenta *)){animation:ft-acende 1.2s var(--ease) both}
.mx-la.lc-js .ft.in .ft-hz:where(:not(.mx-ferramenta *))::before{animation:ft-faisca 2.4s cubic-bezier(.45,0,.25,1) .7s both}
.mx-la.lc-js .ft .foot-top:where(:not(.mx-ferramenta *)), .mx-la.lc-js .ft .foot-cols>div:where(:not(.mx-ferramenta *)), .mx-la.lc-js .ft .foot-bot:where(:not(.mx-ferramenta *)){opacity:0;translate:0 14px}
.mx-la.lc-js .ft.in .foot-top:where(:not(.mx-ferramenta *)), .mx-la.lc-js .ft.in .foot-cols>div:where(:not(.mx-ferramenta *)), .mx-la.lc-js .ft.in .foot-bot:where(:not(.mx-ferramenta *)){animation:bt-entra .7s var(--ease) both}
.mx-la.lc-js .ft.in .foot-cols>div:nth-child(1):where(:not(.mx-ferramenta *)){animation-delay:.12s}
.mx-la.lc-js .ft.in .foot-cols>div:nth-child(2):where(:not(.mx-ferramenta *)){animation-delay:.2s}
.mx-la.lc-js .ft.in .foot-cols>div:nth-child(3):where(:not(.mx-ferramenta *)){animation-delay:.28s}
.mx-la.lc-js .ft.in .foot-bot:where(:not(.mx-ferramenta *)){animation-delay:.36s}
.mx-la.lc-js .ft .ft-elo:where(:not(.mx-ferramenta *)){--dr:100}
.mx-la.lc-js .ft.in .ft-elo:where(:not(.mx-ferramenta *)){animation:bt-desenha 2.2s var(--ease) .3s both}
@keyframes ft-acende{from{transform:scaleX(0)}to{transform:none}}
@keyframes ft-faisca{0%{opacity:0;transform:translateX(-100%)}12%{opacity:1}88%{opacity:1}100%{opacity:0;transform:translateX(625%)}}
@media (hover:hover) and (pointer:fine){
  .mx-la .ft .foot-cols a:hover:where(:not(.mx-ferramenta *))::after{transform:scaleX(1);transform-origin:0 50%}
  .mx-la .ft-topo:hover:where(:not(.mx-ferramenta *)){transform:translateY(-3px);box-shadow:0 0 0 1px rgba(91,123,255,.6) inset}
}

/* ================= menos movimento: nada se desloca, nada em laço; só um esmaecimento curto ================= */
@media (prefers-reduced-motion:reduce){
  .mx-la .fq .fq-mais:where(:not(.mx-ferramenta *)){animation:none!important}
  .mx-la.lc-js .pv-shot:where(:not(.mx-ferramenta *)), .mx-la.lc-js .pv-shot.on:where(:not(.mx-ferramenta *)){transform:none!important;transition:opacity .25s linear!important}
  .mx-la .pv-ind:where(:not(.mx-ferramenta *)), .mx-la .pv-giro:where(:not(.mx-ferramenta *)){transition:none!important}
  .mx-la .pv-giro:where(:not(.mx-ferramenta *)){transform:none!important}
  .mx-la.lc-js .pv-mira i:where(:not(.mx-ferramenta *)), .mx-la.lc-js .pv-chip:where(:not(.mx-ferramenta *)){transform:none;scale:1;transition:opacity .3s linear!important;transition-delay:0s!important}
  .mx-la .pv-chip:where(:not(.mx-ferramenta *)){transform:none}
  .mx-la.lc-js .ft .foot-top:where(:not(.mx-ferramenta *)), .mx-la.lc-js .ft .foot-cols>div:where(:not(.mx-ferramenta *)), .mx-la.lc-js .ft .foot-bot:where(:not(.mx-ferramenta *)){translate:none}
  .mx-la.lc-js .ft.in .foot-top:where(:not(.mx-ferramenta *)), .mx-la.lc-js .ft.in .foot-cols>div:where(:not(.mx-ferramenta *)), .mx-la.lc-js .ft.in .foot-bot:where(:not(.mx-ferramenta *)){animation:lc-fade .3s linear both!important}
  .mx-la.lc-js .ft .ft-elo:where(:not(.mx-ferramenta *)){--dr:0}
  .mx-la.lc-js .ft .ft-hz:where(:not(.mx-ferramenta *)){transform:none}
  .mx-la.lc-js .ft.in .ft-hz:where(:not(.mx-ferramenta *)), .mx-la.lc-js .ft.in .ft-hz:where(:not(.mx-ferramenta *))::before, .mx-la.lc-js .ft.in .ft-elo:where(:not(.mx-ferramenta *)), .mx-la .fq details[open] p:where(:not(.mx-ferramenta *)), .mx-la .faq-r.open .more-q:where(:not(.mx-ferramenta *)), .mx-la .pv-tela.troca .pv-varre:where(:not(.mx-ferramenta *)){animation:none!important}
  .mx-la .fq details::details-content:where(:not(.mx-ferramenta *)){transition:none!important}
}
@keyframes lc-fade{from{opacity:0}to{opacity:1}}
.mx-la .fq.off .fq-mais:where(:not(.mx-ferramenta *)){animation-play-state:paused}

/* #painel: a janela de navegador desenhada (3 bolinhas e barra de endereço) saiu (10/11/2026).
   Celular: iPhone 16 Pro Max preto com a captura em largura de celular; a partir de 600px: MacBook Pro 16 com a captura de computador.
   Os dois da extensão Mobile Simulator, com a tela pelos números do viewport (nunca de olho). */
.mx-la .pv-win:where(:not(.mx-ferramenta *)){width:min(100%,19rem);margin-inline:auto;aspect-ratio:481/991;padding:0;border-radius:0;background:none;box-shadow:none;filter:drop-shadow(0 40px 50px rgba(0,0,0,.7))}
.mx-la .pv-mold:where(:not(.mx-ferramenta *)){position:absolute;inset:0;z-index:0;width:100%;height:100%;max-width:none;pointer-events:none;user-select:none}
.mx-la .pv-mold--pc:where(:not(.mx-ferramenta *)){display:none}
.mx-la .pv-in:where(:not(.mx-ferramenta *)){position:absolute;z-index:1;left:4.3659%;top:1.8163%;width:91.4761%;height:96.4682%;border-radius:17.73% / 8.16%}
.mx-la .pv-in:where(:not(.mx-ferramenta *))::after{content:"";position:absolute;z-index:4;left:34.43%;top:1.569%;width:31.09%;height:4.121%;border-radius:99px;background:#050505;pointer-events:none}
.mx-la .pv-tela:where(:not(.mx-ferramenta *)){height:100%;aspect-ratio:auto}
@media (min-width:600px){
  .mx-la .pv-win:where(:not(.mx-ferramenta *)){width:100%;aspect-ratio:2122/1297;filter:drop-shadow(0 50px 60px rgba(0,0,0,.75))}
  .mx-la .pv-mold--cel:where(:not(.mx-ferramenta *)){display:none}
  .mx-la .pv-mold--pc:where(:not(.mx-ferramenta *)){display:block}
  .mx-la .pv-in:where(:not(.mx-ferramenta *)){left:9.2837%;top:5.0116%;width:81.4326%;height:83.6546%;border-radius:.5% / .8%}
  .mx-la .pv-in:where(:not(.mx-ferramenta *))::after, .mx-la .pv-tela:where(:not(.mx-ferramenta *))::after{display:none}
  .mx-la .pv-tela:where(:not(.mx-ferramenta *)){aspect-ratio:auto}
}

/* #painel no celular: o print começa ABAIXO da barra de status do iOS (6,5% da tela, na cor do topo do app), como o iPhone da hero; a ilha fica sobre a barra e nunca cobre o cabeçalho. O print desce e é cortado no fim, sem esticar. */
.mx-la .pv-in:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;container-type:size;background:#0a0b0d}
.mx-la .pv-status:where(:not(.mx-ferramenta *)){flex:none;height:6.5%;display:flex;align-items:center;justify-content:space-between;padding:0 7.4cqw 0 10.5cqw;color:#fff;background:#0a0b0d}
.mx-la .pv-status b:where(:not(.mx-ferramenta *)){font-size:4.5cqw;font-weight:600;letter-spacing:-.01em}
.mx-la .pv-sb:where(:not(.mx-ferramenta *)){display:flex;align-items:center;gap:1.5cqw}
.mx-la .pv-sb svg:where(:not(.mx-ferramenta *)){height:3.3cqw;width:auto;fill:#fff}
.mx-la .pv-bat:where(:not(.mx-ferramenta *)){position:relative;display:block;width:7.3cqw;height:3.5cqw;border-radius:1.1cqw;box-shadow:0 0 0 1px rgba(255,255,255,.45) inset}
.mx-la .pv-bat i:where(:not(.mx-ferramenta *)){position:absolute;inset:.6cqw;right:1.5cqw;border-radius:.6cqw;background:#fff}
.mx-la .pv-tela:where(:not(.mx-ferramenta *)){flex:1 1 0;min-height:0;height:auto}
.mx-la .pv-shot img:where(:not(.mx-ferramenta *)){object-position:50% 0}
@media (max-width:599px){.mx-la .pc-2:where(:not(.mx-ferramenta *)){right:3%}}
@media (min-width:600px){.mx-la .pv-status:where(:not(.mx-ferramenta *)){display:none}}

/* ---- la-rede.css ---- */
/* Link Affiliattes — #rede: clone do bento "1M+ / 2M+ / 20+" da a referência (a referência).
   Medidas 1:1 com a referência (grade de 944, cartão de raio 40 com borda em degradê, título 24→40,
   botão de 48, carrossel centrado de 160); trocados a copy, a foto (mão + print real da Rede no painel),
   a cor de destaque (verde → vermelho da marca) e a família da letra (Public Sans). */

.mx-la #rede .rd-in:where(:not(.mx-ferramenta *)){max-width:944px;margin-inline:auto}
/* o celular passa da borda de cima do cartão grande (64px até 1279, 95px dali para cima):
   o cabeçalho abre espaço para ele não encostar no texto */
@media (min-width:768px){.mx-la #rede .sec-head:where(:not(.mx-ferramenta *)){margin-bottom:96px}}
@media (min-width:1280px){.mx-la #rede .sec-head:where(:not(.mx-ferramenta *)){margin-bottom:128px}}

/* ---------- grade ---------- */
.mx-la .rd-grid:where(:not(.mx-ferramenta *)){display:grid;gap:16px}
.mx-la .rd-big:where(:not(.mx-ferramenta *)){grid-column:1/-1}
@media (min-width:768px){.mx-la .rd-grid:where(:not(.mx-ferramenta *)){grid-template-columns:1fr 1fr;grid-template-rows:minmax(320px,1fr)}}
@media (min-width:1280px){.mx-la .rd-grid:where(:not(.mx-ferramenta *)){grid-template-rows:440px minmax(360px,1fr)}}

/* ---------- cartão: borda de 1px em degradê + miolo em degradê radial ---------- */
.mx-la .rd-hide:where(:not(.mx-ferramenta *)), .mx-la .rd-borda:where(:not(.mx-ferramenta *)), .mx-la .rd-card:where(:not(.mx-ferramenta *)){height:100%}
.mx-la .rd-borda:where(:not(.mx-ferramenta *)){padding:1px;border-radius:40px;background:linear-gradient(148.42deg,#333 13.56%,#111 80.96%)}
.mx-la .rd-card:where(:not(.mx-ferramenta *)){position:relative;border-radius:40px;background:radial-gradient(100.15% 191.04% at 15.32% 0%,#171717 0%,#101010 66.17%)}

/* revelar ao entrar na tela, como a referência: sobe 35% e acende em .6s */
.mx-la.js-ok .rd-hide:where(:not(.mx-ferramenta *)){opacity:0;transform:translateY(35%);transition:transform .6s ease-out,opacity .6s ease-out}
.mx-la.js-ok .rd-c.on .rd-hide:where(:not(.mx-ferramenta *)){opacity:1;transform:none}

/* ---------- título: a primeira parte acende do cinza para o branco ---------- */
.mx-la .rd-h3:where(:not(.mx-ferramenta *)){margin:0 0 16px;font-size:24px;line-height:1.06;font-weight:600;letter-spacing:-.02em;color:rgba(255,255,255,.56);text-wrap:pretty}
.mx-la .rd-h3 span:where(:not(.mx-ferramenta *)){color:#fff}
.mx-la.js-ok .rd-h3 span:where(:not(.mx-ferramenta *)){color:rgba(255,255,255,.56)}
.mx-la.js-ok .rd-c.on .rd-h3 span:where(:not(.mx-ferramenta *)){animation:rd-luz .6s .3s forwards}
@keyframes rd-luz{from{color:rgba(255,255,255,.56)}to{color:#fff}}
@media (min-width:1280px){.mx-la .rd-h3:where(:not(.mx-ferramenta *)){font-size:40px}}

/* ---------- cartão grande ---------- */
.mx-la .rd-big-in:where(:not(.mx-ferramenta *)){padding-top:40px;text-align:center}
.mx-la .rd-big-head:where(:not(.mx-ferramenta *)){max-width:272px;margin:0 auto}
.mx-la .rd-cta:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;align-items:center;padding-top:8px}
/* o botão do cartão é o .btn-neon do la.css (27/10/2026): o vermelho chapado .rd-btn saiu de todas as páginas */
.mx-la .rd-link:focus-visible:where(:not(.mx-ferramenta *)){outline:2px solid var(--red-hi);outline-offset:3px}

/* a imagem tem 18,2% de vazio à direita do braço: a margem negativa do mesmo tamanho, dentro de quem recorta
   (sangria deliberada), leva a manga até a borda do cartão, que corta o pulso no canto como na referência.
   No celular a foto encosta à direita; com o cartão acima de 400px, o respiro da direita cresce metade do que
   sobra e o celular volta para perto do meio (medido na referência em 600 px: a manga para a 90 px da borda;
   aqui, a ~76) */
.mx-la .rd-foto:where(:not(.mx-ferramenta *)){margin:40px auto 0;padding-right:max(0px,calc((100% - 400px) / 2));display:flex;justify-content:flex-end;overflow:hidden;border-radius:40px}
.mx-la .rd-foto-box:where(:not(.mx-ferramenta *)){position:relative;flex:none;width:333px;bottom:-4px;margin-right:-60px;container-type:inline-size}
.mx-la .rd-foto-box img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:auto;aspect-ratio:696/803}

@media (min-width:768px){
  .mx-la .rd-big-in:where(:not(.mx-ferramenta *)){position:relative;min-height:320px;padding:40px 32px;display:flex;align-items:center;text-align:left}
  .mx-la .rd-big-head:where(:not(.mx-ferramenta *)){max-width:304px;margin:0}
  .mx-la .rd-cta:where(:not(.mx-ferramenta *)){align-items:flex-start}
  /* daqui para cima o recorte só arredonda o canto do cartão (embaixo à direita) e abre 24px à esquerda do celular:
     a etiqueta da esquerda passa da borda da foto e, sem a folga, o texto dela saía cortado reto (achado do de audit) */
  .mx-la .rd-foto:where(:not(.mx-ferramenta *)){position:absolute;bottom:0;right:0;margin:0;padding:0 0 0 24px;border-radius:0 0 40px 0}
  .mx-la .rd-foto-box:where(:not(.mx-ferramenta *)){bottom:0}
}
@media (min-width:1280px){
  .mx-la .rd-big-in:where(:not(.mx-ferramenta *)){min-height:440px}
  .mx-la .rd-big-head:where(:not(.mx-ferramenta *)){max-width:400px}
  .mx-la .rd-foto-box:where(:not(.mx-ferramenta *)){width:464px;margin-right:-84px}
}

/* etiquetas "+ R$" flutuando em volta do celular: fundo escuro, borda vermelha com brilho, um lado inclinado */
.mx-la .rd-tag:where(:not(.mx-ferramenta *)){position:absolute;left:var(--x);top:var(--y);width:24cqw;height:9.6cqw;display:grid;place-items:center;
  padding-left:1.6cqw;font-size:4cqw;line-height:1.2;font-weight:600;letter-spacing:-.02em;color:#fff;white-space:nowrap;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 72' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23341311'/%3E%3Cstop offset='1' stop-color='%23110d0d'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M32 1.5H166Q178.5 1.5 178.5 14V58Q178.5 70.5 166 70.5H14Q1.5 70.5 4.5 58L17.5 14Q20.5 1.5 32 1.5Z' fill='url(%23g)' fill-opacity='.9' stroke='%23ff5448' stroke-width='2'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  filter:drop-shadow(0 0 1.6cqw rgba(91,123,255,.45))}
.mx-la .rd-tag-d:where(:not(.mx-ferramenta *)){padding-left:0;padding-right:1.6cqw;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 72' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23341311'/%3E%3Cstop offset='1' stop-color='%23110d0d'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M148 1.5H14Q1.5 1.5 1.5 14V58Q1.5 70.5 14 70.5H166Q178.5 70.5 175.5 58L162.5 14Q159.5 1.5 148 1.5Z' fill='url(%23g)' fill-opacity='.9' stroke='%23ff5448' stroke-width='2'/%3E%3C/svg%3E")}
/* posições: as da referência, recalculadas para o celular da nossa foto (x 13–51%, y 0–68%):
   uma sobre a borda direita em cima, uma à direita no meio, uma sobre a borda esquerda */
.mx-la .rd-t1:where(:not(.mx-ferramenta *)){--x:42%;--y:3%}
.mx-la .rd-t2:where(:not(.mx-ferramenta *)){--x:52%;--y:29.5%}
.mx-la .rd-t3:where(:not(.mx-ferramenta *)){--x:-2%;--y:37.5%}   /* ~36% dela sobre o celular, como a "+$150" da referência */

/* ---------- cartões pequenos ---------- */
.mx-la .rd-sm:where(:not(.mx-ferramenta *)){display:grid;min-height:296px;padding:40px 32px}
.mx-la .rd-sm-head:where(:not(.mx-ferramenta *)){max-width:272px}
@media (min-width:768px){.mx-la .rd-sm:where(:not(.mx-ferramenta *)){min-height:400px}.mx-la .rd-sm-head:where(:not(.mx-ferramenta *)){max-width:304px}}
@media (min-width:1280px){.mx-la .rd-sm:where(:not(.mx-ferramenta *)){min-height:440px}.mx-la .rd-sm-head:where(:not(.mx-ferramenta *)){max-width:400px}}

.mx-la .rd-ln:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;align-items:flex-start;row-gap:12px}
.mx-la .rd-link:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;min-height:44px;margin-block:-10px;transform:translateX(4px);
  color:var(--red-hi);font-size:14px;line-height:21px;font-weight:600;white-space:nowrap;transition:color .3s}
@media (min-width:768px){.mx-la .rd-link:where(:not(.mx-ferramenta *)){font-size:16px;line-height:24px}}
.mx-la .rd-seta:where(:not(.mx-ferramenta *)){position:relative;left:-8px;width:7px;height:12px;margin-left:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media (hover:hover) and (pointer:fine) and (min-width:1280px){.mx-la .rd-link:hover .rd-seta:where(:not(.mx-ferramenta *)){animation:rd-vai .6s infinite}}
@keyframes rd-vai{0%{left:-8px}50%{left:0}100%{left:-8px}}

/* fileira de quem entrou na rede (o lugar dos ícones sociais da referência) */
.mx-la .rd-av:where(:not(.mx-ferramenta *)){display:flex;gap:12px;margin:auto 0 0;padding:0;list-style:none}
.mx-la .rd-av li:where(:not(.mx-ferramenta *)){width:40px;height:40px;display:grid;place-items:center;border:1.5px solid #fff;border-radius:11px;
  font-size:13px;font-weight:600;letter-spacing:.02em;color:#fff}
.mx-la .rd-av svg:where(:not(.mx-ferramenta *)){width:18px;height:18px;fill:none;stroke:var(--red-hi);stroke-width:2.2;stroke-linecap:round}
.mx-la .rd-av .rd-av-mais:where(:not(.mx-ferramenta *)){border-color:var(--red-hi)}

/* cartão das etapas: o carrossel vai de borda a borda */
.mx-la .rd-sm-sl:where(:not(.mx-ferramenta *)){padding:40px 0;min-height:350px}
.mx-la .rd-sm-sl .rd-sm-head:where(:not(.mx-ferramenta *)){max-width:375px;padding:0 32px}
@media (min-width:1280px){.mx-la .rd-sm-sl .rd-sm-head:where(:not(.mx-ferramenta *)){max-width:100%}}
.mx-la .rd-sl:where(:not(.mx-ferramenta *)){position:relative;margin-top:auto;overflow:hidden}
/* o leitor de tela lê as quatro etapas paradas; a trilha que anda fica escondida dele */
.mx-la .rd-sr:where(:not(.mx-ferramenta *)){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.mx-la .rd-sl-trk:where(:not(.mx-ferramenta *)){display:flex;margin:0;padding:0;list-style:none}
.mx-la .rd-sl-trk li:where(:not(.mx-ferramenta *)){flex:0 0 160px;display:grid;justify-items:center;align-content:start;gap:8px}
/* as etapas dos lados ficam apagadas, como na referência, mas por COR e não por opacidade: a .3 a letra caía
   para 1:1; assim a apagada já tem 5:1 e, ao acender, só o fundo da pílula clareia (nenhum meio-termo abaixo de 4,5) */
.mx-la .rd-pill:where(:not(.mx-ferramenta *)){width:fit-content;margin:0;padding:8px 12px;border-radius:20px;background:#8a8a8a;color:#101010;font-size:20px;line-height:20px;font-weight:600;letter-spacing:-.02em;transition:background-color .6s}
.mx-la .rd-tit:where(:not(.mx-ferramenta *)){margin:0;padding:0 8px;text-align:center;font-size:16px;line-height:24px;color:#888;transition:color .6s}
.mx-la .rd-sl-trk li.on .rd-pill:where(:not(.mx-ferramenta *)){background:#fff}
.mx-la .rd-sl-trk li.on .rd-tit:where(:not(.mx-ferramenta *)){color:#fff}
/* sem JS, ou com "menos movimento" ligado: as quatro etapas em grade, paradas e todas acesas */
.mx-la:not(.js-ok) .rd-sl-trk:where(:not(.mx-ferramenta *)), .mx-la .rd-sl.parado .rd-sl-trk:where(:not(.mx-ferramenta *)){flex-wrap:wrap;justify-content:center;row-gap:16px}
.mx-la:not(.js-ok) .rd-sl-trk .rd-pill:where(:not(.mx-ferramenta *)), .mx-la .rd-sl.parado .rd-sl-trk .rd-pill:where(:not(.mx-ferramenta *)){background:#fff}
.mx-la:not(.js-ok) .rd-sl-trk .rd-tit:where(:not(.mx-ferramenta *)), .mx-la .rd-sl.parado .rd-sl-trk .rd-tit:where(:not(.mx-ferramenta *)){color:#fff}

@media (prefers-reduced-motion:reduce){
  .mx-la.js-ok .rd-hide:where(:not(.mx-ferramenta *)){transform:none;transition:opacity .3s}
}

/* ---- la-encontro.css ---- */
/* Link Affiliattes — o encontro entre as seções (18/10/2026).
   Pedido do Victor: "não pode ser cinza o fundo das páginas" e "um encontro elegante, impactante e muito fluido em
   todas as seções". A página tem um fundo só (preto puro + o grão do body, no la.css) e nenhuma seção pinta fundo de
   ponta a ponta. Em cada fronteira mora um .enc de altura zero, na camada de baixo da raiz (z-index -1): passa por baixo
   do conteúdo das duas seções e atravessa a fronteira sem corte, porque não está dentro de caixa nenhuma que recorte.
   O desenho repete a língua da hero: o brilho vermelho da atmosfera (.enc-luz) e, nas fronteiras do meio da página,
   um horizonte distante (.enc-arco: arco achatado com a borda acesa). Ao rolar, a luz cresce, o arco se abre do centro e
   uma faísca corre a borda (CSS puro, animation-timeline). Sem suporte ou com menos movimento, fica o estado final, parado.
   Largura nunca passa de 100%: zero rolagem lateral. Tudo aria-hidden no HTML. */
@property --enc-a{syntax:"<angle>";inherits:false;initial-value:-80deg}

.mx-la .enc:where(:not(.mx-ferramenta *)){position:relative;z-index:-1;height:0;pointer-events:none;view-timeline:--enc block}
.mx-la .enc>i:where(:not(.mx-ferramenta *)){position:absolute;left:0;right:0;margin-inline:auto;display:block}

/* a luz: larga, centrada na própria fronteira, e se apaga antes de qualquer borda da caixa */
.mx-la .enc-luz:where(:not(.mx-ferramenta *)){--h:clamp(300px,40vw,560px);top:calc(var(--h) * -.5);width:100%;height:var(--h);
  background:radial-gradient(48% 50% at 50% 50%,rgba(43,78,240,.15),rgba(43,78,240,.055) 46%,transparent 74%)}
/* saindo do planeta da hero, a luz é mais quente e desce mais: a borda acesa dele continua na página */
.mx-la .enc-hero .enc-luz:where(:not(.mx-ferramenta *)){--h:clamp(340px,48vw,680px);
  background:radial-gradient(52% 50% at 50% 50%,rgba(40,75,232,.19),rgba(43,78,240,.07) 44%,transparent 74%)}

/* o horizonte: só a borda de cima de uma elipse achatada aparece (as máscaras apagam as pontas e a metade de baixo) */
.mx-la .enc-arco:where(:not(.mx-ferramenta *)){top:0;width:min(100%,1480px);aspect-ratio:4.2/1;border-radius:50%;
  background:radial-gradient(50% 50% at 50% 50%,transparent 76%,rgba(43,78,240,.07) 90%,rgba(72,106,255,.2) 100%);
  box-shadow:0 0 0 1px rgba(80,112,255,.5) inset;
  -webkit-mask:linear-gradient(90deg,transparent 4%,#000 30%,#000 70%,transparent 96%),linear-gradient(#000 20%,transparent 46%);
  -webkit-mask-composite:source-in;
  mask:linear-gradient(90deg,transparent 4%,#000 30%,#000 70%,transparent 96%),linear-gradient(#000 20%,transparent 46%);
  mask-composite:intersect}
/* a faísca que corre a borda (o mesmo desenho do .la-horiz do #demo e do .ft-hz do rodapé) */
.mx-la .enc-arco:where(:not(.mx-ferramenta *))::before{content:"";position:absolute;inset:0;border-radius:50%;padding:1.5px;opacity:0;
  background:conic-gradient(from var(--enc-a),#fff 0deg,rgba(136,158,255,.6) 2deg,transparent 8deg,transparent 352deg,rgba(136,158,255,.6) 358deg,#fff 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}

/* a rolagem conduz: a luz cresce e o arco se abre do centro enquanto a fronteira sobe da base até o meio da tela,
   e a faísca atravessa a borda nesse caminho. Só transform, opacity e o ângulo registrado. */
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .mx-la .enc-luz:where(:not(.mx-ferramenta *)){animation:enc-luz linear both;animation-timeline:--enc;animation-range:entry 0% cover 50%}
    .mx-la .enc-arco:where(:not(.mx-ferramenta *)){animation:enc-abre linear both;animation-timeline:--enc;animation-range:entry 0% cover 48%}
    .mx-la .enc-arco:where(:not(.mx-ferramenta *))::before{animation:enc-corre linear both;animation-timeline:--enc;animation-range:cover 18% cover 72%}
  }
}
@keyframes enc-luz{from{opacity:.3}to{opacity:1}}
@keyframes enc-abre{from{opacity:.15;transform:scaleX(.62)}to{opacity:1;transform:none}}
@keyframes enc-corre{0%{--enc-a:-80deg;opacity:0}14%{opacity:1}84%{opacity:1}100%{--enc-a:80deg;opacity:0}}

/* ---- lp.css ---- */
/* Link Affiliattes — kit das páginas internas (18/10/2026).
   Carrega DEPOIS de la.css + la-c.css + la-encontro.css + la-rede.css. Vocabulário clonado da a referência
   (a referência container de 944, H1 56, H2 40, h3 de cartão 24, corpo 16/24 a 56% de branco, cartão de raio 40
   com borda em degradê, revelação ao entrar na tela), trocados cor (verde → vermelho da marca), fonte (Public Sans)
   e mídia (renders e prints próprios). Fundo único preto: nenhuma seção pinta fundo de ponta a ponta. */

.mx-la{--lp-mut:rgba(255,255,255,.56);--lp-mut2:rgba(255,255,255,.66);--lp-w:944px}

/* ---------- molde ---------- */
.mx-la .lp-s:where(:not(.mx-ferramenta *)){position:relative;padding-block:var(--sec)}
.mx-la .lp-in:where(:not(.mx-ferramenta *)){width:min(100% - var(--pad)*2,var(--lp-w));margin-inline:auto}
.mx-la .lp-in--l:where(:not(.mx-ferramenta *)){width:min(100% - var(--pad)*2,1200px)}
.mx-la .lp-head:where(:not(.mx-ferramenta *)){display:grid;justify-items:center;gap:16px;max-width:720px;margin:0 auto clamp(32px,5vw,56px);text-align:center}
.mx-la .lp-head--l:where(:not(.mx-ferramenta *)){justify-items:start;text-align:left;margin-inline:0}
.mx-la .lp-h1:where(:not(.mx-ferramenta *)){font-size:clamp(2rem,1.1rem + 3.9vw,3.5rem);line-height:1;font-weight:600;letter-spacing:-.02em;text-wrap:balance;color:#fff}
.mx-la .lp-h2:where(:not(.mx-ferramenta *)){font-size:clamp(1.75rem,1.2rem + 2.2vw,2.5rem);line-height:1;font-weight:600;letter-spacing:-.02em;text-wrap:balance;color:#fff}
.mx-la .lp-h1 .a:where(:not(.mx-ferramenta *)), .mx-la .lp-h2 .a:where(:not(.mx-ferramenta *)){color:var(--red-hi)}
.mx-la .lp-h1 .g:where(:not(.mx-ferramenta *)), .mx-la .lp-h2 .g:where(:not(.mx-ferramenta *)){color:var(--lp-mut)}
.mx-la .lp-p:where(:not(.mx-ferramenta *)){font-size:1rem;line-height:1.5;color:var(--lp-mut);text-wrap:pretty}
.mx-la .lp-p a:where(:not(.mx-ferramenta *)), .mx-la .lp-txt a:where(:not(.mx-ferramenta *)){color:var(--red-hi);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.mx-la .lp-p b:where(:not(.mx-ferramenta *)), .mx-la .lp-p strong:where(:not(.mx-ferramenta *)){color:#fff;font-weight:600}
.mx-la .lp-s .cap:where(:not(.mx-ferramenta *)){max-width:none;text-align:center;margin-top:24px}

/* ---------- hero (cobre a tela inteira; a mesma língua da home: preto, brilho vermelho, horizonte aceso) ---------- */
.mx-la .lp-hero:where(:not(.mx-ferramenta *)){position:relative;isolation:isolate;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:112px var(--pad) 96px;text-align:center;overflow:hidden;contain:paint;
  background:radial-gradient(60% 42% at 50% 0,rgba(43,78,240,.13) 0,transparent 72%)}
.mx-la .lp-hero-c:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;gap:clamp(16px,2vw,24px);width:min(100%,860px)}
/* tela baixa (celular deitado, notebook pequeno): o herói perde respiro, nunca conteúdo, para o botão principal continuar na primeira tela */
@media (max-height:600px){.mx-la .lp-hero:where(:not(.mx-ferramenta *)){padding-top:84px}.mx-la .lp-hero-c:where(:not(.mx-ferramenta *)){gap:10px}}
.mx-la .lp-hero .lp-h1.rw:where(:not(.mx-ferramenta *)){font-size:clamp(1.75rem,.9rem + 3.9vw,3.5rem);line-height:1;font-weight:600;letter-spacing:-.02em;color:#fff;max-width:100%}
.mx-la .lp-hero .lp-h1 .line:where(:not(.mx-ferramenta *)){text-wrap:balance;overflow-wrap:anywhere}
.mx-la .lp-hero .lp-lede:where(:not(.mx-ferramenta *)){max-width:38em;font-size:clamp(1rem,.95rem + .3vw,1.125rem);line-height:1.5;color:var(--lp-mut2);text-wrap:pretty}
.mx-la .lp-hero .lp-sub:where(:not(.mx-ferramenta *)){font-size:.9rem;color:var(--lp-mut)}
.mx-la .lp-hero .lp-sub>a:not([class]):where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;min-height:44px;color:var(--tx);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.3)}
.mx-la .lp-hint:where(:not(.mx-ferramenta *)){position:absolute;left:0;right:0;bottom:22px;display:grid;justify-items:center;gap:4px;font-size:.8rem;letter-spacing:.04em;color:var(--lp-mut);pointer-events:none;transition:opacity .4s}
.mx-la .lp-hint svg:where(:not(.mx-ferramenta *)){width:16px;height:16px;transform:rotate(90deg);animation:lp-desce 1.8s ease-in-out infinite;color:var(--red-hi)}
.mx-la .lp-hint.off:where(:not(.mx-ferramenta *)){opacity:0}
@keyframes lp-desce{0%,100%{translate:0 -2px}50%{translate:0 4px}}
/* trilha de navegação (a BreadcrumbList também vai no JSON-LD) */
.mx-la .lp-bc:where(:not(.mx-ferramenta *)){list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:0 8px;font-size:.85rem;color:var(--lp-mut)}
.mx-la .lp-bc a:where(:not(.mx-ferramenta *)){display:inline-flex;align-items:center;min-height:44px;color:var(--lp-mut2);transition:color .2s}
.mx-la .lp-bc li:where(:not(.mx-ferramenta *)){display:flex;align-items:center;gap:8px}
.mx-la .lp-bc li+li:where(:not(.mx-ferramenta *))::before{content:"";width:5px;height:5px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);opacity:.55}
.mx-la .lp-bc [aria-current]:where(:not(.mx-ferramenta *)){color:#fff}
@media (hover:hover) and (pointer:fine){.mx-la .lp-bc a:hover:where(:not(.mx-ferramenta *)){color:#fff}}

/* hero com a janela do painel em perspectiva, que some para o preto (a da a referência: terminal inclinado) */
.mx-la .lp-hero--janela:where(:not(.mx-ferramenta *)){justify-content:flex-start;padding-bottom:0}
.mx-la .lp-persp:where(:not(.mx-ferramenta *)){position:relative;width:min(100%,1120px);margin:clamp(28px,4vw,48px) auto 0;perspective:1600px;
  -webkit-mask:linear-gradient(#000 38%,#0000 94%);mask:linear-gradient(#000 38%,#0000 94%)}
.mx-la .lp-persp-in:where(:not(.mx-ferramenta *)){transform:rotateX(36deg) scale(.94);transform-origin:50% 0;border-radius:20px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.14) inset,0 40px 120px -30px rgba(43,78,240,.35)}
.mx-la .lp-persp-in img:where(:not(.mx-ferramenta *)){width:100%;height:auto}
@media (max-width:599px){.mx-la .lp-persp-in:where(:not(.mx-ferramenta *)){transform:rotateX(28deg) scale(.96)}}
@media (min-width:600px) and (max-width:1439px){.mx-la .lp-hero--janela .lp-persp:where(:not(.mx-ferramenta *)){width:min(100%,1120px,calc(70vw + 116px))}}

/* hero com a imagem cobrindo a tela inteira (cena própria, escurecida para o texto) */
.mx-la .lp-hero--img:where(:not(.mx-ferramenta *))::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.2) 40%,rgba(0,0,0,.78) 100%)}
.mx-la .lp-hero-bg:where(:not(.mx-ferramenta *)){position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%)}

/* ---------- passos: texto à esquerda, celular no meio e o selo à direita (a referência: linhas de 408) ---------- */
.mx-la .lp-passos:where(:not(.mx-ferramenta *)){display:grid;gap:56px}
.mx-la .lp-passo:where(:not(.mx-ferramenta *)){display:grid;justify-items:center;gap:28px;text-align:center}
.mx-la .lp-passo-n:where(:not(.mx-ferramenta *)){font-size:.875rem;line-height:20px;color:#fff;font-variant-numeric:tabular-nums}
.mx-la .lp-passo-t:where(:not(.mx-ferramenta *)){margin-top:8px;font-size:clamp(1.5rem,1.2rem + 1vw,1.75rem);line-height:1.04;font-weight:600;letter-spacing:-.02em;color:var(--lp-mut);text-wrap:balance}
.mx-la .lp-passo-t b:where(:not(.mx-ferramenta *)){font-weight:600;color:#fff}
.mx-la .lp-passo-d:where(:not(.mx-ferramenta *)){margin:12px auto 0;font-size:1rem;line-height:1.5;color:var(--lp-mut);max-width:30em;text-wrap:pretty}
.mx-la .lp-passo-v:where(:not(.mx-ferramenta *)){position:relative;width:min(280px,76%);aspect-ratio:328/360}
.mx-la .lp-passo-m:where(:not(.mx-ferramenta *)){position:absolute;inset:0;overflow:hidden;-webkit-mask:linear-gradient(#000 62%,#0000 98%);mask:linear-gradient(#000 62%,#0000 98%)}
.mx-la .lp-passo-m .lp-cel:where(:not(.mx-ferramenta *)){width:100%}
.mx-la .lp-selo:where(:not(.mx-ferramenta *)){position:absolute;right:-10%;bottom:4%;width:40%;aspect-ratio:1;border-radius:50%;overflow:hidden;pointer-events:none;
  box-shadow:0 0 0 1.5px rgba(80,112,255,.55),0 0 0 8px rgba(0,0,0,.9),0 24px 60px -12px rgba(43,78,240,.5)}
.mx-la .lp-selo img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:100%;object-fit:cover;object-position:46% 50%}
@media (min-width:1024px){
  .mx-la .lp-passos:where(:not(.mx-ferramenta *)){gap:0}
  .mx-la .lp-passo:where(:not(.mx-ferramenta *)){grid-template-columns:minmax(0,376px) 328px 160px;justify-content:center;column-gap:33px;min-height:408px;align-items:center;justify-items:stretch;text-align:left}
  .mx-la .lp-passo-v:where(:not(.mx-ferramenta *)){width:328px;justify-self:center}
  .mx-la .lp-passo-d:where(:not(.mx-ferramenta *)){margin-left:0;max-width:24em}
  .mx-la .lp-selo:where(:not(.mx-ferramenta *)){right:-193px;bottom:12px;width:232px}
}

.mx-la.js-ok .lp-passo:where(:not(.mx-ferramenta *)){opacity:0;transform:translateY(72px);transition:transform .6s ease-out,opacity .6s ease-out}
.mx-la.js-ok .lp-passo.on:where(:not(.mx-ferramenta *)){opacity:1;transform:none}
.mx-la.js-ok .lp-passo-t b:where(:not(.mx-ferramenta *)){color:rgba(255,255,255,.56)}
.mx-la.js-ok .lp-passo.on .lp-passo-t b:where(:not(.mx-ferramenta *)){animation:rd-luz .6s .3s forwards}
@media (prefers-reduced-motion:reduce){.mx-la.js-ok .lp-passo:where(:not(.mx-ferramenta *)){transform:none;transition:opacity .3s}}

/* ---------- celular com a moldura do iPhone e o print real dentro (percentuais do simulador da extensão) ---------- */
.mx-la .lp-cel:where(:not(.mx-ferramenta *)){position:relative;aspect-ratio:481/991}
.mx-la .lp-cel-tela:where(:not(.mx-ferramenta *)){position:absolute;left:4.3659%;top:1.8163%;width:91.4761%;height:96.4682%;border-radius:17.73% / 8.16%;overflow:hidden;background:#0b0c0e;}
/* o print do sistema não tem barra de status: desce uma faixa escura sob a ilha dinâmica para ela não cobrir o cabeçalho */
.mx-la .lp-cel-tela img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:auto;margin-top:12%}
.mx-la .lp-cel-m:where(:not(.mx-ferramenta *)){position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

/* ---------- janela do painel (o "Experimente aqui" da a referência: a tela real com um botão no meio) ---------- */
.mx-la .lp-win:where(:not(.mx-ferramenta *)){position:relative;border-radius:24px;padding:1px;background:linear-gradient(148deg,#3a3a3a,#111 80%)}
.mx-la .lp-win-in:where(:not(.mx-ferramenta *)){position:relative;border-radius:23px;overflow:hidden;background:#0b0c0e}
.mx-la .lp-win-bar:where(:not(.mx-ferramenta *)){display:flex;align-items:center;gap:6px;height:28px;padding:0 14px;background:#121417;border-bottom:1px solid var(--line)}
.mx-la .lp-win-bar i:where(:not(.mx-ferramenta *)){width:8px;height:8px;border-radius:50%;background:#2b2f35}
.mx-la .lp-win-in img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:auto}
.mx-la .lp-win-cta:where(:not(.mx-ferramenta *)){position:absolute;left:50%;top:50%;translate:-50% -50%}

/* ---------- cartões de leitura: imagem 16:9, título 24/24 e "Saiba mais" (a base de conhecimento da a referência) ---------- */
.mx-la .lp-kb:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
.mx-la .lp-kb-c:where(:not(.mx-ferramenta *)){display:grid;align-content:start;gap:16px}
.mx-la .lp-kb-img:where(:not(.mx-ferramenta *)){position:relative;display:block;aspect-ratio:304/171;border-radius:24px;overflow:hidden;background:#0d0d0d;box-shadow:0 0 0 1px var(--line) inset}
.mx-la .lp-kb-img img:where(:not(.mx-ferramenta *)){width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.mx-la .lp-kb-t:where(:not(.mx-ferramenta *)){font-size:clamp(1.0625rem,.9rem + .8vw,1.5rem);line-height:1.08;font-weight:600;letter-spacing:-.02em;color:#fff;text-wrap:balance}
.mx-la .lp-kb-c .rd-link:where(:not(.mx-ferramenta *)){justify-self:start;margin-block:-12px 0;transform:none}
@media (min-width:768px){.mx-la .lp-kb:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (hover:hover) and (pointer:fine){.mx-la .lp-kb-c:hover .lp-kb-img img:where(:not(.mx-ferramenta *)){transform:scale(1.04)}}

/* ---------- números (cartão grande + etiqueta pequena) ---------- */
.mx-la .lp-num:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mx-la .lp-num .rd-card:where(:not(.mx-ferramenta *)){display:grid;align-content:space-between;gap:12px;min-height:200px;padding:24px 20px;overflow:hidden}
.mx-la .lp-num-v:where(:not(.mx-ferramenta *)){font-size:clamp(2.5rem,1.4rem + 4.2vw,5rem);line-height:.95;font-weight:600;letter-spacing:-.04em;color:#fff;font-variant-numeric:tabular-nums}
.mx-la .lp-num-v small:where(:not(.mx-ferramenta *)){font-size:.38em;letter-spacing:-.02em;color:var(--lp-mut);font-weight:600;margin-left:.15em}
.mx-la .lp-num-v .a:where(:not(.mx-ferramenta *)){color:var(--red-hi)}
.mx-la .lp-num-t:where(:not(.mx-ferramenta *)){font-size:1rem;line-height:1.25;font-weight:600;color:#fff}
.mx-la .lp-num-d:where(:not(.mx-ferramenta *)){margin-top:4px;font-size:.9rem;line-height:1.4;color:var(--lp-mut)}
@media (min-width:768px){.mx-la .lp-num:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.mx-la .lp-num .rd-card:where(:not(.mx-ferramenta *)){min-height:260px;padding:28px 24px}}
.mx-la .lp-num--3:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(3,minmax(0,1fr))}
.mx-la .lp-num--3 .rd-card:where(:not(.mx-ferramenta *)){padding:20px 14px;min-height:180px}
@media (min-width:768px){.mx-la .lp-num--3:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(3,minmax(0,1fr))}.mx-la .lp-num--3 .rd-card:where(:not(.mx-ferramenta *)){padding:32px 28px;min-height:280px}}
.mx-la .lp-num .lp-hl .rd-card:where(:not(.mx-ferramenta *)), .mx-la .lp-num .rd-card.lp-hl:where(:not(.mx-ferramenta *)){background:linear-gradient(160deg,#3155f2,#1a33a8)}
.mx-la .lp-num .lp-hl .lp-num-d:where(:not(.mx-ferramenta *)){color:rgba(255,255,255,.88)}

/* ---------- cartão de texto + imagem (bento largo) ---------- */
.mx-la .lp-duo:where(:not(.mx-ferramenta *)){display:grid;gap:16px}
.mx-la .lp-duo .rd-card:where(:not(.mx-ferramenta *)){display:grid;gap:20px;align-content:start;overflow:hidden;padding:32px 24px}
.mx-la .lp-duo .rd-card .lp-m:where(:not(.mx-ferramenta *)){margin:auto -24px -32px}
.mx-la .lp-duo .rd-h3:where(:not(.mx-ferramenta *)){margin:0}
@media (min-width:768px){.mx-la .lp-duo:where(:not(.mx-ferramenta *)){grid-template-columns:1fr 1fr}.mx-la .lp-duo .rd-card:where(:not(.mx-ferramenta *)){padding:40px 32px}.mx-la .lp-duo .rd-card .lp-m:where(:not(.mx-ferramenta *)){margin:auto -32px -40px}}
.mx-la .lp-m img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:auto}

/* ---------- texto corrido (SEO): bloco citável, listas, subtítulos ---------- */
.mx-la .lp-txt:where(:not(.mx-ferramenta *)){max-width:680px;margin-inline:auto;color:var(--lp-mut2);font-size:1.0625rem;line-height:1.65}
.mx-la .lp-txt h2:where(:not(.mx-ferramenta *)){margin:clamp(32px,5vw,48px) 0 14px;font-size:clamp(1.5rem,1.1rem + 1.6vw,2rem);line-height:1.1;font-weight:600;letter-spacing:-.02em;color:#fff;text-wrap:balance}
.mx-la .lp-txt h2:first-child:where(:not(.mx-ferramenta *)){margin-top:0}
.mx-la .lp-txt h3:where(:not(.mx-ferramenta *)){margin:28px 0 10px;font-size:1.25rem;line-height:1.2;font-weight:600;letter-spacing:-.01em;color:#fff}
.mx-la .lp-txt p+p:where(:not(.mx-ferramenta *)){margin-top:14px}
.mx-la .lp-txt strong:where(:not(.mx-ferramenta *)), .mx-la .lp-txt b:where(:not(.mx-ferramenta *)){color:#fff;font-weight:600}
.mx-la .lp-txt ul:where(:not(.mx-ferramenta *)), .mx-la .lp-txt ol:where(:not(.mx-ferramenta *)){margin:14px 0;display:grid;gap:10px}
.mx-la .lp-txt ul li:where(:not(.mx-ferramenta *)){position:relative;padding-left:22px}
.mx-la .lp-txt ul li:where(:not(.mx-ferramenta *))::before{content:"";position:absolute;left:2px;top:.72em;width:8px;height:8px;border-radius:50%;background:var(--red-hi)}
.mx-la .lp-txt ol:where(:not(.mx-ferramenta *)){counter-reset:n}
.mx-la .lp-txt ol li:where(:not(.mx-ferramenta *)){position:relative;padding-left:34px;counter-increment:n}
.mx-la .lp-txt ol li:where(:not(.mx-ferramenta *))::before{content:counter(n);position:absolute;left:0;top:.05em;width:24px;height:24px;display:grid;place-items:center;border-radius:8px;border:1.5px solid rgba(255,255,255,.5);font-size:.8rem;font-weight:600;color:#fff}
.mx-la .lp-cite:where(:not(.mx-ferramenta *)){max-width:680px;margin:0 auto clamp(28px,4vw,40px);padding:22px 24px;border-radius:24px;background:linear-gradient(160deg,rgba(43,78,240,.16),rgba(43,78,240,.04) 60%);box-shadow:0 0 0 1px rgba(91,123,255,.28) inset;color:#fff;font-size:1.0625rem;line-height:1.6}
.mx-la .lp-cite small:where(:not(.mx-ferramenta *)){display:block;margin-bottom:8px;font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--red-hi)}

/* ---------- tabela comparativa (<table> de verdade: cartão por linha no celular, tabela daqui para cima) ---------- */
.mx-la .lp-tab-box:where(:not(.mx-ferramenta *)){border-radius:24px}
.mx-la .lp-tab:where(:not(.mx-ferramenta *)){width:100%;border-collapse:separate;border-spacing:0}
.mx-la .lp-tab caption:where(:not(.mx-ferramenta *)){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.mx-la .lp-tab thead:where(:not(.mx-ferramenta *)){display:none}
.mx-la .lp-tab tbody:where(:not(.mx-ferramenta *)), .mx-la .lp-tab tr:where(:not(.mx-ferramenta *)), .mx-la .lp-tab th:where(:not(.mx-ferramenta *)), .mx-la .lp-tab td:where(:not(.mx-ferramenta *)){display:block}
.mx-la .lp-tab tbody:where(:not(.mx-ferramenta *)){display:grid;gap:12px}
.mx-la .lp-tab tr:where(:not(.mx-ferramenta *)){display:grid;gap:10px;padding:18px;border-radius:24px;background:#0f0f0f;box-shadow:0 0 0 1px var(--line) inset}
.mx-la .lp-tab tbody th:where(:not(.mx-ferramenta *)){font-size:1.0625rem;font-weight:600;text-align:left;color:#fff}
.mx-la .lp-tab td:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:minmax(0,40%) minmax(0,1fr);gap:12px;font-size:.95rem;line-height:1.4;color:var(--lp-mut2)}
.mx-la .lp-tab td:where(:not(.mx-ferramenta *))::before{content:attr(data-r);color:var(--lp-mut);font-size:.85rem}
.mx-la .lp-tab tr.nos:where(:not(.mx-ferramenta *)), .mx-la .lp-tab tr.dest:where(:not(.mx-ferramenta *)){background:linear-gradient(160deg,rgba(43,78,240,.14),#0f0f0f 70%);box-shadow:0 0 0 1px rgba(91,123,255,.4) inset}
.mx-la .lp-tab tr.nos th:where(:not(.mx-ferramenta *))::after{content:"nós";margin-left:10px;padding:3px 9px;border-radius:999px;background:rgba(91,123,255,.18);font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#9db1ff}
@media (min-width:768px){
  .mx-la .lp-tab-box:where(:not(.mx-ferramenta *)){overflow:hidden;box-shadow:0 0 0 1px var(--line) inset;background:#0c0c0c}
  .mx-la .lp-tab:where(:not(.mx-ferramenta *)){display:table}
  .mx-la .lp-tab thead:where(:not(.mx-ferramenta *)){display:table-header-group}
  .mx-la .lp-tab tbody:where(:not(.mx-ferramenta *)){display:table-row-group}
  .mx-la .lp-tab tr:where(:not(.mx-ferramenta *)){display:table-row;padding:0;border-radius:0;background:none;box-shadow:none}
  .mx-la .lp-tab th:where(:not(.mx-ferramenta *)), .mx-la .lp-tab td:where(:not(.mx-ferramenta *)){display:table-cell;padding:18px 20px;vertical-align:top;text-align:left}
  .mx-la .lp-tab thead td:where(:not(.mx-ferramenta *)), .mx-la .lp-tab thead th:where(:not(.mx-ferramenta *)){font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--lp-mut);border-bottom:1px solid var(--line)}
  .mx-la .lp-tab td:where(:not(.mx-ferramenta *))::before{display:none}
  .mx-la .lp-tab tbody tr+tr th:where(:not(.mx-ferramenta *)), .mx-la .lp-tab tbody tr+tr td:where(:not(.mx-ferramenta *)){border-top:1px solid var(--line)}
  .mx-la .lp-tab tr.nos:where(:not(.mx-ferramenta *)), .mx-la .lp-tab tr.dest:where(:not(.mx-ferramenta *)){background:linear-gradient(90deg,rgba(43,78,240,.12),transparent 80%);box-shadow:none}
  .mx-la .lp-tab tr.nos th:where(:not(.mx-ferramenta *))::after{display:none}
}

/* ---------- lista de verdades / "o que não somos" ---------- */
.mx-la .lp-ck:where(:not(.mx-ferramenta *)){display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
.mx-la .lp-ck li:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;padding:16px;border-radius:20px;background:#0f0f0f;box-shadow:0 0 0 1px var(--line) inset;font-size:.95rem;line-height:1.4;color:var(--lp-mut2)}
.mx-la .lp-ck li b:where(:not(.mx-ferramenta *)){display:block;margin-bottom:4px;color:#fff;font-weight:600}
.mx-la .lp-ck .ic:where(:not(.mx-ferramenta *)){width:20px;height:20px;margin-top:2px;color:var(--red-hi)}
.mx-la .lp-ck--no .ic:where(:not(.mx-ferramenta *)){color:var(--lp-mut)}
@media (min-width:900px){.mx-la .lp-ck:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(3,minmax(0,1fr))}.mx-la .lp-ck--2:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- cartões de página irmã (links internos) ---------- */
.mx-la .lp-rel:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mx-la .lp-rel li:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:minmax(0,1fr)}
.mx-la .lp-rel a:where(:not(.mx-ferramenta *)){position:relative;display:grid;align-content:space-between;gap:16px;min-height:150px;padding:18px;border-radius:24px;background:#0f0f0f;box-shadow:0 0 0 1px var(--line) inset;transition:box-shadow .3s,transform .25s var(--ease)}
.mx-la .lp-rel b:where(:not(.mx-ferramenta *)){padding-right:22px;font-size:1.0625rem;line-height:1.2;font-weight:600;letter-spacing:-.01em;color:#fff}
.mx-la .lp-rel span:where(:not(.mx-ferramenta *)){font-size:.9rem;line-height:1.4;color:var(--lp-mut)}
.mx-la .lp-rel i:where(:not(.mx-ferramenta *)){position:absolute;right:16px;top:16px;color:var(--red-hi)}
.mx-la .lp-rel i .ic:where(:not(.mx-ferramenta *)){width:18px;height:18px}
.mx-la .lp-rel a:active:where(:not(.mx-ferramenta *)){transform:scale(.98)}
@media (max-width:359.98px){.mx-la .lp-rel a:where(:not(.mx-ferramenta *)){padding:14px 12px;gap:12px}.mx-la .lp-rel b:where(:not(.mx-ferramenta *)){padding-right:16px;font-size:.9375rem}.mx-la .lp-rel i:where(:not(.mx-ferramenta *)){right:8px;top:8px}}
@media (min-width:768px){.mx-la .lp-rel:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.mx-la .lp-rel a:where(:not(.mx-ferramenta *)){padding:24px;min-height:180px}}
@media (hover:hover) and (pointer:fine){.mx-la .lp-rel a:hover:where(:not(.mx-ferramenta *)){box-shadow:0 0 0 1px rgba(91,123,255,.5) inset;transform:translateY(-2px)}}

/* ---------- faixa de fatos curtos (carência, prazo, mínimo) ---------- */
.mx-la .lp-fatos:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;border-radius:24px;overflow:hidden;background:var(--line);box-shadow:0 0 0 1px var(--line)}
.mx-la .lp-fatos>div:where(:not(.mx-ferramenta *)){display:grid;gap:4px;align-content:start;padding:20px 18px;background:#000}
.mx-la .lp-fatos b:where(:not(.mx-ferramenta *)){font-size:clamp(1.5rem,1.1rem + 1.6vw,2.25rem);line-height:1;font-weight:600;letter-spacing:-.03em;color:#fff}
.mx-la .lp-fatos span:where(:not(.mx-ferramenta *)){font-size:.9rem;line-height:1.35;color:var(--lp-mut)}
@media (min-width:768px){.mx-la .lp-fatos:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(4,minmax(0,1fr))}.mx-la .lp-fatos>div:where(:not(.mx-ferramenta *)){padding:28px 24px}}

/* ---------- abas (nichos, ferramentas) ---------- */
.mx-la .lp-abas:where(:not(.mx-ferramenta *)){display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:20px}
.mx-la .lp-abas button:where(:not(.mx-ferramenta *)){min-height:44px;padding:0 18px;border-radius:999px;font-weight:600;font-size:.95rem;color:var(--lp-mut2);box-shadow:0 0 0 1px var(--line2) inset;transition:background .2s,color .2s}
.mx-la .lp-abas button[aria-selected="true"]:where(:not(.mx-ferramenta *)){background:#fff;color:#000;box-shadow:none}
.mx-la .lp-painel[hidden]:where(:not(.mx-ferramenta *)){display:none}
@media (hover:hover) and (pointer:fine){.mx-la .lp-abas button[aria-selected="false"]:hover:where(:not(.mx-ferramenta *)){background:rgba(255,255,255,.08);color:#fff}}

/* ---------- fechamento e FAQ nas páginas internas: a mesma peça da home, com a escala da a referência ---------- */
.mx-la .closing .close-titulo.lp-h2:where(:not(.mx-ferramenta *)){font-size:clamp(2rem,1.1rem + 4vw,3.5rem);line-height:1.04;letter-spacing:-.025em;font-weight:600}
.mx-la .lp-faq h2:where(:not(.mx-ferramenta *)){font-size:clamp(1.75rem,1.1rem + 2.4vw,2.5rem);font-weight:600;letter-spacing:-.02em;line-height:1.05}

/* rodapé: cinco colunas (as cinco famílias de página, 28/10/2026). Celular: 2 + 2 + a quinta na largura toda, com a lista em 2;
   tablet: 3 + 2 numa grade de 6; computador: 5 lado a lado. Nunca coluna órfã. */
.mx-la .lp-foot .foot-cols:where(:not(.mx-ferramenta *)){grid-template-columns:1fr 1fr;gap:8px 16px}
.mx-la .lp-foot .foot-cols h3 a:where(:not(.mx-ferramenta *)){color:inherit}
.mx-la .lp-foot .foot-cols li:where(:not(.mx-ferramenta *)){display:flex}
.mx-la .lp-foot .foot-cols a:where(:not(.mx-ferramenta *)){display:flex;align-items:center;width:100%;line-height:1.25;padding-block:6px}
@media (max-width:699px){.mx-la .lp-foot .foot-cols>div:last-child:where(:not(.mx-ferramenta *)){grid-column:1/-1}.mx-la .lp-foot .foot-cols>div:last-child ul:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:16px}}
@media (min-width:700px) and (max-width:1023px){.mx-la .lp-foot .foot-cols:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(6,minmax(0,1fr));gap:16px 24px}.mx-la .lp-foot .foot-cols>div:where(:not(.mx-ferramenta *)){grid-column:span 2}.mx-la .lp-foot .foot-cols>div:nth-child(n+4):where(:not(.mx-ferramenta *)){grid-column:span 3}}
@media (min-width:1024px){.mx-la .lp-foot .foot-cols:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(5,minmax(0,1fr));gap:16px 24px}}
.mx-la.lc-js .ft.in .foot-cols>div:nth-child(4):where(:not(.mx-ferramenta *)){animation-delay:.36s}
.mx-la.lc-js .ft.in .foot-cols>div:nth-child(5):where(:not(.mx-ferramenta *)){animation-delay:.44s}

/* link dentro da resposta do FAQ: área de toque de 44px sem mexer na entrelinha; link na legenda sempre sublinhado */
.mx-la .lp-faq #faq-list p a:where(:not(.mx-ferramenta *)){padding-block:12.5px}
.mx-la .cap a:where(:not(.mx-ferramenta *)){text-decoration:underline;text-underline-offset:3px}

/* trilha no celular: uma linha só; o último item (o nome da página) encurta com reticências em vez de quebrar com a seta solta */
@media (max-width:599px){
  .mx-la .lp-bc:where(:not(.mx-ferramenta *)){flex-wrap:nowrap;max-width:100%}
  .mx-la .lp-bc li:where(:not(.mx-ferramenta *)){flex:none}
  .mx-la .lp-bc li:last-child:where(:not(.mx-ferramenta *)){flex:0 1 auto;min-width:0}
  .mx-la .lp-bc [aria-current]:where(:not(.mx-ferramenta *)){display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* navegação das páginas internas: os cinco rótulos são mais largos que os da home e, com o "Entrar" em vidro e o "Criar conta"
   neon da barra (27/10/2026), só cabem CENTRADOS sem tocar o "Entrar", também na cápsula rolada (80px mais estreita), a partir
   de 1080 px. Até 1079 vale o menu do celular; de 1080 a 1219 as abas e o "Entrar" encolhem um pouco. Folga mínima medida
   ~22px nas duas pontas (em 1060 e 1200 dava 13: 1px acima do limite de 12, sem margem para a fonte de outro sistema) */
@media (min-width:900px) and (max-width:1079px){
  .mx-la .nav:where(:not(.mx-ferramenta *)){display:flex}
  .mx-la .nav-links:where(:not(.mx-ferramenta *)), .mx-la .nav-login:where(:not(.mx-ferramenta *)){display:none}
  .mx-la .nav-burger:where(:not(.mx-ferramenta *)){display:grid!important}
  .mx-la .nav-sheet:not([hidden]):where(:not(.mx-ferramenta *)){display:grid!important}
}
@media (min-width:1080px) and (max-width:1219px){
  .mx-la .nav-links:where(:not(.mx-ferramenta *)){gap:2px}
  .mx-la .nav-links a:where(:not(.mx-ferramenta *)){padding-inline:6px;font-size:.9375rem}
  .mx-la .nav-login:where(:not(.mx-ferramenta *)){padding:0 12px 0 10px;gap:6px}
  .mx-la .nav-actions:where(:not(.mx-ferramenta *)){gap:6px}
}
.mx-la .nav-wrap.scrolled .nav:where(:not(.mx-ferramenta *)){background:rgba(14,16,19,.86)}

@media (prefers-reduced-motion:reduce){.mx-la .lp-hint svg:where(:not(.mx-ferramenta *)){animation:none}.mx-la .lp-kb-img img:where(:not(.mx-ferramenta *)){transition:none}}

/* a ilha dinâmica do iPhone 16 Pro Max (números da extensão Mobile Simulator): pinta por cima do print */
.mx-la .lp-cel-tela:where(:not(.mx-ferramenta *))::after{content:"";position:absolute;z-index:4;left:34.43%;top:1.569%;width:31.09%;height:4.121%;border-radius:99px;background:#050505;pointer-events:none}

/* ---- p-por-que-link-affiliattes.css ---- */
/* /por-que-link-affiliattes — clone de a referência (19/10/2026).
   Só o que o kit não cobre: os dois bentos (cartão largo + 2×2 desencontrado; 4 desencontrado), a faixa do app,
   o par de celulares sob o título grande, os 2 cartões de número, o "Comece facilmente" e o cartão de segurança.
   Celular copia a composição do computador: os bentos ficam em 2 colunas em 360px, com o título curto (.p-pq-sm).
   Movimento só com transform/opacity, dentro de prefers-reduced-motion: no-preference. Prefixo: p-pq-. */

/* ---------- hero: a foto já tem o céu preto em cima; um escuro no meio garante a leitura do título ---------- */
.mx-la .lp-hero--img:where(:not(.mx-ferramenta *))::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 34% at 50% 40%,rgba(0,0,0,.55),transparent 100%),
    radial-gradient(46% 27% at 50% 64%,rgba(0,0,0,.74) 0,rgba(0,0,0,.74) 40%,transparent 100%)}
@media (max-width:599px){.mx-la .lp-hero-bg:where(:not(.mx-ferramenta *)){object-position:24% 100%}}

/* ---------- título de cartão: frase longa no computador, curta no celular ---------- */
.mx-la .p-pq-lg:where(:not(.mx-ferramenta *)), .mx-la .p-pq-sm:where(:not(.mx-ferramenta *)){font-style:normal}
.mx-la .p-pq-lg:where(:not(.mx-ferramenta *)){display:none}
@media (min-width:600px){.mx-la .p-pq-lg:where(:not(.mx-ferramenta *)){display:inline}.mx-la .p-pq-sm:where(:not(.mx-ferramenta *)){display:none}}

/* ---------- cartão do bento ---------- */
.mx-la .p-pq-k .rd-card:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;overflow:hidden;container-type:inline-size}
.mx-la .p-pq-cab:where(:not(.mx-ferramenta *)){position:relative;z-index:2;display:grid;justify-items:center;text-align:center;padding:20px 12px 0}
.mx-la .p-pq-k .rd-h3:where(:not(.mx-ferramenta *)){margin-bottom:8px;font-size:clamp(1rem,.8rem + .75vw,1.5rem);line-height:1.12;text-align:center}
.mx-la .p-pq-k .rd-link:where(:not(.mx-ferramenta *)){transform:none}
@media (min-width:768px){.mx-la .p-pq-cab:where(:not(.mx-ferramenta *)){padding:40px 28px 0}.mx-la .p-pq-k .rd-h3:where(:not(.mx-ferramenta *)){margin-bottom:12px}}

.mx-la .p-pq-b1:where(:not(.mx-ferramenta *)), .mx-la .p-pq-b2:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mx-la .p-pq-largo:where(:not(.mx-ferramenta *)){grid-column:1/-1}
.mx-la .p-pq-col:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;gap:12px;min-width:0}
.mx-la .p-pq-col>.rd-c:last-child:where(:not(.mx-ferramenta *)){flex:1}
@media (min-width:768px){.mx-la .p-pq-b1:where(:not(.mx-ferramenta *)), .mx-la .p-pq-b2:where(:not(.mx-ferramenta *)), .mx-la .p-pq-col:where(:not(.mx-ferramenta *)){gap:16px}}

/* alturas desencontradas, como a referência (alto + baixo numa coluna, baixo + alto na outra) */
.mx-la .p-pq-largo .rd-card:where(:not(.mx-ferramenta *)){min-height:clamp(300px,34vw,470px)}
.mx-la .p-pq-cA .rd-card:where(:not(.mx-ferramenta *)){min-height:clamp(300px,36vw,506px)}
.mx-la .p-pq-cB .rd-card:where(:not(.mx-ferramenta *)){min-height:clamp(220px,28vw,400px)}
.mx-la .p-pq-cC .rd-card:where(:not(.mx-ferramenta *)){min-height:clamp(220px,26vw,378px)}
.mx-la .p-pq-cD .rd-card:where(:not(.mx-ferramenta *)){min-height:clamp(300px,34vw,486px)}
.mx-la .p-pq-cP .rd-card:where(:not(.mx-ferramenta *)){min-height:clamp(280px,37vw,530px)}
.mx-la .p-pq-cR .rd-card:where(:not(.mx-ferramenta *)){min-height:clamp(260px,32vw,460px)}
.mx-la .p-pq-cS .rd-card:where(:not(.mx-ferramenta *)){min-height:clamp(250px,31vw,440px)}
.mx-la .p-pq-cT .rd-card:where(:not(.mx-ferramenta *)){min-height:clamp(280px,38vw,550px)}

/* ---------- bento 1 ---------- */
/* largo: o print real dos nichos deitado em perspectiva, saindo pelas bordas */
.mx-la .p-pq-chao:where(:not(.mx-ferramenta *)){position:relative;flex:1;min-height:150px;perspective:900px;
  -webkit-mask:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent),linear-gradient(#000 60%,transparent);
  -webkit-mask-composite:source-in;mask:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent),linear-gradient(#000 60%,transparent);mask-composite:intersect}
/* o recorte do print já é só a faixa de cima; largura 92% + deriva de 3% e o pé que o rotateX aproxima ficam dentro da tela */
.mx-la .p-pq-chao-in:where(:not(.mx-ferramenta *)){position:absolute;left:50%;top:14px;width:88%;transform:translateX(-50%) rotateX(34deg);transform-origin:50% 0;pointer-events:none}
/* o print é enfeite (aria-hidden) e sangra de propósito: o cartão recorta (overflow:hidden) e a máscara apaga as bordas; sem eventos, como toda decoração */
.mx-la .p-pq-chao-in picture:where(:not(.mx-ferramenta *)){display:block}
@media (min-width:768px){.mx-la .p-pq-chao-in:where(:not(.mx-ferramenta *)){width:92%}}
.mx-la .p-pq-chao-in img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:auto;border-radius:14px;box-shadow:0 0 0 1px rgba(255,255,255,.08)}

/* A: o celular com o link e os balões do rastreio */
.mx-la .p-pq-cena:where(:not(.mx-ferramenta *)){position:relative;flex:1;min-height:180px}
.mx-la .p-pq-cena-cel:where(:not(.mx-ferramenta *)){position:absolute;left:50%;top:18px;width:min(56%,232px);transform:translateX(-50%)}
.mx-la .p-pq-bal:where(:not(.mx-ferramenta *)){position:absolute;z-index:1;display:grid;gap:4px;font-size:max(12px,4.4cqw);line-height:1.2;font-weight:600}
.mx-la .p-pq-bal>*:where(:not(.mx-ferramenta *)){display:block;padding:.45em .8em;border-radius:999px;background:rgba(20,20,20,.86);border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.8);font-style:normal;white-space:nowrap;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.mx-la .p-pq-bal b:where(:not(.mx-ferramenta *)){background:linear-gradient(90deg,#1f3bc4,#2b4ef0);border-color:transparent;color:#fff}
.mx-la .p-pq-bal-e:where(:not(.mx-ferramenta *)){left:6%;top:30%}
.mx-la .p-pq-bal-d:where(:not(.mx-ferramenta *)){right:6%;top:46%;display:none}
@media (min-width:600px){.mx-la .p-pq-bal-d:where(:not(.mx-ferramenta *)){display:grid}}

/* B: "Pix" em volume, como o "95%" da referência */
.mx-la .p-pq-pix:where(:not(.mx-ferramenta *)){flex:1;display:grid;place-items:center;padding:8px 0 20px}
.mx-la .p-pq-pix b:where(:not(.mx-ferramenta *)){display:block;font-size:36cqw;line-height:.9;font-weight:800;letter-spacing:-.05em;
  background:linear-gradient(180deg,#fff 10%,#6e8bff 55%,#1a33a8 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 1px 0 #0c1e6d) drop-shadow(0 3px 0 #08154e) drop-shadow(0 18px 30px rgba(43,78,240,.35))}

/* C: placas que viram, como o "0%" da referência */
.mx-la .p-pq-flip:where(:not(.mx-ferramenta *)){flex:1;display:flex;align-items:center;justify-content:center;gap:3cqw;padding:8px 0 20px;perspective:600px}
.mx-la .p-pq-flip b:where(:not(.mx-ferramenta *)){position:relative;display:grid;place-items:center;width:34cqw;aspect-ratio:3/4;border-radius:4cqw;
  background:linear-gradient(180deg,#232323,#141414 50%,#0e0e0e 50%,#1a1a1a);box-shadow:0 0 0 1px rgba(255,255,255,.08),0 12px 24px rgba(0,0,0,.5);
  font-size:19cqw;line-height:1;font-weight:700;letter-spacing:-.04em;color:#fff}
.mx-la .p-pq-flip b:where(:not(.mx-ferramenta *))::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(0,0,0,.8)}
.mx-la .p-pq-flip b.v:where(:not(.mx-ferramenta *)){color:var(--red-hi)}

/* D: o funil real do painel, com a etiqueta da venda */
.mx-la .p-pq-graf:where(:not(.mx-ferramenta *)){position:relative;flex:1;min-height:160px;overflow:hidden;
  -webkit-mask:linear-gradient(transparent,#000 18%,#000 72%,transparent);mask:linear-gradient(transparent,#000 18%,#000 72%,transparent)}
/* o arquivo já vem recortado no funil: cabe na caixa por object-fit, sem sangrar para fora */
.mx-la .p-pq-graf-in:where(:not(.mx-ferramenta *)){position:absolute;inset:0}
.mx-la .p-pq-graf-in img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:100%;object-fit:cover;object-position:0 30%;border-radius:12px}
.mx-la .p-pq-tag:where(:not(.mx-ferramenta *)){position:absolute;z-index:1;right:8%;top:22%;display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;
  background:linear-gradient(90deg,#1f3bc4,#2b4ef0);color:#fff;font-size:max(12px,4.2cqw);font-weight:700;line-height:1.2;box-shadow:0 8px 24px rgba(43,78,240,.4)}
.mx-la .p-pq-tag .ic:where(:not(.mx-ferramenta *)){width:1.1em;height:1.1em}

/* ---------- bento 2 ---------- */
/* P: a pilha dos estados do extrato (os cartões de pagamento da referência) */
.mx-la .p-pq-pilha:where(:not(.mx-ferramenta *)){flex:1;list-style:none;margin:0;padding:20px 0 28px;display:flex;flex-direction:column;justify-content:center;align-items:center}
/* cartões que se cobrem como um baralho: só o topo de cada um aparece, o último fica inteiro */
.mx-la .p-pq-pilha li:where(:not(.mx-ferramenta *)){--w:54%;display:flex;align-items:flex-start;justify-content:center;gap:8px;width:var(--w);min-height:clamp(52px,5vw,64px);padding:10px 10px 0;border-radius:14px;box-shadow:0 -6px 16px rgba(0,0,0,.45);
  background:linear-gradient(180deg,#1d1d1d,#141414);border:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.56);font-size:13px;line-height:1.2;font-weight:600;text-align:center}
.mx-la .p-pq-pilha li:nth-child(2):where(:not(.mx-ferramenta *)){--w:60%}
.mx-la .p-pq-pilha li:nth-child(3):where(:not(.mx-ferramenta *)){--w:66%}
.mx-la .p-pq-pilha li:nth-child(4):where(:not(.mx-ferramenta *)){--w:73%}
.mx-la .p-pq-pilha li+li:where(:not(.mx-ferramenta *)){margin-top:clamp(-26px,-2vw,-18px)}
.mx-la .p-pq-pilha li:nth-child(5):where(:not(.mx-ferramenta *)){--w:80%;min-height:clamp(84px,9vw,128px);align-items:center;padding-top:0;font-size:15px;color:#fff;border-color:rgba(91,123,255,.6);
  background:linear-gradient(180deg,#10152a,#0a0c17);box-shadow:0 12px 30px rgba(43,78,240,.25)}
.mx-la .p-pq-pilha .ic:where(:not(.mx-ferramenta *)){flex:none;width:16px;height:16px}
.mx-la .p-pq-pilha li:nth-child(5) .ic:where(:not(.mx-ferramenta *)){color:var(--red-hi)}
@media (max-width:599px){.mx-la .p-pq-pilha li:not(:last-child) span:where(:not(.mx-ferramenta *)){display:none}}

/* S: as peças das objeções, deitadas como as "estratégias" da referência */
.mx-la .p-pq-pecas:where(:not(.mx-ferramenta *)){position:relative;flex:1;min-height:150px;overflow:hidden;perspective:800px;
  -webkit-mask:radial-gradient(70% 70% at 50% 50%,#000 50%,transparent);mask:radial-gradient(70% 70% at 50% 50%,#000 50%,transparent)}
.mx-la .p-pq-pecas-in:where(:not(.mx-ferramenta *)){position:absolute;left:50%;top:50%;width:130%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;
  transform:translate(-50%,-50%) rotateX(26deg) rotateZ(-7deg)}
.mx-la .p-pq-pecas i:where(:not(.mx-ferramenta *)){display:grid;place-items:center;min-height:44px;padding:6px;border-radius:12px;font-style:normal;font-size:max(12px,3.6cqw);font-weight:600;
  color:rgba(255,255,255,.75);background:linear-gradient(180deg,#222,#151515);border:1px solid rgba(255,255,255,.1);text-align:center}
.mx-la .p-pq-pecas-in:where(:not(.mx-ferramenta *)){row-gap:22px}
.mx-la .p-pq-pecas i:nth-child(3n+2):where(:not(.mx-ferramenta *)){translate:0 40%}
.mx-la .p-pq-pecas i:nth-child(3):where(:not(.mx-ferramenta *)), .mx-la .p-pq-pecas i:nth-child(5):where(:not(.mx-ferramenta *)), .mx-la .p-pq-pecas i:nth-child(8):where(:not(.mx-ferramenta *)){color:#fff;background:linear-gradient(180deg,#11193a,#0a0d1c);border-color:rgba(91,123,255,.45)}
@media (min-width:768px){
  .mx-la .p-pq-pecas-in:where(:not(.mx-ferramenta *)){grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 10px}
  .mx-la .p-pq-pecas i:nth-child(3n+2):where(:not(.mx-ferramenta *)){translate:none}
  .mx-la .p-pq-pecas i:nth-child(even):where(:not(.mx-ferramenta *)){translate:0 34%}
}

/* R: o celular da conta demo, com brilho atrás */
.mx-la .p-pq-demo:where(:not(.mx-ferramenta *)){position:relative;flex:1;min-height:160px}
.mx-la .p-pq-demo:where(:not(.mx-ferramenta *))::before{content:"";position:absolute;left:50%;top:40%;width:80%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(closest-side,rgba(43,78,240,.35),transparent)}
.mx-la .p-pq-demo .lp-cel:where(:not(.mx-ferramenta *)){position:absolute;left:50%;top:16px;width:min(62%,270px);transform:translateX(-50%)}

/* T: o relógio da meta diária */
/* o relógio se mede pela caixa que sobra (largura em cqw do cartão E altura em % da caixa): em 1024 o mostrador de 78cqw passava da caixa, cobria o "Ver o CRM" e era cortado no pé */
.mx-la .p-pq-rel:where(:not(.mx-ferramenta *)){position:relative;flex:1;min-height:170px}
.mx-la .p-pq-rel>i:where(:not(.mx-ferramenta *)){position:absolute;left:50%;top:50%;border-radius:50%;translate:-50% -50%}
.mx-la .p-pq-rel-m:where(:not(.mx-ferramenta *)){width:auto;height:min(78cqw,88%,330px);aspect-ratio:1;
  background:repeating-conic-gradient(rgba(255,255,255,.45) 0 .6deg,transparent .6deg 6deg);
  -webkit-mask:radial-gradient(closest-side,transparent 88%,#000 89%);mask:radial-gradient(closest-side,transparent 88%,#000 89%)}
.mx-la .p-pq-rel-a:where(:not(.mx-ferramenta *)){width:auto;height:min(64cqw,72%,272px);aspect-ratio:1;background:conic-gradient(var(--red-hi) 0 62deg,rgba(255,255,255,.08) 62deg 360deg);
  -webkit-mask:radial-gradient(closest-side,transparent 82%,#000 83%);mask:radial-gradient(closest-side,transparent 82%,#000 83%)}
.mx-la .p-pq-rel>.p-pq-rel-h:where(:not(.mx-ferramenta *)), .mx-la .p-pq-rel>.p-pq-rel-p:where(:not(.mx-ferramenta *)){width:3px;border-radius:3px;transform-origin:50% 100%;translate:-50% -100%}
.mx-la .p-pq-rel-h:where(:not(.mx-ferramenta *)){height:min(20cqw,22.5%,86px);background:#fff;rotate:-50deg}
.mx-la .p-pq-rel-p:where(:not(.mx-ferramenta *)){height:min(28cqw,31.5%,118px);background:var(--red-hi);rotate:62deg}
.mx-la .p-pq-rel-c:where(:not(.mx-ferramenta *)){width:14px;height:14px;background:#fff;box-shadow:0 0 0 4px #101010,0 0 0 5px rgba(255,255,255,.2)}

/* ---------- faixa do app ---------- */
.mx-la .p-pq-app-in:where(:not(.mx-ferramenta *)){position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"qr mao" "lj lj";gap:20px 12px;align-items:center}
.mx-la .p-pq-barras:where(:not(.mx-ferramenta *)){position:absolute;inset:auto 0 30% 0;z-index:-1;height:70%;display:flex;align-items:flex-end;justify-content:space-between;gap:2%;pointer-events:none;
  -webkit-mask:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent),linear-gradient(transparent,#000);-webkit-mask-composite:source-in;
  mask:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent),linear-gradient(transparent,#000);mask-composite:intersect}
.mx-la .p-pq-barras i:where(:not(.mx-ferramenta *)){flex:1;border-radius:10px 10px 0 0;background:linear-gradient(180deg,rgba(43,78,240,.42),rgba(43,78,240,0));transform-origin:50% 100%}
.mx-la .p-pq-barras i:nth-child(1):where(:not(.mx-ferramenta *)){height:26%}.mx-la .p-pq-barras i:nth-child(2):where(:not(.mx-ferramenta *)){height:38%}.mx-la .p-pq-barras i:nth-child(3):where(:not(.mx-ferramenta *)){height:32%}
.mx-la .p-pq-barras i:nth-child(4):where(:not(.mx-ferramenta *)){height:50%}.mx-la .p-pq-barras i:nth-child(5):where(:not(.mx-ferramenta *)){height:62%}.mx-la .p-pq-barras i:nth-child(6):where(:not(.mx-ferramenta *)){height:56%}
.mx-la .p-pq-barras i:nth-child(7):where(:not(.mx-ferramenta *)){height:72%}.mx-la .p-pq-barras i:nth-child(8):where(:not(.mx-ferramenta *)){height:84%}.mx-la .p-pq-barras i:nth-child(9):where(:not(.mx-ferramenta *)){height:78%}.mx-la .p-pq-barras i:nth-child(10):where(:not(.mx-ferramenta *)){height:100%}
.mx-la .p-pq-qrb:where(:not(.mx-ferramenta *)){grid-area:qr;display:grid;gap:16px;justify-items:start;align-items:center}
@media (min-width:1024px){.mx-la .p-pq-qrb:where(:not(.mx-ferramenta *)){grid-template-columns:auto minmax(0,1fr);gap:20px}}
.mx-la .p-pq-qr:where(:not(.mx-ferramenta *)){display:block;width:clamp(76px,7.4vw,96px);aspect-ratio:1;padding:6px;border-radius:14px;background:#fff;transition:transform .2s}
.mx-la .p-pq-qr svg:where(:not(.mx-ferramenta *)){display:block;width:100%;height:100%}
.mx-la .p-pq-qr:active:where(:not(.mx-ferramenta *)){transform:scale(.97)}
.mx-la .p-pq-app-t:where(:not(.mx-ferramenta *)){margin:0 0 8px;font-size:clamp(1.5rem,1rem + 2vw,2.5rem);line-height:1.05;font-weight:600;letter-spacing:-.02em;color:#fff}
.mx-la .p-pq-app-t span:where(:not(.mx-ferramenta *)){color:var(--red-hi)}
.mx-la .p-pq-mao:where(:not(.mx-ferramenta *)){grid-area:mao;justify-self:center;width:min(100%,400px)}
.mx-la .p-pq-mao img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:auto;-webkit-mask:linear-gradient(#000 72%,transparent);mask:linear-gradient(#000 72%,transparent)}
.mx-la .p-pq-lojas:where(:not(.mx-ferramenta *)){grid-area:lj;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mx-la .p-pq-loja:where(:not(.mx-ferramenta *)){display:flex;align-items:center;gap:10px;min-height:56px;padding:10px 14px;border-radius:16px;color:#fff;
  background:linear-gradient(90deg,#1f3bc4,#2b4ef0);transition:transform .15s,background .3s}
.mx-la .p-pq-loja .ic:where(:not(.mx-ferramenta *)){flex:none;width:22px;height:22px}
.mx-la .p-pq-loja span:where(:not(.mx-ferramenta *)){display:grid;min-width:0}
.mx-la .p-pq-loja small:where(:not(.mx-ferramenta *)){font-size:13px;line-height:1.2}
.mx-la .p-pq-loja b:where(:not(.mx-ferramenta *)){font-size:16px;line-height:1.25;font-weight:700}
.mx-la .p-pq-loja:active:where(:not(.mx-ferramenta *)){transform:scale(.98)}
@media (hover:hover) and (pointer:fine){.mx-la .p-pq-loja:hover:where(:not(.mx-ferramenta *)){background:linear-gradient(90deg,#1732a9,#2545d8)}}
@media (min-width:1024px){
  .mx-la .p-pq-app-in:where(:not(.mx-ferramenta *)){grid-template-columns:1fr minmax(0,400px) 1fr;grid-template-areas:"qr mao lj";gap:32px}
  .mx-la .p-pq-lojas:where(:not(.mx-ferramenta *)){grid-template-columns:minmax(0,260px);justify-content:end;gap:12px}
}

/* ---------- regras: título grande e o par de celulares ---------- */
.mx-la .p-pq-regras .lp-head:where(:not(.mx-ferramenta *)){max-width:940px}
.mx-la .p-pq-regras .lp-h2:where(:not(.mx-ferramenta *)){font-size:clamp(1.375rem,1rem + 1.8vw,2.5rem);line-height:1.12}
.mx-la .p-pq-par:where(:not(.mx-ferramenta *)){position:relative;display:flex;justify-content:center;align-items:flex-start;height:clamp(330px,46vw,620px);overflow:hidden;
  -webkit-mask:linear-gradient(#000 62%,transparent);mask:linear-gradient(#000 62%,transparent)}
.mx-la .p-pq-par-a:where(:not(.mx-ferramenta *)), .mx-la .p-pq-par-b:where(:not(.mx-ferramenta *)){flex:none;width:clamp(150px,22vw,300px)}
.mx-la .p-pq-par-a:where(:not(.mx-ferramenta *)){margin-top:clamp(40px,6vw,90px);margin-right:-4%;filter:brightness(.62)}
.mx-la .p-pq-par-b:where(:not(.mx-ferramenta *)){position:relative;z-index:1;margin-left:-4%}
.mx-la .p-pq-par-l:where(:not(.mx-ferramenta *)){margin:20px 0 0;text-align:center}

/* ---------- prazos: 2 cartões de número ---------- */
.mx-la .p-pq-nums:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mx-la .p-pq-num .rd-card:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;overflow:hidden;padding:0 14px 20px;min-height:220px}
.mx-la .p-pq-num-m:where(:not(.mx-ferramenta *)){margin:0 -14px;-webkit-mask:linear-gradient(#000 60%,transparent);mask:linear-gradient(#000 60%,transparent)}
.mx-la .p-pq-num-m img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:auto;mix-blend-mode:lighten}
.mx-la .p-pq-num-t:where(:not(.mx-ferramenta *)){margin:auto 0 0;font-size:16px;line-height:1.35;color:var(--lp-mut2)}
.mx-la .p-pq-num-t b:where(:not(.mx-ferramenta *)){display:block;margin-bottom:4px;font-size:clamp(1.75rem,1.2rem + 2vw,2.5rem);line-height:1;font-weight:700;letter-spacing:-.03em;color:var(--red-hi)}
@media (min-width:768px){
  .mx-la .p-pq-nums:where(:not(.mx-ferramenta *)){gap:16px}
  .mx-la .p-pq-num .rd-card:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8px;min-height:240px;padding:0 28px 0 0}
  .mx-la .p-pq-num-m:where(:not(.mx-ferramenta *)){margin:0;-webkit-mask:radial-gradient(closest-side,#000 70%,transparent);mask:radial-gradient(closest-side,#000 70%,transparent)}
  .mx-la .p-pq-num-t:where(:not(.mx-ferramenta *)){margin:0}
}

/* ---------- comece: cartão largo, 3 cartões e o botão ---------- */
.mx-la .p-pq-com .rd-card:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:8px;padding:20px 12px 0}
.mx-la .p-pq-com-v:where(:not(.mx-ferramenta *)){position:relative;align-self:end;height:clamp(240px,30vw,400px);overflow:hidden}
.mx-la .p-pq-com-cel:where(:not(.mx-ferramenta *)){position:absolute;left:50%;top:0;width:min(78%,230px);transform:translateX(-50%)}
.mx-la .p-pq-vidro:where(:not(.mx-ferramenta *)){position:absolute;left:0;right:0;bottom:12px;z-index:1;list-style:none;margin:0 auto;padding:10px;width:min(100%,250px);display:grid;gap:6px;border-radius:18px;
  background:rgba(18,18,18,.72);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.mx-la .p-pq-vidro li:where(:not(.mx-ferramenta *)){display:flex;align-items:center;gap:6px;font-size:13px;line-height:1.2;font-weight:600;color:rgba(255,255,255,.66)}
.mx-la .p-pq-vidro .ic:where(:not(.mx-ferramenta *)){flex:none;width:14px;height:14px}
.mx-la .p-pq-vidro .ok .ic:where(:not(.mx-ferramenta *)){color:var(--ok)}
.mx-la .p-pq-vidro .at:where(:not(.mx-ferramenta *)){color:#fff}
.mx-la .p-pq-vidro .at .ic:where(:not(.mx-ferramenta *)){color:var(--red-hi)}
.mx-la .p-pq-com-x:where(:not(.mx-ferramenta *)){display:grid;justify-items:center;text-align:center;padding-bottom:20px}
.mx-la .p-pq-com-cta:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;align-items:center;gap:12px}
/* 320–359px: a coluna do texto tem 127–145px; a neon encolhe como a da hero nessa faixa (letra no piso de 13px) */
@media (max-width:22.49rem){.mx-la .p-pq-com-cta .btn-neon:where(:not(.mx-ferramenta *)){font-size:13px;gap:6px;padding-left:12px}.mx-la .p-pq-com-cta .cta-seta:where(:not(.mx-ferramenta *)){width:30px;height:30px}}
@media (min-width:768px){
  .mx-la .p-pq-com .rd-card:where(:not(.mx-ferramenta *)){padding:32px 32px 0;gap:24px}
  .mx-la .p-pq-vidro:where(:not(.mx-ferramenta *)){padding:14px;gap:8px}
  .mx-la .p-pq-vidro li:where(:not(.mx-ferramenta *)){font-size:15px}
  .mx-la .p-pq-vidro .ic:where(:not(.mx-ferramenta *)){width:16px;height:16px}
}
.mx-la .p-pq-tres:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:8px}
.mx-la .p-pq-tr .rd-card:where(:not(.mx-ferramenta *)){min-height:clamp(200px,26vw,360px)}
.mx-la .p-pq-tr .p-pq-cab:where(:not(.mx-ferramenta *)){padding-inline:8px}
.mx-la .p-pq-tr-m:where(:not(.mx-ferramenta *)){flex:1;display:grid;place-items:end center}
.mx-la .p-pq-tr-m img:where(:not(.mx-ferramenta *)){display:block;width:100%;height:auto;mix-blend-mode:lighten;
  -webkit-mask:radial-gradient(closest-side,#000 64%,transparent);mask:radial-gradient(closest-side,#000 64%,transparent)}
@media (min-width:768px){.mx-la .p-pq-tres:where(:not(.mx-ferramenta *)){gap:16px;margin-top:16px}}
.mx-la .p-pq-cta:where(:not(.mx-ferramenta *)){display:flex;justify-content:center;margin-top:clamp(24px,4vw,40px)}

/* ---------- segurança: cartão grande com o escudo ao fundo ---------- */
.mx-la .p-pq-seg-box:where(:not(.mx-ferramenta *)){position:relative;display:flex;align-items:flex-end;min-height:clamp(560px,62vw,860px);border-radius:40px;overflow:hidden;
  border:1px solid rgba(255,255,255,.1);isolation:isolate}
.mx-la .p-pq-seg-bg:where(:not(.mx-ferramenta *)){position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:brightness(.5)}
.mx-la .p-pq-seg-box:where(:not(.mx-ferramenta *))::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 20%,rgba(0,0,0,.7) 48%,#000 66%)}
.mx-la .p-pq-seg-c:where(:not(.mx-ferramenta *)){width:100%;padding:24px 16px;display:grid;justify-items:center;text-align:center;gap:16px}
.mx-la .p-pq-seg-c .lp-h2:where(:not(.mx-ferramenta *)){margin:0}
/* sobre a foto do escudo o --red-hi dava 4,45:1; o tom claro da mesma família (o do "Pix") passa de 4,5 */
.mx-la .p-pq-seg-c .lp-h2 .a:where(:not(.mx-ferramenta *)){color:#6e8bff}
/* abaixo de 1024 o título cai sobre o brilho do metal (3,3:1 em 390 e 4,0:1 em 768): o escurecimento passa a nascer no bloco do texto, não numa % da altura do cartão */
@media (max-width:1023px){.mx-la .p-pq-seg-c:where(:not(.mx-ferramenta *)){background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.72) 24px,rgba(0,0,0,.86) 80px,#000 180px)}}
.mx-la .p-pq-seg-c .lp-p:where(:not(.mx-ferramenta *)){margin:0;max-width:56ch}
.mx-la .p-pq-selos:where(:not(.mx-ferramenta *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%;max-width:640px}
.mx-la .p-pq-selo:where(:not(.mx-ferramenta *)){display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 10px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);text-align:center}
.mx-la .p-pq-selo .ic:where(:not(.mx-ferramenta *)){flex:none;width:26px;height:26px;color:var(--red-hi)}
.mx-la .p-pq-selo b:where(:not(.mx-ferramenta *)){font-size:16px;line-height:1.25;color:#fff}
.mx-la .p-pq-selo b span:where(:not(.mx-ferramenta *)){color:var(--lp-mut2)}
.mx-la .p-pq-seg-it:where(:not(.mx-ferramenta *)){list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%;max-width:840px;text-align:left}
.mx-la .p-pq-seg-it li:where(:not(.mx-ferramenta *)){display:flex;gap:8px;align-items:flex-start}
.mx-la .p-pq-seg-it .ic:where(:not(.mx-ferramenta *)){flex:none;width:20px;height:20px;margin-top:2px;color:var(--red-hi)}
.mx-la .p-pq-seg-it p:where(:not(.mx-ferramenta *)){margin:0;font-size:14px;line-height:1.45;color:var(--lp-mut2)}
.mx-la .p-pq-seg-it b:where(:not(.mx-ferramenta *)){color:#fff}
.mx-la .p-pq-seg-it a:where(:not(.mx-ferramenta *)){color:#fff;text-decoration:underline;text-underline-offset:3px}
@media (min-width:600px){.mx-la .p-pq-selo:where(:not(.mx-ferramenta *)){flex-direction:row;justify-content:center;text-align:left}}
@media (min-width:768px){
  .mx-la .p-pq-seg-c:where(:not(.mx-ferramenta *)){padding:48px 48px 56px;gap:20px}
  .mx-la .p-pq-selos:where(:not(.mx-ferramenta *)){gap:16px}
  .mx-la .p-pq-selo:where(:not(.mx-ferramenta *)){padding:18px 20px}
  .mx-la .p-pq-selo b:where(:not(.mx-ferramenta *)){font-size:17px}
  .mx-la .p-pq-seg-it:where(:not(.mx-ferramenta *)){gap:24px}
  .mx-la .p-pq-seg-it p:where(:not(.mx-ferramenta *)){font-size:16px}
}

/* ---------- movimento (só transform/opacity) ---------- */
@media (prefers-reduced-motion:no-preference){
  .mx-la .p-pq-chao-in img:where(:not(.mx-ferramenta *)){animation:p-pq-deriva 18s ease-in-out infinite alternate}
  .mx-la.js-ok .p-pq-bal>*:where(:not(.mx-ferramenta *)), .mx-la.js-ok .p-pq-tag:where(:not(.mx-ferramenta *)), .mx-la.js-ok .p-pq-pix b:where(:not(.mx-ferramenta *)), .mx-la.js-ok .p-pq-flip b:where(:not(.mx-ferramenta *)), .mx-la.js-ok .p-pq-pilha li:where(:not(.mx-ferramenta *)){opacity:0;transition:opacity .5s ease-out,transform .6s cubic-bezier(.22,1,.36,1)}
  .mx-la.js-ok .p-pq-bal>*:where(:not(.mx-ferramenta *)){transform:translateY(10px)}
  .mx-la .p-pq-bal>:nth-child(2):where(:not(.mx-ferramenta *)){transition-delay:.12s}.mx-la .p-pq-bal>:nth-child(3):where(:not(.mx-ferramenta *)){transition-delay:.24s}.mx-la .p-pq-bal>:nth-child(4):where(:not(.mx-ferramenta *)){transition-delay:.36s}
  .mx-la.js-ok .p-pq-pix b:where(:not(.mx-ferramenta *)){transform:scale(.8)}
  .mx-la.js-ok .p-pq-flip b:where(:not(.mx-ferramenta *)){transform:rotateX(-90deg)}
  .mx-la .p-pq-flip b.v:where(:not(.mx-ferramenta *)){transition-delay:.18s}
  .mx-la.js-ok .p-pq-tag:where(:not(.mx-ferramenta *)){transform:scale(.6)}
  .mx-la.js-ok .p-pq-pilha li:where(:not(.mx-ferramenta *)){transform:translateY(24px)}
  .mx-la .p-pq-pilha li:nth-child(2):where(:not(.mx-ferramenta *)){transition-delay:.08s}.mx-la .p-pq-pilha li:nth-child(3):where(:not(.mx-ferramenta *)){transition-delay:.16s}
  .mx-la .p-pq-pilha li:nth-child(4):where(:not(.mx-ferramenta *)){transition-delay:.24s}.mx-la .p-pq-pilha li:nth-child(5):where(:not(.mx-ferramenta *)){transition-delay:.32s}
  .mx-la.js-ok .rd-c.on .p-pq-bal>*:where(:not(.mx-ferramenta *)), .mx-la.js-ok .rd-c.on .p-pq-tag:where(:not(.mx-ferramenta *)), .mx-la.js-ok .rd-c.on .p-pq-flip b:where(:not(.mx-ferramenta *)), .mx-la.js-ok .rd-c.on .p-pq-pilha li:where(:not(.mx-ferramenta *)){opacity:1;transform:none}
  .mx-la.js-ok .rd-c.on .p-pq-pix b:where(:not(.mx-ferramenta *)){opacity:1;transform:none;animation:p-pq-boia 4s 1s ease-in-out infinite}
  .mx-la .p-pq-pecas i:where(:not(.mx-ferramenta *)){animation:p-pq-flutua 5s calc(var(--i) * -.6s) ease-in-out infinite}
  .mx-la .p-pq-rel>.p-pq-rel-p:where(:not(.mx-ferramenta *)){animation:p-pq-gira 12s linear infinite}
  @supports (animation-timeline:view()){
    .mx-la .p-pq-barras i:where(:not(.mx-ferramenta *)){animation:p-pq-sobe linear both;animation-timeline:view();animation-range:entry 0% cover 45%}
  }
}
@keyframes p-pq-deriva{from{transform:translateX(-3%)}to{transform:translateX(3%)}}
@keyframes p-pq-boia{0%,100%{transform:none}50%{transform:translateY(-6px)}}
@keyframes p-pq-flutua{0%,100%{transform:none}50%{transform:translateY(-6px)}}
@keyframes p-pq-gira{from{rotate:62deg}to{rotate:422deg}}
@keyframes p-pq-sobe{from{transform:scaleY(.2);opacity:.2}to{transform:none;opacity:1}}

/* link dentro da resposta do FAQ: área de toque de 44px sem mexer na entrelinha (padding de inline não empurra a linha) */
.mx-la #faq-list p a:where(:not(.mx-ferramenta *)){padding-block:12.5px}

/* acabamento do molde la-por-que (11/11/2026): o que é só do PDF sem Cadastro, POR CIMA do clone, sem mover bloco */

/* hero igual à da referência. O cabeçalho do domínio fica no fluxo (a referência o põe por cima da foto), então a hero
   cobre o resto da tela e desconta o cabeçalho do respiro de cima: título, botões e linha de apoio caem na mesma altura
   da referência. No celular a peça da esquerda sai do quadro e fica o horizonte do planeta, como o recorte da referência. */
.mx-pagina{--topo:72px}
@media (max-width:767px){.mx-pagina{--topo:61px}}
.mx-la .lp-hero{min-height:calc(100svh - var(--topo));padding-top:max(24px,calc(112px - var(--topo)))}
/* o <main> do domínio é grade com 28 px de vão: entre cada seção e o "encontro" de altura zero somavam 56 px que a
   referência não tem (página 406 px mais alta em 1440). O molde volta ao fluxo normal da referência. */
main.mx-la{display:block;gap:0}
@media (max-width:599px){.mx-la .lp-hero-bg{object-position:50% 100%}}

/* a FERRAMENTA de verdade no cartão largo do bento, no lugar do print deitado da referência: o painel claro do próprio
   site (o CSS dele vale aqui dentro; nenhuma regra da referência alcança .mx-ferramenta, ver escopar.cjs) */
.mx-la .p-pq-largo .mx-ferramenta{position:relative;z-index:2;flex:1;display:grid;align-items:center;text-align:left;
  padding:clamp(10px,1.2vw,14px) clamp(12px,2.6vw,32px) clamp(12px,1.6vw,22px);color:var(--ink);font-family:var(--sans);scroll-margin-top:88px}
.mx-la .p-pq-largo .toolpanel{gap:12px;margin:0;width:100%}
.mx-la .p-pq-largo .toolpanel.reservado:empty{min-height:300px}
.mx-la .p-pq-largo .toolpanel>.panel{box-shadow:0 0 0 1px rgba(255,255,255,.14),0 30px 80px -24px rgba(43,78,240,.55)}
/* computador e tablet: as opções à esquerda e a área do arquivo à direita, para caber na altura do cartão da referência */
@media (min-width:768px){
  .mx-la #tp-comprimir>.panel.pad{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);column-gap:24px;row-gap:10px;align-items:start;padding:16px 18px}
  .mx-la #tp-comprimir>.panel.pad>*{grid-column:1}
  .mx-la #tp-comprimir>.panel.pad>span.step:nth-of-type(3){grid-column:2;grid-row:1}
  .mx-la #tp-comprimir>.panel.pad>div:has(>.dz){grid-column:2;grid-row:2/span 6;align-self:stretch;display:grid}
  .mx-la #tp-comprimir .dz{align-content:center}
}
/* celular: tamanho máximo + área do arquivo à vista; limite exato e cor atrás de "Limite exato e cor" (molde.js) */
.mx-la .mx-mais-btn{display:none}
@media (max-width:767px){
  .mx-la #tp-comprimir>.panel.pad{gap:10px;padding:14px}
  .mx-la #tp-comprimir>.panel.pad:not(.mx-mais)>:is(.field,span.step:nth-of-type(2),span.step:nth-of-type(2)~.seg,.hint){display:none}
  .mx-la #tp-comprimir .dz{padding:10px}
  /* os 4 tamanhos em 2 linhas (eram 3) e o passo 3 já dito pelo botão: o cartão fica perto da altura do da referência */
  .mx-la #tp-comprimir>.panel.pad>.seg button{padding:6px 10px;font-size:13px}
  .mx-la #tp-comprimir>.panel.pad:not(.mx-mais)>span.step:nth-of-type(3){display:none}
  .mx-la #tp-comprimir .dz .dzicon,.mx-la #tp-comprimir .dz .dzsub{display:none}
  .mx-la .mx-mais-btn{display:inline-flex;align-items:center;justify-self:start;gap:6px;min-height:44px;padding:0 4px;border:0;background:none;
    color:var(--accent);font:600 14px/1.2 var(--sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
}

/* contraste lido no pixel (portão de 11/11/2026): "0 MB" saía com 2,17:1 (o pé do degradê era azul-escuro) e a pilha do
   "O que muda" com 4,43:1; o degradê termina num cobalto claro e a pilha clareia, mantendo o degrau entre os cartões */
.mx-la .p-pq-pix b{background:linear-gradient(180deg,#fff 10%,#c2ceff 50%,#7d97ff 100%);-webkit-background-clip:text;background-clip:text}
.mx-la .p-pq-pilha li{color:rgba(255,255,255,.76)}

/* QR do "no bolso": o desenho usa currentColor e o link é claro; o código fica preto no quadro branco, como na referência */
.mx-la .p-pq-qr{color:#000}

/* celulares: a faixa da barra de status do iOS na cor do topo do print (branco), nunca preta sobre a tela clara */
.mx-la .lp-cel-tela{background:#fefefe}

/* peças 3D da casa (sem marca) e o planeta do fecho: a luz vermelha da referência vira o cobalto */
.mx-la img[src*="lp-med-"],.mx-la .p-pq-seg-bg,.mx-la img[src*="planeta-hero"]{filter:hue-rotate(222deg) saturate(1.05)}

/* celular do bloco "no bolso": a mão da referência (400 x 461 px, o pé apagado) vira o aparelho com a tela real, no mesmo
   lugar e na mesma altura; o pé apaga no aparelho inteiro, nunca em cada imagem dele */
.mx-la .mx-cel-mao{width:min(100%,224px);margin-inline:auto;-webkit-mask:linear-gradient(#000 72%,transparent);mask:linear-gradient(#000 72%,transparent)}
.mx-la .p-pq-mao .mx-cel-mao img{-webkit-mask:none;mask:none}

/* o rodapé e o cabeçalho do domínio ficam no claro, colados ao molde escuro */
.mx-pagina{background:var(--ground)}
.mx-pagina > .wrap{padding-top:8px}

/* vidro sobre o print branco do "Comprima em três passos": o print claro atrás do vidro derrubava "Escolher o PDF" e
   "Limite de 5 ou 2 MB" para 4,43:1 e 4,02:1 (portão de 11/11/2026); o vidro escurece e o texto clareia (≈9,9:1 na conta) */
.mx-la .p-pq-vidro{background:rgba(14,14,16,.86)}
.mx-la .p-pq-vidro li{color:rgba(255,255,255,.84)}
