/* ============================================================
   POLIMENTO FINAL
   ritmo vertical, hierarquia tipográfica e profundidade
   ============================================================ */

/* ===== 1 · RITMO VERTICAL EM ESCALA (não valores soltos) ===== */
:root{
  --e-1:8px; --e-2:12px; --e-3:16px; --e-4:24px;
  --e-5:32px; --e-6:48px; --e-7:64px; --e-8:88px; --e-9:120px;
}
section{padding:var(--e-7) 0}
@media(min-width:768px){section{padding:var(--e-8) 0}}
@media(min-width:1024px){section{padding:var(--e-9) 0}}
.section-head{margin-bottom:var(--e-5)}
@media(min-width:768px){.section-head{margin-bottom:var(--e-6)}}

/* ===== 2 · HIERARQUIA TIPOGRÁFICA (razão 1.25 entre degraus) ===== */
h1{font-size:clamp(2rem,6vw,3.6rem);line-height:1.08;letter-spacing:-.035em;font-weight:800}
h2{font-size:clamp(1.5rem,3.6vw,2.35rem);line-height:1.18;letter-spacing:-.028em;font-weight:800}
h3{font-size:clamp(1rem,2vw,1.22rem);line-height:1.3;letter-spacing:-.015em;font-weight:700}
.section-head p{
  font-size:clamp(.98rem,1.7vw,1.1rem);line-height:1.68;
  color:var(--n-700);max-width:46rem;margin-top:var(--e-3);
}
.eyebrow{
  display:inline-block;font-size:.68rem;font-weight:800;
  letter-spacing:.11em;text-transform:uppercase;margin-bottom:var(--e-2);
}

/* ===== 3 · PROFUNDIDADE EM ESCALA (não sombras aleatórias) ===== */
:root{
  --s0:none;
  --s1:0 1px 2px rgba(16,24,40,.05);
  --s2:0 2px 6px rgba(16,24,40,.06), 0 1px 2px rgba(16,24,40,.04);
  --s3:0 8px 20px rgba(16,24,40,.08), 0 2px 6px rgba(16,24,40,.04);
  --s4:0 20px 40px rgba(16,24,40,.10), 0 6px 12px rgba(16,24,40,.05);
  --s5:0 32px 64px rgba(16,24,40,.14), 0 10px 20px rgba(16,24,40,.06);
}
/* nível 1: cartões em repouso */
.kpi,.mod,.pn,.fc-num > div,.etapa-card,.sintoma,.logo-chip,.pastilha,.fc-linha span{box-shadow:var(--s2)}
/* nível 2: cartões que agrupam conteúdo */
.p-card,.placar-c,.quote,.agente,.col-bloco,.bob-cabeca,.seg-grid{box-shadow:var(--s3)}
/* nível 3: o que flutua sobre o resto */
.tela-pc,.tela-hero,.bob-caixa,.bob-resposta,.fecha-bloco,.dor-pergunta{box-shadow:var(--s4)}
/* elevação ao passar o mouse: sobe UM nível, nunca dois */
.kpi:hover,.mod:hover,.pn:hover,.fc-num > div:hover{box-shadow:var(--s3)}
.p-card:hover,.placar-c:hover{box-shadow:var(--s4)}

/* ===== 4 · TRANSIÇÃO ÚNICA (mesmo ritmo em todo o site) ===== */
.kpi,.mod,.pn,.etapa-card,.placar-c,.quote,.agente,.logo-chip,.pastilha,
.btn,.btn-adesivo,.fc-num > div,.fc-linha span,.p-card{
  transition:transform .28s var(--s-ease),box-shadow .28s var(--s-ease),
             border-color .28s var(--s-ease),background-color .28s var(--s-ease);
}

/* ===== 5 · BORDA CONSISTENTE ===== */
.kpi,.mod,.pn,.p-card,.placar-c,.quote,.agente,.col-bloco,.etapa-card,
.bob-cabeca,.fc-num > div,.fc-linha span,.logo-chip,.pastilha{
  border:1px solid var(--n-200);
}

/* ===== 6 · O QUE ESTAVA APERTADO ===== */
.painel-kpi{gap:var(--e-2)}
@media(min-width:768px){.painel-kpi{gap:var(--e-3)}}
.p-card{padding:var(--e-4) var(--e-4)}
@media(min-width:768px){.p-card{padding:var(--e-5) var(--e-5)}}
.wrap{padding-left:20px;padding-right:20px}
@media(min-width:768px){.wrap{padding-left:32px;padding-right:32px}}

/* ===== 7 · BOTÃO COM PESO DE AÇÃO ===== */
.btn-adesivo.primario,.btn-primary{
  box-shadow:0 4px 14px rgba(42,107,178,.28);
}
.btn-adesivo.primario:hover,.btn-primary:hover{
  box-shadow:0 8px 22px rgba(42,107,178,.36);
  transform:translateY(-1px);
}
.btn-adesivo:active,.btn:active{transform:translateY(0) scale(.985)}

/* ===== 8 · TEXTO LONGO NÃO ESTICA ===== */
p,li{max-width:70ch}
.section-head p{max-width:46rem}

/* ===== 9 · NÚMERO SEMPRE COM LARGURA FIXA (não dança ao contar) ===== */
[data-num],.kpi-num,.pn b,.fc-num b,.rosca-mini-num b,.barra-l i,.funil-e b{
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum";
}

/* pastilha: número e texto na mesma linha de base (o polimento acima
   redefiniu a borda e o line-height voltou a desalinhar) */
.pastilha{
  display:inline-flex;align-items:center;gap:8px;
  white-space:nowrap;flex-wrap:nowrap;line-height:1.45;
}
.pastilha b{
  display:inline-flex;align-items:center;justify-content:center;
  padding:2px 8px;min-width:22px;line-height:1.45;flex-shrink:0;
}