.slideshow {
  position: relative;
  max-width: 1000px;
  margin: 60px auto;
  overflow: hidden;
  border-radius: 20px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.2);
  background: #fff;
}

/* Radio buttons verbergen */
input[type=radio] {
  display: none;
}

.slides {
  position: relative;
  width: 100%;
}

.slide {
  display: none;   /* standaard verborgen */
  padding: 40px;
  text-align: center;
}

.slide h2 {
  color: #2c5f2d;
  margin-bottom: 20px;
}

.slide p {
  max-width: 700px;
  margin: 0 auto 20px;
}

.slide-img {
  width: 70%;
  border-radius: 15px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  margin-bottom: 20px;
}

/* Navigatie bolletjes */
.navigation {
  text-align: center;
  margin: 20px 0;
}

.bar {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin: 0 6px;
  background: #bbb;
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.3s;
}

.bar:hover {
  background: #2c5f2d;
}

/* Slider logica met radio buttons */
#slide1:checked ~ .slides .slide:nth-child(1) { display: block; }
#slide2:checked ~ .slides .slide:nth-child(2) { display: block; }
#slide3:checked ~ .slides .slide:nth-child(3) { display: block; }
#slide4:checked ~ .slides .slide:nth-child(4) { display: block; }

#slide1:checked ~ .navigation label[for=slide1],
#slide2:checked ~ .navigation label[for=slide2],
#slide3:checked ~ .navigation label[for=slide3],
#slide4:checked ~ .navigation label[for=slide4] {
  background: #2c5f2d;
}
