:root{
  --plas:#12332f; --plas-2:#0d2724; --teal:#1c4a47; --teal-soft:#2f625d;
  --koper:#b9743a; --koper-d:#9c5f2c;
  --riet:#f3ede1; --riet-2:#e8dfcd; --paper:#faf6ee;
  --ink:#20302c; --ink-soft:#5a6b64; --line:#d9cfba; --line-dk:rgba(255,255,255,.16);
  --on-dark:#f3ede1; --on-dark-soft:#b9c6bf;
  --r:14px; --r-sm:9px;
  --s1:4px; --s2:8px; --s3:16px; --s4:24px; --s5:40px; --s6:64px; --s7:96px;
  --wrap:1180px;
  --step-1:clamp(.82rem,.8rem + .1vw,.9rem);
  --step0:clamp(1rem,.97rem + .15vw,1.12rem);
  --step1:clamp(1.2rem,1.1rem + .4vw,1.4rem);
  --step2:clamp(1.5rem,1.3rem + .8vw,2rem);
  --step3:clamp(1.9rem,1.5rem + 1.6vw,2.9rem);
  --step4:clamp(2.2rem,1.7rem + 2.6vw,3.9rem);
  --ease:150ms ease;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:'Spectral',Georgia,serif;font-size:var(--step0);line-height:1.65;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,h4{font-family:'Fraunces',Georgia,serif;font-weight:500;line-height:1.08;letter-spacing:-.01em}
h1{font-size:var(--step4)}
h2{font-size:var(--step3)}
h3{font-size:var(--step1)}
p{max-width:65ch}
a{color:inherit}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--s4)}
.eyebrow{font-family:'Spectral',serif;text-transform:uppercase;letter-spacing:.22em;font-size:var(--step-1);color:var(--koper-d);font-weight:600;margin-bottom:var(--s3)}
.eyebrow.light{color:var(--koper)}
.lead{font-size:var(--step1);color:var(--ink-soft);font-weight:300;line-height:1.5}
.lead.narrow{max-width:60ch}
.muted{color:var(--ink-soft)}

/* nav */
.nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:var(--s3) var(--s4);background:rgba(250,246,238,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.brand{font-family:'Fraunces',serif;font-size:1.35rem;font-weight:600;text-decoration:none;letter-spacing:-.01em}
.nav-links{display:flex;align-items:center;gap:var(--s5)}
.nav-links a{text-decoration:none;font-size:var(--step-1);letter-spacing:.02em;color:var(--ink);transition:color var(--ease)}
.nav-links a:hover{color:var(--koper-d)}
.nav-links a[aria-current=page]{color:var(--koper-d)}
.nav-links a:focus-visible{outline:3px solid var(--teal-soft);outline-offset:3px}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.nav-toggle span{width:24px;height:2px;background:var(--ink);display:block}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 26px;background:var(--koper);color:#fff;text-decoration:none;border-radius:var(--r-sm);font-family:'Spectral',serif;font-weight:600;font-size:var(--step-1);letter-spacing:.03em;border:1px solid var(--koper);transition:background var(--ease),transform var(--ease);min-height:44px}
.btn:hover{background:var(--koper-d);border-color:var(--koper-d)}
.btn:focus-visible{outline:3px solid var(--teal-soft);outline-offset:2px}
.btn-sm{padding:9px 16px;min-height:auto}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn-ghost:hover{background:var(--riet);border-color:var(--ink-soft)}
.btn-light{background:var(--riet);color:var(--plas);border-color:var(--riet)}
.btn-light:hover{background:#fff;border-color:#fff}
.btn-outline-light{background:transparent;color:var(--on-dark);border-color:var(--line-dk)}
.btn-outline-light:hover{background:rgba(255,255,255,.08)}

.link-arrow{display:inline-block;text-decoration:none;font-weight:600;color:var(--koper-d);border-bottom:1px solid currentColor;padding-bottom:2px;transition:opacity var(--ease)}
.link-arrow::after{content:' \2192'}
.link-arrow:hover{opacity:.7}
.link-arrow.light{color:var(--koper)}

/* hero */
.hero{position:relative;min-height:min(88vh,760px);display:flex;align-items:flex-end;color:var(--on-dark)}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,39,36,.15) 0%,rgba(13,39,36,.35) 45%,rgba(13,39,36,.86) 100%)}
.hero-inner{position:relative;max-width:var(--wrap);width:100%;margin-inline:auto;padding:var(--s4) var(--s4) var(--s6)}
.hero h1{max-width:16ch;margin-bottom:var(--s3);text-shadow:0 2px 20px rgba(0,0,0,.3)}
.hero .lead{color:var(--on-dark);max-width:52ch;margin-bottom:var(--s4);font-weight:400}
.hero-actions{display:flex;flex-wrap:wrap;gap:var(--s3)}

