/* AUTVS, nova experiência (versão 2): página clara, com o produto como protagonista.
   Cores do tema claro do autvs_app; marca segundo o manual v2.2. Movimento só com transform e opacity.
   Sem JavaScript, ou com "reduzir movimento", tudo aparece no estado final (sem a classe .anima). */

:root{
  --canvas:#F8F9FB;
  --surface:#FFFFFF;
  --surface-2:#F5F6F9;
  --line:#E2E5EC;
  --borda-campo:#8C95A8;
  --ink:#11141C;
  --ink-2:#586072;
  --ink-3:#6B7385;
  --marca:#2563EB;        /* Azul AUTVS: só o nome no logotipo e o padrão, como manda o manual */
  --brand:#0B2A9A;        /* azul da base do Prisma: botões, links, ícones, rótulos e a segunda linha dos títulos */
  --brand-hover:#0B2A66;  /* Azul Profundo */
  --brand-50:#F1F6FF;
  --brand-100:#E4EDFF;
  --brand-200:#CDDFFF;
  --deep:#0B2A66;
  --digital:#1E9BFF;
  --violet:#522773;
  --accent:#FFA000;
  --erro:#B42318;
  --sobre-escuro:#C9D6F0;
  --sobre-escuro-2:#9FB3DA;
  --sombra-cartao:0 1px 2px rgba(17,20,28,.04),0 4px 16px -8px rgba(17,20,28,.1);
  --sombra-pop:0 30px 60px -28px rgba(11,42,102,.35),0 0 0 1px rgba(17,20,28,.05);
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --f-titulo:"Sora",system-ui,sans-serif;
  --f-texto:"Inter",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,monospace;
  /* padrão da marca: a silhueta minimalista do Prisma repetida a baixa opacidade (manual, versão 04) */
  --padrao:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cpath d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' fill='none' stroke='%232563EB' stroke-opacity='.2' stroke-width='1.2' stroke-linejoin='miter'/%3E%3C/svg%3E");
  /* constelação discreta (nós e ligações), só nas bordas das faixas: a IA ligando os dados */
  --constelacao:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='400' viewBox='0 0 600 400'%3E%3Cpath d='M48 64L156 34M156 34L262 92M262 92L214 196M214 196L96 168M96 168L48 64M262 92L362 44M362 44L476 118M476 118L424 228M424 228L548 300M424 228L318 318M318 318L214 196M318 318L172 312M172 312L52 286M52 286L96 168M476 118L566 52M362 44L566 52' fill='none' stroke='%230B2A9A' stroke-opacity='.12' stroke-width='1'/%3E%3Cg fill='%230B2A9A' fill-opacity='.24'%3E%3Ccircle cx='48' cy='64' r='2'/%3E%3Ccircle cx='156' cy='34' r='2'/%3E%3Ccircle cx='262' cy='92' r='3'/%3E%3Ccircle cx='214' cy='196' r='2'/%3E%3Ccircle cx='96' cy='168' r='2'/%3E%3Ccircle cx='362' cy='44' r='2'/%3E%3Ccircle cx='476' cy='118' r='2'/%3E%3Ccircle cx='424' cy='228' r='3'/%3E%3Ccircle cx='548' cy='300' r='2'/%3E%3Ccircle cx='318' cy='318' r='2'/%3E%3Ccircle cx='172' cy='312' r='3'/%3E%3Ccircle cx='52' cy='286' r='2'/%3E%3Ccircle cx='566' cy='52' r='2'/%3E%3C/g%3E%3C/svg%3E");
  --constelacao-clara:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='400' viewBox='0 0 600 400'%3E%3Cpath d='M48 64L156 34M156 34L262 92M262 92L214 196M214 196L96 168M96 168L48 64M262 92L362 44M362 44L476 118M476 118L424 228M424 228L548 300M424 228L318 318M318 318L214 196M318 318L172 312M172 312L52 286M52 286L96 168M476 118L566 52M362 44L566 52' fill='none' stroke='%23FFFFFF' stroke-opacity='.11' stroke-width='1'/%3E%3Cg fill='%23FFFFFF' fill-opacity='.28'%3E%3Ccircle cx='48' cy='64' r='2'/%3E%3Ccircle cx='156' cy='34' r='2'/%3E%3Ccircle cx='262' cy='92' r='3'/%3E%3Ccircle cx='214' cy='196' r='2'/%3E%3Ccircle cx='96' cy='168' r='2'/%3E%3Ccircle cx='362' cy='44' r='2'/%3E%3Ccircle cx='476' cy='118' r='2'/%3E%3Ccircle cx='424' cy='228' r='3'/%3E%3Ccircle cx='548' cy='300' r='2'/%3E%3Ccircle cx='318' cy='318' r='2'/%3E%3Ccircle cx='172' cy='312' r='3'/%3E%3Ccircle cx='52' cy='286' r='2'/%3E%3Ccircle cx='566' cy='52' r='2'/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:hidden;overflow-x:clip;scroll-padding-top:100px}
