.all-courses-carousel-section {
  width: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.all-courses-carousel-section__header {
  width: 100%;
}
.all-courses-carousel-section .swiper-container {
  overflow: hidden;
  padding-bottom: 16px;
  padding-top: 8px;
}
.all-courses-carousel-section .swiper-slide {
  height: auto;
  box-sizing: border-box;
}

/* Prevent full-width flash before Swiper initializes */
.all-courses-carousel:not(.swiper-initialized) .swiper-wrapper {
  display: flex !important;
  gap: 16px;
  transform: none !important;
}
.all-courses-carousel:not(.swiper-initialized) .swiper-slide {
  flex-shrink: 0;
  width: calc((100% - 48px) / 4) !important;
  max-width: calc((100% - 48px) / 4);
  margin: 0 !important;
}
.all-courses-carousel:not(.swiper-initialized) .swiper-slide:nth-child(n+5) {
  display: none;
}

@media (max-width: 1199px) {
  .all-courses-carousel:not(.swiper-initialized) .swiper-slide {
    width: calc((100% - 32px) / 3) !important;
    max-width: calc((100% - 32px) / 3);
  }
  .all-courses-carousel:not(.swiper-initialized) .swiper-slide:nth-child(n+4) {
    display: none;
  }
}

@media (max-width: 990px) {
  .all-courses-carousel:not(.swiper-initialized) .swiper-slide {
    width: calc((100% - 16px) / 2) !important;
    max-width: calc((100% - 16px) / 2);
  }
  .all-courses-carousel:not(.swiper-initialized) .swiper-slide:nth-child(n+3) {
    display: none;
  }
}

@media (max-width: 575px) {
  .all-courses-carousel:not(.swiper-initialized) .swiper-slide {
    width: 85% !important;
    max-width: 85%;
  }
  .all-courses-carousel:not(.swiper-initialized) .swiper-slide:nth-child(n+2) {
    display: none;
  }
}

.all-courses-carousel-section .course-grid-card-1 {
  height: 100%;
  margin: 4px;
}
.all-courses-carousel-section .course-grid-card-1__inner {
  box-shadow: 0 6px 18px rgba(16, 24, 40, 0.1), 0 2px 6px rgba(16, 24, 40, 0.06);
}
.all-courses-carousel-section .course-grid-card-1:hover .course-grid-card-1__inner {
  box-shadow: 0 12px 28px rgba(16, 24, 40, 0.14), 0 4px 10px rgba(16, 24, 40, 0.08);
}