:root{
  --ov-primary:#003356; /* Hawa blauw */
  --ov-ink:#0b1320;
  --ov-text:#424a57;
  --ov-bg:#f6f8fb;
  --ov-border:#e3e9f2;
  --ov-card:#ffffff;
  --ov-ok:#0f9d58;
}

.ov-container { max-width: 1400px; margin: 0 auto; padding: 0 16px; }
.ov-title { font-size: clamp(2rem, 3.5vw, 3rem); line-height: 1.1; margin: 0 0 10px; color: var(--ov-ink); }
.ov-title span { color: var(--ov-primary); }
.ov-sub { font-size: 1.1rem; color: var(--ov-text); max-width: 800px; }

.ov-hero { background: var(--ov-bg); border-bottom: 1px solid var(--ov-border); padding: 48px 0; }
.ov-usps { display: flex; gap: 12px; flex-wrap: wrap; margin: 16px 0 0; padding: 0; list-style: none; }
.ov-usps li { background: #fff; border:1px solid var(--ov-border); border-radius: 999px; padding: 8px 12px; font-size: .95rem; color: var(--ov-ink); }

.ov-form { padding: 32px 0; }
.ov-card {
  background: var(--ov-card); border:1px solid var(--ov-border); border-radius: 16px;
  padding: 24px; box-shadow: 0 6px 24px rgba(0,0,0,.04);
}
.ov-h2 { font-size: 1.5rem; margin: 0 0 8px; color: var(--ov-ink); }
.ov-help { color: var(--ov-text); margin: 0 0 16px; }
.ov-privacy { font-size: .95rem; color: var(--ov-ink); background:#f9fbff; border:1px dashed var(--ov-border); padding:12px; border-radius:12px; margin-top: 16px; }

.ov-cta-alt { display:flex; gap:10px; margin-top:12px; flex-wrap:wrap; }
.ov-btn {
  display:inline-block; padding:10px 14px; border-radius:10px; border:1px solid transparent;
  text-decoration:none; font-weight:700; transition: transform .05s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.ov-btn:hover { transform: translateY(-1px); }
.ov-btn:focus-visible { outline: 2px solid var(--ov-primary); outline-offset: 2px; }

.ov-btn-whatsapp { background:#e6f5ee; color:#0a3d26; border-color:#cfe9dc; }
.ov-btn-whatsapp:hover { background:#d8efe4; }

.ov-btn-mail { background:var(--ov-primary); color:#fff; }
.ov-btn-mail:hover { filter: brightness(0.95); }

.ov-steps { background: var(--ov-bg); border-top:1px solid var(--ov-border); padding: 32px 0; }
.ov-steps-list { display:grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap:14px; padding:0; list-style:none; }
.ov-steps-list li {
  background:#fff; border:1px solid var(--ov-border); border-radius:14px; padding:14px; display:flex; gap:10px; align-items:flex-start; color: var(--ov-ink);
}
.ov-steps-list li span {
  display:inline-grid; place-items:center; width:28px; height:28px; border-radius:999px; background:var(--ov-primary); color:#fff; font-weight:700;
}

.ov-faq { padding: 28px 0 56px; }
.ov-qa { background:#fff; border:1px solid var(--ov-border); border-radius:12px; padding:12px 14px; margin-bottom:10px; color: var(--ov-ink); }
.ov-qa summary { cursor:pointer; font-weight:700; }
.ov-qa[open] summary { color: var(--ov-primary); }
.ov-qa > div { margin-top:8px; color: var(--ov-text); }

/* Gravity Forms basic polish (alleen als GF standaard classes gebruikt) */
.gform_wrapper form { --ov-accent: var(--ov-primary); }
.gform_wrapper .gform_footer input[type=submit],
.gform_wrapper .gform_button {
  background: var(--ov-primary); color:#fff; border:none; border-radius:10px; padding:10px 16px; font-weight:800;
}
.gform_wrapper .gfield input[type="file"] { border:1px dashed #b9c6d6; border-radius:10px; padding:14px; background:#fbfdff; }

/* Responsive */
@media (max-width: 640px){
  .ov-card { padding: 16px; border-radius: 12px; }
  .ov-usps li { font-size: .9rem; }
}

/* Optioneel: korting-blok (als je dit toevoegt in je template) */
.ov-discount {
  margin-top: 18px; padding:16px; border:1px solid var(--ov-border); border-radius:12px;
  background:#eef4fb;
}
.ov-discount h3 { margin:0 0 6px; color: var(--ov-primary); }
.ov-discount small { color:#5d6a7c; display:block; margin-top:6px; }