/* ============================================================
   WIZARD — uma pergunta por tela, sobre vídeo.
   Compartilhado pelos dois modelos.
   ============================================================ */

.wz{
  position:fixed; inset:0; z-index:var(--z-content);
  display:flex; flex-direction:column;
  opacity:0; pointer-events:none;
  transition:opacity .75s var(--ease);
}
.wz.on{opacity:1; pointer-events:auto}

/* Barra de progresso: fina, no topo, sem números */
.wz-prog{
  position:absolute; top:0; left:0; right:0; height:2px;
  background:rgba(246,243,233,.14); z-index:2;
}
.wz-prog i{
  display:block; height:100%; width:0; background:var(--grama);
  transition:width .7s var(--ease);
}

.wz-topo{
  display:flex; align-items:center; justify-content:space-between;
  padding:clamp(1.1rem,3.5vw,1.7rem) clamp(1.1rem,5vw,2.6rem);
  gap:1rem; flex:none;
}
.wz-logo{width:104px; height:auto; opacity:.94}
.wz-voltar{
  background:none; border:0; cursor:pointer; padding:.6rem;
  color:var(--on-dark-faint); font-family:inherit; font-size:.82rem; font-weight:600;
  display:inline-flex; align-items:center; gap:.4rem;
  transition:color .3s var(--ease); min-height:44px;
}
.wz-voltar:hover{color:var(--on-dark)}
.wz-voltar[hidden]{visibility:hidden; display:inline-flex}

/* Palco das perguntas */
.wz-palco{
  flex:1; display:flex; align-items:center;
  padding:0 clamp(1.1rem,5vw,2.6rem) clamp(2rem,8vh,4rem);
  position:relative; min-height:0;
}
/* Véu sob o texto: o vídeo do almoço é claro e engoliria a tipografia.
   Densidade concentrada onde o conteúdo vive, o resto do quadro respira. */
.wz-palco::before{
  content:''; position:absolute; inset:-25% -10% -10% -10%;
  pointer-events:none; z-index:0;
  background:radial-gradient(120% 78% at 12% 72%,
    rgba(16,20,11,.90) 0%, rgba(16,20,11,.76) 34%,
    rgba(16,20,11,.46) 62%, transparent 84%);
}

.wz-passo{
  z-index:1;
  position:absolute; left:clamp(1.1rem,5vw,2.6rem); right:clamp(1.1rem,5vw,2.6rem);
  display:flex; flex-direction:column; gap:1.5rem;
  max-width:620px;
  opacity:0; transform:translateY(22px);
  transition:opacity .6s var(--ease), transform .6s var(--ease);
  pointer-events:none;
}
.wz-passo.on{opacity:1; transform:none; pointer-events:auto; position:relative}

.wz-perg{
  font-family:'Vogun',Georgia,serif; font-weight:500; color:var(--on-dark);
  font-size:clamp(1.85rem,6.2vw,3rem); line-height:1.05; letter-spacing:-.022em;
}
.wz-sub{
  color:var(--on-dark-soft); font-size:clamp(.95rem,2.4vw,1.05rem);
  line-height:1.6; max-width:40ch;
}

/* Contador de pessoas */
.wz-pessoas{display:flex; flex-wrap:wrap; gap:.7rem}
.wz-num{
  font-family:'Vogun',Georgia,serif; font-size:1.35rem;
  min-width:64px; height:64px; padding:0 1rem;
  border-radius:4px; cursor:pointer;
  background:rgba(246,243,233,.07);
  border:1.5px solid rgba(246,243,233,.22);
  color:var(--on-dark);
  transition:all .35s var(--ease);
  display:inline-flex; align-items:center; justify-content:center;
  font-variant-numeric:tabular-nums;
}
.wz-num:hover{background:rgba(246,243,233,.14); border-color:rgba(246,243,233,.45)}
.wz-num.sel{background:var(--areia-pale); color:var(--mata-deep); border-color:var(--areia-pale)}
.wz-num:active{transform:scale(.95)}

/* Campo de texto */
.wz-campo{
  font-family:'Vogun',Georgia,serif; font-size:clamp(1.5rem,4.5vw,2.1rem);
  background:transparent; border:0; border-bottom:1.5px solid rgba(246,243,233,.3);
  color:var(--on-dark); padding:.6rem 0; width:100%;
  transition:border-color .4s var(--ease);
}
.wz-campo::placeholder{color:rgba(246,243,233,.28)}
.wz-campo:focus{outline:none; border-bottom-color:var(--grama)}
.wz-campo.miss{border-bottom-color:var(--sunset)}

.wz-campo-sm{
  font-family:'Averta',sans-serif; font-size:1.05rem;
  background:transparent; border:0; border-bottom:1.5px solid rgba(246,243,233,.24);
  color:var(--on-dark); padding:.7rem 0; width:100%; max-width:340px;
}
.wz-campo-sm::placeholder{color:rgba(246,243,233,.3)}
.wz-campo-sm:focus{outline:none; border-bottom-color:var(--grama)}

/* Calendário — dias com evento ganham destaque */
.wz-datas{
  display:flex; flex-direction:column; gap:.5rem;
  max-height:min(46vh,420px); overflow-y:auto; padding-right:.4rem;
  scrollbar-width:thin; scrollbar-color:rgba(246,243,233,.24) transparent;
}
.wz-datas::-webkit-scrollbar{width:4px}
.wz-datas::-webkit-scrollbar-thumb{background:rgba(246,243,233,.24); border-radius:99px}

