/* Convite Nexos — lobby à meia-noite com um traço de luz cobalt. */
:root{
  --midnight:oklch(0.085 0 0);
  --cobalt:oklch(0.476 0.207 261.2);
  --electric:oklch(0.72 0.145 238);
  --white:oklch(1 0 0);
  --text:oklch(0.93 0.012 261.2);
  --muted:oklch(0.72 0.022 261.2);
  --linha:oklch(0.42 0.04 261.2/.56);
  --perigo:oklch(0.72 0.16 25);
  --font:"Avenir Next","Century Gothic","Segoe UI",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{background:var(--midnight)}
body{
  margin:0;color:var(--text);font-family:var(--font);min-height:100vh;
  background:radial-gradient(circle at 78% 14%,oklch(0.28 0.115 261.2/.48),transparent 32rem),var(--midnight);
}
[hidden]{display:none!important}

.shell{min-height:100vh;padding:clamp(18px,4vw,54px);display:grid;place-items:center}
.card{
  position:relative;isolation:isolate;width:min(1120px,100%);
  min-height:min(780px,calc(100vh - 48px));overflow:hidden;
  border:1px solid oklch(0.42 0.06 261.2/.45);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(370px,.78fr);
  grid-template-rows:auto 1fr auto;column-gap:clamp(42px,7vw,96px);
  padding:clamp(28px,5vw,72px);
  background:linear-gradient(145deg,oklch(0.13 0.022 261.2/.96),oklch(0.075 0 0/.98));
  box-shadow:0 8px 0 oklch(0.02 0 0/.4);
  animation:chegada .55s cubic-bezier(.16,1,.3,1) both;
}
.card::before{
  content:"";position:absolute;z-index:-1;width:42rem;height:42rem;border-radius:50%;
  right:-28rem;top:-12rem;border:1px solid oklch(0.65 0.14 242/.32);
  box-shadow:0 0 80px oklch(0.48 0.2 261/.16),inset 0 0 80px oklch(0.48 0.2 261/.08);
}

.brand{grid-column:1/-1;display:flex;align-items:center;gap:12px;font-size:.93rem;font-weight:650;letter-spacing:.12em}
.brand small{display:block;color:var(--muted);font-size:.58rem;font-weight:500;letter-spacing:.2em;margin-top:2px}
.brand-mark{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--electric);color:var(--white);font-weight:300;font-size:1.35rem}

.convite{align-self:center;padding:clamp(40px,7vh,90px) 0}
.edition{color:var(--electric);font-size:.7rem;font-weight:700;letter-spacing:.16em;margin:0 0 22px}
h1{font-size:clamp(2.6rem,5.4vw,5.2rem);line-height:.94;letter-spacing:-.035em;font-weight:300;margin:0;text-wrap:balance}
h1 strong{font-weight:650;color:var(--white)}
.lead{font-size:clamp(1rem,1.3vw,1.15rem);line-height:1.65;color:var(--muted);max-width:46ch;margin:26px 0}
.detalhes{display:flex;gap:34px;flex-wrap:wrap;margin:40px 0 0}
.detalhes div{max-width:28ch}
.detalhes dt{text-transform:uppercase;letter-spacing:.14em;font-size:.62rem;color:var(--electric);margin-bottom:7px}
.detalhes dd{margin:0;font-size:.88rem;line-height:1.5}
.aviso-idade{display:flex;align-items:center;gap:10px;margin:34px 0 0;font-size:.74rem;color:var(--muted);letter-spacing:.02em}
.aviso-idade span{
  display:grid;place-items:center;min-width:38px;height:24px;padding:0 8px;
  border:1px solid var(--electric);color:var(--electric);font-size:.64rem;font-weight:700;letter-spacing:.06em;
}

/* Painel de resposta */
.painel{
  align-self:center;background:oklch(0.17 0.03 261.2/.74);
  border-top:2px solid var(--cobalt);padding:clamp(24px,3.4vw,40px);backdrop-filter:blur(16px);
}
.painel.centro{text-align:center}
.painel.centro h1{font-size:clamp(2rem,3.4vw,3.1rem);margin-bottom:8px}
.painel.centro .lead{margin-inline:auto}
.painel.centro .detalhes{justify-content:center;text-align:left}

.passos{display:flex;gap:7px;list-style:none;padding:0;margin:0 0 26px}
.passos li{height:3px;flex:1;background:oklch(0.34 0.03 261.2/.6);transition:background .25s}
.passos li.feito{background:oklch(0.55 0.14 238/.85)}
.passos li.agora{background:var(--electric)}

