/* O TYPE DO ESCALA VENDAS (versão 3, 08/11/2026). O visual da página publicada (v2): fundo azul-noite, Sora nos
   títulos, um azul de ação e o ciano das provas. A ilustração aprovada: funis/paginas/type-escala-vendas/desenho/telas.html */
@font-face{font-family:Sora;src:url(fontes/sora-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(fontes/jetbrains-mono-400.woff2) format("woff2");font-weight:400;font-display:swap}
:root{--bg:#040810;--surf:#0A111F;--line:rgba(160,195,255,.1);--line2:rgba(160,195,255,.18);--tx:#F2F6FF;--tx2:#A3B3CA;--tx3:#7486A1;
  --blue:#2E6CF6;--cy:#38BDF8;--cy2:#8BD8FF;--grn:#4ADE80;--ouro:#F5C77A;--red:#FF7A86;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--disp:Sora,var(--sans);--mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --mola:cubic-bezier(.32,.72,0,1);--col:580px}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font:16px/1.5 var(--sans);color:var(--tx);background:radial-gradient(90% 50% at 85% -5%,rgba(46,108,246,.24),transparent 60%),radial-gradient(70% 40% at 0% 100%,rgba(56,189,248,.08),transparent 60%),var(--bg);background-attachment:fixed;min-height:100dvh}
img,video{max-width:100%;display:block}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--cy);outline-offset:3px}
[tabindex="-1"]:focus-visible{outline:none}
.pular{position:absolute;left:-999px;top:8px;z-index:30;padding:10px 14px;border-radius:10px;background:var(--blue);color:#fff}
.pular:focus{left:12px}
[hidden]{display:none!important}

/* a barra do topo: a marca e o progresso */
.barra-t{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:calc(10px + env(safe-area-inset-top)) 18px 10px;background:rgba(4,8,16,.86);border-bottom:1px solid var(--line)}
.barra-t img{height:16px;width:auto}
.prog{flex:1;height:5px;border-radius:3px;background:rgba(160,195,255,.12);overflow:hidden}
.prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--cy));transition:width .6s var(--mola)}
.prog-n{font:12px var(--mono);color:var(--tx3);white-space:nowrap}

.palco{max-width:var(--col);margin:0 auto;padding:0 18px 140px}

