/* ═══════════════════════════════════════════════════════════════════
   JML QUIZ · visual do quiz, uma pergunta por tela
   Usa os tokens do jml-core.css. Trocou a marca lá, o quiz acompanha.
   ═══════════════════════════════════════════════════════════════════ */

html.jq-aberto,html.jq-aberto body{overflow:hidden;}

.jq{
  position:fixed;inset:0;z-index:10000;
  background:var(--bg);color:var(--ink);
  display:flex;flex-direction:column;
  opacity:0;visibility:hidden;transform:scale(.985);
  transition:opacity .45s var(--ease-out-expo),transform .55s var(--ease-out-expo),visibility 0s linear .45s;
}
.jq.on{opacity:1;visibility:visible;transform:none;transition:opacity .45s var(--ease-out-expo),transform .55s var(--ease-out-expo);}

/* ── fundo: grade, brilho e, só na abertura, a foto da oficina ── */
.jq-fundo{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.jq-orb{width:560px;height:560px;top:-260px;right:-200px;opacity:.7;}
.jq-foto{
  position:absolute;inset:0;background-size:cover;background-position:center 35%;
  opacity:0;transform:scale(1.05);
  transition:opacity .9s ease,transform 1.8s var(--ease-out-expo),filter .9s ease;
}
.jq-foto.on{transform:none;}
.jq-foto::after{content:"";position:absolute;inset:0;transition:background .9s ease;}
/* cheia: abertura, capítulo e fim. a foto aparece em cima, o texto fica embaixo */
.jq-foto-cheia .jq-foto.on{opacity:1;}
.jq-foto-cheia .jq-foto::after{
  background:
    linear-gradient(180deg,rgba(10,11,13,.30) 0%,rgba(10,11,13,.18) 22%,rgba(10,11,13,.62) 48%,rgba(10,11,13,.94) 68%,var(--bg) 88%),
    radial-gradient(120% 70% at 50% 0%,transparent 40%,rgba(10,11,13,.5) 100%);}
/* leve: atrás das perguntas, só pra lembrar onde a pessoa está */
.jq-foto-leve .jq-foto.on{opacity:.22;filter:saturate(.55) blur(1px);}
.jq-foto-leve .jq-foto::after{background:linear-gradient(180deg,rgba(10,11,13,.35) 0%,rgba(10,11,13,.86) 40%,var(--bg) 75%);}

/* ── barra de cima ── */
.jq-topo{
  position:relative;z-index:3;flex-shrink:0;
  display:grid;grid-template-columns:44px 1fr 44px;align-items:center;
  padding:calc(10px + env(safe-area-inset-top)) clamp(12px,3vw,28px) 10px;
}
.jq-voltar,.jq-fechar{
  width:44px;height:44px;border:1px solid var(--hair-2);background:rgba(10,11,13,.4);color:var(--n-200);
  font-family:var(--font-body);font-size:19px;line-height:1;cursor:pointer;border-radius:2px;
  transition:border-color .3s ease,color .3s ease,background .3s ease;
}
.jq-fechar{justify-self:end;font-size:23px;grid-column:3;}
/* sem o voltar (primeira pergunta), o contador ia parar na coluna de 44px e cortava */
.jq-voltar{grid-column:1;}
.jq-cont{grid-column:2;}
.jq-cont{justify-self:center;font-size:.55rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;
  color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap;}
.jq-cont b{color:var(--ink);font-weight:700;}
/* barra em trechos, um por parte: dá pra ver quanto falta de cada uma */
.jq-barra{position:absolute;left:clamp(12px,3vw,28px);right:clamp(12px,3vw,28px);bottom:0;height:2px;display:flex;gap:6px;}
.jq-barra span{position:relative;flex:1;background:var(--hair);overflow:hidden;border-radius:1px;}
.jq-barra i{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--brand);
  box-shadow:0 0 14px var(--brand-glow),0 0 4px var(--brand);transition:width .7s var(--ease-out-expo);}
