/* Pesquisa Zero Kelvin: visual igual ao mock aprovado (fila-code/mock-pesquisa/pesquisa.css). Fontes próprias, sem terceiros. */
@font-face{font-family:"Clash Display";src:url(fonts/ClashDisplay-Medium.otf) format("opentype");font-weight:500;font-display:swap}
@font-face{font-family:"Clash Display";src:url(fonts/ClashDisplay-Semibold.otf) format("opentype");font-weight:600;font-display:swap}
@font-face{font-family:"Clash Display";src:url(fonts/ClashDisplay-Bold.otf) format("opentype");font-weight:700;font-display:swap}
@font-face{font-family:Inter;src:url(fonts/inter-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url(fonts/inter-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url(fonts/inter-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Inter;src:url(fonts/inter-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}

:root{--ink:#000C08;--gray:#606060;--line:#D6D6D6;--borda:#8C8C8C;--orange:#FF7F00;--soft:#F4F4F4;--erro:#B3261E;
  --titulo:"Clash Display",Inter,system-ui,sans-serif;--texto:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--ink);font:400 16px/1.45 var(--texto);min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;overflow-x:hidden}
img{max-width:100%}
h1,h2,h3,p{margin:0}
button,input{font:inherit;color:inherit}
a{color:inherit}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
/* Títulos e o contêiner recebem foco só por código (a cada troca de tela, para o leitor de tela). Não são alvo de teclado: sem contorno visual. Botões, links e campos mantêm o anel acima. */
[data-foco]:focus,[data-foco]:focus-visible,#app:focus,#app:focus-visible{outline:none}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pular-link{position:absolute;left:-999px;top:0;background:#fff;color:var(--ink);padding:12px 16px;z-index:20}
.pular-link:focus{left:8px;top:8px}

/* topo: faixa preta com linha laranja nas telas claras; sem faixa (só o logo) nas escuras */
.top{height:56px;flex:none;background:var(--ink);border-bottom:2px solid var(--orange);display:flex;align-items:center;justify-content:space-between;padding:0 20px;position:relative;z-index:3}
.top a.logo{display:flex;align-items:center;min-height:44px;line-height:0}
.top img{height:17px;width:auto;display:block}
.top .sair{display:none;font-size:13px;color:var(--line);text-decoration:none}
body[data-tema=escuro] .top{background:transparent;border-bottom:0}
#app{flex:1;display:flex;flex-direction:column;outline:none;position:relative;z-index:1}
.carregando{padding:48px 20px;color:var(--gray);text-align:center}
body[data-tema=escuro] .carregando{color:rgba(255,255,255,.7)}

/* fundo escuro com o "0" da marca (decoração) */
.fundo{display:none;position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.fundo img{position:absolute;top:0;right:0;height:92%;width:auto;max-width:none;opacity:.09}
body[data-tema=escuro]{background:var(--ink);color:#fff}
body[data-tema=escuro] .fundo{display:block}

/* ---- peças do mock ---- */
.tag{font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--gray);font-weight:600}
.q{font-family:var(--titulo);font-weight:600;font-size:29px;line-height:1.14;letter-spacing:-.01em}
.help{font-size:15px;color:var(--gray);line-height:1.5}
.opts,.campo-area{display:flex;flex-direction:column;gap:10px}
.opt{min-height:58px;border:1.5px solid var(--borda);border-radius:8px;background:#fff;color:var(--ink);font:500 16px var(--texto);text-align:left;padding:8px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;width:100%}
.opt .dot{width:20px;height:20px;border-radius:50%;border:1.5px solid var(--borda);flex:none}
.opt.multi .dot{border-radius:4px}
.opt[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.opt[aria-pressed=true] .dot{border-color:#fff;background:radial-gradient(circle,#fff 0 4px,transparent 5px)}
.opt.multi[aria-pressed=true] .dot{background:#fff;box-shadow:inset 0 0 0 4px var(--ink)}
.btn{height:56px;width:100%;border:0;border-radius:8px;background:var(--ink);color:#fff;font:600 17px var(--titulo);letter-spacing:.01em;cursor:pointer;display:flex;align-items:center;justify-content:center;text-decoration:none;padding:0 20px;text-align:center}
.btn.alt{background:#fff;color:var(--ink);border:1.5px solid var(--ink)}
.btn:disabled{background:#EAEAEA;color:var(--gray);cursor:not-allowed}
.ghost{height:44px;border:0;background:transparent;color:var(--gray);font:500 15px var(--texto);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:0 8px}
.field{display:flex;flex-direction:column;gap:8px}
.field label,.field .rot{font-size:14px;font-weight:600}
.field label small{font-weight:400;color:var(--gray);margin-left:6px}
.inp{height:64px;border:1.5px solid var(--ink);border-radius:8px;display:flex;align-items:baseline;padding:0 16px;gap:8px;background:#fff}
.inp input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:600 30px var(--titulo);font-variant-numeric:tabular-nums;color:var(--ink);padding:16px 0 0;height:100%}
.inp span{font-size:16px;color:var(--gray)}
.inp:focus-within{outline:3px solid var(--ink);outline-offset:3px}
.inp.sm{height:56px;align-items:center}
.inp.sm input{font:500 17px var(--texto);padding:0}
.inp.suave{border-color:var(--line)}
.inp.suave:focus-within{border-color:var(--ink)}
.inp.invalido{border-color:var(--erro)}
.bonus{border:1.5px solid var(--orange);border-radius:8px;padding:12px 14px;display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.4}
.bonus.neutro{border-color:var(--line)}
.pill{flex:none;background:var(--orange);color:var(--ink);font:700 11px var(--texto);letter-spacing:.08em;text-transform:uppercase;padding:4px 8px;border-radius:4px;margin-top:1px}
.pill.ink{background:var(--ink);color:#fff}
.how{background:var(--soft);border-radius:8px;padding:14px 16px;display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.4}
.how b{font-family:var(--titulo);font-weight:600;font-size:15px}
.how ol{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;color:#2b2f2d}
.chip{align-self:flex-start;border:1.5px solid var(--line);border-radius:100px;padding:5px 12px;font-size:13px;color:var(--gray)}
.chk{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.4;min-height:44px;cursor:pointer}
.chk input{width:22px;height:22px;flex:none;margin:0;accent-color:var(--ink)}
.chk small{display:block;color:var(--gray);font-size:12.5px;margin-top:2px}
.chk.invalido{outline:2px solid var(--erro);outline-offset:4px;border-radius:4px}
.fine{font-size:12.5px;color:var(--gray);line-height:1.45}
.erro-msg{color:var(--erro);font-size:14px}
.erro-msg:empty{display:none}
.caixa-erro{border:1.5px solid var(--erro);border-radius:8px;padding:12px 14px;font-size:14px}
.code{border:2px dashed var(--ink);border-radius:8px;padding:18px;display:flex;flex-direction:column;align-items:center;gap:6px;background:#fff}
.code b{font:700 34px var(--titulo);letter-spacing:.06em;user-select:all;word-break:break-all;text-align:center}
.code span{font-size:13px;color:var(--gray)}
.rules{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.rules div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}
.rules div span:first-child{color:var(--gray)}
.rules div span:last-child{font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
.contador{text-align:center;font-size:13px;color:var(--gray);min-height:19px}
.zap{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:16px}
.zap .fine{text-align:center;font-size:14px}

/* ---- telas de pergunta (claras) ---- */
.q-wrap{flex:1;display:flex;flex-direction:column;width:100%;max-width:560px;margin:0 auto}
.lado{flex:none}
.lado-desk,.bonus-desk,.topo-svg{display:none}
.prog{padding:16px 20px 0}
.prog-row{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--gray);margin-bottom:8px;font-variant-numeric:tabular-nums}
.bar{height:3px;background:var(--line);border-radius:2px;overflow:hidden}
.bar i{display:block;height:3px;background:var(--orange)}
.card{flex:1;display:flex;flex-direction:column;min-height:0}
.body{flex:1;padding:28px 20px 0;display:flex;flex-direction:column;gap:18px;min-height:0}
.body.apertado{gap:16px;padding-top:22px}
.body.contato{gap:14px;padding-top:20px}
.body.contato .q{font-size:27px}
.foot{flex:none;padding:14px 20px 26px;display:flex;flex-direction:column;gap:8px;position:sticky;bottom:0;background:#fff}
.foot .ghosts{display:flex;gap:16px;justify-content:center;align-items:center;flex-wrap:wrap}
.lado-desk .q{font-size:44px;max-width:420px}

/* ---- telas escuras: boas-vindas, cupom, encerrada ---- */
.esc{flex:1;display:flex;flex-direction:column;width:100%;max-width:560px;margin:0 auto;position:relative}
.esc .body{padding-top:28px}
.esc .body.largo{padding-top:48px}
.esc .foot{position:static;background:transparent;margin-top:auto}
body[data-tema=escuro] .tag{color:#A9B0AD}
body[data-tema=escuro] .help{color:rgba(255,255,255,.76)}
body[data-tema=escuro] .fine{color:rgba(255,255,255,.68)}
body[data-tema=escuro] .contador{color:rgba(255,255,255,.68)}
body[data-tema=escuro] .bonus{border-color:var(--orange)}
body[data-tema=escuro] .bonus.neutro{border-color:rgba(255,255,255,.35)}
body[data-tema=escuro] .pill.ink{background:#fff;color:var(--ink)}
body[data-tema=escuro] .chip{border-color:rgba(255,255,255,.4);color:rgba(255,255,255,.85)}
body[data-tema=escuro] .btn{background:#fff;color:var(--ink)}
body[data-tema=escuro] .btn.alt{background:transparent;color:#fff;border:1.5px solid #fff}
body[data-tema=escuro] .ghost{color:rgba(255,255,255,.78)}
body[data-tema=escuro] .code{border-color:#fff;background:rgba(255,255,255,.06)}
body[data-tema=escuro] .code span{color:rgba(255,255,255,.72)}
body[data-tema=escuro] .rules{border-top-color:rgba(255,255,255,.22)}
body[data-tema=escuro] .rules div{border-bottom-color:rgba(255,255,255,.22)}
body[data-tema=escuro] .rules div span:first-child{color:rgba(255,255,255,.72)}
body[data-tema=escuro] .zap{border-top-color:rgba(255,255,255,.22)}
body[data-tema=escuro] .caixa-erro{border-color:#FF9B93}
body[data-tema=escuro] :focus-visible{outline-color:#fff}
.esc .q.g{font-size:34px}
.esc .q.gg{font-size:36px;max-width:320px}

@media (min-width:900px){
  .top{height:64px;padding:0 40px}
  .top img{height:20px}
  body[data-tema=claro] .top .sair{display:block}
  body[data-tela=pergunta]{background:var(--soft)}
  .q-wrap{max-width:1100px;flex-direction:row;flex-wrap:wrap;gap:56px;padding:56px 40px 64px;align-items:flex-start;flex:none}
  .lado{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:20px;position:relative}
  .lado-desk{display:flex;flex-direction:column;gap:20px}
  .bonus-desk{display:flex;max-width:420px}
  .bonus-mob{display:none}
  .topo-svg{display:block;margin-top:8px}
  .prog{padding:0;max-width:420px}
  .card{flex:1 1 440px;min-width:0;max-width:560px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:36px;gap:20px;flex:1 1 440px}
  .body,.body.apertado,.body.contato{padding:0;gap:20px;flex:none}
  .body .q,.body.contato .q{font-size:30px}
  .foot{position:static;padding:4px 0 0;flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px;background:transparent}
  .foot .btn{order:3;flex:1 1 180px;width:auto}
  .foot .ghosts{order:1;flex:0 0 auto;gap:4px}
  .esc{max-width:none;padding:0 max(40px,calc((100vw - 1100px) / 2))}
  .esc .body,.esc .foot{max-width:520px;width:100%}
  .esc .body{padding-top:72px}
  .esc .foot{padding:24px 0 56px;flex-direction:column;align-items:stretch}
  .esc .foot .btn{order:0;flex:none;width:100%}
  .esc .q.gg{font-size:48px;max-width:460px}
  .esc .q.g{font-size:40px}
  .fundo img{height:96%;right:2vw}
}
@media (prefers-reduced-motion:no-preference){.tela-in{animation:entra .18s ease-out}@keyframes entra{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.bar i{transition:width .25s ease}}

/* ---- política e telas de aviso ---- */
.politica{position:relative;z-index:1;width:100%;max-width:640px;margin:0 auto;padding:28px 20px 40px;display:flex;flex-direction:column;gap:14px}
.politica h1{font:700 30px/1.1 var(--titulo)}
.politica h2{font:600 18px var(--titulo);margin:10px 0 0}
.politica p,.politica li{font-size:15px}
.politica ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px}
.politica .rodape-pol{color:var(--gray);font-size:13px;border-top:1px solid var(--line);padding-top:12px;margin-top:8px}
@media (min-width:900px){.politica{padding-top:48px}.politica h1{font-size:38px}}