:root{
  --azul:#0d2c54;
  --azul-claro:#1d4e89;
  --verde:#2e8b57;
  --vermelho:#c0392b;
  --dourado:#c9a227;
  --cinza:#f4f6f9;
  --texto:#2c3e50;
  --sombra:0 6px 20px rgba(0,0,0,.08);
}
*{margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI',system-ui,sans-serif;}
body{background:var(--cinza);color:var(--texto);line-height:1.6;}
.container{max-width:1100px;margin:0 auto;padding:0 20px;}

/* HEADER */
.site-header{
  position:sticky;top:0;z-index:1000;background:var(--azul);color:#fff;
  box-shadow:var(--sombra);
}
.site-header .nav-wrap{
  max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;
  align-items:center;padding:10px 24px;
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff;}
.brand img{height:46px;width:auto;border-radius:6px;background:#fff;padding:3px;}
.brand span{font-weight:700;font-size:1.1rem;color:var(--dourado);}
.site-header nav{display:flex;gap:6px;flex-wrap:wrap;}
.site-header nav a{
  color:#fff;text-decoration:none;padding:8px 16px;border-radius:6px;
  font-weight:500;transition:.2s;
}
.site-header nav a:hover{background:rgba(255,255,255,.12);}
.site-header nav a.ativo{background:var(--dourado);color:#222;}
.menu-toggle{display:none;background:none;border:none;color:#fff;font-size:1.6rem;cursor:pointer;}

/* HERO */
.hero{
  background:linear-gradient(135deg,var(--azul),var(--azul-claro));
  color:#fff;text-align:center;padding:80px 20px;
}
.hero-content{max-width:700px;margin:0 auto;animation:fadeUp .9s ease;}
.hero h1{font-size:2.6rem;margin-bottom:10px;}
.hero p{font-size:1.15rem;opacity:.9;margin-bottom:28px;}
.hero-saldo{
  background:rgba(255,255,255,.12);display:inline-block;padding:16px 40px;
  border-radius:14px;margin-bottom:28px;border:1px solid rgba(255,255,255,.2);
}
.hero-saldo span{display:block;font-size:.85rem;opacity:.85;}
.hero-saldo strong{font-size:1.9rem;color:var(--dourado);}
.hero-botoes{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* PAGE HEADER */
.page-header{
  background:linear-gradient(135deg,var(--azul),var(--azul-claro));
  color:#fff;text-align:center;padding:50px 20px;
}
.page-header h1{font-size:2.2rem;}
.page-header p{opacity:.9;}

/* BOTÕES */
.btn{
  background:var(--dourado);color:#222;padding:12px 26px;border:none;border-radius:8px;
  text-decoration:none;font-weight:600;cursor:pointer;transition:.25s;display:inline-block;
}
.btn:hover{transform:translateY(-2px);opacity:.92;}
.btn-outline{background:transparent;color:#fff;border:2px solid #fff;}

/* SECTIONS */
.section{padding:55px 0;}
.titulo-sec{text-align:center;font-size:1.8rem;color:var(--azul);margin-bottom:35px;position:relative;}
.titulo-sec::after{
  content:"";display:block;width:60px;height:3px;background:var(--dourado);
  margin:12px auto 0;border-radius:2px;
}
.texto-centro{text-align:center;}

/* CARDS */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px;}
.card{
  background:#fff;border-radius:14px;padding:26px;text-align:center;
  box-shadow:var(--sombra);transition:.25s;border-top:4px solid var(--azul-claro);
}
.card:hover{transform:translateY(-5px);}
.card-icon{font-size:1.9rem;}
.card h3{font-size:.95rem;margin:10px 0;color:#666;}
.card p{font-size:1.4rem;font-weight:bold;}
.card-green{border-top-color:var(--verde);} .card-green p{color:var(--verde);}
.card-red{border-top-color:var(--vermelho);} .card-red p{color:var(--vermelho);}
.card-gold{border-top-color:var(--dourado);} .card-gold p{color:var(--dourado);}
.card-blue{border-top-color:var(--azul-claro);} .card-blue p{color:var(--azul-claro);}
.card-loading{padding:30px;text-align:center;color:#888;width:100%;}

/* GRÁFICOS */
.grafico-box{background:#fff;border-radius:14px;padding:25px;box-shadow:var(--sombra);}
canvas{max-height:400px;}

/* FILTROS */
.filtros{display:flex;gap:12px;justify-content:center;margin:30px 0;flex-wrap:wrap;}
.filtros select{padding:10px 14px;border:1px solid #ccc;border-radius:8px;font-size:.95rem;}

/* TABELAS */
.tabela-wrap{overflow-x:auto;border-radius:12px;box-shadow:var(--sombra);background:#fff;}
table{width:100%;border-collapse:collapse;min-width:520px;}
th{background:var(--azul);color:#fff;padding:14px;text-align:left;font-size:.9rem;}
td{padding:12px 14px;border-bottom:1px solid #eee;font-size:.9rem;}
tbody tr:hover{background:#f0f4fa;}
.tag{padding:3px 10px;border-radius:20px;font-size:.75rem;font-weight:600;color:#fff;}
.tag-miss{background:var(--verde);}
.tag-adm{background:var(--azul-claro);}
.valor-zero{color:#aaa;}

/* SOBRE */
.texto-sobre{max-width:760px;margin:0 auto;}
.texto-sobre p{margin-bottom:20px;font-size:1.05rem;}
.texto-sobre blockquote{
  border-left:4px solid var(--dourado);padding:14px 20px;margin:30px 0;
  font-style:italic;background:#fff;border-radius:6px;box-shadow:var(--sombra);
}

/* FOOTER */
.site-footer{background:var(--azul);color:#fff;text-align:center;padding:50px 20px;margin-top:40px;}
.site-footer img{height:60px;background:#fff;padding:5px;border-radius:8px;margin-bottom:16px;}
.site-footer h3{color:var(--dourado);margin-bottom:12px;}
.site-footer p{margin:5px 0;opacity:.9;font-size:.95rem;}
.site-footer small{display:block;margin-top:22px;opacity:.6;}

/* VOLTAR AO TOPO */
.voltar-topo{
  position:fixed;bottom:25px;right:25px;background:var(--dourado);color:#222;
  width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;text-decoration:none;box-shadow:var(--sombra);opacity:0;pointer-events:none;transition:.3s;
}
.voltar-topo.show{opacity:1;pointer-events:auto;}

@keyframes fadeUp{from{opacity:0;transform:translateY(25px);}to{opacity:1;transform:translateY(0);}}

/* RESPONSIVO */
@media(max-width:760px){
  .menu-toggle{display:block;}
  .site-header nav{
    display:none;position:absolute;top:100%;left:0;width:100%;
    flex-direction:column;background:var(--azul);padding:10px 0;
  }
  .site-header nav.aberto{display:flex;}
  .site-header nav a{border-radius:0;padding:12px 24px;}
  .hero h1{font-size:2rem;}
}
@media print{
  .site-header,.voltar-topo,.filtros,.hero-botoes,.btn{display:none !important;}
  body{background:#fff;}
}

