/* "Como posso ajudar" v7: pilha de cartões (ajuda-pilha.js).
   Cartão largo, branco-papel, com o desenho do medidor num painel de cor à direita; grudam no topo e se empilham. */
.ajuda.has-pilha .seletor,.ajuda.has-pilha .mural{display:none}
.ajuda.has-pilha{background:#f6efe1}
.pilha-aviso{margin:clamp(22px,3vw,34px) auto 0;max-width:42ch;text-align:center;font:600 14.5px/1.5 var(--font-body);color:rgba(29,20,36,.62)}
.pilha{position:relative;max-width:1120px;margin:clamp(36px,5vw,64px) auto 0;padding-bottom:6svh;display:flex;flex-direction:column;gap:12svh}

.pilha-card{--cobre:0;position:sticky;top:calc(88px + var(--i) * 14px);display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  min-height:min(560px,calc(100svh - 150px));border-radius:28px;overflow:hidden;background:#fffaf1;color:#1d1424;
  box-shadow:0 -1px 0 rgba(255,255,255,.7) inset,0 30px 70px -40px rgba(40,20,60,.45),0 0 0 1px rgba(29,20,36,.07);
  transform-origin:50% 0;transform:scale(calc(1 - var(--cobre) * .06));filter:brightness(calc(1 - var(--cobre) * .12));
  will-change:transform}
/* texto */
.pc-texto{display:flex;flex-direction:column;gap:clamp(14px,2svh,22px);padding:clamp(28px,4vw,56px)}
.pc-topo{display:flex;align-items:center;gap:14px;margin:0}
.pc-num{font:800 clamp(2.6rem,4.6vw,4rem)/.9 var(--font-headline);letter-spacing:-.05em;color:#521180}
.pc-tema{padding:7px 14px;border-radius:999px;background:#521180;color:#f6efe1;font:700 13px var(--font-body);letter-spacing:.02em}
.pc-frase{margin:0;font-family:var(--font-headline);font-weight:800;font-size:clamp(1.7rem,2.9vw,2.6rem);line-height:1.04;letter-spacing:-.03em;max-width:16ch;text-wrap:balance}
.pc-md .md{gap:10px;margin:auto 0 0}
.pc-md .md-q{font-size:clamp(1rem,1.25vw,1.12rem)}
.pc-md .md-r{min-height:2.6em}
.pc-rodape{display:flex;align-items:center;gap:14px}
.pc-wa{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:999px;background:#1d1424;color:#f6efe1;text-decoration:none;font:700 14.5px var(--font-body);transition:transform .3s ease,background .3s ease}
.pc-wa::after{content:'';width:7px;height:7px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}
.pc-wa:hover{transform:translateY(-2px);background:#521180}
.pc-wa:focus-visible{outline:3px solid #f59e0b;outline-offset:3px}
/* desenho em destaque */
.pc-arte{position:relative;display:grid;place-items:center;background:var(--tom);overflow:hidden}
.pc-arte::before{content:'';position:absolute;inset:-20%;background:radial-gradient(50% 45% at 50% 50%,rgba(255,255,255,.55),rgba(255,255,255,0) 70%);pointer-events:none}
.pc-arte .md-vis{position:relative;width:100%;height:100%;min-height:260px;background:none;box-shadow:none;border-radius:0;transform:scale(1.55)}
@media (max-width:1000px){ .pc-arte .md-vis{transform:scale(1.3)} }

/* entrada do cartão: o conteúdo chega em sequência, devagar */
.pilha-card .pc-topo,.pilha-card .pc-frase,.pilha-card .pc-md,.pilha-card .pc-rodape{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform 1s cubic-bezier(.2,.7,.2,1)}
.pilha-card .pc-arte .md-vis{opacity:0;transition:opacity 1s ease .3s}
.pilha-card.is-in .pc-topo,.pilha-card.is-in .pc-frase,.pilha-card.is-in .pc-md,.pilha-card.is-in .pc-rodape{opacity:1;transform:none}
.pilha-card.is-in .pc-frase{transition-delay:.1s}.pilha-card.is-in .pc-md{transition-delay:.22s}.pilha-card.is-in .pc-rodape{transition-delay:.32s}
.pilha-card.is-in .pc-arte .md-vis{opacity:1}

/* celular e tablet em pé: desenho em cima, texto embaixo */
@media (max-width:860px){
  .pilha{gap:8svh;padding-inline:4px}
  .pilha-card{top:calc(72px + var(--i) * 8px);grid-template-columns:1fr;grid-template-rows:auto 1fr;min-height:0;border-radius:22px}
  .pc-arte{order:-1;height:clamp(150px,24svh,210px)}
  .pc-arte .md-vis{min-height:0;transform:scale(1.05)}
  .pc-texto{padding:20px 20px 22px;gap:12px}
  .pc-num{font-size:2.3rem}
  .pc-frase{font-size:clamp(1.45rem,6.4vw,1.8rem)}
  .pc-wa{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  .pilha-card{position:relative;top:auto;transform:none;filter:none}
  .pilha-card .pc-topo,.pilha-card .pc-frase,.pilha-card .pc-md,.pilha-card .pc-rodape,.pilha-card .pc-arte .md-vis{opacity:1;transform:none;transition:none}
}
/* a seção cortava o que sai pelas bordas com overflow:hidden, o que impede os cartões de grudarem; clip corta igual e deixa o sticky funcionar */
.ajuda.has-pilha{overflow:clip !important}
