/* ========== CALL TO ACTION: KLAAR OM TE BOEKEN ========== */

/* Witte kaart in het midden */
/* Witte kaart in het midden → nu juist géén kaart meer */
.home-cta-box {
  max-width: 900px;
  margin: 0 auto;
  background-color: transparent;
  border: none;
  box-shadow: none;
}

.home-cta-title {
  font-size: clamp(1.5rem, 1.6vw + 0.9rem, 2.2rem);
  color: #004d73;
  margin-bottom: 0.75rem;
  font-weight: 700;
}

.home-cta-text {
  font-size: clamp(1rem, 0.7vw + 0.6rem, 1.1rem);
  max-width: 620px;
  margin: 0 auto 1.7rem;
  line-height: 1.6;
  color: #333;
}

/* Knoppenrij */
.home-cta-buttons {
  display: inline-flex;
  gap: 0.9rem;
  flex-wrap: wrap;
  justify-content: center;
}

/* Basis knopstijl */
.home-cta-btn {
  border-radius: 999px;
  padding: 0.55rem 1.7rem;
  font-size: 0.98rem;
  font-weight: 500;
  text-decoration: none;
  border: 2px solid #0077b6;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease,
    color 0.15s ease;
}

/* Primaire knop: reserveren (gevuld) */
.home-cta-btn.primary {
  background-color: #0077b6;
  color: #ffffff;
}

.home-cta-btn.primary:hover {
  background-color: #005a88;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.16);
  transform: translateY(-1px);
}

/* Secundaire knop: contact (outline) */
.home-cta-btn.secondary {
  background-color: #ffffff;
  color: #0077b6;
}

.home-cta-btn.secondary:hover {
  background-color: #e7f6ff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.12);
  transform: translateY(-1px);
}

/* Mobiel: knoppen onder elkaar */
@media (max-width: 576px) {
  .home-cta {
    padding: 3.5rem 0 4rem;
  }

  .home-cta-buttons {
    flex-direction: column;
    align-items: center;
    gap: 0.7rem;
  }

  .home-cta-btn {
    width: 100%;
    max-width: 260px;
    text-align: center;
  }
}
