/* Casa Designo, concept Dynique. Palet komt uit het huis: kalk, baksteen, druivenblad, kaarslicht. */
:root{
  --kalk:#F6F0E6;--kalk2:#EDE4D4;--kalk3:#E0D4BF;--papier:#FCF9F3;
  --cotto:#A5502C;--cotto-d:#823C1E;--baksteen:#BC6B42;
  --vite:#3D4A2B;--vite-d:#2A3420;
  --notte:#191410;--notte2:#251D16;
  --candela:#EDBB70;
  --ink:#2A2018;--ink2:#5B4D3F;--line:rgba(42,32,24,.17);--line-l:rgba(255,255,255,.24);
  --gutter:clamp(20px,5vw,80px);
  --sec:clamp(72px,9vw,136px);
  --serif:"Young Serif",Georgia,serif;
  --ital:"Newsreader",Georgia,serif;
  --sans:"Manrope",system-ui,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{margin:0;background:var(--kalk);color:var(--ink);font:450 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
:focus-visible{outline:2px solid var(--cotto);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 14px;z-index:99}
.skip:focus{left:8px}
.wrap{width:calc(100% - 2*var(--gutter));max-width:1360px;margin-inline:auto}
.sec{padding-block:var(--sec)}
.oog{font:650 .76rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--cotto-d);display:block;margin-bottom:18px}
.ital{font-family:var(--ital);font-style:italic;font-weight:450}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-.01em;text-wrap:balance}
h1 em,h2 em{font-family:var(--ital);font-style:italic;font-weight:500;letter-spacing:-.018em}
h1{font-size:clamp(2.55rem,5.4vw,5.2rem);line-height:1.05}
h2{font-size:clamp(2rem,3.7vw,3.4rem);line-height:1.1}
h3{font-size:clamp(1.3rem,1.8vw,1.6rem);line-height:1.2}
.lead{font-size:clamp(1.06rem,1.3vw,1.2rem);line-height:1.65;color:var(--ink2);max-width:58ch}
.knop{display:inline-flex;align-items:center;gap:12px;padding:15px 24px;border-radius:999px;font-weight:650;font-size:.95rem;text-decoration:none;transition:background .25s,color .25s,transform .25s var(--ease),border-color .25s;white-space:nowrap}
.knop svg{width:16px;height:16px;transition:transform .3s var(--ease)}
.knop:hover svg{transform:translateX(4px)}
.knop.vol{background:var(--cotto);color:#fff}
.knop.vol:hover{background:var(--cotto-d)}
.knop.kaars{background:var(--candela);color:var(--notte)}
.knop.kaars:hover{background:#f5cb8a}
.knop.lijn{border:1.5px solid currentColor}
.knop.lijn:hover{background:var(--ink);color:var(--kalk);border-color:var(--ink)}
.knop.lijn.wit:hover{background:#fff;color:var(--ink);border-color:#fff}
.link{display:inline-flex;gap:10px;align-items:center;font-weight:650;text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:3px}
.link svg{width:15px;height:15px;transition:transform .3s var(--ease)}
.link:hover svg{transform:translateX(4px)}

/* laag gewelf: dezelfde lage boog als het plafond van het huis */
.gewelf{border-radius:50%/9% 9% 0 0;overflow:hidden}

/* verschijnen bij in beeld komen */
.js [data-r]{opacity:0;transform:translateY(22px);transition:opacity .75s var(--ease),transform .75s var(--ease);transition-delay:var(--d,0s)}
.js [data-r].in{opacity:1;transform:none}

/* header */
.kop{position:fixed;inset:0 0 auto 0;z-index:40;transition:background .35s,box-shadow .35s,padding .35s;padding-block:16px}
.kop .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:block;flex:none}
.logo img{height:78px;width:auto;transition:height .35s var(--ease)}
.logo .l{display:none}
.nav{display:flex;align-items:center;gap:clamp(18px,2.4vw,36px);font-weight:600;font-size:.95rem}
.nav a{text-decoration:none;position:relative}
.nav>a:not(.knop)::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav>a:not(.knop):hover::after,.nav>a[aria-current=page]::after{transform:scaleX(1)}
.nav .knop{padding:11px 20px}
.kop.op-donker:not(.vast){color:#fff}
.kop.op-donker:not(.vast) .logo .d{display:none}
.kop.op-donker:not(.vast) .logo .l{display:block}
.kop.vast{background:var(--kalk);box-shadow:0 1px 0 var(--line);padding-block:8px}
.kop.vast .logo img{height:60px}
.menu-knop{display:none;width:46px;height:46px;position:relative;z-index:60}
.menu-knop i{position:absolute;left:10px;right:10px;height:2px;background:currentColor;transition:transform .3s,top .3s}
.menu-knop i:first-child{top:18px}.menu-knop i:last-child{top:27px}
.menu-open .menu-knop i:first-child{top:22px;transform:rotate(45deg)}
.menu-open .menu-knop i:last-child{top:22px;transform:rotate(-45deg)}
@media(max-width:900px){
  .logo img{height:62px}.kop.vast .logo img{height:52px}
  .menu-knop{display:block}
  .nav{position:fixed;inset:0;background:var(--notte);color:#fff;flex-direction:column;align-items:flex-start;justify-content:center;padding:0 var(--gutter);gap:22px;font:400 2.1rem/1.2 var(--serif);opacity:0;pointer-events:none;transition:opacity .3s}
  .nav .knop{font:650 1rem var(--sans);padding:15px 24px;margin-top:10px}
  .menu-open .nav{opacity:1;pointer-events:auto}
  .menu-open .kop{color:#fff}
  .menu-open .kop .logo{position:relative;z-index:60}
  .menu-open .kop .logo .d{display:none}.menu-open .kop .logo .l{display:block}
  .menu-open{overflow:hidden}
}

/* hero: de dag op de patio */
.dag{position:relative;height:100svh;min-height:640px;background:var(--notte);color:#fff;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
.dag-beeld{position:absolute;inset:0}
.dag-beeld figure{position:absolute;inset:0;opacity:0;transition:opacity 1.5s ease}
.dag-beeld figure.aan{opacity:1}
.dag-beeld img{width:100%;height:100%;object-fit:cover;transform:scale(1.07);transition:transform 9s linear}
.dag-beeld figure.aan img{transform:scale(1)}
.dag::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(25,20,16,.55) 0,rgba(25,20,16,0) 24%,rgba(25,20,16,0) 38%,rgba(25,20,16,.86) 100%);pointer-events:none}
.dag-tekst{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:space-between;gap:40px;padding-bottom:clamp(22px,3vw,40px)}
.dag-tekst h1{max-width:15.5em;font-size:clamp(2.35rem,4.7vw,4.7rem)}
.dag-acties{display:flex;flex-direction:column;align-items:flex-end;gap:14px;flex:none}
.klok{font-size:.86rem;font-weight:550;opacity:.92;font-variant-numeric:tabular-nums}
.dag-lijn{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.6vw,24px);padding-bottom:clamp(18px,2.4vw,30px)}
.dag-lijn button{text-align:left;display:block;padding-top:13px;position:relative;opacity:.72;transition:opacity .3s}
.dag-lijn button:hover,.dag-lijn button.aan{opacity:1}
.dag-lijn button::before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--line-l)}
.dag-lijn button i{position:absolute;left:0;top:0;height:2px;width:100%;background:var(--candela);transform:scaleX(0);transform-origin:left}
.dag-lijn button.aan i{transform:scaleX(1)}
.dag-lijn .tijd{font-weight:650;font-size:.82rem;font-variant-numeric:tabular-nums;letter-spacing:.03em}
.dag-lijn .wat{display:block;font:italic 450 clamp(1.15rem,1.7vw,1.5rem)/1.2 var(--ital);margin-top:2px}
.dag-lijn .zin{display:block;font-size:.86rem;line-height:1.4;margin-top:4px;max-width:30ch}
@media(max-width:760px){
  .dag-tekst{flex-direction:column;align-items:flex-start;gap:18px}
  .dag-acties{align-items:flex-start}
  .dag-lijn .zin{display:none}
  .dag-lijn{gap:8px}
  .dag-lijn .wat{font-size:1rem}
  .dag-lijn .tijd{font-size:.75rem}
  .klok{display:none}
}

/* intro */
.intro{display:grid;grid-template-columns:7fr 5fr;gap:clamp(32px,6vw,96px);align-items:end}
.intro p+p{margin-top:1em}
.ontwerper{margin-top:26px;display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}
.feiten{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(48px,6vw,84px);border-top:1px solid var(--line)}
.feiten>div{padding:22px 20px 0 0}
.feiten>div+div{padding-left:20px;border-left:1px solid var(--line)}
.feiten b{display:block;font:400 clamp(2rem,3.5vw,3.3rem)/1.05 var(--serif);font-variant-numeric:lining-nums}
.feiten span{font-size:.92rem;color:var(--ink2);display:block;margin-top:6px;max-width:22ch}
@media(max-width:860px){.intro{grid-template-columns:1fr}.feiten{grid-template-columns:1fr 1fr}.feiten>div:nth-child(3){padding-left:0;border-left:0}.feiten>div:nth-child(n+3){border-top:1px solid var(--line);margin-top:22px}}

/* rondgang */
.rond{background:var(--papier)}
.rond-kop{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:clamp(30px,4vw,54px)}
.pijlen{display:flex;gap:10px;flex:none}
.pijlen button{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--ink);display:grid;place-items:center;transition:background .25s,color .25s}
.pijlen button:hover{background:var(--ink);color:var(--kalk)}
.pijlen svg{width:18px;height:18px}
.baan{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(250px,25vw,370px);gap:clamp(14px,1.7vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;padding-inline:max(var(--gutter),calc((100vw - 1360px)/2));scroll-padding-inline:max(var(--gutter),calc((100vw - 1360px)/2));scrollbar-width:none;padding-bottom:6px}
.baan::-webkit-scrollbar{display:none}
.kaart{scroll-snap-align:start;text-decoration:none;display:block}
.kaart .gewelf{aspect-ratio:3/4;background:var(--kalk3)}
.kaart img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.kaart:hover img{transform:scale(1.045)}
.wissel{position:relative}
.wissel .twee{position:absolute;inset:0;opacity:0;transition:opacity .6s ease,transform 1.1s var(--ease)}
.kaart:hover .wissel .twee,.kaart:focus-visible .wissel .twee{opacity:1}
.kaart h3{margin-top:15px;display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.kaart h3 small{font:600 .85rem var(--sans);color:var(--ink2);letter-spacing:0;white-space:nowrap}
.kaart p{font-size:.95rem;color:var(--ink2);margin-top:5px;line-height:1.5}
.kaart.eind{background:var(--cotto);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:28px;border-radius:50%/9% 9% 0 0;aspect-ratio:3/4}
.kaart.eind h3{display:block;margin:0 0 14px}

/* baksteen-band met reviews */
.band{background:var(--cotto);color:#fff;position:relative;overflow:hidden}
.band::before{content:"";position:absolute;inset:0;background:url(spina.svg);opacity:.5}
.band>*{position:relative}
@media(max-width:760px){.pijlen{display:none}}
.rev{display:grid;grid-template-columns:auto 1fr;gap:clamp(30px,6vw,96px);align-items:center;padding-block:clamp(64px,7vw,104px)}
.score b{display:block;font:400 clamp(4rem,8vw,7rem)/.95 var(--serif)}
.score span{font-size:.92rem;font-weight:600;opacity:.95}
.rev-stap{position:relative;min-height:7.2em;font:400 clamp(1.5rem,2.7vw,2.5rem)/1.22 var(--serif)}
.rev-stap blockquote{position:absolute;inset:0;margin:0;opacity:0;transform:translateY(10px);transition:opacity .7s,transform .7s var(--ease)}
.rev-stap blockquote.aan{opacity:1;transform:none}
.rev-stap cite{display:block;font:600 .92rem var(--sans);margin-top:16px}
@media(max-width:760px){.rev{grid-template-columns:1fr}.rev-stap{min-height:11em}}

/* omgeving */
.omg{display:grid;grid-template-columns:5fr 6fr;gap:clamp(32px,6vw,90px);align-items:center}
.omg-rij{margin-top:28px;border-top:1px solid var(--line)}
.omg-rij a{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 2px;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .35s var(--ease),color .25s}
.omg-rij a b{font:400 clamp(1.2rem,1.7vw,1.5rem) var(--serif)}
.omg-rij a span{font-weight:600;font-size:.92rem;color:var(--ink2);white-space:nowrap}
.omg-rij a:hover,.omg-rij a.aan{padding-left:12px;color:var(--cotto-d)}
.omg-beeld{position:relative;aspect-ratio:5/6;background:var(--kalk3)}
.omg-beeld img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity .7s,transform 1.2s var(--ease)}
.omg-beeld img.aan{opacity:1;transform:none}
@media(max-width:860px){.omg{grid-template-columns:1fr}.omg-beeld{aspect-ratio:4/3;order:-1}}

/* calculator op nachtkleur */
.nacht{background:var(--notte);color:#fff}
.nacht .oog{color:var(--candela)}
.reken{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,90px);align-items:end}
.reken .lead{color:rgba(255,255,255,.82)}
.seg{display:inline-flex;border:1.5px solid currentColor;border-radius:999px;padding:3px;gap:2px}
.seg button{padding:8px 16px;border-radius:999px;font-weight:600;font-size:.92rem;transition:background .2s,color .2s}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--kalk)}
.nacht .seg button[aria-pressed=true]{background:var(--candela);color:var(--notte)}
.veld-label{font-size:.82rem;font-weight:650;letter-spacing:.02em;display:block;margin-bottom:8px}
.prijs{font:400 clamp(3rem,6vw,5.2rem)/1 var(--serif);font-variant-numeric:lining-nums}
.prijs small{font:550 .95rem var(--sans);margin-left:8px}
.prijsregel{font-size:.92rem;opacity:.86;margin-top:8px;min-height:2.9em}
.bars{--bar:var(--baksteen);--bar-aan:var(--candela);display:grid;grid-template-columns:repeat(13,1fr);gap:2px;height:210px;align-items:end;position:relative;border-bottom:1px solid var(--line)}
.nacht .bars{border-color:var(--line-l)}
.bars button{height:100%;display:flex;align-items:flex-end;position:relative}
.bars i{display:block;width:100%;max-width:34px;margin-inline:auto;border-radius:4px 4px 0 0;background:var(--bar);transition:height .55s var(--ease),background .2s}
.bars button:hover i{background:color-mix(in srgb,var(--bar) 70%,var(--bar-aan))}
.bars button[aria-pressed=true] i{background:var(--bar-aan)}
.bars-as{display:grid;grid-template-columns:repeat(13,1fr);gap:2px;margin-top:7px;font-size:.74rem;font-weight:600;text-align:center;opacity:.85}
.bars-tip{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:var(--papier);color:var(--ink);padding:5px 9px;border-radius:5px;font-size:.78rem;font-weight:650;white-space:nowrap;display:none;pointer-events:none;z-index:3;box-shadow:0 4px 14px rgba(0,0,0,.2)}
.bars button:hover .bars-tip,.bars button:focus-visible .bars-tip{display:block}
.bars button:nth-child(-n+2) .bars-tip{left:0;transform:none}
.bars button:nth-last-child(-n+3) .bars-tip{left:auto;right:0;transform:none}
@media(hover:none){.bars button:hover .bars-tip{display:none}}
.grafiek-titel{font-size:.86rem;font-weight:600;margin-bottom:26px;display:block}
@media(max-width:860px){.reken{grid-template-columns:1fr}.bars{height:160px}.bars-as{font-size:.62rem}}

