/* theme-carousel — media (max-width: 1200px)
   Everything above this breakpoint uses desktop's own styles directly —
   there's no separate 1279px tablet tier anymore. */

.theme-carousel {
  --nav-inset: 65px;
}

/* Flush edge — hover slide motion is disabled at this breakpoint (below), so no rest-vs-hover room needed. */
.theme-carousel__arrow--prev {
  left: 0;
}

.theme-carousel__arrow--next {
  right: 0;
}

.theme-carousel__cards {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 300px;
}

/* 2-col version of theme-carousel.css's 1-2-card centering rule — this breakpoint's own width/height. */
.theme-carousel__cards:has(> .theme-carousel__card:nth-child(1):nth-last-child(-n+2)) > .theme-carousel__card {
  flex-basis: calc((100% - var(--sp6)) / 2);
  height: 300px;
}

/* Must stay nth-child(4n+1)/(4n+4) vs (4n+2)/(4n+3), not plain even/odd — on a 2-col grid, even/odd
   produces vertical stripes instead of the intended diagonal corner-cut pattern. */
.theme-carousel__card:nth-child(4n+1) .theme-carousel__card-link,
.theme-carousel__card:nth-child(4n+4) .theme-carousel__card-link {
  border-radius: 0 var(--radius-54) 0 var(--radius-54);
}

.theme-carousel__card:nth-child(4n+2) .theme-carousel__card-link,
.theme-carousel__card:nth-child(4n+3) .theme-carousel__card-link {
  border-radius: var(--radius-54) 0 var(--radius-54) 0;
}

/* Must cancel unconditionally (not just :hover/:focus-visible) — desktop's slide-out is a permanent rest
   position there, not hover-triggered, so it needs an explicit override at this breakpoint too. */
.theme-carousel__arrow--prev .theme-carousel__arrow-visual,
.theme-carousel__arrow--next .theme-carousel__arrow-visual {
  transform: none;
}

.theme-carousel__arrow-preview {
  display: none;
}
