/* merch-soft.css */
.merchandising-platform-section {
  margin-bottom: 3.5rem;
}

.merchandising-platform-section .section-title {
  margin-bottom: 1rem;
}

/* In order to display correct with wagtail RichTextField */
.banners-with-slider-section-title :is(h1, h2, h3, h4, h5, h6) {
  margin-bottom: 1rem;
}

.merchandising-platform-section .section-title span:not([class*="rt-color-"]) {
  color: var(--primary-orange);
}

/* In order to display correct with wagtail RichTextField */
.banners-with-slider-section-title span:not([class*="rt-color-"]) {
  color: var(--primary-orange);
}

.merchandising-platform-section .section-text {
  max-width: 790px;
  margin: 0 auto;
  margin-bottom: 3.75rem;
}

.merchandising-platform-section .splide__slide {
  display: flex;
  flex-direction: column;
}

.merchandising-platform-section .splide__slide p {
  color: var(--typography-black-1);
  font-size: 1rem;
  margin-bottom: 1.5rem;
}

.merchandising-platform-section .splide__slide a {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--primary-orange);
  transition: all 0.3s ease;
  height: 100%;
}

.merchandising-platform-section .splide__slide svg {
  transform: rotate(45deg);
  fill: var(--primary-orange);
  transition: all 0.3s ease;
}

.merchandising-platform-section .splide__slide a:hover svg {
  transform: rotate(0deg);
}

.merchandising-platform-section .splide__slide .read-more {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: auto;
}

.merchandising-platform-section .splide__slide {
  padding: 20px;
  border-radius: 25px;
  border: 1px solid var(--border-orange-1);
  background: var(--grayscale-color-1);
}

.merchandising-platform-section {
  background: transparent;
  border: none;
}

.merchandising-platform-section .splide__arrows.custom-arrows {
  left: 50%;
  transform: translate(-50%);
  bottom: -5rem;
}

.merchandising-platform-section .splide__slide h3 {
  font-size: clamp(1.3125rem, 1.2063rem + 0.4531vw, 1.75rem);
  font-weight: 500;
  color: var(--typography-black-1);
  margin-bottom: 0.5rem;
}

.merchandising-platform-section .splide__slide p {
  font-size: 1rem;
  color: var(--typography-black-2);
  margin-bottom: 1.5rem;
}

@media (max-width: 768px) {
  .merchandising-platform-section .section-text {
    margin-bottom: 1.25rem;
  }

  .merchandising-platform-section {
    margin-bottom: 2.375rem;
  }

  .merchandising-platform-section .splide__arrows.custom-arrows {
    bottom: -4.5rem;
  }

  .merchandising-platform-section .splide__slide img {
    margin-bottom: 1.25rem;
  }
}
