@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 600 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(../assets/fonts/BricolageGrotesque-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(../assets/fonts/DMSans-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* ===== NutriDog — tema ===== */
:root{
  --fundo:#F3F6F2; --superficie:#FFFFFF; --tinta:#16251C; --tinta-2:#4B5B51; --linha:#D8E2DA;
  --marca:#1D6B47; --marca-forte:#14553A; --marca-suave:#E2EEE6; --cenoura:#E9803A; --cenoura-tinta:#9C4A12; --cenoura-suave:#FCEBDD;
  --fonte-titulo:"Bricolage Grotesque", "DM Sans", system-ui, sans-serif; --fonte:"DM Sans", system-ui, sans-serif;
  --raio:14px; --raio-p:10px; --sombra:0 6px 18px -8px rgb(22 37 28 / .22); --sombra-btn:0 8px 18px -10px rgb(20 85 58 / .7);
  --ease:cubic-bezier(.2,.7,.2,1); --topo:60px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--marca) var(--marca-suave)}
body{margin:0;background:var(--fundo);color:var(--tinta);font:400 1rem/1.55 var(--fonte);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
::selection{background:var(--marca);color:#fff}
:focus-visible{outline:3px solid var(--cenoura);outline-offset:2px;border-radius:6px}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit}
.ic{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}
.pular{position:absolute;left:-999px;top:8px;background:var(--marca);color:#fff;padding:10px 14px;border-radius:8px;z-index:50}
.pular:focus{left:8px}

/* casca: app em tela cheia no celular; painel lateral no desktop */
.casca{min-height:100svh}
.lateral{display:none}
.app{min-height:100svh;display:flex;flex-direction:column;max-width:560px;margin:0 auto;background:var(--fundo)}
.topo{position:sticky;top:0;z-index:20;height:var(--topo);display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:8px;padding:0 12px;background:var(--fundo)}
.topo .marca{justify-self:center}
.voltar{width:44px;height:44px;display:grid;place-items:center;border:0;background:transparent;border-radius:12px;cursor:pointer;color:var(--tinta)}
.voltar:hover{background:var(--marca-suave)}
.contador{font-size:.8125rem;color:var(--tinta-2);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.marca{display:inline-flex;align-items:center;gap:6px;color:var(--marca)}
.marca-simbolo{width:28px;height:28px}
.marca-nome{font:700 1.25rem/1 var(--fonte-titulo);letter-spacing:-.02em;color:var(--tinta)}
.marca-nome b{font-weight:700;color:var(--marca)}
.progresso{height:4px;margin:0 16px;background:var(--marca-suave);border-radius:4px;overflow:hidden}
.progresso-cheio{height:100%;width:0;background:var(--marca);border-radius:4px;transition:width .5s var(--ease)}
.progresso[data-oculto]{visibility:hidden}

.palco{flex:1;display:flex;flex-direction:column;padding:24px 16px calc(24px + env(safe-area-inset-bottom));position:relative}
.etapa{display:flex;flex-direction:column;gap:16px;flex:1}
.etapa[hidden]{display:none}
.etapa.entra{animation:entra .32s var(--ease) both}
.etapa.entra-volta{animation:entra-volta .32s var(--ease) both}
@keyframes entra{from{opacity:.001;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes entra-volta{from{opacity:.001;transform:translateX(-28px)}to{opacity:1;transform:none}}

.titulo{font:700 clamp(1.5rem,5.6vw,1.875rem)/1.15 var(--fonte-titulo);letter-spacing:-.025em;text-wrap:balance;outline:none}
.titulo-capa{font-size:clamp(1.75rem,7.4vw,2.5rem);line-height:1.08}
.sub,.lead{color:var(--tinta-2);max-width:62ch}
.lead{font-size:1.0625rem}
.h2{font:700 1.5rem/1.2 var(--fonte-titulo);letter-spacing:-.02em;text-wrap:balance}
.h3{font:700 1.125rem/1.3 var(--fonte-titulo)}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;width:100%;padding:14px 20px;border:0;border-radius:var(--raio);font:700 1.0625rem/1.2 var(--fonte);cursor:pointer;transition:transform .12s var(--ease),background-color .2s,box-shadow .2s}
.btn-primario{background:var(--marca);color:#fff;box-shadow:var(--sombra-btn)}
.btn-primario:hover{background:var(--marca-forte)}
.btn:active{transform:scale(.97)}
.btn[aria-disabled="true"]{background:#B9CBBF;color:#fff;box-shadow:none;cursor:not-allowed}
.btn[aria-disabled="true"]:active{transform:none}
.btn-grande{min-height:58px;font-size:1.125rem}
.btn .ic{width:20px;height:20px}
.rodape-etapa{margin-top:auto;padding-top:8px;display:grid;gap:14px}

/* capa */
.capa-foto{margin:0 -16px;overflow:hidden}
.capa-foto img{width:100%;aspect-ratio:800/467;object-fit:cover}
.capa-itens{display:flex;flex-wrap:wrap;gap:8px 16px}
.capa-itens li{display:flex;align-items:center;gap:6px;font-weight:600;font-size:.9375rem}
.capa-itens .ic{color:var(--marca);width:20px;height:20px;stroke-width:2.25}

/* opções */
.opcoes{display:grid;gap:10px}
.opcoes-multi{gap:10px}
.opcao{width:100%;min-height:60px;display:flex;align-items:center;gap:14px;padding:12px 14px;background:var(--superficie);border:1.5px solid var(--linha);border-radius:var(--raio);text-align:left;cursor:pointer;font-size:1.0625rem;font-weight:500;line-height:1.3;transition:border-color .15s,background-color .15s,transform .12s var(--ease)}
.opcao:hover{border-color:var(--marca)}
.opcao:active{transform:scale(.98)}
.opcao-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--marca-suave);color:var(--marca);flex:none}
.opcao-txt{flex:1}
.opcao-marca{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--linha);display:grid;place-items:center;flex:none;color:transparent;transition:background-color .15s,border-color .15s}
.opcoes-multi .opcao-marca{border-radius:7px}
.opcao-marca .ic{width:16px;height:16px;stroke-width:2.5}
.opcao.ativa,.opcao[aria-pressed="true"]{border-color:var(--marca);background:var(--marca-suave)}
.opcao.ativa .opcao-marca,.opcao[aria-pressed="true"] .opcao-marca{background:var(--marca);border-color:var(--marca);color:#fff}
.opcao.ativa .opcao-ic,.opcao[aria-pressed="true"] .opcao-ic{background:var(--marca);color:#fff}

/* missão */
.missao-foto{margin:0 auto;max-width:300px}
.prova-linha{display:flex;align-items:center;justify-content:center;gap:8px;font-size:.9375rem;color:var(--tinta-2);text-align:center}
.prova-linha .ic{color:var(--cenoura-tinta);width:20px;height:20px}

/* áudio estilo WhatsApp */
.zap{background:#E9E3D9;border-radius:var(--raio);padding:20px 14px}
.zap-balao{position:relative;display:flex;gap:12px;align-items:center;background:#fff;border-radius:4px 14px 14px 14px;padding:10px 12px;box-shadow:0 1px 1px rgb(11 20 26 / .13)}
.zap-foto{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:none}
.zap-corpo{flex:1;min-width:0}
.zap-nome{font-size:.8125rem;font-weight:700;color:#0B7A3E}
.zap-player{position:relative;display:flex;align-items:center;gap:8px;height:44px}
.zap-play{width:44px;height:44px;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;color:#54656F;flex:none;border-radius:50%}
.zap-play .ic{width:26px;height:26px}
.zap-play .ic-pause,.zap-play[aria-pressed="true"] .ic-play{display:none}
.zap-play[aria-pressed="true"] .ic-pause{display:block}
.zap-onda{flex:1;height:28px;display:flex;align-items:center;gap:2px}
.zap-onda i{flex:1;height:var(--h);border-radius:2px}
.zap-onda i{background:#34B7F1;opacity:.35}
.zap-onda i.tocado{opacity:1}
.zap-range{position:absolute;left:52px;right:0;top:0;height:44px;opacity:0;cursor:pointer;margin:0}
.zap-tempo{font-size:.75rem;color:#667781;font-variant-numeric:tabular-nums}
.dica{text-align:center;color:var(--tinta-2);font-size:.9375rem}

/* análise: o momento de animação */
.etapa-carregando{justify-content:center;text-align:center}
.analise{display:grid;gap:18px;justify-items:center}
.pote{width:200px;height:140px}
.pote-borda{fill:none;stroke:var(--marca);stroke-width:4}
.pote-nivel{fill:var(--marca-suave);transform:translateY(calc(140px - var(--n,0) * 80px));transition:transform .1s linear}
.pote-graos{fill:var(--cenoura);transform:translateY(calc(70px - var(--n,0) * 70px));transition:transform .1s linear}
.folha-a{fill:var(--marca);transform-origin:100px 52px;transform:scale(var(--f,0));transition:transform .5s var(--ease)}
.folha-b{fill:var(--cenoura);transform-origin:100px 52px;transform:scale(var(--f,0));transition:transform .5s .1s var(--ease)}
.barra-analise{width:100%;max-width:420px;text-align:left}
.barra-analise-topo{display:flex;justify-content:space-between;font-size:.9375rem;font-weight:600;padding-bottom:6px;font-variant-numeric:tabular-nums}
.barra-trilho{height:12px;background:var(--marca-suave);border-radius:12px;overflow:hidden}
.barra-cheia{height:100%;width:0;background:var(--marca);border-radius:12px}
.passos{display:grid;gap:10px;width:100%;max-width:420px;text-align:left}
.passos li{display:flex;align-items:center;gap:10px;color:var(--tinta-2);transition:color .3s}
.passos .ic{width:22px;height:22px;padding:3px;border-radius:50%;border:1.5px solid var(--linha);color:transparent;stroke-width:2.5;transition:all .3s}
.passos li.feito{color:var(--tinta)}
.passos li.feito .ic{background:var(--marca);border-color:var(--marca);color:#fff}

/* resultado */
.etapa-resultado{gap:40px;padding-bottom:96px}
.diag{display:grid;gap:18px}
.diag-titulo{font-size:clamp(1.875rem,8vw,2.5rem);line-height:1.05}
.diag-pre{display:block;font:500 1.0625rem/1.4 var(--fonte);letter-spacing:0;color:var(--tinta-2);margin-bottom:4px}
.diag-selo{margin:0;display:grid;justify-items:center;gap:8px}
.diag-selo img{width:min(240px,64vw);border-radius:50%}
.diag-selo figcaption{font-size:.875rem;color:var(--tinta-2);text-align:center}
.compat{background:var(--superficie);border-radius:var(--raio);padding:16px;box-shadow:var(--sombra)}
.compat-topo{display:flex;justify-content:space-between;align-items:baseline;font-weight:600;padding-bottom:8px}
.compat-topo strong{font:700 1.5rem/1 var(--fonte-titulo);color:var(--marca);font-variant-numeric:tabular-nums}
.compat-cheia{transition:width 1.2s var(--ease)}
.respostas{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;margin:0;padding:16px;border-radius:var(--raio);background:var(--marca-suave)}
.respostas dt{color:var(--tinta-2);font-size:.9375rem}
.respostas dd{margin:0;font-weight:600;font-size:.9375rem}
.prioridade{font:700 1.3125rem/1.3 var(--fonte-titulo);letter-spacing:-.015em;text-wrap:pretty}
.ponte{color:var(--tinta-2)}
.bloco{display:grid;gap:18px}
.entregas{display:grid}
.entregas li{display:grid;grid-template-columns:44px 1fr;gap:14px;padding:16px 0;border-top:1px solid var(--linha)}
.entregas li:last-child{border-bottom:1px solid var(--linha)}
.entrega-ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--marca);color:#fff}
.entregas h3{font:700 1.0625rem/1.3 var(--fonte-titulo);margin-bottom:4px}
.entregas p{color:var(--tinta-2);font-size:.9375rem}
.entregas-bonus .entrega-ic{background:var(--cenoura-suave);color:var(--cenoura-tinta)}
.gratis{display:inline-block;vertical-align:2px;margin-left:4px;padding:2px 8px;border-radius:999px;background:var(--cenoura-suave);color:var(--cenoura-tinta);font:700 .75rem/1.4 var(--fonte)}
.preco{background:var(--superficie);border-radius:var(--raio);overflow:hidden;box-shadow:var(--sombra);display:grid;gap:16px;padding-bottom:18px}
.preco-faixa{background:var(--marca);color:#fff;text-align:center;font-weight:700;font-size:.9375rem;padding:10px}
.preco-corpo{padding:0 18px;display:grid;gap:6px}
.preco-plano{font:700 1.25rem/1.2 var(--fonte-titulo)}
.preco-valor{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px}
.preco-valor s{color:var(--tinta-2)}
.preco-por{font:800 3rem/1 var(--fonte-titulo);letter-spacing:-.03em;color:var(--tinta)}
.preco-por small{font-size:1.125rem;margin-right:4px;letter-spacing:0}
.preco-avista{color:var(--tinta-2);font-weight:600}
.preco .btn{width:auto;margin:0 18px}
.preco-unico{padding:0 18px;color:var(--tinta-2);font-size:.9375rem;text-align:center}
.garantia{grid-template-columns:96px 1fr;align-items:center;gap:16px}
.garantia img{width:96px;height:96px}
.garantia p{color:var(--tinta-2)}
.faq{display:grid}
.faq details{border-top:1px solid var(--linha)}
.faq details:last-child{border-bottom:1px solid var(--linha)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:56px;padding:14px 0;font-weight:700;line-height:1.35;text-align:left;cursor:pointer;list-style:none}
.faq-q{flex:1;min-width:0;text-wrap:pretty}
.faq-ic{flex:none;width:22px;height:22px}
.faq summary::-webkit-details-marker{display:none}
.faq-ic{color:var(--marca);transition:transform .2s var(--ease)}
.faq details[open] .faq-ic{transform:rotate(45deg)}
.faq details p{margin:0;padding:0 38px 18px 0;color:var(--tinta-2);line-height:1.55;text-wrap:pretty}
.cta-fixo{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--fundo);border-top:1px solid var(--linha)}
.cta-fixo .btn{max-width:528px;margin:0 auto;display:flex}

@media (prefers-reduced-motion:reduce){
  .etapa.entra,.etapa.entra-volta{animation:fade .2s both}
  @keyframes fade{from{opacity:.001}to{opacity:1}}
  .progresso-cheio,.compat-cheia,.pote-nivel,.pote-graos,.folha-a,.folha-b{transition:none}
  .btn:active,.opcao:active{transform:none}
}
.voltar[hidden]{display:grid;visibility:hidden}
.titulo:focus{outline:none}

/* capa v1.4 — layout da referência do Jaime */
.etapa-capa{gap:14px;text-align:center}
.progresso[data-oculto]{visibility:hidden}
.capa-hero{position:relative;margin:-8px -16px 18px}
.capa-hero img{width:100%;aspect-ratio:492/294;object-fit:cover}
.capa-selo{position:absolute;left:50%;bottom:-20px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;white-space:nowrap;padding:6px 18px 6px 6px;border-radius:999px;background:#EAF6DF;border:1.5px solid #CFE7BC;font:700 1.125rem/1 var(--fonte-titulo);color:var(--tinta);box-shadow:0 6px 14px -8px rgb(22 37 28 / .35)}
.capa-selo-ic{width:38px;height:38px;border-radius:50%;background:var(--marca);color:#fff;display:grid;place-items:center}
.capa-selo-ic .ic{width:22px;height:22px;fill:currentColor;stroke:none}
.titulo-capa{font-weight:800;font-size:clamp(2rem,8.6vw,2.5rem);line-height:1.08;margin-top:14px}
.titulo-capa .destaque{color:#2E8B2E}
.etapa-capa .lead{margin:0 auto;font-size:1.0625rem;color:var(--tinta)}
.beneficios{display:grid;text-align:left;margin-top:4px}
.beneficios li{display:flex;align-items:center;gap:14px;padding:8px 0;border-bottom:1px solid var(--linha)}
.beneficios li:last-child{border-bottom:0}
.benef-ic{width:56px;height:52px;border-radius:12px;background:#EEF6E8;color:#2E8B2E;display:grid;place-items:center;flex:none}
.benef-ic .ic{width:30px;height:30px}
.benef-txt{display:grid;border-left:3px solid #2E8B2E;padding-left:12px;line-height:1.3}
.benef-txt strong{font:700 1.125rem/1.25 var(--fonte-titulo)}
.benef-txt span{font-size:.9375rem;color:var(--tinta-2)}
.recebe{position:relative;margin-top:18px;border:1.5px solid #9FCC8A;border-radius:16px;padding:26px 14px 14px;text-align:left;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px}
.recebe-titulo{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);white-space:nowrap;background:#1F6B2A;color:#fff;border-radius:999px;padding:6px 18px;font:700 1rem/1.2 var(--fonte-titulo)}
.recebe ul{display:grid;gap:8px}
.recebe li{display:flex;align-items:center;gap:8px;font-size:.9375rem}
.recebe-ok{width:20px;height:20px;border-radius:50%;background:#3E9B2F;color:#fff;display:grid;place-items:center;flex:none}
.recebe-ok .ic{width:13px;height:13px;stroke-width:3}
.recebe-tigela{width:76px;height:auto}
.btn-cta{background:linear-gradient(180deg,#FF7A1A,#E8500C);color:#fff;border-radius:999px;box-shadow:0 10px 20px -10px rgb(232 80 12 / .75);font-family:var(--fonte-titulo);font-size:1.375rem}
.btn-cta:hover{background:linear-gradient(180deg,#F26C0E,#D44707)}
.btn-cta .ic{width:24px;height:24px;stroke-width:2.25}
.app:has(.etapa-capa:not([hidden])),.app:has(.etapa-capa:not([hidden])) .topo{background:#fff}
.titulo-capa{font-size:clamp(2.25rem,10vw,2.75rem);line-height:1.05;letter-spacing:-.03em;color:#123A1E;text-decoration:none}
.titulo-capa .destaque{color:#2C8A1F}
.etapa-capa .lead{max-width:30ch;font-size:1.125rem;line-height:1.45}
.benef-ic .ic{width:34px;height:34px;stroke-width:2}
.benef-txt strong{font-size:1.25rem;font-weight:800}
.benef-txt span{font-size:1rem}
.recebe-titulo{font-size:1.125rem}
.recebe li{font-size:1rem}
.recebe-tigela{width:84px}
.btn-cta{min-height:62px;font-size:1.5rem;font-weight:800}
.titulo:focus,.titulo:focus-visible{outline:none}
.recebe{padding:26px 10px 14px 12px;gap:4px}
.recebe li{font-size:.9375rem;letter-spacing:-.01em}
.recebe-tigela{width:70px}
.benef-ic{width:60px;height:54px}
.benef-ic .ic{width:36px;height:36px;stroke-width:2.1}

/* capa v1.5 */
.titulo-capa .destaque{display:inline;background:radial-gradient(ellipse at center,#E6F4D7 62%,rgb(230 244 215 / .35) 100%);border-radius:999px;padding:.02em .32em .06em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.beneficios{grid-template-columns:repeat(3,1fr);text-align:center;margin-top:8px}
.beneficios li{flex-direction:column;justify-content:flex-start;gap:8px;padding:2px 6px;border-bottom:0;border-left:1px solid #CFE3C2;min-width:0}
.beneficios li:first-child{border-left:0}
.benef-ic{width:56px;height:50px}
.benef-ic .ic{width:32px;height:32px}
.benef-txt{border-left:0;padding-left:0;justify-items:center;line-height:1.25}
.benef-txt strong{font-size:1rem;color:#123A1E;overflow-wrap:anywhere}
.benef-txt span{font-size:.875rem;color:var(--tinta)}
.beneficios li{padding:2px 2px}
.benef-txt strong{font-size:.9375rem;font-weight:700;letter-spacing:-.015em;overflow-wrap:normal}

/* v1.6 — coluna única tipo mobile em qualquer largura; laterais verdes */
body{background:#E6F4D7}
.lateral{display:none}
.casca{display:block}
.app{max-width:460px;width:100%;margin:0 auto;background:#fff;box-shadow:0 0 40px -12px rgb(22 37 28 / .18)}
.topo,.app:has(.etapa-capa:not([hidden])) .topo{background:#fff}
.cta-fixo{left:50%;right:auto;width:100%;max-width:460px;transform:translateX(-50%);background:#fff}

/* v1.7 — selo no header (só na capa) e hero em cúpula com base esvanecida */
.topo-centro{justify-self:center;display:flex;align-items:center;gap:12px}
.topo-selo{display:none;padding:4px 11px;border:2px solid #2E7A22;border-radius:999px;color:#2E7A22;background:#fff;font:600 .8125rem/1.2 var(--fonte);white-space:nowrap}
.app:has(.etapa-capa:not([hidden])) .topo-selo{display:inline-block}
.capa-hero{margin:-8px -16px 4px}
.capa-hero img{aspect-ratio:800/301;-webkit-mask-image:linear-gradient(#000 82%,transparent);mask-image:linear-gradient(#000 82%,transparent)}
.titulo-capa{margin-top:0}

/* v1.8 */
.capa-hero img{aspect-ratio:800/346}
.capa-hero{margin-bottom:-6px}
.capa-micro{display:flex;justify-content:center;align-items:center;flex-wrap:nowrap}
.capa-micro li{display:flex;align-items:center;gap:5px;padding:0 10px;font-size:.8125rem;color:var(--tinta);white-space:nowrap;border-left:1px solid #D9DEDB}
.capa-micro li:first-child{border-left:0}
.capa-micro .ic{width:18px;height:18px;color:#2E7A22;stroke-width:2}

/* v1.9 — pergunta da raça */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.etapa-raca{gap:12px}
.titulo-raca,.sub-raca{text-align:center}
.sub-raca{margin:-6px auto 2px;max-width:32ch}
.raca-card{display:flex;align-items:center;gap:10px;width:100%;min-height:56px;padding:6px 10px;background:#fff;border:1.5px solid var(--linha);border-radius:var(--raio);font:600 .9375rem/1.2 var(--fonte);color:var(--tinta);text-align:left;cursor:pointer;transition:border-color .15s,background-color .15s,transform .12s var(--ease)}
.raca-card:hover{border-color:var(--marca)}
.raca-card:active{transform:scale(.98)}
.raca-card[aria-pressed="true"]{border-color:var(--marca);background:var(--marca-suave);box-shadow:inset 0 0 0 1px var(--marca)}
.raca-card img{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none}
.raca-srd{justify-content:center;min-height:56px;font-size:1rem;background:#F2F8EC;border-color:#BFDDA8}
.raca-srd-ic{width:36px;height:36px;border-radius:50%;background:#fff;color:var(--marca);display:grid;place-items:center}
.raca-srd-ic .ic{width:22px;height:22px;fill:currentColor;stroke:none}
.raca-rotulo{font:700 .75rem/1 var(--fonte);letter-spacing:.06em;text-transform:uppercase;color:var(--tinta-2);margin-top:2px}
.raca-grade{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.raca-busca{position:relative}
.raca-busca-campo{display:flex;align-items:center;gap:10px;min-height:50px;padding:0 14px;border:1.5px solid var(--linha);border-radius:var(--raio);background:#fff;color:var(--tinta-2)}
.raca-busca-campo:focus-within{border-color:var(--marca)}
.raca-busca input{flex:1;border:0;outline:0;background:transparent;font:400 1rem var(--fonte);color:var(--tinta);min-height:46px}
.raca-sugestoes{position:absolute;left:0;right:0;bottom:calc(100% + 6px);z-index:5;background:#fff;border:1.5px solid var(--linha);border-radius:var(--raio);box-shadow:var(--sombra);max-height:280px;overflow:auto;padding:4px}
.raca-sugestoes button{display:block;width:100%;min-height:44px;padding:10px 12px;border:0;background:none;text-align:left;font:500 1rem var(--fonte);border-radius:8px;cursor:pointer}
.raca-sugestoes button:hover,.raca-sugestoes button:focus-visible{background:var(--marca-suave)}
.etapa-raca .rodape-etapa{gap:6px;padding-top:4px}
.raca-naosei{min-height:44px;border:0;background:none;font:600 .9375rem var(--fonte);color:var(--tinta);text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* v1.10 — busca, idade */
.raca-busca input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;width:18px;height:18px;cursor:pointer;background:no-repeat center/18px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231D6B47' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E")}
.raca-vazio{padding:12px;color:var(--tinta-2);font-size:.9375rem}
.etapa-unica:has(.opcoes-idade){gap:10px}
.idade-cab{position:relative;text-align:center;padding:0 28px}
.titulo-idade{font-size:clamp(1.75rem,7.6vw,2.125rem);font-weight:800;letter-spacing:-.03em;color:#123A1E}
.idade-qual{position:relative;display:inline-block}
.idade-traco{position:absolute;left:-6px;bottom:-8px;width:calc(100% + 8px);height:12px;fill:none;stroke:#5DB02E;stroke-width:3.5;stroke-linecap:round}
.sub-idade{text-align:center;margin:0 auto 6px;max-width:36ch;font-size:.9375rem}
.opcoes-idade{gap:10px}
.opcao-idade{min-height:96px;padding:0 16px 0 0;overflow:hidden;gap:14px;border-radius:16px}
.idade-foto{width:120px;align-self:stretch;display:flex;align-items:flex-end;justify-content:center;border-right:1.5px solid #D7E3D3;padding-top:6px;flex:none}
.idade-foto img{width:120px;height:auto;mix-blend-mode:multiply}
.idade-txt{flex:1;display:grid;gap:2px}
.opcao-idade .opcao-txt{font:800 1.3125rem/1.15 var(--fonte-titulo);letter-spacing:-.02em;color:#123A1E}
.idade-faixa{font-size:1rem;color:var(--tinta-2)}
.opcao-idade .opcao-marca{width:30px;height:30px;border-color:#7FA88C}
.opcao-idade.ativa{background:#EEF7E6;border-color:#2E7A22;box-shadow:inset 0 0 0 1px #2E7A22}
.opcao-idade.ativa .opcao-marca{background:#1F6B2A;border-color:#1F6B2A}
.opcao-idade .opcao-marca .ic{width:18px;height:18px}

/* v1.11 — porte físico */
.opcoes-porte{gap:8px}
.opcao-porte{min-height:110px;padding:0 12px 0 0;overflow:hidden;gap:10px;border-radius:16px;align-items:center;text-align:left}
.porte-foto{width:104px;align-self:stretch;display:flex;align-items:center;justify-content:center;border-right:1.5px solid #D7E3D3;flex:none}
.porte-foto img{width:104px;height:auto;mix-blend-mode:multiply}
.porte-txt{flex:1;display:grid;gap:4px;padding:8px 0;justify-items:start}
.opcao-porte .opcao-txt{font:800 1rem/1.2 var(--fonte-titulo);color:#123A1E;background:#E3F1DA;border-radius:999px;padding:3px 12px}
.porte-bul{margin:0;padding-left:14px;font-size:.75rem;line-height:1.3;color:var(--tinta-2);display:grid;gap:1px}
.opcao-porte .opcao-marca{width:28px;height:28px;border-color:#7FA88C;flex:none}
.opcao-porte .opcao-marca .ic{width:16px;height:16px}
.opcao-porte.ativa{background:#EEF7E6;border-color:#2E7A22;box-shadow:inset 0 0 0 1px #2E7A22}
.opcao-porte.ativa .opcao-txt{background:#1F6B2A;color:#fff}
.opcao-porte.ativa .opcao-marca{background:#1F6B2A;border-color:#1F6B2A}
.porte-bul li{list-style:disc}.porte-bul li::marker{color:#1F6B2A}
.porte-bul{font-size:.8125rem;line-height:1.28}
.porte-bul li{list-style:disc}
.opcao:focus:not(:focus-visible){outline:none}
@media (hover:none){.opcao:not(.ativa):hover{border-color:rgb(216,226,218)}}
.porte-foto{border-right:0;width:122px}.porte-foto img{width:122px}.opcao-porte{gap:6px}
.porte-txt{padding:5px 0}

/* v1.13 — sexo */
.opcoes-sexo{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px}
.opcao-sexo{position:relative;flex-direction:column;align-items:center;justify-content:flex-end;padding:22px 8px 12px;min-height:268px;border-radius:20px;overflow:hidden;gap:0;background:#fff}
.opcao-sexo img{width:100%;max-width:178px;height:auto;mix-blend-mode:multiply;display:block}
.sexo-pilula{position:relative;margin-top:-26px;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;background:#fff;border-radius:999px;box-shadow:0 4px 14px rgba(18,58,30,.14)}
.opcao-sexo .opcao-txt{font:800 1.1875rem/1 var(--fonte-titulo);color:#123A1E}
.sexo-simb{width:24px;height:24px;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.sexo-simb.macho{stroke:#2F6FD1}.sexo-simb.femea{stroke:#D6457A}
.opcao-sexo .opcao-marca{position:absolute;top:10px;right:10px;width:30px;height:30px;border-color:#7FA88C;background:#fff}
.opcao-sexo .opcao-marca .ic{width:18px;height:18px}
.opcao-sexo.ativa{background:#EEF7E6;border-color:#2E7A22;box-shadow:inset 0 0 0 1px #2E7A22}
.opcao-sexo.ativa .opcao-marca{background:#1F6B2A;border-color:#1F6B2A}
.opcao-sexo .sexo-pilula{margin-top:-8px;justify-content:center;flex:none}.opcao-sexo{min-height:300px}
.opcao-sexo .opcao-txt{flex:none}

/* v1.15 — petiscos */
.opcao-bloco{flex:1;display:grid;gap:1px;text-align:left}
.opcao-nota{font-size:.8125rem;color:var(--tinta-2);line-height:1.25}

/* v1.17 — comida em grade */
.opcoes-comida{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px}
.opcao-comida{position:relative;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;padding:30px 8px 14px;min-height:196px;border-radius:20px;gap:2px;background:#fff}
.opcao-comida img{width:100%;max-width:150px;height:auto;mix-blend-mode:multiply;margin-bottom:6px}
.opcao-comida .opcao-txt{flex:none;font:800 1.0625rem/1.2 var(--fonte-titulo);color:#123A1E}
.comida-nota{font-size:.8125rem;color:var(--tinta-2);line-height:1.25}
.opcao-comida .opcao-marca{position:absolute;top:10px;right:10px;width:28px;height:28px;border-color:#7FA88C;background:#fff}
.opcao-comida .opcao-marca .ic{width:16px;height:16px}
.opcao-comida.ativa{background:#EEF7E6;border-color:#2E7A22;box-shadow:inset 0 0 0 1px #2E7A22}
.opcao-comida.ativa .opcao-marca{background:#1F6B2A;border-color:#1F6B2A}
.opcoes-comida>li{display:flex}.opcoes-comida .opcao-comida{flex:1;width:100%}

/* v1.19 — petiscos com ilustração */
.opcoes-petiscos,.opcoes-sinais{gap:8px}
.opcoes-petiscos .opcao,.opcoes-sinais .opcao{min-height:64px;padding:4px 14px 4px 6px;gap:10px}
.petisco-img{width:84px;height:56px;object-fit:contain;mix-blend-mode:multiply;flex:none}
.opcoes-petiscos .opcao-txt,.opcoes-sinais .opcao-txt{font-weight:700}
.opcoes-petiscos .opcao[aria-pressed="true"],.opcoes-sinais .opcao[aria-pressed="true"]{background:#EEF7E6;border-color:#8CC07A}
.opcoes-petiscos .opcao[aria-pressed="true"] .opcao-marca,.opcoes-sinais .opcao[aria-pressed="true"] .opcao-marca{background:#1F6B2A;border-color:#1F6B2A}


/* v1.20 — título único em todas as perguntas */
:root{--titulo-q:1.625rem}
.idade-cab{padding:0}
.etapa-unica .titulo,.etapa-multipla .titulo,.etapa-raca .titulo,.etapa-info .titulo,.etapa-audio .titulo{font-size:var(--titulo-q);font-weight:800;line-height:1.15;letter-spacing:-.03em;color:#123A1E;padding-inline:24px;text-align:center}

/* v1.22 — tempo dos sinais com calendário */
.opcoes-tempo{gap:10px}
.opcao-tempo{min-height:84px;padding:10px 16px 10px 12px;gap:14px;border-radius:16px}
.opcao-tempo .opcao-txt{font:800 1.125rem/1.2 var(--fonte-titulo);letter-spacing:-.02em;color:#123A1E}
.tempo-apoio{font-size:.9375rem;line-height:1.3;color:var(--tinta-2)}
.opcao-tempo .opcao-marca{width:28px;height:28px;border-radius:50%;border-color:#B5C4BA}
.opcao-tempo.ativa{background:#EEF7E6;border-color:#2E7A22;box-shadow:inset 0 0 0 1px #2E7A22}
.opcao-tempo.ativa .opcao-marca{background:#1F6B2A;border-color:#1F6B2A}
.opcao-tempo .opcao-marca .ic{width:16px;height:16px}
.cal{position:relative;flex:none;width:58px;height:60px;display:flex;flex-direction:column}
.cal-topo{position:relative;height:14px;background:#1F6B2A;border-radius:7px 7px 0 0}
.cal-topo i{position:absolute;top:-5px;width:5px;height:10px;border-radius:3px;background:#1F6B2A;border:1.5px solid #fff}
.cal-topo i:first-child{left:14px}.cal-topo i:last-child{right:14px}
.cal-corpo{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff;border:2px solid #1F6B2A;border-top:0;border-radius:0 0 7px 7px;color:#123A1E;line-height:1}
.cal-corpo b{font:800 1.125rem/1 var(--fonte-titulo)}
.cal-corpo small{font:700 .6875rem/1.1 var(--fonte);margin-top:2px}
.cal-so b{font-size:1rem}
.cal-dobra{position:absolute;right:2px;bottom:2px;width:12px;height:12px;background:linear-gradient(135deg,transparent 50%,#BFE3A8 50%);border-top-left-radius:3px}

/* v1.24 — sem hover herdado ao entrar na tela; alinhamento único */
.sem-hover .opcao:not(.ativa):not([aria-pressed="true"]):hover,.sem-hover .raca-card:not([aria-pressed="true"]):hover{border-color:var(--linha)}
.etapa-unica .sub,.etapa-multipla .sub,.etapa-raca .sub,.etapa-info .sub,.etapa-audio .sub{text-align:center;margin-inline:auto;max-width:36ch;padding-inline:24px;box-sizing:content-box;text-wrap:balance}
.etapa-info .titulo,.etapa-audio .titulo{text-align:center}
.etapa-info .lead{text-align:center;padding-inline:24px;text-wrap:balance}

/* v1.25 — gasto com moedas e etiqueta */
.opcoes-gasto{gap:10px}
.opcao-gasto{min-height:84px;padding:8px 16px 8px 8px;gap:12px;border-radius:16px}
.gasto-img{width:76px;height:61px;object-fit:contain;mix-blend-mode:multiply;flex:none;padding-right:10px;border-right:1px solid #E3E8E4;box-sizing:content-box}
.gasto-txt{flex:1;display:grid;gap:5px;justify-items:start}
.opcao-gasto .opcao-txt{font:800 1.0625rem/1.2 var(--fonte-titulo);letter-spacing:-.02em;color:#123A1E}
.gasto-tag{display:inline-block;padding:3px 10px;border-radius:999px;background:#E3F1DA;color:#1F5A2A;font-size:.8125rem;font-weight:600;line-height:1.3}
.opcao-gasto .opcao-marca{width:28px;height:28px;border-color:#B5C4BA}
.opcao-gasto.ativa{background:#EEF7E6;border-color:#2E7A22;box-shadow:inset 0 0 0 1px #2E7A22}
.opcao-gasto.ativa .opcao-marca{background:#1F6B2A;border-color:#1F6B2A}
.opcao-gasto.ativa .gasto-tag{background:#1F6B2A;color:#fff}
.opcao-gasto .opcao-marca .ic{width:16px;height:16px}

/* v1.26 — perguntas alinhadas à esquerda (regra única) */
.etapa-unica .idade-cab,.etapa-multipla .idade-cab,.etapa-raca .idade-cab{text-align:left;padding:0 46px 0 0}
.etapa-unica .titulo,.etapa-multipla .titulo,.etapa-raca .titulo{text-align:left;padding-inline:0}
.etapa-unica .sub,.etapa-multipla .sub,.etapa-raca .sub{text-align:left;margin-inline:0;max-width:none;padding-inline:0;text-wrap:pretty}
/* v1.27 — quebra natural (v1.29: tracinhos removidos) */
.etapa-unica .idade-cab,.etapa-multipla .idade-cab,.etapa-raca .idade-cab{padding:0}
.etapa-unica .titulo,.etapa-multipla .titulo,.etapa-raca .titulo{text-wrap:wrap}
.etapa-unica .sub,.etapa-multipla .sub,.etapa-raca .sub{text-wrap:wrap}
/* v1.30 — item da oferta que responde à necessidade */
.entregas li.pedido{background:#EEF6EC;border-radius:14px;padding-inline:12px;margin-inline:-12px;border-top-color:transparent}
.pedido-tag{display:inline-block;vertical-align:2px;margin-left:6px;padding:2px 8px;border-radius:999px;background:var(--marca);color:#fff;font:700 .75rem/1.4 var(--fonte)}
/* v1.31 — identificação: rótulo + apoio com ícone de linha */
.opcao-apoio .opcao-txt{font:800 1.0625rem/1.2 var(--fonte-titulo);letter-spacing:-.02em;color:#123A1E}
/* v1.35 — identificação com ilustrações (folha gerada, fundo transparente) */
.opcao-ident{min-height:88px;gap:10px;padding:8px 12px 8px 6px}
.ident-img{width:92px;height:77px;flex:none;object-fit:contain}
.opcao-ident .opcao-txt{flex:1;font:700 .9375rem/1.3 var(--fonte-titulo);letter-spacing:-.01em;color:#123A1E}
.garantia-so-texto{grid-template-columns:1fr} /* v1.38 publicar: garantia só com texto */
/* v1.40 — idade: foto quadrada maior (cães >=100px a 390) */
.idade-foto{width:120px;padding-top:0}.idade-foto img{width:120px;height:120px;display:block}.opcao-idade{min-height:120px}
/* v1.44 — raças em busto (cabeça + peito), sem máscara redonda, apoiado na base do card */
.raca-grade .raca-card{min-height:72px;padding:6px 10px 0 8px;align-items:stretch;gap:12px;overflow:hidden}
.raca-grade .raca-card img{width:64px;height:64px;border-radius:0;object-fit:contain;object-position:bottom;align-self:flex-end;margin-top:auto}
.raca-grade .raca-card span{align-self:center;padding-bottom:6px}

/* v1.56: na capa, o topo (marca + tag) fica solto na página, sem faixa fixa nem barra de progresso */
.app:has(.etapa-capa:not([hidden])) .topo{position:static}
.app:has(.etapa-capa:not([hidden])) .progresso{display:none}
/* v1.57: capa cabe inteira na tela, sem rolagem — tamanhos acompanham a altura da tela */
.app:has(.etapa-capa:not([hidden])){height:100svh;min-height:0;overflow:hidden}
.app:has(.etapa-capa:not([hidden])) .topo{height:clamp(40px,6.4svh,60px)}
.app:has(.etapa-capa:not([hidden])) .palco{min-height:0;padding:clamp(4px,1.2svh,16px) 16px calc(clamp(6px,1.6svh,20px) + env(safe-area-inset-bottom))}
.etapa-capa{gap:clamp(4px,1.3svh,14px);min-height:0;justify-content:space-between}
.etapa-capa .capa-hero{margin:clamp(-8px,-1svh,0px) -16px clamp(-6px,-.7svh,0px)}
.etapa-capa .capa-hero img{aspect-ratio:auto;height:clamp(96px,19.5svh,168px);width:100%;object-fit:contain}
.etapa-capa .titulo-capa{font-size:min(10vw,4.65svh,2.75rem)}
.etapa-capa .lead{font-size:min(1.125rem,2.15svh);line-height:1.4}
.etapa-capa .beneficios{margin-top:0}
.etapa-capa .benef-ic{width:clamp(40px,6.6svh,56px);height:clamp(34px,5.9svh,50px)}
.etapa-capa .benef-ic .ic{width:clamp(22px,3.8svh,32px);height:clamp(22px,3.8svh,32px)}
.etapa-capa .beneficios li{gap:clamp(3px,.9svh,8px)}
.etapa-capa .benef-txt strong{font-size:min(.9375rem,1.85svh)}
.etapa-capa .benef-txt span{font-size:min(.875rem,1.7svh)}
.etapa-capa .recebe{margin-top:clamp(10px,1.8svh,18px);padding:clamp(18px,3svh,26px) 10px clamp(8px,1.5svh,14px) 12px}
.etapa-capa .recebe ul{gap:clamp(3px,.9svh,8px)}
.etapa-capa .recebe li{font-size:min(.9375rem,1.85svh)}
.etapa-capa .recebe-titulo{font-size:min(1.125rem,2.15svh)}
.etapa-capa .recebe-tigela{width:clamp(50px,8.4svh,70px)}
.etapa-capa .rodape-etapa{margin-top:0;padding-top:0;gap:clamp(6px,1.4svh,14px)}
.etapa-capa .btn-cta{min-height:clamp(48px,7.4svh,62px);font-size:min(1.5rem,2.9svh);padding-block:8px}
.etapa-capa .capa-micro li{font-size:min(.8125rem,1.6svh)}
@media (max-height:600px){
  .app:has(.etapa-capa:not([hidden])) .topo .marca{transform:scale(.86)}
  .app:has(.etapa-capa:not([hidden])) .topo-selo{font-size:.75rem;padding:3px 9px}
  .etapa-capa .capa-hero img{height:clamp(84px,17svh,120px)}
  .etapa-capa .recebe{padding-bottom:6px}
}
/* v1.61 — etapa escura (reutilizável: .etapa-escura) + missao igual à referência do Jaime */
.etapa-escura{--escuro:#0F2A1C;--lima:#D4F06A;--claro:rgb(255 255 255 / .86)}
body:has(.etapa-escura:not([hidden])){background:#0C2317}
.app:has(.etapa-escura:not([hidden])){background:radial-gradient(110% 55% at 50% 18%,#173A27 0,#10301F 50%,#0C2317 100%)}
.app:has(.etapa-escura:not([hidden])) .topo{background:transparent}
.app:has(.etapa-escura:not([hidden])) .voltar,.app:has(.etapa-escura:not([hidden])) .marca,.app:has(.etapa-escura:not([hidden])) .marca-nome{color:#fff}
.app:has(.etapa-escura:not([hidden])) .contador{color:rgb(255 255 255 / .7)}
.app:has(.etapa-escura:not([hidden])) .marca-nome b{color:#D4F06A}
.app:has(.etapa-escura:not([hidden])) .progresso{background:rgb(255 255 255 / .14)}
.app:has(.etapa-escura:not([hidden])) .progresso-cheio{background:#D4F06A}
.etapa-info.etapa-escura{padding:0 2px 6px;gap:0;justify-content:space-between;min-height:calc(100svh - var(--topo) - 4px - 52px);box-sizing:border-box}
.etapa-info.etapa-escura .titulo{color:#fff;font-size:1.78rem;font-weight:800;line-height:1.12;letter-spacing:-.025em;padding-inline:0;margin:14px 0 0;text-wrap:balance}
.etapa-escura .titulo em{font-style:normal;color:var(--lima)}
.etapa-info.etapa-escura .lead{color:var(--claro);font-size:1.08rem;line-height:1.42;margin:8px auto 0;max-width:30ch;padding-inline:0}
.missao-cao{position:relative;margin:0 auto;width:min(250px,64vw)}
.missao-cao img{display:block;width:100%;height:auto}
.missao-brilho{position:absolute;right:-30px;top:12%;width:44px;height:44px;fill:none;stroke:var(--lima);stroke-width:3.2;stroke-linecap:round}
.missao-selo{position:absolute;left:50%;bottom:-6px;translate:-50% 0;display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:999px;background:var(--lima);color:#12301F;font:700 .98rem/1 var(--fonte);white-space:nowrap;box-shadow:0 6px 18px -6px rgb(212 240 106 / .45)}
.missao-selo svg{width:17px;height:17px;stroke-width:3.2}
.missao-tab{margin:16px 0 0;border:1.5px solid rgb(255 255 255 / .28);border-radius:20px;padding:0 14px}
.missao-tab div{display:grid;grid-template-columns:30px 66px 1fr 26px;align-items:center;column-gap:10px;padding:12px 2px;min-height:34px}
.missao-tab div+div{border-top:1px solid rgb(255 255 255 / .16)}
.mi-ic{width:26px;height:26px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mi-fem{display:none}.mi-femea .mi-fem{display:inline}.mi-femea .mi-mac{display:none}
.missao-tab dt{color:var(--claro);font-size:1rem}
.missao-tab dd{margin:0;color:#fff;font-weight:800;font-size:1.12rem;line-height:1.12;overflow-wrap:anywhere}
.missao-tab i{width:26px;height:26px;border-radius:50%;background:var(--lima);color:#12301F;display:grid;place-items:center}
.missao-tab i svg{width:15px;height:15px;stroke-width:3.4}
.etapa-escura .rodape-etapa{margin-top:18px;padding-top:0}
.btn-lima{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;min-height:60px;border-radius:999px;background:linear-gradient(180deg,#DDF57E,#C9EA55);color:#10301F;font-weight:800;font-size:1.2rem;box-shadow:0 0 26px -4px rgb(212 240 106 / .45),inset 0 1px 0 rgb(255 255 255 / .5)}
.mi-chev{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
@media (max-height:700px){.missao-cao{width:150px}.missao-brilho{width:30px;right:-24px}.missao-selo{padding:7px 14px;font-size:.85rem}.etapa-info.etapa-escura .titulo{font-size:1.42rem;margin-top:10px}.etapa-info.etapa-escura .lead{font-size:.92rem;margin-top:4px}.missao-tab{margin-top:10px}.missao-tab div{padding:6px 2px;min-height:28px}.missao-tab dd{font-size:1rem}.btn-lima{min-height:52px}.etapa-escura .rodape-etapa{margin-top:10px}}
.mi-ic{color:#fff;width:28px;height:28px}
.missao-cao{width:min(270px,70vw)}
.etapa-info.etapa-escura .titulo{font-size:2.02rem;line-height:1.1;margin-top:12px}
.etapa-info.etapa-escura .lead{font-size:1.14rem;max-width:25ch;line-height:1.38;margin-top:8px}
.missao-selo{font-size:1.04rem;padding:11px 22px}
.missao-tab{margin-top:14px;padding:0 12px}
.missao-tab div{grid-template-columns:32px 64px 1fr 28px;padding:10px 2px;column-gap:12px}
.missao-tab dt{font-size:1.06rem}.missao-tab dd{font-size:1.22rem;max-width:9.5em}
.missao-tab i{width:28px;height:28px}
.btn-lima{font-size:1.3rem;min-height:62px}
@media (max-height:700px){.missao-cao{width:150px}.etapa-info.etapa-escura .titulo{font-size:1.45rem;margin-top:10px}.etapa-info.etapa-escura .lead{font-size:.95rem;max-width:30ch;margin-top:4px}.missao-selo{padding:7px 14px;font-size:.85rem}.missao-tab{margin-top:8px}.missao-tab div{padding:5px 2px}.missao-tab dd{font-size:1.02rem}.missao-tab dt{font-size:.95rem}.mi-ic{width:24px;height:24px}.missao-tab i{width:24px;height:24px}.btn-lima{min-height:52px;font-size:1.15rem}}
/* v1.63: missao variante I (luz verde + grade no corpo, cão de busto 900x1080) */
html,body{overflow-x:clip}
.etapa-escura .missao-cao{width:min(228px,60vw);isolation:isolate;margin-bottom:-22px}
.etapa-escura .missao-cao + *{margin-top:0}
.etapa-escura .missao-cao img{-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 42%,#000 55%,rgb(0 0 0 / .5) 76%,transparent 100%),linear-gradient(90deg,transparent 0,#000 22%,#000 78%,transparent 100%);-webkit-mask-composite:source-in;mask-image:radial-gradient(ellipse 48% 52% at 50% 40%,#000 52%,rgb(0 0 0 / .45) 74%,transparent 100%),linear-gradient(90deg,transparent 0,#000 24%,#000 76%,transparent 100%);mask-composite:intersect}
.etapa-escura .missao-cao::before{content:"";position:absolute;z-index:-1;inset:-14% -34% 2%;pointer-events:none;background:radial-gradient(60% 30% at 50% 88%,rgb(20 64 38 / .95),transparent),radial-gradient(closest-side,rgb(200 255 120 / .16),transparent 40%),radial-gradient(closest-side,#2E6B45 0%,rgb(46 107 69 / .55) 45%,transparent 100%)}
.etapa-escura .missao-cao::after{content:"";position:absolute;z-index:1;left:0;top:0;width:100%;aspect-ratio:900/1080;pointer-events:none;background:linear-gradient(transparent 50%,#0b3a20 95%);mix-blend-mode:soft-light;-webkit-mask-image:radial-gradient(ellipse 48% 52% at 50% 40%,#000 52%,transparent 90%),linear-gradient(transparent 45%,#000 80%);-webkit-mask-composite:source-in;mask-image:radial-gradient(ellipse 48% 52% at 50% 40%,#000 52%,transparent 90%),linear-gradient(transparent 45%,#000 80%);mask-composite:intersect}
.etapa-escura .missao-cao .missao-selo{bottom:13%;z-index:2}
.etapa-info.etapa-escura .lead{max-width:34ch;text-wrap:balance;margin-left:auto;margin-right:auto}
@media (max-height:700px){.etapa-escura .missao-cao{width:150px}.etapa-info.etapa-escura .lead{max-width:34ch}}

/* v1.64 — revelação (mock do Jaime): tigela com anel, raios e check; cartão lima sobreposto */
.etapa-revelacao.etapa-escura{padding:0 2px 6px;gap:0;justify-content:space-between;min-height:calc(100svh - var(--topo) - 4px - 52px);box-sizing:border-box;text-align:center}
.etapa-revelacao .titulo{color:#fff;font-size:1.86rem;font-weight:800;line-height:1.12;letter-spacing:-.025em;margin:12px 0 0;padding-inline:0;text-wrap:balance}
.etapa-revelacao .titulo em{display:block}
.etapa-revelacao .lead{color:#fff;font-size:1.1rem;line-height:1.4;margin:10px auto 0;max-width:31ch;text-wrap:balance}
.rv-arte{position:relative;margin:14px auto -34px;width:min(250px,64vw);aspect-ratio:640/435;isolation:isolate;z-index:1}
.rv-arte::before{content:"";position:absolute;z-index:-2;inset:-34% -18% -10%;border-radius:50%;background:radial-gradient(closest-side,rgb(200 255 120 / .22),rgb(46 107 69 / .5) 45%,transparent 100%)}
.rv-arte img{position:relative;display:block;width:100%;height:auto;filter:drop-shadow(0 10px 18px rgb(0 0 0 / .35)) drop-shadow(0 0 14px rgb(190 240 90 / .22))}
.rv-anel{position:absolute;z-index:-1;left:50%;top:-28%;width:96%;translate:-50% 0;fill:none;stroke:var(--lima);stroke-width:2.4;filter:drop-shadow(0 0 6px rgb(212 240 106 / .7));-webkit-mask-image:linear-gradient(#000 45%,transparent 72%);mask-image:linear-gradient(#000 45%,transparent 72%)}
.rv-raios{position:absolute;left:-20%;top:-14%;width:50px;height:50px;fill:none;stroke:var(--lima);stroke-width:3.4;stroke-linecap:round;filter:drop-shadow(0 0 4px rgb(212 240 106 / .6))}
.rv-check{position:absolute;right:-10%;top:-16%;width:54px;height:54px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#E4F98C,#B7E043);color:#12301F;display:grid;place-items:center;box-shadow:0 0 22px rgb(212 240 106 / .55),0 0 0 4px rgb(212 240 106 / .18)}
.rv-check svg{width:26px;height:26px;stroke-width:3.6}
.rv-cartao{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;padding:18px;border-radius:999px}
.rv-cartao strong{font:800 1.62rem/1.12 var(--fonte-titulo,inherit);letter-spacing:-.02em}
.rv-cartao span{font-size:1.18rem;line-height:1.3;margin-top:4px;max-width:15em;text-wrap:balance}
.rv-fecho{color:#fff;font-size:1.12rem;line-height:1.45;margin:18px 0 0}
.etapa-revelacao .rodape-etapa{margin-top:16px}
@media (max-height:700px){.etapa-revelacao .titulo{font-size:1.46rem;margin-top:8px}.etapa-revelacao .lead{font-size:.95rem;margin-top:6px}.rv-arte{width:168px;margin:8px auto -24px}.rv-raios{width:36px;height:36px}.rv-check{width:40px;height:40px}.rv-check svg{width:20px;height:20px}.rv-cartao{padding:12px 14px;border-radius:34px}.rv-cartao strong{font-size:1.3rem}.rv-cartao span{font-size:1rem}.rv-fecho{font-size:.98rem;margin-top:10px}.etapa-revelacao .rodape-etapa{margin-top:10px}}
/* v1.64b — mais perto do mock: tigela e cartão maiores, anel atrás da tigela */
.etapa-revelacao .titulo{font-size:2rem}
.etapa-revelacao .lead{font-size:1.2rem;max-width:29ch;margin-top:10px}
.rv-arte{width:min(272px,70vw);margin:44px auto -40px}
.rv-anel{top:-44%;width:104%}
.rv-raios{left:-24%;top:-20%;width:58px;height:58px;stroke-width:3.8}
.rv-check{right:-12%;top:-22%;width:62px;height:62px}
.rv-check svg{width:30px;height:30px}
.rv-cartao{padding:22px 16px;margin-inline:-4px;border-radius:50px}
.rv-cartao strong{font-size:1.9rem}
.rv-cartao span{font-size:1.34rem;line-height:1.25;max-width:12.5em}
.rv-fecho{font-size:1.26rem;margin-top:20px}
.etapa-revelacao .btn-lima{font-size:1.42rem;min-height:66px}
@media (max-height:700px){.etapa-revelacao .titulo{font-size:1.5rem}.etapa-revelacao .lead{font-size:.98rem}.rv-arte{width:176px;margin:28px auto -26px}.rv-raios{width:40px;height:40px}.rv-check{width:44px;height:44px}.rv-check svg{width:22px;height:22px}.rv-cartao{padding:12px 14px;border-radius:36px}.rv-cartao strong{font-size:1.38rem}.rv-cartao span{font-size:1.04rem}.rv-fecho{font-size:1.02rem;margin-top:10px}.etapa-revelacao .btn-lima{font-size:1.2rem;min-height:54px}}
.rv-arte{width:min(262px,68vw);margin:46px auto -24px}
.rv-anel{top:-36%;width:90%}
.rv-raios{left:-13%;top:-14%}
.rv-check{right:-6%;top:-20%}
@media (max-height:700px){.rv-arte{width:172px;margin:34px auto -16px}}
/* v1.65 — anel envolve a tigela (centro no meio da tigela, check sobre a linha) e cartão em pílula como no mock */
.rv-arte{width:min(244px,63vw);margin:62px auto -30px}
.rv-arte::before{inset:-30% -8% 0;background:radial-gradient(closest-side,rgb(212 240 106 / .26),rgb(120 190 70 / .16) 55%,transparent 100%)}
.rv-anel{top:-35%;left:50%;width:118%;translate:-50% 0;stroke-width:2.2;-webkit-mask-image:none;mask-image:none;filter:drop-shadow(0 0 5px rgb(212 240 106 / .75)) drop-shadow(0 0 14px rgb(212 240 106 / .35))}
.rv-check{left:91%;right:auto;top:-9%;translate:-50% -50%;width:58px;height:58px;z-index:2}
.rv-raios{left:-27%;top:-24%;width:54px;height:54px}
.rv-cartao{padding:20px 30px 22px;margin-inline:-6px}
@media (max-height:700px){.rv-arte{width:160px;margin:40px auto -20px}.rv-check{width:40px;height:40px}.rv-raios{width:36px;height:36px}.rv-cartao{border-radius:999px;padding:12px 26px 13px}}
.rv-raios{left:-21%;top:-20%}
/* v1.66 — tigela grande (~70% da tela) com o anel atrás: centro do anel no topo da ração, check sobre a linha, raios fora */
.rv-arte{width:min(272px,70vw);margin:132px auto -22px}
.rv-arte::before{inset:-62% 4% 30%;border-radius:50%;background:radial-gradient(closest-side,rgb(212 240 106 / .28),rgb(120 190 70 / .14) 60%,transparent 100%)}
.rv-anel{top:-70%;left:50%;width:96%;translate:-50% 0}
.rv-check{left:91%;top:-36%;width:64px;height:64px}
.rv-check svg{width:32px;height:32px}
.rv-raios{left:-16%;top:-64%;width:64px;height:64px;stroke-width:3.6}
@media (max-height:700px){.rv-arte{width:176px;margin:86px auto -14px}.rv-check{width:42px;height:42px}.rv-check svg{width:21px;height:21px}.rv-raios{width:42px;height:42px}}
.rv-arte{width:min(258px,66vw);margin:86px auto -26px}
.rv-arte::before{inset:-48% 0 24%}
.rv-anel{top:-44%;width:102%}
.rv-check{left:94%;top:-2%}
.rv-raios{left:-19%;top:-42%}
@media (max-height:700px){.rv-arte{width:176px;margin:58px auto -16px}}
.rv-arte{margin:52px auto -26px}
.rv-arte::before{inset:-22% -2% -8%}
.rv-anel{top:-22%;width:104%}
.rv-check{left:88%;top:-4%}
.rv-raios{left:-17%;top:-22%}
@media (max-height:700px){.rv-arte{margin:34px auto -16px}}
.rv-anel{top:-19%;width:97%}.rv-check{left:87%;top:-2%}
/* v1.67 — tigela = 85% do anel; anel some na metade de baixo (máscara), aro da tigela a 27% do topo do anel */
.rv-arte{margin:46px auto -26px}
.rv-anel{top:-17%;width:118%;-webkit-mask-image:linear-gradient(#000 0,#000 18%,rgb(0 0 0 / .35) 40%,transparent 60%);mask-image:linear-gradient(#000 0,#000 18%,rgb(0 0 0 / .35) 40%,transparent 60%)}
.rv-arte::before{inset:-17% -9% 10%}
.rv-check{left:92%;top:8%}
.rv-raios{left:-22%;top:-20%}
@media (max-height:700px){.rv-arte{margin:32px auto -16px}}
/* v1.68 — W3b aprovado pelo Jaime: cartão escuro translúcido (não confunde com o botão), tigela NA FRENTE do cartão */
.rv-cartao{background:linear-gradient(180deg,rgb(255 255 255 / .2),rgb(255 255 255 / .1));color:#fff;box-shadow:inset 0 0 0 1.5px rgb(255 255 255 / .35),0 10px 30px -10px rgb(0 0 0 / .5)}
.rv-cartao strong{color:#D4F06A}
.rv-arte{z-index:3;margin-bottom:-34px}
.rv-arte::after{content:"";position:absolute;z-index:-1;left:12%;right:12%;bottom:-6px;height:22px;border-radius:50%;background:radial-gradient(closest-side,rgb(0 0 0 / .55),transparent);pointer-events:none}
.rv-cartao{z-index:1;padding-top:32px}
@media (max-height:700px){.rv-arte{margin-bottom:-22px}.rv-cartao{padding-top:20px}}

/* v1.69 — identificação S3c aprovado pelo Jaime: ícone de linha inline (23px, traço 2.6, #376F44; relógio 26px), sem ilustração */
.opcao-linha{min-height:64px;padding:14px 16px;gap:12px}
.opcao-linha .linha-ic{width:23px;height:23px;flex:none;fill:none;stroke:#376F44;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.opcao-linha[data-valor=pouco] .linha-ic{width:26px;height:26px;margin-inline:-1.5px;stroke-width:2.3}
.opcao-linha .opcao-marca{width:28px;height:28px;border-color:#B5C4BA}
.opcao-linha.ativa .opcao-marca{background:#1F6B2A;border-color:#1F6B2A;color:#fff}

/* v1.70 — tempo T2 aprovado pelo Jaime: sem calendário, título + apoio + radio; selecionado igual à identificação */
.opcao-tempo{min-height:68px;padding:12px 16px;gap:12px}
.opcao-tempo.ativa .opcao-marca{background:#1F6B2A;border-color:#1F6B2A;color:#fff}

/* v1.71 — tempo selecionado igual à identificação (valores computados): fundo #E2EEE6, borda 1px #1D6B47, sem sombra; check #1F6B2A/#fff */
.opcao-tempo.ativa{background:#E2EEE6;border-color:#1D6B47;border-width:1px;box-shadow:none}

/* v1.72 — identificação: título + apoio com a mesma tipografia do tempo */
.opcao-linha .idade-txt .opcao-txt{flex:none;font:800 1.125rem/1.2 var(--fonte-titulo);letter-spacing:-.02em;color:#123A1E}
.opcao-linha .tempo-apoio{font-size:.9375rem;line-height:1.3;color:var(--tinta-2)}

/* v1.75 sinais por tema: título + apoio (tipografia do tempo), seleção da identificação, check quadrado da múltipla */
.opcoes-tema{gap:10px}
.opcao-tema{min-height:64px;padding:11px 16px;gap:12px}
.opcao-tema .opcao-txt{font:800 1.125rem/1.2 var(--fonte-titulo);letter-spacing:-.02em;color:#123A1E}
.opcao-tema .tempo-apoio{font-size:.9375rem;line-height:1.3;color:var(--tinta-2)}
.opcao-tema .opcao-marca{width:28px;height:28px;border-radius:7px;border-color:#B5C4BA}
.opcao-tema[aria-pressed="true"]{background:#E2EEE6;border-color:#1D6B47}
.opcao-tema[aria-pressed="true"] .opcao-marca{background:#1F6B2A;border-color:#1F6B2A;color:#fff}
@media (max-height:700px){.opcoes-tema{gap:8px}.opcao-tema{min-height:56px;padding:8px 14px}.opcao-tema .opcao-txt{font-size:1.0625rem}.opcao-tema .tempo-apoio{font-size:.875rem}}

/* v1.75: o Q da Bricolage tem cauda horizontal longa que parece sublinhado (ex.: "Queda de pelo"); só nos títulos das opções por tema usa o Q da DM Sans */
.opcao-tema .q-dm{font-family:var(--fonte);font-weight:800}

/* v1.79 gasto: sem moedas/divisória; título 18/800 + etiqueta (igual hoje) + radio, alinhado e selecionado como tempo/identificação */
.opcao-gasto{min-height:64px;padding:14px 16px;border-radius:var(--raio)}
.opcao-gasto .opcao-txt{font:800 1.125rem/1.2 var(--fonte-titulo);letter-spacing:-.02em}
.opcao-gasto.ativa{background:#E2EEE6;border-color:#1D6B47;border-width:1px;box-shadow:none}
.opcao-gasto .q-dm{font-family:var(--fonte);font-weight:800}
/* v1.79: identificação sem ícones, mesmo padding/altura das opções do tempo */
.opcao-linha{min-height:68px;padding:12px 16px}

/* v1.85 — opções com emoji (preocupacao / significado) */
.opcao-emoji{min-height:64px;gap:12px;padding:12px 14px 12px 12px}
.opcao-emoji-ic{flex:none;width:1.6em;font-size:1.45rem;line-height:1;text-align:center}
.opcao-emoji .opcao-txt{flex:1;font:700 .9375rem/1.3 var(--fonte-titulo);letter-spacing:-.01em;color:#123A1E;text-align:left}
.opcoes-emoji{gap:8px}
@media (max-height:700px){.opcao-emoji{min-height:56px;padding:10px 12px}.opcao-emoji .opcao-txt{font-size:.875rem}}

/* v1.87 — transformacao (prova social após significado) */
.etapa-transformacao.etapa-escura:not([hidden]){padding:0 2px 6px;gap:0;min-height:calc(100svh - var(--topo) - 4px - 52px);box-sizing:border-box;display:flex;flex-direction:column}
.tf-titulo{color:#fff;font:800 clamp(1.55rem,4.2svh,2.05rem)/1.12 var(--fonte-titulo);letter-spacing:-.03em;margin:14px 8px 0;padding:0;text-align:center;text-wrap:balance}
.tf-num{display:inline;color:var(--lima);font-size:1.12em;letter-spacing:-.04em}
.tf-foto{margin:clamp(16px,3.2svh,28px) auto 0;width:min(86%,340px);border-radius:18px;overflow:hidden;box-shadow:0 18px 40px -18px rgb(0 0 0 / .65);border:3px solid rgb(255 255 255 / .18);flex:none}
.tf-foto img{display:block;width:100%;height:auto}
.tf-depo{margin:clamp(14px,2.8svh,22px) 18px 0;padding:14px 16px;border-radius:14px;background:rgb(255 255 255 / .08);border:1px solid rgb(255 255 255 / .12);color:#fff;font:600 clamp(.98rem,2.4svh,1.12rem)/1.45 var(--fonte);text-align:center;text-wrap:pretty}
.etapa-transformacao .rodape-etapa{margin-top:auto;padding-top:clamp(14px,3svh,28px)}
@media (max-height:700px){.tf-titulo{font-size:1.42rem;margin-top:8px}.tf-foto{width:min(72%,280px);margin-top:12px}.tf-depo{margin-top:10px;padding:10px 12px;font-size:.92rem}}

.etapa-decisao .titulo,.etapa-carregando .titulo{font-size:var(--titulo-q);font-weight:800;line-height:1.15;letter-spacing:-.03em}
.opcoes-decisao{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.opcao-decisao{min-height:64px;justify-content:center;font:800 1.1rem/1.2 var(--fonte-titulo)}
.etapa-oferta .ponte{margin:8px 0 16px;color:var(--tinta);font:500 1rem/1.45 var(--fonte)}
/* oferta — 4 itens de “O que você recebe” como timeline vertical */
.entregas-tl{position:relative}
.entregas-tl li{position:relative;grid-template-columns:18px 1fr;gap:16px;align-items:start;padding:0 0 28px;border:none}
.entregas-tl li:last-child{padding-bottom:0;border:none}
.entregas-tl li:not(:last-child)::before{content:"";position:absolute;left:8px;top:13px;bottom:-13px;width:2px;background:#C5D2C8;pointer-events:none}
.entregas-tl .entrega-dot{width:18px;height:18px;margin-top:4px;border-radius:50%;background:#fff;border:3px solid var(--cenoura);box-sizing:border-box;position:relative;z-index:1}
.entregas-tl h3{margin-bottom:6px}

/* oferta — tarja de aviso no topo + título/sub */
.oferta-aviso{display:flex;align-items:center;justify-content:space-between;gap:12px;position:fixed;top:0;left:0;right:0;width:100%;max-width:none;margin:0;padding:calc(12px + env(safe-area-inset-top)) max(16px,calc((100% - 560px) / 2 + 16px)) 12px;background:#C51E36;color:#fff;z-index:25;box-sizing:border-box;box-shadow:0 6px 14px -10px rgb(22 37 28 / .4)}
.app:has(.etapa-oferta:not([hidden])) .topo,.app:has(.etapa-oferta:not([hidden])) .progresso{display:none}
.app:has(.etapa-oferta:not([hidden])) .palco{padding-top:0}
.etapa-oferta{padding-top:calc(88px + env(safe-area-inset-top))}
.oferta-aviso-timer{display:flex;align-items:center;gap:8px;margin:0;font:800 1.25rem/1 var(--fonte-titulo);letter-spacing:-.02em;font-variant-numeric:tabular-nums;flex:none}
.oferta-aviso-timer .ic{width:22px;height:22px;stroke-width:1.85;flex:none}
.oferta-aviso-tit{margin:0;flex:1;font:700 .875rem/1.35 var(--fonte);text-wrap:pretty}
.oferta-topo{display:grid;gap:10px;justify-items:center;text-align:center}
.etapa-oferta .oferta-topo .titulo{font-weight:800;letter-spacing:-.03em}
.oferta-salvo-sub{margin:0;max-width:34ch;text-wrap:balance}

/* v1.90 — classificador r7 (compacto) */
.etapa-resultado{gap:0;padding:8px 0 24px}
.etapa-resultado .clf{display:flex;flex-direction:column;gap:0;padding:0}
.clf-pagina{font:800 1.625rem/1.15 var(--fonte-titulo);letter-spacing:-.025em;text-align:center;margin:4px 4px 18px;color:#132c21}
.clf-painel{background:#fff;border-radius:21px;padding:20px 17px 0;box-shadow:0 4px 22px #193e2b0b;overflow:hidden}
.clf-titulo{font:800 1.15rem/1.2 var(--fonte-titulo);margin:0;color:#153c25;letter-spacing:-.02em}
.clf-gauge{margin-top:42px}
.clf-barra{position:relative;height:9px;border-radius:99px;background:linear-gradient(90deg,#7dd3fc,#4ade80 28%,#facc15 55%,#fb923c 78%,#ef4444);box-shadow:none}
.clf-knob{position:absolute;top:50%;width:23px;height:23px;translate:-50% -50%;border-radius:50%;background:#fff;border:3px solid #d72e46;box-shadow:none}
.clf-tip{position:absolute;bottom:calc(100% + 15px);translate:-50% 0;padding:5px 11px;border-radius:7px;background:#ffe1e5;color:#742b37;font:800 .75rem/1.2 var(--fonte);white-space:nowrap}
.clf-tip::after{content:"";position:absolute;left:50%;top:100%;translate:-50% 0;border:6px solid transparent;border-top-color:#ffe1e5}
.clf-labels{display:flex;justify-content:space-between;gap:6px;margin-top:12px;font:800 .78rem/1.2 var(--fonte);color:#486052}
.clf-labels span{white-space:nowrap}
.clf-labels span:nth-child(1){color:#12803d}
.clf-labels span:nth-child(2){color:#5c690a}
.clf-labels span:nth-child(3){color:#a84d07}
.clf-labels span:nth-child(4){color:#c51e36}
.clf-alerta{display:flex;gap:9px;margin-top:16px;padding:12px 11px;border-radius:11px;background:#fff0f1;border:1px solid #e46171;color:#392c30}
.clf-alerta-ic{flex:none;font:800 2rem/1 var(--fonte-titulo);color:#cc233b}
.clf-alerta-tit{font:800 1rem/1.2 var(--fonte-titulo);margin:0 0 6px;color:#782638}
.clf-alerta p{margin:0;font:500 .8rem/1.5 var(--fonte);color:#392c30}
.clf-resumo{display:grid;grid-template-columns:minmax(0,1fr) 113px;gap:3px;align-items:end;margin-top:17px}
.clf-resumo dl{margin:0;padding-bottom:17px;position:relative;z-index:1}
.clf-resumo dl>div+div{margin-top:16px}
.clf-resumo dt{font-size:.75rem;color:#5c6c62;margin:0 0 6px;font-weight:500}
.clf-resumo dd{display:block;margin:0;padding:0;font:800 .95rem/1.23 var(--fonte-titulo);color:#133c28}
.clf-resumo dd span{display:block}
.clf-resumo img{width:130px;max-width:none;height:auto;justify-self:center;align-self:end}
.clf-aviso{font-size:.66rem;color:#52665a;line-height:1.45;margin:12px 8px 0}
.etapa-resultado .rodape-etapa{margin-top:18px}
@media (max-width:380px){
  .clf-resumo{grid-template-columns:minmax(0,1fr) 106px}
  .clf-resumo img{width:120px}
  .clf-resumo dd{font-size:.875rem}
  .clf-alerta-tit{font-size:.95rem}
}
@media (max-height:700px){
  .clf-pagina{margin-bottom:12px}
  .clf-gauge{margin-top:34px}
  .clf-resumo dl>div+div{margin-top:12px}
}

/* v1.91 — fundo cinza resultado (paridade r7) */
/* Causa: .app era #fff (coluna do quiz), card .clf-painel #fff → branco sobre branco. */
.app:has(.etapa-resultado:not([hidden])),
.app:has(.etapa-resultado:not([hidden])) .topo{
  background:#f4f6f8;
}
.etapa-resultado{
  background:#f4f6f8;
}
.clf-painel{
  background:#fff;
  border-radius:21px;
  box-shadow:0 4px 22px #193e2b0b;
}


/* Agora vs Meta — approved standalone, isolated from the result and questions. */
.etapa-agora-meta{
  --fundo:#F3F6F2;
  --painel:#E8EEF0;
  --superficie:#FFFFFF;
  --tinta:#16251C;
  --tinta-2:#4B5B51;
  --linha:#D8E2DA;
  --marca:#1D6B47;
  --marca-forte:#14553A;
  --cenoura:#E9803A;
  --agora-bg:#FDECEF;
  --agora-tinta:#B4233A;
  --meta-bg:#E3F3E8;
  --meta-tinta:#1D6B47;
  --ruim:#E23B4A;
  --bom:#22A45D;
  --fonte-titulo:"Bricolage Grotesque","DM Sans",system-ui,sans-serif;
  --fonte:"DM Sans",system-ui,sans-serif;
  --raio:16px;

  gap:0;flex:none;color:var(--tinta);font:400 1rem/1.5 var(--fonte);}
.etapa-agora-meta .titulo{
  margin:8px 0 12px;
  text-align:center;
  font:800 1.75rem/1.15 var(--fonte-titulo);
  letter-spacing:-.03em;
  color:#121f18;
}
.etapa-agora-meta .sub{
  margin:0 0 14px;
  text-align:center;
  font:400 1rem/1.5 var(--fonte);
  color:var(--tinta-2);
}
.etapa-agora-meta .sub strong{font-weight:700;color:inherit}
.etapa-agora-meta .produto{
  margin:0 0 12px;
  text-align:center;
  font:800 1.02rem/1.3 var(--fonte-titulo);
  color:#121f18;
  letter-spacing:-.015em;
}

.etapa-agora-meta .checks{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:10px}
.etapa-agora-meta .checks li{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font:500 .88rem/1.4 var(--fonte);color:var(--tinta)}
.etapa-agora-meta .check{
  width:22px;height:22px;border-radius:50%;background:var(--marca);display:grid;place-items:center;margin-top:1px;
}
.etapa-agora-meta .check svg{width:13px;height:13px;stroke:#fff;fill:none;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}

.etapa-agora-meta .comparador{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:0 0 16px;
  padding:0;
  background:none;
  align-items:stretch;
}
.etapa-agora-meta .card{
  background:var(--superficie);
  border-radius:14px;
  padding:10px 8px 12px;
  box-shadow:0 4px 16px -10px rgb(22 37 28 / .28);
  display:flex;
  flex-direction:column;
  min-width:0;
}
.etapa-agora-meta .badge{
  align-self:center;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 12px;
  border-radius:999px;
  font:800 .72rem/1.1 var(--fonte);
  margin-bottom:8px;
  white-space:nowrap;
}
.etapa-agora-meta .badge-agora{background:var(--agora-bg);color:var(--agora-tinta)}
.etapa-agora-meta .badge-meta{background:var(--meta-bg);color:var(--meta-tinta)}

.etapa-agora-meta .foto{margin:0 0 10px;border-radius:10px;overflow:hidden;background:#eef1ef;aspect-ratio:1/1}
.etapa-agora-meta .foto img{width:100%;height:100%;object-fit:cover;object-position:center top}

.etapa-agora-meta .metricas{list-style:none;margin:0;padding:2px 2px 0;display:grid;gap:14px}
.etapa-agora-meta .met-lab{
  display:block;
  font:400 .72rem/1.25 var(--fonte);
  color:#1a241e;
}
.etapa-agora-meta .met-val{
  display:block;
  font:700 .8rem/1.2 var(--fonte);
  color:#121a16;
  margin:1px 0 7px;
}
.etapa-agora-meta .barras{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;height:8px}
.etapa-agora-meta .barras i{display:block;height:100%;border-radius:999px;background:#E6E8EA}
.etapa-agora-meta .barras-ruim i.on{background:#E23B4A}
.etapa-agora-meta .barras-bom i.on{background:#22C55E}

.etapa-agora-meta .seta{
  position:absolute;
  left:50%;
  top:128px;
  translate:-50% -50%;
  width:36px;height:36px;
  z-index:2;
  filter:drop-shadow(0 4px 8px rgb(20 85 58 / .35));
  pointer-events:none;
}
.etapa-agora-meta .seta svg{width:100%;height:100%;display:block}

.etapa-agora-meta .exemplo{
  margin:10px 0 14px;
  text-align:center;
  font:500 .72rem/1.3 var(--fonte);
  color:#7a8a7f;
}

.etapa-agora-meta .cta{
  position:relative;
  width:100%;
  min-height:64px;
  padding:12px 16px;
  border:0;
  border-radius:14px;
  background:linear-gradient(180deg,#248A58 0%, var(--marca) 55%, var(--marca-forte) 100%);
  color:#fff;
  box-shadow:0 10px 22px -12px rgb(20 85 58 / .75);
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:10px;
  cursor:pointer;
  text-align:center;
  font:700 1.125rem/1.2 var(--fonte);
}
.etapa-agora-meta .cta .mi-chev{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}

@media (max-width:374px){
  .etapa-agora-meta{padding-left:0;padding-right:0}
  .etapa-agora-meta .met-lab{font-size:.68rem}
  .etapa-agora-meta .met-val{font-size:.74rem}
  .etapa-agora-meta .titulo{font-size:1.75rem}
}

body:has(.etapa-agora-meta:not([hidden])),
.app:has(.etapa-agora-meta:not([hidden])),
.app:has(.etapa-agora-meta:not([hidden])) .topo{background:#F3F6F2}
.app:has(.etapa-agora-meta:not([hidden])){max-width:430px}
.app:has(.etapa-agora-meta:not([hidden])) .topo{position:static;height:48px}
.app:has(.etapa-agora-meta:not([hidden])) .marca{color:#1D6B47}
.app:has(.etapa-agora-meta:not([hidden])) .marca-nome{color:#16251C}
.app:has(.etapa-agora-meta:not([hidden])) .marca-nome b{color:#1D6B47}
.app:has(.etapa-agora-meta:not([hidden])) .palco{padding:4px 16px calc(28px + env(safe-area-inset-bottom))}
.app:has(.etapa-agora-meta:not([hidden])) .progresso{display:none}
.etapa-agora-meta .titulo{text-wrap:wrap}
.etapa-agora-meta .foto{position:relative;overflow:visible}
.etapa-agora-meta .foto img{position:absolute;inset:0;border-radius:10px}
.etapa-agora-meta .seta{left:calc(100% + 12px);top:50%}

/* 08/11/2026 — montando-plano: o plano sendo montado depois do Sim/Não, antes da oferta */
.etapa-montando{justify-content:flex-start;padding-top:4px}
.montando{display:flex;flex-direction:column;align-items:center;gap:0;width:100%;max-width:440px;margin:0 auto}
.mp-contador{position:relative;width:104px;height:104px;display:grid;place-items:center;margin-bottom:22px}
.mp-contador svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.mp-trilho{fill:#fff;stroke:var(--marca-suave);stroke-width:7}
.mp-arco{fill:none;stroke:var(--marca);stroke-width:7;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--p,0) * 100)}
.mp-num{position:relative;font:800 1.5rem/1 var(--fonte-titulo);letter-spacing:-.02em;color:#123A1E;font-variant-numeric:tabular-nums}
.etapa-montando .titulo{font-size:var(--titulo-q);font-weight:800;line-height:1.15;letter-spacing:-.03em;color:#123A1E;text-align:center;text-wrap:balance}
.mp-sub{margin:8px 0 22px;text-align:center;font-size:1rem}
.mp-status{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mp-passos{list-style:none;margin:0;padding:0;width:100%;display:grid;--mp-vao:12px;gap:var(--mp-vao);text-align:left}
.mp-passo{position:relative;display:flex;align-items:center;gap:14px;padding:14px 16px;min-height:78px;background:var(--superficie);border:1.5px solid var(--linha);border-radius:var(--raio);transition:border-color .35s var(--ease),box-shadow .35s var(--ease)}
/* linha do tempo: atrás dos cards, visível só no vão */
.mp-passo:not(:last-child)::after{content:"";position:absolute;left:33px;top:100%;height:var(--mp-vao);width:2px;background:var(--linha);transition:background .35s var(--ease)}
.mp-passo[data-estado="feito"]:not(:last-child)::after{background:var(--marca)}
.mp-marca{position:relative;flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--linha);background:#fff;color:var(--tinta-2);font:800 1rem/1 var(--fonte-titulo);transition:background .3s,border-color .3s}
.mp-marca>*{grid-area:1/1}
.mp-spin,.mp-check{width:36px;height:36px;opacity:0;transition:opacity .2s}
.mp-spin{position:absolute;inset:-2px;width:36px;height:36px}
.mp-spin circle{fill:none;stroke:var(--marca);stroke-width:3;stroke-linecap:round;stroke-dasharray:62 100}
.mp-check{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.mp-corpo{min-width:0}
.mp-tit{margin:0;font:700 1.0625rem/1.25 var(--fonte-titulo);letter-spacing:-.015em;color:var(--tinta-2);transition:color .3s}
.mp-txt{margin:3px 0 0;font:500 .9375rem/1.35 var(--fonte);color:var(--tinta-2);overflow-wrap:anywhere}
/* ativo: anel girando, texto forte, card em destaque */
.mp-passo[data-estado="ativo"]{border-color:var(--marca);box-shadow:0 10px 24px -16px rgb(20 85 58 / .55)}
.mp-passo[data-estado="ativo"] .mp-marca{border-color:var(--marca-suave)}
.mp-passo[data-estado="ativo"] .mp-n{opacity:0}
.mp-passo[data-estado="ativo"] .mp-spin{opacity:1;animation:mp-gira .9s linear infinite}
.mp-passo[data-estado="ativo"] .mp-tit{color:#123A1E}
.mp-passo[data-estado="ativo"] .mp-txt{color:var(--tinta)}
/* feito: check verde */
.mp-passo[data-estado="feito"] .mp-marca{background:var(--marca);border-color:var(--marca)}
.mp-passo[data-estado="feito"] .mp-n{opacity:0}
.mp-passo[data-estado="feito"] .mp-check{opacity:1}
.mp-passo[data-estado="feito"] .mp-tit{color:#123A1E}
.mp-passo[data-estado="feito"] .mp-txt{color:var(--tinta)}
@keyframes mp-gira{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){
  .mp-passo,.mp-marca,.mp-tit,.mp-spin,.mp-check,.mp-passo::after{transition:none}
  .mp-passo[data-estado="ativo"] .mp-spin{animation:none}
}

/* 09/11/2026: “O que está incluso” em cards (referência do Jaime) */
.h2-centro{text-align:center}
.entregas-cards{display:grid;gap:12px}
.entregas-cards li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:start;padding:16px 16px 18px;background:#F8F8F7;border:1px solid #E6E8E4;border-radius:16px}
.entregas-cards li:last-child{border-bottom:1px solid #E6E8E4}
.entregas-cards .entrega-emoji{font-size:1.5rem;line-height:1.15;text-align:center}
.entregas-cards h3{margin-bottom:6px}

/* 09/11/2026: card do cupom (referência do Jaime) */
.cupom{margin:0;grid-template-columns:minmax(0,1fr);background:#EEFBF6;border-radius:20px;padding:18px 14px 16px;display:grid;gap:14px}
.cupom-tit{margin:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;font:700 1.125rem/1.2 var(--fonte-titulo);color:var(--tinta);letter-spacing:-.01em}
.cupom-selo{background:#4FA584;color:#fff;border-radius:10px;padding:5px 10px;font:800 1.125rem/1 var(--fonte-titulo)}
.cupom-corpo{display:flex;align-items:center;gap:10px;border-top:3px dotted #CFEFE2;padding-top:14px}
.cupom-codigo{flex:1;min-width:0;margin:0;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#fff;border:1px solid #E1E5E2;border-radius:14px;padding:0 10px 0 12px;min-height:56px;font:600 .875rem/1.2 var(--fonte);color:var(--tinta)}
.cupom-codigo span{min-width:0;overflow-wrap:anywhere;line-height:1.25;padding:8px 0}
.cupom-ok{flex:none;width:22px;height:22px;fill:none;stroke:#4FA584;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.cupom-timer{flex:none;display:flex;align-items:flex-start;gap:4px;color:#4FA584}
.cupom-timer p{margin:0;display:grid;justify-items:center}
.cupom-timer strong{font:800 1.75rem/1 var(--fonte-titulo);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.cupom-timer p span{font-size:.6875rem;color:var(--tinta-2);margin-top:4px}
.cupom-sep{font:800 1.25rem/1.25 var(--fonte-titulo);color:#A9DCC7}

/* 09/11/2026: tarja com contador (esquerda) e botão (direita) */
.aviso-timer{flex:none;display:flex;align-items:flex-start;gap:4px;color:#fff}
.aviso-timer p{margin:0;display:grid;justify-items:center}
.aviso-timer strong{font:800 1.75rem/1 var(--fonte-titulo);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.aviso-timer p span{font-size:.6875rem;margin-top:3px;opacity:.9}
.aviso-sep{font:800 1.25rem/1.3 var(--fonte-titulo);opacity:.6}
.aviso-btn{flex:none;min-height:48px;padding:0 22px;border:0;border-radius:999px;background:#fff;color:#C51E36;font:800 .9375rem/1 var(--fonte-titulo);text-transform:uppercase;letter-spacing:.01em;cursor:pointer;box-shadow:0 4px 12px -6px rgb(0 0 0 / .35)}
.aviso-btn:active{transform:scale(.98)}
.etapa-oferta #oferta{scroll-margin-top:calc(88px + env(safe-area-inset-top))}
/* a tarja fixa fica presa à etapa se ela tiver transform; aqui a entrada é só por opacidade */
.etapa-oferta.entra,.etapa-oferta.entra-volta{animation-name:oferta-fade}
@keyframes oferta-fade{from{opacity:.001}to{opacity:1}}
/* 09/11/2026: garantia de 30 dias em card só com contorno */
.garantia-card{grid-template-columns:96px 1fr;gap:18px;align-items:center;padding:20px 18px;border:1px solid #E1E5E2;border-radius:20px;background:transparent}
.garantia-card img{width:96px;height:96px}
.garantia-card p{margin:0;color:var(--tinta-2);font:500 1rem/1.5 var(--fonte);text-wrap:pretty}
.etapa-oferta .garantia-card{margin-top:16px;margin-bottom:20px}
.destaque-verde{color:var(--marca)}
/* 09/11/2026: dúvidas dentro de um card arredondado */
.etapa-oferta .faq{background:#F7F5F3;border-radius:20px;overflow:hidden}
.etapa-oferta .faq details{border-top:1px solid #E7E3DF}
.etapa-oferta .faq details:first-child{border-top:0}
.etapa-oferta .faq details:last-child{border-bottom:0}
.etapa-oferta .faq summary{min-height:64px;padding:18px 20px}
.etapa-oferta .faq details p{padding:0 58px 20px 20px}
.entregas-cards.entregas-bonus li{grid-template-columns:28px 1fr}