/* Blog Feed – Slider Inovar (scroll-snap com drag nativo + peek visível) */

.inv-blog{
  --peek: 36px;           /* quanto do próximo slide aparece no mobile */
  --gap: 24px;
  --rosa: #e3007b;
  --rosa-dark: #b40063;
  --text: #1b1b1b;
  --muted: #555;
  --radius: 16px;

  background: transparent !important;
  padding: 0 0 14px 0 !important;
  font-family: "Poppins", Sans-serif !important;
  color: var(--text);
}

/* trilha rolável com snap — DRAG nativo; reserva espaço do peek */
.inv-blog__track{
  display: flex !important;
  gap: var(--gap) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x mandatory !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: none !important;
  padding-right: var(--peek) !important;

  /* cursor de "pegar" no desktop */
  cursor: grab;
}
.inv-blog__track::-webkit-scrollbar{ display:none !important; }

/* estado durante o drag com mouse (desktop) */
.inv-blog__track.is-dragging{
  cursor: grabbing;
  scroll-snap-type: none !important; /* solta o snap enquanto arrasta */
}

/* cada slide é menor que 100% para sobrar o pedacinho do próximo */
.inv-blog__slide{
  flex: 0 0 calc(100% - var(--peek)) !important;
  min-width: calc(100% - var(--peek)) !important;
  scroll-snap-align: start !important;
}

/* imagem destacada — tamanho uniforme */
.inv-blog__thumb{ display:block !important; margin: 0 0 16px !important; }
.inv-blog__thumb img{
  width: 100% !important;
  aspect-ratio: 16/9 !important;
  object-fit: cover !important;
  border-radius: var(--radius) !important;
  display: block !important;
  pointer-events: auto !important;

}

/* pílula de categoria */
.inv-blog__pill{
  display: inline-block !important;
  background: var(--rosa-dark) !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 1.2rem !important;
  line-height: 1 !important;
  padding: 6px 12px !important;
  border-radius: 999px !important;
  margin-bottom: 10px !important;
}

/* título, resumo e CTA */
.inv-blog__title{
  margin: 8px 0 10px !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}
.inv-blog__title a{
  color: var(--text) !important;
  text-decoration: none !important;
}
.inv-blog__title a:hover{
  text-decoration: underline !important;
}

.inv-blog__excerpt{
  margin: 0 0 16px !important;
  font-size: 1rem !important;
  line-height: 1.6 !important;
  color: var(--muted) !important;
}

.inv-blog__cta{
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-weight: 700 !important;
  font-size: 1.2rem !important;
  color: var(--rosa-dark) !important;
  text-decoration: none !important;
}
.inv-blog__cta:hover{
  color: var(--rosa-dark) !important;
}
.inv-blog__cta-arrow{ font-weight: 900 !important; }

/* navegação */
.inv-blog__nav{
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 12px !important;
}
.inv-blog__prev,
.inv-blog__next{
  width: 48px !important;
  height: 48px !important;
  border-radius: 10px !important;
  background: #fff !important;
  border: 2px solid #000 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.8rem !important;
  color: #000 !important;
  box-shadow: none !important;
}
.inv-blog__prev[disabled],
.inv-blog__next[disabled]{
  opacity: .35 !important;
}
.inv-blog__fraction{
  margin-left: 6px !important;
  min-width: 48px !important;
  text-align: center !important;
  font-weight: 700 !important;
  color: #000 !important;
  font-size: 1.3rem !important;
}

/* responsivo
   - mobile (<768px): continua 1 por view com peek (sem alterações)
   - tablet (>=768): 2 por view + peek
   - desktop (>=1024): 3 por view + peek
*/
@media (min-width: 768px){
  .inv-blog{
    --peek: 72px; /* reusa o mesmo peek, mas agora dividindo entre as colunas */
  }
  .inv-blog__slide{
    flex-basis: calc((100% - var(--peek)) / 2) !important;
    min-width: calc((100% - var(--peek)) / 2) !important;
  }
}

@media (min-width: 1024px){
  .inv-blog__slide{
    flex-basis: calc((100% - var(--peek)) / 3) !important;
    min-width: calc((100% - var(--peek)) / 3) !important;
  }
  .inv-blog__title{
    font-size: 1.3rem !important;
  }
}