/* MyShapeWay · /interativo10 — quiz EUA
   Tema escuro do herói (13/10) em todas as telas, com contraste suave: texto em branco
   amaciado (nunca #fff puro), superfícies um degrau acima do fundo, bordas discretas.
   Verde = ação (botões), roxo = seleção/progresso, roxo claro = destaque em texto.
   Macros iguais ao anel do herói: proteína roxo, carbo amarelo, gordura laranja. */
:root{
  --bg:#101624; --card:#18203A; --ink:#DFE3EC; --ink2:#A9B1C3; --ink3:#7F889E;
  --line:#2A3452; --soft:#1D2742;
  --brand:#7C3FE5; --brand-d:#5E2BB8; --brand-l:rgba(124,63,229,.16); --brand-t:#B39BF7;
  --green:#51BD89; --yellow:#EBA134; --orange:#F7793E;
  --prot:#7C3FE5; --carb:#EBA134; --fat:#F7793E;
  --ok:#51BD89; --warn:#EBA134; --bad:#F08A7A;
  --r:18px; --sh:0 6px 22px rgba(0,0,0,.22); --sh2:0 10px 30px rgba(0,0,0,.30);
}
*{box-sizing:border-box}
html,body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
body{font-size:16px;line-height:1.45}
button{font:inherit;color:inherit}
input{font:inherit}

/* ---------- topo ---------- */
.q-top{position:sticky;top:0;z-index:5;background:var(--bg);padding:12px 0 8px;display:flex;align-items:center;gap:12px}
.q-logo{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:1.08rem;letter-spacing:-.02em;margin:0 auto}
.q-logo b{color:var(--brand-t)}
.q-back{border:0;background:transparent;width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  color:var(--ink2);font-size:1.3rem;cursor:pointer;flex:0 0 38px}
.q-back:disabled{visibility:hidden}
.q-back:hover{background:var(--soft)}
.q-top-sp{flex:0 0 38px}
.q-prog{position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--line);border-radius:4px;overflow:hidden}
.q-prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--brand),#A27BF0);border-radius:4px;transition:width .4s ease}

/* ---------- tela ---------- */
.q-main{flex:1;display:flex;flex-direction:column;padding:14px 0 28px}
.q-screen{flex:1;display:flex;flex-direction:column;animation:qIn .35s ease both}
@keyframes qIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.q-kicker{font-size:.72rem;font-weight:600;letter-spacing:.14em;color:var(--green);margin:0 0 8px;text-transform:uppercase}
.q-h1{font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(1.75rem,7.4vw,2.2rem);line-height:1.12;letter-spacing:-.025em;margin:0 0 14px;font-weight:800}
.q-h1 span{color:var(--brand-t)}
.q-h2{font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(1.35rem,5.8vw,1.6rem);line-height:1.2;letter-spacing:-.02em;margin:6px 0 8px;font-weight:700}
.q-h2 em{font-style:normal;color:var(--brand-t)}
.q-sub{color:var(--ink2);margin:0 0 18px;font-size:.98rem}
.q-lead{color:var(--ink2);font-size:1.04rem;margin:0 0 22px}
.q-note{font-size:.8rem;color:var(--ink3);margin:10px 0 0;text-align:center}
.q-welcome{justify-content:center;text-align:center;padding-bottom:40px}
.q-welcome .q-lead{max-width:420px;margin-left:auto;margin-right:auto}
.q-proof{display:flex;align-items:center;justify-content:center;gap:8px;font-size:.84rem;color:var(--ink2);margin-top:14px;flex-wrap:wrap}
.q-proof b{color:var(--ink)}
.q-hero-ring{width:150px;height:150px;margin:0 auto 18px}

/* ---------- botões ---------- */
.q-btn{display:block;width:100%;border:0;border-radius:16px;padding:17px 20px;cursor:pointer;
  background:var(--green);color:var(--bg);font-family:'Plus Jakarta Sans',sans-serif;
  font-weight:800;font-size:1.06rem;box-shadow:0 10px 24px rgba(81,189,137,.2);transition:transform .12s ease,opacity .2s}
.q-btn:active{transform:scale(.985)}
.q-btn:disabled{opacity:.35;cursor:default;box-shadow:none}
.q-btn-ghost{background:transparent;color:var(--brand-t);box-shadow:none;border:1.5px solid rgba(124,63,229,.45)}
.q-foot{margin-top:auto;padding-top:18px;position:sticky;bottom:0;background:linear-gradient(180deg,rgba(16,22,36,0),var(--bg) 30%);padding-bottom:6px}
.q-link{background:none;border:0;color:var(--ink3);text-decoration:underline;font-size:.86rem;cursor:pointer;display:block;margin:10px auto 0}

/* ---------- opções ---------- */
.q-opts{display:flex;flex-direction:column;gap:10px}
.q-opt{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:1.5px solid var(--line);background:var(--card);
  border-radius:var(--r);padding:15px 16px;cursor:pointer;box-shadow:var(--sh);transition:border-color .15s,background .15s,transform .1s}