/* welkom */
.welkom{display:grid;grid-template-columns:4fr 7fr;gap:clamp(32px,6vw,90px);align-items:center}
.welkom .gewelf{aspect-ratio:4/5}
.welkom img{width:100%;height:100%;object-fit:cover}
.lijst2{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;margin-top:26px}
.lijst2 li{padding:11px 0;border-top:1px solid var(--line);font-weight:550;font-size:.97rem;line-height:1.45}
@media(max-width:760px){.welkom{grid-template-columns:1fr}.welkom .gewelf{max-width:360px}.lijst2{grid-template-columns:1fr}}

/* voet */
.spina-streep{height:18px;background:var(--cotto) url(spina.svg)}
.voet{background:var(--notte);color:#fff;padding-block:clamp(56px,6vw,90px) 28px}
.voet a{text-decoration:none}
.voet-top{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;padding-bottom:clamp(36px,4vw,60px);border-bottom:1px solid var(--line-l)}
.voet-top h2{max-width:13em}
.voet-top .ital{color:var(--candela)}
.voet-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr 1fr;gap:32px;padding-block:clamp(32px,4vw,52px)}
.voet-grid img{height:92px;width:auto}
.voet-grid h4{font:650 .76rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--candela);margin-bottom:12px}
.voet-grid li{margin-bottom:7px;font-size:.96rem}
.voet-grid a:hover{text-decoration:underline}
.voet-onder{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:.82rem;opacity:.72;border-top:1px solid var(--line-l);padding-top:18px}
@media(max-width:760px){.voet-grid{grid-template-columns:1fr 1fr}}

