/* Layout do site de indicadores. Só tokens Organic/QC; espaçamentos da escala --space-*.
   Alinhamento à esquerda, respiro à direita (direção Organic). */

body{margin:0;background:var(--qc-fundo);color:var(--qc-texto);font-family:var(--font-body);line-height:1.55}
:focus-visible{outline:2px solid var(--qc-foco);outline-offset:2px}
a{color:var(--qc-link)}
code{font-size:.95em}

.pular{position:absolute;left:-9999px}
.pular:focus{left:var(--space-4);top:var(--space-4);background:var(--qc-superficie-alta);padding:var(--space-2) var(--space-4);border-radius:999px;z-index:10}

/* Topo e rodapé: casca comum (static/qc/ui-kit/casca/casca.css) */

/* Conteúdo: no mesmo contêiner de 1200 px da casca, para alinhar com a marca; dentro dele, encosta à esquerda */
.conteudo{max-width:1200px;margin:0 auto;padding:var(--space-6) var(--space-6) var(--space-8)}
.trilha{font-size:14px;color:var(--qc-texto-secundario);margin-bottom:var(--space-4)}
.abertura,.cabecalho-op{max-width:820px;margin-bottom:var(--space-6)}
h1{font-size:clamp(30px,4vw,44px);line-height:1.1;margin:var(--space-2) 0 var(--space-3)}
h2{font-size:26px;line-height:1.2;margin:0 0 var(--space-2)}
h3{font-size:20px;margin:var(--space-6) 0 var(--space-3)}
.sub{font-size:18px;color:var(--qc-texto-secundario);margin:0}
.publico{display:inline-block;margin:0;font-size:13px;font-weight:600;color:var(--qc-identificacao-texto);
  background:var(--qc-identificacao-fundo);padding:var(--space-1) var(--space-3);border-radius:999px}
.fichas{list-style:none;padding:0;margin:var(--space-4) 0 0;display:flex;flex-wrap:wrap;gap:var(--space-2)}
.fichas li{background:var(--qc-superficie-alta);border:1px solid var(--qc-borda);border-radius:999px;padding:var(--space-1) var(--space-4);font-size:14px}
.fichas span{color:var(--qc-texto-secundario);margin-right:var(--space-1)}

/* Segmentos assistenciais (texto sempre presente; a cor só reforça) */
.segmentos{list-style:none;padding:0;margin:var(--space-3) 0 0;display:flex;flex-wrap:wrap;gap:var(--space-2)}
.segmento{font-size:13px;font-weight:700;padding:var(--space-1) var(--space-4);border-radius:999px;border:2px solid}
.segmento-med{color:var(--qc-acao);border-color:var(--qc-acao);background:var(--color-accent-100)}
.segmento-odo{color:var(--qc-identificacao-texto);border-color:var(--qc-identificacao);background:var(--qc-identificacao-fundo)}

/* KPIs */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--space-4);margin:0 0 var(--space-6)}
.kpis-4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.kpi{background:var(--qc-superficie-alta);border:1px solid var(--qc-borda);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-6);box-shadow:var(--shadow-sm)}
.kpi p{margin:0}
.kpi-rotulo{font-size:14px;font-weight:600;color:var(--qc-texto-secundario)}
.kpi-valor{font-family:var(--font-heading);font-size:32px;line-height:1.2;margin:var(--space-1) 0}
.kpi-nota{font-size:13px;color:var(--qc-texto-secundario)}

/* Blocos */
.bloco{background:var(--qc-superficie-alta);border:1px solid var(--qc-borda);border-radius:var(--radius-lg);
  padding:var(--space-6);margin:var(--space-6) 0;box-shadow:var(--shadow-sm)}
.bloco-salvia{background:var(--qc-identificacao-fundo);border-color:var(--color-accent-2-300)}
.bloco-fonte{font-size:13px;color:var(--qc-texto-secundario);margin:0 0 var(--space-4)}
.numeros p{margin:0 0 var(--space-2)}
.nota{font-size:13px;color:var(--qc-texto-secundario)}
.limite{font-size:14px;color:var(--qc-texto-secundario);border-left:4px solid var(--color-accent-2-500);padding-left:var(--space-3);margin:var(--space-4) 0 0}
.sem-dado{font-style:italic;color:var(--qc-texto-secundario)}
.mensagem{margin:var(--space-4) 0}
.bloco .casca-estado{margin:var(--space-4) 0}
.visualmente-oculto{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.mensagem svg{width:20px;height:20px;flex:0 0 auto}

/* Gráficos */
.grafico{width:100%;height:300px;margin:var(--space-2) 0}
.grafico-alto{height:360px}
.graficos-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--space-6)}

