/* Páginas internas da v4: Quem somos, Facilitação, Consultoria e Educação
   corporativa. Usa os papéis de tokens.css e as peças de kiwi.css (moldura,
   seções, post-its, cartões, formulário, movimento); aqui ficam só as
   composições próprias, na ordem em que aparecem nas páginas. */

/* ------------------------------------------------------------------ peças comuns */
.declaracao{margin-top:24px;font-size:clamp(1.275rem,1rem + .85vw,1.75rem);line-height:1.35;letter-spacing:-.01em;font-weight:600;max-width:28em}
.texto-corrido{margin-top:24px;display:grid;gap:14px;max-width:36em}
.fatos{margin-top:clamp(48px,6vw,80px);display:flex;flex-wrap:wrap;gap:12px 40px;font-size:17px}
.fatos strong{font-weight:600}
.fatos-lista{display:grid}
@media (min-width:900px){.fatos-lista{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* foto presa com fita: moldura de papel sobre o kraft, só a foto sobre o papel */
.foto-presa{position:relative;padding:10px 10px 14px;background:var(--bg-papel);transform:rotate(var(--r,0deg))}
.foto-presa img{width:100%;aspect-ratio:4/3;object-fit:cover}
.foto-presa figcaption{margin-top:10px}
.foto-presa .fita,.conta .fita,.ficha .fita,.formato-deixa .fita,.polaroide .fita{position:absolute;z-index:1;top:-13px;left:50%;width:112px;height:28px;background:var(--bg-nota-dourada);opacity:.85;transform:translateX(-50%) rotate(-3deg)}
.campo-papel .foto-presa{padding:0;background:none}
.janela-foto{display:block;overflow:clip}

/* cartão de recado solto (sem arrastar) */
.cartao-solto{padding:26px 26px 22px;border-radius:var(--raio-cartao);max-width:420px;transform:rotate(var(--r,0deg))}
.cartao-solto blockquote{font-size:var(--tipo-body);line-height:1.35;font-weight:600}
.cartao-solto cite{display:block;margin-top:14px;font-style:normal;font-size:15px;line-height:1.35}
.cartao-solto cite b{display:block;font-weight:600}

/* marcas de lista: o visto à mão e a semente do kiwi */
.checados li,.ganhos li{position:relative;padding-left:30px}
.checados li::before,.ganhos li::before{content:"";position:absolute;left:3px;top:.42em;width:15px;height:8px;border-left:3px solid currentColor;border-bottom:3px solid currentColor;transform:rotate(-45deg)}

/* perguntas frequentes: post-its que abrem */
.perguntas{columns:2 340px;column-gap:28px}
.perguntas-uma{columns:1}
.pergunta{break-inside:avoid;margin-bottom:18px;background:var(--bg-nota-amarela);color:var(--text-nota-amarela);transform:rotate(var(--rp,-.5deg))}
.pergunta:nth-child(4n+2){background:var(--bg-nota-pessego);color:var(--text-nota-pessego);--rp:.6deg}
.pergunta:nth-child(4n+3){background:var(--bg-nota-dourada);--rp:-.3deg}
.pergunta:nth-child(4n){background:var(--bg-campo);color:var(--text-campo);--rp:.4deg}
.campo-verde .pergunta:nth-child(4n){background:var(--bg-nota-branca);color:var(--text-nota-branca)}
.pergunta summary{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:18px 20px;font-weight:600;cursor:pointer;list-style:none}
.pergunta summary::-webkit-details-marker{display:none}
.pergunta summary::after{content:"+";flex:none;font-size:28px;font-weight:600;line-height:.8;transition:transform var(--mov-t-cartao) var(--mov-mola)}
.pergunta[open] summary::after{transform:rotate(45deg)}
.pergunta summary:focus-visible{outline-offset:-4px}
.pergunta p{max-width:38em;padding:0 20px 20px;font-size:17px;line-height:1.5}
.perguntas-grade{display:grid;gap:40px 64px}
@media (min-width:1024px){.perguntas-grade{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}}

/* ------------------------------------------------------------------ Quem somos */
.retratos{position:relative;container-type:inline-size;aspect-ratio:1;width:100%;max-width:600px;justify-self:end}
.polaroide{position:absolute;left:var(--x);top:var(--y);width:var(--l);padding:3cqw 3cqw 0;background:var(--bg-papel);transform:rotate(var(--r))}
.polaroide img{width:100%;aspect-ratio:1;object-fit:cover;object-position:50% 20%}
.polaroide figcaption{margin:0;padding:2cqw 0 2.4cqw;text-align:center;font-size:clamp(14px,3.3cqw,19px);line-height:1.15;color:var(--text-papel)}
.polaroide .fita{width:40%;height:5cqw;top:-2.4cqw}
@media (max-width:1023px){.conta,.votacao,.retratos,.dobra-foto{margin-top:32px}}
.selo{position:absolute;left:9cqw;top:66cqw;width:22cqw;height:auto;transform:rotate(var(--r))}

.origem-grade{display:grid;gap:48px}
@media (min-width:1024px){.origem-grade{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px;align-items:center}}
.origem-texto{margin-top:24px;max-width:36em}
.marcos{display:grid;gap:18px;justify-items:start}
.marcos li{display:grid;gap:6px;width:min(100%,440px);padding:20px 26px 22px;transform:rotate(var(--r))}
.marcos b{font-size:var(--tipo-display);line-height:.9;letter-spacing:-.015em;font-weight:600;font-variant-numeric:tabular-nums}
.marcos span{font-size:19px;font-weight:600;line-height:1.3}

.principios{display:grid;gap:20px}
@media (min-width:768px){.principios{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px 28px}.principios li:nth-child(even){margin-top:40px}}
/* quatro colunas só a partir de 1280 px: com a Montserrat, "permanece" não cabe numa coluna mais estreita */
@media (min-width:1280px){.principios{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,.9fr) minmax(0,1.15fr);align-items:start}.principios li:nth-child(1){min-height:280px}.principios li:nth-child(3){margin-top:16px}.principios li:nth-child(4){margin-top:72px}}
.principios li{display:flex;flex-direction:column;gap:12px;min-height:220px;padding:28px 24px 32px;transform:rotate(var(--r))}
.principios strong{font-size:var(--tipo-title);line-height:1.08}
@media (min-width:1280px) and (max-width:1439px){.principios strong{font-size:var(--tipo-body-lg)}}
.principios span{font-size:17px;line-height:1.45}

.socia figure img{width:100%;aspect-ratio:1;object-fit:cover;object-position:50% 22%;background:var(--bg-campo)}
.socia h3{font-size:var(--tipo-title-lg);line-height:1.05;letter-spacing:-.015em;font-weight:600}
.socia .papel{margin-top:6px;font-weight:600}
.socia-texto>p:not(.papel){margin-top:14px;max-width:34em}
.socia-principal{display:grid;gap:28px 56px}
@media (min-width:900px){.socia-principal{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center}}
.socia-principal .socia-texto>p:not(.papel){font-size:var(--tipo-body-lg);line-height:1.45}
.socias-par{margin-top:clamp(56px,6vw,96px);display:grid;gap:40px 56px}
@media (min-width:900px){.socias-par{grid-template-columns:1fr 1fr}}
.socias-par .socia{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:20px 24px;align-items:start}
.socias-par .socia h3{font-size:var(--tipo-title)}
@media (max-width:479px){.socias-par .socia{grid-template-columns:112px minmax(0,1fr)}}

/* o mural completo: nove cartões em grade, arrastáveis como na home */
.mural-grade{display:grid;gap:28px 32px;min-height:0;align-items:start}
@media (min-width:900px){
  .mural-grade{grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr) minmax(0,.95fr)}
  .mural-grade .cartao{position:relative;width:auto}
  .mural-grade .cartao:nth-child(3n+2){margin-top:40px}
  .mural-grade .cartao:nth-child(3n){margin-top:12px}
}
@media (max-width:767px){.mural-grade .cartao:nth-child(n+5){display:block}}