/* strip */
.strip{background:var(--plas);color:var(--on-dark);display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4);padding:var(--s5) var(--s4);text-align:center}
.strip-item{display:flex;flex-direction:column;gap:6px}
.strip-item .num{font-family:'Fraunces',serif;font-size:var(--step2);color:var(--koper);font-weight:600}
.strip-item span:last-child{font-size:var(--step-1);color:var(--on-dark-soft)}

/* split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6);align-items:center;padding-block:var(--s7)}
.split-media img{width:100%;aspect-ratio:5/4;object-fit:cover;border-radius:var(--r)}
.split-body h2{margin-bottom:var(--s3)}
.split-body p{margin-bottom:var(--s4)}
.ticks{list-style:none;padding:0;margin:0 0 var(--s4)}
.ticks li{position:relative;padding-left:26px;margin-bottom:10px;color:var(--ink-soft)}
.ticks li::before{content:'';position:absolute;left:0;top:9px;width:9px;height:9px;background:var(--koper);border-radius:2px;transform:rotate(45deg)}

.section-head{max-width:60ch;margin-bottom:var(--s5)}
.section-head h2{margin-top:0}

/* aanbod bento */
.aanbod{padding-block:var(--s7)}
.bento{display:grid;grid-template-columns:1fr 1fr 1fr;grid-auto-rows:1fr;gap:var(--s3)}
.card{position:relative;border-radius:var(--r);overflow:hidden;background:var(--teal);color:var(--on-dark);min-height:280px;display:flex}
.card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,39,36,0) 30%,rgba(13,39,36,.9) 100%)}
.card-txt{position:relative;z-index:2;margin-top:auto;padding:var(--s4)}
.card-txt h3{margin-bottom:8px}
.card-txt p{font-size:var(--step-1);color:var(--on-dark-soft);max-width:40ch;margin-bottom:10px}
.card-tall{grid-row:span 2}
.card-wide{grid-column:span 2}

/* band / steps */
.band{background:var(--plas);color:var(--on-dark);padding-block:var(--s7)}
.band .eyebrow{color:var(--koper)}
.band-inner h2{max-width:20ch;margin-bottom:var(--s5)}
.band-inner.center{text-align:center}
.band-inner.center h2{margin-inline:auto}
.steps{list-style:none;padding:0;margin:0 0 var(--s5);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.steps li span{font-family:'Fraunces',serif;font-size:var(--step2);color:var(--koper);display:block;margin-bottom:var(--s2)}
.steps li h3{margin-bottom:8px}
.steps li p{color:var(--on-dark-soft);font-size:var(--step-1)}
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5);text-align:left;margin-top:var(--s2)}
.values h3{margin-bottom:8px}
.values p{color:var(--on-dark-soft);font-size:var(--step-1)}

/* reviews */
.reviews{padding-block:var(--s7)}
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4)}
.review-grid blockquote{margin:0;padding:var(--s4);background:var(--riet);border-radius:var(--r);border-top:3px solid var(--koper)}
.review-grid p{font-family:'Fraunces',serif;font-size:var(--step1);line-height:1.35;margin-bottom:var(--s3)}
.review-grid cite{font-style:normal;font-size:var(--step-1);color:var(--ink-soft);font-weight:600;letter-spacing:.02em}

/* cta */
.cta{background:var(--teal);color:var(--on-dark)}
.cta-inner{text-align:center;padding-block:var(--s7)}
.cta-inner h2{margin-bottom:var(--s3)}
.cta-inner p{color:var(--on-dark-soft);margin:0 auto var(--s4)}
.cta .hero-actions{justify-content:center}

