:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#24211f;background:#faf9f6;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;line-height:1.55}button,input,textarea,select{font:inherit}a{color:inherit}.container{width:min(1100px,calc(100% - 40px));margin-inline:auto}.top{background:#fffdfb;border-bottom:1px solid #f0eae4;position:sticky;top:0;z-index:20}.top-inner{height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{text-decoration:none;display:flex;align-items:center;gap:10px;font-size:24px;letter-spacing:-.9px}.brand strong span,.brand-orange{color:#0B6E4F}.brand-mark{display:grid;place-items:center;background:#0B6E4F;color:white;width:39px;height:39px;border-radius:13px;font-size:25px;font-weight:850}.brand-mark span{color:#ffd8c5}.brand small{font-size:10px;color:#bf4c23;background:#e1f3e9;border-radius:20px;padding:4px 7px;letter-spacing:1px;font-weight:800}.top nav{display:flex;gap:29px;align-items:center}.top nav a{text-decoration:none;color:#5f5954;font-size:14px;font-weight:650}.top nav a:hover,.footer-inner a:hover{color:#0B6E4F}.hero{display:grid;grid-template-columns:1.03fr .97fr;align-items:center;gap:48px;padding-block:76px 86px}.eyebrow,.overline{color:#0B6E4F;text-transform:uppercase;letter-spacing:1.75px;font-weight:800;font-size:11px}.eyebrow{display:inline-flex;align-items:center;gap:8px;background:#e0f3e9;padding:8px 12px;border-radius:99px}.alive{display:inline-block;width:7px;height:7px;border-radius:99px;background:#23A775;box-shadow:0 0 0 4px #c9e9d9}.hero h1{font-size:clamp(39px,4.45vw,62px);line-height:1.09;letter-spacing:-2.5px;margin:22px 0;font-weight:820}.hero h1 em{font-style:normal;color:#0B6E4F}.lead{font-size:17px;color:#655c55;line-height:1.8;max-width:590px}.actions{display:flex;flex-wrap:wrap;gap:12px;margin:27px 0 28px}.button{text-decoration:none;border:0;cursor:pointer;display:inline-flex;gap:13px;justify-content:center;align-items:center;min-height:49px;padding:0 20px;border-radius:12px;font-size:14px;font-weight:750;transition:transform .15s,box-shadow .15s}.button:hover{transform:translateY(-1px)}.button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #f6a36a;outline-offset:3px}.primary{background:#0B6E4F;color:#fff;box-shadow:0 7px 19px #0b6e4f2b}.primary:hover{background:#08543d}.secondary{border:1px solid #ded6cd;background:white;color:#3d352d}.stats{display:flex;gap:26px;flex-wrap:wrap;margin-top:27px;color:#77716b;font-size:12px}.stats b{font-size:18px;color:#2c2520;display:block}.preview{position:relative;min-height:560px;display:grid;place-items:center}.aura{position:absolute;width:425px;height:425px;border-radius:50%;background:radial-gradient(circle,#d9f1e6 0,#e5f5ed 50%,transparent 72%)}.phone{position:relative;z-index:1;background:#fff;width:295px;height:545px;border-radius:35px;border:7px solid #292b30;box-shadow:0 32px 64px #53432c3d;overflow:hidden;transform:rotate(3deg)}.phone-status{padding:11px 18px 9px;display:flex;justify-content:space-between;font-size:10px;font-weight:800}.phone-content{padding:7px 14px}.phone h2{font-size:21px;margin:5px 0 0;letter-spacing:-.5px}.phone-content>p{margin:0 0 12px;color:#888;font-size:10px}.search-mock{background:#f7f6f4;color:#999;border-radius:10px;padding:10px;font-size:10px}.chips{display:flex;gap:5px;margin:12px 0 15px}.chips span{padding:6px 7px;border:1px solid #eee3d9;font-size:9px;border-radius:30px}.chips span:first-child{background:#fff0e5;color:#096b4d;border-color:#a3dcc1}.phone h3{font-size:11px;margin:0 0 9px}.offer{display:flex;gap:9px;align-items:center;border:1px solid #eee9e3;border-radius:11px;padding:8px;margin-bottom:8px}.offer-image{width:57px;height:57px;flex:none;background:#dff3e9;color:#167e5b;border-radius:8px;display:grid;place-items:center;font-size:27px}.offer-image.pale{background:#e8f4ec;color:#0B6E4F}.offer-image.green{background:#e5f6e7;color:#20884a}.offer strong,.offer small,.offer b{display:block}.offer strong{font-size:11px}.offer small{font-size:9px;color:#888;margin:2px 0}.offer b{font-size:11px;color:#0B6E4F}.phone-tabs{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-around;align-items:center;border-top:1px solid #ece9e5;background:white;height:48px;font-size:9px;color:#888}.phone-tabs b{color:#0B6E4F}.preview-note{z-index:2;position:absolute;bottom:-12px;color:#8e8982;font-size:11px}.features-bg{background:white;padding:72px 0 80px}.section-title{font-size:clamp(29px,3vw,40px);line-height:1.18;letter-spacing:-1.1px;margin:10px 0 24px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-top:29px}.feature{border:1px solid #eee6df;border-radius:19px;padding:28px 24px;background:#fffdfa}.feature-icon{display:grid;place-items:center;background:#dff3e9;color:#d15a21;width:45px;height:45px;border-radius:12px;font-size:23px}.feature h3{font-size:18px;margin:19px 0 5px}.feature p,.download-grid p,.form-panel>p{color:#69625d;line-height:1.73;font-size:14px}.download-bg{background:#eaf6ef;padding:77px 0}.download-grid{display:grid;grid-template-columns:1fr 340px;gap:90px;align-items:center}.big-download{margin:19px 0 8px}.subnote{font-size:12px!important;color:#83736a!important;max-width:580px}.steps{display:grid;gap:13px;margin-top:24px}.steps>div{display:flex;align-items:center;gap:13px;font-size:13px;color:#5c5049}.steps b{display:grid;place-items:center;background:#fff;color:#0B6E4F;width:29px;height:29px;flex:none;border-radius:50%}.qr-card{background:white;border:1px solid #c8e7d6;border-radius:23px;padding:27px 23px;text-align:center;box-shadow:0 12px 39px #0b6e4f12}.qr{display:grid;place-items:center;border:1px solid #f0ede8;border-radius:15px;width:210px;height:210px;margin:auto}.qr img{image-rendering:pixelated}.qr-card h3{margin:18px 0 5px}.qr-card p{font-size:13px;margin:4px}.qr-card small{color:#0B6E4F;font-weight:700}.participation{padding-block:80px 95px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.form-panel{background:white;border:1px solid #ebe6e1;border-radius:20px;padding:29px 30px}.form-panel .section-title{font-size:30px;margin-top:4px}.form-panel form{display:grid;gap:9px;margin-top:23px}.form-panel label:not(.check){font-size:12px;font-weight:750;color:#4d4640}.form-panel input:not([type=checkbox]),.form-panel select,.form-panel textarea{width:100%;background:#fbfaf8;border:1px solid #ddd6cf;border-radius:10px;padding:12px 13px;outline:none;color:#25211d;min-height:43px}.form-panel textarea{resize:vertical;min-height:100px}.form-panel input:focus,.form-panel textarea:focus,.form-panel select:focus{border-color:#0B6E4F}.form-panel .check{display:flex;align-items:start;gap:11px;font-size:12px;color:#5e5650;line-height:1.65;margin:6px 0}.check input{accent-color:#0B6E4F;margin-top:5px}.check a{color:#0B6E4F}.form-panel button{justify-self:start;margin-top:7px}.form-panel small{color:#96877f}.honeypot{position:absolute!important;left:-10000px!important;opacity:0!important;height:1px!important;width:1px!important;pointer-events:none!important}.result{font-size:13px;margin:0;min-height:18px}.result.ok{color:#13763e}.result.err{color:#b6361a}.disclaimer{background:#f5f2ee;padding:24px 0;color:#6a625b;font-size:12px}.disclaimer b{color:#3c342e}footer{background:#28231f;color:#ebe2da;padding:32px 0}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:12px}.footer-inner nav{display:flex;gap:23px;flex-wrap:wrap}.footer-inner a{text-decoration:none;color:#dbcfc5}.privacy{max-width:800px;margin:60px auto 90px}.privacy h1{font-size:40px}.privacy h2{font-size:22px;margin-top:31px}.privacy p,.privacy li{line-height:1.8;color:#625950}@media(max-width:900px){.hero{gap:16px}.phone{transform:rotate(1deg)}.download-grid{gap:30px}}@media(max-width:700px){.container{width:min(100% - 30px,600px)}.top-inner{height:65px}.brand{font-size:19px}.brand small{display:none}.top nav{gap:14px}.top nav a{font-size:12px}.hero{grid-template-columns:1fr;padding-block:45px 54px}.hero h1{font-size:42px;letter-spacing:-1.9px}.lead{font-size:15px}.preview{min-height:440px}.phone{transform:scale(.76);transform-origin:center center;margin-block:-58px}.aura{width:340px;height:340px}.feature-grid,.download-grid,.form-grid{grid-template-columns:1fr}.features-bg,.download-bg,.participation{padding-block:50px}.qr-card{max-width:360px;margin:auto}.feature{padding:23px}.form-panel{padding:22px 19px}.footer-inner{flex-direction:column;align-items:flex-start}.stats{gap:24px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
/* Koopjespiep groen: eigen herkenbare tinten, niet Prijspiep oranje. */