/* a faixa de credibilidade, acima da barra (mesa, 08/11/2026, #7) */
.faixa-t{padding:calc(8px + env(safe-area-inset-top)) 12px 8px;background:var(--blue);color:rgba(255,255,255,.88);font-size:12.5px;line-height:1.4;text-align:center}
.faixa-t b{color:#fff;font-weight:600}
.faixa-t+.barra-t{padding-top:10px}

/* a abertura (mesa, 08/11/2026; 09/11, #15: "tem que caber somente em uma dobra na versão mobile"): sem manchete; a foto do
   fundador e a fala dele, a primeira mensagem da conversa; o botão; quem contrata. Tudo numa tela de 390x844 */
.abertura{padding:12px 0 16px}
.ab-logo{height:20px;width:auto}
.ab-olho{text-align:center;font:11.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--cy2)}
.ab-hero{margin-top:6px;display:grid;justify-items:center}
.ab-foto{position:relative;width:156px;aspect-ratio:1;isolation:isolate}
/* o halo atrás do recorte: um disco de luz azul e um anel fino ciano (o neon da casa, parado) */
.ab-foto::before{content:"";position:absolute;inset:14% 6% 0;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(46,108,246,.55),rgba(46,108,246,.18) 62%,transparent)}
.ab-foto::after{content:"";position:absolute;left:9%;right:9%;top:16%;aspect-ratio:1;z-index:-1;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(56,189,248,.55),0 0 40px rgba(56,189,248,.18)}
.ab-foto img{width:100%;height:100%;object-fit:contain;-webkit-mask-image:linear-gradient(#000 80%,transparent);mask-image:linear-gradient(#000 80%,transparent)}
.ab-nome{margin-top:-14px;position:relative;display:grid;justify-items:center;padding:6px 14px;border-radius:12px;background:rgba(10,17,31,.94);box-shadow:inset 0 0 0 1px var(--line2),0 12px 30px -14px rgba(0,0,0,.9);font-size:11.5px;line-height:1.3;color:var(--tx2);text-align:center}
.ab-nome b{color:#fff;font-size:14px;font-weight:600}
/* a fala: o balão do Douglas, com a ponta para a foto */
.ab-msg{position:relative;margin-top:12px;padding:12px 15px;border-radius:18px;background:var(--surf);box-shadow:inset 0 0 0 1px var(--line2);display:grid;gap:6px;font-size:15px;line-height:1.45;color:var(--tx2);text-wrap:pretty}
.ab-msg::before{content:"";position:absolute;left:50%;top:-7px;width:14px;height:14px;margin-left:-7px;background:var(--surf);transform:rotate(45deg);box-shadow:-1px -1px 0 0 var(--line2)}
.ab-msg p:first-child{color:#fff;font-weight:600}
.ab-msg b{color:#fff;font-weight:600}
.ab-btn{margin-top:12px;width:100%;min-height:52px}
.ab-priv{margin-top:6px;font-size:12px;color:var(--tx3);text-align:center}
/* quem contrata: as mais fortes em destaque, sem fundo (#13, #14), as outras correndo */
.ab-quem{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.ab-quem-t{font:600 13px/1.3 var(--sans);text-align:center;color:var(--tx2);text-wrap:balance}
.ab-destaque{list-style:none;padding:0;margin:10px 0 0;display:flex;justify-content:center;align-items:flex-end;gap:36px}
.ab-destaque li{display:grid;justify-items:center;gap:5px}
.ab-destaque img{height:30px;width:auto;filter:grayscale(1) brightness(0) invert(1)}
.ab-destaque img.alto{height:40px}
.ab-destaque small{font:11px var(--mono);color:var(--cy2);letter-spacing:.02em}
.ab-trilho{margin:12px -18px 0;overflow:hidden}
.ab-correr{display:flex}
.ab-fila{list-style:none;padding:0 18px;margin:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 26px}
.ab-trilho.anda{-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.ab-trilho.anda .ab-correr{width:max-content;animation:ab-anda 60s linear infinite}
.ab-trilho.anda .ab-fila{flex-wrap:nowrap;padding:0 26px 0 0}
@keyframes ab-anda{to{transform:translateX(-50%)}}
.ab-fila li{flex:none;display:flex;align-items:center}
.ab-fila img{height:18px;width:auto;filter:grayscale(1) brightness(0) invert(1);opacity:.62}
.ab-fila img.alto{height:26px}
.ab-fila img.quad{height:24px}
.ab-fila img.desenho{height:28px}
.ab-fila img.nome{height:var(--h,14px)}

/* botões */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:space-between;gap:14px;min-height:56px;padding:0 8px 0 24px;border:0;border-radius:999px;font-weight:600;font-size:16px;cursor:pointer;transition:transform .4s var(--mola),background-color .3s,opacity .3s}
.btn-p{background:var(--blue);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 14px 30px -14px rgba(46,108,246,.9)}
.btn-i{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.16);display:grid;place-items:center;font-size:17px}
.btn:active{transform:scale(.98)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
@media (hover:hover){.btn-p:not([disabled]):hover{background:#3B78FF}}
.btn-s{background:rgba(160,195,255,.07);color:var(--tx);box-shadow:inset 0 0 0 1px var(--line2)}

/* a conversa */
.conversa{padding-top:14px}
.msg{display:grid;grid-template-columns:30px 1fr;gap:10px;margin-top:18px;animation:entra .5s var(--mola) both}
.msg .av{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#3B78FF,#1D4ED8);display:grid;place-items:center;margin-top:2px}
.msg .av img{width:18px;height:18px;filter:brightness(0) invert(1)}
.bal{padding:12px 14px;border-radius:4px 18px 18px 18px;background:var(--surf);box-shadow:inset 0 0 0 1px var(--line2)}
.bal .perg{font:700 19px/1.25 var(--disp);letter-spacing:-.02em;text-wrap:balance}
.bal .ctx{margin-top:5px;font-size:13.5px;color:var(--tx3)}
.bal .nova{display:inline-block;margin-bottom:6px;font:11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--cy2)}
.eu{margin:14px 0 0 auto;max-width:86%;width:fit-content;padding:10px 14px;border-radius:18px 4px 18px 18px;background:var(--blue);color:#fff;font-size:14.5px;line-height:1.4;animation:entra .4s var(--mola) both}

/* as opções da pergunta atual */
.ops{margin:12px 0 0 40px;display:grid;gap:8px}
.ops.grade{grid-template-columns:1fr 1fr}
.op{display:flex;align-items:center;gap:11px;min-height:48px;padding:10px 14px;border:0;border-radius:14px;background:rgba(160,195,255,.04);box-shadow:inset 0 0 0 1px var(--line2);font-size:14.5px;line-height:1.3;color:var(--tx2);text-align:left;cursor:pointer;transition:background .25s,box-shadow .25s,color .25s,transform .3s var(--mola)}
.op i{flex:none;width:18px;height:18px;border-radius:5px;box-shadow:inset 0 0 0 1.5px var(--tx3);display:grid;place-items:center;font-style:normal;font-size:12px;color:#fff}
.op[role=radio] i{border-radius:50%}
.op[aria-checked=true]{background:rgba(46,108,246,.16);box-shadow:inset 0 0 0 1.5px var(--blue);color:#fff}
.op[aria-checked=true] i{background:var(--blue);box-shadow:none}
.op[aria-checked=false] i{color:transparent}
.op:active{transform:scale(.98)}
@media (hover:hover){.op:hover{box-shadow:inset 0 0 0 1px rgba(56,189,248,.5);color:var(--tx)}}
.grupo-t{margin:14px 0 0 40px;font:11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--tx3)}
.grupo-t+.ops{margin-top:6px}

/* o contador negativo da pergunta 1 (o #117 da v1, mesa 08/11/2026 #10): depois da primeira marca, o que não está
   funcionando fica vermelho, em onda a partir do que foi tocado. Só opacidade e cor: aparece com "reduzir movimento" */
.op{position:relative}
.marcou .op[role=checkbox][aria-checked=false]{background:rgba(255,122,134,.07);box-shadow:inset 0 0 0 1px rgba(255,122,134,.42);color:#FFD6DA;transition-delay:calc(var(--i,0) * 60ms)}
.marcou .op[role=checkbox][aria-checked=false] i{box-shadow:inset 0 0 0 1.5px rgba(255,122,134,.65)}
.marcou .op[role=checkbox][aria-checked=false]::after{content:"parado";margin-left:auto;padding-left:8px;font:600 10px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#FF9AA4}
.parados{margin:12px 0 0 40px;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:rgba(160,195,255,.04);box-shadow:inset 0 0 0 1px var(--line)}
.parados .med{flex:none;display:grid;grid-auto-flow:column;grid-auto-columns:7px;gap:3px}
.parados .med i{height:8px;border-radius:2px}
.parados .med i.on{background:var(--cy)}
.parados .med i.off{background:var(--red)}
.parados-n{font-size:13.5px;line-height:1.45;color:var(--tx2)}
.parados-n b{font-family:var(--mono);font-weight:500;color:var(--cy)}
.parados-n em{font-style:normal;font-family:var(--mono);font-weight:500;color:#FF9AA4}

/* a versão por canal da pergunta 1 (mesa, #12): cada canal com o ícone dele */
.canais{margin:12px 0 0 40px;display:grid;gap:14px}
.canal{padding:12px;border-radius:18px;background:rgba(160,195,255,.03);box-shadow:inset 0 0 0 1px var(--line)}
.canal-t{display:flex;align-items:center;gap:10px;font:700 15px/1.2 var(--disp);letter-spacing:-.01em;color:#fff}
.canal-ic{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center}
.canal-ic svg{width:19px;height:19px;fill:currentColor}
.canal-whatsapp .canal-ic{background:rgba(37,211,102,.14);color:#25D366}
.canal-ligacao .canal-ic{background:rgba(56,189,248,.14);color:var(--cy)}
.canal-instagram .canal-ic{background:rgba(225,48,108,.16);color:#F06292}
.canal-site .canal-ic{background:rgba(245,199,122,.14);color:var(--ouro)}
.canal .ops{margin:10px 0 0}
.canal .op{min-height:44px;font-size:14px}

/* os casos de sucesso em carrossel (mesa, 09/11/2026, #18): arrasta com o dedo, encaixa um por vez, o próximo aparece
   na beirada para convidar o arrasto */
.casos{margin-top:8px}
.casos-trilho{display:grid;grid-auto-flow:column;grid-auto-columns:86%;align-items:start;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;margin:0 -12px;padding:2px 12px 4px;scroll-padding:0 12px}
.casos-trilho::-webkit-scrollbar{display:none}
.casos.um .casos-trilho{grid-auto-columns:100%}
.casos-trilho.arrastando{scroll-snap-type:none;cursor:grabbing;user-select:none}
@media (hover:hover){.casos:not(.um) .casos-trilho{cursor:grab}}
.caso{scroll-snap-align:start;display:flex;flex-direction:column;min-width:0}
.caso .midia,.caso .case,.caso .frase{margin-top:0}
.casos:not(.um) .midia img{height:210px}
.casos:not(.um) .midia.numero img{aspect-ratio:auto;object-fit:contain;background:#050A14}
.casos:not(.um) .case,.casos:not(.um) .frase{min-height:210px;display:flex;flex-direction:column;justify-content:center}
.caso-para{margin-bottom:6px;font:600 11px/1.3 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--cy2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.caso-t{margin-top:8px;font-size:14px;line-height:1.45;color:#E6EEFF}
.casos-nav{margin-top:10px;display:flex;align-items:center;gap:10px}
.casos-pts{display:flex;gap:5px;flex:1}
.casos-pts i{width:6px;height:6px;border-radius:3px;background:rgba(160,195,255,.25);transition:width .3s var(--mola),background .3s}
.casos-pts i.on{width:18px;background:var(--cy)}
.casos-n{font:12px var(--mono);color:var(--tx3)}
.casos-b{width:36px;height:36px;border:0;border-radius:50%;background:rgba(160,195,255,.08);box-shadow:inset 0 0 0 1px var(--line2);color:#fff;font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center}
.casos-b:active{transform:scale(.95)}
@media (hover:none){.casos-b{display:none}}
.casos-dica{margin-top:6px;font-size:12.5px;color:var(--tx3)}

/* o número do SIC como fala da SKY (mesa, #22 a #30): só o balão, com os números em destaque e a fonte embaixo */
.fala-sky .bal{display:grid;gap:4px}
.fala-t{font-size:15px;line-height:1.5;color:var(--tx)}
.fala-t b{color:var(--cy);font-weight:700}
.fala-de{font:11px var(--mono);letter-spacing:.03em;color:var(--tx3)}
.fala-de+.fala-t{margin-top:8px}
.fala-sky .alerta,.fala-sky .mapa-l{margin-top:8px}
/* as opções surgem uma de cada vez (#32, #33). "backwards": depois de entrar, a opção volta a responder ao toque
   (scale no :active). Com "reduzir movimento", só o esmaecer, que continua visível */
.surge .op,.surge .canal-t,.surge .grupo-t,.surge .campo,.surge .consultor{animation:surge .42s var(--mola) backwards;animation-delay:calc(.45s + var(--k,0) * .12s)}
@keyframes surge{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.surge .op,.surge .canal-t,.surge .grupo-t,.surge .campo,.surge .consultor{animation-name:surge-op!important;animation-duration:.42s!important}}
@keyframes surge-op{from{opacity:0}to{opacity:1}}

/* o "digitando..." da SKY: três pontos que piscam em opacidade (aparecem também com "reduzir movimento") */
.digitando .bal{display:inline-flex;width:fit-content;padding:12px 14px}
.pts{display:inline-flex;gap:5px}
.pts i{width:7px;height:7px;border-radius:50%;background:var(--tx2);animation:pisca 1.1s ease-in-out infinite}
.pts i:nth-child(2){animation-delay:.18s}
.pts i:nth-child(3){animation-delay:.36s}
@keyframes pisca{0%,100%{opacity:.25}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.pts i{animation:pisca 1.1s ease-in-out infinite!important}}
.passo{scroll-margin-top:64px}
.resp{scroll-margin-top:64px}

/* o contato */
.campos{margin:12px 0 0 40px;display:grid;gap:10px}
.campo label{display:block;font:11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--tx3);margin-bottom:5px}
.campo input{width:100%;min-height:50px;padding:0 14px;border:0;border-radius:13px;background:rgba(160,195,255,.06);box-shadow:inset 0 0 0 1px var(--line2);color:#fff;font:16px var(--sans)}
.campo input:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--cy)}
.campo input[aria-invalid=true]{box-shadow:inset 0 0 0 1.5px var(--red)}
.campo .erro{margin-top:5px;font-size:13px;color:var(--red)}
.isca{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.consultor{margin:12px 0 0 40px;display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:rgba(46,108,246,.1);box-shadow:inset 0 0 0 1px rgba(46,108,246,.4)}
.consultor img{width:46px;height:46px;border-radius:50%;object-fit:cover}
.consultor p{font-size:13px;color:var(--tx2);line-height:1.35}
.consultor b{display:block;color:#fff;font-size:14px}

/* a resposta da SKY: a prova e o alerta */
.resp{margin:14px 0 0 40px;padding:12px;border-radius:18px;background:linear-gradient(180deg,#0E1830,#0A1222);box-shadow:inset 0 0 0 1px rgba(56,189,248,.28);animation:entra .55s var(--mola) both}
.resp .quem{font:11px var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--cy2)}
.resp .t{margin-top:6px;font-size:14.5px;line-height:1.45}
.resp .t b{color:#fff}
.midia{margin-top:10px;border-radius:13px;overflow:hidden;position:relative;background:#000;display:block;width:100%;border:0;padding:0;cursor:pointer;text-align:left}
.midia img{width:100%;height:180px;object-fit:cover}
.midia.print img{height:230px;object-position:top}
.midia.numero img{height:auto;aspect-ratio:1}
.midia .play{position:absolute;left:50%;top:42%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:rgba(255,255,255,.94);display:grid;place-items:center;color:var(--blue);font-size:15px}
.midia .leg{position:absolute;left:0;right:0;bottom:0;padding:26px 12px 10px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.86));font-size:12.5px;color:#DCE8FF;line-height:1.3}
.midia .leg b{display:block;font-size:13.5px;color:#fff}
.midia.numero .leg{position:static;background:#0A1222;padding:8px 10px}
.case{margin-top:10px;padding:12px;border-radius:13px;background:rgba(160,195,255,.05);box-shadow:inset 0 0 0 1px var(--line2)}
.case .case-logo{height:24px;width:auto;max-width:150px;object-fit:contain;filter:grayscale(1) brightness(2.3)}
.case-autor{margin-top:10px;display:flex;align-items:center;gap:10px}
.case-autor img{flex:none;width:40px;height:40px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px rgba(56,189,248,.35)}
.case-autor p{margin:0}
.case q{display:block;margin-top:8px;font-size:14.5px;color:#fff;quotes:none}
.case p{margin-top:6px;font-size:12.5px;line-height:1.35;color:var(--tx3)}
.case b{display:inline-block;margin-top:8px;font:12.5px var(--mono);color:var(--cy2)}
.frase{margin-top:10px;padding:14px;border-radius:13px;background:linear-gradient(135deg,rgba(46,108,246,.24),rgba(56,189,248,.08));box-shadow:inset 0 0 0 1px rgba(56,189,248,.35)}
.frase b{display:block;font:700 30px/1.05 var(--disp);letter-spacing:-.03em;color:#fff}
.frase span{display:block;margin-top:5px;font-size:13.5px;color:var(--tx2)}
.alerta{margin-top:10px;padding:10px 11px;border-radius:12px;background:rgba(245,199,122,.08);box-shadow:inset 0 0 0 1px rgba(245,199,122,.3);font-size:13.5px;line-height:1.42;color:#F7DDB0}
.alerta b{color:var(--ouro)}
.mapa-l{margin-top:10px;display:flex;gap:9px;align-items:flex-start;font-size:13.5px;color:var(--cy2);background:rgba(56,189,248,.07);border-radius:11px;padding:9px 11px}
.mapa-l b{flex:none;font:700 10.5px/1.8 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--cy)}

/* a ação da vez fica fixa embaixo, no polegar */
.acao{position:fixed;left:0;right:0;bottom:0;z-index:15;padding:12px 18px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(4,8,16,0),rgba(4,8,16,.92) 30%)}
.acao .btn{display:flex;width:100%;max-width:calc(var(--col) - 36px);margin:0 auto}
.acao .erros{max-width:calc(var(--col) - 36px);margin:0 auto 8px;font-size:13.5px;color:var(--red);text-align:center}

/* o mapa, a aprovação e a agenda */
.selo{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;background:rgba(74,222,128,.12);box-shadow:inset 0 0 0 1px rgba(74,222,128,.4);font:12px var(--mono);color:var(--grn);letter-spacing:.05em;text-transform:uppercase}
.selo.azul{color:var(--cy2);background:rgba(56,189,248,.1);box-shadow:inset 0 0 0 1px rgba(56,189,248,.4)}
.fim{margin:22px 0 0;animation:entra .55s var(--mola) both}
.fim h2{margin-top:12px;font:700 24px/1.15 var(--disp);letter-spacing:-.03em;text-wrap:balance}
.fim h2 em{font-style:normal;color:var(--cy)}
.fim .sub{margin-top:8px;font-size:15px;color:var(--tx2)}
.lista-mapa{margin-top:14px;padding:0;list-style:none;display:grid;gap:7px;counter-reset:m}
.lista-mapa li{display:grid;grid-template-columns:26px 1fr;gap:8px;font-size:14px;color:var(--tx2);padding:10px 12px;border-radius:12px;background:rgba(160,195,255,.04);box-shadow:inset 0 0 0 1px var(--line);counter-increment:m}
.lista-mapa li::before{content:counter(m,decimal-leading-zero);font:12px/1.6 var(--mono);color:var(--cy)}
.regua{margin-top:16px;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;text-align:center;padding:0;list-style:none}
.regua li{position:relative;font-size:11.5px;color:var(--tx3);line-height:1.25}
.regua i{position:relative;z-index:1;display:block;margin:0 auto 6px;width:26px;height:26px;border-radius:50%;font:700 12px/23px var(--sans);font-style:normal;background:#0B1424;box-shadow:inset 0 0 0 1.5px var(--grn);color:var(--grn)}
/* a linha entre as bolinhas (mesa, #45): sai da bolinha anterior e chega nesta; verde até onde a pessoa já chegou */
.regua li+li::before{content:"";position:absolute;top:12px;right:calc(50% + 13px);width:calc(100% - 22px);height:2px;border-radius:1px;background:rgba(160,195,255,.22);transform-origin:left center}
.regua li.ok::before,.regua li.at::before{background:var(--grn)}
/* aparecem uma de cada vez: a linha corre e a bolinha acende. Com "reduzir movimento", só o esmaecer (continua visível) */
.regua.anima li{animation:regua-pt .45s var(--mola) backwards;animation-delay:calc(.25s + var(--k,0) * .5s)}
.regua.anima li::before{animation:regua-linha .4s ease-out backwards;animation-delay:calc(var(--k,0) * .5s)}
@keyframes regua-pt{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
@keyframes regua-linha{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.regua.anima li{animation-name:regua-op!important;animation-duration:.45s!important}.regua.anima li::before{animation-name:regua-op!important;animation-duration:.4s!important}}
@keyframes regua-op{from{opacity:0}to{opacity:1}}
.regua li.ok i{background:var(--grn);color:#04210F}
.regua li.at{color:#fff}
.agenda{margin-top:18px;padding:14px;border-radius:18px;background:var(--surf);box-shadow:inset 0 0 0 1px var(--line2)}
.agenda h3{font:700 18px/1.25 var(--disp);letter-spacing:-.02em}
.agenda .ctx{font-size:13px;color:var(--tx3);margin-top:3px}
/* o calendário semanal (mesa, #57): a coluna das horas e 5 dias; o que não está livre fica escuro */
.cal{margin-top:12px;display:grid;grid-template-columns:42px repeat(var(--cols,5),1fr);gap:4px}
.cal-h{display:grid;justify-items:center;padding:4px 0 6px;font:11px/1.25 var(--mono);color:var(--tx3)}
.cal-h b{font:600 12.5px/1.3 var(--sans);color:var(--tx3);text-transform:capitalize}
.cal-h.on b{color:#fff}
.cal-h.on{color:var(--cy2)}
.cal-t{display:grid;align-items:center;font:11px var(--mono);color:var(--tx3)}
.cal-x{min-height:34px;border-radius:8px;background:repeating-linear-gradient(135deg,rgba(160,195,255,.05) 0 5px,rgba(160,195,255,.02) 5px 10px);box-shadow:inset 0 0 0 1px rgba(160,195,255,.06)}
.hora{min-height:34px;border:0;border-radius:8px;background:rgba(74,222,128,.14);box-shadow:inset 0 0 0 1.5px rgba(74,222,128,.6);font:600 12px var(--mono);color:#E9FFF1;cursor:pointer;padding:0}
.hora[aria-pressed=true]{background:var(--blue);box-shadow:0 0 0 2px rgba(56,189,248,.55);color:#fff}
.hora:active{transform:scale(.96)}
.cal-leg{margin-top:8px;display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--tx3)}
.cal-leg .lv,.cal-leg .oc{width:12px;height:12px;border-radius:4px}
.cal-leg .lv{background:rgba(74,222,128,.3);box-shadow:inset 0 0 0 1.5px rgba(74,222,128,.7)}
.cal-leg .oc{margin-left:8px;background:repeating-linear-gradient(135deg,rgba(160,195,255,.14) 0 3px,rgba(160,195,255,.04) 3px 6px)}
.chk{margin-top:12px;display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--tx2);line-height:1.4;cursor:pointer}
.chk input{flex:none;width:20px;height:20px;margin-top:1px;accent-color:var(--blue)}
.chk b{color:#fff}
.socio{margin-top:8px}
.bonus{margin-top:14px;padding:12px 13px;border-radius:14px;background:linear-gradient(135deg,rgba(245,199,122,.16),rgba(245,199,122,.04));box-shadow:inset 0 0 0 1px rgba(245,199,122,.4);font-size:13.5px;color:#F7DDB0}
.bonus b{display:block;color:var(--ouro);font-size:14px}
/* o mapa pela metade no contato (mesa, #52): em amarelo, com o contador do que falta */
.mapa-falta{margin-top:10px;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:rgba(245,199,122,.1);box-shadow:inset 0 0 0 1px rgba(245,199,122,.4)}
.mf-med{flex:none;display:grid;grid-auto-flow:column;grid-auto-columns:14px;gap:4px}
.mf-med i{height:8px;border-radius:2px;background:rgba(245,199,122,.22)}
.mf-med i.on{background:var(--ouro)}
.mf-t{font-size:13.5px;color:#F7DDB0}
.mf-t b{font-family:var(--mono);font-weight:500;color:var(--ouro)}
/* o "Furar a fila" (mesa, #53): mais forte, com o "furar a fila" separado do resto e um brilho que respira (só opacidade:
   continua visível com "reduzir movimento") */
.btn-fila{min-height:64px;padding-left:20px;background:linear-gradient(135deg,#2E6CF6,#1D9BF0);isolation:isolate;text-align:left}
.btn-fila::after{content:"";position:absolute;inset:-3px;z-index:-1;border-radius:inherit;box-shadow:0 0 0 2px rgba(56,189,248,.7),0 0 26px 4px rgba(56,189,248,.45);animation:fila-respira 1.7s ease-in-out infinite}
@keyframes fila-respira{0%,100%{opacity:.35}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.btn-fila::after{animation:fila-respira 1.7s ease-in-out infinite!important}}
.fila-txt{display:grid;justify-items:start}
.fila-tag{display:inline-block!important;width:fit-content;margin-bottom:3px;padding:2px 8px;border-radius:999px;background:var(--ouro);color:#2A1B00;font:700 10.5px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.fila-t{font-size:17px;font-weight:700}
.fila-ia{margin:10px auto 0;max-width:var(--col);display:flex;gap:8px;align-items:flex-start;font-size:12.5px;line-height:1.4;color:var(--tx2)}
.fila-ia b{color:#fff}
.agenda .consultor{margin:12px 0 0}
.fila-ia em{font-style:normal;color:var(--ouro)}
.ia-pt{flex:none;margin-top:5px;width:8px;height:8px;border-radius:50%;background:#25D366;box-shadow:0 0 0 3px rgba(37,211,102,.2)}
/* depois de agendar: conversar com a IA comercial (mesa, #56) */
.cta-ia{margin-top:14px;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:linear-gradient(135deg,rgba(46,108,246,.22),rgba(56,189,248,.08));box-shadow:inset 0 0 0 1px rgba(56,189,248,.5);color:var(--tx);text-decoration:none}
.cta-ia .ia-av{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,#3B78FF,#1D4ED8);box-shadow:0 0 0 2px rgba(56,189,248,.5)}
.cta-ia .ia-av img{width:26px;height:26px;filter:brightness(0) invert(1)}
.cta-ia>span:not(.seta):not(.ia-av){flex:1;display:grid;gap:1px;min-width:0}
.cta-ia small{font-size:12px;color:var(--tx3)}
.cta-ia b{font-size:16px;color:#fff}
.cta-ia em{font-style:normal;font-size:12.5px;color:var(--cy2)}
.cta-ia .seta{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:#fff;font-weight:700}

/* os depoimentos em vídeo no fim da página de obrigado (mesa, #69) */
.depos{margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}
.depos h3{font:700 18px/1.25 var(--disp);letter-spacing:-.02em}
.depos .ctx{margin-top:3px;font-size:13px;color:var(--tx3)}
.depos-trilho{margin:12px -18px 0;padding:2px 18px 6px;scroll-padding:0 18px;display:grid;grid-auto-flow:column;grid-auto-columns:64%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.depos-trilho::-webkit-scrollbar{display:none}
.depo{scroll-snap-align:start;position:relative;display:block;border:0;padding:0;border-radius:16px;overflow:hidden;background:#000;cursor:pointer;text-align:left;aspect-ratio:4/5}
.depo img{width:100%;height:100%;object-fit:cover;object-position:center top}
.depo .play{position:absolute;left:50%;top:40%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:rgba(255,255,255,.94);display:grid;place-items:center;color:var(--blue);font-size:15px}
.depo .leg{position:absolute;left:0;right:0;bottom:0;padding:30px 12px 11px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.9));font-size:12.5px;line-height:1.3;color:#DCE8FF}
.depo .leg b{display:block;font-size:13.5px;color:#fff}
.depo:active{transform:scale(.98)}

/* o selo do WhatsApp no canto da foto (mesa, #65 e #67): a pessoa entende que a conversa é no WhatsApp */
.cons-av,.ia-av{position:relative;flex:none}
.wa-badge{position:absolute;right:-3px;bottom:-3px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#25D366;box-shadow:0 0 0 2px #0A111F}
.wa-badge svg{width:14px;height:14px;fill:#fff}
/* o consultor com foto e nome (mesa, #50) */
.cta-consultor{margin-top:18px;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:rgba(37,211,102,.08);box-shadow:inset 0 0 0 1px rgba(37,211,102,.35);color:var(--tx);text-decoration:none}
.cta-consultor img{flex:none;width:52px;height:52px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px rgba(37,211,102,.6)}
.cta-consultor>span:not(.seta):not(.cons-av){flex:1;display:grid;gap:1px;min-width:0}
.cta-consultor small{font-size:12px;color:var(--tx3)}
.cta-consultor b{font-size:16px;color:#fff}
.cta-consultor em{font-style:normal;font-size:12.5px;color:#7EE2A8}
.cta-consultor .seta{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#25D366;color:#04210F;font-weight:700}
.cta-consultor:active{transform:scale(.98)}
.bonus p{margin-top:4px;color:#F7DDB0}
.bonus{overflow:hidden}
/* "Só para quem comparece." numa faixa vermelha cheia no pé do bônus (mesa, #59 e #64) */
.bonus small{display:block;margin:12px -13px -12px;padding:8px 13px;background:#D93848;color:#fff;font:700 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;text-align:center}
/* o antes e o depois do bônus (mesa, #47): o problema que a pessoa marcou, riscado, e como fica com a IA */
.antes-depois{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:8px}
.antes-depois li{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.antes-depois span{display:flex;gap:7px;align-items:flex-start;padding:9px 10px;border-radius:11px;font-size:13px;line-height:1.35}
.antes-depois i{flex:none;font-style:normal;font-weight:700;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;margin-top:1px}
.ad-antes{background:rgba(255,122,134,.08);color:#FFD6DA}
.ad-antes i{background:rgba(255,122,134,.2);color:#FF9AA4}
.ad-depois{background:rgba(74,222,128,.09);color:#D7F7E3}
.ad-depois i{background:rgba(74,222,128,.22);color:var(--grn)}
.cami{margin-top:10px;padding:13px;border-radius:14px;background:rgba(160,195,255,.05);box-shadow:inset 0 0 0 1px var(--line2)}
.cami b{display:block;color:#fff;font-size:15px}.cami p{font-size:13.5px;color:var(--tx2);margin-top:2px}
.aviso{margin-top:10px;font-size:13.5px;color:var(--red)}

/* o print ou o vídeo aberto */
.zoom{border:0;padding:0;max-width:min(560px,100vw);width:100%;max-height:100dvh;height:100%;background:#000;color:#fff}
.zoom::backdrop{background:rgba(2,5,11,.9)}
.zoom-c{height:100%;overflow:auto;-webkit-overflow-scrolling:touch}
.zoom-c img,.zoom-c video{width:100%;height:auto}
.zoom-c video{max-height:100dvh;object-fit:contain}
.zoom-x{position:fixed;top:calc(10px + env(safe-area-inset-top));right:12px;z-index:2;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:#0B0F17;font-size:24px;cursor:pointer}
.sem-js{max-width:var(--col);margin:20px auto;padding:0 18px;color:var(--tx2)}
.sem-js a{color:var(--cy2)}

@keyframes entra{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.msg,.eu,.resp,.fim{animation:none}.prog i{transition:none}}
@media (min-width:720px){.palco{padding-top:20px}.abertura{padding-top:48px}.ab-sub{font-size:18px}}
