/* "Como posso ajudar" (v2): índice de revista à esquerda (6 temas numerados, o da vez em destaque)
   e, à direita, um painel escuro com uma pequena cena de cada tema, no espírito do "Como funciona".
   Sem manchas de cor, sem pílulas: tipografia, fios finos e uma cena por vez. A troca de tema continua no script do index. */
.ajuda.aj2{--aj-ink:#1d1424;--aj-paper:#f6efe1;--aj-amber:#f59e0b;--aj-muted:rgba(29,20,36,.5);
  background:var(--aj-paper);padding:clamp(96px,12vw,150px) 0 clamp(90px,10vw,130px)}
.aj2 .ajuda-bg{display:none}

/* cabeçalho: rótulo simples com um fio, título grande */
.aj2 .ajuda-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(20px,5vw,80px);align-items:end}
.aj2 .eyebrow{grid-column:1 / -1;display:flex;align-items:center;gap:14px;margin:0 0 6px;padding:0;background:none;border:0;
  font:600 13px var(--font-body);letter-spacing:.04em;text-transform:none;color:var(--aj-ink)}
.aj2 .eyebrow::before{content:'';width:34px;height:1.5px;background:var(--aj-amber);border:0;border-radius:0;flex:none}
.aj2 .eyebrow img,.aj2 .eyebrow svg{display:none}
.ajuda.aj2 h2{margin:0;max-width:16ch;font-size:clamp(2.3rem,5vw,4.3rem);line-height:1;letter-spacing:-.035em;color:var(--aj-ink)}
.ajuda.aj2 .lede{margin:0;max-width:40ch;font-size:clamp(16px,1.25vw,18px);line-height:1.6;color:rgba(29,20,36,.72)}
.aj2 .lede strong{color:var(--aj-ink)}

/* índice: linhas tipográficas numeradas */
.aj2 .seletor{margin-top:clamp(44px,6vw,80px);grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(24px,4vw,64px);align-items:start}
.aj2 .sinais{gap:0;counter-reset:tema;border-top:1px solid rgba(29,20,36,.14)}
.aj2 .sinais li{counter-increment:tema}
.aj2 .sinal{display:grid;grid-template-columns:44px 1fr;column-gap:12px;row-gap:2px;padding:20px 4px 22px 0;border:0;border-bottom:1px solid rgba(29,20,36,.14);border-radius:0;
  background:none;color:var(--aj-muted);transition:color .45s ease}
.aj2 .sinal::before{content:counter(tema,decimal-leading-zero);position:static;inset:auto;z-index:auto;grid-row:1 / span 2;transform:none;background:none;border-radius:0;
  padding-top:5px;font:600 13px var(--font-body);font-variant-numeric:tabular-nums;letter-spacing:.06em;color:inherit;transition:color .45s ease}
.aj2 .sinal:hover{color:rgba(29,20,36,.8)}
.aj2 .sinal.is-on{color:var(--aj-ink)}
.aj2 .sinal.is-on::before{color:var(--aj-amber);transform:none}
.aj2 .sinal-t{font-size:clamp(1.25rem,2vw,1.75rem);font-weight:800;letter-spacing:-.02em;line-height:1.15}
.aj2 .sinal-s{grid-column:2;font-size:14.5px;opacity:1;max-height:0;overflow:hidden;transition:max-height .5s ease,opacity .5s ease;opacity:0}
.aj2 .sinal.is-on .sinal-s{max-height:2.8em;opacity:.72}
.aj2 .sinal-bar{left:56px;right:0;bottom:-1px;height:1.5px;background:transparent}
.aj2 .sinal-bar i{background:var(--aj-amber)}
.aj2 .sinal:focus-visible{outline:2px solid var(--aj-amber);outline-offset:4px}

/* painel escuro, sóbrio, sem brilho */
.aj2 .painel-wrap{position:sticky;top:96px;border-radius:24px;background:var(--aj-ink);padding:clamp(26px,3vw,40px);min-height:0;
  box-shadow:0 40px 80px -40px rgba(29,20,36,.55)}
