/* SPSCOM · site de pré-visualização
   Layout: faixas de largura total alternando Azul Noturno e Névoa clara; conteúdo em coluna de 1200px;
   o ciclo documental (Impressão → Digitalização → Gestão) é o fio que liga as páginas. */
:root{
  color-scheme: light;
  --noturno:#1F2A44;      /* Pantone 533 C */
  --noturno-2:#18213A;
  --noturno-3:#172036;
  --linha-escura:#33405E;
  --ciano:#00A9E0;        /* Pantone 2995 C */
  --acao:#0077C8;         /* Pantone 3005 C */
  --laranja:#DC582A;      /* Pantone 7579 C */
  --grafite:#53565A;      /* Cool Gray 11 C */
  --nevoa:#D9E1E2;        /* 7541 C */
  --papel:#F7F8FA;
  --branco:#FFFFFF;
  --linha:#D9E1E2;
  --texto:#1F2A44;
  --texto-2:#4E5258;
  --texto-claro:#D9E1E2;
  --display:'Space Grotesk','Inter',system-ui,sans-serif;
  --corpo:'Inter','Segoe UI',system-ui,sans-serif;
  --raio:14px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--noturno);color:var(--texto);font-family:var(--corpo);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%}
a{color:var(--acao)}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--ciano);outline-offset:3px}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.1;letter-spacing:-.01em;margin:0;text-wrap:balance}
p{margin:0}
.wrap{max-width:1200px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.faixa{padding-block:96px}
.escura{background:var(--noturno);color:var(--branco)}
.escura-2{background:var(--noturno-2);color:var(--branco)}
.clara{background:var(--papel)}
.branca{background:var(--branco)}
.kicker{font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--texto-2)}
.escura .kicker,.escura-2 .kicker{color:var(--ciano)}
.lead{font-size:clamp(17px,2vw,20px);color:var(--texto-2);max-width:62ch}
.escura .lead,.escura-2 .lead{color:var(--texto-claro)}
.cabeca{display:flex;flex-direction:column;gap:14px;max-width:820px}
.cabeca h2{font-size:clamp(30px,4vw,46px)}
.secao{display:flex;flex-direction:column;gap:48px}
.nota{font-size:13px;color:var(--texto-2)}
.escura .nota,.escura-2 .nota{color:var(--texto-claro)}

/* Aviso de ambiente de teste */
.aviso{background:var(--laranja);color:var(--branco);font-size:14px;font-weight:500}
.aviso .wrap{display:flex;flex-wrap:wrap;gap:4px 16px;justify-content:space-between;padding-block:8px}

