  /* ---------- Instagram ----------
     Ladrilho quadrado com a foto em cover; no hover a foto cresce 5% e um veu
     roxo com o glifo do Instagram cobre o ladrilho -- o mesmo sinal de "isso
     abre fora" do rodape. A entrada e a cascata de sempre: cada <li> tem o seu
     --d e sobe quando a faixa chega (.ig-on), so depois de .ig-pronto. */
  .ig-post{position:relative;display:block;overflow:hidden;border-radius:.75rem;aspect-ratio:1;background:#E9DFD5;
    box-shadow:0 14px 30px -18px rgba(30,5,38,.35)}
  .ig-post img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.16,1,.3,1)}
  .ig-post:hover img,.ig-post:focus-visible img{transform:scale(1.05)}
  .ig-veu{position:absolute;inset:0;display:grid;place-items:center;color:#F7F2EC;
    background:rgba(30,5,38,.5);opacity:0;transition:opacity .3s ease}
  .ig-post:hover .ig-veu,.ig-post:focus-visible .ig-veu{opacity:1}
  @media(prefers-reduced-motion:no-preference){
    .ig.ig-pronto .ig-grade>li{opacity:0;transform:translateY(18px);
      transition:opacity .9s ease var(--d,0ms),transform 1.1s cubic-bezier(.16,1,.3,1) var(--d,0ms)}
    .ig.ig-pronto.ig-on .ig-grade>li{opacity:1;transform:none}
    .ig:focus-within .ig-grade>li{opacity:1!important;transform:none!important;transition:none!important}
  }

#instagram{position:relative;isolation:isolate;scroll-margin-top:130px}
.ig-rio-transicao{position:absolute;inset:0 0 auto;height:clamp(64px,7vw,108px);z-index:2;pointer-events:none;background:linear-gradient(180deg,#f7f2ec 0%,rgba(247,242,236,.96) 14%,rgba(174,194,173,.84) 38%,rgba(35,80,59,.62) 68%,rgba(35,80,59,0) 100%)}
@media(prefers-reduced-motion:reduce){.ig-post img,.ig-veu{transition:none}.ig-post:hover img,.ig-post:focus-visible img{transform:none}}
