.slider {
  position: relative;
  overflow: hidden;
  border-radius: 1rem;
  margin-bottom: var(--space-xl);
}

.slider img {
  width: 100%;
  display: none;
}

.slider img.active {
  display: block;
}

.slider-controls {
  position: absolute;
  bottom: 1rem;
  right: 1rem;
  display: flex;
  gap: .5rem;
}

.slider-controls button {
  width: .75rem;
  height: .75rem;
  border-radius: 50%;
  border: none;
  background: #ddd;
  cursor: pointer;
}

.slider-controls button.active {
  background: var(--color-primary);
}