@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500;1,600&family=Manrope:wght@400;500;600;700&display=swap");
/* ══════════════════════════════════════════════════════════════════
   TEMA 4 · MINIMALISTA / LUXO
   Editorial e sofisticado: marfim, preto e bronze; serifada de alto
   contraste nos titulos, sans refinada no texto; sem sombras, so fios
   finos; muito respiro; etapas como paginas de revista (sem cards);
   opcoes em lista A/B/C; botoes pretos retos com espacamento largo;
   movimento discreto (fade).
   ══════════════════════════════════════════════════════════════════ */
:root{
  --background:#F6F2EA;
  --background-image:none;
  --surface:#FBF8F2;
  --surface-2:#F1EBDF;
  --surface-3:#E7DFD0;
  --text:#141210;
  --text-2:#3D3832;
  --text-muted:#857C70;
  --border:#E2D9C9;
  --border-strong:#CBBFAA;
  --primary:#141210;
  --secondary:#A07D4F;
  --accent:#A07D4F;
  --grad:linear-gradient(#141210,#141210);
  --on-primary:#F6F2EA;
  --success:#3E6B52;
  --on-success:#F6F2EA;
  --danger:#8E2A2A;
  --warning:#7A5A12;
  --info:#2F4A6B;
  --focus:rgba(160,125,79,.55);
  --confete:#A07D4F,#C9A876,#141210,#E2D9C9,#7A5A3A;

  --radius-sm:2px;
  --radius:2px;
  --radius-lg:4px;
  --radius-pill:2px;
  --shadow-sm:none;
  --shadow:none;
  --shadow-lg:none;
  --shadow-cta:none;

  --font:"Manrope",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --font-mono:"Manrope",-apple-system,sans-serif;
  --w-display:600;
  --w-strong:700;
  --ls-display:-.005em;
  --t-h1:clamp(2.2rem,10vw,3rem);
  --t-h2:clamp(1.85rem,8.4vw,2.45rem);
  --t-h3:clamp(1.35rem,6vw,1.65rem);
  --t-body:clamp(1rem,3.9vw,1.0625rem);

  --entra:surgeSuave;
  --transition:.3s ease;
  --topo-bg:rgba(246,242,234,.92);
  --topo-border:#E2D9C9;
  --bar-h:1px;
  --bar-track:#E2D9C9;
  --bar-fill:#141210;
  --etapa-bg:transparent;
  --etapa-border:transparent;
  --etapa-shadow:none;
  --etapa-radius:0;
  --etapa-mx:0px;
  --etapa-gap:0px;
  --etapa-pad:var(--s8) 28px;
  --op-bg:transparent;
  --op-border:transparent;
  --op-radius:0;
  --op-shadow:none;
  --op-sel-bg:#EFE7D8;
  --btn-radius:2px;
  --btn-h:60px;
  --btn-tt:uppercase;
  --btn-ls:.22em;
  --btn-weight:600;
  --card-bg:#FBF8F2;
  --card-border:#E2D9C9;
  --img-radius:2px;
  --img-border:#E2D9C9;
  --pergunta-cor:#141210;
  --marca-texto:transparent;
  --timer-bg:transparent;
  --timer-color:#141210;
  --player-bg:#141210;
  --up-bg:#141210;
  --up-gold:#C9A876;
  --up-gold-2:#A07D4F;
  --up-ink:#141210;
  --up-text:#F6F2EA;
}

/* fundo: uma moldura fina fixa nas telas grandes */
@media (min-width:768px){
  .fundo{display:block}
  .fundo span:nth-child(1){inset:18px;border:1px solid rgba(160,125,79,.35)}
  .fundo span:nth-child(n+2){display:none}
}

/* topo editorial: nome em versalete, contador 03 — 19, linha de 1px */
.topo{backdrop-filter:none;-webkit-backdrop-filter:none;padding-block:14px 0}
.marca{font-family:var(--font);font-weight:600;font-size:.6875rem;letter-spacing:.32em;text-transform:uppercase;color:var(--text)}
.marca-av{display:none}
.passo{font-family:var(--font);font-size:.6875rem;letter-spacing:.2em;color:var(--text-muted)}
.passo b{color:var(--secondary);font-weight:600}
.barra{margin:14px calc(var(--pad) * -1) 0;border-radius:0}
.barra i{border-radius:0}
.barra i::after{display:none}

/* etapas como paginas: fio fino entre elas, muito respiro */
.page{max-width:620px}
#quiz{padding-top:0}
.etapa + .etapa{border-top:1px solid var(--border)}
.etapa > * + *{margin-top:var(--s5)}
.no{position:static;transform:none;display:flex;align-items:center;justify-content:center;gap:14px;min-width:0;height:auto;margin:0 auto var(--s5)!important;
  padding:0;background:none;color:var(--secondary);box-shadow:none;border-radius:0;font-family:var(--font-display);font-style:italic;font-weight:500;font-size:1.0625rem;letter-spacing:.04em}
.no::before,.no::after{content:"";width:36px;height:1px;background:var(--secondary);opacity:.6}
.etapa.entra .no{animation:surgeSuave .8s ease both}
.etapa.entra > :not(.no){animation-duration:.9s}
.h1,.h2,.h3{font-weight:600;color:var(--text)}
.h1{line-height:1.02}
.h2{line-height:1.08}
.h3{font-weight:600;line-height:1.22}
.h1.neg,.h2.neg,.h3.neg{font-style:italic}
.pergunta{font-family:var(--font-display);font-style:italic;font-weight:500;font-size:var(--t-h3);color:var(--text-2);max-width:28ch}
.pergunta span{background:none}
.pergunta::after{content:"";display:block;width:48px;height:1px;margin:var(--s4) auto 0;background:var(--secondary)}
.tx{font-weight:400;color:var(--text-2)}
.tx b,.tx strong{font-weight:600}
.sm{font-style:italic}
.neg{color:var(--danger)} .pos{color:var(--success)}
.destaque{background:none;color:var(--secondary);padding:0;font-style:italic;border-bottom:1px solid var(--secondary);border-radius:0}
img.emj{filter:grayscale(1) contrast(1.05);opacity:.85}

/* opcoes: lista editorial A / B / C, sem icones */
.opcoes{counter-reset:op;gap:0;border-top:1px solid var(--border-strong)}
.op{grid-template-columns:34px minmax(0,1fr) 22px;min-height:68px;padding:16px 4px;border:0;border-bottom:1px solid var(--border-strong);text-align:left;
  transition:background .3s ease,padding .3s ease,opacity .3s}
.op::before{counter-increment:op;content:counter(op,upper-alpha);display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--border-strong);border-radius:50%;
  font-family:var(--font-display);font-style:italic;font-weight:600;font-size:1rem;color:var(--secondary);transition:background .3s,color .3s,border-color .3s}