.wz-data{
  display:flex; align-items:center; gap:1rem; width:100%;
  padding:.95rem 1.1rem; cursor:pointer; text-align:left;
  background:rgba(246,243,233,.05);
  border:1.5px solid rgba(246,243,233,.14);
  border-radius:4px; color:var(--on-dark);
  font-family:inherit; transition:all .3s var(--ease);
  min-height:44px;
}
.wz-data:hover:not(:disabled){background:rgba(246,243,233,.11); border-color:rgba(246,243,233,.3)}
.wz-data.sel{background:var(--areia-pale); color:var(--mata-deep); border-color:var(--areia-pale)}
.wz-data:disabled{opacity:.32; cursor:not-allowed}

/* O dia de evento: borda verde e cardápio visível */
.wz-data.evento{border-color:rgba(142,165,86,.5); background:rgba(142,165,86,.09)}
.wz-data.evento:hover:not(:disabled){background:rgba(142,165,86,.16)}
.wz-data.evento.sel{background:var(--areia-pale); border-color:var(--areia-pale)}

.wz-data-dia{
  font-family:'Vogun',Georgia,serif; font-size:1.5rem; line-height:1;
  min-width:2.1ch; text-align:center; font-variant-numeric:tabular-nums;
}
.wz-data-txt{display:flex; flex-direction:column; gap:.14rem; flex:1; min-width:0}
.wz-data-nome{font-size:.92rem; font-weight:600; text-transform:capitalize}
.wz-data-meta{font-size:.78rem; opacity:.72}
.wz-data.evento .wz-data-cardapio{color:var(--grama-lift); font-weight:600}
.wz-data.sel .wz-data-cardapio{color:var(--mata)}
.wz-data-vagas{
  font-size:.72rem; opacity:.66; white-space:nowrap;
  font-variant-numeric:tabular-nums; text-align:right;
}
.wz-data.sel .wz-data-vagas{opacity:.8}

/* Compromissos — o mecanismo central */
.wz-compromissos{display:flex; flex-direction:column; gap:.15rem}
.wz-chk{
  display:flex; gap:.95rem; align-items:flex-start;
  padding:1rem .2rem; cursor:pointer;
  border-bottom:1px solid rgba(246,243,233,.1);
  transition:opacity .3s var(--ease);
}
.wz-chk:last-child{border-bottom:0}
.wz-chk input{position:absolute; opacity:0; width:0; height:0}
.wz-box{
  flex:none; width:23px; height:23px; margin-top:1px;
  border:1.5px solid rgba(246,243,233,.42); border-radius:3px;
  position:relative; transition:all .35s var(--ease);
}
.wz-box::after{
  content:''; position:absolute; left:7px; top:3px;
  width:6px; height:11px; border:solid var(--mata-deep);
  border-width:0 2px 2px 0; transform:rotate(45deg) scale(0);
  transition:transform .3s var(--ease);
}
.wz-chk input:checked ~ .wz-box{background:var(--grama-lift); border-color:var(--grama-lift)}
.wz-chk input:checked ~ .wz-box::after{transform:rotate(45deg) scale(1)}
.wz-chk input:focus-visible ~ .wz-box{outline:2px solid var(--grama-lift); outline-offset:3px}
.wz-chk-txt{font-size:.94rem; line-height:1.55; color:var(--on-dark-soft)}
.wz-chk input:checked ~ .wz-chk-txt{color:var(--on-dark)}

.wz-acao{display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; padding-top:.4rem}
.wz-aviso{font-size:.82rem; color:var(--sunset); font-weight:600}

/* Transição final: o passe se materializa */
.wz-gerando{
  position:fixed; inset:0; z-index:var(--z-modal);
  background:var(--mata-night);
  display:flex; align-items:center; justify-content:center; flex-direction:column; gap:1.6rem;
  opacity:0; pointer-events:none; transition:opacity .7s var(--ease);
}
.wz-gerando.on{opacity:1; pointer-events:auto}
.wz-gerando p{
  color:var(--on-dark-soft); font-size:.9rem;
  letter-spacing:.16em; text-transform:uppercase; font-weight:600;
}
.wz-pulso{
  width:44px; height:44px; border-radius:50%;
  border:1.5px solid rgba(246,243,233,.2); border-top-color:var(--grama-lift);
  animation:girar 1s linear infinite;
}
@keyframes girar{to{transform:rotate(360deg)}}

@media (max-width:520px){
  .wz-num{min-width:58px; height:58px; font-size:1.2rem}
  .wz-data{padding:.85rem .9rem; gap:.8rem}
  .wz-data-dia{font-size:1.3rem}
  .wz-acao .btn{width:100%}
}

/* Roteiro do dia — antecipação antes do compromisso */
.wz-roteiro{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:0;
  counter-reset:rt;
}
.wz-roteiro li{
  counter-increment:rt;
  display:flex; align-items:baseline; gap:.85rem;
  padding:.62rem 0;
  font-size:.93rem; line-height:1.5; color:var(--on-dark-soft);
  border-bottom:1px solid rgba(246,243,233,.09);
}
.wz-roteiro li:last-child{
  border-bottom:0; color:var(--on-dark); font-weight:600;
}
.wz-roteiro li::before{
  content:counter(rt,decimal-leading-zero);
  flex:none; font-family:'Vogun',Georgia,serif; font-size:.78rem;
  color:var(--grama-lift); font-variant-numeric:tabular-nums;
  min-width:2ch;
}