/* Koopjespiep: echte appfoto, vast formaat en leesbaar binnen telefoonrand. */
.preview .genuine-app-shot {
  width: 285px;
  height: 570px;
  max-width: 100%;
  aspect-ratio: 1 / 2;
  overflow: hidden;
  border: 7px solid #292b30;
  border-radius: 34px;
  background: #fff;
}
.preview .genuine-app-shot img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: fill;
}
.preview .preview-note {
  bottom: -23px;
  white-space: nowrap;
  font-size: 11px;
}
@media (max-width: 700px) {
  .preview .genuine-app-shot {
    width: 285px;
    height: 570px;
    transform: scale(.78);
    transform-origin: center;
  }
  .preview .preview-note {
    bottom: -9px;
    white-space: normal;
    text-align: center;
  }
}


/* Real Koopjespiep application screenshots (Koopjes / Kaart) */
.hero .kp-preview { min-height: 700px; }
.kp-screen-showcase { width: 100%; display: flex; flex-direction: column; gap: 17px;
  align-items: center; justify-content: center; position: relative; z-index: 2; }
.kp-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0;
  margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.kp-screen-switch { display: flex; gap: 5px; background: #e5f0e9; padding: 5px;
  border: 1px solid #d7e8dd; border-radius: 999px; }
.kp-screen-switch label { min-width: 98px; text-align: center; padding: 8px 13px;
  border-radius: 999px; cursor: pointer; color: #49655a; font-size: 13px; font-weight: 750; }
#kp-screen-koopjes:checked ~ .kp-screen-switch label[for="kp-screen-koopjes"],
#kp-screen-kaart:checked ~ .kp-screen-switch label[for="kp-screen-kaart"] {
  background: #0b6e4f; color: white; box-shadow: 0 3px 8px #0b6e4f28;
}
#kp-screen-koopjes:focus-visible ~ .kp-screen-switch label[for="kp-screen-koopjes"],
#kp-screen-kaart:focus-visible ~ .kp-screen-switch label[for="kp-screen-kaart"] {
  outline: 3px solid #f6a36a; outline-offset: 2px;
}
.hero .kp-phone { position: relative; width: 282px; height: 612px; max-width: none;
  border: 7px solid #282b2c; border-radius: 33px; overflow: hidden;
  box-shadow: 0 24px 57px #273e322e; background: white; transform: rotate(2deg); margin: 0;
}
.hero .kp-phone .kp-shot { position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: fill; display: none; }
#kp-screen-koopjes:checked ~ .kp-phone .kp-shot-koopjes,
#kp-screen-kaart:checked ~ .kp-phone .kp-shot-kaart { display: block; }
.kp-shot-caption { font-size: 11px; color: #65746b; margin: 0; text-align: center; }
@media (max-width: 700px) {
  .hero .kp-preview { min-height: 650px; }
  .hero .kp-phone { transform: none; width: min(280px, 78vw); height: auto;
    aspect-ratio: 282 / 612; }
  .kp-screen-showcase { gap: 14px; }
}