.imprensa-grade{display:grid;gap:56px 64px}
@media (min-width:1024px){.imprensa-grade{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center}}
.recortes{position:relative;aspect-ratio:1/.86;width:100%;max-width:560px}
.recorte{position:absolute;left:var(--x);top:var(--y);width:36%;height:auto;transform:rotate(var(--r))}
.materias{margin-top:36px;display:grid;gap:18px}
.materias li{display:grid;gap:2px}
.materias b{font-size:var(--tipo-body-lg);line-height:1.3;font-weight:600}
.materias span{font-size:15px;font-weight:600}
.materias a{display:inline-block;padding-block:2px;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.materias a:hover{text-decoration-thickness:3px}

/* ------------------------------------------------------------------ Facilitação */
.conta{position:relative;width:100%;max-width:600px;justify-self:end;padding:clamp(28px,3.4vw,44px);transform:rotate(var(--r))}
.conta-t{font-size:var(--tipo-title-lg);line-height:1.05}
.conta-sub{margin-top:8px;font-size:17px}
.contadores{margin-top:22px;display:grid;gap:12px}
.conta-kiwi{margin-top:18px}
.contador{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 20px}
.contador-r{font-weight:600;font-size:17px}
.contador-c{display:flex;align-items:center;gap:6px}
.contador button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:2px solid currentColor;border-radius:50%;background:transparent;font-size:24px;font-weight:600;line-height:1;cursor:pointer;transition:transform var(--mov-t-pressao) var(--mov-saida),background-color var(--mov-t-hover),color var(--mov-t-hover)}
.contador button:hover{background:var(--text-nota-amarela);color:var(--bg-nota-amarela)}
.contador button:active{transform:scale(.9)}
.contador button[aria-disabled="true"]{opacity:.4;cursor:not-allowed}
.contador output{min-width:3ch;text-align:center;font-weight:600;font-size:var(--tipo-title);font-variant-numeric:tabular-nums}
html:not(.js) .contador button{display:none}
.conta-res{margin-top:18px;font-size:var(--tipo-body-lg);line-height:1.4}
.conta-res b{font-weight:600}
.conta-num{display:inline-block;font-size:var(--tipo-title-lg);line-height:1;letter-spacing:-.03em}
.conta-kiwi{font-weight:600;font-size:17px}

