/* Applyer — landing page. Mesmo visual do app: vidro, bolhas de cor e botões com cara própria. */
html{scroll-behavior:smooth;scroll-padding-top:92px;color-scheme:light}
html.escuro{color-scheme:dark}
body{margin:0;background:#EEF2FB}
html.escuro body{background:#0C0E2C}
[hidden]{display:none!important}
*{box-sizing:border-box}
button,input{font:inherit;color:inherit}
a{color:var(--acento)}a:hover{color:var(--texto)}
.lp{--texto:#121633;--texto2:#4A5273;--acento:#3B3DBF;--verde:#0D623C;--laranja:#854010;--vidro:rgba(255,255,255,.58);--vidro2:rgba(255,255,255,.28);--aro:rgba(255,255,255,.85);--sombra:rgba(40,52,140,.24);--linha:rgba(60,70,140,.13);--campo:rgba(255,255,255,.72);--b1:#C3D3FF;--b2:#D3CFFF;--b3:#C2EFD9;--b4:#BCE9FA;--fundo:#EEF2FB;--peca:rgba(255,255,255,.62);position:relative;min-height:100vh;overflow-x:clip;color:var(--texto);background:var(--fundo);font-family:"Inter",-apple-system,BlinkMacSystemFont,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.escuro .lp{--texto:#EEF1FF;--texto2:#B6BEDF;--acento:#AEB8FF;--verde:#7EE2AE;--laranja:#FFB98A;--vidro:rgba(255,255,255,.09);--vidro2:rgba(255,255,255,.03);--aro:rgba(255,255,255,.15);--sombra:rgba(0,0,10,.55);--linha:rgba(255,255,255,.12);--campo:rgba(255,255,255,.08);--b1:#1E2A6E;--b2:#2A2370;--b3:#0E3D39;--b4:#0F335C;--fundo:#0C0E2C;--peca:rgba(255,255,255,.07)}
/* O fundo fica parado durante a rolagem. Os gradientes dispensam filtros em camadas animadas. */
.fundo{
  position:fixed;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse 57% 68% at 7% 4%,var(--b1),transparent),
    radial-gradient(ellipse 43% 66% at 100% 36%,var(--b2),transparent),
    radial-gradient(ellipse 50% 48% at 44% 101%,var(--b3),transparent),
    radial-gradient(ellipse 42% 55% at 100% 100%,var(--b4),transparent);
}
.conteudo{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:16px 24px 32px;display:flex;flex-direction:column;gap:clamp(64px,7.7vw,104px)}
.vidro{position:relative;isolation:isolate;background:linear-gradient(145deg,var(--vidro),var(--vidro2));border-radius:28px;box-shadow:inset 0 0 0 1px var(--aro),inset 0 1.5px 0 rgba(255,255,255,.85),inset 0 -14px 28px -18px rgba(255,255,255,.55),0 22px 44px -22px var(--sombra)}
.vidro::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;background:linear-gradient(125deg,rgba(255,255,255,.55),rgba(255,255,255,0) 32%,rgba(255,255,255,0) 70%,rgba(255,255,255,.2));opacity:.75}
.escuro .vidro{box-shadow:inset 0 0 0 1px var(--aro),inset 0 1px 0 rgba(255,255,255,.2),0 22px 44px -22px var(--sombra)}
.escuro .vidro::before{opacity:.15}
.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic-p{width:16px;height:16px}

/* topo */
.topo{
  --folga:clamp(0px,calc(7vw - 57.5px),6px);
  --vidro:rgba(247,249,255,.96);--vidro2:rgba(235,240,255,.94);
  position:sticky;top:10px;z-index:20;align-self:center;width:fit-content;max-width:100%;
  display:flex;align-items:center;gap:calc(clamp(16px,2vw,28px) + var(--folga));
  padding:5px calc(9px + var(--folga)) 5px calc(20px + var(--folga));border-radius:999px;
}
.escuro .topo{--vidro:rgba(31,35,76,.97);--vidro2:rgba(26,29,67,.96)}
.topo-fundo{pointer-events:none;position:absolute;top:0;left:50%;width:100%;height:100%;transform:translateX(-50%);border-radius:inherit;z-index:-1;transition:width .32s cubic-bezier(.22,.8,.22,1),height .3s ease,border-radius .3s ease}
.topo .marca{transition:transform .32s cubic-bezier(.22,.8,.22,1);z-index:1}
.topo .links> *{transition:opacity .16s ease,visibility .16s}
.topo.recolhido{pointer-events:none}
.topo.recolhido .topo-fundo{width:var(--largura-marca);height:46px;border-radius:24px}
.topo.recolhido .marca{pointer-events:auto;transform:translate(var(--marca-x),var(--marca-y)) scale(.93)}
.topo.recolhido .links> *{opacity:0;visibility:hidden;pointer-events:none}
.links-secoes{display:flex;align-items:center;gap:calc(2px + var(--folga));padding:2px;border-radius:999px;background:var(--peca);box-shadow:inset 0 0 0 1px var(--linha)}
.marca{display:inline-flex;align-items:center;width:fit-content;min-height:44px}
.marca img{display:block;width:140px;height:auto}
.marca .marca-inversa,.escuro .marca .marca-clara{display:none}
.escuro .marca .marca-inversa{display:block}
.links{display:flex;align-items:center;gap:calc(8px + var(--folga))}
.links a.lk,.nav-explorar summary{display:inline-flex;align-items:center;min-height:40px;text-decoration:none;color:var(--texto2);font-size:15px;font-weight:550;padding:8px calc(12px + var(--folga));border-radius:999px;transition:background .2s,color .2s}
.links a.lk:hover,.nav-explorar summary:hover,.nav-explorar[open] summary{background:var(--peca);color:var(--texto)}
.nav-explorar{position:relative}
.nav-explorar summary{cursor:pointer;gap:4px;list-style:none;white-space:nowrap}
.nav-explorar summary::-webkit-details-marker{display:none}
.nav-explorar summary svg{width:13px;height:13px;transition:transform .2s}
.nav-explorar[open] summary svg{transform:rotate(180deg)}
.nav-painel{position:absolute;z-index:1;top:calc(100% + 10px);left:50%;transform:translateX(-50%);width:290px;padding:7px;display:grid;gap:2px;border:1px solid var(--linha);border-radius:20px;background:#f5f6ff;box-shadow:0 12px 32px var(--sombra)}
.escuro .nav-painel{background:#202444}
.nav-explorar:not([open]) .nav-painel{display:none}
.nav-painel::after,.bs-menu::after{content:"";position:absolute;bottom:100%;left:0;right:0;height:14px}
.bs-menu.cima::after{bottom:auto;top:100%}
.nav-painel a{display:flex;align-items:center;gap:11px;border-radius:13px;padding:8px;text-decoration:none;color:var(--texto)}
.nav-painel a:hover,.nav-painel a:focus-visible{background:var(--peca)}
.nav-painel img{width:38px;height:38px;flex:none}
.nav-painel b,.nav-painel small{display:block;line-height:1.35}
.nav-painel b{font-size:.94rem}.nav-painel small{font-size:.78rem;color:var(--texto2)}
.topo + main{margin-top:clamp(-44px,-3vw,-18px)}

/* botões próprios */
.tecla{--fundo-t:linear-gradient(180deg,#535FDC,#3437B5);--borda-t:#23258A;position:relative;border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:0 10px 0 24px;border-radius:18px;font-size:16px;font-weight:700;color:#fff;text-decoration:none;white-space:nowrap;background:var(--fundo-t);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 0 rgba(0,0,40,.18),0 5px 0 var(--borda-t),0 16px 26px -12px rgba(52,55,181,.8);transform:translateY(0);transition:transform .12s ease,box-shadow .12s ease}
.tecla:hover{color:#fff;transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 0 rgba(0,0,40,.18),0 6px 0 var(--borda-t),0 20px 30px -12px rgba(52,55,181,.85)}
.tecla:active{transform:translateY(5px);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 0 var(--borda-t),0 6px 12px -8px rgba(52,55,181,.6)}
.tecla-p{min-height:44px;padding:0 8px 0 16px;font-size:14px;border-radius:14px;gap:10px}
.kbd{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 8px;border-radius:10px;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:14px;font-weight:600;color:#fff;background:rgba(255,255,255,.18);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35),inset 0 -2px 0 rgba(0,0,40,.25)}
.tecla-p .kbd{min-width:28px;height:28px;font-size:12px;border-radius:8px}
.btn-play{display:inline-flex;align-items:center;gap:12px;min-height:54px;padding:0 22px 0 8px;border-radius:999px;border:0;cursor:pointer;text-decoration:none;font-size:16px;font-weight:650;color:var(--texto);background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 1px var(--aro),0 10px 22px -16px var(--sombra);transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.escuro .btn-play{background:rgba(255,255,255,.08)}
.btn-play:hover{transform:translateY(-2px);color:var(--texto)}
.play-anel{position:relative;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;flex:none}
.play-anel::before{
  content:"";position:absolute;inset:-2px;border-radius:50%;pointer-events:none;
  /* A ponta fecha a emenda da cauda. O restante da volta é transparente. */
  background:
    radial-gradient(circle at 50% 1.25px,#c9fff2 .6px,transparent 1.5px),
    conic-gradient(transparent 0deg 244deg,#96a2ff00 244deg,#96a2ff38 273deg,#97d4e49c 314deg,#a6eddf 344deg,#c9fff2 359deg,transparent 360deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2.6px),#000 calc(100% - 2px),#000 calc(100% - .6px),transparent);
  mask:radial-gradient(farthest-side,transparent calc(100% - 2.6px),#000 calc(100% - 2px),#000 calc(100% - .6px),transparent);
  animation:orbitar-icone 3.2s linear infinite;
}
@keyframes orbitar-icone{from{transform:rotate(-45deg)}to{transform:rotate(315deg)}}
.btn-vidro{border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border-radius:16px;font-size:15px;font-weight:650;color:var(--texto);text-decoration:none;background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 1px var(--aro),0 4px 0 rgba(60,70,140,.14);transition:transform .12s ease,box-shadow .12s ease}
.escuro .btn-vidro{background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px var(--aro),0 4px 0 rgba(0,0,0,.35)}
.btn-vidro:hover{color:var(--texto);transform:translateY(-1px)}
.btn-vidro:active{transform:translateY(4px);box-shadow:inset 0 0 0 1px var(--aro),0 0 0 rgba(60,70,140,.14)}
.lp :focus-visible{
  outline:3px solid var(--acento);outline-offset:3px;
}
.pular-conteudo{
  position:fixed;top:10px;left:12px;z-index:60;padding:12px 18px;
  font:600 1rem/1.4 system-ui,sans-serif;border-radius:12px;background:#fff;color:#202680;
  transform:translateY(calc(-100% - 20px));
}
.pular-conteudo:focus{transform:none}
html:not(.js) .somente-js{display:none!important}
.conteudo > main{min-width:0;display:flex;flex-direction:column;gap:inherit}
.conteudo > main:focus{outline:none}

/* herói */
.heroi{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;padding-top:0;margin-top:0}
.plataformas{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 18px;font-size:14px;font-weight:600;color:var(--texto2)}
.plataformas span{display:inline-flex;align-items:center;gap:7px}
.plataformas img{width:16px;height:16px;object-fit:contain}
.escuro .plataformas img[src="marcas/mac.svg"]{filter:invert(1)}
.plataformas .arte-local{width:27px;height:25px}
.plataformas i{width:4px;height:4px;border-radius:50%;background:var(--texto2);opacity:.5}
.h1{margin:0;font-family:"Sora","Inter",system-ui,sans-serif;font-weight:800;font-size:clamp(2.4rem,5.6vw,4.75rem);line-height:1.06;letter-spacing:-.052em;text-wrap:balance;max-width:1050px}
.grad{background:linear-gradient(100deg,#3B3DBF,#08744F);-webkit-background-clip:text;background-clip:text;color:transparent}
.escuro .grad{background:linear-gradient(90deg,#AEB8FF,#7EE2AE);-webkit-background-clip:text;background-clip:text}
.lead{margin:0;font-size:clamp(17px,1.6vw,20px);line-height:1.55;color:var(--texto2);max-width:640px;text-wrap:pretty}
.cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;align-items:center}
.com-ia{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;font-size:14px;color:var(--texto2)}

/* Marcas dos provedores. */
.logo-slot{width:48px;height:48px;border-radius:15px;display:inline-flex;align-items:center;justify-content:center;flex:none;font-family:"Sora","Inter",system-ui,sans-serif;font-weight:800;font-size:20px;color:var(--texto);background:#FFFFFF;box-shadow:inset 0 0 0 1px rgba(60,70,140,.16),0 6px 14px -8px rgba(20,30,80,.35)}
.escuro .logo-slot{background:#1B1F52;color:#EEF1FF;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.logo-slot img{width:70%;height:70%;object-fit:contain}
.escuro .logo-slot img:is([src="marcas/chatgpt.svg"],[src="marcas/grok.svg"]){filter:invert(1)}
.escuro .logo-slot:has(img[src="marcas/openrouter.svg"]){background:#fff}
.logo-slot img[src="marcas/local.svg"]{width:90%;height:90%}

/* prévia do app */
.previa .secao-cab{align-self:flex-start;text-align:left}
.previa{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:-48px}
.app-janela{position:relative;width:100%;border-radius:30px;padding:0;overflow:hidden}
.app-barra{display:flex;align-items:center;gap:12px;height:48px;padding:0 18px;border-bottom:1px solid var(--linha);font-size:13px;font-weight:600;color:var(--texto2)}
.semaforo{display:flex;gap:7px}
.semaforo i{width:12px;height:12px;border-radius:50%;background:rgba(80,90,140,.22)}
.app-titulo{flex:1;text-align:center}
.app-corpo{display:flex;min-height:380px}
.app-lado{flex:0 0 210px;padding:16px 12px;display:flex;flex-direction:column;gap:4px;border-right:1px solid var(--linha)}
.aba{display:flex;align-items:center;gap:10px;width:100%;height:42px;padding:0 12px;border:0;border-radius:13px;background:transparent;cursor:pointer;font-size:14px;font-weight:550;color:var(--texto2);text-align:left;transition:background .3s,color .3s,transform .4s cubic-bezier(.34,1.56,.64,1)}
.aba:hover{color:var(--texto);transform:translateX(3px)}
.aba.on{color:var(--acento);font-weight:700;background:rgba(255,255,255,.75);box-shadow:inset 0 0 0 1px var(--aro),0 8px 18px -12px var(--sombra)}
.escuro .aba.on{background:rgba(255,255,255,.12)}
.aba .n{margin-left:auto;font-size:11px;font-weight:800;padding:2px 7px;border-radius:999px;background:rgba(59,61,191,.12);color:var(--acento)}
.lado-ia{margin-top:auto;display:flex;align-items:center;gap:10px;padding:10px;border-radius:16px;background:rgba(255,255,255,.4);box-shadow:inset 0 0 0 1px var(--aro);font-size:12px;color:var(--texto2);text-align:left}
.escuro .lado-ia{background:rgba(255,255,255,.05)}
.lado-ia .logo-slot{width:32px;height:32px;border-radius:10px;font-size:13px}
.lado-ia b{display:block;font-size:13px;color:var(--texto)}
.app-tela{position:relative;flex:999 1 520px;min-width:0;padding:26px clamp(16px,2vw,28px);display:flex;flex-direction:column;gap:18px;text-align:left;animation:trocaTela .5s cubic-bezier(.16,1,.3,1) backwards}
@keyframes trocaTela{from{opacity:0;transform:translateY(12px)}}
.t-sobre{font-size:13px;font-weight:650;color:var(--acento)}
.t-tit{margin:0;font-family:"Sora","Inter",system-ui,sans-serif;font-size:32px;font-weight:800;letter-spacing:-.04em}
.t-sub{margin:0;font-size:14px;color:var(--texto2);line-height:1.5}
.peca{border-radius:22px;padding:18px;background:var(--peca);box-shadow:inset 0 0 0 1px var(--aro)}
.linha2{display:flex;flex-wrap:wrap;gap:14px}
.linha2>.peca{flex:1 1 240px;min-width:0}
.selo{font-size:11px;font-weight:700;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.75);color:var(--acento);box-shadow:inset 0 0 0 1px var(--aro)}
.escuro .selo{background:rgba(255,255,255,.1)}
.av{width:34px;height:34px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;color:#121633;flex:none}
.av-g{width:52px;height:52px;border-radius:16px;font-size:17px}
.c0{background:linear-gradient(135deg,#C2CEFF,#8A9BFF)}
.c1{background:linear-gradient(135deg,#B4EED6,#7FC8F8)}
.c2{background:linear-gradient(135deg,#D7F59A,#7ED6A0)}
.c3{background:linear-gradient(135deg,#CFC9FF,#8C9BFF)}
.c4{background:linear-gradient(135deg,#A9ECFF,#A9B4FF)}
.mini-btn{border:0;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border-radius:13px;font-size:14px;font-weight:700;color:#fff;background:linear-gradient(180deg,#535FDC,#3437B5);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 3px 0 #23258A;transition:transform .1s,box-shadow .1s}
.mini-btn:active{transform:translateY(3px);box-shadow:0 0 0 #23258A}
.mini-btn.claro{color:var(--texto);background:rgba(255,255,255,.7);box-shadow:inset 0 0 0 1px var(--aro),0 3px 0 rgba(60,70,140,.16)}
.escuro .mini-btn.claro{background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px var(--aro),0 3px 0 rgba(0,0,0,.35)}
.anel{position:relative;width:96px;height:96px;flex:none}
.anel svg{width:96px;height:96px}
.anel b{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:24px;letter-spacing:-.03em;line-height:1}
.anel b span{font-size:11px;font-weight:500;color:var(--texto2);margin-top:2px}
.lst{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:15px;background:rgba(255,255,255,.45);font-size:13px;line-height:1.4}
.escuro .lst{background:rgba(255,255,255,.05)}
.lst.fora{background:transparent;box-shadow:inset 0 0 0 1px var(--linha)}
.lst.fora div>b{text-decoration:line-through}
.lst div{display:flex;flex-direction:column;flex:1;min-width:0}
.lst div span{font-size:12px;color:var(--texto2)}
.sal{font-weight:700;color:var(--verde);font-size:13px}
.chave-mini{width:46px;height:44px;border:0;padding:0;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none}
.chave-mini span{position:relative;width:40px;height:24px;border-radius:999px;background:rgba(80,90,140,.28);transition:background .3s}
.chave-mini span::after{content:"";position:absolute;left:2px;top:2px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.chave-mini.on span{background:#22A06B}
.chave-mini.on span::after{transform:translateX(16px)}
.vaga{display:flex;flex-direction:column;gap:12px;max-width:520px;animation:entraVaga .5s cubic-bezier(.34,1.3,.64,1) backwards}
@keyframes entraVaga{from{opacity:0;transform:translateY(24px) scale(.95)}}
.vaga-topo{display:flex;gap:12px;align-items:center}
.vaga-topo div{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.vaga-topo div>span{font-size:13px;color:var(--texto2)}
.match{font-family:"Sora",system-ui,sans-serif;font-weight:800;font-size:20px;color:var(--acento)}
.motivos{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:13px}
.motivos li{display:flex;gap:8px;align-items:flex-start}
.ok-ic{color:var(--verde)}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.6);box-shadow:inset 0 0 0 1px var(--aro);color:var(--texto2);white-space:nowrap}
.escuro .chip{background:rgba(255,255,255,.07)}
.kanban{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:10px;overflow-x:auto}
.col{display:flex;flex-direction:column;gap:8px;padding:10px;border-radius:18px;background:var(--peca);box-shadow:inset 0 0 0 1px var(--aro);min-height:220px}
.col b.cn{font-size:13px;padding:2px 4px}
.cart{display:flex;flex-direction:column;gap:2px;padding:10px;border-radius:13px;background:rgba(255,255,255,.7);font-size:12px;box-shadow:0 6px 14px -12px var(--sombra)}
.escuro .cart{background:rgba(255,255,255,.08)}
.cart span{color:var(--texto2)}
.cart em{font-style:normal;color:var(--acento);font-weight:600}
.fila{display:flex;flex-direction:column;gap:6px}
.fila-it{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;font-size:13px;transition:background .3s}
.fila-it.ativo{background:rgba(255,255,255,.65);box-shadow:inset 0 0 0 1px var(--aro)}
.escuro .fila-it.ativo{background:rgba(255,255,255,.1)}
.fila-it div{display:flex;flex-direction:column;flex:1;min-width:0}
.fila-it div span{font-size:12px;color:var(--texto2)}
.pill{font-size:11px;font-weight:700;padding:4px 9px;border-radius:999px;background:rgba(80,90,140,.12);color:var(--texto2);white-space:nowrap}
.pill.ok{color:var(--verde);background:rgba(47,191,138,.18)}
.pill.vai{color:var(--acento);background:rgba(108,123,255,.16)}
.legenda{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;font-size:14px;color:var(--texto2)}
.legenda span{display:inline-flex;align-items:center;gap:8px}
.dedo{display:inline-flex;align-items:center;gap:8px;font-weight:650;color:var(--acento)}
.ponto{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none}

/* navegador embutido dentro da prévia */
.pip{
  position:relative;width:min(278px,calc(100% - 24px));padding:10px;margin:0 12px 12px auto;
  display:flex;flex-direction:column;gap:7px;border-radius:22px;
  --vidro:#f3f5ff;--vidro2:#e2e9fb;
}
.escuro .pip{--vidro:#292d59;--vidro2:#242849}
.pip.fixo{width:min(560px,calc(100% - 24px))}
.pip-cab{display:flex;align-items:center;gap:8px;min-height:32px;padding-left:6px;font-size:12px;font-weight:650;min-width:0}
.pip-status{display:flex;align-items:center;gap:8px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pip-btn{width:44px;height:44px;flex:none;border:0;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--texto2);background:rgba(255,255,255,.6);box-shadow:inset 0 0 0 1px var(--aro)}
.escuro .pip-btn{background:rgba(255,255,255,.1)}
.pip-btn[aria-pressed="true"]{color:#fff;background:linear-gradient(180deg,#5260EC,#3437B5)}
.pip-janela,.nav-grande{
  position:relative;container-type:inline-size;overflow:hidden;
  border-radius:13px;background:#f7f8fd;color-scheme:light;box-shadow:inset 0 0 0 1px #d5d9e9;
}
.pip-tela{position:relative;width:100%;min-width:0;display:flex;flex-direction:column;color:#121633;background:#f7f8fd;text-align:left}
.pip:not(.fixo) .pip-janela{height:150px}
.pip:not(.fixo) .pip-tela{width:200%;transform:scale(.5);transform-origin:0 0}
.pip.fixo .pip-dica{display:none}
.pip-dica{position:absolute;right:7px;bottom:7px;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:11px;font-weight:650;color:#fff;background:rgba(18,22,51,.74);transition:opacity .3s,transform .4s cubic-bezier(.34,1.56,.64,1);pointer-events:none}
.nav-grande{border-radius:18px;min-width:0}
.pt-barra{flex:none;display:flex;align-items:center;gap:10px;height:40px;padding:0 12px;background:#E9ECF7;border-bottom:1px solid #DCE0F0;color:#4A5273}
.pt-url{flex:1;min-width:0;height:28px;border-radius:9px;background:#fff;display:flex;align-items:center;gap:6px;padding:0 10px;font-size:12px;white-space:nowrap;overflow:hidden;box-shadow:inset 0 0 0 1px #DCE0F0}
.pt-plat{font-size:11px;font-weight:700;padding:4px 9px;border-radius:999px;background:#fff;color:#3B3DBF;box-shadow:inset 0 0 0 1px #DCE0F0}
.pt-carrega{position:absolute;left:0;top:39px;height:3px;width:100%;background:linear-gradient(90deg,#5865F2,#3FD8F5);transform-origin:0 50%;animation:carregar .7s cubic-bezier(.16,1,.3,1) both}
@keyframes carregar{from{transform:scaleX(0)}}
.pt-pagina{position:relative;flex:1;padding:14px 16px;display:flex;flex-direction:column;gap:10px;overflow:hidden}
.pt-cab{display:flex;gap:10px;align-items:center;height:36px;margin-bottom:6px}
.pt-cab div{display:flex;flex-direction:column;font-size:13px}
.pt-cab span{font-size:11px;color:#4A5273}
.pt-campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(192px,100%),1fr));gap:8px 12px}
.ff{height:52px;display:flex;flex-direction:column;justify-content:center;gap:3px;padding:0 12px;border-radius:12px;background:#F2F4FB;box-shadow:inset 0 0 0 1px #DCE0F0;transition:box-shadow .3s}
.ff.foco{box-shadow:inset 0 0 0 2px #6C7BFF,0 0 0 4px rgba(108,123,255,.15)}
.ff-rot{font-size:11px;color:#4A5273}
.ff-val{min-height:18px;font-size:13px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.valor{display:inline-block;animation:digitar .7s steps(16) backwards}
@keyframes digitar{from{clip-path:inset(0 100% 0 0)}}
.pt-enviar{height:52px;display:flex;align-items:center;justify-content:flex-end}
.ff-enviar{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 16px;border-radius:999px;background:#C9CEE6;color:#121633;font-weight:700;font-size:13px;transition:background-color .2s,color .2s,box-shadow .2s}
.ff-enviar.pronto{background:#3437B5;color:#fff;box-shadow:0 0 0 6px rgba(108,123,255,.2)}
.ff-enviar.foi{background:#167747;color:#fff}

/* fita de provedores */
.fita-caixa{display:flex;flex-direction:column;align-items:center;gap:18px}
.fita-rot{font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--texto2)}
.fita{width:100%}
.fita-trilho{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.fita-item{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:18px}
.fita-item .logo-slot{width:40px;height:40px;border-radius:13px}
.fita-item b{display:block;font-size:15px}
.fita-item span{font-size:12px;color:var(--texto2)}

/* seções */
.secao{display:flex;flex-direction:column;gap:36px}
.secao-cab{display:flex;flex-direction:column;gap:12px;max-width:760px}
.eyebrow{font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--acento)}
.h2{margin:0;font-family:"Sora","Inter",system-ui,sans-serif;font-weight:800;font-size:clamp(30px,4vw,50px);line-height:1.06;letter-spacing:-.045em;text-wrap:balance}

/* linha do tempo do dia */
.dia{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:16px}
.hora{padding:22px;display:flex;flex-direction:column;gap:12px}
.hora-topo{display:flex;align-items:center;gap:10px}
.relogio{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-size:14px;font-weight:600;padding:6px 10px;border-radius:10px;color:var(--acento);background:rgba(255,255,255,.7);box-shadow:inset 0 0 0 1px var(--aro),inset 0 -2px 0 rgba(60,70,140,.12)}
.escuro .relogio{background:rgba(255,255,255,.08)}
.quem{margin-left:auto;font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px}
.quem.app{color:var(--acento);background:rgba(108,123,255,.14)}
.quem.voce{color:var(--verde);background:rgba(47,191,138,.16)}
.hora h3{margin:0;font-size:20px;letter-spacing:-.02em}
.hora p{margin:0;font-size:15px;line-height:1.55;color:var(--texto2)}
.deslize{position:relative;height:56px;border-radius:18px;background:rgba(80,90,140,.14);box-shadow:inset 0 0 0 1px var(--aro),inset 0 2px 6px rgba(20,30,80,.08);transition:background .3s;user-select:none}
.deslize-valor{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;pointer-events:none}
.deslize:has(.deslize-valor:focus-visible){outline:3px solid var(--acento);outline-offset:3px}
.deslize.on{background:rgba(34,160,107,.22)}
.deslize-txt{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding-inline:56px 8px;font-size:14px;font-weight:700;line-height:1.25;text-align:center;color:var(--texto2);pointer-events:none}
.deslize.no-fim .deslize-txt{padding-inline:8px 56px}
.deslize.on .deslize-txt{color:var(--verde)}
.deslize-guia{position:absolute;inset:4px;pointer-events:none}
.knob{position:absolute;top:0;left:calc((100% - 48px) * var(--progresso,0));width:48px;height:48px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(180deg,#535FDC,#3437B5);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 14px -6px rgba(52,55,181,.8);pointer-events:auto;touch-action:none;cursor:grab;transition:left .18s ease-out}
.deslize.arrastando .knob{cursor:grabbing;transition:none}
.deslize.on .knob{background:linear-gradient(180deg,#27AE74,#137A4E);cursor:default}
.deslize-rodape{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0 8px;min-height:30px;margin-top:4px;color:var(--texto2);font-size:12px;line-height:1.4}
.deslize-rodape button{min-height:30px;border:0;padding:2px 4px;border-radius:4px;background:transparent;color:var(--acento);font-weight:700;text-decoration:underline;cursor:pointer}

/* conecte sua IA */
.ia{display:flex;flex-wrap:wrap;gap:20px;align-items:stretch}
.provs{flex:1 1 480px;min-width:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:12px;align-content:start}
.prov{display:flex;align-items:center;gap:14px;padding:14px;border:0;border-radius:22px;cursor:pointer;text-align:left;background:var(--peca);box-shadow:inset 0 0 0 1px var(--aro),0 4px 0 rgba(60,70,140,.1);transition:transform .45s cubic-bezier(.34,1.56,.64,1),box-shadow .3s}
.prov:hover{transform:translateY(-3px)}
.prov.on{box-shadow:inset 0 0 0 2px #5260EC,0 16px 30px -18px var(--sombra)}
.prov-texto{display:flex;flex-direction:column;gap:3px;min-width:0;line-height:1.4}
.prov-texto b{font-size:16px;color:var(--texto)}
.prov-texto>span{font-size:12px;color:var(--texto2)}
.painel{flex:1 1 400px;min-width:0;padding:24px;display:flex;flex-direction:column;gap:16px}
.painel-cab{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px}
.painel-cab .logo-slot{width:60px;height:60px;border-radius:19px;font-size:24px}
.painel-cab div{display:flex;flex-direction:column;gap:2px;flex:1 1 7rem;min-width:0}
.painel-cab span{font-size:14px;color:var(--texto2)}
.estado{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;padding:5px 11px;border-radius:999px}
.estado.ok{color:var(--verde);background:rgba(47,191,138,.16)}
.estado.breve{color:var(--texto2);background:rgba(80,90,140,.12)}
.metodos{display:flex;flex-direction:column;gap:8px}
.metodo{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:rgba(255,255,255,.45);box-shadow:inset 0 0 0 1px var(--aro);font-size:14px}
.escuro .metodo{background:rgba(255,255,255,.05)}
.metodo-arte{width:38px;height:36px;object-fit:contain;flex:none}
.metodo div{display:flex;flex-direction:column;gap:2px;flex:1}
.metodo span{font-size:12px;color:var(--texto2)}
.troca{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;font-size:13px;color:var(--texto2);border:1.5px dashed var(--linha)}

/* segurança e resto */
.nunca{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:14px}
.nunca-item{display:flex;gap:14px;align-items:center;padding:20px;font-size:16px;font-weight:600}
.nunca-ic{width:74px;height:68px;object-fit:contain;flex:none}
@media(max-width:480px){.nunca-ic{width:60px;height:56px}}
.tabela-caixa{overflow-x:auto;padding:8px}
table{width:100%;min-width:640px;border-collapse:collapse;font-size:15px}
th,td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--linha)}
th{font-size:14px;color:var(--texto2);font-weight:650}
th.nosso,td.nosso{background:rgba(82,96,236,.08);text-align:center}
th.nosso{color:var(--acento);font-family:"Sora",system-ui,sans-serif;font-size:16px;border-radius:16px 16px 0 0}
td.c{text-align:center}
tr:last-child td{border-bottom:0}
.grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:18px}
.plano{padding:28px;display:flex;flex-direction:column;gap:14px}
.plano.destaque{box-shadow:inset 0 0 0 2px #5260EC,0 30px 60px -30px rgba(52,55,181,.6)}
.plano p{margin:0;color:var(--texto2);line-height:1.55}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  #preco .plano{transition:translate .32s cubic-bezier(.2,.7,.2,1)}
  #preco .plano::after{
    content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
    background:radial-gradient(ellipse at 15% 0%,color-mix(in srgb,var(--acento) 15%,transparent),transparent 74%);
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acento) 50%,transparent),0 20px 36px -23px var(--sombra);
    opacity:0;transition:opacity .32s ease;
  }
  #preco .plano:hover{translate:0 -4px}
  #preco .plano:hover::after{opacity:1}
}
.preco{font-family:"Sora",system-ui,sans-serif;font-size:40px;font-weight:800;letter-spacing:-.04em}
.preco small{font-size:15px;font-weight:600;color:var(--texto2);letter-spacing:0}
.faq{display:flex;flex-direction:column;gap:12px;max-width:860px}
.faq-item{padding:4px 8px;border-radius:22px}
.faq-p{width:100%;min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;background:transparent;cursor:pointer;text-align:left;font-size:17px;font-weight:650;padding:12px 14px}
.faq-p svg{transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.faq-item[open] .faq-p svg{transform:rotate(45deg)}
.faq-r{margin:0;padding:0 14px 18px;font-size:16px;line-height:1.6;color:var(--texto2);animation:abrir .45s cubic-bezier(.16,1,.3,1) backwards}
@keyframes abrir{from{opacity:0;transform:translateY(-8px)}}
.final{padding:56px 32px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;border-radius:40px}
.robo{overflow:visible;flex:none}
.r-olhos{filter:drop-shadow(0 0 4px #5CF0FF)}
.rodape{display:flex;flex-wrap:wrap;gap:32px;justify-content:space-between;padding:36px 4px 12px;border-top:1px solid var(--linha);font-size:14px;color:var(--texto2)}
.rod-marca{display:flex;flex-direction:column;gap:12px;flex:1 1 260px;max-width:320px}
.rod-cols{display:flex;flex-wrap:wrap;gap:40px}
.rod-col{display:flex;flex-direction:column;gap:10px;min-width:130px}
.rod-col b{color:var(--texto);font-size:14px}
.rod-col a{color:var(--texto2);text-decoration:underline;text-decoration-color:transparent;text-underline-offset:3px;width:fit-content;min-height:24px}
.rod-col a:hover{color:var(--acento);text-decoration-color:currentColor}
.rod-baixo{width:100%;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:20px;border-top:1px solid var(--linha);font-size:13px}
/* baixar: botão dividido com menu de plataformas */
.bs{position:relative;display:inline-flex;align-items:stretch}
.bs:focus-within,.bs:has(.bs-menu:not([hidden])){z-index:5}
.bs .tecla{overflow:hidden}
.marca-so{width:20px;height:20px;object-fit:contain;flex:none}
.escuro .marca-so[src="marcas/mac.svg"]{filter:invert(1)}
.bs .bs-main{border-radius:18px 0 0 18px;padding:0 22px 0 18px;gap:10px}
.bs .bs-seta{border-radius:0 18px 18px 0;padding:0;min-width:54px;margin-left:2px}
.bs-seta svg{transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.bs-seta[aria-expanded="true"] svg{transform:rotate(180deg)}
.bs-menu{position:absolute;top:calc(100% + 14px);left:0;z-index:30;width:max(100%,min(330px,calc(100vw - 32px)));padding:8px;border-radius:22px;display:flex;flex-direction:column;gap:2px;text-align:left;--vidro:#f7f8ff;--vidro2:#edf0fc;transform-origin:20% 0;animation:menuAbre .4s cubic-bezier(.34,1.4,.64,1) backwards}
.bs-menu.cima{top:auto;bottom:calc(100% + 14px);transform-origin:20% 100%}
.escuro .bs-menu{--vidro:#26294f;--vidro2:#181b3c}
@keyframes menuAbre{from{opacity:0;transform:translateY(-8px) scale(.94)}}
.bs-item{display:flex;align-items:center;gap:12px;width:100%;min-height:46px;padding:0 12px;border:0;border-radius:14px;background:transparent;cursor:pointer;font-size:15px;font-weight:650;color:var(--texto);text-align:left;transition:background .2s}
.bs-item:hover,.bs-item.on{background:rgba(108,123,255,.13)}
.bs-item small{margin-left:auto;font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-size:11px;font-weight:600;letter-spacing:.045em;text-transform:uppercase;color:var(--texto2)}
.bs-item small.breve{color:var(--laranja)}
.bs-item:focus-visible{outline-offset:-3px}
.bs-grupo{margin-top:6px;padding:10px 12px 4px;border-top:1px solid var(--linha);font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--texto2)}
.bs-nota{font-size:13px;color:var(--texto2)}
.ia-nome{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--texto)}
.ia-nome .logo-slot{width:22px;height:22px;border-radius:7px;font-size:11px;box-shadow:inset 0 0 0 1px rgba(60,70,140,.18)}

/* baixe o Applyer: cartões por plataforma */
.baixe{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
.so{grid-column:span 2;position:relative;isolation:isolate;overflow:hidden;min-height:420px;padding:30px;border-radius:30px;display:flex;flex-direction:column;color:#121633;box-shadow:inset 0 0 0 1px rgba(18,22,51,.08),inset 0 2px 0 rgba(255,255,255,.55),0 26px 50px -30px rgba(18,22,51,.5)}
.so.larga{grid-column:span 3;min-height:340px}
.so-ic{display:flex}
.so-ic img{width:76px;height:76px;object-fit:contain}
.so-sombra{position:absolute;right:-70px;bottom:-84px;z-index:-1;opacity:.1;pointer-events:none;display:flex}
.so-sombra img{width:250px;height:250px;object-fit:contain}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  #baixar .so{transition:translate .38s cubic-bezier(.2,.7,.2,1)}
  #baixar .so-sombra{transition:translate .48s cubic-bezier(.2,.7,.2,1)}
  #baixar .so:hover{translate:0 -2px}
  #baixar .so:hover .so-sombra{translate:-5px -3px}
}
.so-status{position:absolute;top:28px;right:28px;font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.5);box-shadow:inset 0 0 0 1px rgba(18,22,51,.14)}
.so-status.breve{background:#121633;color:#fff}
.so h3{margin:auto 0 8px;font-family:"Sora","Inter",system-ui,sans-serif;font-size:clamp(36px,3.4vw,48px);font-weight:800;letter-spacing:-.05em;line-height:1}
.so p{margin:0 0 22px;font-size:15px;line-height:1.5;color:#363D63;max-width:420px}
.so-acao{align-self:flex-start;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 18px;border-radius:15px;font-size:15px;font-weight:700;color:#121633;background:rgba(255,255,255,.6);box-shadow:inset 0 0 0 1px rgba(18,22,51,.12),0 4px 0 rgba(18,22,51,.2);transition:transform .12s,box-shadow .12s,background .3s,color .3s}
.so-acao:hover{background:rgba(255,255,255,.85)}
.so-acao:active{transform:translateY(4px);box-shadow:inset 0 0 0 1px rgba(18,22,51,.12),0 0 0 rgba(18,22,51,.2)}
.so-acao:focus-visible{outline:3px solid #121633;outline-offset:3px}
/* ajustes do site: textos ligados por script ficam dentro de um span */
.anel b span.anel-n{font-size:inherit;font-weight:inherit;color:inherit;margin:0}
.painel-cab .estado span{font-size:inherit;color:inherit}
.pip-status [data-liga]{min-width:0;overflow:hidden;text-overflow:ellipsis}
.tema-btn{width:56px;height:44px;flex:none;border:0;border-radius:15px;background:transparent;color:var(--texto2);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.tema-paisagem{width:50px;height:28px;flex:none;overflow:visible}
.tema-ceu{fill:#92d4ec}.tema-mar{fill:#3696ac}.tema-praia{fill:#e9bb80}
.tema-sol,.tema-lua,.tema-ceu,.tema-mar,.tema-praia{transition:transform .45s ease,opacity .35s ease,fill .45s ease}
.tema-lua{opacity:0;transform:translateY(7px)}
.escuro .tema-ceu{fill:#39396e}.escuro .tema-mar{fill:#62649c}.escuro .tema-praia{fill:#9294c5}
.escuro .tema-sol{opacity:0;transform:translateY(7px)}
.escuro .tema-lua{opacity:1;transform:none}
.tema-btn:hover{background:rgba(255,255,255,.55);color:var(--texto)}
.escuro .tema-btn:hover{background:rgba(255,255,255,.08)}



.faq-p{list-style:none;border-radius:18px;line-height:1.4}
.faq-p::-webkit-details-marker{display:none}
.faq-item[open]{background-color:var(--vidro2)}
.plano .economia{margin-top:auto;padding-top:12px;border-top:1px solid var(--linha);font-size:.9rem;line-height:1.5}
.plano h3{margin:0;font-size:1.2rem}
.plano .preco{line-height:1.15;color:var(--texto);font-variant-numeric:tabular-nums}
.preco small{margin-inline-start:.25em;white-space:nowrap}
.so-acao:disabled,.tecla:disabled{
  cursor:default;transform:none;box-shadow:inset 0 0 0 1px rgba(18,22,51,.16);
}
.so-acao:disabled,.so-acao:disabled:hover{color:#353b52;background:rgba(255,255,255,.55)}
.tecla:disabled,.tecla:disabled:hover{color:var(--texto2);background:var(--peca);box-shadow:inset 0 0 0 1px var(--linha)}
.mini-btn:disabled{color:var(--texto2);background:var(--peca);box-shadow:inset 0 0 0 1px var(--linha);transform:none;cursor:default}
.heroi .btn-play{
  color:#fff;background:linear-gradient(135deg,#484cc1,#3437a7);
  box-shadow:inset 0 1px 0 #ffffff40,0 4px 0 #252579,0 12px 24px -12px #3539b880;
}
.bs .bs-seta{
  color:var(--acento);background:var(--peca);
  box-shadow:inset 0 0 0 1px var(--aro),0 3px 0 var(--linha);
}
.links a.lk{display:inline-flex;align-items:center;min-height:44px}
.topo a,.topo button,.faq-p{touch-action:manipulation}
.tabela-caixa,.app-lado,.kanban{overscroll-behavior-inline:contain}
.tabela-caixa:focus-visible{outline-offset:1px}
.legenda{line-height:1.45;text-align:center}
.legenda span{justify-content:center}

.heroi .grad{display:block}
.fecho-clique{white-space:nowrap}
.sinal-clique{
  --ficha-verso:#979DFA;--ficha-frente:#545DE5;--ficha-dobra:#333A96;
  display:inline-block;width:1.18em;height:1.18em;margin-inline-start:.18em;vertical-align:-.19em;
}
.escuro .sinal-clique{--ficha-verso:#747EE5;--ficha-frente:#AFB6FF;--ficha-dobra:#6670DB}
@media (max-width:900px){
  .app-corpo{display:block;min-height:0}
  .app-lado{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--linha);padding:8px 10px}
  .aba{width:auto;flex:none;min-height:44px}
  .lado-ia{display:none}
  .baixe{grid-template-columns:repeat(2,minmax(0,1fr))}
  .so,.so.larga{grid-column:auto;min-height:300px;padding:24px}
  .so:last-child:nth-child(odd){grid-column:1 / -1}
}
@media (max-width:810px){
  .conteudo{padding:12px clamp(12px,3.6vw,24px) 28px;gap:70px}
  .topo{display:grid;width:min(100%,480px);grid-template-columns:minmax(0,1fr) auto auto;gap:3px 6px;padding:6px 8px;border-radius:23px;top:6px}
  .topo + main{margin-top:-20px}
  .topo .marca{grid-area:1/1;width:max-content;padding-left:4px}
  .topo .links{display:contents}
  .links .tecla{grid-area:1/2}
  .links .tema-btn{grid-area:1/3}
  .links-secoes{position:relative;grid-area:2/1/3/-1;justify-content:space-around;min-width:0}
  .links-secoes a.lk,.nav-explorar summary{padding:6px clamp(5px,1.5vw,12px);font-size:.875rem;white-space:nowrap;min-height:36px}
  .nav-explorar{position:static}
  .nav-painel{width:min(100%,310px);top:calc(100% + 7px)}
  html{scroll-padding-top:110px}
  .heroi{gap:16px}
  .previa{margin-top:-16px}
  .fita-trilho{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grade{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
  .plano{padding:22px}
  .rod-cols{gap:24px}
}
@media (max-width:600px){
  .conteudo{gap:56px}
  .secao{gap:24px}
  .secao-cab{gap:8px}
  .heroi{gap:16px}
  .plataformas{font-size:13px;gap:4px 14px}
  .plataformas i{display:none}
  .cta{width:100%;gap:14px}
  .com-ia{gap:6px 12px}
  .com-ia>span:first-child{flex-basis:100%}
  .app-janela{border-radius:20px}
  .app-barra{padding:0 12px;gap:6px}
  .app-tela{gap:14px;padding:18px 12px}
  .t-tit{font-size:1.65rem}
  .peca{padding:13px;border-radius:16px}
  .lst{flex-wrap:wrap}
  .lst div{flex-basis:110px}
  .fila-it{gap:7px}
  .legenda{gap:5px;font-size:.8rem}
  .legenda span{align-items:flex-start}
  .legenda svg{margin-top:2px}
  .bs{max-width:100%}
  .bs .bs-main{padding:8px 12px;white-space:normal;text-align:left}
  .bs .bs-seta{min-width:46px}
  .bs-menu{left:50%;translate:-50% 0;width:min(330px,calc(100vw - 28px))}
  .bs-item{gap:8px;line-height:1.35}
  .bs-item small{text-align:right}
  .painel{padding:18px}
  .provs{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .prov{align-items:flex-start;flex-direction:column;gap:8px;padding:12px;border-radius:16px;overflow-wrap:anywhere}
  .prov .logo-slot{width:38px;height:38px;border-radius:11px}
  .baixe,.grade{grid-template-columns:1fr}
  .so,.so.larga{min-height:270px}
  .so h3{margin-top:24px}
  .so p{flex:1}
  .final{padding:32px 16px;border-radius:24px}
  .fita-item{padding:10px;gap:8px;flex-direction:column;align-items:flex-start}
  .fita-item .logo-slot{width:32px;height:32px}
  .nunca-item{padding:16px}
  .rod-col{min-width:0}
  .rodape{gap:22px}
}
@media (max-width:420px){
  .heroi .btn-play{gap:8px;padding-right:12px;font-size:.9375rem}
  .topo .kbd{display:none}
  .topo .tecla-p{padding:0 12px}
  .topo .marca img{width:clamp(96px,calc(100vw - 220px),114px)}
  .heroi .h1{font-size:clamp(2rem,9.5vw,2.4rem)}
}
@media (max-height:550px){
  .topo{top:4px}
  .nav-painel{max-height:calc(100dvh - 120px);overflow:auto}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .lp *,.lp :not(.play-anel)::before,.lp *::after{animation:none!important;transition:none!important}
  .play-anel::before{animation-duration:5s}
}
@media(forced-colors:active){
  .grad,.escuro .grad{color:CanvasText}
  .vidro,.tecla,.btn-play,.prov,.aba.on,.mini-btn,.so,.so-acao,.logo-slot,.faq-item{border:1px solid ButtonText}
  .prov.on,.aba.on,.bs-item.on{outline:2px solid Highlight;outline-offset:-3px}
  .chave-mini span{border:1px solid ButtonText}
  .chave-mini span::after{background:ButtonText}
}

/* Seis momentos na mesma costa. O céu muda sem mover o objeto que identifica a etapa. */
#como .rotina-moldes{position:absolute;overflow:hidden;pointer-events:none}
#como .dia{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,22px)}
#como .hora{
  --ceu:#a1dce8;--astro:#fff1b7;--nuvem:#e7fdff;--longe:#94c7d5;--ilha:#71a7b8;
  --mar:#59b6c1;--espuma:#d9f6e2;--praia:#edcc9b;--estrelas:0;--fase:0;
  padding:12px 12px 24px;gap:10px;border-radius:26px;
}
#como .hora-busca{
  --ceu:#293665;--astro:#fff3bf;--nuvem:#45577d;--longe:#505c90;--ilha:#394d75;
  --mar:#3a638b;--espuma:#9fc9d8;--praia:#5d7293;--estrelas:1;--fase:1;
}
#como .hora-preparo{
  --ceu:#f2c4b4;--astro:#fff1ca;--nuvem:#fff0d9;--longe:#bcabbf;--ilha:#918caa;
  --mar:#92b9c5;--espuma:#ffead5;--praia:#dbae98;--estrelas:.25;
}
#como .hora-triagem{
  --ceu:#a7daed;--astro:#ffe09b;--longe:#a2becd;--ilha:#7ea8b0;
  --mar:#72bed0;--espuma:#edf9e3;--praia:#f3d0a1;
}
#como .hora-aprovar{--ceu:#a4e1dc;--longe:#8abaaf;--ilha:#68aa9e;--mar:#57b7b9}
#como .hora-envio{--ceu:#a1d5f1;--longe:#92bad7;--ilha:#6e9ab8;--mar:#62adca}
#como .hora-quadro{
  --ceu:#b6aaca;--astro:#ffe8b6;--nuvem:#eee1e0;--longe:#a299be;--ilha:#847fa5;
  --mar:#8c9ebd;--espuma:#eddfdd;--praia:#c6a9b4;--estrelas:.4;
}
#como .hora-cena{
  position:relative;isolation:isolate;overflow:hidden;border-radius:17px;aspect-ratio:320 / 148;
  background:var(--ceu);box-shadow:0 1px 0 var(--aro);
}
#como .hora-cena svg{display:block;width:100%;height:100%}
#como .rotina-noite{
  display:none;--ceu:#192341;--astro:#f8e6ba;--nuvem:#35435e;--longe:#3b4569;--ilha:#303b59;
  --mar:#304966;--espuma:#8193aa;--praia:#46526d;--estrelas:1;--fase:1;
}
#como .hora-topo{padding:0 8px;margin:6px 0 1px}
#como .hora h3,#como .hora p{margin:0 8px}
#como .hora h3{font-size:clamp(1.15rem,1.6vw,1.36rem);line-height:1.22;text-wrap:balance}
#como .hora .relogio{font-variant-numeric:tabular-nums;font-size:.8rem}
#como .deslize-demo{margin:4px 8px 0}
#como .hora-aprovar:has(.deslize.on){--selo:#88dfb1}
#como .rotina-selo{transform-origin:184px 108px;transition:transform .35s ease}
#como .hora-aprovar:has(.deslize.on) .rotina-selo{transform:rotate(8deg) scale(1.12)}
@media (prefers-reduced-motion:no-preference){
  #como .prepara-luz .rotina-noite{display:inline}
  #como .em-vista .rotina-noite{animation:rotina-amanhecer 1.15s cubic-bezier(.45,0,.22,1) both}
  #como .em-vista .hora-cena::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(90deg,transparent 91%,#ffffff30 98%,#ffffff70);
    animation:rotina-lente 1.15s cubic-bezier(.45,0,.22,1) both;
  }
  #como .hora{--gesto:0}
  #como .hora:has(:focus-visible){--gesto:1}
  #como .hora-busca{
    --astro-x:calc(-14px * var(--gesto));--astro-y:calc(-5px * var(--gesto));
    --estrelas-x:calc(8px * var(--gesto));--estrelas-y:calc(3px * var(--gesto));--tempo-ceu:.82s;
  }
  #como .rotina-peca{
    --x:0px;--y:0px;--angulo:0deg;--tempo:.54s;--atraso:0s;
    transform-box:fill-box;transform-origin:center;
    transform:translate(calc(var(--x) * var(--gesto)),calc(var(--y) * var(--gesto))) rotate(calc(var(--angulo) * var(--gesto)));
    transition:transform var(--tempo) cubic-bezier(.23,.78,.26,1) var(--atraso);
  }
  #como .telescopio-eixo{--angulo:-10deg;--tempo:.68s;transform-box:view-box;transform-origin:143px 84px}
  #como .telescopio-lente{--x:20px;--atraso:.08s}
  #como .telescopio-ocular{--x:-6px}
  #como .telescopio-brilho{--x:9px;--y:-6px;--angulo:18deg;--tempo:.72s}
  #como .pacote-folha{--x:-22px;--y:1px;--angulo:-11deg}
  #como .pacote-curriculo{--x:-1px;--y:-9px;--angulo:3deg}
  #como .pacote-carta{--x:20px;--y:1px;--angulo:4deg;--atraso:.04s}
  #como .rotina-aba-carta{
    transform-box:view-box;transform-origin:0 96px;transform:scaleY(calc(1 - 1.85 * var(--gesto)));
    transition:transform .34s ease-out;
  }
  #como .rotina-bilhete{
    opacity:var(--gesto);transform:translateY(calc(-11px * var(--gesto)));
    transition:transform .44s ease-out .09s,opacity .22s;
  }
  #como .triagem-esquerda{--x:-24px;--y:1px;--angulo:-9deg}
  #como .triagem-direita{--x:23px;--y:-1px;--angulo:10deg}
  #como .triagem-frente{--x:1px;--y:-11px;--angulo:2deg;--atraso:.04s}
  #como .triagem-escolha{--x:5px;--y:-9px;--angulo:8deg;--atraso:.09s}
  #como .revisao-prancheta{--x:-6px;--y:-3px;--angulo:5deg}
  #como .revisao-carimbo{--x:9px;--y:-7px;--angulo:-12deg}
  #como .revisao-marca{
    stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--gesto));
    opacity:var(--gesto);transition:stroke-dashoffset .32s ease-out var(--atraso,0s),opacity .15s;
  }
  #como .revisao-marca:nth-child(2){--atraso:.12s}
  #como .revisao-marca:nth-child(3){--atraso:.23s}
  #como .envio-ponteiro{--x:-23px;--y:10px;--angulo:-9deg;--tempo:.45s}
  #como .envio-barra,#como .envio-linhas{transform-box:fill-box;transform-origin:left center}
  #como .envio-barra{transform:scaleX(calc(.16 + .84 * var(--gesto)));transition:transform .55s ease-in-out .17s}
  #como .envio-linhas{transform:scaleX(calc(.75 + .25 * var(--gesto)));transition:transform .5s ease-out}
  #como .quadro-ficha{--x:32px;--y:3px;--tempo:.58s}
  #como .quadro-mensagem{--x:13px;--y:-12px;--angulo:-9deg;--atraso:.08s}
  #como .quadro-aviso{transform-box:fill-box;transform-origin:center;transform:scale(calc(1 + .23 * var(--gesto)));transition:transform .4s ease-out .13s}
}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  #como .hora:hover{--gesto:1}
}
@media (hover:none) and (prefers-reduced-motion:no-preference){
  #como .hora:active,#como .hora:has(.hora-cena:focus){--gesto:1}
}
#como .hora-cena:focus-visible{outline:3px solid var(--acento);outline-offset:3px}
#como .rotina-bilhete,#como .revisao-marca{pointer-events:none}
@media (prefers-reduced-motion:reduce){
  #como .rotina-bilhete,#como .revisao-marca{opacity:0}
  #como .envio-barra{transform-box:fill-box;transform-origin:left center;transform:scaleX(.16)}
}
@keyframes rotina-amanhecer{from{clip-path:inset(0)}to{clip-path:inset(0 0 0 100%)}}
@keyframes rotina-lente{
  from{opacity:0;transform:translateX(-100%)}15%,82%{opacity:.85}
  to{opacity:0;transform:translateX(0)}
}
@media (max-width:1000px){#como .dia{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:630px){#como .dia{grid-template-columns:1fr}#como .hora{padding-bottom:20px}}