
:root{
  --verde:#0F6C58; --verde-esc:#041E18; --verde-med:#1E7A5F; --lima:#C4FF40;
  --cinza:#6B7280; --cinza-claro:#E5E7EB; --fundo:#F4F6F5; --vermelho:#C62828;
  --branco:#fff; --sombra:0 6px 24px rgba(4,30,24,.10); --raio:10px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#1F2937;background:var(--branco);line-height:1.5}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none}
input{font:inherit}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}
.oculto{display:none !important}

.topbar{background:var(--verde-esc);color:#fff;font-size:12.5px}
.topbar-in{display:flex;align-items:center;justify-content:space-between;min-height:38px;gap:16px}
.topbar-nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.topbar-nav a{display:inline-flex;align-items:center;gap:7px;color:#fff;opacity:.92}
.topbar-nav a:hover{opacity:1;text-decoration:underline}
.topbar-nav svg{width:15px;height:15px}
.topbar-linguas{display:flex;gap:6px}
.topbar-linguas a{padding:3px 9px;border-radius:20px;border:1px solid rgba(255,255,255,.35)}
.topbar-linguas a.ativo{background:var(--lima);color:var(--verde-esc);border-color:var(--lima);font-weight:700}

.header{background:#fff;border-bottom:1px solid var(--cinza-claro);position:sticky;top:0;z-index:60}
.header-in{display:flex;align-items:center;gap:18px;min-height:78px}
.logo img{height:28px;width:auto}
.busca{margin-left:auto;display:flex;align-items:center;border:1px solid var(--cinza-claro);border-radius:30px;overflow:hidden;background:#fff}
.busca input{border:0;outline:0;padding:9px 14px;width:230px;font-size:14px}
.busca button{padding:9px 14px}
.btn-menu{display:none;align-items:center;gap:9px;font-weight:600;color:var(--verde);border:1px solid var(--cinza-claro);border-radius:30px;padding:8px 16px}
.btn-menu .burger{display:inline-flex;flex-direction:column;gap:3px}
.btn-menu .burger i{display:block;width:16px;height:2px;background:var(--verde)}
.btn-menu .lbl-fechar{display:none}
body.menu-aberto .btn-menu .lbl-fechar{display:inline}
body.menu-aberto .btn-menu .lbl-abrir{display:none}
.btn-atende{background:var(--verde);color:#fff;font-weight:700;font-size:13px;letter-spacing:.4px;padding:11px 20px;border-radius:30px;white-space:nowrap}
.btn-atende:hover{background:var(--verde-med)}

.megamenu{background:#fff;border-bottom:1px solid var(--cinza-claro);display:none}
body.menu-aberto .megamenu{display:block}
.mega-grid{display:grid;grid-template-columns:repeat(4,1fr) 1.2fr;gap:26px;padding-top:26px;padding-bottom:32px}
.mega-col h3{font-size:12px;letter-spacing:.6px;color:var(--verde);margin-bottom:10px;text-transform:uppercase}
.mega-col ul{list-style:none;margin-bottom:18px}
.mega-col li a{font-size:14px;color:#374151;padding:4px 0;display:block}
.mega-col li a:hover{color:var(--verde);text-decoration:underline}
.mega-destaque{border-left:1px solid var(--cinza-claro);padding-left:22px}
.mega-icones li a{display:flex;align-items:center;gap:9px}
.mega-icones svg{width:20px;height:20px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 26px;border-radius:30px;font-weight:700;font-size:14px;transition:.15s;text-align:center}
.btn-verde{background:var(--verde);color:#fff}
.btn-verde:hover{background:var(--verde-med)}
.btn-outline{background:#fff;color:var(--verde);border:2px solid var(--verde)}
.btn-outline:hover{background:#EAF5F1}
.btn-full{width:100%}
.btn-centro{display:flex;justify-content:center;margin-top:30px}

.hero{padding:22px 0 0}
.hero-slide{border-radius:14px;min-height:290px;background-size:cover;background-position:center;display:flex;align-items:center;padding:34px 40px;position:relative;overflow:hidden;transition:.18s}
.hero-slide:hover{box-shadow:var(--sombra)}
.hero-box{max-width:520px}
.hero-logo{height:40px;margin-bottom:14px}
.hero-box p{font-size:22px;color:#111;margin-bottom:20px}
.hero-box strong{color:var(--verde)}

.bandeira{padding:22px 0}
.bandeira-card{border:1px solid var(--cinza-claro);border-radius:var(--raio);padding:18px 22px;display:flex;align-items:center;gap:26px;flex-wrap:wrap;transition:.15s}
.bandeira-card:hover{border-color:var(--verde);box-shadow:var(--sombra)}
.bandeira-titulo{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--verde)}
.bandeira-lista{display:flex;align-items:center;gap:10px;font-size:14px;flex-wrap:wrap}
.bandeira-lista .mes{color:#374151}
.tag-amarela,.tag-verde{padding:3px 12px;border-radius:20px;font-size:12.5px;font-weight:700}
.tag-amarela{background:#FFF3C4;color:#8A6D00}
.tag-verde{background:#E3F5EC;color:var(--verde)}
.link-verde{color:var(--verde);font-weight:600;text-decoration:underline;margin-left:auto}

.servicos{padding:34px 0 20px;position:relative;overflow:hidden}
.blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.35;z-index:0}
.blob.b1{width:320px;height:320px;background:#B8E8D6;top:-60px;left:-90px}
.blob.b2{width:280px;height:280px;background:#E8F8B8;bottom:-80px;right:-70px}
.servicos .wrap{position:relative;z-index:1}
.titulo-bloco{font-size:26px;color:var(--verde-esc);margin-bottom:22px}
.lista-servicos ul{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card-serv a{display:block;background:#fff;border:1px solid var(--cinza-claro);border-radius:var(--raio);padding:22px 20px;height:100%;transition:.16s}
.card-serv a:hover{border-color:var(--verde);box-shadow:var(--sombra);transform:translateY(-2px)}
.card-serv .ico{display:block;margin-bottom:14px}
.card-serv .ico svg{width:28px;height:28px}
.card-tit{display:block;color:var(--verde);font-weight:700;font-size:15px;margin-bottom:8px}
.card-desc{font-size:13.5px;color:var(--cinza)}

.artigos{padding:36px 0 50px}
.artigos-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.artigo{border:1px solid var(--cinza-claro);border-radius:var(--raio);overflow:hidden;display:flex;flex-direction:column;background:#fff;transition:.16s}
.artigo:hover{border-color:var(--verde);box-shadow:var(--sombra)}
.artigo .categoria{background:var(--verde);color:#fff;font-size:11.5px;font-weight:700;padding:5px 12px;align-self:flex-start;border-radius:0 0 8px 0}
.artigo .thumb img{width:100%;height:170px;object-fit:cover}
.artigo time{font-size:12.5px;color:var(--cinza);padding:14px 16px 0}
.artigo h3{font-size:15.5px;color:#111;padding:6px 16px 0;line-height:1.35}
.artigo p{font-size:13.5px;color:var(--cinza);padding:8px 16px 0}
.artigo .saiba{display:flex;align-items:center;gap:6px;color:var(--verde);font-weight:700;font-size:13.5px;padding:14px 16px 18px;margin-top:auto}

#tela-consulta,#tela-debitos{background:var(--fundo);min-height:70vh;padding-bottom:60px}
.breadcrumb{display:flex;gap:8px;font-size:13px;color:var(--cinza);padding:18px 0}
.breadcrumb a{color:var(--verde)}
.breadcrumb span::before{content:"\203A";margin-right:8px}

.alerta{display:flex;align-items:center;gap:12px;background:#EFAF3C;color:#3B2F00;border-radius:6px;padding:14px 18px;font-size:14px;font-weight:600;margin-bottom:22px}
.alerta-ico{flex:0 0 20px;display:flex}
.alerta-txt{flex:1}
.alerta-x{color:#3B2F00;font-size:24px;line-height:1;padding:0 4px}

.consulta-centro{max-width:620px;margin:0 auto}
.titulo-pagina{font-size:28px;color:var(--verde-esc);text-align:center}
.subtitulo-pagina{color:var(--cinza);margin:10px auto 0;text-align:center}
.card-form{background:#fff;border:1px solid var(--cinza-claro);border-radius:var(--raio);padding:28px;margin-top:26px}
.campo{position:relative;margin-bottom:20px}
.campo input{width:100%;padding:17px 14px 8px;border:1px solid var(--cinza-claro);border-radius:8px;outline:0;font-size:15px;background:#fff;transition:.15s}
.campo input:focus{border-color:var(--verde);box-shadow:0 0 0 3px rgba(15,108,88,.12)}
.campo label{position:absolute;left:14px;top:14px;color:#9CA3AF;font-size:15px;pointer-events:none;transition:.15s;background:#fff;padding:0 4px}
.campo input:focus + label,
.campo input:not(:placeholder-shown) + label{top:-9px;left:10px;font-size:12px;color:var(--verde);font-weight:600}
.card-form .btn{margin-top:6px}
.erro{color:var(--vermelho);font-size:13.5px;min-height:18px;margin-bottom:6px;text-align:center}

.btn-tutorial{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:20px;padding:14px 18px;border:1px solid var(--cinza-claro);border-radius:8px;background:#FAFDFB;color:var(--verde);font-weight:700;font-size:14.5px;text-align:left;transition:.15s}
.btn-tutorial:hover{border-color:var(--verde)}
.btn-tutorial .chev{flex:0 0 16px;transition:transform .2s}
.btn-tutorial[aria-expanded="true"] .chev{transform:rotate(180deg)}
.tutorial{margin-top:12px;border:1px solid var(--cinza-claro);border-radius:8px;padding:14px;background:#fff;animation:abre .18s ease-out}
@keyframes abre{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.tutorial img{width:100%;border-radius:6px;border:1px solid var(--cinza-claro)}
.tutorial-dicas{margin-top:14px;padding-left:20px;font-size:13.5px;color:var(--cinza)}
.tutorial-dicas li{padding:3px 0}

.mini-fatura{background:#fff;border:1px solid var(--cinza-claro);border-radius:8px;padding:14px;font-size:12.5px}
.mf2-topo{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--verde);padding-bottom:8px;margin-bottom:12px}
.mf2-topo b{color:var(--verde);font-size:15px;letter-spacing:1px}
.mf2-topo span{color:var(--cinza);font-size:11px;text-transform:uppercase;letter-spacing:.5px}
.mf2-linha{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px dashed #EDF1F0}
.mf2-linha small{color:var(--cinza);text-transform:uppercase;font-size:10.5px;letter-spacing:.4px}
.mf2-linha span{font-weight:600;color:#374151}
.mf2-caixa{position:relative;margin:14px 0;border:2px dashed var(--vermelho);border-radius:6px;padding:10px 12px;background:#FFF7F7}
.mf2-caixa small{display:block;color:var(--vermelho);text-transform:uppercase;font-size:10.5px;letter-spacing:.4px;font-weight:700}
.mf2-num{font-weight:800;font-size:17px;color:var(--vermelho)}
.mf2-seta{position:absolute;left:-64px;top:50%;transform:translateY(-50%);background:var(--vermelho);color:#fff;font-size:10px;font-weight:800;letter-spacing:.5px;padding:3px 8px;border-radius:4px}
.mf2-seta::after{content:"";position:absolute;right:-7px;top:50%;transform:translateY(-50%);border:6px solid transparent;border-left-color:var(--vermelho)}
@media(max-width:520px){.mf2-seta{left:-6px;top:-11px}.mini-fatura{margin-top:14px}}

.resumo-unidade{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;background:#fff;border:1px solid var(--cinza-claro);border-radius:var(--raio);padding:20px;margin-bottom:14px}
.resumo-unidade small{display:block;color:var(--cinza);font-size:12px;text-transform:uppercase;letter-spacing:.4px}
.resumo-unidade b{font-size:14.5px;color:#111}
.nota-cache{font-size:12.5px;color:var(--verde);margin-bottom:18px}
.titulo-bloco-linha{display:flex;align-items:center;gap:12px;font-size:20px;color:var(--verde-esc);margin-bottom:16px}
.pill{background:var(--verde);color:#fff;font-size:13px;padding:2px 11px;border-radius:20px}
.tabela-cab{display:grid;grid-template-columns:44px 130px 1fr 150px 160px;gap:10px;padding:0 18px 8px;font-size:12.5px;color:var(--cinza);text-transform:uppercase;letter-spacing:.4px}
.linha-debito{display:grid;grid-template-columns:44px 130px 1fr 150px 160px;gap:10px;align-items:center;background:#fff;border:1px solid var(--cinza-claro);border-left:5px solid var(--verde);border-radius:8px;padding:16px 18px;margin-bottom:10px;cursor:pointer;transition:.15s}
.linha-debito:hover{box-shadow:var(--sombra)}
.linha-debito.atrasada{border-left-color:var(--vermelho)}
.linha-debito .valor{font-weight:800;font-size:17px}
.linha-debito.atrasada .valor,.linha-debito.atrasada .venc{color:var(--vermelho)}
.chk{width:20px;height:20px;accent-color:var(--verde)}
.badge{font-size:12px;font-weight:700;padding:4px 12px;border-radius:20px;display:inline-block}
.badge.aberto{background:#E3F5EC;color:var(--verde)}
.badge.atrasada{background:#FDE7E7;color:var(--vermelho)}
.linha-debito .venc{font-weight:600}
.acoes-debitos{display:flex;gap:16px;margin-top:26px;align-items:center}
.acoes-debitos .btn{flex:0 0 auto;min-width:180px}
.btn-pix{flex:1;justify-content:space-between;padding:13px 22px}
.btn-pix:disabled{opacity:.5;cursor:not-allowed}
.pix-txt{letter-spacing:.5px}
.pix-total{font-weight:800}
.obs-pix{margin-top:12px;font-size:13px;color:var(--cinza)}

.footer{background:var(--verde-esc);color:#fff;margin-top:auto}
.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:36px 20px;text-align:center}
.footer h4{font-size:11.5px;letter-spacing:.6px;opacity:.75;margin-bottom:6px}
.footer .tel{font-size:21px;font-weight:700;color:var(--lima)}
.footer-base{border-top:1px solid rgba(255,255,255,.15)}
.footer-base-in{display:flex;align-items:center;justify-content:space-between;padding:20px;font-size:12.5px;opacity:.85}
.footer-logo img{filter:brightness(0) invert(1)}

/* ---- MODAIS (fundo leve p/ nao trocar a tela de trás) ---- */
.modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto}
.modal-back{position:absolute;inset:0;background:rgba(4,30,24,.28)}
.loading-box{position:relative;background:#fff;border-radius:14px;padding:36px 34px;width:100%;max-width:460px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.3);animation:sobe .25s ease-out;margin:auto}
@keyframes sobe{from{transform:translateY(14px);opacity:0}to{transform:none;opacity:1}}
.loading-logo{margin:0 auto 18px}
.loading-box h3{font-size:19px;color:var(--verde-esc);margin-bottom:6px}
.loading-status{font-size:14px;color:var(--cinza);min-height:22px;margin-bottom:20px}
.barra{height:12px;background:#EAF0EE;border-radius:20px;overflow:hidden}
.barra-fill{height:100%;width:0%;border-radius:20px;transition:width .25s ease-out;background:linear-gradient(90deg,#0F6C58 0%,#2FA84F 55%,#A8E063 100%);background-size:200% 100%;animation:brilho 1.6s linear infinite}
@keyframes brilho{from{background-position:0 0}to{background-position:200% 0}}
.loading-rodape{display:flex;justify-content:space-between;font-size:12.5px;color:var(--verde);font-weight:700;margin-top:10px}
.loading-fila{color:var(--cinza);font-weight:500}
.loading-hint{font-size:12.5px;color:var(--cinza);margin-top:16px}

.pix-box{position:relative;background:#fff;border-radius:14px;padding:30px;width:100%;max-width:430px;box-shadow:0 20px 60px rgba(0,0,0,.3);animation:sobe .25s ease-out;margin:auto}
.pix-fechar{position:absolute;top:12px;right:16px;font-size:26px;color:var(--cinza);line-height:1}
.pix-topo{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.pix-badge{background:#E3F5EC;color:var(--verde);font-weight:800;font-size:12px;padding:4px 12px;border-radius:20px}
.pix-label{font-size:13px;color:var(--cinza)}
.pix-valor{font-size:34px;font-weight:800;color:var(--verde-esc)}
.pix-sub{font-size:13px;color:var(--cinza);margin-bottom:16px}
.pix-qr{display:flex;justify-content:center;padding:12px;background:#fff;border:1px solid var(--cinza-claro);border-radius:10px}
.pix-qr img{width:210px;height:210px}
.pix-instr{font-size:12.5px;color:var(--cinza);margin:14px 0 10px}
.pix-copia{display:flex;gap:8px}
.pix-copia input{flex:1;border:1px solid var(--cinza-claro);border-radius:8px;padding:10px;font-size:12px;color:#374151;outline:0;min-width:0}
.pix-ok{color:var(--verde);font-size:13px;font-weight:600;min-height:18px;margin-top:10px;text-align:center}

@media(max-width:1000px){
  .lista-servicos ul{grid-template-columns:repeat(3,1fr)}
  .mega-grid{grid-template-columns:repeat(2,1fr)}
  .mega-destaque{border-left:0;padding-left:0}
  .artigos-grid{grid-template-columns:repeat(2,1fr)}
  .tabela-cab{display:none}
  .linha-debito{grid-template-columns:34px 1fr;gap:6px 12px}
  .linha-debito .col{grid-column:2}
}
@media(max-width:760px){
  .topbar-nav span{display:none}
  .btn-menu{display:inline-flex}
  .busca{display:none}
  .header-in{min-height:66px;gap:10px}
  .lista-servicos ul{grid-template-columns:repeat(2,1fr)}
  .artigos-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
  .resumo-unidade{grid-template-columns:1fr}
  .acoes-debitos{flex-direction:column-reverse}
  .acoes-debitos .btn{width:100%}
  .hero-slide{min-height:auto;padding:24px}
  .hero-box p{font-size:17px}
  .titulo-pagina{font-size:22px}
}
@media(max-width:460px){.lista-servicos ul{grid-template-columns:1fr}}
