/* Sapiro · Conteúdo (listagem e post) */
.lista-cont{background:#fff}
.filtros{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px}
.filtro{padding:11px 20px;background:var(--nevoa);font-weight:600;font-size:16px;border-radius:0 12px 0 12px;transition:background-color var(--t-micro)}
.filtro:hover{background:#E2DFE1}
.filtro[aria-pressed="true"]{background:var(--laranja)}
.cards3--lista{row-gap:48px}
.cards3--lista .card-c:nth-child(3){display:flex}
.cards3--lista .card-c.is-oculto,.cards3--lista .card-c.is-fora{display:none !important}
.cc-res{margin:0;font-size:16px;line-height:1.5;color:var(--cinza)}
.lista-vazia{color:var(--cinza)}
.mais{margin:56px 0 0;text-align:center}
.mais[hidden]{display:none}
@media(max-width:1023px){.cards3--lista{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.cards3--lista{grid-template-columns:1fr}}

/* post */
.post-topo{padding:clamp(40px,5vw,72px) 0 0;background:#fff}
.post-topo-in{max-width:calc(820px + var(--margem)*2)}
.post-topo h1{margin-top:10px;max-width:24ch}
.post-img{margin-top:40px;max-width:calc(1000px + var(--margem)*2)}
.post-img img{width:100%;height:auto;aspect-ratio:16/8;object-fit:cover;filter:grayscale(1) contrast(1.05);border-top-left-radius:var(--r-g)}
.post-corpo{max-width:calc(760px + var(--margem)*2);padding-block:clamp(48px,6vw,80px)}
.post-corpo p,.post-corpo li{font-size:19px;line-height:1.75;max-width:none}
.post-corpo h2{margin:2em 0 .6em}
.post-corpo h3{margin:1.6em 0 .5em}
.post-corpo blockquote{margin:2em 0;padding-left:28px;font-size:24px;line-height:1.4;font-weight:600;border-left:0;border-top-left-radius:var(--r-m);background:var(--nevoa);padding:28px}
.post-corpo ul,.post-corpo ol{padding-left:1.2em;list-style:revert;margin:0 0 1em}
.post-voltar{margin-top:3em !important}

/* compartilhar */
.compartilhar{margin:24px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.post-corpo .compartilhar{margin:48px 0 0}
.comp-t{margin:0;font-weight:600}
.compartilhar ul,.post-corpo .compartilhar ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.comp-bt{display:inline-block;padding:10px 18px;background:var(--nevoa);font-weight:600;font-size:16px;line-height:1.2;color:var(--grafite);border-radius:0 12px 0 12px;transition:background-color var(--t-micro)}
.comp-bt:hover,.comp-bt:focus-visible{background:var(--laranja)}
.comp-ok{margin:0;font-size:15px;color:var(--cinza);min-width:10ch}

.mais{max-width:none;text-align:center}

/* ---------- banner em mosaico ---------- */
.topo-cont{padding:clamp(24px,3vw,40px) 0 clamp(40px,5vw,72px);background:#fff}
.mosaico{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:clamp(104px,10.6vw,148px);gap:10px}
.mz{position:relative;overflow:hidden;background:var(--nevoa);display:block;color:var(--grafite)}
.mz-a{grid-column:1;grid-row:1;border-top-left-radius:var(--r-m)}
.mz-b{grid-column:2;grid-row:1/span 2}
.mz-c{grid-column:3/span 2;grid-row:1}
.mz-d{grid-column:5/span 2;grid-row:1;border-top-right-radius:var(--r-m)}
.mz-e{grid-column:1;grid-row:2}
.mz-f{grid-column:3;grid-row:2}
.mz-g{grid-column:4;grid-row:2}
.mz-h{grid-column:5/span 2;grid-row:2}
.mz-i{grid-column:1/span 2;grid-row:3;border-bottom-left-radius:var(--r-m)}
.mz-j{grid-column:3;grid-row:3}
.mz-k{grid-column:4;grid-row:3}
.mz-l{grid-column:5;grid-row:3}
.mz-m{grid-column:6;grid-row:3;border-bottom-right-radius:var(--r-m)}
.mz--img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.04);transition:transform 700ms var(--ease-sai)}
.mz-veu{position:absolute;inset:0;background:var(--dg-laranja);mix-blend-mode:multiply;opacity:0;transition:opacity 400ms var(--ease-sai)}
.mz--img::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(46,45,46,.82) 0%,rgba(46,45,46,0) 62%);opacity:0;transition:opacity 400ms var(--ease-sai)}
.mz--img:hover img{transform:scale(1.05)}
.mz--img:hover .mz-veu{opacity:.55}
.mz--img:hover::after{opacity:1}
.mz-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;display:grid;gap:4px;padding:16px 18px;color:#fff;font-size:15px;line-height:1.35}
.mz-cap b{font-size:18px;line-height:1.2;font-weight:700}
.mz-cap span{font-weight:300}
.mz--img .mz-cap{opacity:0;transform:translateY(12px);transition:opacity 350ms var(--ease-sai),transform 350ms var(--ease-sai)}
.mz--img:hover .mz-cap{opacity:1;transform:none}
.mz--cat{padding:0}
.mz--cat .mz-cap{top:0;align-content:space-between;padding:18px 20px;color:inherit}
.mz--cat .mz-cap b{font-size:clamp(17px,1.6vw,22px)}
.mz--cat .mz-cap span{opacity:0;transform:translateY(8px);transition:opacity 350ms var(--ease-sai),transform 350ms var(--ease-sai);align-self:end}
.mz--cat:hover .mz-cap span,.mz--cat:focus-visible .mz-cap span{opacity:1;transform:none}
.mz--cat .mz-cap{display:flex;flex-direction:column;justify-content:space-between}
.mz-seta{position:absolute;right:16px;top:14px;font-weight:700;transition:transform var(--t-micro) var(--ease-sai)}
.mz--cat:hover .mz-seta,.mz--cat:focus-visible .mz-seta{transform:translate(3px,-3px)}
.mz--laranja{background:var(--dg-laranja)}
.mz--nevoa{background:var(--nevoa)}
.mz--grafite{background:var(--cinza);color:#fff}
.mz--cat{transition:transform 350ms var(--ease-sai)}
.mz--cat:hover,.mz--cat:focus-visible{transform:translateY(-3px)}
.topo-cont-txt{margin-top:clamp(28px,3vw,44px);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,5vw,72px);align-items:end}
.topo-cont-txt h1{max-width:18ch}
.topo-cont-txt .topo-int-p{margin:0}
@media(max-width:900px){
  .mosaico{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:132px}
  .mz-a,.mz-b,.mz-c,.mz-d,.mz-e,.mz-f,.mz-g,.mz-h,.mz-i,.mz-j,.mz-k,.mz-l,.mz-m{grid-column:auto;grid-row:auto;border-radius:0}
  .mz-a,.mz-d,.mz-g,.mz-m,.mz-l,.mz-h{display:none}
  .mz-c,.mz-h,.mz-k{grid-column:1/-1}
  .mz--cat .mz-cap span{opacity:1;transform:none}
  .mz--img .mz-cap{opacity:1;transform:none}
  .mz--img::after{opacity:1}
  .topo-cont-txt{grid-template-columns:1fr}
}

/* mosaico mais curto no celular */
@media(max-width:900px){
  .topo-cont{padding-top:16px;padding-bottom:36px}
  .mosaico{grid-auto-rows:88px;gap:8px}
  .mz-b,.mz-d,.mz-e,.mz-i,.mz-j,.mz-l,.mz-m{display:none}
  .mz-c,.mz-h,.mz-k{grid-column:auto}
  .mz-cap{padding:12px 14px}
  .mz--cat .mz-cap b{font-size:16px}
  .mz--cat .mz-cap span{display:none}
}

/* banner em foto no celular, no mesmo estilo das outras páginas */
.topo-cont-foto{display:none}
@media(max-width:767px){
  .mosaico{display:none}
  .topo-cont-foto{display:block;position:relative;margin-bottom:44px}
  .topo-cont-foto img{position:relative;z-index:1;display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;filter:grayscale(1) contrast(1.05);border-top-left-radius:var(--r-g)}
  .topo-cont-foto .topo-s{position:absolute;right:2%;bottom:-16%;left:auto;width:36%;height:auto;overflow:visible;pointer-events:none;z-index:2}
  .topo-cont-txt{margin-top:0}
}