.aj2 .painel-glow{display:none}
.aj2 .painel{gap:18px}
.aj2 .painel-kicker{font:600 12px var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--aj-amber)}
.aj2 .painel-big{font-size:clamp(1.7rem,2.8vw,2.6rem);line-height:1.04;letter-spacing:-.03em;max-width:17ch;color:var(--cream)}
.aj2 .painel-label{font-size:11.5px;letter-spacing:.12em;color:rgba(250,243,224,.5)}
.aj2 .painel li::before{width:12px;height:1.5px;border-radius:0;top:.72em}
.aj2 .painel-wa{text-decoration-color:var(--aj-amber)}
.ajuda.aj2 .ajuda-note{margin-top:clamp(36px,5vw,60px);font-size:15.5px;color:rgba(29,20,36,.68)}
.ajuda.aj2 .ajuda-note strong{color:var(--aj-ink)}

/* ---------- cenas (uma por tema) ---------- */
.ps{position:relative;height:150px;margin:-4px 0 6px;border-radius:16px;background:rgba(250,243,224,.04);border:1px solid rgba(250,243,224,.08);overflow:hidden;
  color:rgba(250,243,224,.8);font:600 11px var(--font-body);letter-spacing:.06em}
.ps *{box-sizing:border-box}

/* 1. energia da semana */
.ps-energia{display:flex;align-items:flex-end;justify-content:center;gap:clamp(10px,2.4vw,22px);padding:18px 22px 14px}
.ps-energia span{display:flex;flex-direction:column;align-items:center;gap:7px;height:100%;justify-content:flex-end}
.ps-energia i{display:block;width:clamp(12px,1.6vw,18px);height:var(--h);border-radius:6px 6px 3px 3px;background:linear-gradient(0deg,var(--aj-amber),#fbbf5a);
  transform-origin:bottom;animation:psGrow .9s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--k) * 90ms);transition:height .9s cubic-bezier(.16,1,.3,1)}
.ps-energia span:nth-child(n+6) i{background:rgba(250,243,224,.28)}
@keyframes psGrow{from{transform:scaleY(0)}}

/* 2. relógio de madrugada + pensamento que não para */
.ps-noite{display:flex;align-items:center;gap:20px;padding:0 24px}
.ps-noite b{font:800 clamp(2rem,4vw,2.8rem) var(--font-headline);letter-spacing:-.03em;color:var(--cream);font-variant-numeric:tabular-nums}
.ps-noite b em{font-style:normal;animation:psBlink 2s steps(1) infinite}
@keyframes psBlink{50%{opacity:.25}}
.ps-noite svg{flex:1;height:64px;overflow:visible}
.ps-noite path{fill:none;stroke:var(--aj-amber);stroke-width:2;stroke-linecap:round;stroke-dasharray:6 10;animation:psFlow 3.2s linear infinite}
@keyframes psFlow{to{stroke-dashoffset:-160}}
.ps-noite path{transition:opacity .6s ease}
.ps-noite.is-calma path{animation-duration:16s;opacity:.35}

/* 3. a régua que sobe */
.ps-regua{padding:0 26px;display:flex;flex-direction:column;justify-content:center;gap:12px}
.ps-regua .tr{position:relative;height:8px;border-radius:99px;background:rgba(250,243,224,.12)}
.ps-regua .fill{position:absolute;inset:0 auto 0 0;width:var(--f,58%);transition:width .85s cubic-bezier(.65,0,.35,1);border-radius:inherit;background:var(--aj-amber);transform-origin:left;animation:psFill 1.4s cubic-bezier(.65,0,.35,1) .2s both}
@keyframes psFill{from{transform:scaleX(0)}}
.ps-regua .flag{position:absolute;bottom:4px;left:var(--g,58%);width:2px;height:34px;background:var(--cream);transition:left .9s cubic-bezier(.65,0,.35,1)}
.ps-regua .flag::after{content:'';position:absolute;left:2px;top:0;width:16px;height:11px;background:var(--cream);clip-path:polygon(0 0,100% 50%,0 100%)}
.ps-regua small{display:flex;justify-content:space-between;color:rgba(250,243,224,.45)}

