/* Pagina do Fisioterapia para Concursos e Residencia — o que e proprio dela.
   O resto vem do estilo.css + efeitos.css de sempre. Visual C + B, decidido em
   13/10/2026: topo escuro da direcao C, secao "Abra o livro" da B.
   Tudo aqui fica escopado em .topo, .explorar e nas classes novas — nada mexe nas
   regras globais, para as oito paginas antigas nao mudarem. */

/* ---------- TOPO: direcao C ---------- */
.topo{position:relative;background:#120828;color:#CFC4EE;overflow:clip;isolation:isolate;text-align:center;
  padding:clamp(56px,9vw,96px) 0 0}
/* espaco reservado para o fundo animado que o cliente vai escolher (partículas que
   formam um corpo, curvas de ventilador, goniometro ou fibra muscular). Ate la, so o
   brilho que respira. */
.topo canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-2}
.topo::before{content:"";position:absolute;z-index:-1;width:min(1000px,140vw);aspect-ratio:1;left:50%;top:44%;
  translate:-50% -10%;border-radius:50%;
  background:radial-gradient(circle,rgba(93,23,235,.5) 0,rgba(93,23,235,.14) 42%,transparent 70%);
  animation:respira 7s ease-in-out infinite}
@keyframes respira{50%{scale:1.08;opacity:.8}}
.topo-faixa{position:absolute;left:0;top:0;bottom:0;width:10px;display:flex;flex-direction:column;z-index:1}
.topo-faixa i{flex:1}
.topo-grid{display:flex;flex-direction:column;align-items:center;gap:18px}
.rotulo{display:inline-flex;gap:8px;align-items:center;color:#F7B5A6;border:1px solid rgba(247,147,130,.4);
  font-weight:600;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;padding:7px 16px;border-radius:99px}
.rotulo i{width:7px;height:7px;border-radius:50%;background:var(--coral);animation:pulso-ponto 1.6s infinite}
/* pulso-ponto, nao "pulso": o efeitos.css ja tem um "pulso" (sombra do botao da oferta) e o daqui o
   sobrescrevia — o botao crescia 1,8x e esmaecia (achado em 14/10/2026, existia desde a v7) */
@keyframes pulso-ponto{50%{transform:scale(1.8);opacity:.3}}
.topo h1{font-size:clamp(2.5rem,7vw,5.6rem);line-height:.98;color:#fff;font-weight:700;letter-spacing:-.035em;
  max-width:15ch;text-wrap:balance}
