/* ── Werra Maler Image Slider ── */
.wm-slider { position: relative; max-width: 100%; margin: 0 auto 2rem; }
.wm-slider-viewport { position: relative; overflow: hidden; border-radius: var(--theme-radius-lg, 12px); aspect-ratio: 16/9; background: var(--theme-muted, #f3f4f6); }
.wm-slider-track { display: flex; height: 100%; transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1); }
.wm-slide { flex: 0 0 100%; height: 100%; }
.wm-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Arrows */
.wm-slider-prev,
.wm-slider-next {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(0,0,0,0.45); color: #fff; border: none;
  width: 44px; height: 44px; border-radius: 50%;
  font-size: 1.2rem; cursor: pointer; z-index: 2;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.2s, opacity 0.2s;
  opacity: 0;
}
.wm-slider:hover .wm-slider-prev,
.wm-slider:hover .wm-slider-next { opacity: 1; }
.wm-slider-prev { left: 12px; }
.wm-slider-next { right: 12px; }
.wm-slider-prev:hover,
.wm-slider-next:hover { background: rgba(0,0,0,0.7); }

/* Dots */
.wm-slider-dots {
  display: flex; justify-content: center; gap: 8px;
  margin-top: 0.75rem; padding: 0.25rem 0;
}
.wm-dot {
  width: 10px; height: 10px; border-radius: 50%;
  border: 2px solid var(--theme-text-muted, #9ca3af);
  background: transparent; cursor: pointer;
  transition: all 0.2s; padding: 0;
}
.wm-dot.active {
  background: var(--theme-accent, #2563eb);
  border-color: var(--theme-accent, #2563eb);
  transform: scale(1.2);
}
.wm-dot:hover { border-color: var(--theme-accent, #2563eb); }

/* Mobile: always show arrows */
@media (max-width: 768px) {
  .wm-slider-prev, .wm-slider-next { opacity: 0.8; width: 36px; height: 36px; font-size: 1rem; }
}