.dif-grade{display:grid;gap:56px 64px}
@media (min-width:1024px){.dif-grade{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center}.dif-grade>.lista-larga{grid-column:1 / -1}}
.dif-lado{display:grid}
/* "O que fazemos de diferente" é uma faixa embaixo do texto e da foto: o título à esquerda, a lista em duas colunas */
@media (min-width:768px){
  .lista-nota.lista-larga{margin:0}
  .lista-nota.lista-larga .checados{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 32px}
}
@media (min-width:1024px){
  .lista-nota.lista-larga{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:20px 48px;align-items:start}
  .lista-nota.lista-larga h3{margin-bottom:0}
}
.lista-nota{position:relative;margin:24px 0 0 10%;padding:28px 26px 30px;transform:rotate(var(--r))}
.lista-nota h3{margin-bottom:14px;font-size:var(--tipo-title);line-height:1.1}
.checados{display:grid;gap:10px;font-size:17px;line-height:1.4}

.escada{display:grid;gap:18px}
.escada li{display:flex;flex-direction:column;gap:10px;padding:24px 22px 28px;transform:rotate(var(--r))}
.escada strong{font-size:var(--tipo-body-lg);line-height:1.12}
.escada span{font-size:17px;line-height:1.4}
@media (max-width:639px){.escada li:nth-child(even){margin-left:18px}}
@media (min-width:640px) and (max-width:1199px){.escada{grid-template-columns:1fr 1fr;gap:22px 24px}.escada li:nth-child(even){margin-top:36px}}
@media (min-width:1200px){
  .escada{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;align-items:end}
  .escada li{min-height:230px}
  .escada li:nth-child(2){margin-bottom:36px}
  .escada li:nth-child(3){margin-bottom:72px}
  .escada li:nth-child(4){margin-bottom:108px}
  .escada li:nth-child(5){margin-bottom:144px}
}
.escada-pe{margin-top:48px;display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center}

.metodos-grade{display:grid;gap:40px}
@media (min-width:1024px){
  /* as duas metodologias lado a lado, da mesma altura; a foto vira uma faixa larga embaixo delas */
  .metodos-grade{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:40px 48px;align-items:stretch}
  .ficha-mesa{display:flex;flex-direction:column;justify-content:center}
  .metodos-foto{grid-column:1 / -1}
  .metodos-foto img{aspect-ratio:16/5;object-position:50% 42%}
}
.ficha{position:relative;padding:clamp(28px,3.6vw,52px);transform:rotate(var(--r))}
.ficha h3{font-size:var(--tipo-title-lg);line-height:1.02;letter-spacing:-.03em;font-weight:600}
.ficha-sub{margin-top:12px;font-size:var(--tipo-body-lg);line-height:1.4;max-width:30em}
.ficha-etapas{margin-top:28px;display:grid;gap:18px}
@media (min-width:640px){.ficha-etapas{grid-template-columns:1fr 1fr;gap:22px 32px}}
.ficha-etapas b{display:block;font-size:var(--tipo-body-lg);line-height:1.1}
.ficha-etapas span{display:block;margin-top:6px;font-size:17px;line-height:1.4}