.jq-barra span.feita i{box-shadow:none;opacity:.75;}

/* ── palco ── */
.jq-palco{
  position:relative;z-index:2;flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;
  display:flex;justify-content:center;align-items:flex-start;
  padding:clamp(22px,5vh,56px) clamp(20px,5vw,48px) calc(28px + env(safe-area-inset-bottom));
}
.jq-palco.jq-meio{align-items:center;}
.jq-palco.jq-baixo{align-items:flex-end;}
.jq-palco.jq-baixo .jq-tela{margin:auto 0 0;padding-top:30vh;}
.jq-tela{position:relative;z-index:1;width:100%;max-width:640px;margin:auto 0;
  transition:opacity .3s var(--ease-out-expo),transform .45s var(--ease-out-expo);}
.jq-tela:focus{outline:none;}
.jq-tela.jq-sai{opacity:0;transform:translateY(-16px);}
.jq-tela.jq-entra{opacity:0;transform:translateY(24px);transition:none;}
.jq-tela.jq-centro{text-align:center;}

/* número gigante em Syncopate atrás da pergunta: a assinatura do site.
   fica numa caixa que corta a sobra, senão cria rolagem lateral no celular */
.jq-num-caixa{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;}
.jq-num{
  position:absolute;z-index:0;pointer-events:none;user-select:none;
  top:clamp(4px,3vh,40px);right:clamp(-10px,4vw,8vw);
  font-family:var(--font-display);font-weight:700;line-height:.8;letter-spacing:-.02em;
  font-size:clamp(150px,34vw,360px);
  color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.07);
  transition:opacity .4s ease,transform .7s var(--ease-out-expo);
}
.jq-num.jq-sai{opacity:0;transform:translateY(20px);}

/* ── texto ── */
.jq-tag{display:flex;margin-bottom:18px;}
.jq-centro .jq-tag{justify-content:center;}
.jq-titulo{
  font-family:var(--font-body);font-weight:800;letter-spacing:-.03em;line-height:1.14;
  font-size:clamp(24px,4.2vw,38px);text-wrap:balance;margin-bottom:14px;
  animation:jqTitulo .75s var(--ease-out-expo) both;
}
.jq-titulo em{font-style:normal;color:var(--brand);}
.jq-titulo-grande{font-size:clamp(32px,6.4vw,58px);line-height:1.04;}
.jq-titulo.jq-espera{font-size:clamp(17px,2vw,20px);font-weight:600;color:var(--n-200);letter-spacing:0;animation:none;}
.jq-titulo.jq-chegou{animation:jqTitulo .75s var(--ease-out-expo) both;}
@keyframes jqTitulo{from{clip-path:inset(0 0 100% 0);transform:translateY(14px);}to{clip-path:inset(0 0 -10% 0);transform:none;}}

.jq-ajuda{color:var(--n-200);font-size:clamp(15px,1.5vw,17px);line-height:1.65;margin-bottom:24px;max-width:36em;text-wrap:pretty;
  animation:jqSobe .6s .08s var(--ease-out-expo) both;}
.jq-centro .jq-ajuda{margin-left:auto;margin-right:auto;}
.jq-corpo{margin-top:6px;}
.jq-rodape{margin-top:16px;font-size:12.5px;color:var(--dim);}
.jq-comecar{margin-top:8px;animation:jqSobe .6s .18s var(--ease-out-expo) both;}
@keyframes jqAparece{from{opacity:0;}to{opacity:1;}}
@keyframes jqSobe{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}

/* ── abertura e capítulo ── */
.jq-fatos{display:flex;gap:clamp(20px,5vw,44px);margin:6px 0 30px;flex-wrap:wrap;animation:jqSobe .6s .12s var(--ease-out-expo) both;}
.jq-fatos div{display:flex;flex-direction:column;gap:7px;}
.jq-fatos b{font-family:var(--font-display);font-weight:700;font-size:clamp(18px,2.4vw,24px);letter-spacing:-.01em;}
.jq-fatos span{font-size:.55rem;letter-spacing:.3em;text-transform:uppercase;color:var(--dim);}
.jq-capitulo .jq-tag{margin-bottom:22px;}