/* 4. tudo marcado, menos o que importa */
.ps-lista{display:flex;flex-direction:column;justify-content:center;gap:9px;padding:0 26px}
.ps-lista span{display:flex;align-items:center;gap:12px}
.ps-lista span::before{content:'';flex:none;width:16px;height:16px;border-radius:50%;background:var(--aj-amber) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%231d1424' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/100%;
  animation:psPop .5s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--k) * 180ms)}
.ps-lista span::after{content:'';height:6px;border-radius:9px;width:var(--w);background:rgba(250,243,224,.18)}
.ps-lista span.vazio::before{background:none;border:1.5px dashed rgba(250,243,224,.55);animation:psBreath 3.6s ease-in-out infinite}
@keyframes psPop{from{transform:scale(0);opacity:0}}
@keyframes psBreath{50%{transform:scale(1.15);opacity:.5}}

/* 5. o sinal que não chega */
.ps-elo{display:flex;align-items:center;justify-content:space-between;padding:0 clamp(26px,5vw,56px)}
.ps-elo i{flex:none;width:46px;height:46px;border-radius:50%;border:1.5px solid rgba(250,243,224,.6);background:radial-gradient(circle at 50% 38%,rgba(250,243,224,.6) 0 7px,transparent 7.5px),radial-gradient(ellipse 15px 10px at 50% 90%,rgba(250,243,224,.6) 0 99%,transparent)}
.ps-elo span{position:relative;flex:1;height:1.5px;margin:0 14px;background:repeating-linear-gradient(90deg,rgba(250,243,224,.3) 0 5px,transparent 5px 10px)}
.ps-elo span::after{content:'';position:absolute;top:-4px;left:0;width:9px;height:9px;border-radius:50%;background:var(--aj-amber);opacity:0;animation:psSend 3.4s ease-in-out .5s both}
.ps-elo span.go::after{animation:psSend2 3.4s ease-in-out both}
@keyframes psSend{0%{left:0;opacity:0}12%{opacity:1}55%{left:52%;opacity:1}75%,100%{left:58%;opacity:0}}
@keyframes psSend2{0%{left:0;opacity:0}12%{opacity:1}55%{left:52%;opacity:1}75%,100%{left:58%;opacity:0}}

/* 6. muitas abas pela metade */
.ps-abas{display:flex;flex-direction:column;justify-content:center;gap:8px;padding:0 26px}
.ps-abas span{position:relative;height:16px;border-radius:5px;background:rgba(250,243,224,.08);overflow:hidden;
  animation:psIn .6s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--k) * 120ms);margin-left:calc(var(--k) * 4%)}
