/**
 * JM specialists carousel — styles (v1)
 * All selectors are scoped to .jmspc-v1 to avoid collisions in large projects.
 */

.jmspc-v1 {
  --jmspc-slide-width: 280px;
  --jmspc-radius: 16px;
  --jmspc-content-padding: 18px;
}

.jmspc-v1,
.jmspc-v1 * {
  box-sizing: border-box;
}

/* Swiper base (scoped) */
.jmspc-v1 .jmspc-swiper {
  position: relative;
  overflow: visible;
  width: 100%;
}

.jmspc-v1 .jmspc-wrapper {
  display: flex;
}

.jmspc-v1 .jmspc-slide {
  width: var(--jmspc-slide-width);
  flex-shrink: 0;
  height: auto;
}

/* Card */
.jmspc-v1 .jmspc-card {
  position: relative;
  border-radius: var(--jmspc-radius);
  overflow: hidden;
  width: 100%;
  min-height: 362px;

  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

  display: flex;
  align-items: flex-end;
}

/* Bottom gradient overlay */
.jmspc-v1 .jmspc-card::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 40%,
    rgba(0, 0, 0, 0.65) 100%
  );
}

/* Special label (Founder, etc.) */
.jmspc-v1 .jmspc-special {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;

  color: #ffffff;
  font-size: 14px;
  line-height: 1;
  font-weight: 600;
}

/* Text content */
.jmspc-v1 .jmspc-content {
  position: relative;
  z-index: 2;

  width: 100%;
  padding: var(--jmspc-content-padding);
}

.jmspc-v1 .jmspc-name {
  margin: 0 0 4px;
  color: #ffffff;
  font-size: 20px;
  line-height: 1.1;
  font-weight: 700;
}

.jmspc-v1 .jmspc-position {
  margin: 0;
  color: #ffffff;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 400;
  opacity: 0.95;
}

/* Pagination (dots) — mobile only */
.jmspc-v1 .jmspc-pagination {
  position: static;
  margin-top: 12px;
  text-align: center;
}

.jmspc-v1 .jmspc-pagination .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  opacity: 0.25;
}

.jmspc-v1 .jmspc-pagination .swiper-pagination-bullet-active {
  opacity: 0.7;
}

@media (min-width: 768px) {
  .jmspc-v1 .jmspc-pagination {
    display: none;
  }
}

@media (max-width: 767px) {
  /* Small inner padding so the first slide doesn't stick to the viewport edge */
  .jmspc-v1 .jmspc-swiper {
    padding-left: 16px;
    padding-right: 16px;
  }
}