html.anima{scroll-behavior:smooth}
body{margin:0;overflow-x:hidden;overflow-x:clip;background:var(--canvas);color:var(--ink);font:400 17px/1.65 var(--f-texto);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
p,h1,h2,h3,ol,ul,figure{margin:0}
ol,ul{padding:0;list-style:none}
a{color:inherit}
button,input{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:6px}
::selection{background:var(--brand-200);color:var(--ink)}
main:focus{outline:none}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.icone{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pular{position:fixed;left:16px;top:-80px;z-index:100;padding:10px 16px;border-radius:10px;background:var(--brand);color:#fff;font-weight:600;text-decoration:none;transition:top .25s var(--ease)}
.pular:focus{top:12px}
.caixa{width:min(1200px,100% - 32px);margin-inline:auto}
.caixa-estreita{width:min(880px,100% - 32px)}
.centro{text-align:center}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border:0;border-radius:999px;font:600 15px/1.1 var(--f-titulo);letter-spacing:-.005em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .3s var(--ease),transform .3s var(--ease)}
.btn-primario{background:var(--brand);color:#fff;box-shadow:0 12px 28px -12px rgba(11,42,154,.6)}
.btn-primario:hover{background:var(--brand-hover);transform:translateY(-1px)}
.btn-primario:active{transform:none}
.btn-grande{min-height:58px;padding:0 30px;font-size:16.5px}
.btn .icone{transition:transform .3s var(--ease)}
.btn:hover .icone{transform:translateX(3px)}
.btn:focus-visible{outline-offset:4px;border-radius:999px}

/* ---------- menu flutuante ---------- */
.menu{position:fixed;top:14px;left:0;right:0;z-index:40;padding:0 clamp(12px,3vw,32px);pointer-events:none}
.menu-caixa{pointer-events:auto;max-width:1200px;height:64px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 10px 0 20px;border-radius:18px;background:rgba(255,255,255,.92);border:1px solid rgba(17,20,28,.06);box-shadow:0 10px 30px -16px rgba(11,42,102,.35);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4)}
.menu-marca{flex:none;display:block;width:124px;color:var(--marca);border-radius:6px}
.menu-marca svg{width:100%;height:auto}
.menu-links{display:flex;gap:2px}
.menu-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:10px;font:500 15px var(--f-texto);color:var(--ink-2);text-decoration:none;transition:color .25s var(--ease),background-color .25s var(--ease)}
.menu-links a:hover{color:var(--ink);background:var(--surface-2)}
.menu-acoes{display:flex;align-items:center;gap:6px}
.menu-entrar{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:10px;font:500 15px var(--f-texto);color:var(--ink);text-decoration:none;transition:background-color .25s var(--ease)}
.menu-entrar:hover{background:var(--surface-2)}
.btn-menu{min-height:44px;padding:0 20px;font-size:14.5px}
.so-estreito{display:none}
@media (max-width:980px){.menu-links{display:none}}
@media (max-width:560px){
  .menu-caixa{height:58px;padding:0 8px 0 14px}
  .menu-marca{width:100px}
  .menu-entrar{padding:0 10px}
  .so-largo{display:none}
  .so-estreito{display:inline}
  .btn-menu{padding:0 16px}
}
@media (max-width:400px){
  .menu-caixa{gap:10px;padding:0 6px 0 12px}
  .menu-marca{width:88px}
  .menu-entrar{padding:0 8px}
  .btn-menu{padding:0 14px}
}
/* sem espaço (tela estreita ou letra do celular aumentada), "Entrada" sai da barra; se ainda faltar, a marca e o botão encolhem (site.js) */
.menu-caixa.apertado .menu-entrar{display:none}
.menu-caixa.muito-apertado{gap:8px;padding:0 6px 0 10px}
.menu-caixa.muito-apertado .menu-marca{width:72px}
.menu-caixa.muito-apertado .btn-menu{padding:0 12px}

/* ---------- topo ---------- */
.topo{position:relative;isolation:isolate;padding:clamp(124px,17vh,168px) 0 clamp(36px,5vh,56px)}
.topo-fundo{position:absolute;inset:0;z-index:-1;border-radius:0 0 clamp(28px,4vw,48px) clamp(28px,4vw,48px);background:linear-gradient(180deg,#E2EBFC 0%,#CCDBF8 62%,#B8CBF1 100%);overflow:hidden}
.topo-fundo::before{content:"";position:absolute;inset:0;background-image:var(--padrao);background-size:96px 96px;-webkit-mask-image:radial-gradient(ellipse 72% 70% at 50% 42%,transparent 40%,#000 100%);mask-image:radial-gradient(ellipse 72% 70% at 50% 42%,transparent 40%,#000 100%)}
.topo-fundo::after{content:"";position:absolute;left:50%;top:-30%;width:90%;aspect-ratio:2/1;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(255,255,255,.85),rgba(255,255,255,0));pointer-events:none}
.topo-grade{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,4.5vw,64px);align-items:center}
/* em telas largas o tour avança sobre a margem direita, para as telas do sistema não encolherem,
   mas nunca além da margem que sobra (em notebooks de 1280 e 1366 px ele era cortado na borda) */
@media (min-width:1180px){.tour{margin-right:calc(-1 * max(0px,min(6vw,96px,(100vw - 1232px) / 2)))}}
.selo{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:#fff;border:1px solid var(--brand-200);font:600 12px/1 var(--f-titulo);letter-spacing:.14em;text-transform:uppercase;color:var(--brand);box-shadow:0 4px 14px -8px rgba(11,42,154,.35)}
.titulo-topo{margin-top:22px;font:700 clamp(2.3rem,1.1rem + 2.7vw,3.3rem)/1.06 var(--f-titulo);letter-spacing:-.028em;text-wrap:balance}
.linha1,.linha2{display:block}
.linha1{color:var(--ink)}
.linha2{color:var(--brand)}
/* destaques do título: marca-texto nas cores do símbolo (ciano e âmbar); o texto segue escuro, mantendo o contraste */
.dest{font-style:normal;padding:0 .08em;margin:0 -.08em;background-repeat:no-repeat;background-position:0 86%;background-size:100% .36em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.dest-ciano{background-image:linear-gradient(rgba(60,196,255,.7),rgba(60,196,255,.7))}
.dest-ambar{background-image:linear-gradient(rgba(255,176,32,.85),rgba(255,176,32,.85))}
.topo-sub{margin-top:24px;max-width:36rem;font-size:clamp(1.02rem,.96rem + .3vw,1.18rem);line-height:1.7;color:var(--ink-2)}
.topo-texto .btn-grande{margin-top:32px}

/* janelas do sistema, com moldura de navegador */
/* barra das janelas em azul profundo, como a barra do sistema na referência: dá destaque às telas sobre o fundo azul */
.janela{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 36px 70px -28px rgba(11,42,102,.55),0 0 0 1px rgba(11,42,102,.14)}
/* a barra fica acima da imagem para a aproximação do tour não cobri-la */
.janela-barra{position:relative;z-index:1;display:flex;align-items:center;gap:12px;height:28px;padding:0 12px;background:linear-gradient(180deg,#14408F,#0B2A66)}
.pontos{display:flex;gap:5px}
.pontos i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.38)}
.url{padding:2px 10px;border-radius:6px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);font:500 10.5px/1.4 var(--f-mono);color:#D7E3FA}
.janela img{width:100%;height:auto}

/* tour: duas janelas em camadas por passo, trocadas a cada 6 segundos */
.tour{position:relative}
.tour-palco{position:relative;aspect-ratio:16/10.6;touch-action:pan-y}
.tour-cena{position:absolute;inset:0;opacity:0;visibility:hidden;transform:translateY(14px) scale(.985);transition:opacity .7s var(--ease),transform .7s var(--ease),visibility 0s .7s}
.tour-cena.ativa{opacity:1;visibility:visible;transform:none;transition:opacity .7s var(--ease),transform .7s var(--ease),visibility 0s}
.tour-cena .janela{position:absolute}
.tour-cena .janela-frente{left:0;bottom:0;width:88%}
.tour-cena .janela-tras{right:0;top:0;width:72%}
.tour-cena .janela-fundo{filter:saturate(.9)}
.painel-ia{position:absolute;right:1%;bottom:-3%;width:31%;border-radius:16px;overflow:hidden;box-shadow:0 34px 70px -24px rgba(11,42,102,.5),0 0 0 1px rgba(17,20,28,.06)}
.painel-ia img{width:100%;height:auto}
/* cartão de destaque que pousa sobre a tela em cada passo, como a notificação da referência */
.destaque{position:absolute;right:-1%;top:5%;z-index:3;display:flex;align-items:center;gap:12px;max-width:min(310px,74%);padding:11px 16px 11px 11px;border-radius:14px;background:#fff;box-shadow:0 22px 46px -18px rgba(11,42,102,.6),0 0 0 1px rgba(11,42,102,.08);transition:filter .25s var(--ease)}
/* enquanto o slider do celular desliza, os cartões somem, para não ficarem cortados na borda */
.tour.deslizando .destaque{filter:opacity(0)}
.tour-cena[data-passo="1"] .destaque{right:auto;left:3%;top:7%}
.destaque-icone{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%}
.destaque-icone .icone{width:18px;height:18px;stroke-width:2.4}
.destaque-ok{background:#16A34A;color:#fff}
.destaque-ia{background:var(--brand-50)}
.destaque-ia svg{width:22px;height:auto}
.destaque-alerta{background:#FFF1DC;color:#A55C06}
.destaque-texto{display:grid;gap:2px;min-width:0}
.destaque-texto strong{font:600 14px/1.25 var(--f-titulo);color:var(--ink)}
.destaque-texto span{font:400 12.5px/1.35 var(--f-texto);color:var(--ink-2)}
.anima .tour-cena.ativa .destaque{animation:pousa .7s var(--ease-out) .9s both}
@keyframes pousa{from{opacity:0;transform:translateY(-12px) scale(.96)}to{opacity:1;transform:none}}
/* aproximação lenta da tela, como uma câmera: o movimento possível sem vídeo */
.tour-cena .janela-frente img{transform-origin:var(--foco,50% 50%)}
.anima .tour-cena.ativa .janela-frente img{animation:aproxima 6.5s var(--ease) both}
@keyframes aproxima{from{transform:scale(1)}to{transform:scale(1.08)}}
.anima .tour:not(.fora) .tour-cena.ativa .janela-tras{animation:flutua 9s var(--ease) -2.5s infinite alternate}
.anima .tour:not(.fora) .tour-cena.ativa .painel-ia{animation:flutua 7s var(--ease) -1.5s infinite alternate}
@keyframes flutua{from{transform:translateY(0)}to{transform:translateY(-7px)}}
.tour-controles{display:none}
.com-js .tour-controles{display:flex;align-items:flex-start;gap:18px;margin-top:26px}
.tour-passos{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tour-passo{display:block;width:100%;padding:6px 0;border:0;background:none;text-align:left;cursor:pointer}
.tour-barra{display:block;height:3px;border-radius:3px;background:rgba(11,42,154,.16);overflow:hidden}
.tour-enche{display:block;height:100%;background:var(--brand);transform-origin:left;transform:scaleX(0)}
.tour-passo[aria-current="true"] .tour-enche{transform:scaleX(1)}
.anima .tour-passo[aria-current="true"] .tour-enche{animation:enche 6s linear both}
.anima .tour.pausado :is(.tour-enche,.janela-frente img),.anima .tour.fora :is(.tour-enche,.janela-frente img),.anima .tour.tocando :is(.tour-enche,.janela-frente img),.anima .tour:has(:focus-visible) :is(.tour-enche,.janela-frente img),.anima:has(.lupa[open]) .tour :is(.tour-enche,.janela-frente img){animation-play-state:paused}
@media (hover:hover){.anima .tour:hover :is(.tour-enche,.janela-frente img){animation-play-state:paused}}
@keyframes enche{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.tour-rotulo{display:block;margin-top:10px;font:500 14px/1.35 var(--f-texto);color:var(--ink-3);transition:color .3s var(--ease)}
.tour-passo:hover .tour-rotulo,.tour-passo[aria-current="true"] .tour-rotulo{color:var(--ink)}
.tour-pausa{flex:none;display:none;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;box-shadow:var(--sombra-cartao)}
.anima .tour-pausa{display:grid}
.tour-pausa svg{width:16px;height:16px;fill:currentColor}
.tour-pausa .icone-tocar,.tour.pausado .tour-pausa .icone-pausa{display:none}
.tour.pausado .tour-pausa .icone-tocar{display:block}

/* faixa de módulos */
.modulos{display:flex;align-items:center;gap:28px;margin-top:clamp(40px,6vh,64px);padding:18px 24px;border-radius:22px;background:rgba(255,255,255,.84);border:1px solid rgba(255,255,255,.95);box-shadow:0 22px 50px -32px rgba(11,42,102,.4);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.modulos-intro{flex:none;padding-right:28px;border-right:1px solid var(--line)}
.modulos-titulo{font:600 15px/1.3 var(--f-titulo);color:var(--ink)}
.link-seta{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font:500 14.5px var(--f-texto);color:var(--brand);text-decoration:none}
.link-seta .icone{width:16px;height:16px;transition:transform .3s var(--ease)}
.link-seta:hover .icone{transform:translateX(3px)}
.modulos-lista{flex:1;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;font-size:13px}
.modulos-lista li{display:flex;flex-direction:column;align-items:center;gap:8px;font:500 13px/1.25 var(--f-texto);color:var(--ink-2);text-align:center;overflow-wrap:break-word;hyphens:auto}
.modulo-icone{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#fff;border:1px solid var(--line);box-shadow:0 4px 12px -8px rgba(11,42,102,.3);color:var(--brand)}
.modulo-icone svg,.comparacao-icone svg,.pilar-icone svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}

/* ---------- seções ---------- */
.secao{padding-block:clamp(80px,11vh,128px)}
.secao-faixa{padding-block:clamp(20px,3vh,32px)}
.rotulo{font:600 12.5px/1 var(--f-titulo);letter-spacing:.16em;text-transform:uppercase;color:var(--brand)}
.titulo{margin-top:16px;font:700 clamp(2rem,1.3rem + 2vw,3rem)/1.1 var(--f-titulo);letter-spacing:-.022em;text-wrap:balance}
.texto{margin-top:18px;font-size:clamp(1.02rem,.98rem + .2vw,1.125rem);color:var(--ink-2);text-wrap:pretty}
.centro .texto{margin-inline:auto;max-width:44rem}
.nota{margin-top:14px;font:400 13px/1.5 var(--f-texto);color:var(--ink-3)}
.cabeca{max-width:46rem}
.cabeca.centro{max-width:56rem;margin-inline:auto}

/* o dia a dia: comparação sem e com a AUTVS */
.comparacoes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:52px}
.comparacao{padding:28px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:var(--sombra-cartao)}
.comparacao h3{display:flex;align-items:center;gap:14px;font:600 1.2rem/1.3 var(--f-titulo);color:var(--ink)}
.comparacao-icone{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--brand-50);color:var(--brand)}
.lado{margin-top:18px;padding-top:16px;border-top:1px dashed var(--line)}
.etiqueta{display:flex;align-items:center;gap:6px;font:600 11.5px/1 var(--f-titulo);letter-spacing:.12em;text-transform:uppercase}
.etiqueta .icone{width:15px;height:15px}
.etiqueta + p{margin-top:9px}
.sem .etiqueta{color:var(--ink-3)}
.sem p:last-child{color:var(--ink-2)}
.com .etiqueta{color:var(--brand)}
.com p:last-child{color:var(--ink);font-weight:500}

/* produto: linhas alternadas com a tela real */
.recurso{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(32px,5vw,72px);align-items:center;margin-top:clamp(56px,8vh,96px)}
.recurso-inverso{grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr)}
.recurso-inverso .recurso-texto{order:2}
.recurso-num{font:500 13px/1 var(--f-mono);color:var(--brand)}
.recurso h3{margin-top:12px;font:700 clamp(1.5rem,1.2rem + .9vw,2rem)/1.15 var(--f-titulo);letter-spacing:-.015em;color:var(--ink)}
.recurso-texto > p:not(.recurso-num){margin-top:14px;color:var(--ink-2)}
.itens{display:grid;gap:10px;margin-top:20px}
.itens li{display:flex;align-items:flex-start;gap:10px;font-weight:500;color:var(--ink)}
.itens .icone{margin-top:4px;color:var(--brand)}
.recurso-tela{position:relative}
.camadas{padding:9% 0 0 7%}
.camadas .janela-tras{position:absolute;left:0;top:0;width:74%;opacity:.96}
.camadas .janela-frente{position:relative}
.cartao-tela{border-radius:16px;overflow:hidden;background:#fff;box-shadow:var(--sombra-pop)}
.cartao-tela img{width:100%;height:auto}
.tambem{margin:clamp(48px,7vh,72px) auto 0;max-width:52rem;padding:16px 22px;border-radius:16px;background:var(--brand-50);border:1px solid var(--brand-100);text-align:center;color:var(--ink-2);font-size:16px}

/* inteligência artificial: faixa azul clara e a conversa */
.faixa-clara{margin:0 clamp(8px,2vw,24px);padding-block:clamp(72px,10vh,120px);border-radius:clamp(28px,4vw,48px);background:radial-gradient(720px 440px at 0% 0%,rgba(255,255,255,.7),transparent 70%),radial-gradient(660px 440px at 100% 100%,rgba(60,196,255,.16),transparent 70%),linear-gradient(180deg,#E4EDFC,#CFDDF8)}
.rotulo-ia{color:var(--violet)}
.chat{max-width:760px;margin:40px auto 0;text-align:left}
.chat-perguntas{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.chat-pergunta{min-height:44px;padding:10px 18px;border-radius:999px;border:1px solid var(--brand);background:#fff;color:var(--ink);font:500 14.5px/1.3 var(--f-texto);cursor:pointer;transition:background-color .25s var(--ease),color .25s var(--ease)}
.chat-pergunta:hover{background:var(--brand-50)}
.chat-pergunta[aria-pressed="true"]{background:var(--brand);color:#fff}
.chat-resposta{position:relative;overflow:hidden;display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;margin-top:20px;padding:24px 26px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:var(--sombra-pop)}
.chat-avatar{width:42px;height:auto;margin-top:2px}
.chat-numero{font:600 1.25rem/1.35 var(--f-titulo);color:var(--ink)}
.chat-causa{margin-top:8px;color:var(--ink-2)}
.chat-base{margin-top:12px;font:500 12.5px/1.5 var(--f-mono);color:var(--violet)}
.chat-varredura{position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,rgba(37,99,235,0) 30%,rgba(37,99,235,.1) 44%,rgba(147,107,185,.12) 52%,rgba(255,160,0,.1) 60%,rgba(255,160,0,0) 72%);transform:translateX(-100%)}
.anima .chat-resposta.refrata .chat-varredura{animation:varre .9s var(--ease-out)}
.anima .chat-resposta.refrata .chat-linhas > *{animation:surge .6s var(--ease-out) both}
.anima .chat-resposta.refrata .chat-causa{animation-delay:.1s}
.anima .chat-resposta.refrata .chat-base{animation-delay:.2s}
.chat .nota{text-align:center}
@keyframes varre{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@keyframes surge{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* segurança: faixa em azul profundo */
.faixa-escura{margin:0 clamp(8px,2vw,24px);padding-block:clamp(72px,10vh,120px);border-radius:clamp(28px,4vw,48px);background:radial-gradient(680px 440px at 0% 100%,rgba(60,196,255,.16),transparent 70%),radial-gradient(120% 90% at 88% 0%,#14408F 0%,#0B2A66 55%,#081F4E 100%);color:#fff}
.rotulo-claro{color:#7EC4FF}
.titulo-claro .linha1{color:#fff}
.titulo-claro .linha2{color:var(--digital)}
.pilares{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:48px}
.pilar{padding:28px;border-radius:20px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.pilar-icone{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:rgba(30,155,255,.14);color:#7EC4FF}
.pilar h3{margin-top:18px;font:600 1.2rem/1.3 var(--f-titulo);color:#fff}
.pilar p{margin-top:8px;color:var(--sobre-escuro)}

/* como começar */
.etapas{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:56px}
.etapas::before{content:"";position:absolute;top:28px;left:17%;right:17%;height:2px;background:repeating-linear-gradient(90deg,var(--brand-200) 0 8px,transparent 8px 16px)}
.etapa{position:relative;padding:0 12px;text-align:center}
.etapa-num{display:grid;place-items:center;width:56px;height:56px;margin:0 auto;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--sombra-cartao);font:700 20px/1 var(--f-titulo);color:var(--brand)}
.etapa h3{margin-top:18px;font:600 1.15rem/1.3 var(--f-titulo);color:var(--ink)}
.etapa p{max-width:30ch;margin:8px auto 0;color:var(--ink-2)}

/* perguntas */
.acordeao{display:grid;gap:12px;max-width:820px;margin:44px auto 0}
.acordeao details{border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--sombra-cartao)}
.acordeao summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:44px;padding:20px 22px;border-radius:16px;font:600 1.02rem/1.4 var(--f-titulo);color:var(--ink);transition:color .25s var(--ease)}
.acordeao summary::-webkit-details-marker{display:none}
.acordeao summary::after{content:"";flex:none;width:10px;height:10px;border-right:2px solid var(--brand);border-bottom:2px solid var(--brand);transform:translateY(-3px) rotate(45deg);transition:transform .3s var(--ease)}
.acordeao details[open] summary::after{transform:translateY(3px) rotate(-135deg)}
.acordeao summary:hover{color:var(--brand)}
.acordeao details p{padding:0 22px 22px;color:var(--ink-2)}
.anima .acordeao details[open] p{animation:surge .45s var(--ease-out)}

/* demonstração */
.painel-demo{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:clamp(32px,5vw,72px);align-items:center;padding:clamp(28px,5vw,64px);border-radius:clamp(24px,3vw,36px);background:linear-gradient(135deg,#E2EBFC,#C9D9F7)}
.painel-demo::before{content:"";position:absolute;inset:0;z-index:-1;background-image:var(--padrao);background-size:96px 96px;-webkit-mask-image:linear-gradient(90deg,#000,transparent 55%);mask-image:linear-gradient(90deg,#000,transparent 55%)}
.demo-cartao{padding:clamp(22px,3vw,32px);border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--sombra-pop)}
.form{position:relative;display:grid;gap:16px}
.form[hidden],.form-ok[hidden]{display:none}
.isca{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.campo label{display:block;font:600 13.5px/1.3 var(--f-texto);color:var(--ink)}
.campo input:not([type="checkbox"]){display:block;width:100%;min-height:48px;margin-top:8px;padding:12px 14px;border-radius:12px;border:1px solid var(--borda-campo);background:#fff;color:var(--ink);font:400 16px/1.3 var(--f-texto);transition:border-color .25s var(--ease),box-shadow .25s var(--ease)}
.campo input::placeholder{color:#8C95A8}
.campo input:not([type="checkbox"]):focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(11,42,154,.18)}
.campo input[aria-invalid="true"]{border-color:var(--erro)}
.erro{display:block;margin-top:6px;font:500 13px/1.45 var(--f-texto);color:var(--erro)}
.erro:empty{display:none}
.campo .consentimento{display:flex;gap:12px;align-items:flex-start;cursor:pointer;font:400 13.5px/1.55 var(--f-texto);color:var(--ink-2)}
.consentimento input{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--brand);cursor:pointer}
.consentimento strong{color:var(--ink);font-weight:600}
.erro-servidor{font-size:14px;line-height:1.5;color:var(--erro)}
.erro-servidor:empty{display:none}
.btn-enviar{width:100%;margin-top:4px}
.btn-enviar[disabled]{opacity:.72;cursor:progress;transform:none}
.form-ok{padding:24px 8px;text-align:center}
.form-ok svg{width:64px;height:auto;margin:0 auto}
.form-ok h3{margin-top:18px;font:700 1.6rem/1.2 var(--f-titulo);color:var(--ink)}
.form-ok p{margin-top:10px;color:var(--ink-2)}
.form-ok:focus{outline:none}

/* rodapé em azul profundo */
.rodape{padding:0;overflow:hidden;background:radial-gradient(680px 440px at 0% 100%,rgba(60,196,255,.14),transparent 70%),var(--deep);color:#fff}
.rodape-topo{padding:48px 0 28px;background:rgba(11,42,102,.5);-webkit-backdrop-filter:blur(26px) saturate(150%);backdrop-filter:blur(26px) saturate(150%)}
.rodape-grade{padding:24px 0;display:grid;grid-template-columns:minmax(200px,1.3fr) repeat(3,minmax(120px,1fr)) auto;gap:32px 40px;align-items:start}
.rodape-marca{width:150px;height:auto;color:var(--digital)}
.rodape-assinatura{margin-top:14px;max-width:230px;font:600 14.5px/1.45 var(--f-titulo);color:#fff}
.rodape-assinatura span{color:var(--digital)}
.rodape-col h2{margin:0 0 14px;font:600 15px/1.2 var(--f-titulo);letter-spacing:.01em;color:#fff}
.rodape-col ul{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none}
.rodape-col a{display:inline-flex;align-items:center;min-height:32px;font:400 14px/1.3 var(--f-texto);color:var(--sobre-escuro-2);text-decoration:none;transition:color .25s var(--ease)}
.rodape-col a:hover{color:#fff}
.rodape-acao{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.rodape-acao h2{margin:0;font:600 15px/1.2 var(--f-titulo);letter-spacing:.01em;color:#fff}
.rodape-botoes{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:12px;width:max-content;max-width:100%}
.rodape-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:0 22px;border-radius:999px;border:1px solid transparent;font:600 15px/1 var(--f-titulo);text-decoration:none;transition:background-color .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease)}
.rodape-btn[hidden]{display:none}
.rodape-btn svg{flex:none;width:20px;height:20px}
.rodape-btn-zap{background:#25D366;color:#062B1A}
.rodape-btn-zap:hover{background:#3FE07D;transform:translateY(-1px)}
.rodape-btn-email{background:transparent;border-color:rgba(255,255,255,.5);color:#fff}
.rodape-btn-email:hover{background:rgba(255,255,255,.12);border-color:#fff;transform:translateY(-1px)}
@media (max-width:620px){.rodape-acao{align-items:stretch}.rodape-botoes{width:100%}.rodape-btn{min-width:0;padding:0 12px;white-space:nowrap}}
.rodape-base{padding:18px 0 22px;background:rgba(2,8,23,.42);border-top:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(22px) saturate(140%);backdrop-filter:blur(22px) saturate(140%)}
.rodape-base-pilha{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.rodape-copy{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 10px;font:500 13px/1.4 var(--f-texto);color:var(--sobre-escuro)}
.rodape-copy a{display:inline-flex;align-items:center;padding:4px 0}
.rodape-copy img{display:block;width:auto;height:20px;opacity:.92;transform:translateY(-2%)}
.rodape-copy a:hover img{opacity:1}
.rodape-legal{max-width:860px;font-size:11.5px;line-height:1.6;color:var(--sobre-escuro-2);opacity:.85}
@media (max-width:1040px){.rodape-grade{grid-template-columns:repeat(3,1fr)}.rodape-id{grid-column:1/-1}.rodape-acao{grid-column:1/-1}}
@media (max-width:620px){.rodape-grade{grid-template-columns:1fr 1fr}.rodape-topo{padding:32px 0 20px}.rodape-grade{padding:20px 0}}
.rodape :focus-visible{outline-color:#7EC4FF}

/* ---------- entradas: em sequência quando o bloco aparece; depois o atraso é aposentado ---------- */
.anima .titulo-topo .linha1,.anima .titulo-topo .linha2,.anima .topo-texto .selo,.anima .topo-sub,.anima .topo-texto .btn-grande,.anima .tour,.anima .modulos{animation:sobe .9s var(--ease-out) both}
.anima .topo-texto .selo{animation-delay:.05s}
.anima .titulo-topo .linha1{animation-delay:.12s}
.anima .titulo-topo .linha2{animation-delay:.22s}
.anima .topo-sub{animation-delay:.32s}
.anima .topo-texto .btn-grande{animation-delay:.42s}
.anima .tour{animation-delay:.3s;animation-duration:1.1s}
.anima .modulos{animation-delay:.55s}
@keyframes sobe{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.anima [data-entra] [data-i]{opacity:0;transform:translateY(22px);transition:opacity .85s var(--ease-out),transform .85s var(--ease-out);transition-delay:calc(var(--i,0)*90ms)}
.anima [data-entra].in [data-i]{opacity:1;transform:none}
.anima [data-entra].feito [data-i]{transition-delay:0s!important}
.anima .recurso .recurso-tela{opacity:0;transform:translateX(36px);transition:opacity 1s var(--ease-out) .15s,transform 1s var(--ease-out) .15s}
.anima .recurso-inverso .recurso-tela{transform:translateX(-36px)}
.anima .recurso.in .recurso-tela{opacity:1;transform:none}

/* ---------- fundos discretos: grade fina nas seções claras (dados e painéis), constelação nas bordas das faixas (conexões) ---------- */
.secao-grade,.faixa-clara,.faixa-escura,.rodape{position:relative;isolation:isolate}
.secao-grade::before,.faixa-clara::before,.faixa-escura::before,.rodape::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none}
/* a grade some a partir do topo de cada seção */
.secao-grade::before{background-image:linear-gradient(rgba(11,42,154,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(11,42,154,.06) 1px,transparent 1px);background-size:64px 64px;background-position:50% -1px;-webkit-mask-image:radial-gradient(ellipse 62% 560px at 50% 0,#000,transparent);mask-image:radial-gradient(ellipse 62% 560px at 50% 0,#000,transparent)}
/* a constelação fica só nas bordas, longe do texto */
.faixa-clara::before,.faixa-escura::before,.rodape::before{background-image:var(--constelacao);background-size:600px 400px;-webkit-mask-image:radial-gradient(ellipse 78% 72% at 50% 50%,transparent 50%,#000 100%);mask-image:radial-gradient(ellipse 78% 72% at 50% 50%,transparent 50%,#000 100%)}
.faixa-escura::before,.rodape::before{background-image:var(--constelacao-clara)}

/* ---------- telas ampliáveis: tocar ou clicar abre a tela inteira ---------- */
.recurso-tela .janela,.cartao-tela{position:relative}
.ampliavel{cursor:zoom-in}
.ampliavel::after{content:"";position:absolute;right:10px;bottom:10px;z-index:2;width:34px;height:34px;border-radius:10px;background:rgba(11,42,102,.82) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7'/%3E%3C/svg%3E") center/16px no-repeat;opacity:0;transform:scale(.9);transition:opacity .3s var(--ease),transform .3s var(--ease);pointer-events:none}
.ampliavel:hover::after,.ampliavel:focus-visible::after{opacity:1;transform:none}
@media (hover:none){.ampliavel::after{opacity:.95;transform:none}}
.lupa{width:min(1240px,96vw);max-width:none;max-height:none;padding:0;border:0;border-radius:18px;background:#0B1A3A;color:#fff;box-shadow:0 40px 120px -20px rgba(0,0,0,.6);overflow:hidden}
.lupa::backdrop{background:rgba(6,14,34,.74);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.lupa-topo{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px 10px 18px;background:linear-gradient(180deg,#14408F,#0B2A66)}
.lupa-titulo{min-width:0;font:500 13.5px/1.4 var(--f-texto);color:#D7E3FA;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lupa-fechar{flex:none;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:12px;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;transition:background-color .25s var(--ease)}
.lupa-fechar:hover{background:rgba(255,255,255,.22)}
.lupa-fechar:focus-visible{outline-color:#7EC4FF}
.lupa-rolagem{max-height:calc(94vh - 64px);overflow:auto;background:#fff;overscroll-behavior:contain}
.lupa-img{display:block;width:100%;height:auto;max-width:none}
.lupa.retrato .lupa-img{width:auto;max-width:100%;max-height:calc(94vh - 64px);margin:0 auto}
.lupa-dica{display:none}

/* ---------- contato direto pelo WhatsApp (aparece só com o número configurado) ---------- */
.zap{position:fixed;right:20px;bottom:20px;z-index:45;display:inline-flex;align-items:center;gap:10px;min-height:56px;padding:6px 20px 6px 6px;border-radius:999px;background:#fff;color:var(--ink);font:600 15px/1 var(--f-titulo);text-decoration:none;box-shadow:0 16px 36px -14px rgba(11,42,102,.5),0 0 0 1px rgba(17,20,28,.06);transition:transform .3s var(--ease),opacity .3s var(--ease),visibility 0s}
.zap:hover{transform:translateY(-2px)}
/* recolhido sobre o formulário (que já tem o link do WhatsApp) e sobre o rodapé, para não cobrir campos nem texto */
.zap.recolhido{opacity:0;visibility:hidden;transform:translateY(16px);transition:transform .3s var(--ease),opacity .3s var(--ease),visibility 0s .3s}
.zap[hidden],.zap-alternativa[hidden]{display:none}
.zap-circulo{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#25D366;color:#fff}
.zap-circulo svg{width:24px;height:24px}
.zap-alternativa{margin-top:20px;font-size:16px;color:var(--ink-2)}
.link-zap{display:inline-flex;align-items:center;gap:6px;margin-left:4px;font-weight:600;color:#0F7A40;text-decoration:none}
.link-zap svg{width:18px;height:18px}
.link-zap:hover{text-decoration:underline}

/* ---------- responsivo ---------- */
@media (max-width:1080px){
  .topo-grade{grid-template-columns:minmax(0,1fr)}
  .topo-texto{max-width:40rem}
  .tour{max-width:760px}
  .modulos{flex-direction:column;align-items:stretch;gap:18px}
  .modulos-intro{padding:0 0 16px;border-right:0;border-bottom:1px solid var(--line)}
}
@media (max-width:900px){
  .comparacoes,.pilares{grid-template-columns:minmax(0,1fr)}
  .recurso{grid-template-columns:minmax(0,1fr)}
  .recurso-inverso .recurso-texto{order:0}
  .painel-demo{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:760px){
  /* no celular o tour vira um slider de dedo: as cenas ficam lado a lado, a rolagem nativa encaixa uma por vez
     e a ponta da cena vizinha aparece na borda da tela (sem JavaScript fica só a primeira cena, como no desktop) */
  .com-js .tour-palco{display:flex;gap:12px;aspect-ratio:auto;margin-inline:-16px;padding:10px 16px 34px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x pan-y}
  .com-js .tour-palco::-webkit-scrollbar{display:none}
  .com-js .tour-cena{position:relative;inset:auto;flex:0 0 calc(100% - 24px);aspect-ratio:16/10.6;opacity:1;visibility:visible;transform:none;transition:none;scroll-snap-align:center;scroll-snap-stop:always}
  .com-js .tour-cena:not(.ativa) .destaque{opacity:0}
  /* sombras mais curtas, para caberem no slider sem corte */
  .com-js .tour-palco .janela{box-shadow:0 18px 32px -18px rgba(11,42,102,.55),0 0 0 1px rgba(11,42,102,.14)}
  .com-js .tour-palco .painel-ia{box-shadow:0 18px 32px -16px rgba(11,42,102,.5),0 0 0 1px rgba(17,20,28,.06)}
  .com-js .tour-controles{margin-top:2px}
  .lupa{width:100vw;height:100svh;max-height:100svh;margin:0;border-radius:0}
  /* no celular a tela ampliada fica no meio da altura, com a dica logo abaixo */
  .lupa[open]{display:flex;flex-direction:column}
  .lupa-rolagem{max-height:calc(100svh - 104px);margin-top:auto}
  .lupa.retrato .lupa-rolagem,.lupa.paisagem .lupa-dica{margin-bottom:auto}
  .lupa.paisagem .lupa-img{width:auto;height:min(calc(100svh - 124px),560px)}
  .lupa.retrato .lupa-img{max-height:calc(100svh - 124px)}
  .lupa.paisagem .lupa-dica{display:block;padding:10px 16px;font-size:12.5px;color:#C9D6F0;text-align:center}
  /* as colunas dos módulos acompanham o tamanho da letra (em), então a letra aumentada no celular não encavala os nomes */
  .modulos-lista{grid-template-columns:repeat(auto-fill,minmax(6em,1fr));row-gap:16px}
  .etapas{grid-template-columns:minmax(0,1fr);gap:32px}
  .etapas::before{display:none}
  .tour-rotulo{font-size:12.5px}
  .tour-passos{gap:10px}
  .chat-resposta{grid-template-columns:minmax(0,1fr);gap:12px;padding:20px}
  .chat-avatar{width:36px}
}
@media (max-width:560px){
  /* no celular as perguntas da IA ficam uma embaixo da outra, sem rolagem de lado */
  .chat-perguntas{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
  .chat-pergunta{width:100%;padding:12px 16px;border-radius:14px;text-align:left}
  /* no celular os botões podem quebrar a linha, e o do topo ocupa a largura toda */
  .btn{max-width:100%;white-space:normal;text-align:center}
  .btn-grande{width:100%;padding:12px 24px;line-height:1.25}
  .btn-menu{white-space:nowrap}
  /* no celular só o passo atual do tour tem legenda, na largura toda, embaixo das barras */
  .tour-passos{position:relative;padding-bottom:30px}
  .tour-passo{padding:12px 0}
  .tour-rotulo{position:absolute;left:0;right:0;top:34px;margin:0;font-size:13.5px;opacity:0;pointer-events:none;transition:opacity .3s var(--ease)}
  .tour-passo[aria-current="true"] .tour-rotulo{opacity:1}
  .tour-pausa{margin-top:-6px}
  .zap{right:16px;bottom:16px;padding:6px}
  .zap > span:last-child{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media (max-width:480px){
  /* no celular o cartão fica só com o título, acima da janela da frente */
  .destaque,.tour-cena[data-passo="1"] .destaque{top:2%;gap:8px;padding:8px 12px 8px 8px;border-radius:12px}
  .destaque-icone{width:28px;height:28px}
  .destaque-icone .icone{width:15px;height:15px}
  .destaque-ia svg{width:18px}
  .destaque-texto strong{font-size:12px}
  .destaque-texto span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .tour-cena .janela-tras .url{display:none}
  .janela-barra{height:20px;padding:0 8px;gap:8px}
  .pontos i{width:6px;height:6px}
  .url{font-size:9px;padding:1px 7px}
  .comparacao,.pilar{padding:22px}
}
@media (max-width:400px){
  /* em tela bem estreita a faixa de módulos e o formulário ganham largura (três colunas de módulos; o botão cabe mesmo com a letra aumentada) */
  .modulos{padding:16px}
  .painel-demo{padding:24px 14px}
  .demo-cartao{padding:20px 16px}
  .btn-enviar{padding:12px 16px}
}

/* ---------- aba oculta e movimento reduzido ---------- */
body.pausado *,body.pausado *::before,body.pausado *::after{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* ---------- vidro fosco: menu e painéis translúcidos com desfoque ---------- */
.menu-caixa{background:rgba(255,255,255,.5);border-color:rgba(255,255,255,.7);box-shadow:0 10px 30px -16px rgba(11,42,102,.35),inset 0 1px 0 rgba(255,255,255,.8);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6)}
.selo,.destaque,.modulos,.comparacao,.acordeao details,.demo-cartao{background:rgba(255,255,255,.58);border-color:rgba(255,255,255,.75);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5)}
.pilar{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4)}
.campo input:not([type="checkbox"]){background:rgba(255,255,255,.7)}

/* ---------- fundo: degradê azul suave com rede neural discreta (padrão contínuo 480x320) ---------- */
:root{--fundo-diagonal:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='320' viewBox='0 0 480 320'%3E%3Cpath d='M287 274L350 284M-25 129L48 101M455 129L528 101M98 102L116 214M-39 -24L31 25M-39 296L31 345M441 -24L511 25M441 296L511 345M337 107L369 197M48 101L98 102M42 194L116 214M-25 129L48 101M455 129L528 101M204 116L225 180M263 204L287 274M369 197L427 203M207 60L270 134M-39 296L17 280M441 296L497 280M350 284L369 197M-25 129L42 194M455 129L522 194M262 23L287 -46M262 343L287 274M263 204L270 134M100 268L116 214M204 116L207 60M219 271L287 274M270 134L337 107M438 31L441 -24M438 351L441 296M427 203L441 296M31 25L98 102M207 60L262 23M225 180L270 134M362 21L438 31M219 -49L262 23M219 271L262 343M42 194L48 101M96 37L98 102M-42 31L31 25M438 31L511 25M17 -40L31 25M17 280L31 345M17 -40L31 25M17 280L31 345M48 101L96 37M438 31L441 -24M438 351L441 296M-42 31L31 25M438 31L511 25M17 280L42 194M225 180L263 204M350 -36L362 21M350 284L362 341M204 116L270 134M31 25L48 101M427 203L455 129M262 23L287 -46M262 343L287 274M337 107L362 21M350 -36L362 21M350 284L362 341M-39 296L17 280M441 296L497 280M219 271L263 204M31 25L96 37M17 280L100 268M96 37L100 -52M96 357L100 268M219 -49L262 23M219 271L262 343' fill='none' stroke='%232563EB' stroke-opacity='.13' stroke-width='1'/%3E%3Cg fill='%232563EB' fill-opacity='.22'%3E%3Ccircle cx='31' cy='25' r='2.2'/%3E%3Ccircle cx='48' cy='101' r='2.2'/%3E%3Ccircle cx='42' cy='194' r='2.2'/%3E%3Ccircle cx='17' cy='280' r='2.2'/%3E%3Ccircle cx='96' cy='37' r='2.2'/%3E%3Ccircle cx='98' cy='102' r='2.2'/%3E%3Ccircle cx='116' cy='214' r='2.2'/%3E%3Ccircle cx='100' cy='268' r='2.2'/%3E%3Ccircle cx='207' cy='60' r='2.2'/%3E%3Ccircle cx='204' cy='115' r='2.2'/%3E%3Ccircle cx='225' cy='180' r='2.2'/%3E%3Ccircle cx='219' cy='271' r='2.2'/%3E%3Ccircle cx='262' cy='23' r='2.2'/%3E%3Ccircle cx='270' cy='134' r='2.2'/%3E%3Ccircle cx='263' cy='204' r='2.2'/%3E%3Ccircle cx='287' cy='274' r='2.2'/%3E%3Ccircle cx='362' cy='21' r='2.2'/%3E%3Ccircle cx='337' cy='107' r='2.2'/%3E%3Ccircle cx='369' cy='197' r='2.2'/%3E%3Ccircle cx='350' cy='284' r='2.2'/%3E%3Ccircle cx='438' cy='31' r='2.2'/%3E%3Ccircle cx='455' cy='129' r='2.2'/%3E%3Ccircle cx='427' cy='203' r='2.2'/%3E%3Ccircle cx='441' cy='297' r='2.2'/%3E%3C/g%3E%3C/svg%3E") 0 0/480px 320px repeat,linear-gradient(135deg,#EAF1FE 0%,#CFDEF8 50%,#A9C3F1 100%)}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:var(--fundo-diagonal)}
.topo-fundo{background:var(--fundo-diagonal)}

/* ---------- pirâmides do fundo: tamanhos e posições aleatórios ---------- */
:root{--padrao:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='1000' viewBox='0 0 1600 1000'%3E%3Cg fill='none' stroke='%232563EB' stroke-linejoin='miter'%3E%3Cpath transform='translate(90 594) rotate(27) scale(1.04) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.22' stroke-width='1.15'/%3E%3Cpath transform='translate(1243 172) rotate(16) scale(0.90) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.40' stroke-width='1.34'/%3E%3Cpath transform='translate(445 242) rotate(29) scale(0.58) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.40' stroke-width='2.05'/%3E%3Cpath transform='translate(771 52) rotate(-25) scale(1.83) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.20' stroke-width='0.66'/%3E%3Cpath transform='translate(1596 998) rotate(-13) scale(2.02) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.34' stroke-width='0.60'/%3E%3Cpath transform='translate(241 451) rotate(5) scale(0.79) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.23' stroke-width='1.51'/%3E%3Cpath transform='translate(260 809) rotate(33) scale(0.92) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.29' stroke-width='1.31'/%3E%3Cpath transform='translate(1016 799) rotate(6) scale(1.04) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.40' stroke-width='1.15'/%3E%3Cpath transform='translate(510 926) rotate(-0) scale(1.58) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.27' stroke-width='0.76'/%3E%3Cpath transform='translate(164 184) rotate(-11) scale(2.05) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.38' stroke-width='0.58'/%3E%3Cpath transform='translate(1395 90) rotate(-34) scale(0.56) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.31' stroke-width='2.16'/%3E%3Cpath transform='translate(1071 524) rotate(34) scale(1.68) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.34' stroke-width='0.72'/%3E%3Cpath transform='translate(215 47) rotate(4) scale(0.84) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.40' stroke-width='1.42'/%3E%3Cpath transform='translate(469 539) rotate(25) scale(1.58) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.31' stroke-width='0.76'/%3E%3Cpath transform='translate(780 511) rotate(27) scale(0.59) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.22' stroke-width='2.05'/%3E%3Cpath transform='translate(966 187) rotate(-11) scale(0.47) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.34' stroke-width='2.58'/%3E%3Cpath transform='translate(319 591) rotate(-0) scale(0.70) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.31' stroke-width='1.72'/%3E%3Cpath transform='translate(1503 825) rotate(8) scale(1.00) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.20' stroke-width='1.20'/%3E%3Cpath transform='translate(1252 772) rotate(-22) scale(0.70) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.27' stroke-width='1.70'/%3E%3Cpath transform='translate(575 826) rotate(-26) scale(1.00) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.20' stroke-width='1.20'/%3E%3Cpath transform='translate(1461 497) rotate(30) scale(1.49) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.18' stroke-width='0.80'/%3E%3Cpath transform='translate(1150 650) rotate(-12) scale(1.49) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.20' stroke-width='0.80'/%3E%3Cpath transform='translate(29 320) rotate(10) scale(0.98) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.32' stroke-width='1.23'/%3E%3Cpath transform='translate(805 212) rotate(6) scale(0.99) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.31' stroke-width='1.21'/%3E%3Cpath transform='translate(723 324) rotate(34) scale(1.94) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.31' stroke-width='0.62'/%3E%3Cpath transform='translate(272 330) rotate(23) scale(0.52) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.36' stroke-width='2.31'/%3E%3Cpath transform='translate(917 813) rotate(-24) scale(1.17) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.22' stroke-width='1.02'/%3E%3Cpath transform='translate(1310 99) rotate(-13) scale(0.71) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.32' stroke-width='1.70'/%3E%3Cpath transform='translate(1294 477) rotate(-21) scale(0.69) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.40' stroke-width='1.73'/%3E%3Cpath transform='translate(1356 827) rotate(-5) scale(1.53) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.40' stroke-width='0.78'/%3E%3Cpath transform='translate(985 980) rotate(14) scale(1.35) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.31' stroke-width='0.89'/%3E%3Cpath transform='translate(1480 375) rotate(-30) scale(1.22) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.27' stroke-width='0.99'/%3E%3Cpath transform='translate(707 706) rotate(-10) scale(1.84) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.32' stroke-width='0.65'/%3E%3Cpath transform='translate(1295 690) rotate(0) scale(0.75) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.32' stroke-width='1.60'/%3E%3Cpath transform='translate(195 333) rotate(-33) scale(0.61) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.23' stroke-width='1.98'/%3E%3Cpath transform='translate(496 382) rotate(-23) scale(1.27) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.34' stroke-width='0.95'/%3E%3Cpath transform='translate(363 763) rotate(30) scale(1.25) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.29' stroke-width='0.96'/%3E%3Cpath transform='translate(1554 649) rotate(-29) scale(0.72) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.22' stroke-width='1.67'/%3E%3Cpath transform='translate(1221 75) rotate(2) scale(1.28) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.36' stroke-width='0.93'/%3E%3Cpath transform='translate(1091 27) rotate(6) scale(1.19) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.32' stroke-width='1.01'/%3E%3Cpath transform='translate(187 525) rotate(-11) scale(1.04) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.36' stroke-width='1.16'/%3E%3Cpath transform='translate(1581 206) rotate(23) scale(1.70) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.32' stroke-width='0.71'/%3E%3Cpath transform='translate(1439 134) rotate(-12) scale(0.78) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.23' stroke-width='1.53'/%3E%3Cpath transform='translate(115 723) rotate(12) scale(1.85) translate(-48 -47.6)' d='M57 25.7 22.2 49.1 57 69.5 73.8 58.9Z M57 25.7 57 69.5' stroke-opacity='0.40' stroke-width='0.65'/%3E%3C/g%3E%3C/svg%3E")}
.topo-fundo::before,.painel-demo::before{background-size:1600px 1000px}
.topo-fundo::before{-webkit-mask-image:radial-gradient(ellipse 60% 55% at 50% 42%,transparent 25%,#000 100%);mask-image:radial-gradient(ellipse 60% 55% at 50% 42%,transparent 25%,#000 100%)}

/* ---------- responsividade: toque, telas muito largas, paisagem baixa e áreas seguras ---------- */
@media (pointer:coarse){
  .menu-marca{padding-block:10px;box-sizing:content-box}
  .tour-passo{padding-block:14px}
  .link-seta{min-height:44px}
  .rodape-col a,.rodape-copy a{min-height:44px}
  .campo input[type="checkbox"]{width:24px;height:24px}
}
@media (min-width:1800px){
  .caixa{width:min(1360px,100% - 64px)}
  .menu-caixa{max-width:1360px}
}
@media (max-height:520px) and (orientation:landscape){
  .topo{padding-top:96px}
  .secao{padding-block:56px}
}
@supports (padding:max(0px)){
  .menu{padding-top:max(0px,env(safe-area-inset-top))}
  .rodape-base{padding-bottom:max(22px,env(safe-area-inset-bottom))}
}

/* Sobre a AUTVS: vidro fosco, quatro passos sem rolagem */
.menu-links button{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:0;border-radius:10px;background:none;font:500 15px var(--f-texto);color:var(--ink-2);cursor:pointer;transition:color .25s var(--ease),background-color .25s var(--ease)}
.menu-links button:hover{color:var(--ink);background:var(--surface-2)}
.sobre{width:min(820px,94vw);max-width:none;max-height:92svh;margin:auto;padding:0;border:1px solid rgba(255,255,255,.28);border-radius:24px;background:rgba(10,26,61,.62);color:#fff;box-shadow:0 30px 120px -20px rgba(30,155,255,.45),inset 0 1px 0 rgba(255,255,255,.18);-webkit-backdrop-filter:blur(24px) saturate(1.5);backdrop-filter:blur(24px) saturate(1.5);overflow:hidden}
.sobre[open]{display:flex;flex-direction:column}
.sobre::backdrop{background:rgba(2,8,23,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.sobre-fechar{position:absolute;right:12px;top:12px;z-index:1;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:none;color:#C9D6F0;cursor:pointer;transition:background-color .25s var(--ease)}
.sobre-fechar:hover{background:rgba(255,255,255,.12);color:#fff}
.sobre :focus-visible{outline-color:#7EC4FF}
.sobre-passos{flex:1;min-height:0;padding:48px 40px 28px}
.sobre-passo{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:32px}
.sobre-passo[hidden]{display:none}
.sobre-texto{display:grid;gap:12px;text-align:left;font-weight:300;line-height:1.6;color:#C9D6F0}
.sobre-texto p{margin:0}
.sobre-texto strong{font-weight:600;color:#fff}
.sobre-texto .sobre-rotulo{font:600 11px/1 var(--f-titulo);letter-spacing:.3em;text-transform:uppercase;color:#FFB84D}
.sobre-texto h2{margin:0;font:300 clamp(1.6rem,4vh,2.4rem)/1.15 var(--f-titulo);color:#fff}
.sobre-visual{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;margin:0;padding:0;list-style:none;text-align:center}
.sobre-marca{font:300 clamp(3rem,9vw,5.5rem)/1 var(--f-titulo);letter-spacing:.08em}
.sobre-marca em,.sobre-comp em{font-style:normal;color:#FFB84D}
.sobre-fonetica{font:300 clamp(1.5rem,4vw,2.2rem) var(--f-titulo);letter-spacing:.2em;color:#7EC4FF}
.sobre-comp{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:#9FB3DA}
.sobre-familia{flex-direction:row;flex-wrap:wrap;gap:10px}
.sobre-familia span{padding:8px 16px;border:1px solid rgba(126,196,255,.5);border-radius:999px;background:rgba(30,155,255,.12);font:300 18px var(--f-titulo);color:#7EC4FF}
.sobre-prisma{width:100%;max-width:300px;height:auto;filter:drop-shadow(0 0 30px rgba(30,155,255,.35))}
.sobre-faces{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%;max-width:320px}
.sobre-faces li{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.05);font:600 14px var(--f-texto);text-align:left}
.sobre-faces li::before{content:"";flex:none;width:14px;height:14px;background:var(--face);transform:rotate(45deg)}
.sobre-rodape{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 20px;border-top:1px solid rgba(255,255,255,.1)}
.sobre-rodape button{min-height:44px;padding:0 18px;border:0;border-radius:999px;background:none;font:500 14px var(--f-texto);color:#C9D6F0;cursor:pointer;transition:background-color .25s var(--ease)}
.sobre-rodape button:hover:not(:disabled){background:rgba(255,255,255,.12);color:#fff}
.sobre-rodape button:disabled{opacity:.3;cursor:default}
.sobre-rodape .sobre-prox{border:1px solid rgba(126,196,255,.5);background:rgba(30,155,255,.12);font-weight:600;color:#7EC4FF}
.sobre-pontos{display:flex;gap:6px}
.sobre-pontos button{width:8px;min-height:0;height:8px;padding:0;border-radius:999px;background:rgba(255,255,255,.25);transition:width .25s var(--ease),background-color .25s var(--ease)}
.sobre-pontos button[aria-current="step"]{width:24px;background:#7EC4FF}
@media (max-width:760px){
  .sobre{width:96vw}
  .sobre-passos{padding:44px 20px 16px}
  .sobre-passo{grid-template-columns:minmax(0,1fr);gap:20px}
  .sobre-prisma{max-width:170px}
  .sobre-marca{font-size:2.8rem}
}

/* ---------- fundo: degradê suave em malha (ciano no alto à esquerda, âmbar embaixo, luz branca no alto à direita, violeta no canto) com as cores da marca ---------- */
:root{--fundo-malha:radial-gradient(70% 80% at 0% 0%,rgba(60,196,255,.62),rgba(60,196,255,0) 72%),radial-gradient(60% 70% at 0% 100%,rgba(255,160,0,.5),rgba(255,160,0,0) 72%),radial-gradient(60% 70% at 100% 100%,rgba(82,39,115,.42),rgba(82,39,115,0) 72%),radial-gradient(55% 55% at 78% 6%,#fff,rgba(255,255,255,0) 72%),linear-gradient(135deg,#F4F8FF,#FFFFFF 55%,#FFF4EC)}
body::before{background:var(--fundo-malha)}
.topo-fundo{background:none}
.topo-fundo::before,.topo-fundo::after{display:none}

/* ---------- vidro fosco claro, igual ao menu do topo: painel da demonstração e janela Sobre ---------- */
.painel-demo{background:rgba(255,255,255,.45);border:1px solid rgba(255,255,255,.7);box-shadow:0 10px 30px -16px rgba(11,42,102,.35),inset 0 1px 0 rgba(255,255,255,.8);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6)}
.demo-cartao{background:rgba(255,255,255,.5);border-color:rgba(255,255,255,.7);box-shadow:0 10px 30px -16px rgba(11,42,102,.35),inset 0 1px 0 rgba(255,255,255,.8);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6)}
.sobre{background:rgba(255,255,255,.5);border-color:rgba(255,255,255,.7);color:var(--ink);box-shadow:0 30px 80px -24px rgba(11,42,102,.45),inset 0 1px 0 rgba(255,255,255,.8);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6)}
.sobre::backdrop{background:rgba(17,20,28,.28)}
.sobre-fechar{color:var(--ink-2)}
.sobre-fechar:hover{background:rgba(11,42,154,.08);color:var(--ink)}
.sobre :focus-visible{outline-color:var(--brand)}
.sobre-texto{color:var(--ink-2)}
.sobre-texto strong,.sobre-texto h2{color:var(--ink)}
.sobre-texto .sobre-rotulo{color:var(--brand)}
.sobre-marca{color:var(--ink)}
.sobre-marca em,.sobre-comp em{color:var(--accent)}
.sobre-fonetica{color:var(--brand)}
.sobre-comp{color:var(--ink-3)}
.sobre-familia span{border-color:var(--brand-200);background:rgba(255,255,255,.6);color:var(--brand)}
.sobre-prisma{filter:drop-shadow(0 10px 24px rgba(11,42,154,.25))}
.sobre-faces li{border-color:rgba(17,20,28,.08);background:rgba(255,255,255,.6);color:var(--ink)}
.sobre-rodape{border-top-color:rgba(17,20,28,.08)}
.sobre-rodape button{color:var(--ink-2)}
.sobre-rodape button:hover:not(:disabled){background:rgba(11,42,154,.08);color:var(--ink)}
.sobre-rodape .sobre-prox{border-color:var(--brand-200);background:rgba(255,255,255,.7);color:var(--brand)}
.sobre-pontos button{background:rgba(17,20,28,.2)}
.sobre-pontos button[aria-current="step"]{background:var(--brand)}
/* sem pirâmides decorativas nos painéis */
.painel-demo::before,.topo-fundo::before{display:none}

/* Entrar: ícone de porta com seta + texto igual aos demais itens do menu */
.menu-entrar{gap:8px;font:500 15px var(--f-texto);color:var(--ink-2)}
.menu-entrar:hover{color:var(--ink)}
.menu-entrar .icone{width:18px;height:18px;flex:none}

/* versão do site no rodapé */
.rodape-versao{margin:0;font-size:11px;letter-spacing:.04em;color:var(--sobre-escuro-2);opacity:.7}

/* depoimentos */
.depoimentos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:52px}
.depoimento{margin:0;display:flex;flex-direction:column;justify-content:space-between;gap:24px;padding:28px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:var(--sombra-cartao)}
.depoimento blockquote{margin:0}
.depoimento blockquote p{margin:0;font-size:1.02rem;line-height:1.65;color:var(--ink-2)}
.depoimento figcaption{display:flex;align-items:center;gap:14px}
.depoimento-avatar{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--brand-50);color:var(--brand);font:600 .95rem/1 var(--f-titulo)}
.depoimento-quem{display:flex;flex-direction:column;gap:2px;font-size:.9rem;line-height:1.35;color:var(--ink-3)}
.depoimento-quem strong{font-weight:600;color:var(--ink)}
@media (max-width:900px){.depoimentos{grid-template-columns:1fr}}

/* preços e planos */
.planos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;gap:18px;margin-top:56px}
.plano{position:relative;display:flex;flex-direction:column;padding:30px 24px;border-radius:20px;background:rgba(255,255,255,.72);border:1px solid var(--line);box-shadow:var(--sombra-cartao);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4)}
.plano-destaque{background:rgba(228,243,255,.82);border-color:rgba(30,155,255,.4)}
.plano-selo{position:absolute;top:-13px;left:20px;padding:7px 12px;border-radius:999px;background:var(--brand);color:#fff;font:600 10.5px/1 var(--f-titulo);letter-spacing:.12em;text-transform:uppercase}
.plano h3{font:600 1.2rem/1.3 var(--f-titulo);color:var(--ink)}
.plano-desc{margin-top:8px;font-size:.92rem;color:var(--ink-3)}
.plano-valor{margin-top:22px;font:700 clamp(2.6rem,2.2rem + 1vw,3.2rem)/1 var(--f-titulo);letter-spacing:-.03em;color:var(--ink);white-space:nowrap}
.plano-moeda{margin-right:6px;font-size:.36em;font-weight:600;letter-spacing:0;vertical-align:.8em;color:var(--ink-3)}
.plano-per{margin-left:6px;font-size:.28em;font-weight:500;letter-spacing:0;color:var(--ink-3)}
.plano-sub{margin-top:10px;font-size:.85rem;color:var(--ink-3)}
.plano-lista{margin:22px 0 28px;padding:0;list-style:none;display:grid;gap:12px;font-size:.93rem;color:var(--ink-2)}
.plano-lista li{display:flex;gap:10px;align-items:flex-start}
.plano-lista .icone{flex:none;width:18px;height:18px;margin-top:2px;color:var(--digital)}
.plano-btn{width:100%;margin-top:auto;padding:0 16px;font-size:14.5px}
.btn-contorno{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn-contorno:hover{background:var(--ink);color:#fff;transform:translateY(-1px)}
.planos-nota{margin:32px 0 0;text-align:center;font:500 .92rem/1.5 var(--f-titulo);color:var(--ink-3)}
.planos-nota a{color:var(--brand);font-weight:600}
@media (max-width:1180px){.planos{grid-template-columns:repeat(2,minmax(0,1fr));max-width:44rem;margin-inline:auto;gap:30px 18px}}
@media (max-width:640px){.planos{grid-template-columns:minmax(0,1fr);max-width:26rem}}