.ps-abas span::after{content:'';position:absolute;inset:0 auto 0 0;width:var(--w);background:linear-gradient(90deg,var(--aj-amber),#fbbf5a);opacity:.85}
@keyframes psIn{from{transform:translateX(30px);opacity:0}}

/* gesto da cena: um botão discreto e a frase que responde */
.ps-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;margin:-2px 0 4px}
.ps-acao{display:inline-flex;align-items:center;gap:9px;padding:9px 16px 9px 12px;border-radius:999px;border:1px solid rgba(250,243,224,.3);background:rgba(250,243,224,.04);
  color:var(--cream);font:600 13.5px var(--font-body);cursor:pointer;transition:background .3s,border-color .3s,transform .2s}
.ps-acao::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--aj-amber);box-shadow:0 0 0 4px rgba(245,158,11,.18)}
.ps-acao:hover{background:rgba(250,243,224,.1);border-color:rgba(250,243,224,.55)}
.ps-acao:active{transform:scale(.97)}
.ps-acao:focus-visible{outline:2px solid var(--aj-amber);outline-offset:3px}
.ps-eco{margin:0;min-height:1.3em;font:italic 500 14.5px var(--font-body);color:#fbbf5a}
.ps-eco:not(:empty){animation:psEco .6s ease both}
@keyframes psEco{from{opacity:0;transform:translateY(4px)}}

/* celular e tablet */
@media (max-width:900px){
  .aj2 .ajuda-head{grid-template-columns:1fr;gap:16px}
  .aj2 .seletor{grid-template-columns:1fr;gap:16px}
  .aj2 .sinais{border-top:0;border-bottom:1px solid rgba(29,20,36,.14);flex-direction:row;gap:22px;margin-inline:-20px;padding-inline:20px}
  .aj2 .sinal{display:block;padding:12px 0 14px;border:0;border-radius:0}
  .aj2 .sinal::before{display:none}
  .aj2 .sinal-t{font-size:15.5px;font-weight:700;white-space:nowrap}
  .aj2 .sinal-bar{left:0;right:0;bottom:0}
  .aj2 .painel-wrap{position:relative;top:auto;padding:22px 20px;border-radius:20px}
  .ps{height:120px}
}
@media (prefers-reduced-motion:reduce){ .ps *,.ps *::before,.ps *::after{animation:none !important} }

/* ---------- v3: menos texto, mais cena ----------
   ordem no painel: tema > frase > cena > gesto > sinais em etiquetas > uma linha da terapia > botões */
.aj2 .sinal-s{display:none}
.aj2 .painel{display:flex;flex-direction:column}
.aj2 .painel-kicker{order:1}
.aj2 .painel-big{order:2;font-size:clamp(1.8rem,3vw,2.8rem)}
.aj2 .painel .ps{order:3;height:200px;margin:4px 0 0}
.aj2 .painel .ps-row{order:4}
.aj2 .painel-cols{order:5;display:flex;flex-direction:column;gap:14px;margin-top:2px}
.aj2 .painel-ctas{order:6}
.aj2 .painel-label{display:none}
.aj2 .painel-cols ul{flex-direction:row;flex-wrap:wrap;gap:8px}
.aj2 .painel-cols li{padding:7px 13px;border-radius:999px;background:rgba(250,243,224,.07);border:1px solid rgba(250,243,224,.12);font-size:13.5px;line-height:1.3;
  animation:psChip .6s cubic-bezier(.16,1,.3,1) both}
.aj2 .painel-cols li::before{display:none}
.aj2 .painel-cols li:nth-child(2){animation-delay:.12s}
.aj2 .painel-cols li:nth-child(3){animation-delay:.24s}
@keyframes psChip{from{opacity:0;transform:translateY(8px) scale(.96)}}
.aj2 .painel-ter{font-size:14.5px;line-height:1.55;color:rgba(250,243,224,.62);padding-left:14px;border-left:2px solid var(--aj-amber)}
/* cenas maiores, com mais espaço para respirar */
.ps-energia{gap:clamp(12px,2.8vw,28px);padding:24px 26px 16px}
.ps-energia i{width:clamp(14px,2vw,22px)}
.ps-noite b{font-size:clamp(2.4rem,4.6vw,3.4rem)}
.ps-elo i{width:56px;height:56px}
.ps-lista span,.ps-abas span{transform-origin:left}
@media (max-width:900px){ .aj2 .painel .ps{height:150px} }
@media (prefers-reduced-motion:reduce){ .aj2 .painel-cols li{animation:none} }

/* ---------- v4: pilha de cartões (ajuda-deck.js) ---------- */
.ajuda.has-deck .seletor{display:none}
.deck{margin-top:clamp(40px,6vw,72px);display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(28px,5vw,80px);align-items:center}
/* índice: nomes que levam ao cartão */
.deck-indice{list-style:none;margin:0;padding:0;border-top:1px solid rgba(29,20,36,.14)}
.deck-indice button{display:flex;align-items:baseline;gap:14px;width:100%;padding:15px 0;border:0;border-bottom:1px solid rgba(29,20,36,.14);background:none;cursor:pointer;text-align:left;
  font:800 clamp(1.05rem,1.5vw,1.35rem) var(--font-headline);letter-spacing:-.015em;color:rgba(29,20,36,.42);transition:color .4s ease,padding .4s cubic-bezier(.16,1,.3,1)}
.deck-indice button span{font:600 12px var(--font-body);letter-spacing:.06em;color:inherit}
.deck-indice button:hover{color:rgba(29,20,36,.75)}
.deck-indice li.is-on button{color:var(--aj-ink);padding-left:10px}
.deck-indice li.is-on button span{color:var(--aj-amber)}
.deck-indice button:focus-visible{outline:2px solid var(--aj-amber);outline-offset:3px}

/* pilha */
.deck-pilha{position:relative;height:clamp(560px,64vh,640px);perspective:1600px;outline:none;touch-action:pan-y}
.deck-pilha:focus-visible{outline:2px solid var(--aj-amber);outline-offset:8px;border-radius:30px}
.deck-card{--prof:0;--dx:0px;position:absolute;inset:0 0 auto;margin:0 auto;width:min(560px,100%);height:100%;
  transform:translate3d(calc(var(--dx) + var(--prof) * 16px), calc(var(--prof) * -14px), 0) rotate(calc(var(--prof) * 2.2deg + var(--dx) * .04deg)) scale(calc(1 - var(--prof) * .05));
  opacity:calc(1 - var(--prof) * .26);transition:transform .75s cubic-bezier(.16,1,.3,1),opacity .6s ease;cursor:grab;user-select:none}
.deck-card[style*="--prof: 3"],.deck-card[style*="--prof: 4"],.deck-card[style*="--prof: 5"]{opacity:0;pointer-events:none}
.deck-card.is-drag{transition:none;cursor:grabbing}
.deck-card.is-saindo{transition:transform .38s cubic-bezier(.55,0,.8,.2),opacity .38s ease;opacity:0}
.deck-giro{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.65,0,.35,1)}
.deck-card.is-flip .deck-giro{transform:rotateY(180deg)}
.deck-face{position:absolute;inset:0;display:flex;flex-direction:column;gap:16px;padding:clamp(24px,3vw,36px);border-radius:28px;background:var(--aj-ink);color:var(--cream);
  backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 50px 90px -46px rgba(29,20,36,.75),0 0 0 1px rgba(250,243,224,.05) inset;overflow:hidden}
