/* style#fontfaces */
/* v183: lettertypes zelf gehost (geen Google Fonts meer: privacy + sneller; de oude Google-link was bovendien kapot: opsz 9.144 i.p.v. 9..144) */@font-face {font-family: 'Fraunces'; font-style: italic; font-weight: 300 500; font-display: swap; src: url(/fonts/fraunces-italic-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face {font-family: 'Fraunces'; font-style: italic; font-weight: 300 500; font-display: swap; src: url(/fonts/fraunces-italic-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face {font-family: 'Fraunces'; font-style: normal; font-weight: 300 600; font-display: swap; src: url(/fonts/fraunces-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face {font-family: 'Fraunces'; font-style: normal; font-weight: 300 600; font-display: swap; src: url(/fonts/fraunces-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face {font-family: 'Instrument Sans'; font-style: normal; font-weight: 400 600; font-stretch: 100%; font-display: swap; src: url(/fonts/instrument-sans-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face {font-family: 'Instrument Sans'; font-style: normal; font-weight: 400 600; font-stretch: 100%; font-display: swap; src: url(/fonts/instrument-sans-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
/* style */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,sans-serif;
background:#F4EFE6;color:#2C2620;font-size:17px;line-height:1.65}
.wrap{max-width:820px;margin:0 auto;padding:0 22px}
a{color:#3A5749;text-underline-offset:3px}
.back{display:inline-flex;align-items:center;min-height:44px;padding:10px 0;
text-decoration:none;font-size:.95rem;color:#5C534A}
.back:hover{color:#2C2620}
header.top{padding:14px 0 0}
h1{font-family:Fraunces,Georgia,serif;font-weight:400;font-size:clamp(1.9rem,4.6vw,2.7rem);line-height:1.16;letter-spacing:-.01em;margin:10px 0 10px}
h2{font-family:Fraunces,Georgia,serif;font-weight:500;font-size:1.3rem;line-height:1.3;margin:40px 0 10px}
h3{font-size:1.02rem;font-weight:500;margin:24px 0 6px}
p,li,dd,td,th{font-size:1rem}
p{margin:0 0 14px;max-width:68ch}
li{margin:0 0 7px;max-width:66ch}
ul{padding-left:20px;margin:0 0 14px}
.lead{color:#5C534A;font-size:1.06rem;max-width:62ch}
.card{background:#EFE9DE;border-radius:10px;padding:18px 20px;margin:20px 0}
.card p:last-child{margin-bottom:0}
dl{margin:0 0 14px;max-width:68ch}
dt{font-weight:500;margin-top:14px}
dd{margin:2px 0 0;color:#4A4139}
table{border-collapse:collapse;width:100%;max-width:68ch;margin:0 0 18px}
th,td{text-align:left;padding:10px;border-bottom:1px solid #DED5C7;vertical-align:top}
th{font-weight:500;color:#4A4139;background:#EFE9DE}
.updated{font-size:.95rem;color:#5C534A;margin:30px 0 0}
.note{font-size:1rem;color:#4A4139;background:#EFE9DE;border-left:3px solid #4F7263;
padding:14px 16px;border-radius:0 8px 8px 0;max-width:68ch;margin:18px 0 0}
.legalnav{margin:38px 0 0;padding-top:18px;border-top:1px solid #DED5C7}
.legalnav a{display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;
margin:0 8px 8px 0;background:#EFE9DE;border-radius:999px;text-decoration:none;font-size:.95rem;color:#2C2620}
.legalnav a:hover{background:#E5DCCD}
.legalnav a[aria-current="page"]{background:#4F7263;color:#FFFDF9}
footer{margin-top:36px;border-top:1px solid #DED5C7;background:#EFE9DE}
footer .wrap{padding-top:26px;padding-bottom:calc(34px + env(safe-area-inset-bottom,0px))}
footer{font-size:.95rem;color:#5C534A;line-height:1.85}
footer a{color:#5C534A;display:inline-flex;align-items:center;min-height:44px}
footer .brand{font-family:Fraunces,Georgia,serif;font-size:1.15rem;color:#2C2620;
text-decoration:none}
@media(max-width:640px){body{font-size:16px}.wrap{padding:0 18px}h2{margin-top:34px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.toc{background:#EFE9DE;border-radius:10px;padding:14px 18px;margin:22px 0 4px}
.toc ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:0 18px}
.toc li{margin:0 0 4px;max-width:none}
.toc a{font-size:.95rem}
.langnav{margin:24px 0 0;padding-top:12px;border-top:1px solid #DED5C7;font-size:.95rem;color:#5C534A}
.langnav a{display:inline-flex;align-items:center;min-height:44px;margin-right:16px}
/* --- 26. De width/height-attributen op img-elementen gelden als presentatie-hint met
       een definitieve hoogte zodra de CSS zelf geen height zet. Daardoor won
       height=600 van aspect-ratio:1 en werden o.a. de Instagram-tegels
       165x600 in plaats van vierkant. Deze ene regel herstelt dat overal;
       elke expliciete CSS-hoogte (.hero-media img, .wing-row img, .band-media
       img, ...) is specifieker en blijft dus gewoon gelden. --- */
img{height:auto}

/* --- 27. Op mobiel waren de galerijfoto's 600-810 px breed op een scherm van
       390 px, dus je zag altijd maar een fragment. Nu past elke foto in beeld
       en klikt de horizontale rij netjes per foto vast. --- */
@media(max-width:820px){
  .wing-row img,.wing-row figure.ph img{
    height:auto;width:min(84vw,340px);aspect-ratio:3/2;object-fit:cover}
  .glance-row img{height:auto;width:min(70vw,290px);aspect-ratio:3/2;object-fit:cover}
  .wing-row{scroll-snap-type:x proximity}
  .wing-row figure{scroll-snap-align:center}
}

/* --- 28. Instagram-widget: container voor de live feed. Blijft verborgen tot
       de widget echt inhoud heeft gerenderd; daarna verdwijnen de vaste foto's. --- */
.ig-embed{margin-top:18px;min-height:0}
.ig-embed[hidden]{display:none!important}
.ig-embed behold-widget{display:block;width:100%}
.ig-embed iframe{display:block;width:100%;border:0;border-radius:14px}
.ig-note{margin-top:10px;font-size:.78rem;color:var(--ink-soft,#4A4139);opacity:.75}

/* --- 29. Sectie 'In de buurt': dorpenkaart met OpenStreetMap-embed (zelfde
       aanpak als de bestaande kaart, geen API-sleutel, geen cookies). --- */
.dorpen-sec .dorpen-lead{max-width:66ch;margin-top:14px}
.dorpen-sub{margin-top:52px;font-family:var(--serif,Georgia,serif);font-weight:500;font-size:1.35rem}
.dorp-map{margin-top:30px;background:var(--white,#FFFDF9);border-radius:16px;padding:16px;
          border:1px solid var(--hairline,rgba(44,38,32,.12))}
.dorp-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.dorp-chip{border:1px solid rgba(44,38,32,.22);background:none;border-radius:999px;
           padding:10px 16px;font:inherit;font-size:.82rem;cursor:pointer;min-height:44px;
           display:inline-flex;align-items:center;transition:background .35s var(--ease,ease),
           border-color .35s var(--ease,ease),color .35s var(--ease,ease)}
.dorp-chip:hover{border-color:#3A5749}
.dorp-chip.is-on{background:#3A5749;border-color:#3A5749;color:var(--white,#FFFDF9)}
.dorp-map iframe{display:block;width:100%;height:clamp(280px,42vh,440px);border:0;border-radius:12px;
                 background:var(--sand,#F4EFE6)}
.dorp-readout{margin-top:12px;font-size:.9rem;color:var(--ink-soft,#4A4139);min-height:1.5em}
.dorp-readout strong{color:var(--ink,#2C2620)}
.dorp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:26px}
.dorp-card{background:var(--white,#FFFDF9);border:1px solid var(--hairline,rgba(44,38,32,.12));
           border-radius:12px;padding:20px 20px 16px}
.dorp-card h3{font-family:var(--serif,Georgia,serif);font-weight:500;font-size:1.18rem;margin:0 0 6px}
.dorp-card p{margin:0;font-size:.94rem;color:var(--ink-soft,#4A4139);max-width:42ch}
.dorp-facts{margin:14px 0 0;display:grid;grid-template-columns:auto 1fr;gap:2px 12px;font-size:.84rem}
.dorp-facts dt{color:var(--ink-soft,#4A4139);opacity:.8}
.dorp-facts dd{margin:0;color:var(--ink,#2C2620)}
.dorp-link{margin-top:14px;border:0;background:none;padding:10px 0;font:inherit;font-size:.84rem;
           color:#3A5749;cursor:pointer;text-decoration:underline;text-underline-offset:3px;min-height:44px}
.dorp-link:hover{opacity:.75}
.dorp-caveat{margin-top:22px;font-size:.8rem;color:var(--ink-soft,#4A4139);opacity:.8;max-width:62ch}
@media(max-width:640px){
  .dorp-map{padding:12px}
  .dorp-grid{grid-template-columns:1fr}
  .dorpen-sub{margin-top:40px}
}

/* --- 30. Dorpen worden als vlak getoond, niet als speld. De vorm is geschaald
       op de bebouwde kern en ligt over de kaart, dus zonder extra verzoek. --- */
.dorp-mapwrap{position:relative;line-height:0}
.dorp-zone{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.85);
  border-radius:50%;pointer-events:none;opacity:0;
  background:rgba(58,87,73,.16);border:2px solid rgba(58,87,73,.6);
  box-shadow:0 0 0 1px rgba(255,253,249,.55) inset;
  transition:opacity .45s var(--ease,ease),transform .45s var(--ease,ease),
             width .45s var(--ease,ease),height .45s var(--ease,ease)}
.dorp-zone.is-on{opacity:1;transform:translate(-50%,-50%) scale(1)}
@media (prefers-reduced-motion: reduce){.dorp-zone{transition:none}}
/* style#css172 */
/* v172 — hero-frame: foto's vullen hun kader (picture-wrapper had geen hoogte) */
.hf-strip figure.ph{display:flex}
.hf-strip figure.ph picture,.hf-strip picture{display:block;width:100%;height:100%}
.hf-strip figure.ph img,.hf-strip picture img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;display:block}
.hero-frame .sub-hero-cta{justify-content:center;max-width:none;margin-left:auto;margin-right:auto}
/* v172 — plannenarchief: gelijke kaarten, laatste rij gecentreerd */
.uk-arch{display:flex;flex-wrap:wrap;justify-content:center;gap:26px 22px}
.uk-arch figure.ph{flex:0 1 200px;display:flex;flex-direction:column;background:var(--white)}
.uk-arch figure.ph img{height:160px;padding:10px;box-sizing:border-box}
.uk-arch figcaption{margin-top:auto}
@media(max-width:820px){.uk-arch{gap:20px 14px}.uk-arch figure.ph{flex:1 1 calc(50% - 14px);max-width:calc(50% - 7px)}}
/* v172 — verwante pagina's vóór de footer */
.rel-sec{padding:0 0 70px}
/* v172 — hero-split (gezinnen): volle breedte i.p.v. de 900px-doos van .sub-hero; foto ankert op de villa */
.sub-hero.hero-split{max-width:none;margin:0}
.sub-hero.hero-split .sh-media{background-position:40% 62%}
.sub-hero.hero-split .sh-copy{padding:112px clamp(28px,6vw,96px) 64px}
.sub-hero.hero-split .sh-lead{max-width:52ch}
@media(max-width:820px){.sub-hero.hero-split .sh-copy{padding:34px 20px 40px}}
/* style#v183nrua */
.nrua{word-break:break-all}
/* style#ux227 */
body.galv-on #vpConsent,body:has(.galp-lb.open) #vpConsent,body:has(.uk-lb.open) #vpConsent{display:none!important}.uk-lb-close,.glance-btn,.vbtn,.vtap-fs{min-width:44px;min-height:44px}.uk-view{min-height:44px}#vpConsent .vpc-ok,#vpConsent .vpc-no{min-height:44px}