fieldset{border:0;padding:0;margin:0}
legend{font-size:1.05rem;font-weight:650;margin-bottom:6px;color:var(--white)}
.nota{font-size:.78rem;color:var(--muted);margin:0 0 14px;line-height:1.5}

.opcao{
  display:flex;align-items:center;min-height:64px;margin:9px 0;padding:13px 14px;
  border:1px solid var(--linha);cursor:pointer;transition:border-color .18s,background .18s;
}
.opcao:hover{border-color:var(--electric)}
.opcao:has(input:checked){background:oklch(0.3 0.12 261.2/.42);border-color:var(--electric)}
.opcao:focus-within{outline:3px solid oklch(0.72 0.145 238/.38);outline-offset:2px}
.opcao input{width:19px;height:19px;min-width:19px;margin:0 13px 0 0;accent-color:var(--electric)}
.opcao b{display:block;font-size:.88rem}
.opcao small{display:block;color:var(--muted);font-size:.72rem;margin-top:4px;line-height:1.45}
.opcao.curta{flex:1;min-height:52px;justify-content:center}
.opcao.curta input{margin-right:9px}
.opcao.declaracao{align-items:flex-start;padding:15px 14px}
.opcao.declaracao input{margin-top:2px}
.linha{display:flex;gap:9px}

.campo{display:block;margin:14px 0 0}
.campo>span{display:block;font-size:.75rem;color:var(--muted);margin-bottom:8px}
.campo i{color:var(--electric);font-style:normal}
.campo input{
  width:100%;min-height:50px;padding:12px 13px;color:var(--white);font:inherit;font-size:1rem;
  background:oklch(0.09 0 0/.65);border:1px solid oklch(0.48 0.045 261.2);border-radius:0;
}
.campo input:focus{outline:3px solid oklch(0.72 0.145 238/.38);outline-offset:2px}
.campo input[aria-invalid]{border-color:var(--perigo)}
.campo input::placeholder{color:oklch(0.55 0.02 261.2)}
.dupla{display:grid;grid-template-columns:minmax(90px,.45fr) 1fr;gap:12px}
.campo.estreito{max-width:200px}

.acoes{display:flex;gap:10px;margin-top:26px}
.btn{
  flex:1;min-height:54px;border:1px solid var(--cobalt);padding:14px 18px;
  background:var(--cobalt);color:var(--white);font:700 .82rem/1 var(--font);letter-spacing:.04em;
  cursor:pointer;display:flex;justify-content:center;align-items:center;gap:10px;
}
.btn:hover{filter:brightness(1.15)}
.btn:focus-visible{outline:3px solid oklch(0.72 0.145 238/.5);outline-offset:2px}
.btn:disabled{opacity:.6;cursor:progress}
.btn.fantasma{flex:0 0 auto;min-width:110px;background:transparent;border-color:var(--linha);color:var(--muted)}
.btn.fantasma:hover{border-color:var(--electric);color:var(--text)}
.btn.principal{flex:1}

.privacidade{font-size:.68rem;line-height:1.5;color:var(--muted);margin:16px 0 0}
.rodape-acao{font-size:.76rem;color:var(--muted);margin:24px 0 0}
.rodape-acao a{color:var(--electric)}

.alerta{padding:13px 14px;margin-bottom:20px;background:oklch(0.28 0.045 78/.5);font-size:.82rem;line-height:1.5}
.alerta.erro{background:oklch(0.32 0.11 25/.55)}
.erro-campo{margin:8px 0 0;font-size:.75rem;line-height:1.45;color:oklch(0.82 0.13 25)}

footer{
  grid-column:1/-1;display:flex;justify-content:space-between;gap:20px;
  color:var(--muted);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;
}

@keyframes chegada{from{opacity:.01;transform:translateY(12px)}to{opacity:1;transform:none}}

@media(max-width:860px){
  .shell{padding:0;display:block}
  .card{
    min-height:100vh;border:0;box-shadow:none;
    grid-template-columns:1fr;grid-template-rows:auto auto 1fr auto;padding:24px 20px 30px;
  }
  .card::before{right:-34rem}
  .brand,footer{grid-column:auto}
  .convite{padding:46px 0 30px}
  h1{font-size:clamp(2.4rem,13vw,4.2rem)}
  .lead{font-size:.96rem;margin:20px 0}
  .detalhes{margin-top:28px;gap:20px}
  .aviso-idade{margin-top:26px}
  .painel{margin:0 -4px;padding:24px 18px}
  .acoes{flex-direction:column-reverse}
  .btn.fantasma{width:100%}
  footer{flex-direction:column;margin-top:26px;gap:8px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}