/* Multi-page additions on top of site.css: sub-page heroes, service pages, blog, prose, contact. */
[hidden]{display:none!important}
img{max-width:100%}
nav.main a[aria-current=page]{opacity:1;color:var(--yellow)}
.drawer a[aria-current=page]{color:var(--yellow)}
a.lang{text-decoration:none}
#offerte,#calculator,[id]{scroll-margin-top:calc(var(--hdr,112px) + 12px)}
.narrow{max-width:820px}
.title-md{font-size:clamp(26px,3.4vw,40px);font-weight:900;text-transform:uppercase}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.link-arrow{font:800 13px/1 var(--font-display);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:3px solid var(--yellow);padding-bottom:4px}
.dark{background:var(--ink-2);color:var(--paper)}
.dark .lead{color:#cfcabf}
.dark .kicker{color:var(--yellow)}
.plaster{background:var(--plaster)}

/* home hero (single column, photo behind) */
section.hero .wrap{grid-template-columns:minmax(0,760px);padding-block:88px 96px}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
@media (max-width:900px){section.hero .wrap{padding-block:48px 56px}.hero-cta{justify-content:center}}

/* sub-page hero */
.page-hero{position:relative;background:var(--ink);color:var(--paper);padding-block:72px 64px;overflow:hidden}
.page-hero .wrap{position:relative;z-index:1}
.page-hero h1{font-size:clamp(38px,6vw,72px);font-weight:900;text-transform:uppercase;margin-top:14px;max-width:16ch}
.page-hero .lead{color:#d8d4cc;max-width:58ch}
.page-hero.has-photo{padding-block:96px 80px}
.page-hero .ph-bg{position:absolute;inset:0;background:center/cover no-repeat}
.page-hero .ph-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,18,18,.94) 0%,rgba(18,18,18,.8) 45%,rgba(18,18,18,.45) 100%)}
@media (max-width:900px){.page-hero{padding-block:48px 44px}.page-hero.has-photo{padding-block:64px 52px}.page-hero .ph-bg::after{background:rgba(18,18,18,.8)}}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font:700 13px/1.4 var(--font-body);color:#a7a196}
.crumbs a{color:#e9e5dc;text-decoration:none}
.crumbs a:hover{color:var(--yellow)}
.hero-facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.hero-facts span{border:1px solid #3a3731;border-radius:999px;padding:8px 14px;font:700 13px/1 var(--font-body);color:#e9e5dc;background:rgba(255,255,255,.05)}

/* split: text + image */
.split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:center}
.split>*{min-width:0}
.split.rev>:first-child{order:2}
.split img{width:100%;height:auto;border-radius:16px;aspect-ratio:4/3;object-fit:cover;background:var(--ink-3)}
.split h2{font-size:clamp(28px,3.6vw,44px);font-weight:900;text-transform:uppercase}
.split p{margin-top:16px;color:#3b3833;font-size:17px;max-width:58ch}
.dark .split p{color:#cfcabf}
@media (max-width:900px){.split{grid-template-columns:1fr;gap:28px}.split.rev>:first-child{order:0}}

/* check list */
.checks{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px}
.checks li{display:flex;gap:12px;align-items:flex-start;font-size:16.5px}
.checks li::before{content:"";flex:none;width:22px;height:22px;margin-top:2px;border-radius:50%;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23f6c945' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.dark .checks li::before{background-color:var(--ink-3)}
.checks.two{grid-template-columns:1fr 1fr;column-gap:28px}
@media (max-width:700px){.checks.two{grid-template-columns:1fr}}

/* numbered steps on light background */
.nsteps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px;counter-reset:n}
.nsteps li{list-style:none;background:var(--paper);border-radius:14px;padding:22px;border-top:5px solid var(--yellow);min-width:0}
.nsteps li::before{counter-increment:n;content:counter(n,decimal-leading-zero);display:block;font:900 30px/1 var(--font-display);color:var(--yellow-d);margin-bottom:12px}
.nsteps h3{font-size:18px;text-transform:uppercase;font-weight:800}
.nsteps p{color:#47433c;font-size:15px;margin-top:8px}
.nsteps{padding:0}
@media (max-width:980px){.nsteps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.nsteps{grid-template-columns:1fr}}

/* price band */
.price-band{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center;background:var(--ink);color:var(--paper);border-radius:18px;padding:34px}
.price-band h2{font-size:clamp(26px,3.2vw,38px);font-weight:900;text-transform:uppercase}
.price-band p{color:#cfcabf;margin-top:12px}
.price-band .pb-num{font:900 clamp(40px,5vw,60px)/1 var(--font-display);color:var(--yellow)}
.price-band .pb-num small{display:block;font:700 14px/1.4 var(--font-body);color:#cfcabf;margin-top:8px}
@media (max-width:800px){.price-band{grid-template-columns:1fr;padding:24px}}

/* service overview rows */
.svc-rows{display:grid;gap:22px;margin-top:40px}
.svc-row{display:grid;grid-template-columns:340px 1fr auto;gap:28px;align-items:center;background:var(--paper);border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 1px 0 var(--line);transition:transform .2s,box-shadow .2s}
.svc-row:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.08)}
.svc-row img{width:100%;height:100%;min-height:200px;object-fit:cover;background:var(--ink-3)}
.svc-row h2{font-size:26px;font-weight:900;text-transform:uppercase}
.svc-row p{color:#47433c;margin-top:8px;max-width:56ch}
.svc-row .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.svc-row .tags span{background:var(--plaster);border-radius:999px;padding:6px 12px;font:700 12px/1 var(--font-body)}
.svc-row .go{margin-right:28px;width:52px;height:52px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;font:900 22px/1 var(--font-display)}
@media (max-width:860px){.svc-row{grid-template-columns:1fr;gap:0}.svc-row>div{padding:20px 22px}.svc-row .go{display:none}.svc-row img{aspect-ratio:16/9;min-height:0}}

/* cards as links */
a.card{text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s}
a.card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.1)}
.card img.art{height:auto;object-fit:cover;background:#2a2723}
.card .more{font:800 13px/1 var(--font-display);letter-spacing:.12em;text-transform:uppercase;border-bottom:3px solid var(--yellow);justify-self:start;padding-bottom:4px;margin-top:4px}
.cards.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){.cards.four{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.cards.four{grid-template-columns:1fr}}

/* quote section */
.aanvraag{background:var(--ink-2);color:var(--paper);padding-block:80px}
.aanvraag .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:start}
.aanvraag .lead{color:#cfcabf}
.aanvraag .kicker{color:var(--yellow)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.aanvraag .chips span{border:1px solid #3a3731;border-radius:999px;padding:8px 14px;font:700 13px/1 var(--font-body);color:#e9e5dc;background:rgba(255,255,255,.04)}
.aanv-side{display:grid;gap:14px;margin-top:28px;color:#cfcabf;font-size:15px}
.aanv-side b{color:var(--paper)}
@media (max-width:900px){.aanvraag{padding-block:48px}.aanvraag .wrap{grid-template-columns:1fr;gap:24px}}

/* blog */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:36px}
.post-card{display:grid;grid-template-rows:auto 1fr;background:var(--paper);border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 1px 0 var(--line);transition:transform .2s,box-shadow .2s;min-width:0}
.post-card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.08)}
.post-card img{width:100%;aspect-ratio:16/10;object-fit:cover;background:var(--ink-3);display:block;height:auto}
.pc-body{padding:20px 22px 24px;display:grid;gap:10px;align-content:start}
.pc-meta{font:800 11px/1.3 var(--font-display);letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.post-card h3{font-size:21px;font-weight:900;line-height:1.12}
.post-card p{color:#47433c;font-size:15px}
.pc-more{font:800 13px/1 var(--font-display);letter-spacing:.12em;text-transform:uppercase;border-bottom:3px solid var(--yellow);justify-self:start;padding-bottom:4px;margin-top:4px}
.blog-grid.big .post-card:first-child{grid-column:1/-1;grid-template-columns:1.2fr 1fr;grid-template-rows:none}
.blog-grid.big .post-card:first-child img{aspect-ratio:auto;height:100%;min-height:300px}
.blog-grid.big .post-card:first-child .pc-body{padding:32px;align-content:center}
.blog-grid.big .post-card:first-child h3{font-size:clamp(24px,3vw,34px)}
@media (max-width:980px){.blog-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.blog-grid{grid-template-columns:1fr}.blog-grid.big .post-card:first-child{grid-template-columns:1fr}.blog-grid.big .post-card:first-child img{min-height:0;aspect-ratio:16/10}.blog-grid.big .post-card:first-child .pc-body{padding:20px 22px 24px}}
.related{background:var(--plaster);padding-block:72px}
.related-head{display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap}
.post-hero{padding-block:64px 120px}
.post-hero h1{max-width:none;font-size:clamp(32px,5vw,58px);line-height:1.05}
.post-meta{margin-top:18px;color:#a7a196;font-weight:700}
.post-cover{margin:-84px auto 0;position:relative;z-index:2;padding:0}
.post-cover img{width:100%;border-radius:16px;aspect-ratio:16/9;object-fit:cover;background:var(--ink-3);box-shadow:0 24px 50px rgba(0,0,0,.25);display:block;height:auto}
@media (max-width:860px){.post-cover{padding-inline:20px}.post-hero{padding-block:44px 100px}}
.post-cta-wrap{padding-block:24px 80px}
.post-cta{background:var(--yellow);border-radius:18px;padding:32px}
.post-cta h2{font-size:clamp(24px,3vw,34px);font-weight:900;text-transform:uppercase}
.post-cta p{margin-top:10px;font-weight:700;max-width:56ch}
.post-cta .btn-ghost{border-color:var(--ink)}

/* prose (articles, privacy) */
.prose{padding-block:48px 16px;font-size:18px;line-height:1.7;color:#2b2925}
.prose>*+*{margin-top:1.1em}
.prose h2{font-size:clamp(24px,2.8vw,32px);font-weight:900;text-transform:uppercase;margin-top:1.8em;color:var(--ink);line-height:1.1}
.prose h3{font-size:21px;font-weight:800;margin-top:1.5em;color:var(--ink);line-height:1.2}
.prose ul,.prose ol{padding-left:1.3em;display:grid;gap:.45em}
.prose li::marker{color:var(--yellow-d);font-weight:900}
.prose a{color:var(--ink);text-decoration-color:var(--yellow);text-decoration-thickness:3px;text-underline-offset:3px;font-weight:700}
.prose strong{color:var(--ink)}
.prose .intro{font-size:21px;line-height:1.55;color:var(--ink);font-weight:400}
.prose .tip{background:#fff7dc;border-left:5px solid var(--yellow);border-radius:0 12px 12px 0;padding:18px 20px;font-size:16.5px}
.prose .tip b:first-child{display:block;font:800 13px/1 var(--font-display);letter-spacing:.16em;text-transform:uppercase;margin-bottom:8px}
.prose table{width:100%;border-collapse:collapse;font-size:16px;display:block;overflow-x:auto}
.prose th,.prose td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{background:var(--ink);color:var(--paper);font:800 13px/1.2 var(--font-display);letter-spacing:.08em;text-transform:uppercase}
.prose .src{font-size:14px;color:var(--stone)}
@media (max-width:640px){.prose{font-size:17px}.prose .intro{font-size:19px}}

/* contact */
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:36px}
.info{background:var(--paper);border-radius:16px;padding:26px;border-top:6px solid var(--yellow);display:grid;gap:10px;align-content:start;min-width:0}
.info h2{font-size:20px;font-weight:900;text-transform:uppercase}
.info p{color:#47433c}
.info .big{font:900 22px/1.2 var(--font-display);color:var(--ink);text-decoration:none;word-break:break-word}
@media (max-width:900px){.info-grid{grid-template-columns:1fr}}

/* stats / values */
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}
.value{border-top:4px solid var(--yellow);padding-top:18px}
.value h3{font-size:20px;text-transform:uppercase;font-weight:800}
.value p{margin-top:8px;color:#47433c}
.dark .value p{color:#bdb8ad}
@media (max-width:820px){.values{grid-template-columns:1fr}}

/* mini faq on service pages */
.mini-faq{max-width:820px;margin:32px auto 0}
.mini-faq .faq-list{border-top-color:var(--ink)}

/* 404 */
.nf{min-height:50vh;display:grid;place-items:center;text-align:center}
.nf b{display:block;font:900 clamp(90px,16vw,180px)/1 var(--font-display);color:var(--yellow)}

/* home: dark calculator card in the services grid */
a.card.card-cta{background:var(--ink);color:var(--paper);grid-template-rows:1fr}
.card-cta .body{align-content:center;padding:28px}
.card-cta h3{color:var(--paper)}
.card-cta p{color:#cfcabf}
.card-cta .kicker{color:var(--yellow)}

/* quote form headings + send buttons */
.quote .q-h{font:800 20px/1.2 var(--font-display);margin-bottom:14px}
.quote .q-h .req{color:#c0392b}
.aanvraag h1.title-xl{margin-top:12px}
.send-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
@media (max-width:420px){.send-row{grid-template-columns:1fr}}