.topo h1 .grad{background:linear-gradient(90deg,#B79EFF,#F79382,#B79EFF);background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent}
.efeitos .topo h1 .w{display:inline-block;opacity:0;transform:translateY(.5em);
  animation:sobe .7s cubic-bezier(.2,.7,.2,1) forwards}
.efeitos .topo h1 .w.grad{animation:sobe .7s cubic-bezier(.2,.7,.2,1) forwards,brilho 6s linear infinite}
@keyframes sobe{to{opacity:1;transform:none}}
@keyframes brilho{to{background-position:-200% 0}}
.topo-vol{font-family:Mali,cursive;color:#B79EFF;font-size:1.15rem;margin-top:-6px}
.topo .promessa{font-size:clamp(1.05rem,1.6vw,1.2rem);max-width:46ch;color:#CFC4EE;margin:0}
.topo .promessa strong{color:#fff;font-weight:600}
.cta-pilula{display:inline-flex;gap:12px;align-items:center;margin-top:6px;padding:18px 34px;border-radius:99px;
  background:#fff;color:#120828;font-weight:600;font-size:1.08rem;text-decoration:none;
  box-shadow:0 0 0 6px rgba(183,158,255,.18),0 20px 60px -10px rgba(123,69,240,.85);
  transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s}
.cta-pilula:hover{color:#120828;box-shadow:0 0 0 9px rgba(183,158,255,.22),0 24px 70px -10px rgba(123,69,240,.95)}
.cta-pilula svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.topo .micro{color:#CFC4EE;opacity:.75;font-size:.86rem;margin:0}

/* os dois volumes como livros 3D (v4): capa real na frente, lombada com o numero,
   borda de paginas. Abrem em V; a rolagem afasta (--abre) e o cursor inclina (--rx/--ry). */
.palco-capas{position:relative;width:min(640px,94vw);aspect-ratio:640/440;margin-top:26px;perspective:1600px;
  --abre:0;--rx:0deg;--ry:0deg}
.palco-3d{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry));
  transition:transform .25s ease-out}
.palco-capas .livro3d{position:absolute;bottom:9%;--w:min(230px,36vw)}
.palco-capas .livro3d.v1{left:calc(13% - var(--abre) * 6%);--gira:calc(-20deg - var(--abre) * 10deg);z-index:1}
.palco-capas .livro3d.v2{right:calc(13% - var(--abre) * 6%);--gira:calc(20deg + var(--abre) * 10deg);z-index:2}
.palco-capas .brilho-chao{position:absolute;left:8%;right:8%;bottom:2%;height:16%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(123,69,240,.55),transparent);filter:blur(10px)}

.livro3d{--w:220px;--esp:calc(var(--w) * .13);--gira:-22deg;position:relative;width:var(--w);aspect-ratio:520/736;
  transform-style:preserve-3d;transform:rotateY(var(--gira)) rotateX(-5deg);transition:transform .35s ease-out}
.livro3d > *{position:absolute;display:block}
.livro3d .l-frente{inset:0;width:100%;height:100%;transform:translateZ(calc(var(--esp) / 2));border-radius:0;
  box-shadow:inset 3px 0 6px rgba(0,0,0,.35)}
/* capa com canto reto (18/10): o canto arredondado deixava o verso escuro aparecer nas pontas */
/* brilho de capa plastificada, recortado na capa */
.livro3d .l-brilho{inset:0;transform:translateZ(calc(var(--esp) / 2 + .5px));border-radius:0;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.16) 42%,rgba(255,255,255,0) 55%),
             linear-gradient(90deg,rgba(0,0,0,.28),rgba(0,0,0,0) 5%)}
.livro3d .l-lombada{top:0;bottom:0;left:calc(var(--esp) / -2);width:var(--esp);transform:rotateY(-90deg);
  background:linear-gradient(90deg,#140930,#2c1563 50%,#140930);display:flex;flex-direction:column;align-items:center;
  justify-content:space-between;padding:10px 0;color:#B79EFF;font-weight:700;font-size:calc(var(--w) * .09)}
.livro3d .l-lombada i{font-style:normal;font-size:.45em;letter-spacing:.2em;writing-mode:vertical-rl;color:#CFC4EE;opacity:.8}
.livro3d .l-miolo{top:3px;bottom:3px;left:calc(100% - var(--esp) / 2);width:var(--esp);transform:rotateY(90deg);
  background:repeating-linear-gradient(90deg,#f4f1ea 0 1px,#d9d2c6 1px 2px)}
.livro3d .l-topo{left:0;right:3px;top:calc(var(--esp) / -2);height:var(--esp);transform:rotateX(90deg);
  background:repeating-linear-gradient(0deg,#f4f1ea 0 1px,#d9d2c6 1px 2px)}
.livro3d .l-verso{inset:0;transform:translateZ(calc(var(--esp) / -2)) rotateY(180deg);background:#1b0c3d;
  box-shadow:0 40px 60px -10px rgba(0,0,0,.6)}

.cta-pilula{translate:var(--bx,0) var(--by,0)} .vidro{position:absolute;left:50%;bottom:7%;translate:-50% 0;display:flex;gap:22px;padding:14px 22px;
  border-radius:18px;text-align:left;z-index:2;white-space:nowrap;
  background:rgba(18,8,40,.55);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.18);box-shadow:0 18px 40px -16px rgba(0,0,0,.6)}
.vidro strong{display:block;font-size:1.7rem;line-height:1;color:#fff;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.vidro span{font-size:.8rem}
.anota{position:absolute;right:-4%;top:-2%;font-family:Mali,cursive;color:#B79EFF;font-size:1.02rem;line-height:1.3;
  text-align:right;rotate:4deg;z-index:2}
.anota svg{display:block;margin:4px 0 0 auto}

/* ---------- PLACAR: quatro dados com escopo escrito ---------- */
.placar-c{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.placar-c div{display:flex;flex-direction:column;gap:4px;padding-left:16px;border-left:3px solid var(--lilas)}
.placar-c div:nth-child(2){border-color:var(--azul)}
.placar-c div:nth-child(3){border-color:var(--verde)}
.placar-c div:nth-child(4){border-color:var(--coral)}
.placar-c strong{font-size:clamp(1.8rem,3.4vw,2.5rem);line-height:1;color:var(--violeta);
  font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.placar-c span{font-size:.92rem;color:var(--corpo);line-height:1.35}

/* ---------- MECANISMO: quatro cartoes + a figura ---------- */
.mec-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(28px,5vw,60px);align-items:start}
.mec-figura{position:sticky;top:32px;margin:0}
.mec-figura img{width:100%;height:auto;border-radius:16px;box-shadow:0 24px 50px -24px rgba(36,16,86,.45)}
.mec-figura figcaption{font-size:.86rem;color:var(--suave);margin-top:10px}
.mec-cartoes{display:grid;gap:16px}

/* ---------- OS DOIS VOLUMES ---------- */
.volumes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.volume{background:#fff;border-radius:16px;padding:26px;box-shadow:0 1px 2px rgba(26,22,38,.06),0 12px 32px -18px rgba(36,16,86,.3);
  display:flex;flex-direction:column;gap:14px;border-top:5px solid var(--lilas)}
.volume + .volume{border-top-color:var(--coral)}
.volume-cabeca{display:flex;gap:18px;align-items:center}
.volume-cabeca img{width:92px;height:auto;border-radius:4px;box-shadow:0 10px 24px -10px rgba(18,8,40,.6);flex:none}
.volume-cabeca small{display:block;font-family:Mali,cursive;color:var(--violeta);font-size:1rem}
.volume h3{font-size:1.3rem;line-height:1.2}
.volume > p{margin:0}
.volume-dados{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.volume-dados li{display:flex;gap:10px;align-items:baseline;line-height:1.4}
.volume-dados b{min-width:3.2ch;text-align:right;color:var(--violeta);font-variant-numeric:tabular-nums;font-size:1.1rem}
.volume-dados em{font-style:normal;color:var(--suave);font-size:.9rem}
.volume details{border-top:1px solid var(--borda);padding-top:12px;margin-top:auto}
.volume summary{cursor:pointer;font-weight:600;color:var(--violeta);list-style:none}
.volume summary::-webkit-details-marker{display:none}
.volume summary::after{content:" +";}
.volume details[open] summary::after{content:" −"}
.volume ol{margin:10px 0 0;padding-left:2.4em;font-size:.94rem;display:grid;gap:3px}

/* ---------- EXPLORADOR: abra o livro (direcao B) ---------- */
.explorar{background:linear-gradient(#120828,var(--escuro) 30%);color:#CFC4EE;position:relative;overflow:clip}
.explorar::after{content:"";position:absolute;width:700px;height:700px;right:-200px;top:-200px;border-radius:50%;
  background:radial-gradient(circle,rgba(123,69,240,.35),transparent 65%);pointer-events:none}
.explorar .container{position:relative;z-index:1}
.explorar h2{color:#fff}
.explorar .apoio{color:#CFC4EE;max-width:52ch}
.ex-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.85fr);gap:44px;align-items:start;margin-top:36px}
.blocos{display:grid;gap:20px}
.bloco h3{font-size:.76rem;text-transform:uppercase;letter-spacing:.1em;color:#B79EFF;margin-bottom:8px;
  display:flex;gap:8px;align-items:center;font-weight:600}
.bloco h3 b{width:10px;height:10px;border-radius:3px;flex:none}
.bloco h3 small{color:#CFC4EE;opacity:.6;letter-spacing:.06em;font-size:.95em}
.temas{display:flex;flex-wrap:wrap;gap:6px}
.tema{font:inherit;font-size:.86rem;cursor:pointer;border:1px solid rgba(207,196,238,.22);background:rgba(255,255,255,.04);
  color:#E8E2FA;padding:6px 11px;border-radius:99px;transition:background .2s,border-color .2s,transform .2s;text-align:left}
.tema:hover{border-color:rgba(207,196,238,.6);transform:translateY(-1px)}
.tema b{color:#B79EFF;font-weight:600;margin-right:4px;font-variant-numeric:tabular-nums}
.tema[aria-pressed=true]{background:#fff;color:var(--escuro);border-color:#fff;font-weight:600}
.tema[aria-pressed=true] b{color:var(--violeta)}

.livro{position:sticky;top:40px}
.palco-livro{position:relative;aspect-ratio:360/509;max-width:380px;margin:0 auto;perspective:1800px}
.palco-livro::before,.palco-livro::after{content:"";position:absolute;inset:0;border-radius:10px;background:#fff;
  transform:translate(10px,10px);opacity:.12}
.palco-livro::after{transform:translate(5px,5px);opacity:.25}
.pag,.folha{position:absolute;inset:0;border-radius:10px;overflow:hidden;background:#fff;z-index:1;
  box-shadow:0 30px 60px -20px rgba(0,0,0,.6)}
.pag img,.folha img{width:100%;height:100%;object-fit:cover;display:block}
.folha{z-index:2;transform-origin:left center;animation:vira .75s cubic-bezier(.45,.05,.25,1) forwards;backface-visibility:hidden}
.folha::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,0),rgba(0,0,0,.35));
  opacity:0;animation:sombra .75s forwards}
@keyframes vira{to{transform:rotateY(-115deg);opacity:0}}
@keyframes sombra{to{opacity:1}}
.selo-pag{position:absolute;z-index:3;left:-14px;bottom:22px;max-width:80%;background:var(--violeta);color:#fff;border-radius:10px;
  padding:8px 14px;box-shadow:0 10px 24px -8px rgba(93,23,235,.8);text-align:left}
.selo-pag small{display:block;font-size:.7rem;opacity:.85;text-transform:uppercase;letter-spacing:.08em;line-height:1.3}
.selo-pag strong{font-size:1.02rem;font-variant-numeric:tabular-nums}
.nota-pag{font-size:.82rem;text-align:center;margin:14px 0 0;opacity:.75}
/* uma barra por capitulo, largura proporcional ao numero de paginas */
.mapa{display:flex;gap:2px;margin:22px auto 0;max-width:380px}
.mapa button{height:26px;border:0;border-radius:2px;cursor:pointer;opacity:.35;transition:opacity .2s,transform .2s;padding:0;min-width:3px}
.mapa button.on{opacity:1;transform:scaleY(1.35)}
.mapa i{width:6px;flex:none}
.mapa-leg{display:flex;justify-content:space-between;max-width:380px;margin:6px auto 0;font-size:.75rem;opacity:.7}

/* ---------- UMA QUESTAO: a amostra sozinha, na largura em que o texto se le ---------- */
.amostras.amostra-unica{grid-template-columns:minmax(0,820px);justify-content:center}
.amostra-unica img{border-radius:12px}

/* ---------- espaco reservado: o que ainda depende de decisao ---------- */
.pendente{border:2px dashed #B9A6E8;border-radius:16px;padding:22px 24px;color:var(--corpo);
  background:repeating-linear-gradient(135deg,#F7F4FD 0 12px,#fff 12px 24px)}
.pendente b{font-family:Mali,cursive;color:var(--violeta);font-weight:500;display:block;margin-bottom:4px}
.pendente p{margin:0;font-size:.95rem}
.preco-pendente{font-family:Mali,cursive;color:var(--violeta);font-size:1.3rem;border:2px dashed #B9A6E8;
  border-radius:12px;padding:12px;margin:8px 0}

/* ---------- PARA QUEM E / NAO E ---------- */
.quem{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.quem > div{background:#fff;border-radius:16px;padding:24px 26px;box-shadow:0 1px 2px rgba(26,22,38,.06),0 12px 32px -18px rgba(36,16,86,.25)}
.quem h3{font-size:1.1rem;margin-bottom:12px}
.quem ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.quem li{display:flex;gap:10px;line-height:1.45}
.quem svg{width:20px;height:20px;flex:none;margin-top:2px;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.quem .sim svg{stroke:var(--violeta)}
.quem .nao svg{stroke:#C0697A}
.quem-nota{text-align:center;margin-top:22px;color:var(--suave);font-size:.95rem}

/* ---------- celular ---------- */
@media (max-width:860px){
  .anota{font-size:.82rem;right:0;top:-6%}
  .anota svg{width:40px}
  .vidro{gap:14px;padding:10px 14px}
  .vidro strong{font-size:1.25rem}
  .vidro span{font-size:.72rem}
  .placar-c{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}
  .mec-grid{grid-template-columns:minmax(0,1fr)}
  .mec-figura{position:relative;top:0}
  .volumes,.quem{grid-template-columns:minmax(0,1fr)}
  /* o estilo.css limita amostras a 380 px no celular; texto de questao precisa da largura toda */
  .amostras.amostra-unica{grid-template-columns:minmax(0,1fr);max-width:none}
  /* minmax(0,..): sem ele a coluna cresce ate a largura da fileira de temas, que nao quebra */
  .ex-grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .livro{position:relative;top:0;order:-1}
  .palco-livro{max-width:250px}
  .temas{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none}
  .tema{flex:none;scroll-snap-align:start}
}
/* ---------- v2: o resto do movimento ---------- */
/* o corpo de particulas fica atras de tudo; no fim, atras do texto do CTA */
.fim-corpo{overflow:clip;isolation:isolate}
.fim-corpo canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
/* o degrade do titulo ganha um halo que respira */
.topo h1 .grad{filter:drop-shadow(0 0 22px rgba(183,158,255,.35))}

/* medidor "Onde gastar seu tempo": tres barras que enchem quando o cartao entra */
.medidor{display:grid;gap:6px;margin-top:14px;max-width:300px}
.medidor span{display:grid;grid-template-columns:1fr 3.4em;align-items:center;gap:10px;font-size:.78rem;
  font-weight:600;color:var(--suave);text-transform:uppercase;letter-spacing:.06em}
.medidor i{order:-1;height:8px;border-radius:99px;background:var(--violeta);transform-origin:left;transform:scaleX(var(--n))}
.medidor span:nth-child(2) i{background:var(--violeta-cl);opacity:.75}
.medidor span:nth-child(3) i{background:var(--lilas)}
.efeitos .medidor i{transform:scaleX(0);transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.efeitos .medidor span:nth-child(2) i{transition-delay:.15s}
.efeitos .medidor span:nth-child(3) i{transition-delay:.3s}
.efeitos .visivel .medidor i{transform:scaleX(var(--n))}

/* a linha que se desenha com a rolagem, ligando os quatro cartoes */
.mec-cartoes{position:relative;padding-left:28px}
.trilha-mec{position:absolute;left:6px;top:28px;bottom:28px;width:4px;border-radius:4px;background:var(--lilas)}
.trilha-mec i{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(var(--violeta-cl),var(--violeta));
  transform-origin:top;transform:scaleY(var(--trilha,1));box-shadow:0 0 14px rgba(93,23,235,.45)}
.mec-cartoes .passo-num{transition:background .4s,color .4s,box-shadow .4s}
.mec-cartoes .passo.aceso .passo-num{background:var(--violeta);color:#fff;box-shadow:0 0 0 6px rgba(93,23,235,.15)}

@media (prefers-reduced-motion:reduce){
  .topo::before,.rotulo i,.efeitos .topo h1 .w{animation:none;opacity:1;transform:none}
  .folha{display:none}
  .livro3d,.palco-3d{transition:none}
}

/* ---------- v3 · A QUESTAO QUE SE RESOLVE ----------
   Estado padrao = resolvido (sem JS ou com JS falhando, a pessoa ve tudo). Com JS, a
   secao ganha .ativo e cada passo que cruza o meio da tela aplica o seu efeito. */
.resolve-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,64px);align-items:start;margin-top:8px}
.resolve-palco{position:sticky;top:72px}
.q-cartao{background:#fff;border-radius:18px;padding:24px 26px;border:1px solid var(--borda);
  box-shadow:0 2px 4px rgba(26,22,38,.05),0 24px 50px -24px rgba(36,16,86,.35);display:grid;gap:12px}
.q-banca{margin:0;font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--violeta)}
.q-caso summary{cursor:pointer;font-size:.9rem;font-weight:600;color:var(--suave);list-style:none}
.q-caso summary::-webkit-details-marker{display:none}
.q-caso summary::after{content:" +"}
.q-caso[open] summary::after{content:" −"}
.q-caso p{font-size:.88rem;line-height:1.5;margin:8px 0 0;color:var(--suave)}
.q-texto{margin:0;font-size:.95rem;color:var(--tinta);line-height:1.45}
.q-gaso{display:flex;flex-wrap:wrap;gap:6px}
.q-gaso span{font-size:.86rem;padding:5px 10px;border-radius:8px;background:var(--fundo-alt);border:1px solid var(--borda);
  color:var(--corpo);transition:background .35s,border-color .35s,color .35s,box-shadow .35s,transform .35s}
.q-gaso b{color:var(--tinta);font-variant-numeric:tabular-nums}
.q-gaso span.aceso{background:var(--violeta);border-color:var(--violeta);color:#fff;transform:translateY(-2px);
  box-shadow:0 8px 18px -8px rgba(93,23,235,.8)}
.q-gaso span.aceso b{color:#fff}
.q-alts{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.q-alts li{position:relative;font-size:.93rem;line-height:1.4;padding:8px 12px;border-radius:10px;border:1px solid var(--borda);
  transition:opacity .4s,background .4s,border-color .4s,color .4s}
.q-alts li b{color:var(--violeta);margin-right:2px}
/* o risco passa sobre o proprio texto, linha a linha: fundo de 2px num elemento em
   linha, cuja largura cresce de 0 a 100% (em texto quebrado, percorre as linhas em ordem) */
.q-alts .t{background:linear-gradient(var(--coral),var(--coral)) no-repeat 0 58%/calc(var(--r,1) * 100%) 2px;
  transition:background-size .6s cubic-bezier(.2,.7,.2,1)}
.q-alts li[data-errada]{opacity:.5}
.q-alts li[data-certa]{background:#EDE5FD;border-color:var(--violeta);color:var(--tinta);font-weight:600}
.q-alts li[data-certa] .t{background:none}
.g-selo{display:inline-block;margin-left:8px;vertical-align:1px;background:var(--violeta);color:#fff;font-style:normal;
  font-size:.66rem;font-weight:700;letter-spacing:.06em;padding:2px 8px;border-radius:99px;text-transform:uppercase;
  transform:scale(var(--g,1));transition:transform .45s cubic-bezier(.3,1.6,.5,1)}
.q-original{display:inline-block;margin-top:12px;font-size:.88rem}
.resolve-passos{list-style:none;padding:0;margin:0;display:grid;gap:18px}
.resolve-passos li{background:var(--fundo-alt);border-radius:14px;padding:18px 20px;border-left:4px solid var(--lilas)}
.resolve-passos p{margin:0;font-size:1.02rem;color:var(--tinta);line-height:1.5}
.resolve-passos .passo-nota{margin-top:8px;font-size:.92rem;color:var(--corpo)}
.resolve-passos li:last-child p:first-child{font-weight:700;color:var(--violeta);letter-spacing:.04em}

/* com JS: o estado parte do zero e cada passo e um "quadro" alto da rolagem */
.resolve.ativo .q-alts li[data-errada]{opacity:1}
.resolve.ativo .q-alts li{--r:0}
.resolve.ativo .q-alts li.riscada{--r:1;opacity:.45}
.resolve.ativo .q-alts li[data-certa]{background:#fff;border-color:var(--borda);font-weight:400;--g:0}
.resolve.ativo .q-alts li[data-certa].certa{background:#EDE5FD;border-color:var(--violeta);font-weight:600;--g:1;
  box-shadow:0 0 0 5px rgba(93,23,235,.12)}
.resolve.ativo .resolve-passos{gap:0}
.resolve.ativo .resolve-passos li{min-height:62vh;display:flex;flex-direction:column;justify-content:center;
  background:none;border-left-color:transparent;opacity:.25;transition:opacity .4s,border-color .4s}
.resolve.ativo .resolve-passos li.agora{opacity:1;border-left-color:var(--violeta)}
.resolve.ativo .resolve-passos li:first-child{min-height:40vh}
.resolve.ativo .resolve-passos li:last-child{min-height:70vh}

@media (max-width:860px){
  .resolve-grid{grid-template-columns:minmax(0,1fr);gap:0}
  /* no celular o cartao gruda no topo, compacto, e os passos passam por baixo dele */
  .resolve-palco{top:0;z-index:2;background:var(--fundo);padding:10px 0 12px;margin-inline:-4px}
  .q-cartao{padding:14px 14px;gap:8px;border-radius:14px}
  .q-texto{font-size:.84rem}
  .q-gaso span{font-size:.76rem;padding:3px 7px}
  .q-alts{gap:4px}
  .q-alts li{font-size:.8rem;padding:5px 9px}
  .g-selo{font-size:.58rem;padding:1px 6px}
  .q-original{display:none}
  .resolve.ativo .resolve-passos li{min-height:48vh;justify-content:flex-start;padding-top:24px}
  .resolve.ativo .resolve-passos li:first-child{min-height:30vh}
  .resolve.ativo .resolve-passos li:last-child{min-height:60vh}
  .resolve-passos li{margin-top:12px}
}
@media (prefers-reduced-motion:reduce){
  .q-alts li,.q-alts .t,.g-selo,.q-gaso span,.resolve-passos li{transition:none}
}

/* ---------- v3 · consertos apontados pela auditoria de conversao ---------- */
/* a barra fixa herda o "de R$" riscado das paginas antigas; aqui o texto pequeno e rotulo */
.barra-fixa .bf-preco small{text-decoration:none;color:var(--suave)}
/* a garantia do CTA final estava apagada demais sobre o escuro */
.fim-corpo .micro{color:#CFC4EE;opacity:1}
.como-medimos{display:block;margin-top:10px;font-size:.84rem;color:var(--suave);line-height:1.45}
.como-medimos b{color:var(--corpo)}

/* ---------- v4 · para quem e: uma lista so, em duas colunas ---------- */
.quem-lista{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px}
.quem-lista li{display:flex;gap:12px;line-height:1.5;background:#fff;border-radius:14px;padding:16px 18px;
  box-shadow:0 1px 2px rgba(26,22,38,.05),0 10px 26px -18px rgba(36,16,86,.3)}
.quem-lista svg{width:22px;height:22px;flex:none;margin-top:1px;fill:none;stroke:var(--violeta);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:860px){.quem-lista{grid-template-columns:minmax(0,1fr)}}

/* ---------- v4 · responda antes de ver ---------- */
.q-chamada{margin:4px 0 -2px;font-family:Mali,cursive;color:var(--violeta);font-size:1rem}
.resolve.ativo .q-alts li{cursor:pointer}
.resolve.ativo .q-alts li:hover{border-color:#B9A6E8}
.q-alts li:focus-visible{outline:2px solid var(--violeta);outline-offset:2px}
.q-alts li.marcada{box-shadow:0 0 0 3px var(--cor-marca,#B79EFF)}
.q-alts li.errou{--cor-marca:rgba(247,147,130,.75)}
.q-alts li.acertou{--cor-marca:rgba(93,23,235,.45)}
.q-resposta{border-radius:12px;padding:12px 14px;background:var(--coral-cl);border-left:4px solid var(--coral);font-size:.9rem;line-height:1.45}
.q-resposta b{display:block;color:var(--tinta);margin-bottom:4px}
.q-resposta p{margin:0;color:var(--tinta)}
.q-resposta small{display:block;margin-top:6px;color:var(--suave)}
.q-cartao:has(.acertou) .q-resposta{background:#EDE5FD;border-left-color:var(--violeta)}
.q-resposta.entra{animation:surge .45s cubic-bezier(.2,.7,.2,1)}
@keyframes surge{from{opacity:0;transform:translateY(8px)}}

/* ---------- v4 · folheador ---------- */
.q-original{font:inherit;font-size:.92rem;font-weight:600;color:var(--violeta);background:none;border:1px solid #CDBDF3;
  border-radius:99px;padding:9px 16px;margin-top:14px;cursor:pointer;display:inline-flex;gap:8px;align-items:center}
.q-original::before{content:"";width:16px;height:12px;border:2px solid currentColor;border-radius:2px;
  background:linear-gradient(currentColor,currentColor) center/2px 100% no-repeat}
.q-original:hover{background:#F3EEFE}
.folheador{border:0;padding:24px;background:transparent;max-width:none;max-height:none;width:100%;height:100%;
  display:none;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.folheador[open]{display:flex}
.folheador::backdrop{background:rgba(18,8,40,.86);backdrop-filter:blur(4px)}
.folheador-palco{width:min(560px,86vw,calc((100vh - 140px) * .707));max-width:none;margin:0;cursor:pointer}
.folheador .folha.volta{transform-origin:right center;animation-name:vira-volta}
@keyframes vira-volta{to{transform:rotateY(115deg);opacity:0}}
.folheador .selo-pag{bottom:auto;top:18px}
.folheador-ctrl{display:flex;gap:12px;align-items:center;color:#E8E2FA;font-size:.9rem}
.folheador-ctrl button{font:inherit;cursor:pointer;border-radius:99px;border:1px solid rgba(255,255,255,.3);
  background:rgba(255,255,255,.08);color:#fff;min-width:44px;height:44px;font-size:1.3rem}
.folheador-ctrl button:disabled{opacity:.3;cursor:default}
.folheador-ctrl .folheador-fechar{font-size:.9rem;padding:0 18px;margin-left:12px}
@media (max-width:860px){
  .q-resposta{font-size:.78rem;padding:8px 10px}
  .q-chamada{font-size:.85rem}
  .q-original{display:inline-flex;font-size:.82rem;padding:7px 13px;margin-top:8px}
  .folheador{padding:12px}
}

/* ---------- v4 · os dois volumes: a dupla ganha palco proprio ---------- */
.dupla{display:grid;grid-template-columns:auto auto auto;justify-content:center;align-items:center;gap:clamp(18px,4vw,48px);
  margin:10px 0 34px;perspective:1600px}
.dupla .livro3d{--w:min(200px,30vw)}
.dupla .livro3d.v1{--gira:-24deg}
.dupla .livro3d.v2{--gira:24deg}
@media (hover:hover){.dupla:hover .livro3d.v1{--gira:-12deg}.dupla:hover .livro3d.v2{--gira:12deg}}
.dupla-mais{font-size:clamp(2rem,5vw,3.4rem);font-weight:700;color:var(--violeta);line-height:1}
.dupla-soma{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:-10px 0 34px}
.dupla-soma span{background:#fff;border:1px solid var(--borda);border-radius:99px;padding:8px 16px;font-size:.95rem;color:var(--corpo)}
.dupla-soma b{color:var(--violeta);font-variant-numeric:tabular-nums}
.volume-cabeca{perspective:900px}
.volume-cabeca .livro3d{--w:84px;--gira:-26deg;flex:none;margin:4px 14px 4px 4px}
@media (max-width:860px){
  .palco-capas{aspect-ratio:390/330}
  .palco-capas .livro3d{bottom:12%}
  .dupla-soma span{font-size:.85rem;padding:6px 12px}
}

.dupla-soma{max-width:none;margin-inline:auto}
.folheador-zoom{position:fixed;inset:0;z-index:5;overflow:auto;background:#fff;-webkit-overflow-scrolling:touch}
.folheador-zoom img{width:210%;max-width:none;display:block}
.folheador-zoom p{position:fixed;left:50%;bottom:16px;translate:-50% 0;margin:0;background:rgba(18,8,40,.85);color:#fff;
  font-size:.85rem;padding:8px 14px;border-radius:99px;pointer-events:none}
@media (max-width:860px){.folheador-palco{width:min(92vw,calc((100vh - 120px) * .707))}}

/* =================== v5 =================== */
/* ---- escala de incidencia: coral cai muito, lilas medio, violeta pouco ---- */
.legenda-inc{display:flex;flex-wrap:wrap;gap:8px 18px;margin:14px 0 0;font-size:.82rem;color:#CFC4EE}
.legenda-inc span{display:inline-flex;align-items:center;gap:7px}
.legenda-inc span::before{content:"";width:12px;height:12px;border-radius:4px;background:var(--inc)}
.tema{position:relative;padding-left:24px}
.tema::before{content:"";position:absolute;left:9px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;
  background:var(--inc,#E8E2FA)}
.tema.inc-alta::before{box-shadow:0 0 0 0 rgba(247,147,130,.7);animation:pulso-inc 2.2s infinite}
@keyframes pulso-inc{70%{box-shadow:0 0 0 7px rgba(247,147,130,0)}100%{box-shadow:0 0 0 0 rgba(247,147,130,0)}}
.tema.inc-alta{border-color:rgba(247,147,130,.55)}
.selo-pag{background:linear-gradient(135deg,var(--violeta),color-mix(in srgb,var(--inc,#5D17EB) 70%,#5D17EB))}
/* o medidor usa a mesma escala */
.medidor span:nth-child(1) i{background:#F79382}
.medidor span:nth-child(2) i{background:#B79EFF;opacity:1}
.medidor span:nth-child(3) i{background:#6A4FC4}

/* ---- a dor ---- */
.dores{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:12px}
.dores li{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--borda);border-radius:14px;
  padding:16px 18px;font-size:1.05rem;color:var(--tinta);line-height:1.45;box-shadow:0 10px 26px -20px rgba(36,16,86,.4)}
.dores svg{width:22px;height:22px;flex:none;margin-top:2px;fill:none;stroke:var(--coral);stroke-width:2.6;stroke-linecap:round}
.dor-virada{margin:26px 0 0;font-size:1.15rem;line-height:1.5;color:var(--corpo);text-align:center;text-wrap:balance}

/* ---- prova social ---- */
.prova{background:linear-gradient(#241056,#120828)}
.prova .apoio{color:#CFC4EE}
.prova .apoio strong{color:#fff}
.depos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.depo{position:relative;margin:0;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:16px;
  padding:22px 22px 18px;display:flex;flex-direction:column;gap:12px;color:#E8E2FA;backdrop-filter:blur(6px);
  transition:transform .3s,border-color .3s}
.depo:hover{transform:translateY(-4px);border-color:rgba(183,158,255,.5)}
.depo p{margin:0;font-size:.98rem;line-height:1.55}
.depo .estrelas{color:#F5B544;letter-spacing:2px;font-size:.9rem}
.depo footer{display:flex;gap:12px;align-items:center;margin-top:auto}
.depo .avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:.85rem;
  background:var(--av);color:#241056;flex:none}
.depo cite{font-style:normal;font-weight:600;color:#fff;display:flex;flex-direction:column;line-height:1.3}
.depo cite small{font-weight:400;color:#B9AEDC;font-size:.82rem}
/* a etiqueta que impede confundir modelo com depoimento real */
.selo-modelo{position:absolute;top:-10px;right:14px;background:#FDE68A;color:#5B4300;font-size:.66rem;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border-radius:99px}
.depo-modelo{border-style:dashed}

/* ---- objecoes ---- */
.objs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.obj{background:#fff;border-radius:16px;padding:22px 24px;border-left:4px solid var(--violeta);
  box-shadow:0 1px 2px rgba(26,22,38,.05),0 12px 30px -20px rgba(36,16,86,.35)}
.obj h3{font-size:1.12rem;margin-bottom:8px;color:var(--violeta)}
.obj p{margin:0;line-height:1.55}

@media (max-width:860px){
  .depos,.objs{grid-template-columns:minmax(0,1fr)}
  .dores li{font-size:.98rem;padding:14px 15px}
  .dor-virada{font-size:1.04rem}
}
@media (prefers-reduced-motion:reduce){.tema.inc-alta::before{animation:none}}

/* =================== v6 =================== */
/* o fundo do edital ocupa o lugar do corpo */
.topo canvas[data-edital]{z-index:-2}
.fim-corpo canvas[data-edital]{z-index:-1;opacity:.75}

/* faixa para a base */
.faixa-base{background:linear-gradient(90deg,#FDE3E3,#EDE5FD);padding:16px 0;border-block:1px solid var(--borda)}
.faixa-base p{margin:0;text-align:center;font-size:1.02rem;color:var(--tinta);text-wrap:balance}
.faixa-base .hand{color:var(--violeta);font-size:1.12rem;margin-right:6px}

/* o que esta em jogo */
.jogo{background:radial-gradient(ellipse at 50% 0%,#3A1A86 0,#241056 45%,#120828 100%);overflow:clip}
.jogo-grid{display:flex;align-items:center;justify-content:center;gap:clamp(14px,3vw,34px);flex-wrap:wrap;margin:6px 0 26px}
.jogo-num{display:flex;flex-direction:column;gap:6px;align-items:center;text-align:center}
.jogo-num small{color:#CFC4EE;font-size:.85rem;max-width:20ch}
.jogo-num strong{color:#fff;font-size:clamp(2.2rem,5.6vw,4rem);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.jogo-num strong span{font-size:.45em;color:#B79EFF;vertical-align:.6em;margin-right:2px}
.jogo-total strong{background:linear-gradient(90deg,#F79382,#FDE3E3);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 26px rgba(247,147,130,.35))}
.jogo-total strong span{color:#F79382;-webkit-text-fill-color:#F79382}
.jogo-x{color:#B79EFF;font-family:Mali,cursive;font-size:1.2rem}
.jogo-texto{max-width:62ch;margin:0 auto;text-align:center;color:#E8E2FA;font-size:1.1rem;line-height:1.6}
.jogo-fonte{max-width:70ch;margin:18px auto 0;text-align:center;color:#9F93C8;font-size:.78rem}

/* filtro de incidencia */
.filtro-inc{font:inherit;font-size:.86rem;font-weight:600;margin-top:12px;cursor:pointer;border-radius:99px;padding:8px 16px;
  border:1px solid rgba(247,147,130,.6);background:rgba(247,147,130,.12);color:#FDE3E3;transition:background .25s}
.filtro-inc:hover,.filtro-inc[aria-pressed=true]{background:#F79382;color:#241056}
.blocos .tema{transition:opacity .35s,filter .35s,background .2s,border-color .2s,transform .2s}
.blocos.so-alta .tema:not(.inc-alta){opacity:.18;filter:grayscale(1)}
.blocos.so-alta .tema.inc-alta{border-color:#F79382;box-shadow:0 0 0 3px rgba(247,147,130,.18)}

/* a garantia colada ao botao */
.garantia-botao{display:flex;gap:6px;align-items:center;justify-content:center;margin:10px 0 0;font-size:.86rem;color:var(--ok);font-weight:600}
.garantia-botao .ico-mini{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}

/* as dores sao grifadas uma depois da outra */
.dores li .marca{transition-delay:calc(var(--i,0) * .35s + .3s)}

@media (max-width:860px){
  .jogo-x{width:100%;text-align:center}
  .faixa-base p{font-size:.94rem}
}

.jogo-texto strong,.jogo-texto .marca{color:#fff}

/* =================== v7 =================== */
/* revelar: nesta pagina so esconde com JS ligado (a classe .efeitos vem do <head>) */
html:not(.efeitos) .revelar{opacity:1;transform:none}

/* topo: rotulo sem palavra sozinha; o vidro desce para nao cobrir o pe das capas */
.rotulo{text-wrap:balance;text-align:center}
.palco-capas{margin-bottom:34px}
.palco-capas .vidro{bottom:-7%}
@media (max-width:860px){
  .rotulo{font-size:.68rem;letter-spacing:.08em;padding:6px 12px}
  .palco-capas .vidro{bottom:-12%}
  .fim-corpo canvas[data-edital]{display:none}       /* no celular as colunas passavam sob o botao */
}

/* convites de compra no meio */
.cta-meio{background:linear-gradient(90deg,#241056,#3A1A86);padding:34px 0;text-align:center}
.cta-meio-titulo{margin:0;color:#fff;font-size:clamp(1.3rem,3vw,1.75rem);font-weight:700;letter-spacing:-.02em}
.cta-meio-apoio{margin:6px auto 16px;color:#CFC4EE;max-width:52ch}

/* a oferta: o palco mais forte da pagina */
.oferta-palco{background:radial-gradient(ellipse at 50% 18%,#4A22A8 0,#241056 42%,#120828 100%);overflow:clip}
.oferta-livros{display:flex;justify-content:center;gap:clamp(30px,8vw,90px);perspective:1600px;margin:0 0 -40px;position:relative;z-index:2}
.oferta-livros .livro3d{--w:min(150px,30vw)}
.oferta-livros .livro3d.v1{--gira:-22deg}
.oferta-livros .livro3d.v2{--gira:22deg}
.oferta-palco .cartao-oferta{position:relative;z-index:1;padding-top:58px;
  box-shadow:0 0 0 1px rgba(183,158,255,.35),0 40px 90px -30px rgba(123,69,240,.9)}
.oferta-palco .garantia{margin-top:22px}

/* depoimentos: o footer global do estilo.css vazava (linha e nome centralizado) */
.depo footer{border:0;padding:0;margin-top:auto;justify-content:flex-start;text-align:left;font-size:inherit;color:inherit}
.depo footer p{display:none}

/* a questao no celular: cartao mais baixo e passos legiveis */
.resolve.ativo .resolve-passos li{opacity:.45}
@media (max-width:860px){
  .q-caso{display:none}
  .q-cartao{gap:6px;padding:12px}
  .q-gaso span{font-size:.72rem;padding:2px 6px}
  .q-alts li{padding:4px 8px;font-size:.78rem}
}

/* foco visivel nas secoes escuras; alvos de toque */
.topo :focus-visible,.secao-escura :focus-visible,.explorar :focus-visible,.cta-meio :focus-visible{outline:2px solid #fff;outline-offset:3px}
@media (max-width:860px){ .tema{min-height:40px} .mapa button{min-width:6px} }

/* a cor clara de texto da secao escura vazava para dentro do cartao branco */
.oferta-palco .cartao-oferta .apoio{color:var(--suave)}
.oferta-palco .cartao-oferta .apoio strong{color:var(--tinta)}
.barra-fixa .botao{white-space:nowrap}

/* ===== v8 (14/10/2026) ===== */
/* depoimentos com foto: 52px, anel lilas para destacar do fundo escuro */
.depo img.avatar{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:none;
  box-shadow:0 0 0 2px #120828,0 0 0 4px rgba(183,158,255,.55)}

/* oferta: combo e o carro-chefe, avulsos logo abaixo e menores */
.selo-combo{display:inline-block;margin:6px 0 2px;white-space:nowrap;
  background:linear-gradient(90deg,var(--violeta),var(--coral));color:#fff;font-weight:700;font-size:.72rem;
  letter-spacing:.08em;text-transform:uppercase;padding:5px 14px;border-radius:99px;box-shadow:0 8px 20px -8px rgba(93,23,235,.8)}
.oferta-palco .cartao-oferta{overflow:visible}
.economia{margin:0 0 .2rem;font-weight:700;color:#2E6B4F;background:#E3F4EA;padding:4px 12px;border-radius:99px;font-size:.92rem}
.preco-a-definir .preco,.preco-a-definir .valor,.avulso-preco{font-variant-numeric:tabular-nums}
.preco-a-definir .preco{color:#B9A6E8}

.avulsos{margin-top:26px;display:grid;gap:12px}
.avulsos-titulo{margin:0 0 2px;text-align:center;color:#CFC4EE;font-size:.98rem}
.avulso{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:14px 18px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:16px;color:#E8E2FA;
  transition:border-color .3s,background .3s}
.avulso:hover{border-color:rgba(183,158,255,.5);background:rgba(255,255,255,.09)}
.avulso .livro3d.mini{--w:46px;--gira:-18deg;perspective:none}
.avulso-txt{display:flex;flex-direction:column;line-height:1.35}
.avulso-txt strong{color:#fff}
.avulso-txt span{font-size:.86rem;color:#B9AEDC}
.avulso-compra{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.avulso-preco{font-weight:700;color:#fff;font-size:1.15rem}
.avulso-compra a{color:#fff;font-size:.85rem;font-weight:600;padding:6px 14px;border-radius:99px;
  border:1.5px solid rgba(255,255,255,.4);text-decoration:none;white-space:nowrap}
.avulso-compra a:hover{background:rgba(255,255,255,.12);border-color:#fff}
@media (max-width:520px){
  .avulso{grid-template-columns:auto 1fr;gap:12px;padding:12px 14px}
  .avulso-compra{grid-column:1 / -1;flex-direction:row;justify-content:space-between;align-items:center}
}

/* depoimentos no celular: carrossel de arrasto (scroll-snap, sem JS), como no Anatomia —
   empilhados eram ~1.700 px; a ponta do proximo cartao avisa que ha mais */
@media (max-width:760px){
  .depos{display:flex;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;
    margin:0 -16px;padding:14px 16px 10px;scrollbar-width:none;overscroll-behavior-x:contain}
  .depos::-webkit-scrollbar{display:none}
  .depo{flex:0 0 84%;scroll-snap-align:center}
  .depos.cascata > *{transition-delay:0s!important}
}
.depos-dica{display:none;margin:4px 0 0;text-align:center;color:#B9AEDC;font-size:.85rem}
@media (max-width:760px){.depos-dica{display:block}}

/* ===== palco do mecanismo (v8): quatro cenas que trocam com o cartão aceso ===== */
.mec-palco{position:sticky;top:90px;height:360px;border-radius:22px;overflow:hidden;color:#E8E2FA;
  background:radial-gradient(ellipse at 30% 0%,#3A1A86,#1B0C3D 60%,#120828);box-shadow:0 30px 60px -30px rgba(36,16,86,.7)}
.cena{position:absolute;inset:0;padding:26px 26px 22px;opacity:0;visibility:hidden;transition:opacity .45s,visibility 0s .45s}
.cena.ativa{opacity:1;visibility:visible;transition:opacity .45s}
.cena-rot{margin:0 0 18px;font-family:Mali,cursive;color:var(--lilas);font-size:1rem}
.cena ul{list-style:none;margin:0;padding:0}

/* 1 · temas soltos se ordenam pela incidência */
.c1-lista{display:grid;gap:14px}
.c1-tema{display:grid;grid-template-columns:9.5em 1fr;align-items:center;gap:12px;font-weight:600;font-size:.95rem;color:#fff;
  transform:translate(var(--dx),var(--dy)) rotate(var(--rot));opacity:.35;
  transition:transform .8s cubic-bezier(.2,.9,.25,1) calc(var(--i) * 70ms),opacity .8s calc(var(--i) * 70ms)}
.c1-tema i{height:9px;border-radius:5px;transform-origin:left;transform:scaleX(0);
  transition:transform .7s cubic-bezier(.2,.9,.25,1) calc(.55s + var(--i) * 90ms)}
.c1-tema.inc-alta i{background:var(--coral)} .c1-tema.inc-media i{background:var(--lilas)} .c1-tema.inc-baixa i{background:#7D66D6}
.c1.ativa .c1-tema{transform:none;opacity:1}
.c1.ativa .c1-tema i{transform:scaleX(var(--w))}

/* 2 · cada alternativa ganha o seu porquê */
.c2-lista{display:grid;gap:12px}
.c2-alt{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center}
.c2-alt b{grid-row:span 2;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.1);
  transition:background .3s,color .3s}
.c2-linha{height:9px;border-radius:5px;width:calc(var(--w) * 100%);background:rgba(207,196,238,.35);position:relative}
.c2-linha::after{content:"";position:absolute;left:-2%;top:50%;height:2px;width:0;background:var(--coral);transition:width .4s}
.c2-alt em{font-style:normal;font-size:.78rem;font-weight:600;opacity:0;transform:translateY(-4px);transition:opacity .35s,transform .35s;color:#F7B5A6}
.c2.ativa .c2-alt b,.c2.ativa .c2-alt em,.c2.ativa .c2-linha::after{transition-delay:calc(.3s + var(--i) * .42s)}
.c2.ativa .c2-alt b{background:rgba(247,147,130,.25);color:var(--coral)}
.c2.ativa .c2-alt .c2-linha::after{width:104%}
.c2.ativa .c2-alt em{opacity:1;transform:none}
.c2-certa em{color:#8FE3B5}
.c2.ativa .c2-certa b{background:#2E6B4F;color:#fff}
.c2.ativa .c2-certa .c2-linha{background:rgba(143,227,181,.55)}
.c2.ativa .c2-certa .c2-linha::after{width:0}

/* 3 · a norma antiga é riscada, a vigente ganha o carimbo */
.c3-par{display:flex;align-items:center;gap:10px;margin:0 0 22px;flex-wrap:wrap}
.c3-norma{position:relative;padding:9px 14px;border-radius:12px;font-weight:600;font-size:.95rem;background:rgba(255,255,255,.08);
  border:1px solid rgba(183,158,255,.25);opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s,color .4s}
.c3-norma::after{position:absolute;top:-11px;right:-8px;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;
  padding:2px 8px;border-radius:99px;transform:scale(0) rotate(-8deg);transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.c3-norma.velha::after{content:attr(data-selo);background:var(--coral);color:#3A0D06}
.c3-norma.nova::after{content:"vigente";background:#8FE3B5;color:#0F3D26}
.c3-seta{color:var(--lilas);opacity:0;transition:opacity .4s}
.c3.ativa .c3-norma,.c3.ativa .c3-seta{opacity:1;transform:none}
.c3.ativa .c3-norma.velha{color:rgba(232,226,250,.5);text-decoration:line-through;text-decoration-color:var(--coral)}
.c3.ativa .c3-norma::after{transform:scale(1) rotate(-8deg)}
.c3.ativa .c3-par:nth-of-type(2) *{transition-delay:.25s} .c3.ativa .c3-par:nth-of-type(3) *{transition-delay:.5s}
.c3.ativa .c3-par:nth-of-type(2) .c3-norma::after{transition-delay:.55s} .c3.ativa .c3-par:nth-of-type(3) .c3-norma::after{transition-delay:.8s}
.c3.ativa .c3-par:nth-of-type(4) *{transition-delay:.75s} .c3.ativa .c3-par:nth-of-type(4) .c3-norma::after{transition-delay:1.05s}
.c3.ativa .c3-par:first-of-type .c3-norma::after{transition-delay:.3s}

/* 4 · a nota de rodapé abre a fonte */
.c4-texto{display:grid;gap:12px;margin-bottom:22px}
.c4-texto span{height:10px;border-radius:5px;width:calc(var(--w) * 100%);background:rgba(207,196,238,.35);position:relative}
.c4-ref sup{position:absolute;right:-18px;top:-9px;color:var(--coral);font-weight:700;font-size:1rem}
.c4.ativa .c4-ref sup{animation:pisca 1.2s ease-in-out 2}
@keyframes pisca{50%{transform:scale(1.6);text-shadow:0 0 12px var(--coral)}}
.c4-nota{background:#fff;color:var(--tinta);border-radius:14px;padding:14px 16px;font-size:.88rem;line-height:1.45;
  border-left:4px solid var(--coral);opacity:0;transform:translateY(16px);transition:opacity .5s .9s,transform .5s .9s}
.c4-nota u{color:var(--violeta);text-decoration-thickness:1.5px;font-weight:600}
.c4-conta{margin:20px 0 0;font-size:.95rem;opacity:0;transition:opacity .5s 1.5s}
.c4-conta strong{color:#fff;font-size:1.35rem}
.c4.ativa .c4-nota{opacity:1;transform:none}
.c4.ativa .c4-conta{opacity:1}

/* celular: o palco gruda no alto e os cartões passam por baixo dele */
@media (max-width:860px){
  .mec-palco{top:10px;height:236px;z-index:4;margin-bottom:6px;border-radius:18px}
  .cena{padding:16px 18px}
  .cena-rot{margin-bottom:10px;font-size:.9rem}
  .c1-lista{gap:6px} .c1-tema{font-size:.8rem;grid-template-columns:8.6em 1fr} .c1-tema i{height:7px}
  .c2-lista{gap:5px} .c2-alt b{width:26px;height:26px;font-size:.8rem} .c2-alt{grid-template-columns:26px 1fr} .c2-alt em{font-size:.7rem}
  .c3-par{margin-bottom:16px} .c3-norma{font-size:.82rem;padding:7px 11px}
  .c4-texto{gap:8px;margin-bottom:12px} .c4-nota{font-size:.78rem;padding:10px 12px} .c4-conta{margin-top:10px;font-size:.85rem}
  .c4-conta strong{font-size:1.1rem}
}
@media (prefers-reduced-motion:reduce){ .cena *, .cena *::after{transition:none!important;animation:none!important} }

/* ===== efeitos escolhidos na vitrine (14/10/2026): 1, 5, 6, 9 e 10 ===== */
/* 1 · texto que acende com a rolagem (sem JS a frase nasce inteira) */
.dor-virada.acende{font-size:clamp(1.35rem,3.6vw,1.9rem);font-weight:600;line-height:1.35;color:var(--tinta);text-align:center}
.js-acende .acende span{opacity:.18;transition:opacity .3s,color .3s}
.js-acende .acende span.on{opacity:1}
.acende span.forte.on{color:#D9604B}

/* 5 · borda viva no cartão do combo */
@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}
.oferta-palco .cartao-oferta{border:3px solid transparent;
  background:linear-gradient(#fff,#fff) padding-box,conic-gradient(from var(--ang),var(--violeta),var(--coral),var(--lilas),var(--violeta)) border-box;
  animation:gira-borda 4s linear infinite}
@keyframes gira-borda{to{--ang:360deg}}

/* 6 · brilho que passa nos botões, contínuo (o do estilo.css só passava com .brilhar) */
.botao::after{animation:brilho-v8 3.4s ease-in-out infinite}
@keyframes brilho-v8{0%,58%{transform:translateX(-120%)}100%{transform:translateX(120%)}}

/* 9 · preço em odômetro */
.odo{display:inline-flex;align-items:flex-start;font-variant-numeric:tabular-nums}
.odo .col{display:inline-block;height:1em;overflow:hidden;line-height:1}
.odo .col > span{display:flex;flex-direction:column;transition:transform 1.7s cubic-bezier(.2,.9,.25,1)}
.odo .col > span > span{height:1em}
.odo .fixo{line-height:1}

/* 10 · toque que ondula */
.tema,.avulso-compra a,.cta-pilula{position:relative;overflow:hidden}
.onda{position:absolute;border-radius:50%;background:rgba(255,255,255,.45);transform:scale(0);animation:ondula .6s ease-out forwards;pointer-events:none}
.tema .onda{background:rgba(93,23,235,.25)}
@keyframes ondula{to{transform:scale(4);opacity:0}}

@media (prefers-reduced-motion:reduce){
  .oferta-palco .cartao-oferta,.botao::after{animation:none}
}

/* v9 · centralização (pedido do cliente, 14/10/2026). Os cabeçalhos das seções de largura
   inteira ficavam à esquerda enquanto o conteúdo embaixo (a virada da dor, a conta da bolsa,
   os dois livros, a oferta) vinha centralizado. Agora título, sobrelinha e apoio seguem o eixo
   da página. Explorar e autora não usam .cabecalho-secao: ficam alinhados à sua coluna. */
.cabecalho-secao{align-items:center;text-align:center}
.cabecalho-secao h2,.cabecalho-secao .apoio,.cabecalho-secao p{margin-inline:auto;text-wrap:balance}
/* a faixa da base: o <p> tem teto de largura (--medida) e, sem margem automática, encostava à esquerda */
.faixa-base p{margin-inline:auto}
/* garantia junto ao botão: o escudo boiava à esquerda das duas linhas no celular */
.garantia-botao{display:block;text-align:center;text-wrap:balance}
.garantia-botao .ico-mini{display:inline-block;vertical-align:-3px;margin-right:4px}
/* "· 7 dias de garantia" deixava "garantia" sozinha na linha */
.topo .micro{text-wrap:balance;justify-content:center;text-align:center}

/* ===================== v10 (14/10/2026, retorno do celular) ===================== */

/* 1 · palco do mecanismo vira tira fina enquanto os cartões passam por baixo (celular).
   clip-path, não height: a altura não muda, então a página não pula. Fica só o rótulo da cena. */
@media (max-width:860px){
  .mec-palco{-webkit-clip-path:inset(0 0 0 0 round 18px);clip-path:inset(0 0 0 0 round 18px);
    transition:clip-path .35s cubic-bezier(.2,.8,.2,1),-webkit-clip-path .35s cubic-bezier(.2,.8,.2,1)}
  .mec-palco.fino{-webkit-clip-path:inset(0 0 calc(100% - 52px) 0 round 16px);clip-path:inset(0 0 calc(100% - 52px) 0 round 16px)}
  .mec-palco .cena-rot{transition:margin .3s}
  .mec-palco.fino .cena-rot{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* 2 · a questão no celular: grudada, fica só a gasometria e as alternativas; os passos
   perdem o vão de meia tela. A altura do palco é fixada pelo JS na versão compacta, e a
   versão cheia transborda sobre a margem da lista — por isso compactar não move a página. */
@media (max-width:860px){
  .resolve.compacto .q-banca,.resolve.compacto .q-caso,.resolve.compacto .q-texto,
  .resolve.compacto .q-chamada,.resolve.compacto .q-resposta{display:none}
  .resolve.ativo .resolve-passos li,.resolve.ativo .resolve-passos li:first-child{min-height:0;padding:16px 18px;margin-top:10px}
  .resolve.ativo .resolve-passos li:last-child{min-height:38vh}
  .resolve.ativo .resolve-passos li{opacity:.35}
}

/* 3 · "abra o livro": no celular os temas quebram em linhas — nada cortado, nada escondido */
@media (max-width:860px){
  .temas{flex-wrap:wrap;overflow:visible;scroll-snap-type:none;padding-bottom:0}
  .tema{flex:0 1 auto;max-width:100%;white-space:normal;text-align:left}
}

/* 4 · oferta: os avulsos primeiro, o "ou", e o combo como conclusão */
.oferta-palco .avulsos{margin-top:0}
.avulsos-titulo{font-family:Mali,cursive;font-size:1.05rem}
.ou-combo{display:flex;align-items:center;gap:14px;margin:26px 0 8px;color:#B79EFF;font-family:Mali,cursive;font-size:1.1rem}
.ou-combo::before,.ou-combo::after{content:"";flex:1;height:1px;background:rgba(183,158,255,.3)}
.garantia-secao{padding-block:clamp(2.5rem,6vw,4rem)}

/* 5 · contato: dois botões de verdade antes do rodapé */
.contato{background:var(--fundo-alt);padding:clamp(2.2rem,6vw,3.4rem) 0;text-align:center;border-top:1px solid var(--borda)}
.contato-titulo{margin:0 auto;font-size:clamp(1.3rem,3.4vw,1.6rem);font-weight:700;color:var(--tinta)}
.contato-apoio{margin:6px auto 22px;color:var(--suave)}
.contato-botoes{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.contato-btn{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:99px;text-decoration:none;
  font-size:.98rem;color:#fff;min-width:250px;justify-content:center;transition:transform .2s,box-shadow .2s}
.contato-btn:hover{transform:translateY(-2px)}
.contato-btn svg{width:22px;height:22px;flex:none;fill:currentColor}
.contato-btn svg.traco{fill:none;stroke:currentColor;stroke-width:2}
.contato-btn svg .cheio{fill:currentColor;stroke:none}
.contato-btn.zap{background:#1FA855;box-shadow:0 10px 24px -12px rgba(31,168,85,.8)}
.contato-btn.insta{background:linear-gradient(45deg,#F58529,#DD2A7B 45%,#8134AF 75%,#515BD4);box-shadow:0 10px 24px -12px rgba(221,42,123,.8)}
.contato-email{margin:18px auto 0;font-size:.9rem;color:var(--suave)}
@media (max-width:520px){.contato-btn{width:100%;min-width:0}}
@media (max-width:860px){
  /* na tira só o rótulo: o conteúdo da cena (o selo "revogada" da 3) aparecia por baixo */
  .mec-palco .cena > :not(.cena-rot){transition:opacity .25s}
  .mec-palco.fino .cena > :not(.cena-rot){opacity:0}
  .resolve.compacto .q-original{display:none}
  /* o último passo (gabarito) fica mais tempo à vista abaixo do cartão antes de a seção acabar */
  .resolve.ativo .resolve-passos li:last-child{min-height:50vh}
}
.contato-btn strong{color:#fff}

/* ===================== v11 (14/10/2026, testado em WebKit/iPhone) ===================== */
/* passos da questão legíveis: o próximo a .55 (era .25/.35, "quase apagado"), o já lido inteiro */
.resolve.ativo .resolve-passos li{opacity:.55}
.resolve.ativo .resolve-passos li.lido{opacity:.85}
.resolve.ativo .resolve-passos li.agora{opacity:1}
/* computador: o vão entre passos caiu de 62vh para 30vh */
@media (min-width:861px){
  .resolve.ativo .resolve-passos li{min-height:30vh}
  .resolve.ativo .resolve-passos li:first-child{min-height:22vh}
  .resolve.ativo .resolve-passos li:last-child{min-height:46vh}
}

/* miniatura do livro: aparece quando o livro sai da tela depois de um toque num capítulo */
.livro-mini{position:fixed;left:12px;bottom:86px;z-index:60;display:flex;align-items:center;gap:10px;
  padding:6px 12px 6px 6px;border-radius:14px;border:1px solid rgba(183,158,255,.45);cursor:pointer;
  background:#1B0C3D;color:#fff;font:inherit;text-align:left;box-shadow:0 14px 30px -12px rgba(0,0,0,.6)}
.livro-mini[hidden]{display:none}
.livro-mini img{width:46px;height:65px;object-fit:cover;border-radius:4px;background:#fff}
.livro-mini span{display:flex;flex-direction:column;line-height:1.25}
.livro-mini small{font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:#CFC4EE}
.livro-mini strong{font-size:.95rem}
.livro-mini.pula{animation:mini-pula .35s cubic-bezier(.3,1.5,.5,1)}
@keyframes mini-pula{from{transform:translateY(12px) scale(.9);opacity:0}}
@media (min-width:861px){.livro-mini{bottom:24px;left:24px}}

/* ===================== v12 (14/10/2026) ===================== */
/* livros 3D na faixa branca e na oferta: o Vol. 1 girava para o outro lado e mostrava o miolo
   (a "faixa branca"); agora os dois mostram a lombada, como livro na estante */
.dupla .livro3d.v1,.dupla .livro3d.v2{--gira:24deg}
@media (hover:hover){.dupla:hover .livro3d.v1,.dupla:hover .livro3d.v2{--gira:12deg}}
.oferta-livros .livro3d.v1,.oferta-livros .livro3d.v2{--gira:22deg}

/* questão: o último passo (gabarito) sem altura mínima — era ele que abria o vão no fim */
@media (max-width:860px){.resolve.ativo .resolve-passos li:last-child{min-height:0;padding-bottom:28px}}
@media (min-width:861px){.resolve.ativo .resolve-passos li:last-child{min-height:30vh}}

/* autora no celular: foto menor e no centro, texto centralizado, os três números lado a lado */
@media (max-width:840px){
  .autora{justify-items:center;text-align:center}
  .autora-foto{max-width:200px;margin:0 auto}
  .autora-texto{align-items:center}
  .autora .numeros{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;margin-top:.4rem;
    background:var(--fundo-alt);border:1px solid var(--borda);border-radius:16px;padding:14px 8px}
  .autora .numeros div{flex-direction:column;align-items:center;gap:2px}
  .autora .numeros div + div{border-left:1px solid var(--borda)}
  .autora .numeros strong{font-size:1.35rem}
  .autora .numeros span{font-size:.76rem;text-wrap:balance}
}

/* ===================================================================================
   marca-v2 (17/10/2026): o concursos.css da v13 + o que as paginas de produto pedem.
   As paginas de produto carregam este arquivo no lugar do concursos.css.
   =================================================================================== */
/* um livro so, no centro do palco; com segundo livro (Vol. 2 + caderno), o leque de sempre */
.palco-capas .livro3d.solo{left:50%;margin-left:calc(var(--w) / -2);--gira:calc(-16deg - var(--abre) * 14deg);z-index:2}
.livro3d .l-lombada b{font-size:.5em;font-weight:600;color:#fff;letter-spacing:.04em}
/* o palco do mecanismo mostra paginas reais do e-book, uma por cartao */
.cena.pag{padding:0;background:#fff}
.cena.pag img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 8%}
.cena.pag figcaption{position:absolute;left:14px;bottom:14px;background:rgba(18,8,40,.86);color:#fff;
  padding:7px 14px;border-radius:99px;font-size:.84rem;font-weight:500}
/* conteudos abordados: chips com check */
.temas-lista{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.temas-lista li{display:flex;gap:10px;align-items:center;background:#fff;border:1px solid var(--borda);border-radius:14px;
  padding:11px 14px;font-size:.98rem;color:var(--corpo)}
.temas-lista svg{flex:none;width:18px;height:18px;fill:none;stroke:var(--violeta);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.temas-lista li.mais{display:none}
.temas-aberto .temas-lista li.mais{display:flex}
.temas-botao{display:block;margin:18px auto 0;background:none;border:1.5px solid var(--violeta);color:var(--violeta);
  border-radius:99px;padding:10px 22px;font:inherit;font-weight:600;cursor:pointer}
@media(max-width:840px){.temas-lista{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.temas-lista{grid-template-columns:1fr}.temas-lista li{padding:9px 12px;font-size:.93rem}}
/* veja por dentro: as tres paginas em leque, ampliam no toque (efeitos.js) */
.amostras.leque figure{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.amostras.leque img{border-radius:10px;box-shadow:0 22px 60px -22px rgba(18,8,40,.45)}
@media (hover:hover){.amostras.leque figure:hover{transform:translateY(-8px) rotate(0)!important}}
.amostras.leque figure:nth-child(1){transform:rotate(-2.5deg)}
.amostras.leque figure:nth-child(3){transform:rotate(2.5deg)}
/* a base da ideia: tres recortes de pesquisa, curtos, com o link que abre o estudo */
.recortes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px}
.recorte{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid var(--borda);border-radius:18px;
  padding:20px 20px 18px;text-decoration:none;color:var(--corpo);transition:transform .25s,box-shadow .25s}
.recorte:hover{transform:translateY(-4px);box-shadow:0 18px 40px -20px rgba(93,23,235,.35);color:var(--corpo)}
.recorte-rev{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:.88rem;color:#6b6380;
  border-bottom:1px solid var(--borda);padding-bottom:8px}
.recorte-frase{font-size:1.06rem;font-weight:600;color:#1d1236;line-height:1.35}
.recorte-autor{font-size:.82rem;color:#7a7290;margin-top:auto}
.recorte-autor u{color:var(--violeta);text-decoration:none;font-weight:600}
.base-virada{margin:22px 0 0;font-size:1.05rem}
@media(max-width:820px){.recortes{grid-template-columns:1fr}}
/* prints: mosaico na identidade nova */
.mosaico.v2 img{border-radius:14px;box-shadow:0 16px 40px -22px rgba(18,8,40,.5)}
/* oferta de um produto so */
.preco-pagina{margin:2px 0 0;color:#CFC4EE;font-size:.95rem}
.cartao-oferta .preco-pagina{color:var(--corpo)}
.vendidos{display:inline-flex;gap:8px;align-items:center;margin:0 0 14px;padding:6px 14px;border-radius:99px;
  background:rgba(183,158,255,.14);color:#E8E2FA;font-size:.9rem}
.vendidos b{color:#fff}
/* celular: as tres paginas viram carrossel de arrasto (tres A4 empilhadas eram tres telas) */
@media(max-width:820px){
  .amostras.leque{display:flex;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;
    margin-inline:-20px;padding:6px 20px 18px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .amostras.leque::-webkit-scrollbar{display:none}
  .amostras.leque figure{flex:0 0 74%;scroll-snap-align:center;transform:none!important}
}
/* ---- home v2 ---- */
.palco-leque{position:relative;width:min(760px,96vw);height:clamp(240px,40vw,380px);margin-top:26px;perspective:1600px}
.palco-leque .brilho-chao{position:absolute;left:6%;right:6%;bottom:0;height:18%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(123,69,240,.55),transparent);filter:blur(10px)}
.palco-leque .leque{position:absolute;bottom:8%;left:50%;--w:clamp(110px,19vw,190px);margin-left:calc(var(--w) / -2);
  animation:leque-abre 1.1s cubic-bezier(.2,.7,.2,1) both}
.palco-leque .l0{--x:-150%;--gira:-28deg;z-index:1;animation-delay:.15s}
.palco-leque .l1{--x:-78%;--gira:-16deg;z-index:2;animation-delay:.25s}
.palco-leque .l2{--x:0%;--gira:0deg;z-index:5;animation-delay:.35s}
.palco-leque .l3{--x:78%;--gira:16deg;z-index:2;animation-delay:.25s}
.palco-leque .l4{--x:150%;--gira:28deg;z-index:1;animation-delay:.15s}
.palco-leque .leque{translate:var(--x) 0}
@keyframes leque-abre{from{translate:0 30px;opacity:0}to{translate:var(--x) 0;opacity:1}}
@media(max-width:600px){.palco-leque .l0,.palco-leque .l4{display:none}.palco-leque .l1{--x:-62%}.palco-leque .l3{--x:62%}}
@media (prefers-reduced-motion:reduce){.palco-leque .leque{animation:none}}
.conc-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:center}
.conc-grid .oferta-livros{margin:0}
@media(max-width:820px){.conc-grid{grid-template-columns:1fr;text-align:center}.conc-grid .oferta-livros{margin-bottom:10px}}
.vitrine-v2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.vit{display:grid;grid-template-columns:130px 1fr;gap:18px;align-items:center;background:#fff;border:1px solid var(--borda);
  border-radius:22px;padding:18px 20px;text-decoration:none;color:var(--corpo);transition:transform .25s,box-shadow .25s}
.vit:hover{transform:translateY(-4px);box-shadow:0 22px 50px -24px rgba(93,23,235,.45);color:var(--corpo)}
.vit-capa{perspective:900px;display:flex;justify-content:center}
.vit .livro3d{--w:104px;--gira:-18deg}
.vit:hover .livro3d{--gira:-6deg}
.vit h3{margin:4px 0 2px;font-size:1.18rem;color:#1d1236}
.vit p{margin:0 0 6px;font-size:.93rem;line-height:1.45}
.vit-dados{color:var(--violeta);font-weight:600;font-size:.85rem!important}
.vit-vend{display:inline-block;background:#FDE9E5;color:#B5412E;border-radius:99px;padding:3px 10px;font-size:.74rem;font-weight:600}
.vit-ir{display:inline-flex;gap:6px;align-items:center;color:var(--violeta);font-weight:600;font-size:.9rem}
.vit-ir svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:820px){.vitrine-v2{grid-template-columns:1fr}.vit{grid-template-columns:96px 1fr;padding:14px 16px;gap:14px}
  .vit .livro3d{--w:80px}}

/* 18/10: botao no fim das duvidas fundidas */
.faq-cta{text-align:center;margin-top:1rem}
.faq details p strong{color:var(--tinta)}
/* 18/10: vitrine com a linha de ganho; os dois livros do Concursos juntos */
.vit h3 small{font-weight:500;font-size:.8rem;color:var(--violeta);white-space:nowrap}
.vit-ganho{color:#1d1236;font-weight:500}
.conc-grid .oferta-livros{gap:0}
.conc-grid .oferta-livros .livro3d.v2{margin-left:-28px;margin-top:34px}
/* 18/10 (3ª): destaque do Concursos — os dois livros do MESMO tamanho, lado a lado, com um celular da altura
   deles na frente mostrando o PDF aberto no gabarito (a certa e as erradas comentadas). Antes o Vol. 2 ficava
   abaixo e parecia menor; o tablet que veio depois ficou grande demais perto dos livros (pedido dele). */
.conc-mockup{position:relative;width:min(440px,92vw);margin:0 auto;padding-bottom:4%;display:flex;justify-content:center;align-items:flex-end}
.conc-mockup .par{display:flex;align-items:flex-end;perspective:1100px}
.conc-mockup .livro3d{--w:min(160px,31vw);margin:0}
.conc-mockup .livro3d.v1{--gira:28deg;z-index:1}
.conc-mockup .livro3d.v2{--gira:28deg;z-index:2;margin-left:calc(var(--w) * -.08)}
.conc-mockup .fone{position:relative;z-index:3;width:min(116px,23vw);aspect-ratio:300/650;margin:0 0 -3% -6%;padding:4px;
  border-radius:20px;background:#0f0d16;box-shadow:0 0 0 1.5px #4a4262 inset,0 28px 50px -16px rgba(0,0,0,.75);transform:rotate(5deg);order:2;margin-left:-7%}
.conc-mockup .fone img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;border-radius:16px}
.conc-mockup .ilha{position:absolute;top:9px;left:50%;width:30%;height:9px;margin-left:-15%;border-radius:9px;background:#0f0d16;z-index:1}
.conc-mockup::after{content:"";position:absolute;left:4%;right:4%;bottom:-4%;height:16%;border-radius:50%;z-index:-1;
  background:radial-gradient(closest-side,rgba(123,69,240,.55),transparent);filter:blur(10px)}
@media(max-width:820px){.conc-mockup{margin-top:18px}}
.conc-numeros{list-style:none;padding:0;margin:14px 0 22px;display:grid;gap:8px;color:#e9e3ff;font-size:.98rem}
.conc-numeros li{padding-left:22px;position:relative}
.conc-numeros li::before{content:"";position:absolute;left:0;top:.5em;width:10px;height:10px;border-radius:50%;background:#7CE0A8}
.conc-numeros b{color:#fff}
@media(max-width:820px){.conc-numeros{text-align:left;max-width:30rem;margin-inline:auto}}
@media(min-width:821px){.conc-mockup{width:500px}.conc-mockup .livro3d{--w:180px}.conc-mockup .fone{width:130px}}
/* 18/10: celular menor que os livros (pedido dele: do mesmo tamanho ficava desproporcional) — ~70% da altura do livro */
.conc-mockup{--lw:min(160px,31vw)}
@media(min-width:821px){.conc-mockup{--lw:180px}}
.conc-mockup .livro3d{--w:var(--lw)}
.conc-mockup .fone{width:calc(var(--lw) * .46);border-radius:14px;padding:3px;margin-left:-9%;margin-bottom:-2%}
.conc-mockup .fone img{border-radius:11px}
.conc-mockup .ilha{top:6px;height:6px}

/* =================== v6 (18/10): aparelhos no topo (5b) e etiquetas do Vol. 2 (5c) =================== */
/* o livro no centro, o tablet atras a esquerda e o celular na frente a direita, cada um com pagina real */
.palco-capas .disp-tab,.palco-capas .disp-fone{position:absolute;background:#0f0d16;
  box-shadow:0 0 0 1.5px #4a4262 inset,0 28px 50px -16px rgba(0,0,0,.75)}
.palco-capas .disp-tab img,.palco-capas .disp-fone img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.palco-capas .disp-tab{left:calc(9% - var(--abre) * 4%);bottom:12%;width:calc(var(--w, min(230px,36vw)) * .86);
  aspect-ratio:360/480;padding:calc(min(230px,36vw) * .045);border-radius:calc(min(230px,36vw) * .07);
  transform:rotate(-4deg);z-index:0}
.palco-capas .disp-tab img{border-radius:calc(min(230px,36vw) * .025)}
.palco-capas .disp-fone{left:calc(61% + var(--abre) * 4%);bottom:13%;width:calc(min(230px,36vw) * .46);
  aspect-ratio:300/650;padding:3px;border-radius:14px;transform:rotate(6deg);z-index:3}
.palco-capas .disp-fone img{border-radius:11px}
.palco-capas .disp-fone .ilha{position:absolute;top:6px;left:50%;width:30%;height:6px;margin-left:-15%;border-radius:9px;background:#0f0d16;z-index:1}
/* com aparelhos o livro sai um pouco do centro para a direita, para o tablet aparecer */
.palco-capas .disp-tab ~ .palco-3d .livro3d.solo{left:54%}
/* etiquetas: deixam claro que guia e caderno sao dois arquivos (as capas so mudam o titulo) */
.livro3d .l-etiqueta{left:50%;bottom:9%;transform:translateX(-50%) translateZ(calc(var(--esp) / 2 + 1px));
  background:#F79382;color:#1b0c3d;font-weight:700;font-size:clamp(.56rem,calc(var(--w) * .062),.82rem);line-height:1.2;
  padding:.35em .8em;border-radius:99px;white-space:nowrap;box-shadow:0 6px 16px -6px rgba(0,0,0,.6)}
.livro3d.v1 .l-etiqueta,.livro3d.solo .l-etiqueta{background:#CFEDFF}
.palco-capas .d-etiqueta{position:absolute;left:-6%;top:-11px;z-index:2;
  background:#F79382;color:#1b0c3d;font-weight:700;font-size:clamp(.56rem,2.4vw,.78rem);padding:.3em .8em;
  border-radius:99px;white-space:nowrap}
@media (max-width:860px){.palco-capas .d-etiqueta{top:-9px}}
.palco-capas .vidro{z-index:4}
.livro3d .l-etiqueta{white-space:normal;max-width:90%;width:max-content;text-align:center}
.livro3d.solo .l-etiqueta{left:7%;transform:translateZ(calc(var(--esp) / 2 + 1px))}