/* vaste knoppen */
.vast-cta{position:fixed;right:clamp(14px,2vw,28px);bottom:clamp(14px,2vw,28px);z-index:30;display:flex;border-radius:999px;overflow:hidden;box-shadow:0 8px 28px rgba(25,20,16,.28);font-weight:650;font-size:.92rem;opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .35s,transform .35s var(--ease)}
.vast-cta.toon{opacity:1;transform:none;pointer-events:auto}
.vast-cta a{text-decoration:none;padding:13px 19px;background:var(--papier);color:var(--ink);transition:background .2s}
.vast-cta a:hover{background:var(--kalk2)}
.vast-cta a.v{background:var(--cotto);color:#fff}
.vast-cta a.v:hover{background:var(--cotto-d)}
@media(max-width:560px){.vast-cta{left:12px;right:12px;bottom:10px}.vast-cta a{flex:1;text-align:center;padding:12px 8px}}

/* subpagina's */
.top{padding-top:clamp(120px,13vw,170px);padding-bottom:clamp(40px,5vw,70px)}
.top h1{max-width:13em;margin-bottom:20px}
.split{display:grid;grid-template-columns:6fr 6fr;gap:clamp(32px,6vw,90px);align-items:center}
.split.boven{align-items:start}
.split .gewelf{aspect-ratio:5/4}
.split img{width:100%;height:100%;object-fit:cover}
@media(max-width:860px){.split{grid-template-columns:1fr}}

/* plattegrond */
.plan-sec{background:var(--papier)}
.plan-kop{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;flex-wrap:wrap;margin-bottom:clamp(26px,3vw,42px)}
.plan-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,4vw,60px);align-items:start}
.plan-veld{position:relative;background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.plan-veld>div{display:none;position:relative}
.plan-veld>div.aan{display:block;transform:scale(1.22);transform-origin:50% 50%}
.plan-veld img{width:100%;height:auto}
.plan-veld svg{position:absolute;inset:0;width:100%;height:100%}
.plan-veld polygon{fill:rgba(165,80,44,0);stroke:transparent;stroke-width:2;cursor:pointer;transition:fill .25s,stroke .25s;outline:none}
.plan-veld polygon:hover,.plan-veld polygon:focus-visible{fill:rgba(165,80,44,.16);stroke:rgba(165,80,44,.7)}
.plan-veld polygon.aan{fill:rgba(165,80,44,.26);stroke:var(--cotto)}
.plan-veld polygon.prive{cursor:default;fill:rgba(42,32,24,.09)}
.plan-veld polygon.prive:hover{fill:rgba(42,32,24,.09);stroke:transparent}
.plan-info .gewelf{aspect-ratio:4/3;background:var(--kalk3)}
.plan-info img{width:100%;height:100%;object-fit:cover}
.plan-info h3{margin:18px 0 4px;font-size:clamp(1.5rem,2.2vw,2rem);display:flex;justify-content:space-between;gap:14px;align-items:baseline}
.plan-info h3 small{font:650 .95rem var(--sans);color:var(--cotto-d);letter-spacing:0;white-space:nowrap}
.plan-info p{color:var(--ink2);font-size:1rem}
.plan-info ul{margin-top:12px}
.plan-info li{padding:8px 0;border-top:1px solid var(--line);font-size:.95rem;font-weight:550}
.kamers{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.kamers button{border:1.5px solid var(--line);padding:7px 13px;border-radius:999px;font-size:.86rem;font-weight:600;transition:all .2s}
.kamers button:hover{border-color:var(--cotto)}
.kamers button.aan{background:var(--cotto);border-color:var(--cotto);color:#fff}
@media(max-width:860px){.plan-grid{grid-template-columns:1fr}}

/* dag en nacht */
.dn{display:grid;grid-template-columns:5fr 6fr;gap:clamp(32px,6vw,90px);align-items:center}
.dn-beeld{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--notte)}
.dn-beeld img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dn-beeld .n{opacity:var(--n,1)}
.dn-regel{display:flex;align-items:center;gap:14px;margin-top:18px;font-weight:600;font-size:.92rem}
.dn-regel input{flex:1;accent-color:var(--candela);height:28px}
@media(max-width:860px){.dn{grid-template-columns:1fr}.dn-beeld{order:-1}}

/* voorzieningen */
.voorz{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,40px)}
.voorz h3{padding-bottom:12px;border-bottom:1.5px solid var(--ink);margin-bottom:6px}
.voorz li{padding:9px 0;border-bottom:1px solid var(--line);font-size:.95rem;line-height:1.45}
.apart{margin-top:clamp(36px,4vw,56px);display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,3vw,44px);align-items:center;background:var(--kalk2);padding:clamp(24px,3vw,40px);border-radius:6px}
.apart b{font:400 clamp(2.4rem,4vw,3.6rem)/1 var(--serif)}
@media(max-width:860px){.voorz{grid-template-columns:1fr 1fr}.apart{grid-template-columns:1fr}}
@media(max-width:520px){.voorz{grid-template-columns:1fr}}