.q-opt:active{transform:scale(.99)}
.q-opt .ic{font-size:1.45rem;width:34px;text-align:center;flex:0 0 34px}
.q-opt .tx{flex:1;min-width:0}
.q-opt .lb{display:block;font-weight:600;font-size:1rem}
.q-opt .ds{display:block;color:var(--ink2);font-size:.86rem;margin-top:2px}
/* check (13/10): desmarcada = círculo vazio, sem ✓; o ✓ só aparece na marcada (simples e múltipla) */
.q-opt .ck{width:22px;height:22px;border-radius:50%;border:1.5px solid #3A4566;flex:0 0 22px;display:flex;align-items:center;justify-content:center;font-size:.8rem;color:transparent}
.q-opt.radio .ck{border-radius:50%}
.q-opt.on{border-color:var(--brand);background:var(--brand-l)}
.q-opt.on .ck{background:var(--brand);border-color:var(--brand);color:#fff}
.q-opt .tag{font-size:.7rem;font-weight:700;color:var(--brand-t);background:var(--brand-l);padding:3px 8px;border-radius:99px;margin-left:6px;vertical-align:middle}
.q-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.q-row2 .q-opt{flex-direction:column;text-align:center;gap:6px;padding:18px 10px}
.q-row2 .q-opt .ck{display:none}
.q-row2 .q-opt .ic{font-size:2rem;width:auto}

.q-chips{display:flex;flex-wrap:wrap;gap:9px}
.q-chip{border:1.5px solid var(--line);background:var(--card);border-radius:99px;padding:10px 15px;cursor:pointer;font-size:.95rem;font-weight:500;box-shadow:var(--sh)}
.q-chip.on{border-color:var(--brand);background:var(--brand);color:#F3EEFF}
.q-chip:disabled{opacity:.4}

.q-seg{display:flex;gap:8px;flex-wrap:wrap}
.q-seg button{flex:1;min-width:56px;border:1.5px solid var(--line);background:var(--card);border-radius:14px;padding:13px 6px;cursor:pointer;font-weight:600;box-shadow:var(--sh)}
.q-seg button.on{border-color:var(--brand);background:var(--brand);color:#F3EEFF}
.q-seg small{display:block;font-weight:500;font-size:.72rem;opacity:.75;margin-top:2px}
.q-lbl{font-size:.82rem;font-weight:600;color:var(--ink2);margin:16px 0 8px;text-transform:uppercase;letter-spacing:.06em}

/* ---------- campos ---------- */
.q-field{display:flex;align-items:center;gap:10px;background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:6px 18px;box-shadow:var(--sh)}
.q-field:focus-within{border-color:var(--brand)}
.q-field input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:1.6rem;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;padding:12px 0;color:var(--ink)}
.q-field input.sm{font-size:1.05rem;font-weight:500;font-family:'Inter',sans-serif}
.q-field .u{color:var(--ink3);font-weight:600}
.q-fields2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.q-fields-col{display:flex;flex-direction:column;gap:10px}
.q-err{color:var(--bad);font-size:.86rem;margin:10px 2px 0;min-height:1.2em}
.q-live{margin:14px 0 0;padding:12px 14px;border-radius:14px;background:var(--brand-l);color:var(--brand-t);font-weight:600;font-size:.94rem}
.q-live.warn{background:rgba(235,161,52,.14);color:#F2C47E}
.q-check{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;color:var(--ink2);margin-top:14px;cursor:pointer}
.q-check input{width:20px;height:20px;accent-color:var(--brand);margin-top:1px;flex:0 0 20px}

/* ---------- cards de educação ---------- */
.q-card{background:var(--card);border-radius:22px;padding:20px;box-shadow:var(--sh2);margin:4px 0 16px}
.q-card p{margin:0}
.q-edu-txt{color:var(--ink2);font-size:1rem;margin:14px 0 0}
.q-legend{display:flex;gap:16px;justify-content:center;font-size:.8rem;color:var(--ink2);margin-top:8px}
.q-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.q-svg{display:block;width:100%;height:auto}
.q-draw{stroke-dasharray:900;stroke-dashoffset:900;animation:qDraw 1.8s ease forwards}
.q-draw.d2{animation-delay:.5s}
@keyframes qDraw{to{stroke-dashoffset:0}}
.q-fade{opacity:0;animation:qFade .5s ease forwards}
@keyframes qFade{to{opacity:1}}

/* resposta personalizada (toast dentro da tela) */
.q-reply{display:flex;gap:12px;align-items:flex-start;background:var(--card);border-radius:18px;padding:16px;box-shadow:var(--sh2);margin:14px 0 0;animation:qIn .35s ease both}
.q-reply .av{width:36px;height:36px;border-radius:50%;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;flex:0 0 36px;font-size:.9rem}
.q-reply p{margin:0;font-size:.96rem}

/* anel de macros */
.q-ring-wrap{display:flex;align-items:center;gap:18px}
.q-ring{width:130px;height:130px;flex:0 0 130px}
.q-ring circle{fill:none;stroke-width:14}
.q-ring .seg{transition:stroke-dasharray 1s ease}
.q-ring text{font-family:'Plus Jakarta Sans',sans-serif}
.q-mac{flex:1;display:flex;flex-direction:column;gap:8px}
.q-mac div{display:flex;justify-content:space-between;align-items:center;font-size:.92rem}
.q-mac i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px}
.q-mac b{font-family:'Plus Jakarta Sans',sans-serif}
.q-mac small{color:var(--ink3);margin-left:4px}

/* demo do doce */
.q-treat{display:flex;flex-direction:column;gap:12px}
.q-treat-item{display:flex;align-items:center;gap:12px;background:rgba(235,161,52,.12);border-radius:16px;padding:14px;opacity:0;animation:qFade .5s .2s forwards}
.q-treat-item .e{font-size:2rem}
.q-treat-item .n{flex:1;font-weight:600}
.q-treat-item .n small{display:block;color:var(--ink2);font-weight:400;font-size:.82rem}
.q-treat-item .k{font-weight:700;color:var(--warn)}
.q-treat-arrow{text-align:center;color:var(--brand);font-weight:600;font-size:.86rem;opacity:0;animation:qFade .4s 1.1s forwards}
.q-treat-din{display:flex;justify-content:space-between;align-items:center;background:var(--brand-l);border-radius:16px;padding:14px 16px;opacity:0;animation:qFade .5s 1.5s forwards}
.q-treat-din b{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.2rem}
.q-treat-din s{color:var(--ink3);margin-right:8px;font-weight:500}
.q-treat-ok{text-align:center;color:var(--ok);font-weight:600;opacity:0;animation:qFade .5s 2.2s forwards}

/* atividades */
.q-act{background:var(--card);border-radius:18px;padding:14px 16px;box-shadow:var(--sh);margin-top:12px;border:1.5px solid var(--line)}
.q-act-h{display:flex;justify-content:space-between;align-items:center;font-weight:700;margin-bottom:8px}
.q-act-h button{border:0;background:none;color:var(--ink3);cursor:pointer;font-size:1.1rem}
.q-act .q-seg button{padding:9px 4px;font-size:.88rem}
.q-act .q-lbl{margin:10px 0 6px;font-size:.72rem}
.q-act-kcal{margin-top:10px;font-weight:700;color:var(--ok);font-size:.95rem}
.q-search{width:100%;border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;margin:12px 0 6px;background:var(--card)}
.q-search:focus{outline:0;border-color:var(--brand)}

/* PAR-Q */
.q-parq{display:flex;flex-direction:column;gap:10px}
.q-parq-q{background:var(--card);border-radius:16px;padding:14px;box-shadow:var(--sh);border:1.5px solid var(--line)}
.q-parq-q p{margin:0 0 10px;font-size:.93rem}
.q-parq-q .q-seg button{padding:10px 4px}

/* ---------- carregamento ---------- */
.q-load{justify-content:center}
.q-load-ring{width:120px;height:120px;margin:10px auto 22px;position:relative}
.q-load-ring svg{transform:rotate(-90deg)}
.q-load-ring b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Plus Jakarta Sans',sans-serif;font-size:1.6rem}
.q-steps{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:12px}
.q-steps li{display:flex;align-items:center;gap:12px;color:var(--ink3);transition:color .3s}
.q-steps li i{width:24px;height:24px;border-radius:50%;border:2px solid var(--line);flex:0 0 24px;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:.75rem;color:var(--bg);transition:all .3s}
.q-steps li.on{color:var(--ink)}
.q-steps li.ok i{background:var(--ok);border-color:var(--ok)}
.q-testi{background:var(--card);border-radius:18px;padding:16px;box-shadow:var(--sh);font-size:.94rem;color:var(--ink2);min-height:92px}
.q-testi b{display:block;color:var(--ink);margin-top:8px;font-size:.85rem}
/* tela de cálculo (13/10): antes/depois e depoimentos em cima, maiores; anel menor */
.q-testi-top{min-height:328px;margin:0 0 12px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center}
.q-testi-top .q-ld-ba{flex-direction:column;gap:6px}
.q-testi-top .q-ld-ba img{width:auto;height:150px;max-width:100%;flex:none;border-radius:14px}
.q-testi-top .q-ld-ba span{align-items:center}
/* depoimento embaixo da foto: menor, mas legível no celular */
.q-ld-q{margin:10px 0 0;font-size:.84rem;line-height:1.4;color:var(--ink2)}
.q-testi .q-ld-q b{display:block;margin-top:4px;font-size:.76rem;font-weight:600;color:var(--ink3)}
.qs-loading .q-load-ring{width:92px;height:92px;margin:2px auto 12px}
.qs-loading .q-load-ring svg{width:92px;height:92px}
.qs-loading .q-load-ring b{font-size:1.3rem}
.qs-loading .q-steps{gap:10px}

/* ---------- resultado ---------- */
.q-res-h{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.5rem;line-height:1.2;letter-spacing:-.02em;margin:4px 0 14px}
.q-res-h span{color:var(--brand-t)}
.q-sec{font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);margin:0 0 10px}
.q-kcal{font-family:'Plus Jakarta Sans',sans-serif;font-size:2.4rem;font-weight:800;letter-spacing:-.03em;line-height:1}
.q-kcal small{font-size:.95rem;font-weight:600;color:var(--ink2);margin-left:6px;letter-spacing:0}
.q-train-day{margin-top:14px;padding:12px 14px;border-radius:14px;background:rgba(81,189,137,.12);color:#9BDDBC;font-size:.92rem}
.q-train-day b{font-family:'Plus Jakarta Sans',sans-serif}
.q-meals{display:flex;flex-direction:column;gap:8px}
.q-meals div{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font-size:.95rem}
.q-meals div:last-child{border-bottom:0}
.q-meals b{font-family:'Plus Jakarta Sans',sans-serif}
.q-week{display:flex;flex-direction:column;gap:8px}
.q-day{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:var(--soft)}
.q-day .n{width:34px;height:34px;border-radius:10px;background:var(--brand);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:.85rem;flex:0 0 34px}
.q-day .t{flex:1;font-weight:600;font-size:.93rem}
.q-day .t small{display:block;color:var(--ink2);font-weight:400;font-size:.8rem}
.q-ex{display:flex;gap:10px;margin:12px 0 4px}
.q-ex div{flex:1;border-radius:14px;overflow:hidden;background:var(--soft);aspect-ratio:1/1;position:relative}
.q-ex img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.q-ex img.b{animation:qSwap 1.6s steps(1) infinite}
@keyframes qSwap{0%{opacity:0}50%{opacity:1}}
.q-pending{padding:12px 14px;border-radius:14px;background:rgba(235,161,52,.14);color:#F2C47E;font-size:.92rem}
.q-plate-say{display:flex;gap:10px;align-items:center;background:var(--soft);border-radius:14px;padding:12px 14px;font-size:.95rem}
.q-plate-say .mic{width:32px;height:32px;border-radius:50%;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;flex:0 0 32px}
.q-plate-say .typ{border-right:2px solid var(--brand);white-space:nowrap;overflow:hidden;animation:qCaret .8s step-end infinite}
@keyframes qCaret{50%{border-color:transparent}}
.q-plate-items{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.q-plate-items li{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);opacity:0;animation:qFade .4s forwards;font-size:.93rem}
.q-plate-items li b{white-space:nowrap}
.q-plate-tot{display:flex;justify-content:space-between;margin-top:10px;font-weight:700;font-size:.95rem;opacity:0;animation:qFade .4s forwards}
.q-glp{margin-top:12px;padding:12px 14px;border-radius:14px;background:var(--brand-l);color:var(--brand-t);font-size:.9rem}

/* ---------- oferta ---------- */
.q-timer{position:sticky;top:58px;z-index:4;display:flex;align-items:center;justify-content:center;gap:8px;text-align:center;
  background:linear-gradient(135deg,#372F27,#352628);color:#F2D3A6;border:1px solid rgba(235,161,52,.32);border-radius:14px;padding:11px 14px;font-size:.92rem;font-weight:600;margin-bottom:14px;box-shadow:var(--sh)}
.q-timer b{font-family:'Plus Jakarta Sans',sans-serif;font-variant-numeric:tabular-nums;font-size:1.05rem}
.q-timer.off{background:var(--soft);color:var(--ink2)}
.q-offer{border:2px solid var(--brand);border-radius:24px;background:var(--card);padding:20px;box-shadow:var(--sh2);position:relative}
.q-offer-badge{position:absolute;top:-12px;left:20px;background:var(--brand);color:#fff;font-size:.72rem;font-weight:700;padding:5px 11px;border-radius:99px;letter-spacing:.04em}
.q-offer h3{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.15rem;margin:6px 0 4px}
.q-price{font-family:'Plus Jakarta Sans',sans-serif;font-size:2.2rem;font-weight:800;letter-spacing:-.03em;margin:8px 0 0}
.q-price small{font-size:1rem;font-weight:600;color:var(--ink2)}
.q-price-sub{color:var(--ink2);font-size:.9rem;margin:2px 0 14px}
.q-incl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.q-incl li{display:flex;gap:10px;font-size:.94rem}
.q-incl li::before{content:'✓';color:var(--ok);font-weight:800;flex:0 0 auto}
.q-incl li.gift::before{content:'🎁'}
.q-incl li.gift{font-weight:600}
.q-after{display:flex;gap:12px;align-items:flex-start;background:rgba(81,189,137,.12);border-radius:16px;padding:14px;margin:14px 0;font-size:.92rem;color:#9BDDBC}
.q-guar{display:flex;gap:12px;align-items:center;background:var(--card);border-radius:16px;padding:14px;box-shadow:var(--sh);margin:14px 0;font-size:.9rem;color:var(--ink2)}
.q-guar .s{font-size:1.8rem}
.q-guar b{color:var(--ink)}
.q-renew{font-size:.8rem;color:var(--ink3);text-align:center;margin:10px 0 0;line-height:1.4}
.q-legal{font-size:.74rem;color:var(--ink3);text-align:center;margin:22px 0 0;line-height:1.5}
.q-legal a{color:var(--ink3)}

/* folha de saída */
.q-sheet-bg{position:fixed;inset:0;background:rgba(4,7,14,.62);z-index:20;display:flex;align-items:flex-end;justify-content:center;animation:qFade .25s forwards}
.q-sheet{background:var(--card);border-top:1px solid var(--line);width:100%;max-width:520px;border-radius:26px 26px 0 0;padding:24px 20px 28px;animation:qUp .35s ease both;text-align:center}
@keyframes qUp{from{transform:translateY(100%)}to{transform:none}}
.q-sheet .big{font-size:2.4rem}
.q-sheet h3{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.35rem;margin:6px 0 8px;letter-spacing:-.02em}
.q-sheet p{color:var(--ink2);margin:0 0 16px}
.q-sheet .q-price{margin:0 0 4px}

@media (min-width:560px){ .q-main{padding-top:24px} }
@media (prefers-reduced-motion:reduce){ *{animation-duration:.01ms!important;animation-delay:0s!important;transition:none!important} .q-draw{stroke-dashoffset:0} .q-fade,.q-treat-item,.q-treat-arrow,.q-treat-din,.q-treat-ok,.q-plate-items li,.q-plate-tot{opacity:1} }

/* ===== v2 (07/10): régua, mensagens, afirmação, prova, cards travados, garantia, carrossel ===== */
.q-center{text-align:center}
.q-ring-big{width:150px;height:150px;margin:0 auto 6px;display:block}
.q-spin{transform-origin:65px 65px;animation:qSpin 6s linear infinite}
@keyframes qSpin{to{transform:rotate(360deg)}}

/* régua (idade, altura, peso) */
/* botão de unidade (13/10): lb|kg e ft|cm, uma escolha pras três telas de medida */
.q-units{display:flex;gap:4px;width:max-content;margin:4px auto 6px;padding:3px;border:1.5px solid var(--line);border-radius:99px;background:var(--card)}
.q-units button{border:0;background:transparent;color:var(--ink2);font:600 .88rem/1 'Inter',system-ui,sans-serif;padding:8px 18px;border-radius:99px;cursor:pointer}
.q-units button.on{background:var(--brand);color:#fff}
.qs-target .q-units{margin:0 0 14px}
.q-rv{text-align:center;margin:18px 0 8px;min-height:64px}
.q-rv b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-size:2.6rem;font-weight:800;letter-spacing:-.03em;line-height:1.1;color:var(--ink)}
.q-rv span{display:block;color:var(--ink3);font-size:.92rem;margin-top:-30px}
.q-rv span[hidden]{display:none}
.q-ruler-wrap{display:flex;align-items:center;gap:8px;margin:6px 0 4px}
.q-ruler-box{position:relative;flex:1;min-width:0;background:var(--card);border-radius:18px;box-shadow:var(--sh);border:1.5px solid var(--line)}
.q-ruler{overflow-x:auto;overflow-y:hidden;height:86px;scrollbar-width:none;-webkit-overflow-scrolling:touch;cursor:grab}
.q-ruler::-webkit-scrollbar{display:none}
.q-ruler-in{position:relative;height:100%}
.q-ruler-in i{position:absolute;bottom:26px;width:2px;height:16px;margin-left:-1px;background:#3A4566;border-radius:2px}
.q-ruler-in i.b{height:30px;background:#5B6789}
.q-ruler-in span{position:absolute;bottom:6px;transform:translateX(-50%);font-size:.74rem;color:var(--ink3);white-space:nowrap}
.q-ruler-mark{position:absolute;left:50%;top:8px;bottom:22px;width:4px;margin-left:-2px;background:var(--brand);border-radius:4px;pointer-events:none;box-shadow:0 0 0 3px rgba(124,63,229,.3)}
.q-step{flex:0 0 46px;height:46px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);font-size:1.4rem;font-weight:600;color:var(--brand-t);cursor:pointer;box-shadow:var(--sh)}
.q-step:active{transform:scale(.95)}

/* tela de mensagem (5 s) */
.q-msg{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px 6px}
.q-msg-av{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-d));color:#fff;display:flex;align-items:center;justify-content:center;
  font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:1.5rem;margin-bottom:22px;box-shadow:0 10px 24px rgba(124,63,229,.28);animation:qPop .5s ease both}
@keyframes qPop{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}
.q-msg-txt{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.35rem;line-height:1.35;font-weight:700;letter-spacing:-.015em;margin:0 0 26px;max-width:420px;animation:qIn .5s .15s ease both}
.q-msg-bar{width:160px;height:5px;border-radius:5px;background:var(--line);overflow:hidden}
.q-msg-bar i{display:block;height:100%;width:0;background:var(--brand);transition:width 5s linear}
/* relate_msg (13/10): até 3 pares "frase marcada + resposta" */
.q-msg-pair{display:block;font-size:.84em;margin:0 0 16px}
.q-msg-pair:last-child{margin-bottom:0}
.q-msg-q{display:block;font-family:'Inter',sans-serif;font-size:.8rem;font-weight:500;letter-spacing:0;color:var(--ink2);margin-bottom:4px}

/* afirmação das comidas */
.q-fits{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 16px}
.q-fit{display:inline-flex;align-items:center;gap:6px;background:var(--card);border:1.5px solid rgba(81,189,137,.35);border-radius:99px;padding:8px 12px;font-size:.92rem;font-weight:500;box-shadow:var(--sh);opacity:0;animation:qPop .4s ease forwards}
.q-fit b{color:var(--ok);font-size:.85rem}

/* prova (antes/depois) */
.q-proofcard{position:relative;border-radius:22px;overflow:hidden;box-shadow:var(--sh2);background:var(--card);margin:6px 0 4px}
.q-proofcard img{display:block;width:100%;height:auto}
.q-proofcap{display:flex;flex-direction:column;gap:2px;padding:14px 16px}
.q-proofcap b{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.25rem;color:var(--ok)}
.q-proofcap span{color:var(--ink2);font-size:.9rem}

/* cards travados no resultado */
.q-locks{display:flex;flex-direction:column;gap:10px}
.q-lock{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:var(--soft)}
.q-lock-ic{font-size:1.4rem;flex:0 0 28px;text-align:center}
.q-lock-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.q-lock-tx>b{font-size:.94rem}
.q-blur{filter:blur(5px);user-select:none;color:var(--ink2);font-size:.92rem;white-space:nowrap;overflow:hidden}
.q-blur b{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.1rem;color:var(--ink)}
.q-fakebar{display:flex;height:10px;border-radius:6px;overflow:hidden;max-width:180px}
.q-fakebar i{display:block;height:100%}
.q-lock-pad{font-size:1.1rem;flex:0 0 auto}

/* garantia grande */
.q-guar-big{position:relative;margin:22px 0 8px;padding:26px 20px 22px;border-radius:24px;text-align:center;
  background:linear-gradient(160deg,rgba(81,189,137,.14),rgba(81,189,137,.05));border:2px solid rgba(81,189,137,.45);box-shadow:var(--sh2)}
.q-guar-seal{width:92px;height:92px;margin:-62px auto 10px;border-radius:50%;background:var(--green);color:var(--bg);
  display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(81,189,137,.25);border:5px solid var(--bg)}
.q-guar-seal span{font-family:'Plus Jakarta Sans',sans-serif;font-size:2.1rem;font-weight:800;line-height:1}
.q-guar-seal small{font-size:.66rem;font-weight:700;letter-spacing:.12em}
.q-guar-big h3{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.3rem;margin:4px 0 8px;color:#8FDDB6;letter-spacing:-.015em}
.q-guar-big p{margin:0;color:var(--ink2);font-size:.97rem}
.q-guar-big+.q-car-wrap,.q-renew+.q-guar-big{margin-top:52px}

/* carrossel de antes/depois */
.q-car-wrap{margin:26px 0 0}
.q-car{overflow:hidden;margin:0 -18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.q-car-track{display:flex;gap:12px;width:max-content;animation:qCar 70s linear infinite}
@keyframes qCar{to{transform:translateX(-50%)}}
.q-car-it{margin:0;width:150px;flex:0 0 150px;background:var(--card);border-radius:16px;overflow:hidden;box-shadow:var(--sh)}
.q-car-it img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}
.q-car-it figcaption{padding:8px 10px;font-size:.78rem;color:var(--ink2)}
.q-car-it figcaption b{display:block;color:var(--ok);font-size:.86rem}

/* demos da v9 dentro do quiz */
.q-screen .qd{margin:4px 0 6px}
.q-ruler,.q-ruler *{user-select:none;-webkit-user-select:none}
.q-screen .qd .lp-janela{max-width:290px;margin-left:auto;margin-right:auto}
.q-screen .qd .lp-legenda{text-align:center}
/* carregamento: miniatura de antes/depois */
.q-ld-ba{display:flex;align-items:center;gap:12px}
.q-ld-ba img{width:72px;height:72px;border-radius:12px;object-fit:cover;flex:0 0 72px}
.q-ld-ba span{display:flex;flex-direction:column;gap:2px;font-size:.88rem;color:var(--ink2)}
.q-ld-ba span b{margin:0;color:var(--ok);font-family:'Plus Jakarta Sans',sans-serif;font-size:1.05rem}
.q-testi{animation:qFade .5s forwards}
/* favoritas com o lugar no dia */
.q-fitlist{display:flex;flex-direction:column;gap:8px;margin:6px 0 16px}
.q-fitrow{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--card);border:1.5px solid rgba(81,189,137,.35);border-radius:14px;padding:11px 14px;box-shadow:var(--sh);opacity:0;animation:qPop .4s ease forwards;font-weight:500}
.q-fitrow b{color:var(--ok);font-size:.86rem;font-weight:600;white-space:nowrap}
.q-fitmore{justify-content:center;color:var(--ink2);border-color:var(--line)}
.q-incl li.gift small{display:block;font-weight:400;color:var(--ink2);font-size:.84rem;margin-top:2px}

/* ===== V2 (12/10): herói, demos, carregamento, revelação da meta, oferta nova ===== */
.q-welcome .q-h1{font-size:clamp(1.6rem,7vw,2.1rem)}
.q-welcome .q-lead{margin-bottom:18px}

/* telas com animação: título + moldura + botão cabem em 360x640 sem rolar */
.qs-demo_plate .q-kicker,.qs-edu_treat .q-kicker{margin-bottom:4px}
.qs-demo_plate .q-h2,.qs-edu_treat .q-h2{margin-bottom:4px}
.qs-demo_plate .q-foot,.qs-edu_treat .q-foot{padding-top:10px}

/* treino: tira parada com os quadros 3D do app */
.q-tp-strip{display:flex;gap:8px;margin:4px 0 0}
.q-tp-frame{position:relative;flex:1;min-width:0;aspect-ratio:2/3;border-radius:12px;overflow:hidden;background:#0A0E18}
.q-tp-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* carregamento: emojis das comidas entrando um a um */
.q-fem-w{white-space:nowrap}
.q-fem{display:inline-block;opacity:0;transform:scale(.4);transition:opacity .2s ease,transform .25s cubic-bezier(.3,1.6,.5,1)}
.q-steps li.on .q-fem{opacity:1;transform:none}

/* resultado: a meta de calorias aparece */
.q-goal{text-align:center}
.q-goal .q-sec{margin-bottom:6px}
.q-goal-k{margin:0;font-family:'Plus Jakarta Sans',sans-serif;line-height:1}
.q-goal-k b{font-size:56px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--ink)}
.q-goal-k small{font-size:1.1rem;font-weight:700;color:var(--ink2);margin-left:6px}
.q-goal-k.pulse{animation:qPulse .45s ease}
@keyframes qPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.q-rv-l{margin:10px 0 0;color:var(--ink2);font-size:.95rem;opacity:0;transform:translateY(6px);transition:opacity .35s ease,transform .35s ease}
.q-rv-l.on{opacity:1;transform:none}
.q-fl-em{display:inline-block;margin-right:2px;opacity:0;transform:scale(.5);transition:opacity .2s ease,transform .25s ease}
.q-rv-l.on .q-fl-em{opacity:1;transform:none}
.q-res-chart .q-draw{animation-duration:1.2s;animation-delay:2s}
.q-res-chart .q-area{opacity:0;animation:qFade 1.2s ease 2s forwards}
.q-end-dot{opacity:0;transform:scale(.3);transform-box:fill-box;transform-origin:center;transition:opacity .25s ease,transform .35s cubic-bezier(.3,1.6,.5,1)}
.q-end-lb,.q-ev{opacity:0;transition:opacity .35s ease}
.q-chart-on .q-end-dot{opacity:1;transform:none}
.q-chart-on .q-end-lb,.q-chart-on .q-ev{opacity:1}
.q-locks .q-lock{position:relative;overflow:hidden;opacity:0;transform:translateY(8px);transition:opacity .3s ease,transform .3s ease}
.q-locks.on .q-lock{opacity:1;transform:none}
.q-locks.on .q-lock::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.14) 50%,transparent 65%);transform:translateX(-100%);animation:qShine .9s ease .5s 1 forwards}
@keyframes qShine{to{transform:translateX(100%)}}

/* oferta: faixa do bônus (some ao expirar; no último minuto o fundo esquenta) */
.q-timer[hidden]{display:none}
.q-timer::before{content:'';position:absolute;inset:0;border-radius:inherit;background:#55342C;opacity:0;transition:opacity 1s ease;z-index:-1}
.q-timer.late::before{opacity:1}
.q-recap{margin:2px 0 4px}
.q-recap .q-res-h{margin-bottom:8px}
.q-recap-l{margin:0;color:var(--ink);font-weight:600;font-size:1rem}
.q-recap-g{margin:4px 0 0;color:var(--ink2);font-size:.95rem}
.q-plans{display:flex;flex-direction:column;gap:14px;margin:22px 0 16px}
.q-plan{position:relative;display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;border:2px solid var(--line);background:var(--card);
  border-radius:20px;padding:18px 16px 14px;cursor:pointer;box-shadow:var(--sh);transition:transform .15s ease}
.q-plan.on{border-color:var(--brand);transform:scale(1.02);box-shadow:var(--sh2)}
.q-plan-badge{position:absolute;top:-11px;left:16px;background:var(--brand);color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.04em;
  padding:5px 10px;border-radius:99px;animation:qBadge .7s ease .5s 1 both}
@keyframes qBadge{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
.q-plan-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.q-plan-t{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:1.15rem}
.q-plan-p{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:1.6rem;letter-spacing:-.02em;white-space:nowrap}
.q-plan-p small{font-size:.9rem;font-weight:600;color:var(--ink2);margin-left:2px}
.q-plan-sub{color:var(--ink2);font-size:.9rem}
.q-plan-gift{margin-top:6px;color:var(--ok);font-weight:700;font-size:.92rem}
.q-plan-gift:empty{display:none}
/* Fase 3 (15/10): no anual, as 12 mensalidades riscadas em cima do preço */
.q-plan-was{display:block;text-align:right;color:var(--ink3);font-size:.85rem;font-weight:600;line-height:1.2}
.q-plan-was s{text-decoration-thickness:1.5px}
/* botão de compra do anual: o valor por mês e, menor embaixo, o que é cobrado hoje */
.q-btn-2l{padding:11px 20px 10px}
.q-btn small{display:block;margin-top:2px;font-family:'Inter',sans-serif;font-size:.8rem;font-weight:600;opacity:.75}
/* frase logo abaixo dos preços (15/10) */
.q-tagline{margin:0 0 14px;text-align:center;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:1.02rem;color:var(--ink)}
.q-tagline b{color:var(--yellow)}
.q-osec{margin:26px 0 0}
.q-osec>.q-sec{margin-bottom:10px}
.q-tsts{display:flex;flex-direction:column;gap:10px}
.q-tst{margin:0;background:var(--card);border-radius:18px;padding:14px 16px;box-shadow:var(--sh)}
.q-tst blockquote{margin:0;font-size:.95rem;color:var(--ink)}
.q-tst figcaption{margin-top:8px;font-size:.84rem;font-weight:600;color:var(--ink2)}
.q-next{margin:0;padding:0;list-style:none;counter-reset:qn;display:flex;flex-direction:column;gap:10px}
.q-next li{counter-increment:qn;display:flex;gap:12px;align-items:flex-start;font-size:.95rem}
.q-next li::before{content:counter(qn);flex:0 0 28px;height:28px;border-radius:50%;background:var(--brand-l);color:var(--brand-t);font-weight:800;
  display:flex;align-items:center;justify-content:center;font-size:.85rem}
.q-faq details{background:var(--card);border-radius:16px;box-shadow:var(--sh);margin-bottom:8px;padding:0 16px}
.q-faq summary{cursor:pointer;list-style:none;padding:14px 26px 14px 0;font-weight:600;position:relative}
.q-faq summary::-webkit-details-marker{display:none}
.q-faq summary::after{content:'+';position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:1.2rem;color:var(--brand-t)}
.q-faq details[open] summary::after{content:'−'}
.q-faq details p{margin:0 0 14px;color:var(--ink2);font-size:.94rem}
.q-sticky{position:fixed;left:0;right:0;bottom:0;z-index:15;padding:10px 18px calc(10px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(16,22,36,0),var(--bg) 35%);opacity:0;transform:translateY(100%);
  transition:opacity .2s ease,transform .25s ease;pointer-events:none}
.q-sticky.on{opacity:1;transform:none;pointer-events:auto}
.q-sticky .q-btn{max-width:484px;margin:0 auto}

/* ===== herói escuro (13/10): eyebrow, headline, sub, animação, botão, linha final ===== */
html.q-dark,html.q-dark body{background:#101624}
html.q-dark .q-top{background:#101624}
html.q-dark .q-logo{color:var(--ink)}
html.q-dark .q-logo b{color:var(--brand-t)}
.q-s0{animation:none}
.qh{flex:1;display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"txt" "demo" "cta";align-content:center;row-gap:18px;color:var(--ink);padding-bottom:6px}
.qh-txt{grid-area:txt}
.qh-eye{margin:0 0 8px;color:#51BD89;font-weight:700;font-size:.88rem;letter-spacing:.02em}
.qh-h1{margin:0 0 10px;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:clamp(1.62rem,7.2vw,2.15rem);line-height:1.12;letter-spacing:-.02em;color:var(--ink)}
.qh-sub{margin:0;color:var(--ink2);font-size:1rem;line-height:1.45}
.qh-demo{grid-area:demo;position:relative;height:clamp(300px,40vh,360px)}
.qh-cta{grid-area:cta}
.qh-btn{display:block;width:100%;border:0;border-radius:16px;padding:17px 20px;cursor:pointer;background:var(--green);color:var(--bg);
  font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:1.08rem;box-shadow:0 10px 26px rgba(81,189,137,.28);transition:transform .12s ease}
.qh-btn:active{transform:scale(.985)}
.qh-btn:disabled{opacity:.7;cursor:default}
.qh-note{margin:10px 0 0;text-align:center;color:var(--ink2);font-size:.92rem}
@media (min-width:900px){
  html.q-dark #app{max-width:1080px}
  .qh{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"txt demo" "cta demo";column-gap:56px;row-gap:26px;align-items:center}
  .qh-txt{align-self:end}
  .qh-cta{align-self:start}
  .qh-h1{font-size:2.7rem}
  .qh-sub{font-size:1.1rem}
  .qh-demo{height:440px}
  .qh-btn{max-width:380px}
  .qh-note{max-width:380px}
}
@media (max-height:700px) and (max-width:899px){
  .qh{row-gap:12px}
  .qh-h1{font-size:1.5rem;margin-bottom:8px}
  .qh-sub{font-size:.94rem}
}

/* placeholder legível no escuro */
.q-field input::placeholder{color:var(--ink3);opacity:1}
.q-note a,.q-legal a{color:var(--ink2)}
.q-next li b{color:var(--ink)}