.fora-grade{display:grid;gap:48px 64px}
@media (min-width:1024px){.fora-grade{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}}
.fora-foto img{width:100%;aspect-ratio:4/5;object-fit:cover}
@media (max-width:1023px){.fora-foto img{aspect-ratio:4/3}.fora-grade>div{order:-1}}
.razoes{margin-top:32px;display:grid;gap:18px}
.razoes div{position:relative;padding-left:32px}
.razoes div::before{content:"";position:absolute;left:6px;top:.45em;width:11px;aspect-ratio:.62;background:currentColor;border-radius:50% 50% 50% 50% / 62% 62% 38% 38%;transform:rotate(-14deg)}
.razoes dt{font-weight:600;font-size:var(--tipo-body-lg);line-height:1.3}
.razoes dd{margin:2px 0 0;font-size:17px}

/* ------------------------------------------------------------------ Consultoria */
.votacao{width:100%;max-width:620px;justify-self:end}
.votacao-t{font-size:var(--tipo-title);line-height:1.1;letter-spacing:-.02em;font-weight:600;color:var(--text-titulo)}
.votacao-sub{margin-top:6px;font-size:17px}
.votos-parede{margin-top:22px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (min-width:1200px),(min-width:560px) and (max-width:1023px){.votos-parede{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* abaixo de 360 px, "Planejamento" e "Engajamento" não cabem em três colunas */
@media (max-width:359px){.votos-parede{grid-template-columns:repeat(2,minmax(0,1fr))}}
.votos-parede li{transform:rotate(var(--r))}
.voto{position:relative;display:flex;align-items:flex-start;justify-content:center;width:100%;aspect-ratio:1;padding:14% 8% 0;border:0;text-align:center;font-family:var(--fonte-nota);font-weight:600;font-size:clamp(14px,1.15vw,17px);line-height:1.12;hyphens:auto;overflow-wrap:break-word;cursor:pointer;transition:transform var(--mov-t-cartao) var(--mov-mola)}
.voto::after{content:"";position:absolute;left:50%;bottom:13%;width:13%;aspect-ratio:.62;background:currentColor;border-radius:50% 50% 50% 50% / 62% 62% 38% 38%;opacity:0;transform:translateX(-50%) translateY(-10px) rotate(-40deg) scale(1.6);transition:transform .5s var(--mov-mola),opacity .2s ease}
.voto[aria-pressed="true"]{outline:3px dashed currentColor;outline-offset:-8px}
.voto[aria-pressed="true"]::after{opacity:1;transform:translateX(-50%) rotate(-14deg)}
.voto:focus-visible{outline:3px solid var(--border-foco);outline-offset:3px}
html:not(.js) .voto{cursor:default}
.votacao-pe{margin-top:20px;display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between}
.votacao-pe p{font-weight:600}
html:not(.js) .votacao-pe,html:not(.js) .votacao-sub{display:none}

.alem-grade{display:grid;gap:48px 64px}
@media (min-width:1024px){.alem-grade{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center}.alem-grade .colagem{order:-1}}
.colagem{display:grid}
.colagem{gap:0}
.colagem .foto-presa:nth-child(1){width:78%}
/* a legenda da primeira foto ficou mais larga com a Montserrat: a segunda desce para a fita não cobrir a legenda */
.colagem .foto-presa:nth-child(2){width:64%;justify-self:end;margin-top:32px}

.pilares{width:100%;border-collapse:separate;border-spacing:0 14px}
.pilares th[scope="col"]{padding:0 18px 4px;text-align:left;font-size:var(--tipo-body-lg);font-weight:600}
.pilares th[scope="row"]{width:26%;padding:4px 18px 4px 0;text-align:left}
.pilares th[scope="row"] span{display:inline-block;padding:16px 20px 18px;font-size:var(--tipo-body-lg);line-height:1.1;transform:rotate(var(--r))}
.pilares td{padding:10px 18px;font-size:var(--tipo-body);line-height:1.4;vertical-align:middle}
@media (max-width:767px){
  .pilares,.pilares tbody,.pilares tr,.pilares th,.pilares td{display:block;width:auto}
  .pilares thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .pilares tr{margin-bottom:28px}
  .pilares th[scope="row"]{padding:0 0 10px}
  .pilares td{padding:6px 0}
  .pilares td::before{content:attr(data-r);display:block;font-size:15px;font-weight:600;color:var(--text-campo-sutil)}
}

.faixa-foto{margin:0;background:var(--bg-campo);color:var(--text-campo)}
.faixa-foto img{width:100%;height:clamp(300px,46vw,620px);object-fit:cover}
.faixa-foto figcaption{margin:0 auto;padding-block:14px 20px;color:var(--text-campo-sutil)}

.dizem-grade{display:grid;gap:48px 64px}
@media (min-width:1024px){.dizem-grade{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center}}
.citacao{margin-top:28px}
.citacao p{font-family:var(--fonte-nota);font-size:clamp(20px,.9rem + .7vw,23px);line-height:1.4;font-weight:600}
.citacao cite{display:block;margin-top:16px;font-style:normal;font-weight:600;font-size:17px}
.dizem-lado{display:grid;gap:32px;justify-items:start}
.dizem-lado .foto-presa{width:86%;justify-self:end}
.clientes-int{margin-top:clamp(56px,6vw,96px)}

/* ------------------------------------------------------------------ Educação corporativa */
.dobra-foto{position:relative;width:100%;max-width:680px;justify-self:end;padding-top:20px}
.selo-nota{position:absolute;left:-3%;top:-34px;display:flex;flex-direction:column;justify-content:center;width:clamp(150px,32%,210px);aspect-ratio:1;padding:16px;text-align:center;font-size:var(--tipo-body-lg);line-height:1.1;transform:rotate(var(--r))}
.selo-nota b{display:block;font-family:var(--fonte-texto);font-size:var(--tipo-title-lg);line-height:.9;letter-spacing:-.015em;font-weight:600}

.trilha{display:grid;gap:40px 64px}
@media (min-width:1024px){.trilha{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}}
.trilha-mapa{position:relative;container-type:inline-size;aspect-ratio:400/520;width:100%;max-width:440px}
.trilha-caminho{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.trilha-caminho path{fill:none;stroke:var(--text-titulo);stroke-width:3;stroke-linecap:round;stroke-dasharray:.014 .02;vector-effect:non-scaling-stroke}
.paradas li{position:absolute;left:var(--px);top:var(--py);transform:translate(-50%,-50%) rotate(var(--r))}
.parada{display:grid;place-items:center;width:34cqw;aspect-ratio:1;padding:8px;text-align:center;font-family:var(--fonte-nota);font-weight:600;font-size:clamp(15px,4.4cqw,19px);line-height:1.1;text-decoration:none;transition:transform var(--mov-t-cartao) var(--mov-mola)}
.parada[aria-selected="true"]{outline:3px dashed currentColor;outline-offset:-9px}
.parada:focus-visible{outline:3px solid var(--border-foco);outline-offset:3px}
.semente{position:absolute;z-index:2;left:0;top:0;width:6cqw;aspect-ratio:.62;background:var(--text-titulo);outline:2px solid var(--bg-superficie);border-radius:50% 50% 50% 50% / 62% 62% 38% 38%;pointer-events:none;transform:translate(var(--sx,0px),var(--sy,0px)) rotate(-14deg);transition:transform .9s var(--mov-mola)}
.semente.parada-ja{transition:none}
html:not(.js) .semente,.trilha:not(.ativa) .semente{display:none}
.modulo h3{font-size:var(--tipo-title-lg);line-height:1.05;letter-spacing:-.015em;font-weight:600}
.modulo-foco{margin-top:8px;font-size:var(--tipo-body-lg);font-weight:600}
.workshops{margin-top:28px;display:grid;gap:28px 40px}
@media (min-width:640px){.workshops{grid-template-columns:1fr 1fr}}
.workshops h4{font-size:var(--tipo-body-lg);line-height:1.3;font-weight:600}
.workshops p{margin-top:8px}
.ganhos{margin-top:14px;display:grid;gap:8px;font-weight:600}
.trilha:not(.ativa) .modulo+.modulo{margin-top:56px}
.trilha.ativa .modulo{display:none}
.trilha.ativa .modulo.atual{display:block}
.modulo:focus-visible{outline-offset:8px}
.caixa{margin-top:44px;max-width:38em;padding:22px 24px 26px;transform:rotate(var(--r))}
.caixa b{display:block;margin-bottom:6px;font-size:var(--tipo-body-lg)}

.orbia-grade{display:grid;gap:48px 64px}
@media (min-width:1024px){.orbia-grade{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}}
.cli-campo{margin-bottom:28px;background:var(--text-campo)}
.orbia-grade .figuras{margin-top:40px}
.recados{display:grid;gap:22px;justify-items:start}
.recados .cartao-solto:nth-child(2){justify-self:end}

.formatos{display:grid;gap:64px 48px}
@media (min-width:1024px){
  .formatos{grid-template-columns:repeat(12,minmax(0,1fr));align-items:start}
  .formato-palestras{grid-column:1 / 6}
  .formato-time{grid-column:6 / 13;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px;align-items:center}
  .formato-time .foto-presa{margin-bottom:0}
  .formato-deixa{grid-column:2 / 12}
}
.formato h3{font-size:var(--tipo-title);line-height:1.1;letter-spacing:-.02em;font-weight:600}
.formato p{margin-top:10px;max-width:34em}
.trio{display:flex;margin-bottom:28px}
.trio li{width:32%;max-width:156px;margin-right:-5%;transform:rotate(var(--rt,0deg))}
.trio li:nth-child(1){--rt:-4deg}
.trio li:nth-child(2){--rt:3deg;margin-top:14px}
.trio li:nth-child(3){--rt:-1.5deg}
.trio img{aspect-ratio:1;object-fit:cover;object-position:50% 22%;border:6px solid var(--bg-papel)}
.formato-time .foto-presa{margin-bottom:24px}
.formato-deixa{position:relative;padding:clamp(28px,4vw,56px);transform:rotate(var(--r))}
.formato-deixa h3{font-size:var(--tipo-title-lg);line-height:1.05}
.formato-deixa>p{max-width:32em}
.formato-deixa blockquote{margin-top:28px}
.formato-deixa blockquote p{margin:0;font-family:var(--fonte-nota);font-size:var(--tipo-body-lg);line-height:1.38;font-weight:600}
.formato-deixa cite{display:block;margin-top:8px;font-style:normal;font-size:15px;font-weight:600}
.formato-deixa .acoes-u{margin-top:24px}
@media (min-width:900px){.formato-deixa{display:grid;grid-template-columns:1fr 1fr;gap:0 48px}.formato-deixa>:not(blockquote){grid-column:1 / -1}}

/* ------------------------------------------------------------------ movimento das páginas */
@media (prefers-reduced-motion:no-preference){
  .polaroide,.recorte,.marcos li,.principios li,.escada li,.ficha,.foto-presa,.cartao-solto,.selo-nota,.lista-nota,.caixa{transition:transform var(--mov-t-cartao) var(--mov-mola)}
  :is(.polaroide,.recorte,.marcos li,.principios li,.escada li,.ficha,.foto-presa,.cartao-solto,.selo-nota):hover,
  html.js :is(.polaroide,.recorte,.marcos li,.principios li,.escada li,.ficha,.foto-presa,.cartao-solto,.selo-nota).visto:hover{transform:rotate(calc(var(--r,0deg) * -1.4)) translateY(-4px);transition-delay:0s}
  .cartao-solto:focus-visible{transform:rotate(calc(var(--r,0deg) * -1.4))}
  .voto:hover{transform:translateY(-4px) rotate(-1.5deg)}
  .voto:active{transform:scale(.94)}
  .voto.nega{animation:nega .42s var(--mov-saida)}
  @keyframes nega{20%{transform:translateX(-6px) rotate(-2deg)}50%{transform:translateX(5px) rotate(2deg)}80%{transform:translateX(-3px)}}
  .parada:hover{transform:translateY(-4px) rotate(-2deg)}
  .conta-num.pula{animation:pula .55s var(--mov-mola)}
  @keyframes pula{from{transform:scale(1.28) rotate(-3deg)}to{transform:none}}
  .pergunta[open] p{animation:abre .45s var(--mov-saida)}
  @keyframes abre{from{opacity:0;transform:translateY(-8px)}}
  .trilha.ativa .modulo.atual{animation:abre .5s var(--mov-saida)}
}
@media (prefers-reduced-motion:reduce){.semente{transition:none}}

/* ------------------------------------------------------------------ celular */
@media (max-width:767px){
  .declaracao{font-size:var(--tipo-body-lg);line-height:1.35}
  .foto-presa figcaption{margin-inline:6px}
  .dizem-lado .foto-presa{width:100%}
  .lista-nota{margin:20px 0 0 6%}
  .selo-nota{left:4%}
  .recortes{max-width:420px}
  .formato-deixa blockquote+blockquote{margin-top:20px}
}