/* galerij */
.filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.filter button{border:1.5px solid var(--ink);padding:8px 16px;border-radius:999px;font-weight:600;font-size:.9rem;transition:all .2s}
.filter button:hover{background:var(--kalk2)}
.filter button[aria-pressed=true]{background:var(--ink);color:var(--kalk)}
.gal{columns:4 240px;column-gap:12px}
.gal button{display:block;width:100%;margin-bottom:12px;break-inside:avoid;overflow:hidden;background:var(--kalk3)}
.gal img{width:100%;height:auto;transition:transform .9s var(--ease)}
.gal button:hover img{transform:scale(1.04)}
.gal button[hidden]{display:none}
.lb{position:fixed;inset:0;background:rgba(25,20,16,.95);z-index:80;display:none;align-items:center;justify-content:center;padding:clamp(12px,3vw,40px)}
.lb.aan{display:flex}
.lb img{max-height:100%;max-width:100%;object-fit:contain}
.lb button{position:absolute;color:#fff;width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.12)}
.lb button:hover{background:rgba(255,255,255,.26)}
.lb svg{width:20px;height:20px}
.lb .x{top:14px;right:14px}.lb .v{left:14px;top:50%;transform:translateY(-50%)}.lb .n{right:14px;top:50%;transform:translateY(-50%)}

/* video-kop piemonte */
.vkop{position:relative;height:82svh;min-height:520px;background:var(--notte);color:#fff;display:flex;align-items:flex-end;overflow:hidden}
.vkop video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vkop::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(25,20,16,.42),rgba(25,20,16,0) 30%,rgba(25,20,16,.68))}
.vkop .wrap{position:relative;z-index:2;padding-bottom:clamp(30px,4vw,56px)}
.vkop .oog{color:var(--candela)}
.vkop p{max-width:52ch;margin-top:12px;font-size:1.06rem}

