/* Lokale ontwerpversie. De bestaande basis en consent-stijlen blijven intact. */
:root { --ontwerp-rand: #d4dfdc; --ontwerp-zacht: #f4f7f5; --ontwerp-mint: #e3f0eb; }
.ontwerp .kopieer-adres[hidden], .ontwerp .consent-open[hidden] { display: none !important; }
html { scroll-padding-top: 2rem; }
.ontwerp .omslag { max-width: 78rem; padding-inline: 2rem; }
.ontwerp main section { padding-block: 6rem; }
.ontwerp main h1, .ontwerp main h2, .ontwerp main h3 { letter-spacing: -.045em; text-wrap: balance; }
.ontwerp main h2 { font-size: clamp(2rem, 3.8vw, 3.25rem); line-height: 1.13; margin-bottom: 1.5rem; }
.ontwerp main h3 { font-size: 1.65rem; }
.ontwerp .overtitel { font-size: .75rem; font-weight: 750; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin: 0 0 1.4rem; }
.ontwerp .lijn-icoon { width: 1.7rem; height: 1.7rem; flex-shrink: 0; }
.ontwerp .site-kop { padding: 1.5rem 0; border-bottom: 1px solid var(--ontwerp-rand); background: #fff; }
.ontwerp .kop-grid { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.ontwerp .merk { font-size: 1.25rem; font-weight: 750; letter-spacing: -.04em; display: inline-flex; align-items: center; gap: .7rem; white-space: nowrap; text-decoration: none; }
.ontwerp .merk svg { width: 2.6rem; height: 2.6rem; flex-shrink: 0; }
.ontwerp .site-kop nav { margin: 0; }
.ontwerp .site-kop nav ul { display: flex; gap: 1.75rem; padding: 0; margin: 0; list-style: none; }
.ontwerp .site-kop nav a { display: block; padding-block: .55rem; font-size: .875rem; font-weight: 600; text-decoration: none; color: var(--inkt); }
.ontwerp .site-kop nav a:hover, .ontwerp .site-kop nav a[aria-current] { color: var(--accent); text-decoration: underline; text-underline-offset: .4em; }
.ontwerp .kop-cta { display: inline-flex; align-items: center; gap: 1.1rem; border: 1px solid var(--accent); color: var(--accent); border-radius: .6rem; padding: .75rem 1rem; font-size: .85rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.ontwerp main .knop, .ontwerp main .kopieer-adres { background: var(--accent); color: white; border: 1px solid var(--accent); border-radius: .6rem; padding: 1rem 1.35rem; min-height: 3.5rem; display: inline-flex; justify-content: center; align-items: center; gap: 1.25rem; font: inherit; font-size: .95rem; font-weight: 650; text-decoration: none; margin: 0; line-height: 1.4; cursor: pointer; }
.ontwerp main .knop:hover, .ontwerp main .kopieer-adres:hover, .ontwerp .kop-cta:hover { background: #074740; border-color: #074740; color: white; }
.ontwerp main .knop span[aria-hidden], .ontwerp .kop-cta span { font-size: 1.25rem; line-height: 1; }
.ontwerp :is(main a, main button, .site-kop a, .site-voet a, .site-voet button) { transition: background-color .16s ease, color .16s ease, border-color .16s ease; }
.ontwerp main .ontwerp-hero { padding-block: 6rem 5.5rem; background: #fff; }
.hero-grid { display: grid; grid-template-columns: 1.24fr 1fr; gap: 4rem; align-items: center; }
.hero-tekst { min-width: 0; }
.ontwerp-hero .overtitel { display: flex; align-items: center; gap: .6rem; font-size: .7rem; letter-spacing: .1em; }
.merk-punt { display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; background: var(--accent); flex-shrink: 0; }
.ontwerp .ontwerp-hero h1 { font-size: clamp(3rem, 4.55vw, 4.4rem); line-height: 1.04; font-weight: 750; letter-spacing: -.055em; margin: 0 0 1.9rem; hyphens: none; }
.ontwerp-hero h1 em { font-style: normal; color: var(--accent); }
.ontwerp .hero-lead { font-size: 1.075rem; line-height: 1.75; max-width: 32rem; margin: 0 0 2rem; color: var(--gedempt); }
.hero-lead strong { color: var(--inkt); font-weight: 650; }
.hero-knoppen { display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; }
.tekst-cta { font-size: .875rem; font-weight: 650; text-decoration: none; display: inline-flex; gap: .75rem; align-items: center; padding: .7rem 0; }
.tekst-cta:hover { text-decoration: underline; }
.ontwerp .hero-voetnoot { margin: 1.1rem 0 0; color: var(--gedempt); font-size: .8rem; }
.route-bord { background: var(--ontwerp-zacht); border: 1px solid var(--ontwerp-rand); border-radius: 1.1rem; box-shadow: 0 20px 45px -28px #1c2b3345; overflow: hidden; }
.route-kop { display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: 1rem 1.5rem; border-bottom: 1px solid var(--ontwerp-rand); color: var(--gedempt); font-size: .72rem; }
.route-stipjes { color: #6e8b81; letter-spacing: .25em; }
.route-inhoud { padding: 2rem 2rem 1.5rem; }
.ontwerp .route-label { font-size: 2.25rem; letter-spacing: -.055em; line-height: 1.1; font-weight: 650; margin: 0 0 1.7rem; }
.route-lijst { list-style: none; padding: 0; margin: 0; }
.route-lijst li { display: flex; gap: .85rem; align-items: center; background: #fff; border: 1px solid var(--ontwerp-rand); border-radius: .55rem; padding: 1rem; margin: .65rem 0 0; }
.route-lijst li:last-child { background: var(--ontwerp-mint); border-color: #b9d1c7; }
.route-nummer { font-size: .65rem; color: var(--accent); border: 1px solid #b9d1c7; border-radius: 50%; width: 1.65rem; height: 1.65rem; display: grid; place-items: center; flex-shrink: 0; }
.route-lijst li div { flex: 1; }
.route-lijst strong, .route-lijst li div span { display: block; }
.route-lijst strong { font-size: .875rem; font-weight: 650; }
.route-lijst li div span { font-size: .68rem; color: var(--gedempt); }
.route-lijst .lijn-icoon { color: var(--accent); width: 1.3rem; height: 1.3rem; }
.route-vraag { display: flex; align-items: center; gap: 1rem; padding-top: 1.2rem; color: var(--accent); }
.route-vraag > span { font-size: 2rem; }
.ontwerp .route-vraag p { font-size: .8rem; line-height: 1.5; margin: 0; }
.route-caption { display: flex; flex-wrap: wrap; gap: .6rem; padding: 1rem 2rem; border-top: 1px solid var(--ontwerp-rand); font-size: .65rem; font-weight: 650; color: var(--gedempt); }
.route-caption span+span::before { content: '/'; margin-right: .6rem; color: #647870; }
.bewijs-strook { border-block: 1px solid var(--ontwerp-rand); }
.bewijs-strook > .omslag { display: flex; gap: 3rem; justify-content: space-between; align-items: center; padding-block: 1.6rem; }
.ontwerp .bewijs-strook p { font-size: .85rem; line-height: 1.4; margin: 0; flex-shrink: 0; }
.bewijs-strook ul { display: flex; align-items: center; gap: 3rem; list-style: none; margin: 0; padding: 0; }
.bewijs-strook li { display: flex; align-items: center; gap: .75rem; font-size: .8rem; font-weight: 550; }
.bewijs-strook .lijn-icoon { color: var(--accent); width: 1.4rem; }
.sectie-kop { display: grid; grid-template-columns: 1.25fr 1fr; gap: 4rem; align-items: end; margin-bottom: 3rem; }
.ontwerp .sectie-kop h2 { margin-bottom: 0; }
.sectie-kop > p { margin: 0 0 .15rem; color: var(--gedempt); font-size: .95rem; max-width: 30rem; }
.dienst-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.dienst-kaart { display: flex; flex-direction: column; padding: 2rem; border: 1px solid var(--ontwerp-rand); border-radius: .85rem; background: white; }
.kaart-boven { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 2.75rem; color: var(--accent); }
.kaart-boven .lijn-icoon { width: 2rem; height: 2rem; }
.kaart-boven span { font-size: .68rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
.ontwerp .dienst-kaart h3 { font-size: 1.6rem; margin-bottom: 1rem; }
.dienst-kaart > p { font-size: .9rem; line-height: 1.75; color: var(--gedempt); margin: 0 0 2rem; }
.kaart-resultaat { border-top: 1px solid var(--ontwerp-rand); padding-top: 1.1rem; margin-top: auto; }
.kaart-resultaat span { display: block; font-size: .7rem; color: var(--gedempt); margin-bottom: .3rem; }
.kaart-resultaat strong { display: block; font-size: .8rem; font-weight: 650; }
.dienst-noot { display: flex; gap: .85rem; align-items: center; padding: 1.25rem 0 0; }
.ontwerp .dienst-noot p { font-size: .8rem; color: var(--gedempt); margin: 0; }
.label-klein { display: inline-block; background: var(--ontwerp-mint); color: #254d40; border: 1px solid #c3d9ce; border-radius: .3rem; padding: .25rem .6rem; font-size: .62rem; line-height: 1.4; font-weight: 650; white-space: nowrap; }
.ontwerp main .showcase-sectie { background: var(--ontwerp-zacht); }
.showcase-project { display: grid; grid-template-columns: 1.25fr 1fr; gap: 4rem; align-items: center; margin-bottom: 3.5rem; }
.project-beeld { background: #e9e4db; border: 1px solid #d1cabe; border-radius: .8rem; overflow: hidden; color: #343f34; }
.project-mini-kop { display: flex; gap: .75rem; align-items: center; justify-content: space-between; padding: 1rem 1.4rem; background: #f4f1ea; border-bottom: 1px solid #d1cabe; font-size: .9rem; font-weight: 700; }
.project-mini-kop .label-klein { font-size: .55rem; background: #f4f1ea; color: #4d594e; border-color: #bfc7bc; }
.koffie-scene { display: flex; align-items: center; padding: 2rem 1.2rem; min-height: 18rem; }
.koffie-scene img { width: 48%; height: auto; }
.ontwerp .koffie-scene .overtitel { font-size: .6rem; color: #4d594e; margin-bottom: .8rem; }
.ontwerp .koffie-scene p { font-size: 1.55rem; font-weight: 650; line-height: 1.2; letter-spacing: -.045em; margin: 0; }
.project-onder { display: flex; gap: .75rem; justify-content: space-between; padding: 1rem 1.4rem; background: #f4f1ea; border-top: 1px solid #d1cabe; font-size: .62rem; }
.project-onder a { color: #294c3f; font-weight: 650; }
.ontwerp .project-uitleg h3 { font-size: 2.35rem; }
.project-uitleg > p { font-size: .9rem; color: var(--gedempt); }
.project-uitleg > p:last-child a { font-size: .8rem; }
.ontwerp .stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 2rem; margin: 0; padding: 2.2rem 0; border-block: 1px solid #bdcfc6; }
.ontwerp .stat { border: 0; background: transparent; border-radius: 0; padding: 0 1.5rem 0 0; text-align: left; min-width: 0; }
.ontwerp .stat+.stat { border-left: 1px solid #bdcfc6; padding-left: 2rem; }
.ontwerp .stat b { display: block; font-size: 4.5rem; line-height: 1; letter-spacing: -.06em; font-weight: 600; color: var(--accent); margin-bottom: .7rem; }
.ontwerp .stat span { display: block; font-size: .8rem; color: var(--gedempt); max-width: 17rem; }
.ontwerp .bronregel { color: var(--gedempt); font-size: .65rem; margin: 1rem 0 0; }
.ontwerp main .bureau-sectie { color: white; background: var(--inkt); }
.bureau-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 6rem; align-items: center; }
.ontwerp .bureau-sectie .overtitel { color: var(--teal-licht); }
.ontwerp .bureau-sectie h2 { font-size: clamp(2.5rem, 4.5vw, 4rem); }
.bureau-sectie h2 em { color: var(--teal-licht); font-style: normal; }
.bureau-grid > div > p:not(.overtitel) { color: #d1e0df; font-size: .95rem; max-width: 29rem; }
.ontwerp main .knop-licht { color: var(--inkt); background: var(--teal-licht); border-color: var(--teal-licht); margin-top: 1rem; }
.ontwerp main .knop-licht:hover { background: #b7ede2; border-color: #b7ede2; }
.bureau-paneel { border: 1px solid #4c6269; border-radius: .8rem; padding: 2rem; background: #243841; }
.ontwerp .bureau-label { font-size: .85rem; font-weight: 650; padding-bottom: 1.6rem; margin: 0; border-bottom: 1px solid #4c6269; color: var(--teal-licht); }
.bureau-paneel ul { list-style: none; padding: 0; margin: 0; }
.bureau-paneel li { display: flex; align-items: flex-start; gap: 1.2rem; padding-top: 1.8rem; }
.bureau-paneel li > span { color: var(--teal-licht); font-size: .65rem; margin-top: .2rem; }
.ontwerp .bureau-paneel h3 { font-size: 1.05rem; letter-spacing: -.02em; margin-bottom: .55rem; }
.ontwerp .bureau-paneel li p { color: #d1e0df; font-size: .8rem; line-height: 1.75; margin: 0; }
.ontwerp .waarom-sectie > .omslag { max-width: 57rem; }
.ontwerp .waarom-sectie h2 { font-size: 2.5rem; }
.ontwerp .waarom-sectie p:not(.overtitel), .ontwerp .waarom-sectie li { font-size: .95rem; }
.ontwerp main .contact-sectie { background: var(--ontwerp-mint); border-top: 1px solid #c3d9ce; }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: center; }
.contact-intro { position: relative; }
.anker { position: absolute; top: -2rem; }
.ontwerp .contact-intro h2 { font-size: clamp(2rem, 3.5vw, 3.2rem); }
.contact-intro > p:not(.overtitel) { font-size: .95rem; color: var(--gedempt); }
.contact-persoon { display: flex; gap: 1rem; align-items: center; margin-block: 2rem 1.2rem; }
.persoon-monogram { display: grid; place-items: center; border-radius: 50%; width: 3.2rem; height: 3.2rem; background: var(--accent); color: white; font-size: 1rem; letter-spacing: -.05em; }
.contact-persoon strong, .contact-persoon div > span { display: block; font-size: .85rem; }
.contact-persoon div > span { color: var(--gedempt); font-size: .75rem; }
.ontwerp .contact-intro .contact-links { font-size: .8rem; line-height: 1.9; }
.contact-kaart { padding: 2.5rem; background: white; border: 1px solid #bdcfc6; border-radius: 1rem; box-shadow: 0 22px 48px -34px #1c2b3350; }
.contact-kaart-kop { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: 1.7rem; margin-bottom: 1.7rem; border-bottom: 1px solid var(--ontwerp-rand); color: var(--accent); }
.contact-kaart-kop .overtitel { margin: 0; }
.ontwerp #quickscan-contact { font-size: 1.2rem; line-height: 1.55; margin: 0 0 1rem; font-weight: 500; scroll-margin-top: 2rem; }
.ontwerp #quickscan-contact span { display: block; color: var(--accent); font-size: clamp(1.1rem,2.2vw,1.8rem); letter-spacing: -.04em; font-weight: 650; overflow-wrap: anywhere; }
.ontwerp #quickscan-contact:focus { outline: 3px solid var(--accent); outline-offset: .5rem; border-radius: 2px; }
.ontwerp .contact-hulp { font-size: .8rem; line-height: 1.6; color: var(--gedempt); margin-bottom: 1.5rem; }
.ontwerp .kopieer-rij { margin: 0; }
.ontwerp .kopieer-rij .kopieer-adres { width: 100%; }
.ontwerp .kopieer-status { display: block; min-height: 1.4em; margin: .5rem 0 0; color: var(--accent); font-size: .8rem; }
.ontwerp .mail-alternatief { margin: .7rem 0 0; font-size: .8rem; text-align: center; }
.contact-noot { display: flex; align-items: center; gap: .8rem; padding-top: 1.5rem; margin-top: 1.7rem; border-top: 1px solid var(--ontwerp-rand); color: var(--gedempt); }
.contact-noot > span { font-size: 1.8rem; color: var(--accent); }
.ontwerp .contact-noot p { font-size: .7rem; margin: 0; }
.ontwerp .site-voet { padding: 4rem 0 0; margin-block-start: 0; background: var(--inkt); color: #d1e0df; }
.voet-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 4rem; padding-bottom: 3rem; }
.site-voet .merk { color: white; }
.site-voet .merk svg { border: 1px solid #4c6269; border-radius: .65rem; }
.ontwerp .voet-merk p { font-size: .85rem; line-height: 1.8; margin-top: 1.5rem; }
.ontwerp .site-voet nav h2 { color: white; font-size: .7rem; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; margin: .35rem 0 1.35rem; }
.ontwerp .site-voet nav ul { display: grid; list-style: none; gap: .6rem; padding: 0; margin: 0; }
.ontwerp .site-voet nav li { margin: 0; font-size: .8rem; line-height: 1.6; }
.ontwerp .site-voet nav li > a, .ontwerp .site-voet nav li > .consent-open { display: block; font: inherit; color: #d1e0df; border: 0; background: none; text-decoration: none; margin: 0; padding: .2rem 0; text-align: left; }
.ontwerp .site-voet nav li > a:hover, .ontwerp .site-voet nav li > .consent-open:hover { color: var(--teal-licht); text-decoration: underline; }
.voet-onder { border-top: 1px solid #4c6269; display: flex; justify-content: space-between; gap: 1rem; padding: 1.35rem 0; }
.ontwerp .voet-onder p { font-size: .65rem; margin: 0; }
/* Bestaande informatiepagina’s: dezelfde identiteit, rustige leesbreedte. */
.pagina-binnen main > section:not(.contact-sectie) > .omslag { max-width: 62rem; }
.pagina-binnen main > section.hero { background: var(--ontwerp-zacht); border-bottom: 1px solid var(--ontwerp-rand); }
.pagina-binnen main h1 { font-size: clamp(2.5rem,4.5vw,4rem); max-width: 18ch; margin-bottom: 2rem; }
.pagina-binnen main .intro { font-size: 1.15rem; line-height: 1.75; max-width: 45rem; }
.pagina-binnen main > section:not(.contact-sectie) p, .pagina-binnen main > section:not(.contact-sectie) li { max-width: 50rem; }
.pagina-binnen main .papier { background: var(--ontwerp-zacht); }
.pagina-binnen main > section:not(.contact-sectie) h2:not(:first-child) { margin-top: 3rem; }
.pagina-binnen main .stappen-kort { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; padding: 0; list-style-position: inside; }
.pagina-binnen main .stappen-kort li { padding: 1.8rem; border: 1px solid var(--ontwerp-rand); border-radius: .8rem; margin: 0; background: white; font-size: .9rem; }
.pagina-binnen main .stappen-kort b { font-weight: 700; }
.pagina-binnen .label-eerlijk { padding: 1.6rem 2rem; border-left: 3px solid var(--accent); background: var(--ontwerp-mint); border-radius: 0 .6rem .6rem 0; }
.pagina-binnen .label-eerlijk p { margin: 0; }
.pagina-binnen main .stats { margin-block: 2rem; }
.pagina-binnen .demo-groot, .pagina-binnen .vb-kaart { border: 1px solid var(--ontwerp-rand); border-radius: .8rem; padding: 2rem; }
.pagina-juridisch main > section:not(.contact-sectie) > .omslag { max-width: 55rem; }
.pagina-juridisch .juridische-tekst { font-size: 1rem; }
.pagina-juridisch main .juridische-tekst h2 { font-size: 1.7rem; letter-spacing: -.025em; margin-top: 3rem; }
.pagina-juridisch main h1 { max-width: none; }
.pagina-binnen main table { font-size: .85rem; }
@media (max-width: 1050px) {
 .ontwerp .kop-grid { gap: 1rem; flex-wrap: wrap; }
 .ontwerp .site-kop nav ul { gap: 1.25rem; }
 .hero-grid { gap: 2rem; }
 .ontwerp .ontwerp-hero h1 { font-size: clamp(2.7rem,5.2vw,3.5rem); }
 .bewijs-strook ul { gap: 1.3rem; }
 .bewijs-strook > .omslag { gap: 1.5rem; }
 .sectie-kop, .showcase-project, .contact-grid, .bureau-grid { gap: 2.5rem; }
 .dienst-kaart { padding: 1.5rem; }
 .contact-kaart { padding: 2rem; }
 .project-onder { flex-wrap: wrap; }
}
@media (max-width: 900px) {
 .ontwerp .omslag { padding-inline: 1.5rem; }
 .ontwerp main section { padding-block: 4rem; }
 .ontwerp .site-kop { padding-block: 1rem .65rem; }
 .ontwerp .kop-grid { gap: .75rem; }
 .ontwerp .merk { font-size: 1.05rem; gap: .55rem; }
 .ontwerp .merk svg { width: 2.2rem; height: 2.2rem; }
 .ontwerp .kop-cta { font-size: .72rem; gap: .65rem; padding: .65rem .8rem; }
 .ontwerp .site-kop nav { order: 3; width: 100%; border-top: 1px solid var(--ontwerp-rand); padding-top: .35rem; }
 .ontwerp .site-kop nav ul { justify-content: space-between; gap: .5rem; flex-wrap: wrap; }
 .ontwerp .site-kop nav a { font-size: .75rem; }
 .ontwerp main .ontwerp-hero { padding-block: 3.5rem; }
 .hero-grid, .sectie-kop, .showcase-project, .bureau-grid, .contact-grid { grid-template-columns: 1fr; gap: 2.5rem; }
 .ontwerp .ontwerp-hero h1 { font-size: clamp(2.3rem,7.6vw,3.5rem); }
 .ontwerp-hero .overtitel { font-size: .6rem; letter-spacing: .07em; margin-bottom: 1.4rem; }
 .ontwerp .hero-lead { font-size: 1rem; }
 .hero-knoppen { gap: .65rem 1.3rem; }
 .ontwerp .hero-voetnoot { font-size: .7rem; }
 .route-bord { max-width: 34rem; width: 100%; }
 .route-inhoud { padding: 1.6rem; }
 .ontwerp .route-label { font-size: 2rem; }
 .route-kop { padding: .9rem 1.3rem; }
 .route-caption { padding: 1rem 1.6rem; }
 .bewijs-strook > .omslag { align-items: flex-start; flex-direction: column; gap: 1rem; }
 .bewijs-strook p br { display: none; }
 .bewijs-strook ul { flex-wrap: wrap; gap: .9rem 1.3rem; }
 .bewijs-strook li { font-size: .7rem; }
 .bewijs-strook .lijn-icoon { width: 1.2rem; height: 1.2rem; }
 .sectie-kop { margin-bottom: 2rem; gap: 1.5rem; }
 .ontwerp main h2 { font-size: 2.1rem; }
 .ontwerp .overtitel { font-size: .65rem; margin-bottom: 1rem; }
 .dienst-grid { grid-template-columns: 1fr; }
 .dienst-kaart { padding: 1.8rem; }
 .kaart-boven { margin-bottom: 1.8rem; }
 .dienst-noot { align-items: flex-start; }
 .showcase-project { margin-bottom: 2rem; }
 .koffie-scene { min-height: 14rem; }
 .ontwerp .koffie-scene p { font-size: 1.35rem; }
 .project-mini-kop { padding-inline: 1rem; }
 .ontwerp .project-uitleg h3 { font-size: 2rem; }
 .ontwerp .stats { gap: 0; padding-block: 1.8rem; }
 .ontwerp .stat { padding-right: .75rem; }
 .ontwerp .stat+.stat { padding-left: .9rem; }
 .ontwerp .stat b { font-size: 3rem; }
 .ontwerp .stat span { font-size: .66rem; }
 .ontwerp .bronregel { font-size: .6rem; line-height: 1.8; }
 .ontwerp .bureau-sectie h2 { font-size: 2.75rem; }
 .bureau-paneel { padding: 1.6rem; }
 .contact-kaart { padding: 1.7rem; }
 .contact-kaart-kop { padding-bottom: 1.3rem; margin-bottom: 1.3rem; }
 .ontwerp .contact-intro h2 { font-size: 2.3rem; }
 .ontwerp #quickscan-contact { font-size: 1rem; }
 .ontwerp #quickscan-contact span { font-size: 1.5rem; }
 .voet-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem 1.5rem; }
 .voet-merk { grid-column: 1/-1; }
 .voet-onder { flex-direction: column; gap: .5rem; }
 .pagina-binnen main h1 { font-size: 2.5rem; }
 .pagina-binnen main .stappen-kort { grid-template-columns: 1fr; }
 .pagina-binnen main .intro { font-size: 1rem; }
}
@media (max-width: 370px) {
 .ontwerp .omslag { padding-inline: 1rem; }
 .ontwerp .kop-cta { gap: .35rem; padding-inline: .55rem; }
 .ontwerp .merk { font-size: .95rem; }
 .ontwerp .ontwerp-hero h1 { font-size: 2.1rem; }
 .ontwerp main .knop { font-size: .85rem; gap: .65rem; }
 .contact-kaart { padding: 1.35rem; }
 .ontwerp #quickscan-contact span { font-size: 1.35rem; }
 .route-inhoud { padding: 1.25rem; }
 .route-lijst li { padding: .8rem; gap: .6rem; }
 .route-lijst strong { font-size: .8rem; }
 .route-lijst li div span { font-size: .6rem; }
 .koffie-scene { padding-inline: .5rem; }
 .ontwerp .koffie-scene p { font-size: 1.2rem; }
 .project-mini-kop { flex-wrap: wrap; }
 .ontwerp .stat b { font-size: 2.6rem; }
 .ontwerp .stat span { font-size: .6rem; }
}
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto; }
 .ontwerp *, .ontwerp *::before, .ontwerp *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
/* Quickscan-formulierkaart: uitsluitend de bestaande contactkaart. */
.contact-sectie .contact-grid { align-items: start; }
.ontwerp .contact-kaart #quickscan-contact { font-size: .75rem; line-height: 1.5; letter-spacing: .12em; margin: 0; font-weight: 750; }
.ontwerp .contact-kaart .qs-formulier { width: 100%; max-width: none; margin: 0; gap: 1.15rem; }
.ontwerp .contact-kaart .contact-hulp { margin: 0; }
.ontwerp .contact-kaart .qs-veld { gap: .4rem; }
.ontwerp .contact-kaart .qs-veld label { font-size: .85rem; font-weight: 650; }
.ontwerp .contact-kaart .qs-verplicht { font-size: .75rem; font-weight: 400; }
.ontwerp .contact-kaart .qs-veld input, .ontwerp .contact-kaart .qs-veld textarea { width: 100%; min-width: 0; min-height: 3rem; font: inherit; font-size: 1rem; line-height: 1.5; padding: .7rem .85rem; border: 1px solid #657e79; border-radius: .45rem; color: var(--inkt); background: white; }
.ontwerp .contact-kaart .qs-veld textarea { resize: vertical; min-height: 7rem; }
.ontwerp .contact-kaart .qs-veld :is(input, textarea):focus-visible { outline: 3px solid var(--inkt); outline-offset: 2px; box-shadow: 0 0 0 2px white; }
.ontwerp .contact-kaart .qs-veld [aria-invalid="true"] { border: 2px solid var(--inkt); }
.ontwerp .contact-kaart .qs-hulp, .ontwerp .contact-kaart .qs-fout { font-size: .75rem; margin: 0; line-height: 1.6; }
.ontwerp .contact-kaart .qs-hulp { color: var(--gedempt); }
.ontwerp .contact-kaart .qs-formulier > .knop { width: 100%; margin-top: .35rem; }
.ontwerp .contact-kaart .qs-formulier > .knop[aria-disabled="true"] { cursor: wait; }
.ontwerp .contact-kaart .qs-val { display: none; }
.ontwerp .contact-kaart .qs-samenvatting { border: 2px solid var(--inkt); border-radius: .45rem; background: var(--ontwerp-zacht); padding: 1rem; }
.ontwerp .contact-kaart .qs-samenvatting:focus { outline: 3px solid var(--accent); outline-offset: 3px; }
.ontwerp .contact-kaart .qs-samenvatting h4 { font-size: .95rem; margin: 0 0 .6rem; line-height: 1.4; }
.ontwerp .contact-kaart .qs-samenvatting p, .ontwerp .contact-kaart .qs-samenvatting li { font-size: .8rem; }
.ontwerp .contact-kaart .qs-samenvatting p { margin: 0; }
.ontwerp .contact-kaart .qs-samenvatting ul { margin: .65rem 0 0; padding-left: 1.15rem; }
.ontwerp .contact-kaart .qs-samenvatting ul:empty { margin: 0; }
.ontwerp .contact-kaart .qs-status { font-size: .85rem; font-weight: 550; background: var(--ontwerp-mint); margin: 0; }
.ontwerp .contact-kaart .qs-status:empty { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); padding: 0; border: 0; margin: 0; }
.ontwerp .contact-kaart .qs-beschikbaarheid { font-size: .75rem; padding: .8rem 1rem; background: var(--ontwerp-zacht); border-left: 3px solid var(--accent); margin: 0; }
.ontwerp .contact-kaart .qs-privacy { color: var(--gedempt); font-size: .72rem; line-height: 1.7; margin: 0; }
.ontwerp .contact-kaart .qs-alt { padding-top: 1.3rem; margin-top: 1.3rem; border-top: 1px solid var(--ontwerp-rand); font-size: .8rem; }
.ontwerp .contact-kaart :is(.qs-samenvatting, .qs-fout, .qs-beschikbaarheid)[hidden] { display: none; }
@media print {
 .ontwerp main section { padding-block: 1.5rem; }
 .ontwerp .site-kop, .ontwerp .site-voet, .ontwerp .contact-sectie { display: none; }
 .ontwerp .hero-grid, .ontwerp .sectie-kop, .ontwerp .bureau-grid { display: block; }
 .route-bord { break-inside: avoid; }
}

/* Goedgekeurde afronding: portret en een gedeelde horizontale juridische rij. */
.contact-portret { display: block; flex: 0 0 auto; width: 5.5rem; height: 5.5rem; max-width: 100%; border-radius: 50%; object-fit: cover; }
.voet-grid { grid-template-columns: 1.6fr 1fr; }
.ontwerp .site-voet .voet-juridisch { border-top: 1px solid #4c6269; padding-block: 1rem; }
.ontwerp .site-voet .voet-juridisch ul { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem 1.75rem; }
.ontwerp .site-voet .voet-juridisch li { display: flex; align-items: baseline; margin: 0; padding: 0; }
.ontwerp .site-voet .voet-juridisch li > :is(a,button) { appearance: none; display: inline-flex; align-items: baseline; justify-content: flex-start; min-height: 0; min-width: 0; width: auto; height: auto; box-sizing: border-box; border: 0; border-radius: 0; background: transparent; box-shadow: none; font-family: inherit; font-size: .8rem; font-weight: 400; line-height: 1.6; letter-spacing: normal; text-transform: none; color: #d1e0df; text-decoration: none; margin: 0; padding: .4rem 0; vertical-align: baseline; cursor: pointer; }
.ontwerp .site-voet .voet-juridisch li > :is(a,button):hover { color: var(--teal-licht); text-decoration: underline; }
.ontwerp .site-voet .voet-juridisch li > :is(a,button):focus-visible { outline: 3px solid white; outline-offset: 4px; }
.ontwerp .site-voet .voet-juridisch button[hidden] { display: none; }
@media(max-width:700px) { .contact-portret { width: 4.5rem; height: 4.5rem; } .voet-grid { grid-template-columns: 1fr; } .ontwerp .site-voet .voet-juridisch ul { gap: .5rem 1.2rem; } }

/* Leesbaarheid: informatietekst 16px, secundaire tekst minimaal 14px (bij 16px basis). */
.ontwerp .overtitel, .ontwerp .ontwerp-hero .overtitel, .ontwerp .koffie-scene .overtitel,
.ontwerp .kop-cta, .ontwerp .site-kop nav a,
.ontwerp .hero-voetnoot, .ontwerp .route-kop, .ontwerp .route-caption,
.ontwerp .route-lijst strong, .ontwerp .route-lijst li div span,
.ontwerp .bewijs-strook p, .ontwerp .bewijs-strook li,
.ontwerp .kaart-boven span, .ontwerp .kaart-resultaat span,
.ontwerp .label-klein, .ontwerp .project-mini-kop .label-klein,
.ontwerp .project-onder, .ontwerp .project-uitleg > p:last-child a,
.ontwerp .stat span, .ontwerp .bronregel, .ontwerp .bureau-label,
.ontwerp .contact-persoon div > span, .ontwerp .contact-intro .contact-links,
.ontwerp .site-voet nav h2, .ontwerp .site-voet nav li,
.ontwerp .site-voet .voet-juridisch li > :is(a,button), .ontwerp .voet-onder p,
.ontwerp .contact-kaart #quickscan-contact, .ontwerp .contact-kaart .qs-verplicht,
.ontwerp .contact-kaart .qs-hulp, .ontwerp .contact-kaart .qs-privacy,
.ontwerp .contact-kaart .qs-alt { font-size: .875rem; line-height: 1.6; }
.ontwerp .sectie-kop > p, .ontwerp .dienst-kaart > p, .ontwerp .kaart-resultaat strong,
.ontwerp .dienst-noot p, .ontwerp .project-uitleg > p,
.ontwerp .bureau-grid > div > p:not(.overtitel), .ontwerp .bureau-paneel li p,
.ontwerp .waarom-sectie p:not(.overtitel), .ontwerp .waarom-sectie li,
.ontwerp .contact-intro > p:not(.overtitel):not(.contact-links), .ontwerp .contact-persoon strong,
.ontwerp .contact-hulp, .ontwerp .voet-merk p,
.ontwerp .contact-kaart .qs-veld label, .ontwerp .contact-kaart .qs-fout,
.ontwerp .contact-kaart .qs-samenvatting p, .ontwerp .contact-kaart .qs-samenvatting li,
.ontwerp .contact-kaart .qs-status, .ontwerp .contact-kaart .qs-beschikbaarheid,
.ontwerp.pagina-binnen main .stappen-kort li, .ontwerp.pagina-binnen main table { font-size: 1rem; line-height: 1.6; }
.ontwerp main .knop { font-size: 1rem; }
.ontwerp .route-vraag p { font-size: 1rem; line-height: 1.5; }
/* De nieuwe h2 behoudt exact de oorspronkelijke vormgeving van de routekop. */
.ontwerp main h2.route-label { font-size: 2.25rem; line-height: 1.1; font-weight: 650; letter-spacing: -.055em; margin: 0 0 1.7rem; text-wrap: wrap; }
/* Laat langere, grotere labels natuurlijk omslaan binnen de bestaande kaarten. */
.ontwerp .project-mini-kop, .ontwerp .project-onder, .ontwerp .bewijs-strook ul { flex-wrap: wrap; }
.ontwerp .route-lijst li div, .ontwerp .bureau-paneel li > div { min-width: 0; }
.ontwerp .route-lijst li div span, .ontwerp .stat span { overflow-wrap: anywhere; }
.ontwerp .label-klein { white-space: normal; }
@media(max-width:900px) { .ontwerp main h2.route-label { font-size: 2rem; } }
@media(max-width:500px) {
 .ontwerp .koffie-scene { flex-wrap: wrap; }
 .ontwerp .koffie-scene img { max-width: 10rem; }
 .ontwerp .stats { grid-template-columns: 1fr; gap: 1.25rem; }
 .ontwerp .stat, .ontwerp .stat+.stat { border-left: 0; padding: 0; }
 .ontwerp .stat+.stat { border-top: 1px solid #bdcfc6; padding-top: 1.25rem; }
}

/* Semantische showcasekop: dezelfde vormgeving als de oorspronkelijke tekst. */
.ontwerp .koffie-scene h3 { font-size: 1.55rem; font-weight: 650; line-height: 1.2; letter-spacing: -.045em; margin: 0; text-wrap: wrap; color: inherit; }
@media(max-width:900px) { .ontwerp .koffie-scene h3 { font-size: 1.35rem; } }
@media(max-width:370px) { .ontwerp .koffie-scene h3 { font-size: 1.2rem; } }

/* Lange voorwaarden: leesbare leden, inhoudsopgave en veilige reflow. */
.voorwaarden-inhoud { border: 1px solid var(--ontwerp-rand); border-radius: .8rem; padding: 1rem 1.25rem; margin-block: 2rem; }
.voorwaarden-inhoud summary { cursor: pointer; font-weight: 650; }
.voorwaarden-inhoud ol { padding-left: 1.5rem; margin-block: 1rem 0; }
.voorwaarden-inhoud li { padding-block: .3rem; }
.voorwaarden-leden { padding-left: 1.7rem; }
.voorwaarden-leden li { padding-left: .3rem; margin-block: 1rem; line-height: 1.7; overflow-wrap: anywhere; }
.voorwaarden-inhoud a { overflow-wrap: anywhere; }