.op .ico{display:none}
.op .rot{font-family:var(--font);font-weight:500;font-size:1.0313rem;color:var(--text);letter-spacing:.005em}
.op .seta{width:22px;height:22px;border:0;background:none;color:var(--text-muted)}
.etapa.viva .opcoes:not(.ok) .seta svg{animation:none}
@media (hover:hover){
  .opcoes:not(.ok) .op:hover{transform:none;box-shadow:none;background:#EFE7D8;padding-left:12px}
  .opcoes:not(.ok) .op:hover::before{background:var(--text);border-color:var(--text);color:var(--background)}
  .opcoes:not(.ok) .op:hover .seta{background:none;color:var(--text)}
}
.op:active{transform:none}
.onda{background:rgba(160,125,79,.15)}
.opcoes.ok .op{transform:none;opacity:.35}
.opcoes.ok .op.sim{opacity:1;box-shadow:none;border-color:var(--border-strong);padding-left:12px}
.opcoes.ok .op.sim::before{background:var(--text);border-color:var(--text);color:var(--background)}
.opcoes.ok .op.sim .seta{background:none;color:var(--secondary);animation:none}

/* botoes: retangulo preto, versalete espacado, sem brilho */
.btn{font-family:var(--font);font-size:.8125rem;transition:background .3s ease,color .3s ease,opacity .35s}
.btn::after{display:none}
.btn svg{animation:none;width:16px;height:16px}
@media (hover:hover){.btn:hover{transform:none;filter:none;background:var(--secondary)}}
.btn:active{transform:none;opacity:.85}
.btn.respira,.btn.gerar,.btn.final,.btn.up-sim,.btn.whats{animation:none}

/* imagens e provas: molduras finas */
.foto{box-shadow:none;background:var(--surface-2)}
.foto.brilho::after{display:none}
.lupa{background:rgba(20,18,16,.75);border-radius:2px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;font-size:.6875rem}
.caso{background:transparent;border:0;border-top:1px solid var(--border);border-radius:0;padding:var(--s5) 0 0}
.caso-nome{font-family:var(--font-display);font-style:italic;font-weight:600;font-size:1.25rem}
.estrelas img.emj{filter:none;opacity:1;width:.9em;height:.9em}
.autoriza{border:0;border-top:1px solid var(--secondary);border-bottom:1px solid var(--secondary);border-radius:0;background:none;font-family:var(--font-display);
  font-size:1.0625rem;font-weight:500;letter-spacing:.01em;text-transform:none;padding:var(--s4) 0}
.perfil{border-radius:2px}
.perfil .tipo{font-family:var(--font);font-weight:600;font-size:.75rem;letter-spacing:.3em}
.perfil--fraco .tipo{background:#6F6355}
.perfil--forte .tipo{background:var(--text)}
.perfil--fraco{border-color:var(--border-strong)}.perfil--forte{border-color:var(--text)}
.valores{gap:0;border-top:1px solid var(--border-strong)}
.valores p{background:none;border:0;border-bottom:1px solid var(--border-strong);border-radius:0;color:var(--text);font-family:var(--font-display);
  font-weight:600;font-size:1.25rem;font-style:italic;padding:14px 0}
.emoji-linha{font-size:1.2rem}
.recorte img{filter:none}

/* VSL + timer: numeros grandes em serifa, sem caixas */
.player{padding:0;border-radius:2px}
.player-tag{font-family:var(--font);font-weight:500;font-size:.6875rem;letter-spacing:.24em;text-transform:uppercase;padding:14px 12px}
.player-tag .play{animation:none;width:22px;height:22px}
.vsl{border-radius:0}
.fb-play{animation:none}
.timer-card{background:none;border:0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);border-radius:0;padding:var(--s5) 0}
.timer-rot{font-family:var(--font);font-weight:600;font-size:.6875rem;letter-spacing:.3em;color:var(--secondary)}
.relogio .cx{width:auto;height:auto;padding:0 6px;background:none}
.relogio .n{font-family:var(--font-display);font-weight:500;font-size:3.6rem}
.relogio .u{font-family:var(--font);font-size:.625rem;letter-spacing:.3em;opacity:1;color:var(--text-muted)}
.relogio .dp{font-family:var(--font-display);font-weight:400;font-size:3rem;color:var(--secondary);animation:none;margin-top:-18px}
.relogio.zerou .cx{background:none;color:var(--success)}
.linha-tempo{height:1px;max-width:160px;background:var(--border)}
.linha-tempo i{background:var(--text)}

/* oferta: convite impresso */
.oferta > * + *{margin-top:var(--s7)}
.parabens{background:var(--surface);border:1px solid var(--secondary);outline:1px solid var(--secondary);outline-offset:-8px;padding:var(--s8) var(--s5)}
.parabens::before{display:none}
.cadeado{background:none;color:var(--secondary);border:1px solid var(--secondary);box-shadow:none}
.parabens p{color:var(--text);font-weight:600}
.parabens .a{font-family:var(--font);font-size:.75rem;letter-spacing:.32em;font-weight:600}
.parabens .big{font-style:italic;font-weight:500;color:var(--secondary);font-size:clamp(5rem,26vw,7rem);animation:none}
.parabens .c{font-style:italic;font-weight:500}
.oferta.entra .cadeado{animation:surgeSuave .8s ease .1s both}
.bonus-lista{gap:0}
.bonus{background:none;border:0;border-top:1px solid var(--border);border-radius:0;padding:var(--s6) 0}
.bonus-n{background:none;color:var(--secondary);padding:0;font-family:var(--font-display);font-style:italic;font-size:1.125rem;letter-spacing:.06em;text-transform:none;font-weight:600}
.bonus .foto{max-width:240px}
.preco-bonus{font-family:var(--font);font-weight:500;font-size:.9375rem}
.velho{color:var(--text-muted)}
.velho::after{background:var(--text-muted);height:1px}
.gratis{background:none;color:var(--success);padding:0 0 1px;border-bottom:1px solid var(--success);border-radius:0;animation:none;font-weight:700;letter-spacing:.06em}
.selo{background:none;color:var(--text);border:1px solid var(--text);outline:0;transform:none;font-family:var(--font);font-weight:600;font-size:.75rem;letter-spacing:.28em;padding:14px 20px}
.oferta.entra .selo{animation:surgeSuave .8s ease .4s both}
.faixa{font-family:var(--font-display);font-style:italic;font-weight:600;color:var(--text);padding:0}
.faixa.azul-bg{background:none}
.pacote{background:var(--surface);border:1px solid var(--text)}
.pacote-cab{background:var(--text);color:var(--background);padding:var(--s6) var(--s5)}
.pacote-cab h3{font-weight:600;font-size:var(--t-h3)}
.pacote-cab::after{display:none}
.quadro-rot{font-family:var(--font);font-weight:600;letter-spacing:.3em;font-size:.6875rem}
.quadro-rot.bx{color:var(--secondary)}
.quadro-rot.bx::before,.quadro-rot.bx::after{background:var(--border)}
.itens li{font-weight:400}
.itens li::before{width:16px;height:16px;top:14px;border-radius:0;background:none;border-bottom:1px solid var(--secondary);border-left:1px solid var(--secondary);
  transform:rotate(-45deg) scale(.7,.45);transform-origin:center}
.bx-lista{background:none;border:0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);border-radius:0;padding:var(--s3) 0}
.bx-lista li + li{border-top:1px solid var(--border)}
.bx-lista .n{border:1px solid var(--border-strong);border-radius:50%;background:none}
.bx-lista .t{font-weight:500}
.bx-lista .azul{color:var(--text);font-weight:700}
.oferta.entra .itens li,.oferta.entra .bx-lista li{animation:surgeSuave .8s ease both}
.fecho{background:none;border-top:1px solid var(--border)}
.hoje{font-weight:600;font-style:italic}
.hoje .pos{font-style:normal}
.vagas{font-family:var(--font);font-weight:600;font-size:.75rem;letter-spacing:.28em}
.vagas .desce{animation:none;color:var(--secondary)}
.arte-bonus{border-radius:2px}

