/* Pod Inovar – RESPONSIVO (scroll-snap + drag nativo) */
.inv-pod{
  --peek: 36px;               /* pedacinho do próximo card no mobile */
  --gap: 14px;
  --radius: 16px;
  --text: #171717;
  --muted:#6b6b6b;
  --rosa:#e3007b;
  --rosa-dark:#b40063;

  background: transparent !important;
  padding: 0 0 14px 0 !important;
  font-family: "Poppins", Sans-serif !important;
  color: var(--text);
}

.inv-pod__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-left: 12px !important;
  padding-right: var(--peek) !important;

  /* cursor de drag no desktop */
  cursor: grab;
}
.inv-pod__track::-webkit-scrollbar{ display:none !important; }

/* estado durante o drag com mouse */
.inv-pod__track.is-dragging{
  cursor: grabbing;
  scroll-snap-type: none !important; /* solta o snap enquanto arrasta */
}

/* Card */
.inv-pod__slide{
  flex: 0 0 calc(100% - var(--peek)) !important;
  min-width: calc(100% - var(--peek)) !important;
  scroll-snap-align: start !important;
  color: inherit !important;
  text-decoration: none !important;
}
.inv-pod__thumb{ display:block !important; margin-bottom: 12px !important; }
.inv-pod__thumb img{
  width: 100% !important;
  aspect-ratio: 16/9 !important;
  object-fit: cover !important;
  border-radius: var(--radius) !important;
  display:block !important;
  pointer-events:none !important; /* não atrapalha o drag */
}

.inv-pod__tag{
  display:inline-block !important;
  background: var(--rosa) !important;
  color:#fff !important;
  font-weight:600 !important;
  font-size:.92rem !important;
  line-height:1 !important;
  padding:8px 14px !important;
  border-radius:999px !important;
  margin-bottom: 8px !important;
}
.inv-pod__title{
  font-weight:800 !important;
  font-size:1.2rem !important;
  line-height:1.3 !important;
  margin:6px 0 8px !important;
}
.inv-pod__desc{
  color:var(--muted) !important;
  font-size: .95rem !important;
  line-height:1.55 !important;
  margin:0 0 12px !important;
}

.inv-pod__cta{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  color:var(--rosa) !important;
  font-weight:800 !important;
  text-decoration:none !important;
  font-size:1rem !important;
}
.inv-pod__cta:hover{ color: var(--rosa-dark) !important; }

/* Navegação / fração */
.inv-pod__nav{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  margin-top:12px !important;
  padding-left:12px !important;
}
.inv-pod__btn{
  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;
}
.inv-pod__btn[disabled]{ opacity:.35 !important; }
.inv-pod__fraction{
  font-weight:800 !important;
  font-size:1.2rem !important;
  min-width:48px !important;
  text-align:center !important;
}

/* =========================
   BREAKPOINTS (apenas acrescem)
   ========================= */

/* Mobile (<768px) permanece como antes: 1 card por vez com peek */

/* Tablet: 2 por view + peek visível */
@media (min-width: 768px){
  .inv-pod{
    --peek: 36px; /* reaproveita o mesmo peek, dividindo entre as colunas */
  }
  .inv-pod__slide{
    flex-basis: calc((100% - var(--peek)) / 2) !important;
    min-width: calc((100% - var(--peek)) / 2) !important;
  }
  .inv-pod__title{ font-size:1.3rem !important; }
}

/* Desktop: 3 por view + peek visível */
@media (min-width: 1024px){
  .inv-pod__slide{
    flex-basis: calc((100% - var(--peek)) / 3) !important;
    min-width: calc((100% - var(--peek)) / 3) !important;
  }
  .inv-pod__title{ font-size:1.4rem !important; }
}

@media (min-width: 1440px){
  .inv-pod__title{ font-size:1.5rem !important; }
}
