* {
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:Inter,-apple-system,sans-serif
}
body { background:#fbfbfd; color:#0a0a0a }
header {
  padding:18px 5%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  position:sticky;
  top:0;
  background:rgba(251,251,253,0.92);
  backdrop-filter:blur(12px);
  border-bottom:1px solid #eee;
  z-index:20
}
.logo-main { font-size:26px; white-space:nowrap }
.logo-main .grens { font-weight:900; letter-spacing:-1px }
.logo-main .web { font-weight:200; letter-spacing:3px; margin-left:5px }
nav a { margin:0 12px; text-decoration:none; color:#666; font-size:14px; font-weight:500 }
.lang a { padding:7px 14px; border-radius:100px; border:1px solid #ddd; text-decoration:none; font-size:13px; color:#555; font-weight:600; margin-left:6px }
.lang a.active { background:#0a0a0a; color:white; border-color:#0a0a0a }
.hero { padding:90px 5% 60px; display:grid; grid-template-columns:1.2fr 0.8fr; gap:50px; align-items:center }
.hero h1 { font-size:62px; line-height:0.95; letter-spacing:-2.5px; font-weight:900 }
.hero h1 span { font-weight:200; color:#FF6B00 }
.hero p { margin:18px 0 26px; font-size:18px; color:#555; max-width:480px }
.btn { display:inline-block; padding:14px 24px; border-radius:100px; text-decoration:none; font-weight:600; font-size:14px }
.btn.black { background:#0a0a0a; color:white }
.btn.white { background:white; border:1px solid #ddd; color:#0a0a0a; margin-left:10px }
.how { background:white; margin:0 5%; padding:28px; border-radius:20px; border:1px solid #eee; display:grid; grid-template-columns:200px 1fr; gap:20px }
.how ol { list-style:none } /* FIX voor dubbele 1. 1 */
.how li { margin-bottom:8px; line-height:1.4 }
.pricing { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; padding:40px 5% }
.card { background:white; border-radius:22px; padding:28px; border:1px solid #eee; position:relative }
.card.popular { border:1.5px solid #0a0a0a; transform:translateY(-6px) }
.badge { position:absolute; top:-10px; left:24px; background:#0a0a0a; color:white; font-size:11px; padding:4px 10px; border-radius:100px; font-weight:600 }
.price { font-size:32px; font-weight:900; margin:12px 0 }
.card ul { list-style:none; margin:14px 0 }
.card li { margin-bottom:6px }
.contact { padding:60px 5%; display:grid; grid-template-columns:1fr 1fr; gap:60px; background:white; margin-top:20px }
input,select,textarea { width:100%; padding:13px 14px; border:1px solid #e5e7eb; border-radius:12px; margin-top:6px; background:#fbfbfd }
label { font-size:12px; font-weight:600; letter-spacing:0.5px; text-transform:uppercase; color:#888; margin-top:14px; display:block }

@media(max-width:900px){
  header { flex-wrap:wrap; gap:10px }
  nav { display:flex; gap:10px }
  nav a { margin:0 }
  .hero,.contact,.how,.pricing { grid-template-columns:1fr }
  .hero { padding-top:50px }
  .hero h1 { font-size:44px }
  .card.popular { transform:none }
  .btn.white { margin-left:0; margin-top:10px; width:100%; text-align:center }
  .btn.black { width:100%; text-align:center }
}