/* pagamento: recibo elegante */
.pag{background:var(--surface);border:1px solid var(--text)}
.pag-topo{background:none;border-bottom:1px solid var(--border);padding-block:var(--s7) var(--s5)}
.pag-rot{font-family:var(--font);font-weight:600;font-size:.6875rem;letter-spacing:.28em;text-transform:uppercase;color:var(--text-muted)}
.pag-valor{font-family:var(--font-display);font-weight:500;color:var(--text);font-size:clamp(3.6rem,18vw,4.6rem);letter-spacing:-.02em;animation:none}
.pag-valor sup{font-family:var(--font);font-size:.22em;font-weight:600;letter-spacing:.1em;vertical-align:1.9em;color:var(--text-muted)}
.pag-unico{font-style:italic;font-family:var(--font-display);font-size:1.0625rem}
.pag-inst{font-family:var(--font-display);font-weight:600;font-size:1.375rem}
.campo span{font-family:var(--font);font-weight:600;font-size:.6875rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted);margin-left:0}
.campo input{border:0;border-bottom:1px solid var(--border-strong);border-radius:0;background:transparent;padding:12px 0;min-height:50px;font-weight:500}
.campo input:focus{border-color:var(--text);box-shadow:0 1px 0 var(--text)}
.campo.erro input{box-shadow:0 1px 0 var(--danger)}
.confere{background:none;border:1px solid var(--border)}
.confianca li{font-weight:500;letter-spacing:.02em}
.confianca svg{color:var(--secondary)}
.px-tit{animation:surgeSuave .8s ease both;font-style:italic}
.px-gerando .gira{color:var(--secondary);border-width:2px}
.px-gerando::after{height:1px;background:linear-gradient(90deg,var(--border) 0 30%,var(--text) 50%,var(--border) 70%) 0 0/300% 100%}
.px-chip{border-radius:2px;background:none;font-weight:600;letter-spacing:.04em}
.px-chip.status{background:none}
.px-codigo{border:1px solid var(--border-strong);border-radius:0}
.btn.copiar{background:var(--success);color:var(--on-success);box-shadow:none}
.px-qrbox{border-radius:0;border-color:var(--border-strong)}
.px-qrbox::after{background:var(--secondary);box-shadow:none;height:1px}
.px-como li::before{background:none;border:1px solid var(--secondary);color:var(--secondary);font-family:var(--font-display);font-style:italic}
.px-alerta{border-radius:0}

