/* ============================================================
   KALLTECH · Sistema de Chamados — Design System
   Identidade: ciano #38cdf4 → azul #1e9bdb · navy #0e2233
   Tema claro/escuro · animações · efeitos
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
  /* Marca */
  --cyan: #38cdf4;
  --blue: #1e9bdb;
  --navy: #0e2233;
  --grad: linear-gradient(135deg, #38cdf4 0%, #1e9bdb 100%);
  --grad-suave: linear-gradient(135deg, rgba(56,205,244,.15), rgba(30,155,219,.15));

  --verde: #18b86b;
  --amarelo: #f0a429;
  --vermelho: #ef4565;
  --roxo: #8b5cf6;

  --raio: 16px;
  --raio-sm: 10px;
  --transicao: .25s cubic-bezier(.4,0,.2,1);
}

/* ---- TEMA CLARO (padrão) ---- */
:root, [data-tema="claro"] {
  --bg: #eef3fa;
  --bg-grad-1: rgba(56,205,244,.10);
  --bg-grad-2: rgba(30,155,219,.10);
  --card: #ffffff;
  --card-2: #f7fafd;
  --texto: #0e2233;
  --muted: #5b6b7d;
  --borda: #e3e9f2;
  --header-bg: linear-gradient(120deg, #0e2233, #143b5e);
  --sombra: 0 8px 30px rgba(14,34,51,.08);
  --sombra-hover: 0 16px 44px rgba(30,155,219,.18);
  --glow: 0 0 0 transparent;
}

/* ---- TEMA ESCURO ---- */
[data-tema="escuro"] {
  --bg: #07111c;
  --bg-grad-1: rgba(56,205,244,.10);
  --bg-grad-2: rgba(30,155,219,.08);
  --card: rgba(18,38,54,.72);
  --card-2: rgba(13,27,42,.6);
  --texto: #e9f1f8;
  --muted: #8ca6bd;
  --borda: rgba(86,128,160,.22);
  --header-bg: linear-gradient(120deg, #061019, #0c2a45);
  --sombra: 0 8px 30px rgba(0,0,0,.4);
  --sombra-hover: 0 16px 50px rgba(56,205,244,.22);
  --glow: 0 0 24px rgba(56,205,244,.25);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Inter', system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  letter-spacing: -0.01em;
  background: var(--bg);
  color: var(--texto);
  line-height: 1.55;
  min-height: 100vh;
  overflow-x: hidden;
  transition: background .4s ease, color .4s ease;
}

/* Blobs de fundo animados */
body::before, body::after {
  content: "";
  position: fixed;
  border-radius: 50%;
  filter: blur(90px);
  z-index: 0;
  pointer-events: none;
  animation: flutuar 18s ease-in-out infinite;
}
body::before { width: 480px; height: 480px; background: var(--bg-grad-1); top: -120px; right: -100px; }
body::after  { width: 520px; height: 520px; background: var(--bg-grad-2); bottom: -160px; left: -140px; animation-delay: -9s; }
@keyframes flutuar {
  0%,100% { transform: translate(0,0) scale(1); }
  50% { transform: translate(40px,-30px) scale(1.12); }
}

/* ===== HEADER ===== */
.kt-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--header-bg);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(56,205,244,.18);
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 30px;
  box-shadow: 0 4px 30px rgba(0,0,0,.25);
}
.kt-logo { display: flex; align-items: center; gap: 14px; }
.kt-logo img { height: 38px; width: auto; filter: drop-shadow(0 2px 8px rgba(56,205,244,.4)); }
.kt-logo .divisor { width:1px; height:30px; background: rgba(255,255,255,.2); }
.kt-logo .modulo { color: #cfe9fb; font-size: 13px; font-weight: 500; letter-spacing:.3px; }

.kt-nav { display: flex; align-items: center; gap: 8px; }
.kt-nav a {
  color: #d8e7f3; text-decoration: none;
  padding: 9px 16px; border-radius: var(--raio-sm);
  font-size: 14px; font-weight: 600;
  transition: var(--transicao);
  position: relative;
}
.kt-nav a:hover { color:#fff; background: rgba(56,205,244,.16); }
.kt-nav a.ativo { color:#fff; background: var(--grad); box-shadow: 0 4px 16px rgba(30,155,219,.5); }

/* Botão de tema */
.kt-tema {
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.18);
  color:#fff; cursor:pointer;
  width:40px; height:40px; border-radius:50%;
  font-size:17px; display:grid; place-items:center;
  transition: var(--transicao);
}
.kt-tema:hover { background: rgba(56,205,244,.3); }
/* A rotação só em telas com mouse (desktop). Toque nunca gira. */
@media (hover:hover) and (pointer:fine) {
  .kt-tema:hover { transform: rotate(20deg) scale(1.08); }
}

/* Hambúrguer (só aparece no mobile) */
.kt-hamburger {
  display: none;
  background: rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18);
  color:#fff; cursor:pointer; width:42px; height:42px; border-radius:10px;
  font-size:20px; place-items:center; transition: var(--transicao);
}
.kt-hamburger:hover { background: rgba(56,205,244,.3); }

/* ===== LAYOUT ===== */
.kt-wrap { position: relative; z-index: 1; max-width: 1180px; margin: 34px auto; padding: 0 22px; }
.kt-wrap.estreito { max-width: 760px; }

.titulo-pg { margin-bottom: 26px; animation: surgir .6s ease both; }
.titulo-pg h1 { font-size: 30px; font-weight: 800; letter-spacing:-.5px; }
.titulo-pg h1 .grad { background: var(--grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.titulo-pg p { color: var(--muted); font-size: 15px; margin-top: 4px; }

/* ===== CARD ===== */
.kt-card {
  background: var(--card);
  backdrop-filter: blur(14px);
  border: 1px solid var(--borda);
  border-radius: var(--raio);
  box-shadow: var(--sombra);
  padding: 28px;
  margin-bottom: 22px;
  animation: surgir .6s ease both;
}
.kt-card h2 { font-size: 19px; margin-bottom: 18px; display:flex; align-items:center; gap:10px; }
.kt-card h2 .ic { color: var(--blue); }

@keyframes surgir { from { opacity:0; transform: translateY(18px); } to { opacity:1; transform:none; } }
.atraso-1{animation-delay:.08s}.atraso-2{animation-delay:.16s}.atraso-3{animation-delay:.24s}.atraso-4{animation-delay:.32s}

/* Aviso emergência */
.kt-emergencia {
  display:flex; align-items:center; gap:14px;
  background: var(--grad-suave);
  border: 1px solid rgba(56,205,244,.35);
  border-radius: var(--raio);
  padding: 16px 20px; margin-bottom: 24px;
  font-size: 14.5px;
  animation: surgir .6s ease both;
}
.kt-emergencia .pulso {
  width:42px;height:42px;border-radius:50%; flex:none;
  background: var(--grad); display:grid; place-items:center; font-size:20px;
  box-shadow: 0 0 0 0 rgba(56,205,244,.6); animation: pulsar 2s infinite;
}
@keyframes pulsar { 0%{box-shadow:0 0 0 0 rgba(56,205,244,.5)} 70%{box-shadow:0 0 0 14px rgba(56,205,244,0)} 100%{box-shadow:0 0 0 0 rgba(56,205,244,0)} }
.kt-emergencia b { color: var(--blue); }

/* ===== FORMULÁRIO ===== */
.kt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.kt-campo { margin-bottom: 4px; }
.kt-campo.full { grid-column: 1 / -1; }
label { display:block; font-size:13px; font-weight:700; margin-bottom:7px; letter-spacing:.2px; }
label .obrig { color: var(--vermelho); }
input, select, textarea {
  width:100%; padding:12px 14px;
  border:1.5px solid var(--borda); border-radius: var(--raio-sm);
  font-size:14px; font-family:inherit;
  background: var(--card-2); color: var(--texto);
  transition: var(--transicao);
}
input::placeholder, textarea::placeholder { color: var(--muted); opacity:.7; }
input:focus, select:focus, textarea:focus {
  outline:none; border-color: var(--cyan);
  box-shadow: 0 0 0 4px rgba(56,205,244,.16);
}
textarea { resize: vertical; min-height: 130px; }
.kt-dica { font-size:12px; color: var(--muted); margin-top:6px; }

.kt-dropzone {
  border: 2px dashed var(--borda); border-radius: var(--raio);
  padding: 26px; text-align:center; color: var(--muted);
  cursor:pointer; transition: var(--transicao); background: var(--card-2);
}
.kt-dropzone:hover { border-color: var(--cyan); background: var(--grad-suave); color: var(--texto); transform: translateY(-2px); }
.kt-dropzone .ic { font-size:28px; display:block; margin-bottom:6px; }
.kt-files { list-style:none; margin-top:12px; }
.kt-files li {
  display:flex; justify-content:space-between; align-items:center;
  padding:9px 14px; background: var(--grad-suave); border:1px solid var(--borda);
  border-radius: var(--raio-sm); margin-top:8px; font-size:13px;
  animation: surgir .3s ease both;
}

/* ===== BOTÃO ===== */
.kt-btn {
  position: relative; overflow: hidden;
  background: var(--grad); color:#fff; border:none;
  padding: 14px 32px; border-radius: var(--raio-sm);
  font-size: 15px; font-weight: 700; font-family:inherit;
  cursor:pointer; transition: var(--transicao);
  box-shadow: 0 8px 24px rgba(30,155,219,.35);
}
.kt-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(30,155,219,.5); }
.kt-btn:active { transform: translateY(0); }
.kt-btn::after {
  content:""; position:absolute; top:0; left:-120%;
  width:60%; height:100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.4), transparent);
  transition: left .6s;
}
.kt-btn:hover::after { left: 130%; }
.kt-btn.sec { background: transparent; color: var(--blue); border:1.5px solid var(--blue); box-shadow:none; }
.kt-btn.sec:hover { background: var(--grad-suave); }