/* Cabeçalho */
.topo{background:var(--noturno);border-bottom:1px solid var(--linha-escura);position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
.topo .wrap{min-height:80px;display:flex;align-items:center;gap:20px;justify-content:space-between}
.topo .btn{white-space:nowrap}
.marca{display:flex;align-items:center;flex-shrink:0}
.marca img{width:182px;height:auto;display:block}
.nav{display:flex;align-items:center;gap:22px;flex:1;justify-content:center}
.nav a{color:var(--branco);text-decoration:none;font-size:15px;font-weight:500;display:flex;align-items:center;gap:9px;padding-block:10px;border-bottom:2px solid transparent;white-space:nowrap}
.nav a:hover{color:var(--ciano)}
.nav a[aria-current="page"]{border-bottom-color:var(--ciano);font-weight:600}
.nav .sec{color:var(--texto-claro)}
.pt{width:10px;height:10px;border-radius:2px;display:block;flex-shrink:0}
.pt-i{background:var(--branco)} .pt-d{background:var(--nevoa)} .pt-g{background:var(--laranja)}
.acoes-topo{display:flex;align-items:center;gap:18px;flex-shrink:0}
.acoes-topo .cliente{color:var(--texto-claro);text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap}
.acoes-topo .cliente:hover{color:var(--branco)}
.menu{display:none}
@media (max-width:1280px){.nav{gap:16px}.nav a{font-size:14px}.acoes-topo .cliente{font-size:14px}.acoes-topo .btn-contorno{font-size:15px;padding:0 14px}}
@media (max-width:1160px){
  .nav,.acoes-topo .cliente{display:none}
  .menu{display:block;position:relative}
  .menu summary{list-style:none;cursor:pointer;min-height:46px;padding:0 16px;border:1px solid var(--linha-escura);border-radius:10px;color:var(--branco);display:flex;align-items:center;gap:8px;font-weight:600;font-size:15px}
  .menu summary::-webkit-details-marker{display:none}
  .menu[open] .painel{display:flex}
  .menu .painel{display:none;position:absolute;right:0;top:56px;width:min(300px,calc(100vw - 40px));flex-direction:column;background:var(--noturno-2);border:1px solid var(--linha-escura);border-radius:12px;padding:8px}
  .menu .painel a{color:var(--branco);text-decoration:none;padding:12px 14px;border-radius:8px;display:flex;align-items:center;gap:10px;font-weight:500}
  .menu .painel a:hover{background:var(--noturno)}
}
@media (max-width:560px){.acoes-topo .btn-contorno{display:none}.marca img{width:152px}}

/* Botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 26px;border-radius:8px;font-family:var(--display);font-size:18px;font-weight:700;text-decoration:none;border:0;cursor:pointer;transition:transform .15s ease,background .15s ease}
.btn-laranja{background:var(--laranja);color:var(--branco)}
.btn-laranja:hover{background:#C44A20;color:var(--branco)}
.btn-contorno{background:transparent;color:var(--branco);border:1.5px solid #8A96AD;font-family:var(--corpo);font-size:16px;font-weight:600;min-height:48px;padding:0 20px}
.btn-contorno:hover{border-color:var(--branco);color:var(--branco)}
.btn-azul{background:var(--noturno);color:var(--branco);font-family:var(--corpo);font-size:16px;font-weight:600}
.btn-azul:hover{background:var(--noturno-2);color:var(--branco)}
.btn-linha{background:transparent;color:var(--acao);border:1.5px solid var(--acao);font-family:var(--corpo);font-size:16px;font-weight:600;min-height:50px}
.btn-linha:hover{background:var(--acao);color:var(--branco)}
.botoes{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.seta{width:18px;height:18px;flex-shrink:0}

/* Hero */
.hero{padding-block:64px 96px}
.hero-grade{display:flex;flex-wrap:wrap;align-items:center;gap:56px}
.hero-texto{flex:1 1 540px;min-width:0;display:flex;flex-direction:column;gap:26px}
.hero h1{font-size:clamp(40px,6vw,72px);line-height:1.02;letter-spacing:-.02em;max-width:13ch}
.hero-fatos{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14px;color:var(--texto-claro)}
.hero-fatos span+span{padding-left:22px;border-left:1px solid var(--linha-escura)}
.hero-arte{flex:1 1 400px;min-width:0;display:flex;justify-content:center}
.orbita{position:relative;width:min(480px,100%);aspect-ratio:1/1}
.orbita .anel{position:absolute;inset:10%;border:1.5px dashed var(--linha-escura);border-radius:50%}
.orbita .simbolo{position:absolute;left:21%;top:17%;width:58%;height:auto}
.pilula{position:absolute;display:flex;align-items:center;gap:10px;padding:9px 15px;background:var(--noturno);border:1px solid var(--linha-escura);border-radius:999px;font-size:14px;font-weight:600;white-space:nowrap;color:var(--branco);text-decoration:none}
.pilula:hover{border-color:var(--ciano);color:var(--branco)}
.pilula b{font-family:var(--display);color:var(--texto-claro);font-weight:600}
.pilula.p-d{left:50%;top:0;transform:translateX(-50%)}
.pilula.p-i{left:0;bottom:6%}
.pilula.p-g{right:0;top:52%}
@media (max-width:480px){.pilula{font-size:12px;padding:7px 11px}}

/* Quem somos */
.quem .wrap{display:flex;flex-wrap:wrap;gap:32px 56px;align-items:center;padding-block:44px}
.quem-texto{flex:1 1 380px;display:flex;flex-direction:column;gap:10px}
.quem-texto strong{font-family:var(--display);font-size:22px;font-weight:600;line-height:1.3}
.quem-texto p{font-size:15px;color:var(--texto-claro)}
.fatos{flex:2 1 560px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.fatos div{display:flex;flex-direction:column;gap:6px}
.fatos b{font-family:var(--display);font-size:clamp(28px,3.4vw,40px);font-weight:600;line-height:1}
.fatos span{font-size:14px;color:var(--texto-claro);line-height:1.4}
@media (max-width:640px){.fatos{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Cartões */
.grade-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.grade-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
@media (max-width:900px){.grade-3,.grade-2{grid-template-columns:1fr}}
.cartao{background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:30px;display:flex;flex-direction:column;gap:14px;min-width:0}
.cartao h3{font-size:24px}
.cartao p{color:var(--texto-2);font-size:16px}
.cartao .etq{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-2)}
.icone{width:50px;height:50px;border-radius:12px;background:var(--papel);display:flex;align-items:center;justify-content:center}
.icone svg{width:26px;height:26px}
.conclusao{background:var(--noturno);color:var(--branco);border-radius:var(--raio);padding:30px 36px;display:flex;flex-wrap:wrap;gap:20px;align-items:center}
.conclusao p{flex:1 1 420px;font-family:var(--display);font-size:clamp(19px,2.2vw,23px);font-weight:500;line-height:1.4}

/* Ciclo em nove etapas */
.ciclo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:20px;align-items:stretch}
.ciclo .etapa-g{grid-column:1 / -1}
@media (max-width:1000px){.ciclo{grid-template-columns:1fr}}
.fio .kicker{color:var(--ciano)}
.fio .nota{color:var(--texto-claro)}
.etapa{border-radius:18px;padding:26px;display:flex;flex-direction:column;gap:18px;min-width:0}
.etapa-i{background:var(--papel);border:1px solid var(--linha)}
.etapa-d{background:var(--papel);border:1px solid var(--linha)}
.etapa-g{background:var(--noturno);color:var(--branco)}
.etapa-topo{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.etapa-topo h3{font-size:28px;display:flex;align-items:center;gap:12px}
.qd{width:22px;height:22px;border-radius:5px;display:inline-block;flex-shrink:0}
.qd-i{border:4px solid var(--noturno);background:var(--branco)} .qd-d{background:var(--grafite)} .qd-g{background:var(--laranja)}
.etapa-topo a{font-size:15px;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.etapa-g .etapa-topo a{color:var(--ciano)}
.passos{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.passo{background:var(--branco);border:1px solid var(--linha);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:8px}
.etapa-g .passo{background:var(--noturno-2);border-color:var(--linha-escura)}
.passo .n{font-family:var(--display);font-size:13px;font-weight:600;color:var(--texto-2);letter-spacing:.06em}
.etapa-g .passo .n{color:var(--ciano)}
.passo h4{margin:0;font-family:var(--display);font-size:18px;font-weight:600;line-height:1.25}
.passo p{font-size:15px;color:var(--texto-2);line-height:1.5}
.etapa-g .passo p{color:var(--texto-claro)}
.passo .res{font-size:14px;font-weight:600;color:var(--texto);border-top:1px solid var(--linha);padding-top:10px;margin-top:auto}
.etapa-g .passo .res{color:var(--branco);border-color:var(--linha-escura)}
.volta{display:flex;align-items:center;gap:12px;justify-content:center;font-weight:600;font-size:15px;text-align:center}
.volta svg{width:22px;height:22px;flex-shrink:0}

/* Fio do documento */
.fio{background:var(--noturno);color:var(--branco);border-radius:18px;padding:36px;display:flex;flex-direction:column;gap:30px}
.fio-topo{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 40px}
.fio-topo h3{font-size:clamp(22px,2.6vw,28px)}
.marcos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
@media (max-width:900px){.marcos{grid-template-columns:1fr}}
.marco{display:flex;flex-direction:column;gap:12px;min-width:0}
.marco .ponto{display:flex;align-items:center;gap:10px}
.marco .ponto::after{content:"";flex:1;height:2px;background:var(--linha-escura)}
.marco:last-child .ponto::after{display:none}
.m{width:18px;height:18px;border-radius:4px;flex-shrink:0;display:block}
.m-perdido{border:2px dashed #8A96AD;border-radius:50%}
.m-i{background:var(--branco)} .m-d{background:var(--nevoa)} .m-g{background:var(--laranja)} .m-ia{background:var(--ciano);border-radius:50%}
.marco b{font-size:17px}
.marco b em{font-style:normal;font-family:var(--display);color:var(--ciano);margin-left:6px}
.marco span{font-size:14px;color:var(--texto-claro);line-height:1.45}

/* Pilares */
.pilares{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
@media (max-width:900px){.pilares{grid-template-columns:1fr}}
.pilar{border-top:1px solid var(--linha-escura);padding-top:26px;display:flex;flex-direction:column;gap:14px}
.pilar h3{font-size:25px}
.pilar p{color:var(--texto-claro);font-size:16px}
.pilar svg{width:30px;height:30px}

/* Assistente (simulação) */
.assistente{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;align-items:start}
@media (max-width:900px){.assistente{grid-template-columns:1fr}}
.perguntas{display:flex;flex-direction:column;gap:10px}
.perguntas button{text-align:left;font:inherit;font-size:16px;font-weight:500;color:var(--texto);background:var(--branco);border:1px solid var(--linha);border-radius:12px;padding:14px 16px;cursor:pointer;min-height:52px}
.perguntas button:hover{border-color:var(--acao)}
.perguntas button[aria-pressed="true"]{border-color:var(--noturno);background:var(--noturno);color:var(--branco)}
.resposta{background:var(--noturno);color:var(--branco);border-radius:18px;padding:28px;display:flex;flex-direction:column;gap:16px;min-height:260px}
.resposta .q{font-size:15px;color:var(--texto-claro)}
.resposta .a{font-size:18px;line-height:1.55}
.resposta .fonte{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--texto-claro);border:1px solid var(--linha-escura);border-radius:999px;padding:6px 12px;align-self:flex-start}
.resposta .sim{margin-top:auto;font-size:12px;color:var(--texto-claro);border-top:1px solid var(--linha-escura);padding-top:12px}

/* Próximo passo */
.proximo .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:56px}
.proximo-texto{flex:1 1 560px;display:flex;flex-direction:column;gap:24px}
.proximo h2{font-size:clamp(34px,5vw,58px);letter-spacing:-.02em;max-width:16ch}
.tres{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.tres li{display:flex;gap:14px;align-items:flex-start;color:var(--texto-claro);font-size:17px}
.tres li i{font-style:normal;width:30px;height:30px;border-radius:6px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:600;font-size:14px}
.tres .q1{background:var(--branco);color:var(--noturno)} .tres .q2{background:var(--nevoa);color:var(--noturno)} .tres .q3{background:var(--laranja);color:var(--branco)}
.proximo-arte{flex:0 1 300px;display:flex;justify-content:center}
.proximo-arte img{width:260px;height:auto}
.contato-linha{display:flex;flex-wrap:wrap;gap:8px 24px;font-size:15px;color:var(--texto-claro)}
.contato-linha b{color:var(--branco);font-weight:600;user-select:all}

/* Páginas de etapa */
.trilho{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.trilho a{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--linha-escura);color:var(--texto-claro);text-decoration:none;font-size:14px;font-weight:600}
.trilho a:hover{border-color:var(--ciano);color:var(--branco)}
.trilho a[aria-current="page"]{background:var(--branco);color:var(--noturno);border-color:var(--branco)}
.trilho a[aria-current="page"] .pt-i{box-shadow:inset 0 0 0 2.5px var(--noturno)}
.trilho a[aria-current="page"] .pt-d{background:var(--grafite)}
.trilho .sep{color:#8A96AD}
.trilho .loop{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--texto-claro);margin-left:6px}
.etapa-hero{padding-block:40px 96px}
.etapa-hero .wrap{display:flex;flex-direction:column;gap:52px}
.etapa-hero h1{font-size:clamp(38px,5.4vw,64px);letter-spacing:-.02em}
.par{display:flex;flex-wrap:wrap;align-items:center;gap:56px}
.par>div{flex:1 1 460px;min-width:0}
.par .txt{display:flex;flex-direction:column;gap:24px}
.painel{background:var(--noturno-2);border:1px solid var(--linha-escura);border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:16px}
.painel-topo{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;align-items:center}
.painel-topo b{font-family:var(--display);font-size:18px}
.selo{font-size:12px;font-weight:600;color:var(--texto-claro);border:1px solid var(--linha-escura);border-radius:999px;padding:4px 10px}
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.kpis div{background:var(--noturno);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:4px}
.kpis span{font-size:12px;color:var(--texto-claro)}
.kpis b{font-family:var(--display);font-size:26px;font-weight:600;font-variant-numeric:tabular-nums}
.linha-eq{display:grid;grid-template-columns:minmax(0,1fr) 110px 44px;gap:14px;align-items:center;padding:12px 14px;border:1px solid #2E3A57;border-radius:10px}
.linha-eq b{font-size:14px;display:block}
.linha-eq small{font-size:12px;color:var(--texto-claro)}
.barra{height:8px;border-radius:4px;background:#2E3A57;overflow:hidden}
.barra i{display:block;height:8px;background:var(--ciano);border-radius:4px}
.linha-eq em{font-style:normal;font-size:13px;text-align:right;color:var(--texto-claro);font-variant-numeric:tabular-nums}
.alerta{display:flex;align-items:center;gap:12px;padding:14px;border-radius:10px;border:1px solid var(--ciano);font-size:14px}
.alerta svg{width:22px;height:22px;flex-shrink:0}
.momento{background:var(--papel);border-bottom:1px solid var(--linha)}
.momento .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:16px 44px;padding-block:32px}
.momento .hora{display:flex;align-items:center;gap:14px}
.momento .hora span{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--texto-2)}
.momento .hora b{font-family:var(--display);font-size:34px;font-weight:600;color:var(--acao)}
.momento p{flex:1 1 420px;font-size:17px}
.lista-ok{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px}
@media (max-width:700px){.lista-ok{grid-template-columns:1fr}}
.lista-ok li{display:flex;gap:14px;padding:16px 0;border-top:1px solid var(--linha);font-size:17px;line-height:1.45}
.lista-ok svg{width:22px;height:22px;flex-shrink:0;margin-top:1px}
.lado{display:flex;flex-wrap:wrap;gap:48px 72px}
.lado>.cabeca{flex:1 1 340px;max-width:440px}
.lado>.corpo{flex:2 1 520px;min-width:0}
.modalidade{border:1px solid var(--linha);border-radius:16px;padding:30px;display:flex;flex-direction:column;gap:18px;background:var(--branco)}
.modalidade h3{font-size:28px}
.formula{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.formula span{padding:11px 15px;border-radius:10px;background:var(--papel);font-size:16px;font-weight:500}
.formula i{font-style:normal;font-family:var(--display);font-size:22px;color:var(--texto-2)}
.prazos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
@media (max-width:800px){.prazos{grid-template-columns:1fr}}
.prazos div{border-top:2px solid var(--noturno);padding-top:16px;display:flex;flex-direction:column;gap:4px}
.prazos b{font-family:var(--display);font-size:32px;font-weight:600}
.prazos span{font-size:15px;color:var(--texto-2)}
.mes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
@media (max-width:900px){.mes{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.mes{grid-template-columns:1fr}}
.mes li{display:flex;flex-direction:column;gap:14px}
.mes .num{display:flex;align-items:center}
.mes .num b{width:42px;height:42px;border-radius:50%;background:var(--noturno);color:var(--branco);font-family:var(--display);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.mes .num::after{content:"";flex:1;height:2px;background:var(--linha);margin-left:12px}
.mes li:last-child .num::after{display:none}
.mes p{font-weight:500;font-size:17px;line-height:1.45}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips span{padding:10px 16px;border-radius:999px;background:var(--branco);border:1px solid var(--linha);font-size:15px;font-weight:500}
.proxima-etapa .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px;padding-block:64px}
.proxima-etapa .info{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.proxima-etapa .info>span{width:60px;height:60px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.proxima-etapa .info div{display:flex;flex-direction:column;gap:6px}
.proxima-etapa .info small{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ciano)}
.proxima-etapa .info b{font-family:var(--display);font-size:clamp(22px,3vw,30px);font-weight:600;line-height:1.2}

/* Digitalização: papel → dado */
.papel-dado{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.folha{flex:0 0 180px;height:240px;background:var(--branco);border-radius:6px;padding:20px 18px;display:flex;flex-direction:column;gap:11px;color:var(--noturno)}
.folha small{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--grafite)}
.folha b{font-family:var(--display);font-size:20px}
.folha i{display:block;height:7px;border-radius:4px;background:#AEB7BC}
.campos{flex:1 1 220px;min-width:0;background:var(--noturno-2);border:1px solid var(--linha-escura);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:10px}
.campo{border:1px solid var(--ciano);border-radius:8px;padding:9px 12px;display:flex;flex-direction:column;gap:2px}
.campo small{font-size:11px;color:var(--texto-claro)}
.campo b{font-size:15px;font-variant-numeric:tabular-nums}
.erp{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px;border-radius:8px;background:var(--ciano);color:var(--noturno);font-weight:600;font-size:14px}
.quatro{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
@media (max-width:1000px){.quatro{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.quatro{grid-template-columns:1fr}}
.quatro li{border:1px solid var(--linha);border-radius:16px;padding:26px;display:flex;flex-direction:column;gap:12px;background:var(--branco)}
.quatro li.fim{background:var(--noturno);color:var(--branco);border-color:var(--noturno)}
.quatro li.fim p{color:var(--texto-claro)}
.quatro b{font-family:var(--display);font-size:14px;color:var(--texto-2)}
.quatro li.fim b{color:var(--ciano)}
.quatro h3{font-size:25px}
.quatro p{font-size:16px;color:var(--texto-2)}

/* Gestão: dossiê */
.dossie{display:flex;flex-direction:column}
.nivel{display:flex;align-items:center;gap:14px;padding:15px 18px;border:1px solid var(--linha-escura);border-radius:14px;background:var(--noturno-2)}
.nivel small{display:block;font-size:12px;color:var(--texto-claro)}
.nivel b{font-size:16px}
.liga{height:22px;border-left:2px solid var(--linha-escura);margin-left:30px}
.liga.c{border-color:var(--ciano);margin-left:58px}
.nivel.n2{margin-left:28px}
.dos{margin-left:56px;border:1.5px solid var(--ciano);border-radius:14px;padding:18px;background:var(--noturno);display:flex;flex-direction:column;gap:10px}
.doc{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;background:var(--noturno-2);font-size:14px}
.doc.falta{background:transparent;border:1px dashed #8A96AD;color:var(--texto-claro)}
.doc .tag{font-size:12px;font-weight:600;color:#F4B39B}
.trilha{font-size:13px;color:var(--texto-claro);border-top:1px solid var(--linha-escura);padding-top:10px;display:flex;flex-direction:column;gap:4px}
@media (max-width:520px){.dos{margin-left:0}.nivel.n2{margin-left:0}.liga,.liga.c{margin-left:24px}}
.conceitos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:900px){.conceitos{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.conceitos{grid-template-columns:1fr}}
.conceito{border-top:2px solid var(--noturno);padding-top:18px;display:flex;flex-direction:column;gap:8px}
.conceito h3{font-size:21px}
.conceito p{font-size:16px;color:var(--texto-2)}
.recursos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:900px){.recursos{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.recursos{grid-template-columns:1fr}}
.recurso{background:var(--noturno-2);border:1px solid var(--linha-escura);border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:8px}
.recurso h3{font-size:19px}
.recurso p{font-size:15px;color:var(--texto-claro)}

/* Diagnóstico */
.diag .wrap{display:flex;flex-wrap:wrap;gap:28px;align-items:stretch;padding-block:64px}
.diag-lado{flex:1 1 400px;background:var(--noturno);color:var(--branco);border-radius:20px;padding:44px;display:flex;flex-direction:column;gap:26px}
.diag-lado h1{font-size:clamp(32px,4vw,46px);letter-spacing:-.015em}
.form{flex:1.35 1 520px;background:var(--branco);border:1px solid var(--linha);border-radius:20px;padding:40px;display:flex;flex-direction:column;gap:22px;min-width:0}
@media (max-width:560px){.diag-lado,.form{padding:26px}}
.form h2{font-size:28px}
.linha-campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:640px){.linha-campos{grid-template-columns:1fr}}
.f{display:flex;flex-direction:column;gap:8px;min-width:0}
.f label,.f legend{font-size:14px;font-weight:600;padding:0}
.f input,.f select,.f textarea{font:inherit;font-size:16px;color:var(--texto);background:var(--branco);border:1px solid #9AA4AA;border-radius:8px;padding:0 14px;min-height:50px;width:100%}
.f textarea{padding:12px 14px;resize:vertical}
fieldset.f{border:0;margin:0;padding:0}
.opcoes{display:flex;flex-wrap:wrap;gap:10px}
.opcoes label{display:flex;align-items:center;gap:10px;min-height:46px;padding:0 16px;border:1px solid #9AA4AA;border-radius:999px;font-size:15px;font-weight:500;cursor:pointer}
.opcoes input{width:18px;height:18px;margin:0;accent-color:var(--noturno)}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--texto-2)}
.consent input{width:18px;height:18px;margin:2px 0 0;flex-shrink:0;accent-color:var(--noturno)}
.retorno{border-radius:10px;padding:14px 16px;font-size:15px;background:var(--papel);border:1px solid var(--linha)}

/* Rodapé */
.rodape{background:var(--noturno-3);color:var(--branco);border-top:1px solid #2A3654}
.rodape .wrap{display:flex;flex-direction:column;gap:44px;padding-block:64px 36px}
.rod-cols{display:flex;flex-wrap:wrap;justify-content:space-between;gap:40px}
.rod-cols>div,.rod-cols>nav{display:flex;flex-direction:column;gap:10px;min-width:150px}
.rod-cols .sobre{max-width:260px}
.rod-cols .sobre img{width:150px;height:auto}
.rod-cols p,.rod-cols span{font-size:15px;color:var(--texto-claro)}
.rod-cols b{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--texto-claro)}
.rod-cols a{color:var(--branco);text-decoration:none;font-size:15px}
.rod-cols a:hover{color:var(--ciano)}
.rod-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;border-top:1px solid #2A3654;padding-top:22px;font-size:14px;color:var(--texto-claro)}

/* Perguntas frequentes */
.faq{display:flex;flex-direction:column;gap:10px;max-width:900px}
.faq-item{background:var(--branco);border:1px solid var(--linha);border-radius:12px;padding:0 24px}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item h3{font-size:19px;font-weight:600;line-height:1.3}
.faq-mais{width:22px;height:22px;flex-shrink:0;position:relative}
.faq-mais::before,.faq-mais::after{content:"";position:absolute;background:var(--acao);border-radius:2px;left:50%;top:50%;transform:translate(-50%,-50%)}
.faq-mais::before{width:14px;height:2px}.faq-mais::after{width:2px;height:14px;transition:transform .15s ease}
.faq-item[open] .faq-mais::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-item p{padding:0 0 20px;color:var(--texto-2);font-size:16px;line-height:1.6;max-width:72ch}

/* Blog */
.pt-c{background:var(--ciano)}
.blog-topo{padding-block:64px 72px}
.blog-topo .wrap{display:flex;flex-direction:column;gap:18px}
.blog-topo h1{font-size:clamp(36px,5vw,60px);max-width:16ch}
.art-grade .cartao{text-decoration:none;color:var(--texto);transition:border-color .15s ease,transform .15s ease}
.art-grade .cartao:hover{border-color:var(--acao);transform:translateY(-2px)}
.art-cartao h3{font-size:22px;line-height:1.25}
.art-cartao .etq{display:flex;align-items:center;gap:8px}
.art-cartao p{flex:1}
.art-meta{font-size:13px;color:var(--texto-2)}
.art-topo{padding-block:40px 64px}
.art-topo .wrap{display:flex;flex-direction:column;gap:18px;max-width:900px}
.art-topo .kicker{display:flex;align-items:center;gap:10px}
.art-topo h1{font-size:clamp(32px,4.4vw,52px)}
.art-volta{color:var(--texto-claro);text-decoration:none;font-size:15px;font-weight:600}
.art-volta:hover{color:var(--ciano)}
.art-data{font-size:14px;color:var(--texto-claro)}
.art-corpo .wrap{display:flex;flex-direction:column;gap:56px;max-width:900px}
.prosa{font-size:18px;line-height:1.7;color:var(--texto)}
.prosa>*+*{margin-top:20px}
.prosa h2{font-size:clamp(24px,3vw,32px);margin-top:44px}
.prosa h3{font-size:21px;margin-top:32px}
.prosa p{color:var(--texto)}
.prosa ul,.prosa ol{padding-left:24px}
.prosa li+li{margin-top:8px}
.prosa table{border-collapse:collapse;width:100%;font-size:16px}
.prosa th,.prosa td{border:1px solid var(--linha);padding:10px 12px;text-align:left;vertical-align:top}
.prosa th{background:var(--papel);font-weight:600}
.art-cta{background:var(--noturno);color:var(--branco);border-radius:18px;padding:36px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.art-cta .kicker{color:var(--ciano)}
.art-cta h2{font-size:clamp(24px,3vw,32px)}
.art-cta p{color:var(--texto-claro);max-width:60ch}
.art-nav{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.art-nav a{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--texto);border:1px solid var(--linha);border-radius:12px;padding:18px}
.art-nav a:hover{border-color:var(--acao)}
.art-nav a.prox{text-align:right;align-items:flex-end}
.art-nav small{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-2)}
.art-nav b{font-size:16px;line-height:1.35}
@media (max-width:640px){.art-nav{grid-template-columns:1fr}.art-nav a.prox{text-align:left;align-items:flex-start}}

/* Formulário: campo isca e estado de envio */
.isca{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form button[disabled]{opacity:.7;cursor:progress}
.retorno.ok{color:#0B6E3F;font-weight:600}
.retorno.erro{color:#B3261E;font-weight:600}

/* Aviso de cookies */
.cookies{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:640px;margin:0 auto;background:#1F2A44;color:#fff;border-radius:14px;padding:16px 18px;display:flex;gap:16px;align-items:center;flex-wrap:wrap;box-shadow:0 10px 30px rgba(0,0,0,.28);font-size:.9rem;line-height:1.45}
.cookies p{margin:0;flex:1 1 260px}
.cookies div{display:flex;gap:8px}
.cookies .btn{padding:9px 16px;font-size:.9rem}

/* Redes sociais no rodapé */
.redes{display:flex;gap:10px;margin-top:18px}
.redes a{width:40px;height:40px;border:1px solid #3A4766;border-radius:10px;display:grid;place-items:center;color:#D9E1E2;transition:color .15s,border-color .15s}
.redes a:hover,.redes a:focus-visible{color:#DC582A;border-color:#DC582A}

/* Confirmação do diagnóstico */
.retorno.sucesso{display:flex;gap:14px;align-items:flex-start;background:#F0FAF4;border-color:#BFE3CE;color:#1F2A44;padding:18px 20px}
.retorno.sucesso .ic-ok{flex:none;margin-top:2px}
.retorno.sucesso strong{display:block;font-size:18px;font-weight:700;color:#0B6E3F;margin-bottom:4px}
.retorno.sucesso .txt{display:block;font-weight:400;font-size:15px;line-height:1.5}