/* =====================================================================
   VixCorp Soluções — folha de estilo do site
   Edite as cores em :root para ajustar a identidade em todo o site.
   ===================================================================== */

:root{
  --verde:#004241;
  --verde-2:#0A5450;
  --verde-3:#166B64;
  --laranja:#EA7B2A;
  --laranja-escuro:#A8500D;
  --laranja-claro:#F5A45E;
  --creme:#D8CCBE;
  --fundo:#F5F5F2;
  --branco:#FFFFFF;
  --texto:#14312C;
  --texto-2:#48605A;
  --linha:#DEE3E0;
  --alerta:#8A2E2E;
  --ok:#1F5C43;
  --on-laranja:#04302E;
  --raio:8px;
  --sombra:0 1px 2px rgba(0,66,65,.06), 0 8px 24px rgba(0,66,65,.06);
  --largura:1140px;
  --corpo:18px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--fundo);
  color:var(--texto);
  font-family:"Source Sans 3","Segoe UI",system-ui,-apple-system,sans-serif;
  font-size:var(--corpo);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
body.fonte-grande{--corpo:21px}
img{max-width:100%;height:auto;display:block}
a{color:var(--laranja-escuro);overflow-wrap:anywhere}
h1,h2,h3,h4{font-family:"Poppins","Segoe UI",system-ui,sans-serif;font-weight:600;line-height:1.18;letter-spacing:-.01em;text-wrap:balance;margin:0}
p{margin:0 0 1em;overflow-wrap:anywhere}
p:last-child{margin-bottom:0}
:focus-visible{outline:3px solid var(--laranja);outline-offset:3px}
.container{max-width:var(--largura);margin:0 auto;padding:0 22px}
.estreito{max-width:760px}