/* kaart */
.kaart-sec{background:var(--papier)}
.kaart-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,4vw,60px);align-items:start}
.kaart-svg{width:100%;height:auto;display:block;background:var(--kalk2);border-radius:6px}
.kaart-svg .oth{fill:#F3ECDF;stroke:#CFC3AD;stroke-width:.8}
.kaart-svg .pie{fill:#FBF7EF;stroke:#A99C84;stroke-width:1.3}
.kaart-svg .lake{fill:#9DB4B8}
.kaart-svg .riv{fill:none;stroke:#B7C5C5;stroke-width:1.3}
.kaart-svg .regio{font:italic 500 19px var(--ital);fill:#8A7D69;letter-spacing:.14em}
.kaart-svg .route{fill:none;stroke:var(--cotto);stroke-width:2.2;stroke-linecap:round}
.mark{cursor:pointer;transition:opacity .25s}
.mark circle{fill:var(--ink);stroke:#fff;stroke-width:2;transition:r .2s,fill .2s}
.mark .hit{fill:transparent;stroke:none}
.mark text{font:650 15.5px var(--sans);fill:var(--ink);paint-order:stroke;stroke:#FBF7EF;stroke-width:4px;stroke-linejoin:round}
.mark.uit{opacity:.22}
.mark:hover circle.p,.mark.aan circle.p{fill:var(--cotto);r:8}
.mark.aan text{fill:var(--cotto-d)}
.mark.casa circle.p{fill:var(--cotto);r:9}
.mark.casa text{font:400 21px var(--serif);fill:var(--cotto-d)}
.plek .beeld{aspect-ratio:3/2;background:var(--kalk3);overflow:hidden;border-radius:4px}
.plek img{width:100%;height:100%;object-fit:cover}
.plek h3{margin-top:18px;font-size:clamp(1.6rem,2.3vw,2.1rem);display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.plek h3 small{font:650 .95rem var(--sans);color:var(--cotto-d);letter-spacing:0;white-space:nowrap}
.plek p{margin-top:8px;color:var(--ink2)}
.plek .oog{margin:0 0 4px;margin-top:16px}
@media(max-width:860px){.kaart-grid{grid-template-columns:1fr}}

/* seizoenen */
.sz-tabs{display:flex;gap:clamp(18px,3vw,44px);border-bottom:1px solid var(--line);margin-bottom:clamp(26px,3vw,42px);overflow-x:auto}
.sz-tabs button{font:400 clamp(1.3rem,2.2vw,2rem) var(--serif);padding-bottom:12px;position:relative;opacity:.55;transition:opacity .2s;white-space:nowrap}
.sz-tabs button:hover{opacity:.85}
.sz-tabs button[aria-pressed=true]{opacity:1}
.sz-tabs button::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--cotto);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.sz-tabs button[aria-pressed=true]::after{transform:scaleX(1)}
.sz{display:none;grid-template-columns:6fr 5fr;gap:clamp(28px,5vw,76px);align-items:center}
.sz.aan{display:grid;animation:sz .6s var(--ease)}
@keyframes sz{from{opacity:0;transform:translateY(12px)}}
.sz .beeld{aspect-ratio:3/2;overflow:hidden}
.sz img{width:100%;height:100%;object-fit:cover}
.sz h3{font-size:clamp(1.5rem,2.4vw,2.2rem);margin-bottom:10px}
.sz ul{margin-top:16px}
.sz li{padding:9px 0;border-top:1px solid var(--line);font-size:.97rem}
.vanaf{font-weight:650;margin-top:16px;display:block}
@media(max-width:860px){.sz{grid-template-columns:1fr}}

/* accordeons */
.acc{border-top:1px solid var(--line)}
.acc details{border-bottom:1px solid var(--line)}
.acc summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:17px 0;font:400 clamp(1.15rem,1.6vw,1.4rem)/1.25 var(--serif)}
.acc summary::-webkit-details-marker{display:none}
.acc summary i{width:14px;height:14px;position:relative;flex:none}
.acc summary i::before,.acc summary i::after{content:"";position:absolute;left:0;right:0;top:6px;height:2px;background:currentColor;transition:transform .3s}
.acc summary i::after{transform:rotate(90deg)}
.acc details[open] summary i::after{transform:rotate(0)}
.acc .in{padding:0 0 20px;color:var(--ink2);max-width:70ch;font-size:.98rem}
.acc .in p+p,.acc .in ul{margin-top:10px}
.acc .in li{padding:3px 0}
.twee-kol{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(30px,5vw,70px)}
.twee-kol .acc+.acc{border-top:1px solid var(--line)}
@media(max-width:860px){.twee-kol{grid-template-columns:1fr}.twee-kol .acc+.acc{border-top:0}}

/* tarieven */
.tar-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,4vw,70px);align-items:start}
.tar-paneel{background:var(--notte);color:#fff;padding:clamp(24px,3vw,40px);border-radius:6px;position:sticky;top:90px}
.tar-paneel .oog{color:var(--candela)}
.tar-paneel .veld-label{margin-top:18px}
.tar-paneel .seg button[aria-pressed=true]{background:var(--candela);color:var(--notte)}
.tar-regels{margin-top:16px;font-size:.92rem}
.tar-regels div{display:flex;justify-content:space-between;gap:16px;padding:7px 0;border-top:1px solid var(--line-l)}
.melding{font-size:.88rem;background:rgba(237,187,112,.15);padding:10px 12px;border-radius:5px;margin-top:12px;line-height:1.45}
.vink{display:flex;gap:10px;align-items:center;margin-top:14px;font-size:.92rem;font-weight:550}
.vink input{width:18px;height:18px;accent-color:var(--candela)}
table{border-collapse:collapse;width:100%;font-size:.93rem;font-variant-numeric:tabular-nums}
th,td{padding:9px 10px;text-align:right;border-bottom:1px solid var(--line);white-space:nowrap}
th:first-child,td:first-child{text-align:left}
thead th{font-weight:650;font-size:.82rem;border-bottom:1.5px solid var(--ink)}
tbody tr:hover{background:var(--kalk2)}
tbody tr.hoog td:first-child{font-weight:650;color:var(--cotto-d)}
.scroll-x{overflow-x:auto}
.voorw{display:grid;grid-template-columns:repeat(3,1fr);gap:0 clamp(20px,3vw,44px)}
.voorw>div{padding:15px 0;border-top:1px solid var(--line)}
.voorw b{display:block;font-weight:650;font-size:.92rem;margin-bottom:2px}
.voorw span{font-size:.94rem;color:var(--ink2);display:block;line-height:1.5}
@media(max-width:980px){.tar-grid{grid-template-columns:minmax(0,1fr)}.tar-paneel{position:static;order:-1}}
@media(max-width:760px){.voorw{grid-template-columns:1fr}}

/* formulier */
.form{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}
.form label{display:block;font-weight:600;font-size:.86rem}
.form .breed{grid-column:1/-1}
.form input,.form select,.form textarea{width:100%;font:500 1rem var(--sans);padding:12px 13px;margin-top:6px;background:var(--papier);border:1.5px solid rgba(42,32,24,.3);border-radius:5px;color:var(--ink)}
.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-color:var(--cotto)}
.form .check{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:.93rem}
.form .check input{width:18px;height:18px;margin:3px 0 0;flex:none;accent-color:var(--cotto)}
.form-ok{display:none;background:var(--vite);color:#fff;padding:18px 20px;border-radius:5px;font-weight:550;grid-column:1/-1}
.form-ok.aan{display:block}
@media(max-width:560px){.form{grid-template-columns:1fr}}

/* contact */
.contact-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,90px);align-items:start}
.kanaal{display:block;padding:15px 0;border-top:1px solid var(--line);text-decoration:none;transition:padding .3s var(--ease)}
.kanaal:hover{padding-left:10px}
.kanaal small{display:block;font-size:.8rem;font-weight:650;color:var(--ink2)}
.kanaal b{font:400 clamp(1.2rem,1.8vw,1.55rem) var(--serif)}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}}
.bg-kalk2{background:var(--kalk2)}

@media(prefers-reduced-motion:reduce){
  .js [data-r]{opacity:1;transform:none;transition:none}
  .dag-beeld img,.dag-beeld figure{transition:none;transform:none}
  *{scroll-behavior:auto!important}
}