/* footer */
.foot{background:var(--plas-2);color:var(--on-dark);padding-top:var(--s6)}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:var(--s5);padding-bottom:var(--s5)}
.foot h4{color:var(--koper);font-size:var(--step-1);letter-spacing:.1em;text-transform:uppercase;margin-bottom:var(--s3);font-family:'Spectral',serif}
.foot p{font-size:var(--step-1);color:var(--on-dark-soft);line-height:1.8}
.foot a{color:var(--on-dark-soft);text-decoration:none;transition:color var(--ease)}
.foot a:hover{color:var(--koper)}
.foot-brand{font-family:'Fraunces',serif;font-size:var(--step1);color:var(--on-dark)!important;margin-bottom:var(--s2)}
.foot-base{display:flex;justify-content:space-between;padding-block:var(--s4);border-top:1px solid var(--line-dk);font-size:var(--step-1);color:var(--on-dark-soft)}

/* page head */
.page-head{padding-block:var(--s6) var(--s5)}
.page-head h1{margin-bottom:var(--s3)}

/* menu */
.menu-block{padding-block:var(--s5)}
.menu-block.alt{background:var(--riet);border-radius:var(--r);padding:var(--s5)}
.menu-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s3);border-bottom:2px solid var(--line);padding-bottom:var(--s3);margin-bottom:var(--s4)}
.menu-note{font-size:var(--step-1);color:var(--ink-soft);font-style:italic;white-space:nowrap}
.menu-intro{margin-bottom:var(--s4);color:var(--ink-soft);max-width:60ch}
.menu-list{display:flex;flex-direction:column;gap:var(--s3)}
.m-row{display:flex;align-items:baseline;gap:12px}
.m-name{font-size:var(--step0)}
.m-dots{flex:1;border-bottom:1px dotted var(--line);transform:translateY(-4px)}
.m-price{font-family:'Fraunces',serif;font-weight:600;color:var(--koper-d);white-space:nowrap}
.m-price::before{content:'\20AC \2009'}

/* arrangementen */
.arrangementen{padding-block:var(--s6) var(--s7)}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-bottom:var(--s5)}
.price-card{border:1px solid var(--line);border-radius:var(--r);padding:var(--s5) var(--s4);background:var(--paper);position:relative}
.price-card.featured{background:var(--plas);color:var(--on-dark);border-color:var(--plas)}
.price-card.featured .muted{color:var(--on-dark-soft)}
.price-card.featured .ticks li{color:var(--on-dark-soft)}
.price-card h3{margin-bottom:var(--s2)}
.price{font-family:'Fraunces',serif;font-size:var(--step2);color:var(--koper);font-weight:600;margin-bottom:var(--s3)}
.price span{font-size:var(--step-1);color:var(--ink-soft);font-family:'Spectral',serif}
.price-card.featured .price span{color:var(--on-dark-soft)}
.price-card .ticks{margin-top:var(--s3);margin-bottom:0}
.tag{position:absolute;top:-12px;left:var(--s4);background:var(--koper);color:#fff;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;padding:5px 12px;border-radius:20px;font-family:'Spectral',serif;font-weight:600}
.arr-cta{display:flex;flex-wrap:wrap;gap:var(--s3)}

/* editorial (over ons) */
.editorial{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--s6);align-items:center;padding-block:var(--s6)}
.editorial-media img{width:100%;aspect-ratio:6/5;object-fit:cover;border-radius:var(--r)}
.story{display:grid;grid-template-columns:1.6fr 1fr;gap:var(--s6);padding-block:var(--s5) var(--s7)}
.story-col p{margin-bottom:var(--s4)}
.story-facts{display:flex;flex-direction:column;gap:var(--s4);border-left:2px solid var(--koper);padding-left:var(--s4)}
.story-facts .num{font-family:'Fraunces',serif;font-size:var(--step2);color:var(--koper-d);display:block}
.story-facts span:last-child{font-size:var(--step-1);color:var(--ink-soft)}
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);padding-bottom:var(--s7)}
.gallery figure{margin:0}
.gallery img{width:100%;height:100%;object-fit:cover;border-radius:var(--r)}
.g-tall{grid-row:span 2}
.gallery figure:not(.g-tall) img{aspect-ratio:16/11}