/* ---------- barra superior ---------- */
.topo{background:var(--verde);color:#CFE0DC;font-size:14.5px}
.topo .container{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:40px;flex-wrap:wrap}
.topo a{color:var(--laranja-claro);text-decoration:none}
.topo a:hover{text-decoration:underline}
@media (max-width:700px){.topo .aviso{display:none}}

/* ---------- cabeçalho ---------- */
.cabecalho{background:var(--verde);border-bottom:1px solid var(--verde-3);position:sticky;top:0;z-index:40}
.cabecalho .container{display:flex;align-items:center;gap:18px;min-height:76px;flex-wrap:nowrap}
.marca{display:flex;align-items:center;text-decoration:none;color:#fff;flex:none}
.marca img{height:50px;width:auto}
@media (max-width:520px){.marca img{height:38px}}
.selo-rodape{width:54px;height:54px;margin-bottom:14px;opacity:.9}
.marca .nome{font-family:"Poppins","Segoe UI",system-ui,sans-serif;font-size:19px;line-height:1.1}
.marca .sub{font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--laranja);margin-top:2px}
.menu{margin-left:auto;display:flex;align-items:center;gap:18px;min-width:0}
.menu a{color:#DFEAE7;text-decoration:none;font-size:15.5px;white-space:nowrap;padding:6px 0;border-bottom:2px solid transparent}
.menu a:hover,.menu a[aria-current="page"]{color:#fff;border-bottom-color:var(--laranja)}
.menu .btn-zap{border:none}
.menu a.btn{color:var(--on-laranja)}
.menu a.btn.vazado{color:var(--laranja-escuro)}
.menu .btn{white-space:nowrap}
.btn-menu{display:none;margin-left:auto;background:none;border:1px solid var(--verde-3);color:#fff;border-radius:6px;padding:8px 12px;font-size:15px;cursor:pointer}
.btn-fonte{background:none;border:1px solid var(--verde-3);color:#DFEAE7;border-radius:6px;padding:5px 9px;font-size:13px;cursor:pointer;flex:none}
.btn-fonte:hover{border-color:var(--laranja);color:#fff}
@media (max-width:1180px){
  .btn-menu{display:block}
  .menu{position:absolute;top:100%;left:0;right:0;background:var(--verde-2);flex-direction:column;align-items:stretch;gap:0;padding:8px 22px 18px;display:none;border-bottom:2px solid var(--laranja)}
  .menu.aberto{display:flex}
  .menu a{padding:12px 0;border-bottom:1px solid var(--verde-3)}
  .menu .btn{margin-top:12px;text-align:center}
  .btn-fonte{align-self:flex-start;margin-top:12px}
}

/* ---------- botões ---------- */
.btn{display:inline-block;background:var(--laranja);color:var(--on-laranja);font-weight:600;font-size:17px;padding:13px 24px;border-radius:var(--raio);text-decoration:none;border:2px solid var(--laranja);transition:background .15s,transform .1s}
.btn:hover{background:var(--laranja-claro);border-color:var(--laranja-claro)}
.btn:active{transform:translateY(1px)}
.btn.vazado{background:transparent;color:var(--laranja-escuro);border-color:var(--laranja-escuro)}
.hero .btn.vazado,.capa .btn.vazado,.faixa .btn.vazado,section.verde .btn.vazado,.reservado .btn.vazado,.rodape .btn.vazado{color:var(--laranja-claro);border-color:var(--laranja)}
.btn.vazado:hover{background:rgba(234,123,42,.14);color:#fff}
.btn.escuro{background:var(--verde);color:#fff;border-color:var(--verde)}
.btn.escuro:hover{background:var(--verde-2);border-color:var(--verde-2)}
.btn-linha{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}

/* ---------- hero ---------- */
.hero{background:var(--verde);color:#fff;padding:64px 0 72px;border-bottom:3px solid var(--laranja)}
.hero h1{font-size:clamp(30px,5vw,52px);color:#fff;max-width:17ch}
.hero h1 em{font-style:normal;color:var(--laranja-claro)}
.hero p{color:#CFE0DC;font-size:clamp(18px,2.2vw,21px);max-width:56ch;margin-top:20px}
.hero .selos{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:32px;padding-top:22px;border-top:1px solid var(--verde-3);font-size:15px;color:#9FB8B2}
.hero .selos span{display:flex;align-items:center;gap:8px}
.grupo-selo{margin-top:22px;font-size:13.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--laranja-claro);font-weight:600}

/* ---------------------------------------------------------------------
   ETIQUETA DE PÚBLICO
   Categoria do cliente em etiqueta sólida acima da manchete. Fundo
   laranja da marca com texto verde-escuro: 5,0:1 de contraste, acima
   do mínimo de 4,5 exigido para texto normal.
   --------------------------------------------------------------------- */
.hero .chapeu,.capa .chapeu{
  display:inline-block;
  background:var(--laranja);
  color:var(--on-laranja);
  font-family:"Poppins","Segoe UI",system-ui,sans-serif;
  font-size:15.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  line-height:1.2;
  padding:9px 20px;border-radius:999px;
  margin:0 0 20px;
  box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.capa .migalhas + .chapeu{margin-top:4px}
@media (max-width:520px){
  .hero .chapeu,.capa .chapeu{font-size:13px;letter-spacing:.05em;padding:8px 15px;margin-bottom:16px}
}

/* ---------------------------------------------------------------------
   ARTE DO TOPO
   Ilustração original em SVG, na paleta da marca. Fica ao lado do texto
   no desktop e abaixo dele no celular, para nunca empurrar o título
   para fora da primeira tela.
   --------------------------------------------------------------------- */
.hero-grade{display:grid;gap:30px;align-items:center}
@media (min-width:960px){
  .hero-grade{grid-template-columns:minmax(0,1fr) minmax(0,400px)}
}
.hero-arte{margin:0;min-width:0}
.hero-arte svg{width:100%;height:auto;display:block}
@media (max-width:959px){
  .hero-arte{max-width:330px;margin:4px auto 0}
}
@media (max-width:420px){
  .hero-arte{max-width:270px}
}

/* ---------- cabeçalho de página interna ---------- */
.capa{background:var(--verde);color:#fff;padding:44px 0 48px;border-bottom:3px solid var(--laranja)}
.capa h1{font-size:clamp(27px,4.2vw,42px);color:#fff;max-width:22ch}
.capa p{color:#CFE0DC;margin-top:16px;max-width:62ch}
.migalhas{font-size:14px;color:#8FA9A3;margin-bottom:14px}
.migalhas a{color:#8FA9A3;text-decoration:none}
.migalhas a:hover{color:var(--laranja-claro)}

/* ---------- seções ---------- */
section{padding:56px 0}
section.claro{background:var(--branco)}
section.verde{background:var(--verde);color:#fff}
section.verde h2,section.verde h3{color:#fff}
section.verde p{color:#CFE0DC}
.titulo{font-size:clamp(24px,3.4vw,34px);margin-bottom:14px}
.subtitulo{color:var(--texto-2);max-width:62ch;margin-bottom:32px;font-size:19px}
section.verde .subtitulo{color:#CFE0DC}

/* ---------------------------------------------------------------------
   CORREÇÃO DE LEGIBILIDADE
   Blocos de fundo BRANCO dentro de uma seção de fundo VERDE herdavam a
   cor de texto clara da seção (h2/h3 em #fff e p em #CFE0DC), ficando
   branco sobre branco. Aqui a cor de texto escura é devolvida a todo
   componente claro que possa aparecer dentro da faixa verde.
   --------------------------------------------------------------------- */
section.verde .cartao,
section.verde .cartao-caminho,
section.verde .plano,
section.verde .etapa,
section.verde .resumo,
section.verde .formulario,
section.verde .oferta,
section.verde .destaque,
section.verde .tabela,
section.verde .comparativo,
section.verde .faq,
section.verde .memoria,
section.verde .diag,
section.verde .versus .lado{color:var(--texto)}

section.verde .cartao h2,section.verde .cartao h3,section.verde .cartao h4,
section.verde .cartao-caminho h2,section.verde .cartao-caminho h3,
section.verde .plano h2,section.verde .plano h3,
section.verde .etapa h2,section.verde .etapa h3,
section.verde .resumo h2,section.verde .resumo h3,
section.verde .formulario h2,section.verde .formulario h3,
section.verde .oferta h2,section.verde .oferta h3,
section.verde .destaque h2,section.verde .destaque h3,
section.verde .faq h2,section.verde .faq h3,
section.verde .versus .lado h2,section.verde .versus .lado h3{color:var(--texto)}

section.verde .cartao p,
section.verde .cartao-caminho p,
section.verde .plano p,
section.verde .etapa p,
section.verde .resumo p,
section.verde .formulario p,
section.verde .oferta p,
section.verde .destaque p,
section.verde .faq p,
section.verde .versus .lado p{color:var(--texto-2)}

section.verde .cartao li,
section.verde .plano li,
section.verde .oferta li,
section.verde .versus li,
section.verde .faq .resposta,
section.verde .cartao-caminho .rota,
section.verde .etapa p{color:var(--texto-2)}

section.verde .destaque strong,
section.verde .cartao strong,
section.verde .plano strong,
section.verde .resumo strong{color:var(--texto)}

section.verde .cartao .icone,
section.verde .cartao-caminho .seta,
section.verde .plano .selo,
section.verde .etapa .fase,
section.verde .resumo h2{color:var(--laranja-escuro)}

section.verde .tabela th,section.verde .comparativo tbody th{color:var(--texto-2)}
section.verde .tabela td,section.verde .comparativo td{color:var(--texto-2)}
section.verde .tabela td strong{color:var(--texto)}
section.verde .campo label{color:var(--texto)}
section.verde .campo .ajuda,section.verde .consentimento{color:var(--texto-2)}

/* ---------- cartões ---------- */
.grade{display:grid;gap:18px}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(290px,100%),1fr))}
.grade-caminhos{grid-template-columns:repeat(auto-fit,minmax(min(430px,100%),1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr))}
.cartao{background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:24px;box-shadow:var(--sombra)}
.cartao h3{font-size:20px;margin-bottom:8px}
.cartao p{color:var(--texto-2);font-size:16.5px}
a.cartao{text-decoration:none;color:inherit;display:block;transition:border-color .15s,transform .12s}
a.cartao:hover{border-color:var(--laranja);transform:translateY(-2px)}
a.cartao .seta{display:inline-block;margin-top:12px;color:var(--laranja-escuro);font-weight:600;font-size:16px}
.icone{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--laranja);display:flex;align-items:center;justify-content:center;margin-bottom:14px;color:var(--laranja-escuro);flex:none}
section.verde .icone{color:var(--laranja-claro)}
.cartao-caminho{background:var(--branco);border:1px solid var(--linha);border-left:4px solid var(--laranja);border-radius:var(--raio);padding:20px 22px;text-decoration:none;color:inherit;display:block;box-shadow:var(--sombra);transition:transform .12s,border-color .15s}
.cartao-caminho:hover{transform:translateY(-2px);border-color:var(--laranja)}
.cartao-caminho .frase{display:block;font-family:"Poppins","Segoe UI",system-ui,sans-serif;font-size:20px;line-height:1.3;margin-bottom:6px}
.cartao-caminho .rota{display:block;color:var(--texto-2);font-size:16px}
.cartao-caminho .seta{color:var(--laranja-escuro);font-weight:600;font-size:16px;display:inline-block;margin-top:10px}

.socio{display:flex;gap:18px;align-items:flex-start}
.socio h3{font-size:19px;margin-bottom:2px}
.socio .papel{font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--laranja-escuro);font-weight:600;margin-bottom:8px}
.monograma{flex:none;width:64px;height:64px;border-radius:50%;border:1.5px solid var(--laranja);color:var(--laranja-escuro);display:flex;align-items:center;justify-content:center;font-family:"Poppins","Segoe UI",system-ui,sans-serif;font-size:21px;letter-spacing:.02em;background:#FFF6EE}
.monograma img{width:34px;height:34px;object-fit:contain}
@media (max-width:480px){.socio{flex-direction:column;gap:12px}}

/* ---------- passos ---------- */
.passos{counter-reset:passo;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr))}
.passo{background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:22px;position:relative}
section.verde .passo{background:var(--verde-2);border-color:var(--verde-3)}
.passo .n{counter-increment:passo;font-family:"Poppins","Segoe UI",system-ui,sans-serif;font-size:15px;color:var(--laranja-escuro);border:1.5px solid var(--laranja);width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:12px}
section.verde .passo .n{color:var(--laranja-claro)}
.passo .n::before{content:counter(passo)}
.passo h3{font-size:18px;margin-bottom:6px}
.passo p{font-size:16px;color:var(--texto-2)}
section.verde .passo p{color:#CFE0DC}

/* ---------- conteúdo de texto ---------- */
.texto{max-width:760px}
.texto h2{font-size:clamp(23px,3vw,30px);margin:44px 0 14px}
.texto h2:first-child{margin-top:0}
.texto h3{font-size:20px;margin:28px 0 8px}
.texto ul,.texto ol{padding-left:22px;margin:0 0 1em}
.texto li{margin:8px 0}
.texto li::marker{color:var(--laranja-escuro)}
.texto strong{font-weight:600}

.resumo{background:var(--branco);border:1px solid var(--linha);border-left:4px solid var(--laranja);border-radius:var(--raio);padding:22px 24px;margin-bottom:32px;box-shadow:var(--sombra)}
.resumo h2{font-size:19px!important;margin:0 0 10px!important;font-family:"Source Sans 3",sans-serif;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--laranja-escuro);font-size:14px!important}
.resumo p{font-size:18px}

.destaque{background:#FFF6EE;border:1px solid #F0D5B8;border-radius:var(--raio);padding:18px 22px;margin:26px 0}
.destaque.atencao{background:#FDF1F1;border-color:#EBC9C9}
.destaque p{font-size:17px}
.destaque strong{color:var(--texto)}

.checklist{list-style:none;padding:0;margin:18px 0}
.checklist li{position:relative;padding:11px 0 11px 28px;border-bottom:1px dashed var(--linha);margin:0}
.checklist li:last-child{border-bottom:none}
.checklist li::before{content:"✓";position:absolute;left:0;top:11px;color:var(--laranja-escuro);font-weight:700}
.lista-nao li::before{content:"✕";color:var(--alerta)}

.tabela{overflow-x:auto;border:1px solid var(--linha);border-radius:var(--raio);background:var(--branco);margin:22px 0}
table{border-collapse:collapse;width:100%;min-width:480px;font-size:17px}
th,td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--linha);vertical-align:top}
th{background:#EAF0EE;font-family:"Source Sans 3",sans-serif;font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--texto-2);font-weight:600}
td{color:var(--texto-2)}
td strong{color:var(--texto)}
tbody tr:last-child td{border-bottom:none}
.num{font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---------- acordeão ---------- */
.faq{border-top:1px solid var(--linha)}
.faq details{border-bottom:1px solid var(--linha);background:var(--branco)}
.faq summary{cursor:pointer;padding:18px 20px;font-weight:600;font-size:18px;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--laranja-escuro);font-size:22px;line-height:1;flex:none}
.faq details[open] summary::after{content:"–"}
.faq .resposta{padding:0 20px 20px;color:var(--texto-2);max-width:70ch}

/* ---------- faixa de chamada ---------- */
.faixa{background:var(--verde);color:#fff;border-top:3px solid var(--laranja);border-bottom:3px solid var(--laranja)}
.faixa .container{padding-top:52px;padding-bottom:52px}
.faixa h2{color:#fff;font-size:clamp(23px,3.2vw,32px);max-width:24ch}
.faixa p{color:#CFE0DC;max-width:56ch;margin-top:14px}

/* ---------- formulário ---------- */
.formulario{background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:26px;box-shadow:var(--sombra)}
.campo{margin-bottom:18px}
.campo label{display:block;font-weight:600;font-size:16px;margin-bottom:6px}
.campo input,.campo select,.campo textarea{width:100%;padding:12px 14px;border:1px solid var(--linha);border-radius:6px;font:inherit;font-size:17px;background:#fff;color:var(--texto)}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--laranja);outline:none;box-shadow:0 0 0 3px rgba(234,123,42,.2)}
.campo textarea{min-height:120px;resize:vertical}
.campo .ajuda{font-size:14.5px;color:var(--texto-2);margin-top:5px}
.consentimento{display:flex;gap:10px;align-items:flex-start;font-size:15.5px;color:var(--texto-2)}
.consentimento input{width:20px;height:20px;margin-top:3px;flex:none}
.form-ok{display:none;background:#EEF7F2;border:1px solid #BEDDCC;color:var(--ok);border-radius:var(--raio);padding:16px 18px;margin-bottom:18px;font-weight:600}

/* ---------- contato ---------- */
.dados-contato{list-style:none;padding:0;margin:0}
.dados-contato li{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--linha);flex-wrap:wrap}
.dados-contato li > span:last-child{min-width:0;overflow-wrap:anywhere}
.dados-contato li:last-child{border-bottom:none}
.dados-contato .rot{font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--texto-2);min-width:104px;flex:none;padding-top:2px}

/* ---------- rodapé ---------- */
.rodape{background:var(--verde);color:#B0C4BF;padding:52px 0 26px;font-size:16px}
.rodape a{color:#DFEAE7;text-decoration:none}
.rodape a:hover{color:var(--laranja-claro);text-decoration:underline}
.rodape h4{font-family:"Source Sans 3",sans-serif;font-size:14px;text-transform:uppercase;letter-spacing:.12em;color:var(--laranja-claro);margin-bottom:14px}
.rodape ul{list-style:none;padding:0;margin:0}
.rodape li{margin:8px 0}
.rodape-grade{display:grid;gap:34px;grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr))}
.rodape-fim{margin-top:38px;padding-top:20px;border-top:1px solid var(--verde-3);font-size:14.5px;color:#8FA9A3;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
.aviso-legal{margin-top:14px;font-size:14px;color:#8FA9A3;max-width:80ch}

/* ---------- WhatsApp flutuante ---------- */
.zap-flutuante{position:fixed;right:18px;bottom:18px;z-index:60;background:#0F7A40;color:#fff;border-radius:999px;padding:14px 20px;font-weight:600;text-decoration:none;box-shadow:0 6px 20px rgba(0,0,0,.25);display:flex;align-items:center;gap:10px;font-size:16.5px}
.zap-flutuante:hover{background:#0B7038}
@media (max-width:560px){.zap-flutuante{padding:14px;border-radius:50%}.zap-flutuante span{display:none}}

/* ---------- preencher ---------- */
.preencher{background:#FFEFDF;border:1px dashed var(--laranja-escuro);color:#7A3F06;border-radius:4px;padding:0 6px;font-size:.92em;font-weight:600;overflow-wrap:anywhere}

/* ---------- cookies ---------- */
.cookies{position:fixed;left:14px;right:14px;bottom:14px;z-index:70;background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);box-shadow:0 8px 30px rgba(0,66,65,.2);padding:18px 20px;display:none;gap:16px;align-items:center;flex-wrap:wrap;max-width:820px;margin:0 auto;font-size:16px}
.cookies.visivel{display:flex}
.cookies p{flex:1 1 320px;margin:0;color:var(--texto-2)}
.cookies .acoes{display:flex;gap:10px}
.cookies button{font:inherit;font-size:15.5px;font-weight:600;padding:10px 16px;border-radius:6px;cursor:pointer;border:1px solid var(--linha);background:#fff;color:var(--texto)}
.cookies button.aceitar{background:var(--laranja);border-color:var(--laranja);color:var(--on-laranja)}

@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

@media print{
  .cabecalho,.topo,.zap-flutuante,.cookies,.faixa .btn-linha{display:none}
  body{background:#fff;font-size:12pt}
  section{padding:18px 0}
}