/* ==========================================================================
   Grid - Cards
   ========================================================================== */

.grid-cards {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-6);
}

/* Mobile - horizontal scrolling cards */
@media (max-width: 480px) {
  .grid-cards {
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: var(--space-3);
    padding-inline: var(--space-6);
    height: 100%;
    align-items: center;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  /* Hide scrollbar for cleaner look */
  .grid-cards::-webkit-scrollbar {
    display: none;
  }

  .grid-cards {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  /* Disable scroll-snap during entrance animations */
  .grid-cards.is-animating {
    scroll-snap-type: none;
    overflow: hidden;  /* Prevent auto-scroll, allow off-screen content to animate in */
  }

  .grid-cards.is-animating .card-thing {
    scroll-snap-align: none;
  }
}