/* FITZONE — Padronizacao visual de titulos, menu e microinteracoes.
   Os titulos recebem o verde proposto #78c51b.
   Elementos operacionais preservam suas cores de estado e funcionalidades. */
:root {
  --fitzone-verde-forte: #78c51b;
  --fitzone-verde-brilho: #91f22a;
  --fitzone-transicao-suave: 400ms cubic-bezier(.22,.61,.36,1);
}

/* Titulos principais: o mesmo verde em Inicio, Treinos, Evolucao,
   Metas, Comunidade (Perfis, Feed, Historias), Contato e Ajuda. */
body:not(.tema-claro) main h1 span,
body:not(.tema-claro) main h1 em,
body:not(.tema-claro) .hero h1 span,
body:not(.tema-claro) .pagina-interna h1 em,
body:not(.tema-claro) .hero-social h1 span,
body:not(.tema-claro) .apresentacao h1 span,
body:not(.tema-claro) .ajuda-hero h1 span {
  color: var(--fitzone-verde-forte) !important;
  text-shadow: 0 0 15px rgba(100, 192, 25, .13);
}
/* Em tema claro, verde fechado suficiente para leitura sobre branco. */
body.tema-claro main h1 span,
body.tema-claro main h1 em,
body.tema-claro .hero h1 span,
body.tema-claro .pagina-interna h1 em,
body.tema-claro .hero-social h1 span,
body.tema-claro .apresentacao h1 span,
body.tema-claro .ajuda-hero h1 span {
  color: #39740c !important;
  text-shadow: none;
}

/* Menu: a mesma tipografia em TODAS as paginas.
   Ajusta lacunas para a Ajuda caber sem miniaturizar as letras. */
.topo.fitzone-neon .menu {
  gap: 10px clamp(12px, 1.15vw, 19px);
}
.topo.fitzone-neon .menu a {
  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: 0;
}
@media (max-width: 1180px) {
  .topo.fitzone-neon .menu {
    gap: 10px 16px;
  }
}
@media (max-width: 700px) {
  .topo.fitzone-neon .menu { gap: 10px 13px; }
  .topo.fitzone-neon .menu a { font-size: 12px; }
}

/* Central de Ajuda: um verde de identidade consistente com os titulos. */
.pagina-ajuda .ajuda-kicker,
.pagina-ajuda .ajuda-contador,
.pagina-ajuda .ajuda-card a,
.pagina-ajuda .ajuda-rota strong,
.pagina-ajuda footer a,
.pagina-ajuda .ajuda-observacao strong,
.pagina-ajuda .ajuda-vazio {
  color: var(--fitzone-verde-forte);
}
.pagina-ajuda .ajuda-observacao { border-left-color: var(--fitzone-verde-forte); }
.pagina-ajuda .ajuda-card a:hover,
.pagina-ajuda footer a:hover { color: #b2ff5b; }

/* Brilho suave e progressivo nos cartoes, perguntas e atividades de IHC. */
.pagina-ajuda .ajuda-hero,
.pagina-ajuda .ajuda-card,
.pagina-ajuda .ajuda-passo,
.pagina-ajuda .ajuda-rota > div,
.pagina-ajuda .ajuda-observacao,
.pagina-ajuda > footer {
  transition: border-color var(--fitzone-transicao-suave),
              box-shadow var(--fitzone-transicao-suave),
              background-color var(--fitzone-transicao-suave);
}
.pagina-ajuda .ajuda-hero:hover,
.pagina-ajuda .ajuda-hero:focus-within,
.pagina-ajuda .ajuda-card:hover,
.pagina-ajuda .ajuda-card:focus-within,
.pagina-ajuda .ajuda-passo:hover,
.pagina-ajuda .ajuda-passo:focus-within,
.pagina-ajuda .ajuda-rota > div:hover,
.pagina-ajuda .ajuda-observacao:hover,
.pagina-ajuda > footer:hover,
.pagina-ajuda > footer:focus-within {
  border-color: var(--fitzone-verde-brilho);
  box-shadow: 0 0 0 1px rgba(120,197,27,.18),
              0 0 22px rgba(92,213,27,.22),
              inset 0 0 13px rgba(90,210,24,.045);
}
.pagina-ajuda .ajuda-passo[open] { border-color: var(--fitzone-verde-forte); }
.pagina-ajuda .ajuda-observacao { border:1px solid rgba(120,197,27,.32); border-left:3px solid var(--fitzone-verde-forte); }
.pagina-ajuda > footer {
  max-width:1180px;
  width:calc(100% - 40px);
  margin: 0 auto 22px;
  border:1px solid rgba(120,197,27,.28);
  border-radius:16px;
  background: rgba(8,19,10,.77);
}
.pagina-ajuda .ajuda-acoes .fz-btn {
  transition: border-color var(--fitzone-transicao-suave),
              box-shadow var(--fitzone-transicao-suave),
              background-color var(--fitzone-transicao-suave),
              filter var(--fitzone-transicao-suave);
}
.pagina-ajuda .ajuda-acoes .fz-btn:hover,
.pagina-ajuda .ajuda-acoes .fz-btn:focus-visible {
  border-color: var(--fitzone-verde-brilho);
  box-shadow: 0 0 0 1px rgba(120,197,27,.18),
              0 0 22px rgba(115,226,32,.33);
}
/* Botao verde continua com texto preto para contraste. */
.pagina-ajuda .ajuda-acoes .fz-btn.primario:hover { filter:brightness(1.09); }
.pagina-ajuda .ajuda-pesquisa {
  transition: border-color var(--fitzone-transicao-suave),
              box-shadow var(--fitzone-transicao-suave),
              background-color var(--fitzone-transicao-suave);
}
.pagina-ajuda .ajuda-pesquisa:hover,
.pagina-ajuda .ajuda-pesquisa:focus {
  border-color:var(--fitzone-verde-brilho);
  box-shadow: 0 0 0 1px rgba(120,197,27,.18), 0 0 19px rgba(109,208,27,.21);
}
/* Filtros Todos / Seguindo: destaque ate quando ja selecionados. */
.pagina-feed .filtros .filtro,
.fitzone-feed .filtros .filtro,
.filtros .filtro {
  cursor:pointer;
  transition: border-color var(--fitzone-transicao-suave),
              box-shadow var(--fitzone-transicao-suave),
              background-color var(--fitzone-transicao-suave),
              color var(--fitzone-transicao-suave),
              transform var(--fitzone-transicao-suave);
}
.pagina-feed .filtros .filtro:hover,
.pagina-feed .filtros .filtro:focus-visible,
.fitzone-feed .filtros .filtro:hover,
.fitzone-feed .filtros .filtro:focus-visible {
  border-color:var(--fitzone-verde-brilho);
  box-shadow:0 0 0 1px rgba(120,197,27,.20),0 0 19px rgba(113,232,28,.36);
  transform: translateY(-1px);
}
/* Respeitar usuarios que pedem menos animacao. */
@media (prefers-reduced-motion:reduce) {
  .pagina-ajuda .ajuda-hero,
  .pagina-ajuda .ajuda-card,
  .pagina-ajuda .ajuda-passo,
  .pagina-ajuda .ajuda-rota > div,
  .pagina-ajuda .ajuda-observacao,
  .pagina-ajuda > footer,
  .pagina-ajuda .ajuda-acoes .fz-btn,
  .pagina-ajuda .ajuda-pesquisa,
  .pagina-feed .filtros .filtro,
  .fitzone-feed .filtros .filtro { transition:none !important; }
}
