/* ============================================================
   Tema FEAL — paleta azul da Rodada de Negócios
   21/09/2026: a apresentação institucional usa preto+dourado,
   mas o produto que estamos vendendo (Rodada de Negócios) é
   azul (navy -> royal blue), igual ao app real. Este arquivo
   sobrescreve só as variáveis/estilos usados nesta página —
   não mexe em apresentacao/assets/css/style.css, então as
   outras apresentações (institucional, onboarding etc.)
   continuam com preto+dourado normalmente.
   Cores copiadas de rodada-de-negocios/assets/css/estilo.css:
   --marca-azul-900:#0B1E4D  --marca-azul-800:#12296B
   --marca-azul-700:#1D4ED8  --marca-azul-500:#2563EB
   --marca-azul-300:#93C5FD
   ============================================================ */

:root {
  --i9-preto: #0B1E4D;          /* era #0a0a0a — fundo escuro principal */
  --i9-preto-suave: #12296B;    /* era #17140f — fundo escuro secundário */
  --i9-dourado: #1D4ED8;        /* era #c49b4a — cor de destaque principal */
  --i9-dourado-claro: #93C5FD;  /* era #e0bb6e — destaque claro sobre fundo escuro */
  --i9-dourado-escuro: #12296B; /* era #8c6d30 — texto/ícone sobre fundo claro */
  --i9-creme: #eef4ff;          /* era #f7f2e7 — fundo claro (mesmo tom da caixa-explicativa do app) */
  --i9-borda: #d7e5fb;          /* era #eee2c8 — bordas em fundo claro */
}

/* Divisores e trilhos escuros que usavam tons quentes fixos (não são variáveis) */
.i9-topbar { border-bottom-color: #0e2258; }
.i9-progress { background: #0e2258; }
.i9-stepper { border-bottom-color: #0e2258; }
.i9-stepper .stepper-scroll::-webkit-scrollbar-thumb { background: #274a9e; }

.step-btn { color: #9db8e8; }
.step-btn .step-dot { border-color: #274a9e; color: #9db8e8; }
.step-btn.active .step-dot { color: #fff; }

/* Capa -- 21/09/2026: título passa a ser branco sólido (não mais gradiente
   azul-sobre-azul) pra ter mais impacto contra o fundo navy; o azul continua
   como cor de destaque, só que agora num trecho específico (.destaque), não
   no título inteiro. Texto de apoio também mais claro, pra ficar legível de
   longe (a apresentação é pra reunião/projeção). */
.step-cover { background: radial-gradient(circle at 20% 20%, #12296B 0%, var(--i9-preto) 60%); }
.step-cover h1 {
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  color: #ffffff;
}
.step-cover h1 .destaque { color: var(--i9-dourado-claro); }
.step-cover .cover-lead { color: #eef4ff; font-size: 1.2rem; }
.step-cover .cover-lead strong { color: #ffffff; }
.step-cover .cover-badges .badge { background: #0e2258; border-color: #1a3fb8; }

/* Ícone de cada passo — sombra era com rgba dourado fixo */
.step-icon-badge { box-shadow: 0 6px 16px rgba(29, 78, 216, .25); }

/* Comparação (motor por trás) */
.i9-compare .cmp-antes { background: #eef1f6; color: #5b6b85; }
.i9-compare .cmp-depois { background: linear-gradient(160deg, #12296B, var(--i9-preto)); }

/* Timeline (antes/durante/depois, cronograma) */
.i9-timeline .tl-desc { color: #5b6b85; }

/* Botão sólido: texto escuro não tem contraste sobre o azul mais saturado */
.btn-i9-dourado { color: #fff; }