/* Afwerking van de bestaande v6-compositie, uitsluitend in de lokale proef. */
:root {
  --inkt: #FAF9F6; --toon: #EEF1EF; --vlak: #FFFFFF; --vlak-2: #D9E0DC;
  --voet: #203237; --lijn: #D5DDD9;
  --papier: #203237; --papier-hover: #10282E; --papier-actief: #365159;
  --steen-licht: #48575A; --steen: #5B696B; --koper: #93512F;
}
.a-merk { color: #B8C5C0; }
.nav__lijst a, .menu-knop { font-family: var(--sans); font-weight: 500; letter-spacing: normal; text-transform: none; }
/* Fotografische hoofdkeuzes behouden hun bestaande donkere, tekstgebonden fade. */
.kaart:not(.kaart--aanbod) {
  --inkt: #203237; --toon: #203237;
  --papier: #FAF9F6; --steen-licht: #DEE6E2; --steen: #BCCBC5;
}
.kaart:focus-visible { outline-color: #93512F; }
/* De aanbodkaart krijgt een licht tekstvlak; beeld en tekst blijven op hun bestaande plek. */
.kaart--aanbod { background: var(--vlak); }
.kaart--aanbod .foto-verloop { --foto-eind: var(--vlak); }
.onderbalk {
  --inkt: #203237; --papier: #FAF9F6; --papier-hover: #FFFFFF; --papier-actief: #DEE6E2;
  --steen-licht: #DEE6E2; --steen: #BCCBC5; --vlak-2: #52666A; --koper: #E1A477;
}

/* Eén afgeronde knoppenfamilie voor de lichte website. */
:root { --radius-control: 10px; }
:root .knop,
:root .menu-knop__vak,
:root .planning .productnav__lijst a { border-radius: var(--radius-control); }
@media (hover: hover) {
  :root .knop--sec:hover:not(:active),
  :root .menu-knop:hover:not(:active) .menu-knop__vak { background-color: var(--toon); }
}
:root .knop--sec:active,
:root .menu-knop:active .menu-knop__vak { background-color: var(--vlak-2); color: var(--papier); border-color: var(--papier); }

/* Light local proposal: existing sections, real photography and product images. */
:root { --kop-h:clamp(72px,64px + 1.67vw,88px); --ruim:clamp(56px,6vw,88px); --sectie:clamp(48px,5vw,72px); }
.wrap { max-width:1296px; }
.h1,.t-h1 { font-size:clamp(36px,4vw,52px); line-height:1.08; letter-spacing:-.03em; }
.h2 { font-size:clamp(28px,3vw,36px); line-height:1.2; font-weight:600; }
.h3 { font-size:24px; line-height:1.25; font-weight:600; }
.regel { line-height:1.55; }
.opening { padding-top:40px; }
.a-open { min-height:0; padding-block:32px 40px; }
.a-open .g { align-items:center; gap:32px var(--goot); }
.a-open__copy,.a-open__media { grid-column:1 / -1; min-width:0; }
.a-open .a-h1-home { font-size:clamp(40px,4.6vw,64px); line-height:1.04; max-width:19ch; letter-spacing:-.035em; }
.a-open__zij { margin:24px 0 0; max-width:55ch; }
.a-open__media { display:grid; gap:16px; }
.a-open__media a { display:block; overflow:hidden; border-radius:16px; height:180px; background:var(--toon); }
.a-open__media img { display:block; width:100%; height:100%; object-fit:cover; }
.a-open__media .a-open__software img { object-fit:contain; padding:12px; }
.kaarten { padding-top:24px; }
.kaarten .kaart { border-radius:16px; }
.kaarten .kaart::before { aspect-ratio:4 / 3; }
.home-product { background:transparent; }
.home-product__beeld,.product__beeld { padding:16px; border-radius:20px; background:var(--toon); }
.home-product__beeld img,.product__beeld img { border-radius:8px; }
.a-bedrijf .a-h1 { font-size:clamp(28px,3vw,36px); line-height:1.2; }
.kaart--aanbod { border:1px solid var(--lijn); border-radius:16px; overflow:hidden; }
.kaart--aanbod .kaart__tekst { padding:24px; }
.kaart--aanbod .kaart__naam { font-size:24px; font-weight:600; }
.hw__beeld,.pcb-overzicht__beeld img { border-radius:16px; }
.planning .balk--rp { display:grid; grid-template-columns:minmax(0,1fr); min-height:0; padding-block:32px 48px; gap:32px; }
.planning-hero__copy,.planning-hero__media { min-width:0; }
.planning .balk--rp .rl-h1 { font-size:clamp(36px,3.7vw,52px); line-height:1.08; letter-spacing:-.03em; }
.planning .balk--rp .balk__tekst .t24 { font-size:18px; line-height:1.55; margin-top:20px; }
.planning .balk--rp .balk__actie { display:flex; flex-wrap:wrap; gap:8px 20px; align-items:center; margin-top:24px; }
.planning .balk__actie > .link { margin:0; order:1; min-height:44px; }
.planning .balk__actie > .demo-regel { flex-basis:100%; margin:0; order:2; }
.planning-hero__media,.rollen .rl-rij__beeld { padding:16px; border-radius:20px; background:var(--toon); }
.planning-hero__media img { display:block; max-width:100%; height:auto; }
.planning-hero__media .w-fig { margin:0; }
.planning-hero__media .w-fig picture { display:block; aspect-ratio:auto; background:transparent; }
.planning-hero__media .w-fig img { width:100%; height:auto; margin:0; object-fit:contain; clip-path:none; aspect-ratio:auto; }
.planning-hero__media .w-fig figcaption { margin-top:16px; }
.planning .rl-scherm { border:0; border-radius:8px; background:white; box-shadow:0 2px 4px rgb(32 50 55 / .04),0 14px 36px rgb(32 50 55 / .08); }
.rollen .rl-taken { background:transparent; padding-block:32px; }
.rollen .rl-rij + .rl-rij { margin-top:32px; padding-top:32px; border-top:1px solid var(--lijn); }
.planning .planning-slot__tekst { padding:24px; border-radius:20px; background:var(--toon); }
.planning-overzicht .planning-planbord .w-paneel { display:block; }
.planning-overzicht .planning-planbord .planning-beeldtekst { max-width:60ch; }
.con-blok { margin-top:40px; }
.con-adres a { font-size:clamp(30px,4.5vw,64px); line-height:1.15; }
.onderbalk { padding-block:40px; }
.onderbalk__kop { font-size:20px; font-weight:600; }
.onderbalk__regel { max-width:25ch; font-size:clamp(24px,2.5vw,32px); line-height:1.25; }
@media(min-width:600px) and (max-width:899px) {
 .a-open__media { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(min-width:768px) { .kaarten__lijst { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(min-width:900px) {
 .a-open { padding-block:56px 64px; }
 .a-open .g > .a-open__copy { grid-column:1 / 7; }
 .a-open .g > .a-open__media { grid-column:8 / 13; }
 .a-open__media a { height:220px; }
 .home-product__beeld,.product__beeld { padding:24px; }
 .planning .balk--rp { grid-template-columns:minmax(0,5fr) minmax(0,6fr); padding-block:48px 64px; gap:clamp(32px,4vw,64px); align-items:center; }
 .planning .balk--rp > .planning-hero__copy,.planning .balk--rp > .planning-hero__media { grid-column:auto; }
 .planning .balk--rp .balk__tekst .t24 { font-size:20px; }
 .planning-hero__media,.rollen .rl-rij__beeld { padding:24px; }
 .rollen .rl-taken { padding-block:56px; }
 .rollen .rl-rij + .rl-rij { margin-top:64px; padding-top:64px; }
 .planning .planning-slot__tekst { padding:32px; }
 .kaart--aanbod .kaart__tekst { padding:32px; }
 .onderbalk { padding-block:64px; }
 .onderbalk__kols { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .onderbalk__kol,.onderbalk__kol:last-child { grid-column:auto; }
}
@media(min-width:900px) { .kaarten__lijst--twee { grid-template-columns:repeat(2,minmax(0,1fr)); } }

.planning-hero__media .planning-beeldtekst { margin-bottom:20px; }
.planning-hero__media .planning-beeldtekst .h2 { font-size:24px; }
.planning-hero__media .planning-beeldtekst .regel { margin-top:8px; font-size:16px; }
.kaart--tekstkaart .kaart__tekst { justify-content:center; }
@media(max-width:359px) { .con-adres a { font-size:27px; } }
.onderbalk :is(.onderbalk__kop a,.onderbalk__juridisch a) { min-width:0; max-width:100%; overflow-wrap:anywhere; }
.onderschrift,.demo-regel,.rl-bijschrift,.onderbalk,.onderbalk :is(.onderbalk__lijst a,.onderbalk__gegevens li,.onderbalk__mail,.onderbalk__juridisch a) { line-height:1.5; } .onderbalk .wm__woord { line-height:1.33; }