/* contact */
.contact-top{display:grid;grid-template-columns:1.5fr 1fr;gap:var(--s6);padding-block:var(--s6)}
.contact-intro h1{margin-bottom:var(--s3)}
.contact-intro .lead{margin-bottom:var(--s5)}
.contact-cards{display:grid;gap:var(--s3)}
.c-card{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);text-decoration:none;padding:var(--s3) var(--s4);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);transition:border-color var(--ease),background var(--ease);min-height:44px}
.c-card:hover{border-color:var(--koper);background:var(--riet)}
.c-card:focus-visible{outline:3px solid var(--teal-soft);outline-offset:2px}
.c-label{font-size:var(--step-1);text-transform:uppercase;letter-spacing:.14em;color:var(--ink-soft)}
.c-value{font-family:'Fraunces',serif;font-size:var(--step1);color:var(--koper-d)}
.contact-info{background:var(--riet);border-radius:var(--r);padding:var(--s5)}
.contact-info h2{font-size:var(--step1);margin-bottom:var(--s3)}
.contact-info h2:nth-of-type(2){margin-top:var(--s4)}
.hours{list-style:none;padding:0;margin:0}
.hours li{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--line);font-size:var(--step-1)}
.hours li:last-child{border-bottom:0}

.map-section{position:relative;height:clamp(300px,46vh,460px);margin-top:var(--s3)}
.map-img{width:100%;height:100%;object-fit:cover}
.map-veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,39,36,.55),rgba(13,39,36,.1))}
.map-pin{position:absolute;left:clamp(16px,5vw,80px);top:50%;transform:translateY(-50%);background:var(--paper);border-radius:var(--r);padding:var(--s4);max-width:300px;box-shadow:0 12px 40px rgba(0,0,0,.25)}
.pin-name{font-family:'Fraunces',serif;font-size:var(--step1);margin-bottom:4px}
.pin-adres{color:var(--ink-soft);font-size:var(--step-1);margin-bottom:var(--s3)}

.bereik{padding-block:var(--s7)}
.bereik-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4)}
.bereik-grid article{padding:var(--s4);border-top:2px solid var(--koper);background:var(--riet);border-radius:0 0 var(--r) var(--r)}
.bereik-num{font-family:'Fraunces',serif;font-size:var(--step2);color:var(--koper-d);display:block;margin-bottom:var(--s2)}
.bereik-grid h3{margin-bottom:8px}
.bereik-grid p{font-size:var(--step-1);color:var(--ink-soft)}

/* responsive */
@media(max-width:900px){
  .split,.editorial,.story,.contact-top{grid-template-columns:1fr;gap:var(--s5)}
  .strip{grid-template-columns:1fr 1fr;gap:var(--s5)}
  .bento{grid-template-columns:1fr 1fr}
  .card-tall{grid-row:span 1}
  .card-wide{grid-column:span 2}
  .steps,.values,.review-grid,.price-grid,.bereik-grid{grid-template-columns:1fr}
  .story-facts{flex-direction:row;flex-wrap:wrap;border-left:0;border-top:2px solid var(--koper);padding-left:0;padding-top:var(--s4);gap:var(--s5)}
  .editorial-media{order:-1}
}
@media(max-width:640px){
  .nav-toggle{display:flex}
  .nav-links{position:fixed;inset:0 0 auto 0;top:60px;flex-direction:column;align-items:flex-start;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:var(--s3) var(--s4) var(--s4);transform:translateY(-120%);transition:transform 220ms ease;box-shadow:0 12px 30px rgba(0,0,0,.1)}
  .nav-links.open{transform:translateY(0)}
  .nav-links a{width:100%;padding:12px 0;font-size:1.05rem;border-bottom:1px solid var(--line)}
  .nav-links .btn{width:100%;margin-top:var(--s3);border-bottom:0}
  .bento{grid-template-columns:1fr}
  .card-wide{grid-column:span 1}
  .strip{grid-template-columns:1fr 1fr;gap:var(--s5) var(--s4);row-gap:var(--s5)}
  .foot-grid{grid-template-columns:1fr 1fr;gap:var(--s5)}
  .foot-grid>div{margin-bottom:var(--s2)}
  .foot-base{flex-direction:column;gap:6px;text-align:center}
  .menu-head{flex-direction:column;gap:6px}
  .menu-note{white-space:normal}
  .menu-block.alt{padding:var(--s4)}
  .map-section{margin-top:var(--s5)}
  .map-pin{left:16px;right:16px;max-width:none}
  .contact-info{margin-top:0}
  .hero{min-height:78vh}
  .steps,.values,.bereik-grid,.review-grid,.price-grid{gap:var(--s4)}
  .gallery{grid-template-columns:1fr}
  .g-tall{grid-row:auto}
  .gallery img,.gallery figure:not(.g-tall) img{aspect-ratio:16/11}
  .hero-actions .btn,.cta .hero-actions .btn{width:100%}
}