/* mapa das partes: cinco paradas numa linha, com o caminho entre elas */
.jq-trilha{list-style:none;margin:6px 0 26px;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  position:relative;animation:jqSobe .6s .14s var(--ease-out-expo) both;}
.jq-trilha::before{content:"";position:absolute;left:10%;right:10%;top:15px;height:1px;background:var(--hair-2);}
.jq-trilha li{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;min-width:0;}
.jq-trilha i{position:relative;z-index:1;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  font-style:normal;font-family:var(--font-display);font-size:10px;font-weight:700;color:var(--n-200);
  background:var(--bg);border:1px solid var(--hair-2);transition:all .4s ease;}
.jq-trilha span{font-size:11.5px;font-weight:600;line-height:1.25;color:var(--dim);max-width:9em;}
.jq-trilha em{font-style:normal;font-size:10.5px;color:var(--n-500,#6B7585);font-variant-numeric:tabular-nums;margin-top:-4px;}
.jq-trilha li.feita i{background:var(--brand);border-color:var(--brand);color:#fff;}
.jq-trilha li.feita span{color:var(--n-200);}
.jq-trilha li.agora i{border-color:var(--brand);color:var(--ink);box-shadow:0 0 0 4px var(--brand-subtle),0 0 22px var(--brand-glow);}
.jq-trilha li.agora span{color:var(--ink);}
.jq-trilha-ok{width:15px;height:15px;stroke-width:2.6;}
.jq-trilha-caixa{margin-top:4px;}
.jq-trilha-caixa .jq-trilha{margin-bottom:14px;}
.jq-faltam{font-size:12.5px;color:var(--dim);margin-bottom:22px;animation:jqSobe .6s .2s var(--ease-out-expo) both;}
.jq-faltam b{color:var(--ink);font-weight:700;}

/* resposta curta da JML ao que a pessoa acabou de escolher */
.jq-eco{display:inline-flex;align-items:center;gap:9px;margin:0 0 18px;padding:8px 14px 8px 10px;border-radius:999px;
  background:var(--brand-subtle);border:1px solid rgba(var(--brand-rgb),.35);color:var(--ink);
  font-size:13.5px;font-weight:600;line-height:1.35;max-width:100%;
  animation:jqEco .7s var(--ease-out-expo) both;}
.jq-eco-ico{flex-shrink:0;width:16px;height:16px;color:var(--brand);stroke-width:2.6;}
@keyframes jqEco{from{opacity:0;transform:translateY(-8px) scale(.97);}to{opacity:1;transform:none;}}

/* link discreto no fim */
.jq-link{display:inline-flex;gap:8px;margin-top:22px;font-size:14px;font-weight:600;color:var(--n-200);text-decoration:none;
  border-bottom:1px solid var(--hair-2);padding-bottom:3px;transition:color .3s ease,border-color .3s ease;}
.jq-link:hover{color:var(--ink);border-color:var(--brand);}
.jq-capitulo .jq-tag::before{content:"";width:28px;height:1px;background:var(--brand);margin-right:12px;align-self:center;}

/* ── opções ── */
.jq-opcoes{display:flex;flex-direction:column;gap:10px;}
.jq-opcao{
  position:relative;display:flex;align-items:center;gap:14px;width:100%;text-align:left;cursor:pointer;
  background:rgba(255,255,255,.035);border:1px solid var(--hair-2);border-radius:var(--radius);
  padding:16px 46px 16px 16px;color:var(--ink);font-family:var(--font-body);
  font-size:clamp(15px,1.6vw,17px);line-height:1.45;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:border-color .25s ease,background .25s ease,transform .25s var(--ease-out-expo),opacity .3s ease;
  animation:jqOpcao .55s calc(.12s + var(--i,0) * .06s) var(--ease-out-expo) both;
  -webkit-tap-highlight-color:transparent;
}
@keyframes jqOpcao{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.jq-opcao:active{transform:scale(.985);}
.jq-opcao:focus{outline:none;}
.jq-opcao:focus-visible{outline:2px solid var(--brand);outline-offset:2px;}
.jq-letra{
  flex-shrink:0;width:30px;height:30px;display:grid;place-items:center;border-radius:2px;
  border:1px solid var(--hair-2);font-size:12px;font-weight:700;color:var(--n-200);
  transition:all .25s ease;
}
.jq-ok-ico{position:absolute;right:16px;top:50%;width:20px;height:20px;margin-top:-10px;
  fill:none;stroke:var(--brand);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:24;stroke-dashoffset:24;transition:stroke-dashoffset .35s .05s ease;}
.jq-opcao.sel{border-color:var(--brand);background:var(--brand-subtle);box-shadow:0 0 0 1px var(--brand),0 10px 30px rgba(var(--brand-rgb),.15);}
.jq-opcao.sel .jq-letra{background:var(--brand);border-color:var(--brand);color:#fff;}
/* opção com ícone: caixa maior, ícone de linha */
.jq-letra-ico{width:38px;height:38px;border-radius:8px;background:rgba(255,255,255,.04);color:var(--n-200);}
.jq-op-ico{width:20px;height:20px;}
.jq-com-ico{padding-top:12px;padding-bottom:12px;}
.jq-opcao.sel .jq-letra-ico{color:#fff;}
.jq-opcao.sel .jq-ok-ico{stroke-dashoffset:0;}
.jq-opcao.apaga{opacity:.32;animation:none;transition:opacity .3s ease;}
.jq-opcao.pisca{animation:jqPisca .42s ease;}
@keyframes jqPisca{0%,100%{transform:none;}35%{transform:scale(1.015);}}
.jq-dica{margin-top:14px;font-size:12px;color:var(--dim);animation:jqSobe .6s .4s var(--ease-out-expo) both;}

/* depois de responder uma prática: a certa ganha o check, a escolhida errada fica marcada */
.jq-opcao:disabled{cursor:default;color:var(--ink);}
.jq-opcoes.travada .jq-opcao:active{transform:none;}
.jq-opcao.certa{border-color:var(--brand);background:var(--brand-subtle);box-shadow:0 0 0 1px var(--brand);opacity:1;}
.jq-opcao.certa .jq-letra{background:var(--brand);border-color:var(--brand);color:#fff;}
.jq-opcao.certa .jq-ok-ico{stroke-dashoffset:0;}
.jq-opcao.errada{border-color:rgba(255,138,128,.75);background:rgba(255,138,128,.07);box-shadow:none;}
.jq-opcao.errada .jq-letra{background:rgba(255,138,128,.85);border-color:transparent;color:#1a0d0b;}
.jq-opcao.errada .jq-ok-ico{display:none;}

/* a lição: como se faz na oficina */
.jq-licao{margin-top:16px;padding:16px 18px 16px 18px;border-radius:var(--radius);
  background:linear-gradient(135deg,rgba(var(--brand-rgb),.14),rgba(var(--brand-rgb),.04));
  border:1px solid rgba(var(--brand-rgb),.35);animation:jqLicao .6s var(--ease-out-expo) both;}
.jq-licao b{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:800;letter-spacing:.02em;color:var(--ink);margin-bottom:6px;}
.jq-licao p{font-size:clamp(14.5px,1.5vw,16px);line-height:1.6;color:var(--n-200);}
.jq-licao-ico{width:18px;height:18px;color:var(--brand);stroke-width:2.4;flex-shrink:0;}
.jq-licao-outra{background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border-color:var(--hair-2);}
.jq-licao.jq-sem-anim{animation:none;}
@keyframes jqLicao{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}

/* várias: duas colunas no computador, e a marca vira caixinha */
.jq-varias{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.jq-varias .jq-sozinha{grid-column:1/-1;}
.jq-marca .jq-letra{border-radius:5px;}
.jq-marca.sel{box-shadow:0 0 0 1px var(--brand);}
.jq-dica-cima{margin:14px 0 0;animation-delay:.3s;}
.jq-n{font-variant-numeric:tabular-nums;}
.jq-ok .jml-btn.jq-mudo{opacity:.45;}

/* hover só em aparelho com mouse: no celular ele gruda depois do toque e a
   opção que fica embaixo do dedo na tela seguinte parece escolhida */
@media(hover:hover){
  .jq-opcao:hover{border-color:rgba(var(--brand-rgb),.55);background:rgba(var(--brand-rgb),.06);}
  .jq-opcao:hover .jq-letra{border-color:var(--brand);color:var(--ink);}
  .jq-voltar:hover,.jq-fechar:hover{border-color:var(--brand);color:var(--ink);background:var(--brand-subtle);}
}

/* ── campos ── */
.jq-input{
  display:block;width:100%;background:transparent;border:0;border-bottom:1px solid var(--hair-2);
  color:var(--ink);font-family:var(--font-body);font-size:clamp(21px,3vw,28px);font-weight:600;letter-spacing:-.01em;
  padding:10px 2px 12px;border-radius:0;transition:border-color .3s ease;line-height:1.25;caret-color:var(--brand);
  /* só opacidade: no iPhone o cursor de digitar fica preso onde o campo estava
     se ele ainda estiver se mexendo (transform) na hora do foco */
  animation:jqAparece .6s .1s ease both;
}
.jq-input::placeholder{color:#465061;font-weight:500;}
.jq-input:focus{outline:none;border-bottom-color:var(--brand);}
.jq-area{min-height:136px;resize:vertical;font-size:clamp(17px,2vw,19px);font-weight:500;line-height:1.55;
  border:1px solid var(--hair-2);border-radius:var(--radius);padding:14px 16px;background:rgba(255,255,255,.025);}
.jq-area:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-subtle);}
.jq-campo{display:block;margin-bottom:24px;}
.jq-rotulo{display:block;font-size:.55rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--dim);margin-bottom:4px;}

/* régua de tamanho da resposta aberta */
.jq-medidor{display:flex;align-items:center;gap:12px;margin-top:12px;}
.jq-medidor i{position:relative;flex:0 0 90px;height:3px;background:var(--hair-2);border-radius:2px;overflow:hidden;}
.jq-medidor u{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--brand);text-decoration:none;
  transition:width .3s var(--ease-out-expo);}
.jq-medidor span{font-size:12px;color:var(--dim);transition:color .3s ease;}
.jq-medidor.ok span{color:var(--brand);}

.jq-ok{display:flex;align-items:center;gap:16px;margin-top:22px;flex-wrap:wrap;animation:jqSobe .6s .16s var(--ease-out-expo) both;}
.jq-atalho{font-size:12px;color:var(--dim);}
.jq-atalho b{color:var(--n-200);font-weight:600;}
.jq-erro{margin-top:14px;font-size:13.5px;color:#FF8A80;}
.jq-treme{animation:jqTreme .35s ease;}
@keyframes jqTreme{20%,60%{transform:translateX(-5px);}40%,80%{transform:translateX(5px);}}

/* ── carregando e fim ── */
.jq-pensando{display:inline-flex;gap:6px;vertical-align:middle;margin-right:8px;}
.jq-pensando i{width:8px;height:8px;border-radius:50%;background:var(--brand);animation:pulseDot 1.1s infinite;}
.jq-pensando i:nth-child(2){animation-delay:.18s;}
.jq-pensando i:nth-child(3){animation-delay:.36s;}
.jq-carrega{margin-bottom:20px;}

.jq-check{
  width:76px;height:76px;margin:0 auto 26px;border-radius:50%;display:grid;place-items:center;
  background:var(--brand);box-shadow:0 0 0 10px var(--brand-subtle),0 0 60px var(--brand-glow);
  animation:jqPop .7s var(--ease-out-expo) both;
}
.jq-check svg{width:34px;height:34px;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:24;stroke-dashoffset:24;animation:jqTraco .5s .35s ease forwards;}
.jq-check.aviso{background:transparent;color:var(--n-200);border:1px solid var(--hair-2);box-shadow:none;font-size:30px;font-weight:800;}
@keyframes jqPop{from{transform:scale(.4);opacity:0;}to{transform:none;opacity:1;}}
@keyframes jqTraco{to{stroke-dashoffset:0;}}

/* ficha com os dados da inscrição */
.jq-ficha{
  margin:4px auto 26px;max-width:380px;text-align:left;
  border:1px solid var(--hair-2);border-radius:var(--radius);background:rgba(255,255,255,.025);
  animation:jqSobe .6s .14s var(--ease-out-expo) both;position:relative;
}
.jq-ficha::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--brand);}
.jq-ficha div{display:flex;justify-content:space-between;gap:16px;padding:12px 16px;border-bottom:1px dashed var(--hair-2);}
.jq-ficha div:last-child{border-bottom:0;}
.jq-ficha span{font-size:.55rem;letter-spacing:.26em;text-transform:uppercase;color:var(--dim);align-self:center;}
.jq-ficha b{font-size:14px;font-weight:700;text-align:right;}

.jq-acao{gap:12px;}
.jq-acao svg{width:18px;height:18px;fill:#fff;flex-shrink:0;}

/* resumo pra pessoa conferir antes de enviar */
.jq-resumo{margin:0 0 26px;max-width:none;}
.jq-resumo div{padding:9px 16px;}
.jq-resumo-tit{padding:12px 16px 4px;font-size:.55rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--brand);}

/* o que acontece depois */
.jq-passos{list-style:none;margin:30px auto 0;max-width:380px;text-align:left;animation:jqSobe .6s .3s var(--ease-out-expo) both;}
.jq-passos li{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--hair);}
.jq-passos i{font-style:normal;font-family:var(--font-display);font-weight:700;font-size:14px;color:var(--n-700);padding-top:2px;}
.jq-passos li.feito i{color:var(--brand);}
.jq-passos span{font-size:13.5px;line-height:1.55;color:var(--dim);}
.jq-passos b{display:block;color:var(--ink);font-weight:700;font-size:14.5px;margin-bottom:2px;}

@media(max-width:767px){
  .jq-palco{padding-top:18px;}
  .jq-palco.jq-cima .jq-tela{margin-top:3vh;}
  .jq-opcao{padding:15px 42px 15px 14px;}
  .jq-varias{grid-template-columns:1fr;gap:8px;}
  .jq-varias .jq-opcao{padding-top:12px;padding-bottom:12px;}
  .jq-cont{letter-spacing:.22em;}
  .jq-num{top:6px;right:-14px;font-size:44vw;}
  .jq-foto{background-position:center 20%;}
  .jq-palco.jq-baixo .jq-tela{padding-top:34vh;}
  .jq-trilha span{font-size:10.5px;}
  .jq-trilha i{width:28px;height:28px;}
  .jq-trilha::before{top:14px;}
  .jq-letra-ico{width:34px;height:34px;}
  .jq-fatos{gap:18px;flex-wrap:nowrap;}
  .jq-fatos b{font-size:15px;white-space:nowrap;}
  .jq-fatos span{font-size:.5rem;letter-spacing:.24em;}
}
@media(prefers-reduced-motion:reduce){
  .jq,.jq-tela,.jq-barra i,.jq-foto,.jq-num{transition:none;}
  .jq-titulo,.jq-ajuda,.jq-opcao,.jq-input,.jq-ok,.jq-dica,.jq-comecar,.jq-fatos,.jq-ficha,.jq-passos,.jq-check,.jq-check svg,.jq-trilha,.jq-eco,.jq-faltam,.jq-licao{animation:none;}
  .jq-foto{transition:none;}
  .jq-check svg,.jq-ok-ico{stroke-dashoffset:0;}
}