.deck-verso{transform:rotateY(180deg);background:linear-gradient(160deg,#2a1838,var(--aj-ink) 60%)}
.deck-num{display:flex;align-items:baseline;gap:6px;margin:0;font:600 12px var(--font-body);letter-spacing:.06em;color:rgba(250,243,224,.45)}
.deck-num b{color:var(--aj-amber);font-weight:700}
.deck-num span{margin-left:auto;letter-spacing:.04em;text-transform:uppercase;color:rgba(250,243,224,.6)}
.ajuda.aj2 .deck-big{margin:2px 0 0;font-family:var(--font-headline);font-weight:800;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.02;letter-spacing:-.03em;color:var(--cream);max-width:16ch}
.deck-card .ps{flex:1;min-height:150px;height:auto;margin:0}
.deck-card .ps-row{margin:0}
.deck-acoes{display:flex;align-items:center;gap:12px;margin-top:auto;flex-wrap:wrap}
.deck-virar{padding:11px 18px;border-radius:999px;border:1px solid rgba(250,243,224,.3);background:none;color:var(--cream);font:600 14px var(--font-body);cursor:pointer;transition:background .3s,border-color .3s}
.deck-virar:hover{background:rgba(250,243,224,.08);border-color:rgba(250,243,224,.6)}
.ajuda .deck-wa{margin-left:auto;padding:11px 20px;border-radius:999px;background:var(--aj-amber);color:var(--aj-ink);text-decoration:none;font:700 14px var(--font-body)}
.deck-acoes .btn{margin-left:auto;padding:11px 20px;font-size:14px}
.deck-verso-t{margin:10px 0 0;font:600 12px var(--font-body);letter-spacing:.1em;text-transform:uppercase;color:rgba(250,243,224,.5)}
.deck-sinais{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.deck-sinais li{padding:14px 16px;border-radius:16px;background:rgba(250,243,224,.06);border:1px solid rgba(250,243,224,.1);font-size:15.5px;line-height:1.35;color:var(--cream)}
.deck-sinais li::before{display:none}
.deck-card.is-flip .deck-sinais li{animation:psChip .6s cubic-bezier(.16,1,.3,1) backwards}
.deck-card.is-flip .deck-sinais li:nth-child(1){animation-delay:.45s}
.deck-card.is-flip .deck-sinais li:nth-child(2){animation-delay:.55s}
.deck-card.is-flip .deck-sinais li:nth-child(3){animation-delay:.65s}
.ajuda .deck-ter{font-size:15px;line-height:1.55;color:rgba(250,243,224,.7);padding-left:14px;border-left:2px solid var(--aj-amber)}
.deck-dica{margin:18px 0 0;text-align:right;font:500 13px var(--font-body);color:rgba(29,20,36,.55)}
.deck-dica::before{content:'';display:inline-block;width:26px;height:1px;margin-right:10px;vertical-align:middle;background:currentColor;animation:deckHint 2.6s ease-in-out infinite}
@keyframes deckHint{0%,100%{transform:translateX(0)}50%{transform:translateX(8px)}}

@media (max-width:900px){
  .deck{grid-template-columns:1fr;gap:20px}
  .deck-col{order:2}
  .deck-indice{display:flex;gap:8px;overflow-x:auto;border:0;margin:0 -20px;padding:0 20px 4px;scrollbar-width:none}
  .deck-indice::-webkit-scrollbar{display:none}
  .deck-indice li{flex:none}
  .deck-indice button{width:auto;padding:9px 14px;border:1px solid rgba(29,20,36,.16);border-radius:999px;font:700 13.5px var(--font-body);white-space:nowrap}
  .deck-indice li.is-on button{padding-left:14px;background:var(--aj-ink);color:var(--cream);border-color:var(--aj-ink)}
  .deck-indice button span{display:none}
  .deck-pilha{height:540px}
  .deck-card{width:calc(100% - 24px)}
  .deck-dica{text-align:center}
}
@media (prefers-reduced-motion:reduce){ .deck-card,.deck-giro{transition:none} .deck-dica::before{animation:none} }
.deck > *{min-width:0}   /* a fileira de temas no celular não pode esticar a coluna */
/* ordem fixa dentro do cartão: número, frase, cena, gesto, botões */
.deck-frente > .deck-num{order:0}
.deck-frente > .deck-big{order:1}
.deck-frente > .ps{order:2}
.deck-frente > .ps-row{order:3}
.deck-frente > .deck-acoes{order:4}

/* ---------- v5: mural de anotações (ajuda-mural.js) ---------- */
.ajuda.has-mural .seletor{display:none}
.ajuda.has-mural{background:#f6efe1 repeating-linear-gradient(180deg,transparent 0 35px,rgba(29,20,36,.055) 35px 36px)}   /* papel pautado bem leve */
/* textos fora dos cartões: centralizados e fáceis de ler */
.has-mural .ajuda-head{display:block;text-align:center;max-width:720px;margin:0 auto}
.has-mural .eyebrow{justify-content:center;grid-column:auto}
.ajuda.aj2.has-mural h2{margin:0 auto;max-width:15ch;font-size:clamp(2.4rem,5vw,4.2rem)}
.ajuda.aj2.has-mural .lede{margin:18px auto 0;max-width:46ch;font-size:clamp(16px,1.3vw,18.5px);line-height:1.6}
.has-mural .ajuda-note{text-align:center;margin-left:auto;margin-right:auto}

.mural{position:relative;max-width:980px;margin:clamp(48px,7vw,88px) auto 0;display:flex;flex-direction:column;gap:clamp(8px,2vw,24px)}
.mural-linha{position:absolute;left:0;top:0;width:100%;pointer-events:none;overflow:visible}
.mural-linha path{fill:none;stroke:rgba(29,20,36,.32);stroke-width:1.6;stroke-linecap:round}
.mural-linha{-webkit-mask:repeating-linear-gradient(90deg,#000 0 7px,transparent 7px 13px);mask:repeating-linear-gradient(90deg,#000 0 7px,transparent 7px 13px)}   /* tracejado (o traço em si é desenhado pela rolagem) */

/* cartão de papel */
.mural-card{--tilt:-2.5deg;--cor:#fde7c4;position:relative;z-index:1;width:min(480px,88%);padding:34px clamp(22px,2.6vw,32px) 24px;border-radius:18px;background:var(--cor);color:var(--aj-ink);
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 22px 40px -22px rgba(29,20,36,.45),0 4px 10px -6px rgba(29,20,36,.25);
  display:flex;flex-direction:column;gap:14px;transform:rotate(var(--tilt));transform-origin:50% 0;
  transition:transform 1s cubic-bezier(.34,1.3,.5,1),opacity .6s ease}
.mural-card:nth-of-type(odd){margin-right:auto}
.mural-card:nth-of-type(even){margin-left:auto;--tilt:2.5deg}
.mural-card + .mural-card{margin-top:clamp(-70px,-6vw,-20px)}
.mc-0{--cor:#fde4bd}.mc-1{--cor:#ece0ff}.mc-2{--cor:#ffdccf}.mc-3{--cor:#f3ead7}.mc-4{--cor:#e3dcf7}.mc-5{--cor:#fbe9c8}
/* entra balançando a partir do alfinete */
.mural-card:not(.is-in){opacity:0;transform:translateY(60px) rotate(calc(var(--tilt) * -4))}
.mural-pino{position:absolute;left:50%;top:12px;width:16px;height:16px;margin-left:-8px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#ffd28a,#f59e0b 45%,#a8620a);box-shadow:0 3px 4px rgba(29,20,36,.35);transition:transform .45s cubic-bezier(.34,1.6,.5,1) .55s}
.mural-card:nth-of-type(even) .mural-pino{background:radial-gradient(circle at 35% 30%,#d9b8ff,#7c3aed 45%,#3b1166)}
.mural-card:not(.is-in) .mural-pino{transform:translateY(-14px) scale(1.4)}
.mural-num{display:flex;align-items:baseline;gap:10px;margin:0;font:600 12.5px var(--font-body);letter-spacing:.04em;color:rgba(29,20,36,.6)}
.mural-num b{font:800 clamp(1.8rem,3vw,2.4rem) var(--font-headline);letter-spacing:-.03em;color:var(--aj-ink);line-height:1}
.mural-num span{text-transform:uppercase;letter-spacing:.08em}
.ajuda.aj2 .mural-big{margin:0;font-family:var(--font-headline);font-weight:800;font-size:clamp(1.55rem,2.5vw,2.1rem);line-height:1.06;letter-spacing:-.025em;color:var(--aj-ink);max-width:17ch}
/* cenas no papel: traço escuro e âmbar */
.mural-card .ps{height:150px;margin:0;background:rgba(29,20,36,.05);border-color:rgba(29,20,36,.1);color:rgba(29,20,36,.75)}
.mural-card .ps-energia span:nth-child(n+6) i{background:rgba(29,20,36,.22)}
.mural-card .ps-noite b{color:var(--aj-ink)}
.mural-card .ps-regua .tr{background:rgba(29,20,36,.12)}
.mural-card .ps-regua .flag,.mural-card .ps-regua .flag::after{background:var(--aj-ink)}
.mural-card .ps-lista span::after{background:rgba(29,20,36,.16)}
.mural-card .ps-lista span::before{background-color:var(--aj-ink);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%23fde4bd' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E")}
.mural-card .ps-lista span.vazio::before{background:none;border-color:rgba(29,20,36,.5)}
.mural-card .ps-elo i{border-color:rgba(29,20,36,.55);background:radial-gradient(circle at 50% 38%,rgba(29,20,36,.55) 0 7px,transparent 7.5px),radial-gradient(ellipse 15px 10px at 50% 90%,rgba(29,20,36,.55) 0 99%,transparent)}
.mural-card .ps-elo span{background:repeating-linear-gradient(90deg,rgba(29,20,36,.3) 0 5px,transparent 5px 10px)}
.mural-card .ps-abas span{background:rgba(29,20,36,.08)}
.mural-card .ps-acao{color:var(--aj-ink);border-color:rgba(29,20,36,.3);background:rgba(255,255,255,.35)}
.mural-card .ps-acao:hover{background:rgba(255,255,255,.7);border-color:rgba(29,20,36,.55)}
.mural-card .ps-eco{color:#8a4b00}
.mural-rodape{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:2px}
.mural-ver{padding:0;border:0;background:none;cursor:pointer;font:600 14px var(--font-body);color:rgba(29,20,36,.7);text-decoration:underline;text-underline-offset:4px}
.ajuda .mural-wa{margin-left:auto;padding:10px 18px;border-radius:999px;background:var(--aj-ink);color:var(--cream);text-decoration:none;font:700 14px var(--font-body)}
.mural-sinais{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.mural-sinais li{padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.55);border:1px solid rgba(29,20,36,.12);font-size:13.5px;color:var(--aj-ink);animation:psChip .5s cubic-bezier(.16,1,.3,1) backwards}
.mural-sinais li::before{display:none}
.mural-sinais li:nth-child(2){animation-delay:.08s}.mural-sinais li:nth-child(3){animation-delay:.16s}

@media (max-width:760px){
  .mural-card{width:94%;--tilt:-1.4deg}
  .mural-card:nth-of-type(even){--tilt:1.4deg}
  .mural-card + .mural-card{margin-top:-6px}
  .mural-card .ps{height:130px}
}
@media (prefers-reduced-motion:reduce){ .mural-card,.mural-pino{transition:none} .mural-card:not(.is-in){opacity:1;transform:rotate(var(--tilt))} }
/* ordem fixa no cartão do mural: número, frase, cena, gesto, rodapé, sinais */
.mural-card > .mural-num{order:0}.mural-card > .mural-big{order:1}.mural-card > .ps{order:2}
.mural-card > .ps-row{order:3}.mural-card > .mural-rodape{order:4}.mural-card > .mural-sinais{order:5}

/* cabeçalho do "Como posso ajudar": rótulo maior e centralizado; título em 2 linhas */
.ajuda.has-mural .ajuda-head{max-width:980px}
.ajuda.has-mural .eyebrow{justify-content:center;gap:14px;margin:0 0 16px;font:700 clamp(15px,1.3vw,18px) var(--font-body);letter-spacing:.02em;color:var(--aj-ink)}
.ajuda.has-mural .eyebrow::before,.ajuda.has-mural .eyebrow::after{content:'';width:40px;height:1.5px;background:var(--aj-amber);display:block}
.ajuda.aj2.has-mural h2{max-width:21ch;font-size:clamp(2.4rem,4.8vw,4.3rem);line-height:1.02}
@media (max-width:760px){ .ajuda.aj2.has-mural h2{max-width:none;font-size:clamp(2.1rem,8.6vw,2.8rem)} }
/* cartão do mural v6: imagem no centro, sem gesto nem frase de resposta (a cena se anima sozinha) */
.mural-card .ps-row{display:none}
.mural-card .ps{height:clamp(190px,18vw,230px)}
.mural-card .mural-rodape{justify-content:flex-end}
@media (max-width:760px){ .mural-card .ps{height:170px} }
.ajuda.has-mural .eyebrow{width:fit-content;margin-left:auto !important;margin-right:auto !important}