/* Tabelas */
.rolagem{overflow-x:auto;border-radius:var(--radius-md);border:1px solid var(--qc-borda)}
table{border-collapse:collapse;width:100%;font-size:14px;background:var(--qc-superficie-alta)}
th,td{padding:var(--space-2) var(--space-3);text-align:left;border-bottom:1px solid var(--qc-divisor);vertical-align:top}
thead th{background:var(--qc-superficie);font-weight:700;position:sticky;top:0}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tbody tr:hover{background:var(--color-neutral-200)}
td a{font-weight:600}
.sub-celula{display:block;font-size:12px;color:var(--qc-texto-secundario)}
details.tabela-detalhe{margin-top:var(--space-4)}
details.tabela-detalhe summary{cursor:pointer;font-weight:600;color:var(--qc-acao);padding:var(--space-2) 0}
details .rolagem{max-height:420px;overflow:auto}

/* Barras simples (carteira) */
.barras-simples{list-style:none;padding:0;margin:0;display:grid;gap:var(--space-2)}
.barras-simples li{display:grid;grid-template-columns:minmax(150px,220px) 1fr 64px;gap:var(--space-3);align-items:center;font-size:14px}
.barra{background:var(--color-neutral-200);border-radius:999px;height:14px;overflow:hidden}
.barra span{display:block;height:100%;background:var(--qc-dados-1);border-right:2px solid var(--qc-dados-borda-1);border-radius:999px}
.barras-simples .valor{text-align:right;font-variant-numeric:tabular-nums}

/* Comparativo operadora x mercado (barra cheia + marca do mercado) */
.comparativo{list-style:none;padding:0;margin:0 0 var(--space-4);display:grid;gap:var(--space-2)}
.comparativo li{display:grid;grid-template-columns:minmax(140px,200px) 1fr 96px;gap:var(--space-3);align-items:center;font-size:14px}
.comparativo .barra{position:relative;overflow:visible}
.comparativo .barra>span{display:block;height:100%;background:var(--qc-dados-1);border-right:2px solid var(--qc-dados-borda-1);border-radius:999px}
.marca-mercado{position:absolute;top:-4px;width:4px;height:22px;margin-left:-2px;background:var(--qc-dados-borda-2);border-radius:999px}
.comparativo .valor{text-align:right;font-variant-numeric:tabular-nums}
.titulo-dim{font-family:var(--font-body);font-weight:700;font-size:15px;margin:var(--space-3) 0 var(--space-2)}
.campo-filtro{margin-bottom:var(--space-3)}
.rolagem-alta{max-height:420px;overflow:auto}
.ficha-grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-2) var(--space-6);margin:0}
.ficha-grade div{border-bottom:1px solid var(--qc-divisor);padding:var(--space-2) 0}
.ficha-grade dt{font-size:13px;color:var(--qc-texto-secundario)}
.ficha-grade dd{margin:0;font-weight:600}

/* Cartões */
.cartoes{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--space-4);margin-bottom:var(--space-4)}
.cartoes-largos{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.cartao{display:block;text-decoration:none;color:var(--qc-texto);background:var(--qc-fundo);border:1px solid var(--qc-borda);
  border-radius:var(--radius-lg);padding:var(--space-4) var(--space-6);box-shadow:var(--shadow-sm)}
.cartao:hover{border-color:var(--qc-acao);box-shadow:var(--shadow-md)}
.cartao-titulo{font-weight:700;margin:0;color:var(--qc-acao)}
.cartao-sub{font-size:13px;color:var(--qc-texto-secundario);margin:var(--space-1) 0 var(--space-3)}
.cartao dl{display:flex;gap:var(--space-4);margin:0}
.cartao dt{font-size:12px;color:var(--qc-texto-secundario)}
.cartao dd{margin:0;font-weight:700;font-variant-numeric:tabular-nums}

/* Busca e filtros */
.busca{margin-top:var(--space-6)}
.rotulo-campo,.campo label{display:block;font-weight:600;font-size:14px;margin-bottom:var(--space-1)}
.busca-linha{display:flex;gap:var(--space-2);flex-wrap:wrap}
input[type=search],select{font:inherit;color:var(--qc-texto);background:var(--qc-superficie-alta);border:1px solid var(--qc-borda-essencial);
  border-radius:999px;padding:var(--space-2) var(--space-4);min-width:220px}
.busca-linha input{flex:1 1 280px;max-width:520px}
.filtros{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:flex-end}
.definicoes dt{font-weight:700;margin-top:var(--space-4)}
.definicoes dd{margin:var(--space-1) 0 0}
.bloco-fontes ul{margin:0 0 var(--space-3);padding-left:var(--space-6)}

@media (max-width:640px){
  .conteudo{padding-left:var(--space-4);padding-right:var(--space-4)}
  .bloco{padding:var(--space-4)}
  .kpi-valor{font-size:26px}
  .barras-simples li{grid-template-columns:1fr 56px}
  .barras-simples .barra{grid-column:1 / -1;grid-row:2}
  .comparativo li{grid-template-columns:1fr 96px}
  .comparativo .barra{grid-column:1 / -1;grid-row:2}
  input[type=search],select{min-width:0;width:100%}
  .campo{width:100%}
}
