/*
 * Feed do Instagram — CSS do componente validado em producao pelo Estudio Criar.
 * Copiado VERBATIM de instagram-embed.html. Nao reescrever.
 * O titulo .igx-h2 nao e usado aqui: a secao usa o cabecalho padrao do tema EMPEL
 * (overline + .display) e passa data-titulo="" para o componente.
 */

[data-ig] { --ig-gap:12px; --ig-raio:10px; --ig-ink:#0b0b0b; --ig-skel:rgba(0,0,0,.06); font-family:inherit; }
  @media (prefers-color-scheme: dark) { [data-ig] { --ig-ink:#fff; --ig-skel:rgba(255,255,255,.08); } }
  [data-ig] .igx-h2 { font-size:clamp(22px,3.2vw,34px); font-weight:700; letter-spacing:.04em;
    text-transform:uppercase; text-align:center; margin:0 0 28px; color:var(--ig-ink); line-height:1.15; }
  /* UMA LINHA + SETAS (pedidos do cliente, 2026-09-05): a grade nao quebra mais
     em duas filas. O que nao cabe na largura rola de lado por dois botoes redondos
     nas bordas (ou arrastando no celular), SEM barra de rolagem visivel. As setas
     somem quando tudo cabe e a da ponta fica apagada. Nada e escondido do teclado
     nem do leitor de tela: e rolagem, nao display:none. */
  [data-ig] .igx-carrossel { position:relative; }
  [data-ig] .igx-grade { display:grid; gap:var(--ig-gap);
    grid-auto-flow:column; grid-auto-columns:minmax(var(--igx-min,220px), 1fr);
    align-items:start; overflow:auto hidden; overscroll-behavior-x:contain;
    scroll-snap-type:x proximity; padding:4px; scroll-padding-inline:4px;
    scrollbar-width:none; -ms-overflow-style:none; }
  [data-ig] .igx-grade::-webkit-scrollbar { display:none; }
  [data-ig] .igx-card { scroll-snap-align:start; }
  [data-ig] .igx-seta { position:absolute; top:50%; z-index:2; width:42px; height:42px;
    margin-top:-21px; border:0; border-radius:50%; padding:0; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    background:rgba(11,20,45,.78); color:#fff; box-shadow:0 2px 10px rgba(0,0,0,.28);
    transition:opacity .2s, background .2s, transform .2s; }
  [data-ig] .igx-seta--ant { left:12px; }
  [data-ig] .igx-seta--ant svg { transform:scaleX(-1); }
  [data-ig] .igx-seta--prox { right:12px; }
  [data-ig] .igx-seta:hover:not(:disabled) { background:rgba(11,20,45,.95); transform:scale(1.06); }
  [data-ig] .igx-seta:disabled { opacity:.3; cursor:default; }
  [data-ig] .igx-seta[hidden] { display:none; }
  [data-ig] .igx-seta:focus-visible { outline:2px solid var(--ig-ink); outline-offset:2px; }
  @media (max-width:600px) { [data-ig] .igx-seta { width:36px; height:36px; margin-top:-18px; }
    [data-ig] .igx-seta--ant { left:8px; } [data-ig] .igx-seta--prox { right:8px; } }
  [data-ig] .igx-card { position:relative; display:block; aspect-ratio:1/1; overflow:hidden;
    border-radius:var(--ig-raio); background:var(--ig-skel); text-decoration:none; color:#fff; }
  [data-ig] .igx-card img { width:100%; height:100%; object-fit:cover; display:block;
    transition:transform .45s cubic-bezier(.2,.7,.3,1); }
  [data-ig] .igx-card:hover img, [data-ig] .igx-card:focus-visible img { transform:scale(1.06); }
  [data-ig] .igx-tipo { position:absolute; top:10px; right:12px; display:flex; color:#fff;
    filter:drop-shadow(0 1px 3px rgba(0,0,0,.55)); pointer-events:none; }
  [data-ig] .igx-over { position:absolute; inset:auto 0 0 0; padding:32px 12px 12px;
    background:linear-gradient(to top, rgba(0,0,0,.55), transparent);
    opacity:0; transform:translateY(8px); transition:opacity .25s, transform .25s; }
  [data-ig] .igx-card:hover .igx-over, [data-ig] .igx-card:focus-visible .igx-over { opacity:1; transform:none; }
  [data-ig] .igx-titulo { margin:0 0 4px; font-size:13px; line-height:1.35; font-weight:600;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  [data-ig] .igx-meta { display:flex; gap:14px; font-size:12px; opacity:.92; font-variant-numeric:tabular-nums; }
  [data-ig] .igx-meta span { display:inline-flex; align-items:center; gap:4px; }
  [data-ig] .igx-cta { display:inline-block; margin-top:16px; font-size:14px; font-weight:600;
    color:var(--ig-ink); text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:2px; }
  [data-ig] .igx-cta:hover { opacity:.7; }
  [data-ig] .igx-skel { animation:igx-pulsa 1.4s ease-in-out infinite; }
  @keyframes igx-pulsa { 0%,100% { opacity:1; } 50% { opacity:.45; } }
  [data-ig] .igx-card:focus-visible { outline:2px solid var(--ig-ink); outline-offset:3px; }
  @media (prefers-reduced-motion: reduce) {
    [data-ig] .igx-card img, [data-ig] .igx-over { transition:none; }
    [data-ig] .igx-skel { animation:none; }
  }