.page{ display:none; }
.page.active{ display:block; }

.wizardNav{
  display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px;
  padding:12px 20px; border:1px solid var(--line); border-radius:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
}
.wizardNav .left{ display:flex; align-items:center; gap:10px; flex:1; }
.wizardNav #backStep{ justify-self:flex-start; }
.wizardNav #nextStep{ justify-self:flex-end; margin-left:auto; }
.wizardNav .progress{ color:var(--muted); font-size:13px; }

.wizardNav{ display:none; }
body.ready .wizardNav{ display:flex; }

/* barra fixa (desktop) */
@media (min-width:901px){
  .wizardNav.panel{
    position:fixed; left:50%; transform:translateX(-50%);
    width:min(1050px, 100vw - 48px);
    bottom:76px; z-index:44; border-radius:14px;
    background:var(--panel) !important;
    box-shadow:0 10px 35px rgba(0,0,0,.24);
  }
  .wrap{ padding-bottom:160px; } /* evita sobrepor conteudo */
}

/* mobile: wizard acima do footer */
@media (max-width:640px){
  .wizardNav{
    position:fixed; left:0; right:0; bottom:60px; margin:0;
    border-radius:0; border-left:0; border-right:0; padding:10px 12px; background:#0b1222; z-index:45;
  }
  .wizardNav .progress{ display:none; }
}

/* Ações principais */

/* Botão da HOME – grande, azul em degradê */
#startBtn{
  display: inline-block;
  background: linear-gradient(180deg, #00a6ff 0%, #0092ff 100%);
  color: #000;                 /* texto preto */
  font-weight: 700;
  font-size: 1.15rem;
  border: none;
  border-radius: 8px;
  padding: 16px 36px;          /* aumenta altura e largura */
  cursor: pointer;
  transition: all .25s ease;
  text-align: center;
  box-shadow: 0 3px 8px rgba(0,0,0,.20);
}
#startBtn:hover{
  background: linear-gradient(180deg, #00b5ff 0%, #00a1ff 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(0,0,0,.25);
}
/* estado desabilitado */
#startBtn[disabled]{
  opacity: .5 !important;
  cursor: not-allowed !important;
  transform: none;
  box-shadow: 0 0 0 rgba(0,0,0,0);
}
/* centraliza na HOME (mantendo seu <div style="text-align:center">) */
#pg_home #startBtn{ margin-top: 30px; }
/* aumenta espaço entre o botão "Iniciar minha avaliação" e a seção "Para iniciar..." */
#pg_home #startBtn {
  margin-bottom: 100px !important; /* ajuste conforme o quanto quiser afastar */
}

/* no mobile, um pouco menos de espaço */
@media (max-width:640px){
  #pg_home #startBtn {
    margin-bottom: 80px !important;
  }
}

/* Botão Próximo (mantém seu estilo atual) */
#nextStep{
  background: var(--title) !important;
  color: #0b1222 !important;
  border: 1px solid rgba(0,0,0,.08);
}
#nextStep:hover{ filter: brightness(1.05); }

/* Botão Voltar (igual ao seu) */
#backStep{ background:transparent; color:var(--ink); border:1px solid var(--line); }
#backStep:hover{ border-color:var(--brand); color:var(--brand); }

/* Mobile: botão da HOME ocupa a largura inteira */
@media (max-width:640px){
  #startBtn{
    width: 100%;
    font-size: 1.1rem;
    padding: 14px 0;
  }
}

/* Resumo da pontuação (tabela) */
#summaryTable th:nth-child(2),
#summaryTable th:nth-child(3),
#summaryTable td:nth-child(2),
#summaryTable td:nth-child(3){ text-align:center !important; }

/* Mobile: esconder col. “Marcadores Ativos” (2) */
@media (max-width:640px){
  #summaryTable th:nth-child(2), #summaryTable td:nth-child(2){ display:none !important; }
  #summaryTable th, #summaryTable td{ font-size:13px; padding:8px 6px; }
}

/* Esconde botão imprimir no mobile */
@media (max-width:900px){ #printBtn{ display:none !important; } }
