/* Shared editorial foundations. Desktop refinements live in desktop.css. */
.mobile-navigation,.mobile-contactbar,.mobile-skip-link{display:none}
@media all{
 :root{--j-paper:#f6f3ed;--j-white:#fffdfa;--j-ink:#20323b;--j-blue:#17364a;--j-muted:#52616a;--j-rule:#c9beb0;--j-accent:#806848;--j-display:Georgia,'Times New Roman',serif;--j-body:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;--j-gutter:clamp(22px,6.2vw,48px);--j-photo:clamp(320px,47svh,420px)}
 *,*::before,*::after{box-sizing:border-box}
 html,body{width:100%;min-width:0;margin:0;scroll-behavior:smooth}
 body{background:var(--j-paper);color:var(--j-ink);font-family:var(--j-body);font-size:16px;font-weight:400;line-height:1.75;padding-bottom:calc(80px + env(safe-area-inset-bottom))}
 #container,#wrapper{width:100%;min-width:0;max-width:none;height:auto;overflow:visible;opacity:1!important}
 #preloader_wrapper,#scroll_wrapper,#nav_side,#nav_top{display:none!important}
 .mobile-skip-link{display:block;position:fixed;top:8px;left:12px;z-index:500;transform:translateY(-150%);background:var(--j-blue);color:white;padding:12px 18px;font:500 15px/1.5 var(--j-body)}
 .mobile-skip-link:focus{transform:none}
 .mobile-navigation{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;position:sticky;top:0;z-index:200;min-height:78px;padding:10px var(--j-gutter);background:var(--j-white);border-bottom:1px solid #d8d0c5}
 .mobile-brand{display:flex;flex-direction:column;justify-content:center;min-height:48px;min-width:0;color:var(--j-ink);font:400 clamp(15px,4.2vw,19px)/1.25 var(--j-display);text-decoration:none;letter-spacing:-.02em}
 .mobile-brand span{margin-top:5px;color:var(--j-muted);font:500 10px/1.4 var(--j-body);letter-spacing:.12em;text-transform:uppercase}
 .mobile-navigation details{position:static}
 .mobile-navigation summary{display:flex;align-items:center;justify-content:center;min-height:48px;min-width:54px;cursor:pointer;list-style:none;border:1px solid var(--j-rule);padding:8px 10px;color:var(--j-blue);font:500 12px/1.4 var(--j-body);letter-spacing:.04em}
 .mobile-navigation summary::-webkit-details-marker{display:none}
 .mobile-navigation details[open] summary{background:var(--j-blue);border-color:var(--j-blue);color:white}
 .mobile-menu-links{position:absolute;left:0;right:0;top:100%;max-height:calc(100svh - 166px);overflow-y:auto;overscroll-behavior:contain;padding:12px var(--j-gutter) 22px;background:var(--j-white);border-bottom:1px solid var(--j-rule);box-shadow:0 18px 24px #17364a12;counter-reset:sections}
 .mobile-menu-links a{display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;align-items:center;min-height:49px;padding:11px 0;border-bottom:1px solid #e5dfd5;color:var(--j-blue);text-decoration:none;font:400 17px/1.45 var(--j-display)}
 .mobile-menu-links a::before{counter-increment:sections;content:counter(sections,decimal-leading-zero);color:var(--j-accent);font:500 10px/1 var(--j-body);letter-spacing:.04em}
 .mobile-menu-links a:last-child{border-bottom:0}
 .mobile-menu-links a[aria-current]{text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--j-rule)}
 .mobile-contactbar{display:grid;grid-template-columns:1fr 1.65fr;gap:14px;align-items:center;position:fixed;bottom:0;left:0;right:0;z-index:210;padding:10px var(--j-gutter) calc(10px + env(safe-area-inset-bottom));background:var(--j-white);border-top:1px solid #d8d0c5}
 .mobile-contactbar a{display:flex;align-items:center;justify-content:center;min-height:48px;text-decoration:none;color:var(--j-blue);font:600 13px/1.4 var(--j-body);letter-spacing:.025em;text-align:center}
 .mobile-contactbar .mobile-appointment{background:var(--j-blue);color:white;padding:10px 14px}
 a:focus-visible,summary:focus-visible,button:focus-visible{outline:3px solid #a37430;outline-offset:4px}
 .section{height:auto!important;min-height:0;margin:0!important;overflow:visible;scroll-margin-top:94px;isolation:isolate}
 .section .layer,.section .w980,.section .layer .w980{position:relative!important;min-width:0!important;width:100%!important;max-width:none;height:auto!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;margin:0!important}
 .section .w980{padding:48px var(--j-gutter)}
 .section h1,.section h2,.section h3,.section h4{position:relative!important;width:auto!important;float:none!important;margin:0 0 24px!important;padding:0;line-height:1.16!important;color:inherit;overflow-wrap:break-word}
 .section h1,.section h2,.section h3,.section .h3{font-family:var(--j-display);font-weight:400!important;letter-spacing:-.035em}
 .section h1,.section h2{font-size:clamp(32px,8.3vw,48px)!important}
 .section h3{font-size:29px!important}
 .section h4{font:400 16px/1.7 var(--j-body)}
 .section p{font-family:var(--j-body);font-size:16px;font-weight:400;line-height:1.8;margin:0 0 22px}
 .section p:last-child{margin-bottom:0}
 .section img{max-width:100%;height:auto!important}
 .section .txt_wrapper,.section .txt,.section .top,.section .btm,.section .col1,.section .col2{width:auto!important;float:none!important;margin:0!important;position:relative!important}
 .section .text_white{color:inherit}
 .section .btn_rect{display:inline-flex;align-items:center;justify-content:center;min-height:50px;height:auto!important;max-width:100%;margin:24px 0 0!important;padding:14px 24px;background:var(--j-blue);background-image:none;color:white;font:600 12px/1.5 var(--j-body);letter-spacing:.08em;text-decoration:none}
 .section a[href^='mailto:'],.section a[href^='tel:']{overflow-wrap:anywhere}
 /* 01: The original coastal photograph, then a calm title page. */
 #s1{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:var(--j-photo) auto;background:var(--j-paper);color:var(--j-ink);padding:0}
 #s1 #section1_bg{position:absolute!important;inset:0 0 auto!important;height:var(--j-photo)!important;background-size:auto 140%;background-position:63% top}
 #s1>.hero-logo-layer{grid-column:1;grid-row:1;align-self:start;z-index:1}
 #s1>.hero-copy-layer{grid-column:1;grid-row:2;background:var(--j-paper)}
 #s1 #section1_logo{padding:22px var(--j-gutter)}
 #s1 #logo{width:150px;background:var(--j-white);padding:10px 12px;line-height:1}
 #s1 #section1_content{padding:34px var(--j-gutter) 46px}
 #s1 h1{max-width:15ch!important;margin-bottom:20px!important;font-size:clamp(36px,9.6vw,54px)!important;line-height:1.12}
 #s1 #section1_content_div{max-width:32ch;width:auto;font:400 16px/1.65 var(--j-body);color:var(--j-muted)}
 /* 02: Location photography and generous story text. */
 #s2{background:var(--j-white)}
 #s2 .layer_bg{display:none}
 #s2 #section_2_bg img,#s3 #section_3_bg img{display:block;width:100%;height:clamp(240px,64vw,430px)!important;object-fit:cover;object-position:center}
 #s2 #section_2_txt{background:var(--j-white)}
 #s2 #section_2_txt .w980{padding-top:44px;padding-bottom:52px}
 /* 03: Borderless location features with every description intact. */
 #s3{background:var(--j-blue);color:var(--j-white);padding-bottom:4px}
 #s3 .layer.left{padding:0 var(--j-gutter) 28px}
 #s3 .item{display:block;height:auto!important;width:100%;margin:0!important;padding:32px 0;border-top:1px solid #ffffff35;background:none;color:inherit;text-decoration:none}
 #s3 .item .bg_opacity,#s3 .item .item_btn{display:none}
 #s3 .item .item_inner{display:block;padding:0}
 #s3 .item .item_inner>.left,#s3 .item .item_inner>.right{display:block!important;float:none;width:auto!important}
 #s3 .item .item_inner .left img{display:block;width:195px;height:165px!important;object-fit:cover;margin:0 0 25px}
 #s3 .item .item_inner .left .h3{display:none}
 #s3 .item .item_inner .right .h3{display:block;padding:0;margin:0 0 16px;font-size:30px;line-height:1.2;color:inherit}
 #s3 .item .item_inner .txt_wrapper{float:none;width:auto;font:400 16px/1.8 var(--j-body);color:#eef1f1}
 /* 04: Every architectural image, as a quiet editorial collection. */
 #s4{background:var(--j-paper)}
 #s4 .layer.bg{display:none}
 #s4 .layer.text .right,#s4 .layer.text .left{float:none;margin:0!important;width:auto}
 #s4 .layer.text .right .btm p,#s4 .layer.text .right .btm a{float:none}
 #s4 .layer.text .btm{padding-top:28px}
 #s4 .layer.image .w980{padding-top:0}
 #s4 .bg_image{display:block;position:relative!important;width:100%!important;height:150px!important;left:auto!important;margin:0 0 28px!important;background-size:contain;background-position:center;background-repeat:no-repeat}
 #s4 .layer.image ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px;align-items:center;padding:0;margin:0}
 #s4 .layer.image ul li{min-width:0;list-style:none;text-align:center}
 #s4 .layer.image ul li img{position:relative!important;inset:auto!important;margin:0!important;width:auto;max-width:100%;object-fit:contain;max-height:170px}
 /* 05: Larger photography, open gutters and an asymmetric gallery rhythm. */
 #s5{background:var(--j-white)}
 #s5 .layer.bg{display:none}
 #s5 .txt_wrapper div{width:auto!important;margin:0!important}
 #s5 .layer:last-child .w980{padding-top:0}
 #s5 .layer ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start;padding:0;margin:0}
 #s5 .layer ul li{min-width:0;list-style:none}
 #s5 .layer ul li:first-child,#s5 .layer ul li:nth-child(4){grid-column:1/-1}
 #s5 .layer ul li .thumb{position:relative!important;display:block;width:100%!important;height:auto!important;margin:0!important}
 #s5 .layer ul li .thumb .img{position:relative!important;display:block;width:100%;height:auto!important}
 #s5 .zoom_bg,#s5 .zoom_img{display:none}
 /* 06: Personal introduction, framed portrait and clear existing details. */
 #s6{background:var(--j-paper)}
 #s6 .layer.bg{display:none}
 #s6_img2 .w980{padding-top:40px;padding-bottom:0;text-align:center}
 #s6 .image_2{position:relative;display:block;margin:0 auto!important;width:min(82%,320px)}
 #s6 .txt_wrapper img{display:block;max-width:180px;margin-top:26px}
 #s6 .johanne-portrait{display:block}
 #s6 .johanne-portrait .image_2{aspect-ratio:1;object-fit:contain}
 #s6 h3{margin-top:34px!important;font-size:28px!important}
 #s6 h4{margin-bottom:10px!important}
 #s6 h4 a{display:inline-block;min-height:44px;padding:8px 0;color:var(--j-blue);text-underline-offset:4px}
 /* 07: Retain the illustrations and give both languages equal breathing room. */
 #s7{background:#ece7dd;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:clamp(330px,94vw,510px) auto;--scene-background-y:0px;--scene-foreground-y:0px}
 #s7 #s7_bgKeuken{display:block;grid-area:1/1;align-self:center;justify-self:center;width:calc(100% - var(--j-gutter)*2)!important;height:clamp(205px,61vw,340px)!important;min-width:0!important;background-position:center!important;background-size:cover;margin:22px 0 0!important;border:1px solid #fff9;box-shadow:0 10px 26px #20323b0c;transform:translate3d(0,var(--scene-background-y),0)!important;pointer-events:none}
 #s7 #s7_bgWijn{display:block;grid-area:1/1;align-self:center;justify-self:center;width:min(84%,440px)!important;height:clamp(290px,84vw,440px)!important;min-width:0!important;background-size:contain;background-position:center!important;background-repeat:no-repeat;margin:0!important;mix-blend-mode:multiply;transform:translate3d(0,var(--scene-foreground-y),0)!important;pointer-events:none;z-index:1}
 #s7 #s7_txt{grid-area:2/1;z-index:2}
 #s7.mobile-scene-moving #s7_bgKeuken,#s7.mobile-scene-moving #s7_bgWijn{will-change:transform}
 #s7 .txt p+p{border-top:1px solid var(--j-rule);padding-top:28px;margin-top:28px}
 /* 08: Spacious next-home story with the complete original image pair. */
 #s8{background:var(--j-white)}
 #s8 .layer.bg{display:none}
 #s8 .row1{margin:0}
 #s8 .col2{padding-top:28px}
 #s8 .col2 a{display:block}
 #s8 .col2 img{display:block;position:relative!important;inset:auto!important;max-width:100%;width:100%;margin:0 0 18px!important}
 #s8 .col2 .txt_spacer{margin:28px 0 0!important}
 /* 09: Deep blue contact page; original map and social destination remain. */
 #s9{background:var(--j-blue);color:var(--j-white)}
 #s9 #section_9_bg{height:220px!important;background-size:cover;background-position:center}
 #s9 #s9_bg{position:relative;width:100%;height:auto;margin:0;padding-bottom:20px;background:var(--j-blue)}
 #s9 #column_1,#s9 #column_2,#s9 #column_btm_1,#s9 #column_btm_2{float:none!important;width:auto!important;margin:0!important;background:none!important}
 #s9 #column_1{padding-bottom:34px;border-bottom:1px solid #ffffff35}
 #s9 #column_2{padding-top:34px}
 #s9 #column_2 p{margin:0!important;font:400 25px/1.5 var(--j-display)!important;letter-spacing:-.02em}
 #s9 #s9_bg ul{margin:0;padding:0}
 #s9 #s9_bg ul li{font:400 16px/1.8 var(--j-body)}
 #s9 #s9_bg ul li a{display:inline-block;min-height:44px;padding:8px 0;color:white;text-underline-offset:4px}
 #s9 #s9_bg .mymap{height:auto}
 #s9 #s9_bg .mymap .w980{padding-top:0;padding-bottom:0}
 #s9 #shadow{display:none!important}
 #s9 #s9_bg .mymap #map_holder{position:relative;bottom:auto;width:100%;height:auto;overflow:visible}
 #s9 #map_holder #btn_map{display:block;position:relative;width:auto;height:auto;margin:0;padding:12px 0;min-height:44px;background:none;color:white;font:400 20px/1.5 var(--j-display)}
 #s9 #s9_bg .mymap #map_holder #map{width:100%!important;height:300px!important;top:auto;position:relative;margin:0;border:0;scroll-margin-top:110px}
 #s9 #map_holder #btn_map .arrow{display:none}
 #s9 #s9_bg .btm #column_btm_1 a.facebook_logo{width:auto;height:auto;float:none;margin:0 0 24px;min-height:56px;padding:4px 0 4px 52px;max-width:100%;font:400 16px/1.65 var(--j-body);background-size:34px;background-position:left 4px;color:white}
 #s9 .btm #column_btm_2 ul{margin:0!important;padding:22px 0 0!important;border-top:1px solid #ffffff35}
 #lightbox,#outerImageContainer,#imageDataContainer{max-width:100vw!important}
 #lightboxImage{max-width:calc(100vw - 40px);height:auto!important}
 .mobile-photo-viewer{width:calc(100% - 24px);max-width:760px;max-height:calc(100svh - 24px);margin:auto;padding:14px;border:0;background:var(--j-white);color:var(--j-ink);overflow:auto;box-shadow:0 12px 60px #0005}
 .mobile-photo-viewer::backdrop{background:#0b1822e8}
 .mobile-photo-viewer .photo-toolbar{display:flex;justify-content:flex-end;margin-bottom:12px}
 .mobile-photo-viewer figure{margin:0}
 .mobile-photo-viewer img{display:block;width:100%;height:calc(100svh - 210px);max-height:650px;object-fit:contain;background:var(--j-paper)}
 .mobile-photo-viewer figcaption{padding:12px 0;text-align:center;font:400 14px/1.5 var(--j-body)}
 .mobile-photo-viewer .photo-controls{display:flex;justify-content:space-between;gap:14px}
 .mobile-photo-viewer button{min-width:72px;min-height:48px;border:1px solid var(--j-rule);padding:10px 16px;background:var(--j-white);color:var(--j-blue);font:500 14px/1.4 var(--j-body);cursor:pointer}
}
@media(max-width:359px){
 :root{--j-gutter:22px;--j-photo:320px}
 .mobile-navigation{gap:10px}
 .mobile-brand{font-size:15px}
 .mobile-contactbar{gap:8px;grid-template-columns:1fr 1.6fr}
 .mobile-contactbar a{font-size:12px}
 .section .w980{padding-top:40px;padding-bottom:40px}
 #s1 h1{font-size:35px!important}
 #s3 .item .item_inner .left img{margin-bottom:22px}
}
@media(min-width:600px) and (max-width:979px){
 :root{--j-gutter:40px;--j-photo:440px}
 .mobile-navigation{padding-left:40px;padding-right:40px}
 .mobile-menu-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
 .mobile-contactbar{grid-template-columns:1fr 1.65fr;padding-left:max(40px,calc((100% - 620px)/2));padding-right:max(40px,calc((100% - 620px)/2))}
 .section .w980{max-width:820px!important;margin:0 auto!important;padding:60px 40px}
 #s1 #section1_content{padding-top:42px;padding-bottom:52px}
 #s1 h1{max-width:19ch!important;font-size:52px!important}
 #s2 #section_2_txt .w980{padding-top:56px;padding-bottom:60px}
 #s3 .layer.left{padding:0 40px 40px;max-width:820px!important;margin:auto!important}
 #s3 .item{padding:36px 0}
 #s3 .item .item_inner{display:grid;grid-template-columns:195px minmax(0,1fr);gap:32px;align-items:start}
 #s3 .item .item_inner .left img{margin:0}
 #s4 .layer.image ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
 #s5 .layer ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
 #s5 .layer ul li:first-child{grid-column:span 2}
 #s5 .layer ul li:nth-child(4){grid-column:auto}
 #s6{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;padding:26px 16px}
 #s6 .w980{padding:40px 24px}
 #s6 .image_2{width:100%;max-width:320px}
 #s8 .col2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
 #s8 .col2 .txt_spacer{grid-column:1/-1}
}
@media(prefers-reduced-motion:reduce){html,body{scroll-behavior:auto!important}.mobile-skip-link{transition:none}#s7 #s7_bgKeuken,#s7 #s7_bgWijn{transform:none!important;will-change:auto}}
