@font-face{font-family:Sora;font-weight:400;font-display:swap;src:url(/fonts/sora-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Sora;font-weight:600;font-display:swap;src:url(/fonts/sora-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Sora;font-weight:700;font-display:swap;src:url(/fonts/sora-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:400;font-display:swap;src:url(/fonts/inter-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:500;font-display:swap;src:url(/fonts/inter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:600;font-display:swap;src:url(/fonts/inter-latin-600-normal.woff2) format("woff2")}

:root{
  /* Paleta oficial */
  --laranja:#FF5E00; --preto:#000; --branco:#fff;
  --cinza1:#F4F4F4; --cinza2:#DADADA; --cinza3:#909295;
  /* Derivados */
  --texto:#141414; --texto-2:#5c5d61;
  --laranja-escuro:#C94A00; --laranja-10:rgba(255,94,0,.10); --laranja-20:rgba(255,94,0,.22);
  --raio:18px;
  --sombra:0 30px 80px -30px rgba(0,0,0,.55);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  min-height:100vh; background:var(--preto); color:var(--texto);
  font:400 16px/1.55 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  padding:28px 16px 24px; display:flex; flex-direction:column; align-items:center;
}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* Fundo com o anel da marca */
.bg{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.ring{position:absolute;border-radius:50%;border:clamp(40px,7vw,90px) solid var(--laranja)}
.r1{width:min(70vw,720px);aspect-ratio:1;top:-18%;right:-22%;opacity:.95}
.r2{width:min(46vw,460px);aspect-ratio:1;bottom:-16%;left:-14%;border-color:#1c1c1c}

.card{
  position:relative; z-index:1; width:100%; max-width:680px; background:var(--branco);
  border-radius:28px; box-shadow:var(--sombra); overflow:hidden;
  padding:44px clamp(20px,6vw,56px) 44px;
}
.card-top{position:absolute;left:0;right:0;top:0;height:6px;background:var(--laranja)}

.screen{display:none;animation:in .35s ease}
.screen.active{display:block}
@keyframes in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.brand{display:flex;justify-content:center;margin-bottom:26px}
.brand img{height:auto;width:min(220px,62vw)}

.pill{
  display:flex;width:max-content;margin:0 auto 18px;align-items:center;gap:8px;
  background:var(--cinza1);border:1px solid var(--cinza2);color:var(--preto);
  font:600 14px/1 Sora,sans-serif;padding:11px 18px;border-radius:999px
}
.pill svg{color:var(--laranja);width:18px;height:18px}

h1{font:700 clamp(26px,5.4vw,34px)/1.18 Sora,sans-serif;color:var(--preto);text-align:center;letter-spacing:-.02em}
h1 em{font-style:normal;color:var(--laranja)}
.lead{color:var(--texto-2);text-align:center;margin:14px auto 30px;max-width:52ch;font-size:15.5px}
.center{text-align:center}

/* ---------- Campos ---------- */
.field{margin-bottom:18px}
label{display:block;font:600 15px/1.3 Sora,sans-serif;color:var(--preto);margin-bottom:8px}
.input{
  position:relative;display:flex;align-items:center;gap:12px;
  background:var(--cinza1);border:1.5px solid var(--cinza2);border-radius:14px;
  padding:0 16px;min-height:58px;transition:border-color .15s,box-shadow .15s,background .15s
}
.input > svg:first-child{color:var(--cinza3)}
.input:focus-within{border-color:var(--laranja);background:var(--branco);box-shadow:0 0 0 4px var(--laranja-10)}
.input:focus-within > svg:first-child{color:var(--laranja)}
.input input,.input select{
  flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;font-size:16px;color:var(--texto);
  height:56px;appearance:none;-webkit-appearance:none
}
.input input::placeholder{color:var(--cinza3)}
.input select{cursor:pointer;padding-right:26px;text-overflow:ellipsis}
.input select:invalid,.input select.vazio{color:var(--cinza3)}
.input .chev{position:absolute;right:16px;pointer-events:none;color:var(--preto)}
.field.erro .input{border-color:var(--laranja);box-shadow:0 0 0 4px var(--laranja-10)}
.err{display:block;color:var(--laranja-escuro);font-size:14px;font-weight:500;margin-top:6px;min-height:0}
.err:empty{display:none}
.hint{display:block;color:var(--cinza3);font-size:13px;margin-top:6px}
.hint:empty{display:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* ---------- Orientações ---------- */
.h-orient{font:700 clamp(19px,4vw,22px)/1.3 Sora,sans-serif;text-align:center;margin:34px 0 18px;color:var(--preto)}
.tip{display:flex;gap:16px;border-radius:20px;padding:22px 20px;margin-bottom:14px;border:1px solid}
.tip h3{font:700 17px/1.3 Sora,sans-serif;margin:6px 0 10px}
.tip ul{padding-left:18px}
.tip li{margin:6px 0;font-size:15px}
.tip p{font-size:15px}
.tip-ic{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center}
.tip-ic svg{width:24px;height:24px}
.tip-sim{background:var(--cinza1);border-color:var(--cinza2)}
.tip-sim .tip-ic{background:var(--laranja);color:var(--branco)}
.tip-sim li::marker{color:var(--laranja)}
.tip-nao{background:var(--branco);border-color:var(--cinza2)}
.tip-nao .tip-ic{background:var(--preto);color:var(--branco)}
.tip-nao li{color:var(--texto-2)}
.tip-alerta{background:var(--laranja-10);border-color:var(--laranja-20)}
.tip-alerta .tip-ic{background:var(--branco);color:var(--laranja)}
.tip-alerta h3{color:var(--laranja-escuro);margin-top:2px}
.tip-alerta p{color:var(--texto-2)}

.check{display:flex;gap:12px;align-items:flex-start;font:400 13.5px/1.5 Inter,sans-serif;color:var(--texto-2);margin:22px 0 4px;cursor:pointer}
.check input{flex:none;width:20px;height:20px;margin-top:1px;accent-color:var(--laranja)}

/* ---------- Botões ---------- */
.btn{
  display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  min-height:62px;border:0;border-radius:18px;font:700 18px/1 Sora,sans-serif;cursor:pointer;
  text-decoration:none;transition:transform .12s,box-shadow .2s,background .2s,opacity .2s
}
.btn-primary{margin-top:22px;background:var(--laranja);color:var(--branco);box-shadow:0 14px 30px -14px var(--laranja)}
.btn-primary:hover{background:#ff6d19}
.btn:active{transform:scale(.985)}
.btn:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}
.btn:focus-visible,.opcao:focus-visible,.btn-back:focus-visible{outline:3px solid var(--laranja);outline-offset:3px}

/* ---------- Perguntas ---------- */
.q-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.btn-back{width:44px;height:44px;border-radius:12px;border:1.5px solid var(--cinza2);background:var(--branco);display:grid;place-items:center;cursor:pointer;color:var(--preto)}
.btn-back:hover{border-color:var(--preto)}
.q-count{font:600 14px/1 Sora,sans-serif;color:var(--cinza3);min-width:44px;text-align:right}
.progress{height:6px;background:var(--cinza1);border-radius:999px;overflow:hidden;margin-bottom:30px}
.progress span{display:block;height:100%;width:0;background:var(--laranja);border-radius:inherit;transition:width .35s ease}
.q-wrap{min-height:360px}
.q-wrap.troca{animation:in .3s ease}
.q-bloco{font:600 12.5px/1 Sora,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--laranja)}
.q-bloco-desc{color:var(--cinza3);font-size:14px;margin:8px 0 14px}
.q-texto{font:700 clamp(21px,4.4vw,26px)/1.3 Sora,sans-serif;color:var(--preto);letter-spacing:-.01em}
.q-nota{margin-top:14px;padding:14px 16px;border-radius:14px;background:var(--laranja-10);color:var(--texto-2);font-size:14px;border-left:3px solid var(--laranja)}
.opcoes{display:grid;gap:12px;margin-top:24px}
.opcao{
  display:flex;align-items:center;gap:14px;width:100%;text-align:left;cursor:pointer;
  background:var(--branco);border:1.5px solid var(--cinza2);border-radius:16px;padding:16px 18px;min-height:62px;
  font:500 16px/1.4 Inter,sans-serif;color:var(--texto);transition:border-color .15s,background .15s,box-shadow .15s
}
.opcao:hover{border-color:var(--cinza3)}
.opcao .dot{flex:none;width:22px;height:22px;border-radius:50%;border:2px solid var(--cinza2);display:grid;place-items:center;transition:.15s}
.opcao[aria-checked="true"]{border-color:var(--laranja);background:var(--laranja-10);box-shadow:0 0 0 3px var(--laranja-10)}
.opcao[aria-checked="true"] .dot{border-color:var(--laranja);background:var(--laranja)}
.opcao[aria-checked="true"] .dot::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--branco)}
.opcoes.duas{grid-template-columns:1fr 1fr}
.opcoes.duas .opcao{justify-content:center;font:600 18px/1 Sora,sans-serif;min-height:74px}
.opcoes.duas .dot{display:none}
.form-err{color:var(--laranja-escuro);text-align:center;margin-top:14px;font-weight:500}
.form-err:empty{display:none}

/* ---------- Carregando ---------- */
#tela-carregando{padding:60px 0}
.loader{width:120px;height:120px;margin:0 auto 26px;display:grid;place-items:center;position:relative}
.loader::before{content:"";position:absolute;inset:0;border-radius:50%;border:5px solid var(--cinza1);border-top-color:var(--laranja);animation:gira 1s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
#tela-carregando h2{font:700 22px/1.3 Sora,sans-serif}

/* ---------- Resultado ---------- */
.r-label{text-align:center;font:600 12.5px/1 Sora,sans-serif;text-transform:uppercase;letter-spacing:.14em;color:var(--cinza3);margin-bottom:14px}
.nivel{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:var(--cinza1);padding:6px;border-radius:16px;margin-bottom:26px}
.nivel span{text-align:center;padding:12px 4px;border-radius:11px;font:600 clamp(12.5px,3.2vw,15px)/1.1 Sora,sans-serif;color:var(--cinza3)}
.nivel span.on{background:var(--laranja);color:var(--branco);box-shadow:0 10px 20px -10px var(--laranja)}
.r-emoji{text-align:center;font-size:44px;line-height:1;margin-bottom:12px}
#tela-resultado h1{font-size:clamp(23px,4.8vw,30px)}
.r-texto p{color:var(--texto-2);margin-top:14px;font-size:16px}
.r-texto p:first-child{margin-top:20px}
.cta{margin-top:28px;background:var(--preto);color:var(--branco);border-radius:22px;padding:26px 22px}
.cta p{font:600 18px/1.4 Sora,sans-serif;text-align:center;margin-bottom:18px}
.btn-whats{background:var(--laranja);color:var(--branco);padding:14px 22px;font-size:16.5px;line-height:1.25;text-align:center}
.btn-whats:hover{background:#ff6d19}
.btn-whats .wa{fill:currentColor;stroke:none;width:24px;height:24px}
.r-email{display:flex;gap:12px;align-items:flex-start;margin-top:22px;padding:16px 18px;border-radius:16px;background:var(--cinza1);font-size:14.5px;color:var(--texto-2)}
.r-email svg{color:var(--laranja);margin-top:2px}
.r-email b{color:var(--preto);word-break:break-all}
.protocolo{text-align:center;color:var(--cinza3);font-size:12.5px;margin-top:18px}

.rodape{position:relative;z-index:1;color:var(--cinza3);font-size:12.5px;text-align:center;margin-top:22px;padding:0 10px}

@media (max-width:480px){
  body{padding:14px 10px 18px}
  .card{border-radius:22px;padding-top:36px;padding-bottom:32px}
  .tip{padding:18px 16px;gap:12px}
  .tip-ic{width:40px;height:40px}
  .q-wrap{min-height:0}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
