/**
 * Homepage teaser grid / swiper fixes.
 * InnerBlocks wraps teasers in .acf-innerblocks-container, which breaks the
 * desktop CSS grid on .swiper-wrapper unless we use display: contents.
 */

.block-homepage .acf-innerblocks-container {
  display: contents;
}

/* Mobile/tablet: Swiper controls layout (enabled below 992px in main.min.js). */
@media (max-width: 991.98px) {
  .block-homepage .swiper-wrapper {
    display: flex;
    grid-template-columns: unset;
    grid-gap: unset;
  }
}

/* Desktop: static 2-column grid, Swiper disabled. */
@media (min-width: 992px) {
  .block-homepage .swiper-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 24px;
  }

  .block-homepage .swiper-wrapper .block-teaser:nth-of-type(even) {
    transform: translateY(60px);
  }

  .block-homepage .swiper-pagination {
    display: none;
  }
}