/* ----- Layout shell ----- */
.minislider {
    border-radius: 14px;
    overflow: hidden;
    position: relative;
}
.minislider-block { padding: 24px 0; }
.minislider-block__container { margin: 0 auto; }
.minislider-block__intro { margin-bottom: 16px; }
.minislider-block__copy { max-width: 70ch; }

/* Split grid */
.minislider-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  align-items: center;
}
.minislider-split__media,
.minislider-split__text { min-width: 0; }

/* Stack on small screens */
@media (max-width: 860px) {
  .minislider-split { grid-template-columns: 1fr; }
  .minislider-split__media { order: 1; }
  .minislider-split__text { order: 2; }
}

/* ----- Slider styles ----- */
.minislider .minislider-slide {
  aspect-ratio: 1 / 1; /* fallback default */
  overflow: hidden;
  position: relative;
  background: #f6f6f6;
}

.minislider.ratio-1x1 .minislider-slide { aspect-ratio: 1 / 1; }
.minislider.ratio-16x9 .minislider-slide { aspect-ratio: 16 / 9; }
.minislider.ratio-4x3 .minislider-slide  { aspect-ratio: 4 / 3; }

.minislider .minislider-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 100%;
  gap: var(--gap);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  outline: none;
}
.minislider .minislider-track::-webkit-scrollbar { display: none; }

/* ----- Image fit handling (supports <picture> + <img>) ----- */
.minislider.fit-cover .minislider-slide picture,
.minislider.fit-contain .minislider-slide picture {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.minislider.fit-cover .minislider-slide picture img,
.minislider.fit-contain .minislider-slide picture img,
.minislider.fit-cover .minislider-slide > img,
.minislider.fit-contain .minislider-slide > img {
  width: 100%;
  height: 100%;
  object-position: center;
  display: block;
  backface-visibility: hidden;
}

/* Cover vs Contain */
.minislider.fit-cover .minislider-slide picture img,
.minislider.fit-cover .minislider-slide > img {
  object-fit: cover;
}
.minislider.fit-contain .minislider-slide picture img,
.minislider.fit-contain .minislider-slide > img {
  object-fit: contain;
  background: #fff;
}

/* ----- Controls ----- */
.minislider .minislider-btn {
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  z-index: 2;
  border: 0;
  width: 30px;
  height: 30px;
  cursor: pointer;
  user-select: none;
  padding: unset;
  background: rgba(0,0,0,0.5);
  border-radius: 6px;
  overflow: hidden;
}
.minislider .minislider-btn.prev { left: 10px; }
.minislider .minislider-btn.next { right: 10px; }

.minislider-btn::before,
.minislider-btn::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 11px;
  height: 2px;
  background-color: #ffffff;
  transition: transform .2s ease;
}
.minislider-btn.next::before,
.minislider-btn.prev::after { transform: rotate(-45deg); }
.minislider-btn.prev::before,
.minislider-btn.next::after { transform: rotate(45deg); }
.minislider-btn.next::before,
.minislider-btn.next::after { right: 8px; }
.minislider-btn.prev::before,
.minislider-btn.prev::after { left: 8px; }
.minislider-btn.next::before,
.minislider-btn.prev::before { top: 18px; }
.minislider-btn.next::after,
.minislider-btn.prev::after { top: 11px; }
.minislider-btn:hover {
  background: rgba(0,0,0,.75);
}

/* ----- Dots ----- */
.minislider .minislider-dots {
  position: absolute;
  left: 50%;
  translate: -50% 0;
  bottom: 10px;
  display: flex;
  gap: 6px;
  z-index: 2;
}
.minislider .minislider-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.7);
  cursor: pointer;
}
.minislider .minislider-dot.is-active { background: #fff; }

@media (prefers-reduced-motion: reduce) {
  .minislider .minislider-track { scroll-behavior: auto; }
}