/* depois do pagamento: preto e ouro, sem brilho */
.pos-faixa{border-radius:2px;background:var(--text);color:var(--background);box-shadow:none}
.pos-faixa::after{display:none}
.pos-ck{background:var(--secondary);color:var(--text)}
.up{border:1px solid var(--up-gold);box-shadow:none;border-radius:2px;outline:1px solid rgba(201,168,118,.35);outline-offset:-8px}
.up.entra-up{animation:surgeSuave .9s ease both}
.up-tag span{background:none;color:#E5484D;border:1px solid var(--up-gold);border-radius:2px;box-shadow:none;font-family:var(--font);font-weight:700;letter-spacing:.14em;font-size:.875rem;white-space:normal;animation:none}
.up-tit{font-weight:600}
.up-tit i{font-style:italic}
.up-preco{background:none;color:var(--up-gold);box-shadow:none;border-top:1px solid rgba(201,168,118,.4);border-bottom:1px solid rgba(201,168,118,.4);border-radius:0}
.up-preco b{font-weight:500;font-style:italic}
.up-arte{border-radius:2px;box-shadow:none}
.up-arte::after{display:none}
.btn.up-sim{background:var(--up-gold);color:var(--up-ink);box-shadow:none}
.up .pix{border-radius:2px}
.up.feito{border-color:var(--border);outline:0}
.conf{background:var(--surface);border:1px solid var(--success)}
.conf-ok{box-shadow:none}
.conf-tit{font-style:italic}
.liberado,.fim{border-radius:2px}
.fim-tit{font-style:italic}

/* obrigado */
.obg-hero{background:var(--text);color:var(--background);border-radius:0}
.obg-hero::before,.obg-hero::after{display:none}
.obg-marca{letter-spacing:.34em}
.obg-selo{background:none;color:var(--secondary);border:1px solid var(--secondary);box-shadow:none}
.obg-chip{background:none;border:1px solid rgba(246,242,234,.4);border-radius:2px;letter-spacing:.24em;font-size:.6875rem;font-weight:600}
.obg-tit{font-style:italic;font-weight:500}
.obg-card{border-radius:2px}
.obg-h2{font-weight:600;font-size:1.5rem}
.obg-num{background:none;border:1px solid var(--text);color:var(--text);font-family:var(--font-display);font-style:italic}
.obg-passo.feito .obg-num{background:var(--success);border-color:var(--success)}
.obg-pago{border-radius:2px;letter-spacing:.2em;font-size:.6875rem}
.obg-link{border-radius:0}
.obg-link svg{color:var(--secondary)}

/* algarismos alinhados (a Cormorant usa estilo antigo por padrao) */
body{font-variant-numeric:lining-nums}
.relogio .n{font-variant-numeric:lining-nums tabular-nums}

/* telas estreitas: espacamento dos botoes menor para caber em uma linha */
@media (max-width:400px){ .btn{letter-spacing:.14em;padding-inline:16px} .btn.whats{letter-spacing:.1em} }
.oferta > .arte-bonus{margin-top:var(--s7)!important}
