/* ─────────────────────────────────────────────────────────────────
   block-slider — generic Owl carousel of images / cards.
   Pagination dots in --ds-cta. Arrow buttons scheme-aware.
   Section title and typography inherit from design-system.css.
   ───────────────────────────────────────────────────────────────── */

.block-slider {
  position: relative;
}

.block-slider .owl-carousel img.img-fluid {
  border-radius: var(--ds-radius);
  box-shadow: var(--ds-shadow-sm);
  width: 100%;
  height: auto;
  background: var(--scheme-card-bg);
  transition: box-shadow var(--ds-duration) var(--ds-ease-out);
}

.block-slider .owl-carousel a:hover img.img-fluid,
.block-slider .owl-carousel .px-2:hover img.img-fluid {
  box-shadow: var(--ds-shadow-md);
}

/* Pagination dots */
.block-slider .owl-theme .owl-dots {
  margin-top: var(--ds-space-4);
  text-align: center;
}

.block-slider .owl-theme .owl-dots .owl-dot span {
  width: 10px;
  height: 10px;
  margin: 0 4px;
  background: var(--scheme-fg-mute);
  border-radius: 50%;
  display: inline-block;
  transition: background var(--ds-duration-fast) var(--ds-ease-out),
              transform var(--ds-duration-fast) var(--ds-ease-out);
  opacity: .55;
}

.block-slider .owl-theme .owl-dots .owl-dot.active span,
.block-slider .owl-theme .owl-dots .owl-dot:hover span {
  background: var(--ds-cta);
  opacity: 1;
  transform: scale(1.15);
}

/* Arrow buttons */
.block-slider .owl-theme .owl-nav .icon {
  font-size: 32px;
  color: var(--scheme-fg);
  transition: color var(--ds-duration-fast) var(--ds-ease-out);
}

.block-slider .owl-theme .owl-nav button.owl-prev,
.block-slider .owl-theme .owl-nav button.owl-next {
  background: var(--scheme-card-bg);
  border: 1px solid var(--scheme-rule);
  border-radius: 50%;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--ds-shadow-sm);
  transition: background var(--ds-duration-fast) var(--ds-ease-out),
              box-shadow var(--ds-duration-fast) var(--ds-ease-out),
              transform var(--ds-duration-fast) var(--ds-ease-out);
}

.block-slider .owl-theme .owl-nav button.owl-prev:hover,
.block-slider .owl-theme .owl-nav button.owl-next:hover {
  background: var(--ds-cta);
  box-shadow: var(--ds-shadow-md);
  transform: translateY(-1px);
}

.block-slider .owl-theme .owl-nav button.owl-prev:hover .icon,
.block-slider .owl-theme .owl-nav button.owl-next:hover .icon {
  color: #fff;
}