/* v46: projectpagina rookwoning Soest */
.okp,.okp-teaser,.ok-werk{--g:#123c35;--gd:#0c2f27;--gold:#e3bf73;--goldi:#a77c25;--paper:#faf7f0;--muted:#566a63}
.okp{--g:#123c35;--gd:#0c2f27;--gold:#e3bf73;--goldi:#a77c25;--paper:#faf7f0;--muted:#566a63;color:var(--g);background:var(--paper)}
.okp *{box-sizing:border-box}
.okp-wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.okp-sec{padding:64px 0}
.okp-sec+.okp-sec{padding-top:0}
.okp-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--goldi);font-weight:700;margin:0 0 10px}
.okp-eyebrow:before{content:"";width:26px;height:2px;background:var(--gold)}
.okp h2{font-size:clamp(26px,3.6vw,40px);line-height:1.15;margin:0 0 14px;color:var(--g)}
.okp p{line-height:1.75;margin:0 0 14px}
.okp-lead{font-size:clamp(17px,1.6vw,19px);color:var(--muted);max-width:720px}

/* feiten */
.okp-feiten{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:-34px auto 0;position:relative;z-index:2}
.okp-feit{background:#fff;border-radius:18px;padding:20px 18px;box-shadow:0 1px 2px rgba(18,60,53,.05),0 14px 34px -18px rgba(18,60,53,.28)}
.okp-feit strong{display:block;font-size:clamp(26px,3vw,34px);line-height:1;color:var(--g)}
.okp-feit span{display:block;margin-top:8px;font-size:15px;color:var(--muted);line-height:1.4}
.okp-feit.goud{background:var(--g);color:#fff}.okp-feit.goud strong{color:var(--gold)}.okp-feit.goud span{color:#d8e4df}

/* verhaal */
.okp-verhaal{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.okp-verhaal figure{margin:0;border-radius:22px;overflow:hidden;box-shadow:0 28px 56px -24px rgba(18,60,53,.42)}
.okp-verhaal img{display:block;width:100%;height:auto}
.okp-quote{border-left:3px solid var(--gold);padding:4px 0 4px 18px;margin:22px 0 0;font-size:18px;font-style:italic;color:var(--g)}

/* voor/na */
.okp-paren{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:26px}
.okp-paar{background:#fff;border-radius:20px;padding:12px;margin:0;box-shadow:0 1px 2px rgba(18,60,53,.05),0 14px 34px -18px rgba(18,60,53,.28)}
.okp-paar-beelden{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.okp-paar-beelden a{position:relative;display:block;border-radius:12px;overflow:hidden;aspect-ratio:3/4;background:#e9e4d8}
.okp-paar-beelden img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.2,.75,.2,1)}
.okp-paar-beelden a:hover img{transform:scale(1.03)}
.okp-label{position:absolute;left:8px;top:8px;background:rgba(12,47,39,.82);color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 9px;border-radius:999px}
.okp-label.na{background:var(--gold);color:var(--gd)}
.okp-paar figcaption{padding:12px 6px 4px;font-size:15px;color:var(--muted);line-height:1.5}
.okp-paar figcaption strong{display:block;color:var(--g);font-size:17px}

/* tijdlijn */
.okp-dag{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:34px}
.okp-stap{display:grid;grid-template-columns:150px 1fr;gap:26px;position:relative}
.okp-tijd{font-weight:700;font-size:22px;color:var(--g);padding-top:2px}
.okp-tijd small{display:block;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--goldi);margin-top:4px}
.okp-stap h3{font-size:21px;margin:0 0 8px;color:var(--g)}
.okp-fotos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}
.okp-fotos a{display:block;border-radius:14px;overflow:hidden;aspect-ratio:3/4;background:#e9e4d8}
.okp-fotos img{width:100%;height:100%;object-fit:cover;display:block}

/* video */
.okp-videos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:24px;max-width:760px}
.okp-video{margin:0;background:var(--g);border-radius:20px;padding:10px;color:#d8e4df}
.okp-video video{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:12px;background:#000}
.okp-video figcaption{padding:10px 6px 4px;font-size:14px;line-height:1.5}
.okp-video figcaption strong{display:block;color:#fff;font-size:16px}

/* eindresultaat */
.okp-galerij{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}
.okp-galerij a{position:relative;display:block;border-radius:16px;overflow:hidden;aspect-ratio:3/4;background:#e9e4d8}
.okp-galerij img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.2,.75,.2,1)}
.okp-galerij a:hover img{transform:scale(1.03)}
.okp-galerij span{position:absolute;left:0;right:0;bottom:0;padding:24px 12px 10px;font-size:14px;color:#fff;background:linear-gradient(transparent,rgba(12,47,39,.8))}

/* cta */
.okp-cta{background:var(--g);color:#fff;border-radius:26px;padding:clamp(28px,5vw,52px);display:grid;grid-template-columns:1.3fr 1fr;gap:28px;align-items:center}
.okp-cta h2{color:#fff}.okp-cta p{color:#d8e4df}
.okp-knoppen{display:flex;flex-wrap:wrap;gap:12px}
.okp-knop{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border-radius:999px;font-weight:700;text-decoration:none;background:var(--gold);color:var(--gd)}
.okp-knop.rand{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.5)}
.okp-noot{font-size:14px;color:var(--muted);margin-top:14px}

/* teaser op andere pagina's */
.okp-teaser{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:0;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 1px 2px rgba(18,60,53,.05),0 14px 34px -18px rgba(18,60,53,.28);color:#123c35;text-decoration:none;max-width:1050px;margin:0 auto}
.okp-teaser-beelden{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#fff}
.okp-teaser-beelden div{position:relative;aspect-ratio:3/4;overflow:hidden}
.okp-teaser-beelden img{width:100%;height:100%;object-fit:cover;display:block}
.okp-teaser-tekst{padding:clamp(22px,3.5vw,40px);display:flex;flex-direction:column;justify-content:center}
.okp-teaser-tekst h2,.okp-teaser-tekst h3{font-weight:500!important;letter-spacing:normal!important;font-size:clamp(22px,2.6vw,30px);line-height:1.2;margin:0 0 10px;color:#123c35}
.okp-teaser-tekst .okp-eyebrow{color:var(--goldi);margin-bottom:12px}
.okp-teaser-tekst p{line-height:1.7;margin:0 0 14px;color:#566a63}
.okp-teaser-link{font-weight:700;color:#a77c25}
.okp-teaser:hover .okp-teaser-link{text-decoration:underline}
.okp-teaser-sec{padding:48px 20px}

@media (max-width:900px){
  .okp-feiten{grid-template-columns:repeat(2,minmax(0,1fr))}
  .okp-verhaal,.okp-cta{grid-template-columns:1fr;gap:28px}
  .okp-stap{grid-template-columns:1fr;gap:6px}
  .okp-fotos{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .okp-sec{padding:44px 0}
  .okp-paren,.okp-teaser{grid-template-columns:1fr}
  .okp-galerij{grid-template-columns:repeat(2,minmax(0,1fr))}
  .okp-videos{grid-template-columns:1fr 1fr;gap:12px}
  .okp-feit{padding:16px 14px}
  .okp-knop{width:100%}
}
@media (prefers-reduced-motion:reduce){.okp img{transition:none!important}}

/* v47: review */
.okp-review{margin:22px 0 0;background:#fff;border-radius:22px;padding:clamp(22px,4vw,38px);max-width:820px;box-shadow:0 1px 2px rgba(18,60,53,.05),0 14px 34px -18px rgba(18,60,53,.28);border-top:4px solid var(--gold)}
.okp-sterren{color:#e0a800;font-size:24px;letter-spacing:3px;line-height:1}
.okp-review blockquote{margin:14px 0 0;padding:0}
.okp-review .okp-review-kop{font-size:clamp(21px,2.4vw,26px);font-weight:600;color:var(--g);margin-bottom:8px}
.okp-review blockquote p{font-size:17px}
.okp-review figcaption{margin-top:14px;font-size:15px;color:var(--muted)}
.okp-review figcaption a{color:var(--goldi);font-weight:700}

/* v48: reviewblokken op dienstpagina's */
.okp-reviews-sec{--g:#123c35;--gold:#e3bf73;--goldi:#a77c25;--muted:#566a63;padding:56px 0;color:#123c35}
.okp-reviews-sec .okp-wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.okp-reviews-sec h2{font-size:clamp(26px,3.4vw,38px);line-height:1.15;margin:0 0 6px;color:#123c35}
.okp-rgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:18px;margin-top:22px}
.okp-rcard{margin:0;background:#fff;border-radius:20px;padding:22px 22px 18px;border-top:4px solid var(--gold);box-shadow:0 1px 2px rgba(18,60,53,.05),0 14px 34px -18px rgba(18,60,53,.28);display:flex;flex-direction:column}
.okp-rcard .okp-sterren{font-size:20px}
.okp-rcard blockquote{margin:12px 0 0;padding:0;flex:1}
.okp-rcard blockquote p{line-height:1.7;margin:0;font-size:16px}
.okp-rcard figcaption{margin-top:14px;font-size:14px;color:var(--muted)}
.okp-rcard figcaption strong{color:#123c35}
.okp-rcard figcaption a{color:var(--goldi);font-weight:700}
.okp-reviews-meer{margin-top:16px;font-size:15px}
.okp-reviews-meer a{color:var(--goldi);font-weight:700}