.hero-automacao{display:grid;grid-template-columns:1fr minmax(380px,.9fr);align-items:center;gap:6vw;overflow:hidden;background:radial-gradient(circle at 77% 48%,rgba(118,214,148,.15),transparent 24%),linear-gradient(120deg,rgba(8,10,9,.96),rgba(8,10,9,.54)),url("../img/fundos/solucoes.png") center/cover}
.fluxo-hero{position:relative;display:grid;gap:12px;width:min(42vw,500px);margin:auto;padding:28px;border:1px solid rgba(255,255,255,.15);border-radius:18px;background:rgba(10,14,10,.83);box-shadow:0 30px 70px rgba(0,0,0,.4)}
.fluxo-hero article{position:relative;z-index:2;display:grid;grid-template-columns:40px 1fr;padding:14px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:#131813}
.fluxo-hero article span{grid-row:span 2;display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:#ffc400;color:#080a09;font:500 .6rem DM Mono,monospace}
.fluxo-hero article strong{font-size:.82rem}
.fluxo-hero article small{margin-top:4px;color:#959b94;font-size:.58rem}
.fluxo-hero>i{height:14px;margin-left:33px;border-left:1px dashed rgba(255,204,0,.65)}
.particula{position:absolute;z-index:3;width:7px;height:7px;border-radius:50%;background:#ffc400;box-shadow:0 0 12px #ffc400;animation:descer-particula 4s linear infinite}
.p1{left:34px;top:64px}
.p2{left:34px;top:64px;animation-delay:-1.3s}
.p3{left:34px;top:64px;animation-delay:-2.6s}
.introducao-servico strong{color:#ffc400}
.cabecalho-auto{display:grid;grid-template-columns:1fr minmax(260px,.45fr);gap:5vw;align-items:end}
.cabecalho-auto .rotulo{grid-column:1/-1}
.cabecalho-auto h2{margin-bottom:0}
.cabecalho-auto>p:last-child{padding-bottom:10px;color:#aab0a8;line-height:1.7}
.motor-automacao{border-top:1px solid rgba(255,255,255,.15)}
.construtor-fluxo{margin-top:55px;overflow:hidden;border:1px solid rgba(255,255,255,.14);background:#0c100d}
.construtor-fluxo header,.painel-operacao>header{display:flex;justify-content:space-between;align-items:center;padding:17px 20px;border-bottom:1px solid rgba(255,255,255,.1);font:500 .58rem DM Mono,monospace;letter-spacing:.07em}
.construtor-fluxo header span{display:flex;align-items:center;gap:8px}
.construtor-fluxo header span i{width:7px;height:7px;border-radius:50%;background:#76d694}
.construtor-fluxo header small{color:#7e847d}
.etapas-fluxo{display:flex;align-items:center;gap:10px;padding:28px 20px;overflow:auto}
.etapas-fluxo button{min-width:145px;padding:18px;border:1px solid rgba(255,255,255,.12);background:#141914;color:#f3f3ee;text-align:left;cursor:pointer;transition:.25s}
.etapas-fluxo button.ativo{border-color:#ffc400;background:rgba(255,204,0,.1)}
.etapas-fluxo b,.etapas-fluxo strong,.etapas-fluxo small{display:block}
.etapas-fluxo b{margin-bottom:16px;color:#ffc400;font-size:1.2rem}
.etapas-fluxo strong{font-size:.75rem}
.etapas-fluxo small{margin-top:5px;color:#8c928a;font-size:.55rem}
.etapas-fluxo>i{width:22px;height:1px;flex:none;background:#ffc400}
.construtor-fluxo aside{padding:28px 20px;border-top:1px solid rgba(255,255,255,.1);background:linear-gradient(90deg,rgba(255,204,0,.1),transparent)}
.construtor-fluxo aside span{color:#ffc400;font:500 .56rem DM Mono,monospace}
.construtor-fluxo aside h3{max-width:600px;margin:12px 0 9px;font-size:clamp(1.2rem,2.3vw,2rem);letter-spacing:-.05em}
.construtor-fluxo aside p{max-width:580px;color:#a7ada5;line-height:1.6}
.operacao-crm{background:#edf0ea;color:#080a09}
.operacao-crm .rotulo{color:#356b46}
.operacao-crm .cabecalho-auto>p:last-child{color:#565d55}
.painel-operacao{margin-top:55px;border:1px solid rgba(8,10,9,.17);background:#f9faf5;box-shadow:0 25px 60px rgba(8,10,9,.12)}
.painel-operacao>header{border-color:rgba(8,10,9,.12)}
.painel-operacao>header>div{display:flex;align-items:center;gap:8px;font-size:.75rem}
.status-auto{width:8px;height:8px;border-radius:50%;background:#76d694;box-shadow:0 0 0 5px rgba(118,214,148,.16)}
.painel-operacao nav{display:flex;padding:3px;border:1px solid rgba(8,10,9,.12);border-radius:7px}
.painel-operacao nav button{padding:7px 10px;border:0;border-radius:4px;background:transparent;color:#626860;font:500 .55rem DM Mono,monospace;cursor:pointer}
.painel-operacao nav button.ativo{background:#0d2218;color:#f3eee4}
.numeros-operacao{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid rgba(8,10,9,.12)}
.numeros-operacao article{padding:22px;border-right:1px solid rgba(8,10,9,.12)}
.numeros-operacao article:last-child{border:0}
.numeros-operacao small,.numeros-operacao strong,.numeros-operacao span{display:block}
.numeros-operacao small{color:#687068;font:500 .55rem DM Mono,monospace;text-transform:uppercase}
.numeros-operacao strong{margin:8px 0 4px;font-size:1.6rem;letter-spacing:-.06em}
.numeros-operacao span{color:#717870;font-size:.62rem}
.numeros-operacao .positivo{color:#287841}
.funil-operacao{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:28px}
.funil-operacao section{display:grid;gap:9px}
.funil-operacao span{font:500 .55rem DM Mono,monospace;color:#626860;text-transform:uppercase}
.funil-operacao b{position:relative;display:block;height:14px;background:#dce1da}
.funil-operacao b:after{content:"";position:absolute;inset:0 auto 0 0;width:var(--nivel);background:#0d2218;transform:scaleX(0);transform-origin:left;transition:transform 1.1s ease}
.painel-operacao.visivel .funil-operacao b:after{transform:scaleX(1)}
.funil-operacao strong{font-size:1.05rem}
.metodo-auto>div{grid-template-columns:repeat(4,1fr)}
.metodo-auto article p{font-size:.96rem}
.tecnologias-auto{overflow:hidden;padding:105px 0 0;background:#11160f}
.tecnologias-auto .bloco-servico{padding-top:0;padding-bottom:55px}
.faixa-tecnologias{overflow:hidden;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.pista-tecnologias{display:flex;width:max-content;animation:rolar-tecnologias 28s linear infinite}
.pista-tecnologias article{display:grid;grid-template-columns:75px 1fr;align-items:center;gap:14px;width:250px;padding:22px;border-right:1px solid rgba(255,255,255,.12)}
.pista-tecnologias b{display:grid;place-items:center;width:58px;height:58px;border:1px solid rgba(255,204,0,.5);border-radius:12px;color:#ffc400;font-size:1rem}
.pista-tecnologias span{color:#b0b6ae;font-size:.75rem}
.entrada-auto{opacity:0;transform:translateY(25px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.entrada-auto.visivel{opacity:1;transform:none}
@keyframes descer-particula{to{transform:translateY(210px);opacity:0}
}
@keyframes rolar-tecnologias{to{transform:translateX(-50%)}
}
@media(max-width:1000px){.hero-automacao{grid-template-columns:1fr}
.fluxo-hero{width:min(100%,580px);margin-top:25px}
.cabecalho-auto{grid-template-columns:1fr}
.metodo-auto>div{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){.etapas-fluxo{padding:18px 14px}
.construtor-fluxo header small{display:none}
.numeros-operacao{grid-template-columns:1fr}
.numeros-operacao article{border-right:0;border-bottom:1px solid rgba(8,10,9,.12)}
.funil-operacao{grid-template-columns:1fr 1fr}
.painel-operacao>header{align-items:flex-start;flex-direction:column}
.metodo-auto>div{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.fluxo-hero *,.pista-tecnologias{animation:none}
.entrada-auto{opacity:1;transform:none}
}

.funil-interativo{width:min(44vw,600px);margin:auto;overflow:hidden;border:1px solid rgba(255,255,255,.18);border-radius:18px;background:rgba(10,14,10,.9);box-shadow:0 30px 80px rgba(0,0,0,.45);backdrop-filter:blur(15px)}
.funil-interativo>header{display:flex;justify-content:space-between;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.11);color:#aeb4ac;font:500 .55rem DM Mono,monospace;letter-spacing:.08em}.funil-interativo header span{display:flex;align-items:center;gap:8px}.funil-interativo header i{width:7px;height:7px;border-radius:50%;background:#76d694;box-shadow:0 0 0 5px rgba(118,214,148,.13)}
.etapas-funil{display:flex;gap:9px;padding:16px;overflow-x:auto}.etapas-funil section{min-width:130px;min-height:180px;padding:10px;border:1px solid rgba(255,255,255,.1);background:#111611;transition:background .25s,border-color .25s}.etapas-funil section.arrastando-sobre{border-color:#ffc400;background:rgba(255,204,0,.1)}.etapas-funil section>p{display:flex;justify-content:space-between;margin-bottom:13px;color:#8e958d;font:500 .5rem DM Mono,monospace;text-transform:uppercase}.etapas-funil section>p b{color:#ffc400}.etapas-funil article{position:relative;padding:12px;border:1px solid rgba(255,255,255,.12);border-radius:7px;background:#1a2019;cursor:grab;transition:transform .25s,opacity .25s}.etapas-funil article:active{cursor:grabbing}.etapas-funil article.movendo{opacity:.38;transform:scale(.95)}.etapas-funil strong,.etapas-funil small{display:block}.etapas-funil strong{font-size:.65rem}.etapas-funil small{margin-top:4px;color:#959c94;font-size:.5rem}.etapas-funil article i{display:block;width:24px;height:3px;margin-top:12px;background:#ffc400}.etapas-funil [data-etapa="venda"] article{border-color:rgba(118,214,148,.45)}.etapas-funil [data-etapa="venda"] article i{background:#76d694}.funil-interativo footer{display:flex;justify-content:space-between;gap:15px;padding:15px 18px;border-top:1px solid rgba(255,255,255,.1);color:#aeb4ac;font-size:.68rem}.funil-interativo footer b{color:#ffc400;font:500 .52rem DM Mono,monospace}
.construtor-fluxo.executando{animation:pulsar-exec .65s ease}.construtor-fluxo.executando aside{background:linear-gradient(90deg,rgba(118,214,148,.18),rgba(255,204,0,.12),transparent)}.construtor-fluxo.executando .etapas-fluxo button.ativo{animation:acender-etapa .7s ease}
.construtor-fluxo[data-execucao="entrada"]{box-shadow:inset 0 0 45px rgba(255,204,0,.13)}.construtor-fluxo[data-execucao="regra"]{box-shadow:inset 0 0 45px rgba(118,214,148,.16)}.construtor-fluxo[data-execucao="acao"]{box-shadow:inset 0 0 45px rgba(90,153,255,.16)}.construtor-fluxo[data-execucao="resultado"]{box-shadow:inset 0 0 45px rgba(230,93,59,.17)}
.grade-integracoes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:30px}.grade-integracoes article{padding:18px;border:1px solid rgba(255,255,255,.14);background:#151a14}.grade-integracoes b{color:#ffc400;font:500 .6rem DM Mono,monospace;text-transform:uppercase}.grade-integracoes p{margin-top:12px;color:#aeb4ac;font-size:.79rem;line-height:1.55}.pista-tecnologias img{width:58px;height:58px;padding:12px;border:1px solid rgba(255,204,0,.32);border-radius:12px;background:#f7f7f2;object-fit:contain}.faixa-tecnologias:hover .pista-tecnologias{animation-play-state:paused}
@keyframes pulsar-exec{50%{filter:brightness(1.25)}}@keyframes acender-etapa{50%{transform:translateY(-9px);box-shadow:0 0 30px rgba(255,204,0,.3)}}
@media(max-width:1000px){.funil-interativo{width:min(100%,650px);margin-top:25px}}@media(max-width:650px){.funil-interativo>header small{display:none}.funil-interativo footer{align-items:flex-start;flex-direction:column}.grade-integracoes{grid-template-columns:1fr}.etapas-funil section{min-width:145px}}@media(prefers-reduced-motion:reduce){.funil-interativo *,.construtor-fluxo.executando{animation:none}}