/* ===== CONFIRMAÇÃO ===== */
.kt-confirma { text-align:center; padding: 46px 30px; }
.kt-confirma .check {
  width:78px;height:78px;border-radius:50%; margin:0 auto 18px;
  background: var(--grad); color:#fff; display:grid; place-items:center;
  font-size:40px; box-shadow: 0 0 0 0 rgba(24,184,107,.6);
  animation: estourar .5s ease both, pulsarVerde 2.4s .6s infinite;
}
@keyframes estourar { 0%{transform:scale(0);opacity:0} 60%{transform:scale(1.15)} 100%{transform:scale(1);opacity:1} }
@keyframes pulsarVerde { 0%{box-shadow:0 0 0 0 rgba(56,205,244,.5)} 70%{box-shadow:0 0 0 18px rgba(56,205,244,0)} 100%{box-shadow:0 0 0 0 transparent} }
.kt-protocolo {
  font-size: 36px; font-weight: 800; letter-spacing:1px; margin: 12px 0;
  background: var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.kt-prazo-box {
  display:inline-flex; align-items:center; gap:8px;
  background: var(--grad-suave); border:1px solid var(--borda);
  padding:13px 24px; border-radius:var(--raio-sm); margin-top:6px; font-size:14px;
}

/* ===== STATS / KPI ===== */
.kt-stats { display:grid; grid-template-columns: repeat(4,1fr); gap:16px; margin-bottom:24px; }
.kt-stat {
  position: relative; overflow:hidden;
  background: var(--card); backdrop-filter: blur(14px);
  border:1px solid var(--borda); border-radius: var(--raio);
  padding:20px 22px; box-shadow: var(--sombra);
  transition: var(--transicao); animation: surgir .6s ease both;
}
.kt-stat:hover { transform: translateY(-4px); box-shadow: var(--sombra-hover); border-color: rgba(56,205,244,.4); }
.kt-stat .top { display:flex; align-items:center; justify-content:space-between; }
.kt-stat .ic-box {
  width:42px;height:42px;border-radius:12px; display:grid;place-items:center; font-size:20px;
  background: var(--grad-suave); color: var(--blue);
}
.kt-stat .num { font-size:32px; font-weight:800; margin-top:10px; letter-spacing:-1px; }
.kt-stat .rot { font-size:13px; color: var(--muted); font-weight:600; }
.kt-stat.alerta .num { color: var(--vermelho); }
.kt-stat.alerta .ic-box { color: var(--vermelho); background: rgba(239,69,101,.14); }
.kt-stat .barra-mini { height:4px; border-radius:4px; background: var(--borda); margin-top:12px; overflow:hidden; }
.kt-stat .barra-mini span { display:block; height:100%; background: var(--grad); border-radius:4px; animation: crescerBarra 1s ease both; }
@keyframes crescerBarra { from { width:0 !important; } }

/* ===== FILTROS / TABELA ===== */
.kt-filtros { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:18px; }
.kt-filtros input, .kt-filtros select { width:auto; flex:1; min-width:160px; }

.tabela-wrap { background: var(--card); border:1px solid var(--borda); border-radius: var(--raio); overflow:hidden; box-shadow: var(--sombra); animation: surgir .6s .1s ease both; }
table { width:100%; border-collapse:collapse; }
th, td { padding:14px 16px; text-align:left; font-size:13.5px; border-bottom:1px solid var(--borda); }
th { background: var(--card-2); color: var(--muted); font-weight:700; font-size:11.5px; text-transform:uppercase; letter-spacing:.6px; }
tbody tr { transition: background .2s; }
tbody tr:hover td { background: var(--grad-suave); }
tbody tr:last-child td { border-bottom:none; }
td .proto { font-weight:800; color: var(--blue); }
td small { color: var(--muted); }

.tag { display:inline-block; padding:4px 12px; border-radius:30px; font-size:12px; font-weight:700; }
.tag.critico { background: rgba(239,69,101,.16); color:#ef4565; }
.tag.alto { background: rgba(240,164,41,.16); color:#d98613; }
.tag.medio { background: rgba(56,205,244,.16); color:#1192c9; }
.tag.baixo { background: rgba(24,184,107,.16); color:#13985a; }

.status { display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:600; }
.status::before { content:""; width:9px;height:9px;border-radius:50%; box-shadow:0 0 8px currentColor; }
.status.aberto { color:#3b9bf5; } .status.aberto::before { background:#3b9bf5; }
.status.atendimento { color:#8b5cf6; } .status.atendimento::before { background:#8b5cf6; }
.status.aguardando { color:#f0a429; } .status.aguardando::before { background:#f0a429; }
.status.resolvido { color:#18b86b; } .status.resolvido::before { background:#18b86b; }

.sla { font-weight:700; font-size:13px; display:inline-flex; align-items:center; gap:5px; }
.sla.ok { color: var(--verde); } .sla.alerta { color: var(--amarelo); } .sla.vencido { color: var(--vermelho); }

.kt-vazio { text-align:center; padding:54px; color: var(--muted); }

/* ===== DASHBOARD ===== */
.dash-grid { display:grid; grid-template-columns: 1.4fr 1fr; gap:20px; }
.dash-grid.tres { grid-template-columns: repeat(3,1fr); }

/* Barras horizontais */
.barra-cat { margin-bottom:16px; }
.barra-cat .lin { display:flex; justify-content:space-between; font-size:13px; font-weight:600; margin-bottom:6px; }
.barra-cat .lin span:last-child { color: var(--muted); }
.barra-cat .trilho { height:10px; background: var(--card-2); border:1px solid var(--borda); border-radius:8px; overflow:hidden; }
.barra-cat .preenche { height:100%; background: var(--grad); border-radius:8px; animation: crescerBarra 1.1s ease both; box-shadow: var(--glow); }

/* Donut */
.donut-wrap { display:flex; align-items:center; gap:26px; flex-wrap:wrap; justify-content:center; }
.donut { --p:0; width:170px; height:170px; border-radius:50%; position:relative; display:grid; place-items:center; }
.donut::before { content:""; position:absolute; inset:18px; background: var(--card); border-radius:50%; }
.donut .centro { position:relative; text-align:center; }
.donut .centro .n { font-size:30px; font-weight:800; }
.donut .centro .l { font-size:11px; color: var(--muted); text-transform:uppercase; letter-spacing:.5px; }
.legenda { list-style:none; font-size:13.5px; }
.legenda li { display:flex; align-items:center; gap:9px; margin-bottom:10px; font-weight:600; }
.legenda .pt { width:12px;height:12px;border-radius:4px; }
.legenda small { color: var(--muted); font-weight:500; margin-left:4px; }

/* Sparkline / colunas */
.colunas { display:flex; align-items:flex-end; gap:10px; height:160px; padding-top:10px; }
.colunas .col { flex:1; display:flex; flex-direction:column; align-items:center; gap:8px; }
.colunas .col .bar { width:100%; max-width:42px; background: var(--grad); border-radius:8px 8px 0 0; animation: subirCol 1s ease both; box-shadow: var(--glow); }
@keyframes subirCol { from { height:0 !important; } }
.colunas .col .lbl { font-size:11px; color: var(--muted); font-weight:600; }
.colunas .col .val { font-size:13px; font-weight:700; }

.gauge-sla { text-align:center; }
.gauge-sla .big { font-size:54px; font-weight:800; background: var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.gauge-sla .sub { color: var(--muted); font-size:13px; }

/* Botão de ação na tabela */
.btn-acao { background: var(--grad-suave); color: var(--blue); border:1px solid var(--borda); border-radius:8px; padding:6px 12px; font-size:12px; font-weight:700; cursor:pointer; transition: var(--transicao); font-family:inherit; }
.btn-acao:hover { background: var(--grad); color:#fff; }

/* Modal */
.kt-modal-bg { position:fixed; inset:0; z-index:100; background: rgba(7,17,28,.6); backdrop-filter: blur(4px); display:none; align-items:center; justify-content:center; padding:20px; animation: surgir .25s ease; }
.kt-modal-bg.aberto { display:flex; }
.kt-modal { background: var(--card); border:1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra-hover); padding:28px; width:100%; max-width:520px; max-height:90vh; overflow:auto; animation: estourarModal .3s ease both; }
@keyframes estourarModal { from{opacity:0; transform:scale(.94) translateY(10px);} to{opacity:1; transform:none;} }
.kt-modal h2 { margin-bottom:6px; }
.kt-modal .proto-grande { font-size:13px; color: var(--muted); margin-bottom:18px; }
.kt-modal .linha-info { font-size:13.5px; margin-bottom:8px; }
.kt-modal .linha-info b { color: var(--muted); font-weight:600; }
.kt-modal .acoes { display:flex; gap:12px; margin-top:22px; }
.kt-modal hr { border:none; border-top:1px solid var(--borda); margin:18px 0; }

/* Galeria de anexos no modal */
.anexos-grid { display:flex; flex-wrap:wrap; gap:10px; margin:8px 0 4px; }
.anexo-item {
  display:flex; flex-direction:column; align-items:center; gap:6px;
  width:96px; padding:8px; border:1px solid var(--borda); border-radius:10px;
  background: var(--card-2); text-decoration:none; color: var(--texto);
  font-size:11px; transition: var(--transicao); overflow:hidden;
}
.anexo-item:hover { border-color: var(--cyan); box-shadow: var(--sombra); transform: translateY(-2px); }
.anexo-item img { width:100%; height:64px; object-fit:cover; border-radius:6px; }
.anexo-item span:last-child { width:100%; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.anexo-item.arquivo { justify-content:center; }
.anexo-item.arquivo .ic { font-size:30px; }

/* ===== Tela de login ===== */
.login-centro {
  position: relative; z-index:1;
  min-height: 100vh; display:flex; align-items:center; justify-content:center;
  padding: 24px;
}
.login-card {
  width:100%; max-width:420px; margin:0; padding:38px 34px;
  text-align:center;
}
.login-marca { margin-bottom:18px; animation: surgir .5s ease both; }
.login-marca img { height:50px; width:auto; }
.login-titulo {
  font-size:22px; font-weight:600; letter-spacing:-.4px;
  margin: 4px 0 30px; position:relative; display:inline-block;
  color: var(--texto);
}
.login-titulo::after {
  content:""; position:absolute; left:50%; bottom:-12px; transform:translateX(-50%);
  width:46px; height:3px; border-radius:3px; background: var(--grad);
}
.login-sub { color: var(--muted); font-size:14px; margin:4px 0 26px; }
.login-card form { text-align:left; }
.login-credito {
  margin-top:26px; padding-top:18px; border-top:1px solid var(--borda);
  color: var(--muted); font-size:12.5px;
  display:flex; align-items:center; justify-content:center; gap:8px;
}
.login-credito img { height:18px; width:auto; vertical-align:middle; }

/* Botão de tema flutuante (telas sem header) */
.kt-tema.flutuante {
  position: fixed; top:20px; right:22px; z-index:60;
  background: var(--card); border:1px solid var(--borda); color: var(--texto);
  box-shadow: var(--sombra);
}
.kt-tema.flutuante:hover { background: var(--grad); color:#fff; }

.kt-footer { position:relative; z-index:1; text-align:center; padding:36px; color: var(--muted); font-size:13px; }

/* ============================================================
   RESPONSIVO
   ============================================================ */

/* Tablet */
@media (max-width:900px){
  .dash-grid,.dash-grid.tres{grid-template-columns:1fr;}
}

/* Celular */
@media (max-width:760px){
  /* Header vira logo + hambúrguer; menu abre por baixo */
  .kt-header{ padding:12px 16px; flex-wrap:wrap; }
  .kt-logo img{ height:32px; }
  .kt-logo .modulo,.kt-logo .divisor{ display:none; }
  .kt-hamburger{ display:grid; }
  .kt-nav{
    display:none; order:3; width:100%; margin-top:12px;
    flex-direction:column; align-items:stretch; gap:6px;
  }
  .kt-nav.aberto{ display:flex; animation: surgir .25s ease; }
  .kt-nav a{ padding:12px 14px; font-size:15px; }
  .kt-nav .kt-tema{ width:100%; border-radius:10px; height:44px; }
  /* No formato de barra, não gira (evita a barra "torta" no toque) */
  .kt-nav .kt-tema:hover,
  .kt-nav .kt-tema:active,
  .kt-nav .kt-tema:focus { transform:none; }

  /* Layout geral */
  .kt-wrap{ margin:22px auto; padding:0 16px; }
  .titulo-pg h1{ font-size:24px; }
  .titulo-pg p{ font-size:14px; }
  .kt-card{ padding:20px 18px; }

  /* Formulário em 1 coluna */
  .kt-grid{ grid-template-columns:1fr; gap:14px; }

  /* KPIs em 2 colunas */
  .kt-stats{ grid-template-columns:1fr 1fr; gap:12px; }
  .kt-stat{ padding:16px; }
  .kt-stat .num{ font-size:26px; }

  /* Filtros empilhados */
  .kt-filtros{ flex-direction:column; }
  .kt-filtros input,.kt-filtros select{ width:100%; min-width:0; }

  /* Tabela com rolagem horizontal (não espreme as colunas) */
  .tabela-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  table{ min-width:720px; }

  /* Modal ocupa melhor a tela */
  .kt-modal{ padding:22px 18px; }
  .kt-modal .acoes{ flex-direction:column; }
  .kt-modal .acoes .kt-btn{ width:100%; }

  /* Dashboard: donut e legenda empilham centralizados */
  .donut-wrap{ flex-direction:column; }

  /* Confirmação de protocolo */
  .kt-protocolo{ font-size:28px; }
  .kt-confirma{ padding:32px 18px; }

  /* Login */
  .login-card{ padding:30px 22px; }
  .login-marca img{ height:44px; }
}

/* Celular pequeno */
@media (max-width:420px){
  .kt-stats{ grid-template-columns:1fr; }
  .titulo-pg h1{ font-size:21px; }
}