/* greek.tdgdigital.com — "Your passport to Greece". Huisstijl uit hun menukaart 2026: teal #244F4D, salie #708871,
   licht #E3E4E3; papier = de achtergrond van hun evzone-foto (#EDE9E6), zodat de film naadloos in de pagina staat. */
@font-face{font-family:"Display";src:url(/fonts/display.woff2) format("woff2");font-weight:300 700;font-stretch:75% 125%;font-display:swap}
@font-face{font-family:"Tekst";src:url(/fonts/tekst.woff2) format("woff2");font-weight:200 900;font-display:swap}
@font-face{font-family:"Tekst";src:url(/fonts/tekst-i.woff2) format("woff2");font-weight:200 900;font-style:italic;font-display:swap}
@font-face{font-family:"Didot";src:url(/fonts/didot-gr.woff2) format("woff2");unicode-range:U+0370-03FF,U+1F00-1FFF;font-display:swap}
@font-face{font-family:"Didot";src:url(/fonts/didot.woff2) format("woff2");unicode-range:U+0000-00FF,U+2018-201E;font-display:swap}
@font-face{font-family:"Mono";src:url(/fonts/mono.woff2) format("woff2");font-display:swap}
:root{
  --inkt:#244f4d;--diep:#173634;--nacht:#0f2422;--salie:#708871;--salie-d:#55705a;--salie-l:#b9c6b5;
  --papier:#ede9e6;--krijt:#f6f4f2;--licht:#e3e4e3;--steen:#d9d4cf;--rood:#8a4b2f;
  --rand:clamp(1rem,4vw,3.5rem);--kop-h:4.5rem;
  --f-d:"Display",ui-rounded,system-ui,sans-serif;--f-t:"Tekst",system-ui,sans-serif;--f-g:"Didot",Georgia,serif;--f-m:"Mono",ui-monospace,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:var(--kop-h)}
/* Brede schermen (Joost 2026-10-10): het 1440-ontwerp schaalt als geheel mee. Geen vaste px-max-width. */
@media (min-width:1440px){html{font-size:clamp(100%,1.1111vw,200%)}:where(button,input,select,textarea){font-size:.8333rem}}
body{margin:0;background:var(--papier);color:var(--diep);font-family:var(--f-t);font-size:1.0625rem;line-height:1.6;overflow-x:clip}
img,video,svg{display:block;max-width:100%;height:auto}
[hidden]{display:none!important}
::selection{background:var(--inkt);color:var(--licht)}
p,li,dd{hyphens:auto;overflow-wrap:break-word}
h1,h2,h3,h4{hyphens:manual;overflow-wrap:normal;text-wrap:balance;margin:0}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
:focus-visible{outline:2px solid var(--salie);outline-offset:3px}
a[href^=mailto],a[href^=tel]{hyphens:none;overflow-wrap:anywhere}
.skip{position:absolute;left:-9999px}.skip:focus{left:1rem;top:1rem;z-index:99;background:var(--papier);padding:.5rem 1rem}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.klein{font-size:.875rem;opacity:.8}
.lead{font-size:clamp(1.15rem,1.4vw,1.35rem);line-height:1.5}
.groot{font-family:var(--f-d);font-weight:600;font-size:clamp(2.1rem,4.6vw,4.2rem);line-height:1.02;letter-spacing:-.01em;font-stretch:92%}

/* knoppen */
.knop{display:inline-flex;align-items:center;justify-content:center;min-height:3rem;padding:.7rem 1.4rem;border-radius:999px;
  background:var(--inkt);color:var(--licht);font-family:var(--f-d);font-weight:600;font-size:1.05rem;letter-spacing:.02em;text-decoration:none;
  border:2px solid var(--inkt);cursor:pointer;transition:background .2s,color .2s,transform .15s}
.knop:hover{background:var(--diep);border-color:var(--diep)}.knop:active{transform:translateY(1px)}
.knop-lijn{background:transparent;color:var(--inkt)}.knop-lijn:hover{background:var(--inkt);color:var(--licht)}
.knop-licht{background:var(--licht);color:var(--inkt);border-color:var(--licht)}.knop-licht:hover{background:#fff;border-color:#fff;color:var(--diep)}
.knop-klein{min-height:2.75rem;padding:.45rem 1.1rem;font-size:.95rem}
.knop-tekst{background:none;border:0;padding:.6rem 0;min-height:2.75rem;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:.2em;cursor:pointer}

/* boogkop: hun menukaartkoppen op een boog */
.boogkop{font-family:var(--f-d);color:var(--inkt);line-height:1}
.boogkop svg{width:min(100%,22rem);height:auto;overflow:visible}
.boogkop text{font-family:var(--f-d);font-weight:650;font-size:58px;fill:currentColor;letter-spacing:1px;font-stretch:88%}
.boogkop-sub{display:block;font-family:var(--f-d);font-weight:500;font-size:1.25rem;letter-spacing:.02em;margin:.1rem 0 0;text-align:center;width:min(100%,22rem)}
.boogkop-groot svg,.boogkop-groot .boogkop-sub{width:min(100%,34rem)}
.boogkop-groot .boogkop-sub{font-size:clamp(1.25rem,2vw,1.7rem)}

/* ---------------------------------------------------------------- kop */
.kop{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,box-shadow .3s}
.kop.is-vast,.lade-open .kop{background:color-mix(in srgb,var(--papier) 94%,transparent);box-shadow:0 1px 0 rgba(36,79,77,.12)}
.kop-in{display:flex;align-items:center;gap:1.5rem;height:var(--kop-h);padding:0 var(--rand)}
.kop-logo{color:var(--inkt);flex-shrink:0;display:block}
.logo-svg{width:clamp(8.5rem,13vw,11rem);height:auto}
.kop-nav{display:flex;gap:1.6rem;margin-left:auto;font-family:var(--f-d);font-weight:550;font-size:1.02rem;color:var(--inkt)}
.kop-nav a{text-decoration:none;padding:.6rem 0;position:relative}
.kop-nav a::after{content:"";position:absolute;left:0;right:0;bottom:.35rem;height:2px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s}
.kop-nav a:hover::after,.kop-nav a[aria-current]::after{transform:scaleX(1)}
.kop-menu{display:none;flex-shrink:0;width:3rem;height:3rem;border-radius:50%;border:2px solid var(--inkt);background:transparent;cursor:pointer;position:relative;color:var(--inkt)}
.kop-menu i{position:absolute;left:.8rem;right:.8rem;height:2px;background:currentColor;transition:transform .25s}
.kop-menu i:nth-of-type(1){top:1.15rem}.kop-menu i:nth-of-type(2){top:1.6rem}
.kop-menu[aria-expanded=true] i:nth-of-type(1){transform:translateY(.225rem) rotate(45deg)}
.kop-menu[aria-expanded=true] i:nth-of-type(2){transform:translateY(-.225rem) rotate(-45deg)}
.lade{position:fixed;inset:var(--kop-h) 0 0;background:var(--papier);padding:1.5rem var(--rand) 3rem;overflow-y:auto;z-index:49}
.lade nav{display:flex;flex-direction:column;font-family:var(--f-d);font-weight:600;font-size:clamp(1.8rem,8vw,2.6rem);color:var(--inkt);line-height:1.15}
.lade nav a{text-decoration:none;padding:.35rem 0;border-bottom:1px solid rgba(36,79,77,.15)}
.lade-adres{margin-top:2rem;color:var(--inkt)}
@media (max-width:1080px){.kop-nav{display:none}.kop-res{margin-left:auto}.kop-menu{display:block}}
@media (max-width:380px){.kop-in{gap:.6rem}.logo-svg{width:7.4rem}.kop-res{padding:.45rem .8rem}}

main{display:block}
body:not(.body-home) main{padding-top:var(--kop-h)}

/* ---------------------------------------------------------------- 1. de wacht (hero) */
.wacht{position:relative;height:100svh;min-height:36rem;background:var(--papier);overflow:hidden;isolation:isolate}
.wacht-film{position:absolute;inset:0;z-index:-1}
.wacht-video{width:100%;height:100%;object-fit:cover;object-position:50% 100%}
.wacht.is-dreun .wacht-film{animation:dreun .28s cubic-bezier(.3,.7,.4,1)}
@keyframes dreun{0%{transform:translateY(0)}30%{transform:translateY(.35rem)}60%{transform:translateY(-.12rem)}100%{transform:none}}
.wacht-stempel{position:absolute;left:calc(50% + clamp(7rem,13vw,13rem));top:24%;width:clamp(10rem,17vw,16rem);opacity:0;transform:rotate(-12deg) scale(1.5);pointer-events:none}
.wacht-stempel.is-geland{opacity:.92;transform:rotate(-12deg) scale(1);transition:transform .16s cubic-bezier(.2,.9,.3,1.2),opacity .08s}
.wacht-stempel .stempel{width:100%;height:auto;mix-blend-mode:multiply}
.wacht-tekst{position:absolute;left:var(--rand);bottom:clamp(1.5rem,6vh,4rem);max-width:min(26rem,36vw);color:var(--inkt)}
.wacht-merk{font-family:var(--f-d);font-weight:650;font-size:clamp(1.9rem,3.3vw,3.1rem);line-height:.98;margin:0 0 .6rem;font-stretch:90%}
.wacht-merk span{display:block;font-weight:500;font-size:.45em;letter-spacing:.04em;margin-top:.5rem;font-stretch:100%}
.wacht-adres{margin:0 0 1.2rem;font-size:.98rem}
.wacht-knoppen{display:flex;flex-wrap:wrap;gap:.6rem}
.wacht-verder{position:absolute;right:var(--rand);bottom:clamp(1.5rem,6vh,4rem);width:3rem;height:3rem;border-radius:50%;border:2px solid var(--inkt)}
.wacht-verder::after{content:"";position:absolute;left:50%;top:42%;width:.7rem;height:.7rem;border:solid var(--inkt);border-width:0 2px 2px 0;transform:translate(-50%,-50%) rotate(45deg)}
/* stempel-letters */
.stempel text{font-family:var(--f-d)}
.st-ring{font-weight:600;font-size:17px;letter-spacing:2px}
.st-groot{font-weight:700;font-size:32px;letter-spacing:1px;font-stretch:85%}
.st-klein{font-family:var(--f-m)!important;font-size:12.5px;letter-spacing:.5px}
.stempel-rh .st-ring{font-size:19px}.stempel-rh .st-groot{font-size:40px}.stempel-rh .st-klein{font-size:14px}

@media (max-width:700px) and (orientation:portrait){
  .wacht{height:auto;min-height:0;display:flex;flex-direction:column}
  .wacht-film{position:relative;inset:auto;height:min(68svh,36rem);z-index:0}
  .wacht-stempel{left:auto;right:.6rem;top:calc(var(--kop-h) + .2rem);width:8.4rem;z-index:2}
  .wacht-tekst{position:relative;left:auto;bottom:auto;max-width:none;padding:1.2rem var(--rand) 2.4rem}
  .wacht-verder{display:none}
}
@media (orientation:landscape) and (max-height:520px){
  .wacht{min-height:0;height:100svh}
  .wacht-tekst{max-width:36vw;bottom:1rem}.wacht-merk{font-size:1.6rem}.wacht-adres{display:none}
  .wacht-stempel{top:22%;width:8.5rem}.wacht-verder{display:none}
}
@media (min-width:701px) and (max-width:1080px) and (orientation:portrait){
  .wacht{height:auto;min-height:0;display:flex;flex-direction:column}
  .wacht-film{position:relative;inset:auto;height:62svh}
  .wacht-tekst{position:relative;left:auto;bottom:auto;max-width:36rem;padding:1.5rem var(--rand) 3rem}
  .wacht-stempel{left:auto;right:6%;top:30%;width:12rem}
  .wacht-verder{display:none}
}

/* ---------------------------------------------------------------- 2. paspoort */
.paspoort{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(2rem,6vw,6rem);align-items:center;
  padding:clamp(4rem,9vw,8rem) var(--rand);background:var(--papier);overflow:clip}
.paspoort-tekst .groot{color:var(--inkt);margin-bottom:1.5rem}
.paspoort-tekst p{max-width:36rem}
.paspoort-hint{font-family:var(--f-d);font-weight:600;color:var(--salie-d)}
.boekje{--pw:min(21rem,24vw);--ph:calc(var(--pw)*1.42);position:relative;width:calc(var(--pw)*2);height:var(--ph);margin:0 auto;perspective:2200px}
.boekje-blad{position:absolute;top:0;width:var(--pw);height:var(--ph);background:var(--krijt);border-radius:.4rem;padding:1rem 1rem .8rem;
  box-shadow:0 1px 0 rgba(0,0,0,.04),0 20px 40px -24px rgba(15,36,34,.45);overflow:hidden;
  background-image:repeating-radial-gradient(circle at 50% 120%,rgba(112,136,113,.08) 0 1px,transparent 1px 7px)}
.boekje-links{left:0;border-radius:.4rem 0 0 .4rem;opacity:0;transition:opacity .25s}
.boekje-rechts{left:var(--pw);border-radius:0 .4rem .4rem 0;display:flex;flex-direction:column}
.boekje.is-open .boekje-links{opacity:1}
.blad-kop{margin:0 0 .7rem;font-family:var(--f-d);font-weight:600;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--salie-d);border-bottom:1px solid rgba(36,79,77,.2);padding-bottom:.4rem}
.blad-data{display:grid;grid-template-columns:42% 1fr;gap:.8rem;flex:1}
.blad-foto img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:.2rem;filter:saturate(.85)}
.blad-data dl{margin:0;display:flex;flex-direction:column;gap:.35rem}
.blad-data dt{font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--salie-d)}
.blad-data dd{margin:0;font-family:var(--f-m);font-size:.66rem;line-height:1.25;text-transform:uppercase;color:var(--diep)}
.blad-data .handtekening{font-family:var(--f-g);font-size:1.5rem;text-transform:none;line-height:1;color:var(--inkt);transform:rotate(-4deg);transform-origin:left}
.blad-mrz{margin:.6rem 0 0;font-family:var(--f-m);font-size:.56rem;letter-spacing:.05em;line-height:1.5;color:var(--diep);opacity:.75;word-break:break-all}
.blad-stempels{position:relative;height:calc(var(--ph) - 6rem)}
.bs{position:absolute;display:block}
.bs .stempel{width:100%;height:auto;mix-blend-mode:multiply;opacity:.88}
.bs-1{width:62%;left:2%;top:0;transform:rotate(-10deg)}
.bs-2{width:62%;right:0;top:38%;transform:rotate(7deg)}
.bs-3{width:66%;left:4%;bottom:0;transform:rotate(-4deg)}
.blad-klein{position:absolute;left:1rem;right:1rem;bottom:.7rem;margin:0;font-size:.62rem;line-height:1.35;color:var(--salie-d)}
.boekje-kaft{position:absolute;top:0;left:var(--pw);width:var(--pw);height:var(--ph);padding:0;border:0;cursor:grab;transform-origin:0 50%;
  transform-style:preserve-3d;background:none;touch-action:pan-y;z-index:3;color:var(--licht);font:inherit}
.boekje-kaft:active{cursor:grabbing}
.kaft-voor,.kaft-binnen{position:absolute;inset:0;border-radius:0 .5rem .5rem 0}
.kaft-voor{display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:1.6rem 1rem 1.3rem;
  background:var(--inkt);box-shadow:inset 6px 0 10px -6px rgba(0,0,0,.5),0 24px 40px -22px rgba(15,36,34,.7);
  background-image:linear-gradient(100deg,rgba(255,255,255,.05),transparent 40%),repeating-linear-gradient(45deg,rgba(255,255,255,.025) 0 2px,transparent 2px 5px)}
.kaft-land{font-family:var(--f-g);font-size:1rem;letter-spacing:.04em;color:var(--salie-l)}
.kaft-voor .mascot{width:40%;height:auto;color:var(--salie-l)}
.kaft-titel{font-family:var(--f-d);font-weight:600;font-size:1.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--salie-l)}
.kaft-sub{font-family:var(--f-d);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--salie-l);opacity:.8}
.kaft-binnen{display:none;background:var(--krijt);border-radius:.5rem 0 0 .5rem;align-items:flex-end;justify-content:center;padding:1rem}
.kaft-binnen span{font-family:var(--f-d);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--salie);transform:scaleX(-1)}
.boekje-kaft.is-om .kaft-voor{display:none}.boekje-kaft.is-om .kaft-binnen{display:flex}
.boekje-kaft.is-weg{visibility:hidden}
.boekje.is-hint .boekje-kaft{animation:hint 1.3s ease-in-out}
@keyframes hint{0%,100%{transform:rotateY(0)}40%{transform:rotateY(-24deg)}}
.boekje-dicht{display:block;margin:1rem auto 0;visibility:hidden}
.boekje.is-open + .boekje-dicht{visibility:visible}
@media (max-width:900px){
  .paspoort{grid-template-columns:1fr}
  .boekje{--pw:min(21rem,calc(100vw - 2*var(--rand)));width:var(--pw);height:auto;min-height:var(--ph);display:flex;flex-direction:column;gap:1.2rem}
  .boekje-rechts,.boekje-links{position:relative;left:0}
  .boekje-rechts{order:1;border-radius:.4rem}
  .boekje-links{order:2;display:none;border-radius:.4rem}
  .boekje.is-open .boekje-links{display:block}
  .boekje-kaft{left:0;top:0;border-radius:.4rem}
  .boekje-kaft.is-om{opacity:0;transition:opacity .2s}
  .blad-stempels{height:calc(var(--ph) - 5rem)}
}
@media (max-width:900px) and (min-width:600px){.boekje{--pw:24rem}}

/* ---------------------------------------------------------------- 3. de dag */
.dag{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);background:var(--inkt);color:var(--licht);min-height:min(100svh,52rem)}
.dag-beeld{position:relative;overflow:hidden;min-height:24rem;background:var(--nacht)}
.dag-laag{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s}
.dag-laag.is-aan{opacity:1}
.dag-laag[data-laag=dicht]{object-fit:contain;background:var(--papier);padding:8% 10% 0}
.dag[data-stand=dicht] .dag-laag[data-laag=dicht]{filter:brightness(.55)}
.dag-tekst{padding:clamp(3rem,7vw,6rem) var(--rand);display:flex;flex-direction:column;gap:1.1rem}
.dag-kop{font-family:var(--f-d);font-weight:600;font-size:clamp(2rem,3.8vw,3.4rem);line-height:1.02;font-stretch:90%}
.dag-uitleg{margin:0;max-width:32rem;color:var(--salie-l)}
.dag-klok{display:flex;flex-direction:column;gap:.3rem;margin-top:.8rem}
.dag-tijd{font-family:var(--f-d);font-weight:650;font-size:clamp(4rem,9vw,7.5rem);line-height:.9;font-variant-numeric:tabular-nums;letter-spacing:-.02em;font-stretch:85%}
.dag-status{min-height:3.2em;max-width:30rem}
.dag-status strong{font-family:var(--f-d);font-weight:600;font-size:1.25rem;display:block;color:#fff}
.dag-liniaal{position:relative;padding:2.2rem 0 1.8rem;margin-top:.4rem}
.dag-liniaal::before{content:"";position:absolute;left:0;right:0;top:3.35rem;height:.5rem;border-radius:1rem;
  background:linear-gradient(90deg,rgba(255,255,255,.08) var(--open-l),rgba(255,255,255,.22) var(--open-l) var(--open-r),rgba(255,255,255,.08) var(--open-r))}
.dag-banden{position:absolute;inset:0 0 auto;height:3.2rem}
.band{position:absolute;top:.6rem;height:1.9rem;border-left:2px solid var(--salie-l);padding:0 .45rem;font-family:var(--f-d);font-weight:600;font-size:.85rem;
  letter-spacing:.03em;color:var(--salie-l);white-space:nowrap;overflow:hidden;text-overflow:clip}
.band-d{border-color:#d9a38a;color:#e8c2b0}
.dag[data-stand=ontbijt] .band-o,.dag[data-stand=diner] .band-d{color:#fff;border-color:#fff}
.dag-schuif{-webkit-appearance:none;appearance:none;position:relative;z-index:2;width:100%;height:3.4rem;margin:0;background:none;cursor:pointer;touch-action:pan-y}
.dag-schuif::-webkit-slider-runnable-track{height:3.4rem;background:none}
.dag-schuif::-moz-range-track{height:3.4rem;background:none}
.dag-schuif::-webkit-slider-thumb{-webkit-appearance:none;width:3rem;height:3rem;margin-top:.2rem;border:0;border-radius:50%;background:url(/img/pompon.svg) center/contain no-repeat;cursor:grab}
.dag-schuif::-moz-range-thumb{width:3rem;height:3rem;border:0;border-radius:50%;background:url(/img/pompon.svg) center/contain no-repeat;cursor:grab}
.dag-schuif:focus-visible{outline:none}
.dag-schuif:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--salie-l)}
.dag-uren{position:relative;height:1.2rem;font-family:var(--f-m);font-size:.72rem;color:var(--salie-l)}
.dag-uren span{position:absolute;transform:translateX(-50%)}
.dag-uren span:first-child{transform:none}.dag-uren span:last-child{transform:translateX(-100%)}
.dag-nu{align-self:flex-start;color:var(--salie-l);padding:0}
.dag-lijst{list-style:none;margin:.6rem 0 0;padding:0;border-top:1px solid rgba(255,255,255,.18);max-width:32rem}
.dag-lijst li{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid rgba(255,255,255,.12);font-family:var(--f-d);font-weight:500;font-size:1.08rem}
.dag-lijst li span:last-child{font-family:var(--f-t);font-variant-numeric:tabular-nums;color:var(--salie-l)}
.dag-link{margin:0}.dag-link a{color:#fff}
@media (max-width:900px){.dag{grid-template-columns:1fr}.dag-beeld{min-height:0;aspect-ratio:4/3}}
@media (min-width:600px) and (max-width:900px){.dag-beeld{aspect-ratio:16/9}}

/* ---------------------------------------------------------------- 4. de deeltafel */
.delen{padding:clamp(4rem,9vw,8rem) var(--rand);background:var(--krijt)}
.delen-kop{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(1.5rem,5vw,5rem);align-items:end;margin-bottom:clamp(2rem,5vw,4rem)}
.delen-kop .lead{max-width:38rem;margin:0}
.delen-werk{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.delen-tafel-wrap{position:sticky;top:calc(var(--kop-h) + 1rem)}
.delen-tafel{position:relative;width:min(100%,38rem);aspect-ratio:1;margin:0 auto}
.tafel-blad{position:absolute;inset:9%;border-radius:50%;background:#e4e0da url(/img/terrazzo.webp) center/cover;
  box-shadow:inset 0 0 0 .5rem #d3cec7,inset 0 0 0 .62rem #c6c0b8,0 2rem 3rem -1.6rem rgba(15,36,34,.45)}
.tafel-stoelen span{position:absolute;left:50%;top:50%;width:13%;height:7%;margin:-3.5% 0 0 -6.5%;border-radius:.9rem .9rem .4rem .4rem;background:var(--inkt);
  transform:rotate(var(--a)) translateX(46.5%) rotate(90deg);transform-origin:50% 50%}
.tafel-stoelen span{transform:rotate(var(--a)) translate(330%) rotate(90deg)}
.tafel-borden{position:absolute;inset:9%;--bord:23%}
.bord{position:absolute;width:var(--bord);aspect-ratio:1;padding:0;border:0;background:none;cursor:pointer;transform:translate(-50%,-50%);
  transition:left .45s cubic-bezier(.3,.8,.3,1),top .45s cubic-bezier(.3,.8,.3,1),width .45s;animation:neerzetten .42s cubic-bezier(.3,.9,.4,1.15) both}
.bord svg{width:100%;height:auto;filter:none}
.bord-rand{fill:#fbfaf8;stroke:rgba(36,79,77,.25);stroke-width:2}
.bord-spiegel{fill:#f1eeea;stroke:var(--inkt);stroke-width:2.4}
.bord-naam{font-family:var(--f-d);font-weight:650;font-size:17px;letter-spacing:.6px;fill:var(--inkt)}
.bord-prijs{font-family:var(--f-d);font-weight:600;font-size:24px;fill:var(--salie-d)}
.bord.is-weg{animation:weg .22s ease-in forwards}
@keyframes neerzetten{0%{opacity:0;transform:translate(-50%,-62%) scale(1.25)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes weg{to{opacity:0;transform:translate(-50%,-50%) scale(.7)}}
.tafel-leeg{position:absolute;inset:0;display:grid;place-items:center;text-align:center;margin:0;font-family:var(--f-d);font-weight:500;color:var(--salie-d);pointer-events:none}
.delen-gasten{display:flex;align-items:center;gap:.8rem;font-family:var(--f-d);font-weight:600;font-size:1.15rem;color:var(--inkt);margin-bottom:1.4rem}
.stap{width:2.9rem;height:2.9rem;border-radius:50%;border:2px solid var(--inkt);background:transparent;color:var(--inkt);font:600 1.4rem/1 var(--f-d);cursor:pointer}
.stap:hover{background:var(--inkt);color:var(--licht)}
.gasten-n{min-width:2ch;text-align:center;font-size:1.8rem;font-variant-numeric:tabular-nums}
.delen-keuze{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem 1.6rem}
.keuze-kop{margin:0 0 .3rem;font-family:var(--f-d);font-weight:600;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:var(--salie-d)}
.keuze{display:flex;justify-content:space-between;gap:.6rem;width:100%;min-height:2.6rem;padding:.4rem 0;border:0;border-bottom:1px solid rgba(36,79,77,.16);
  background:none;font:500 1rem/1.25 var(--f-d);color:var(--diep);text-align:left;cursor:pointer}
.keuze span:last-child{font-family:var(--f-t);font-variant-numeric:tabular-nums;color:var(--salie-d);white-space:nowrap}
.keuze span:first-child::before{content:"";display:inline-block;width:.8rem;height:.8rem;margin-right:.55rem;border-radius:50%;border:2px solid var(--inkt);vertical-align:-.05rem;transition:background .2s}
.keuze[aria-pressed=true] span:first-child::before{background:var(--inkt);box-shadow:inset 0 0 0 2px var(--krijt)}
.keuze:hover span:first-child{text-decoration:underline;text-underline-offset:.2em}
.delen-som{margin-top:2rem;padding-top:1.2rem;border-top:2px solid var(--inkt)}
.som-regel{display:flex;justify-content:space-between;gap:1rem;margin:0;font-family:var(--f-d);font-weight:600;font-size:1.2rem;color:var(--inkt)}
.som-regel strong{font-size:1.6rem}
.som-pp{margin:.1rem 0 1rem;color:var(--salie-d);min-height:1.6em}
.delen-som .knop{margin-right:1rem}
@media (max-width:900px){
  .delen-kop{grid-template-columns:1fr}
  .delen-werk{grid-template-columns:1fr}
  .delen-tafel-wrap{top:var(--kop-h);z-index:3;background:var(--krijt);margin:0 calc(-1*var(--rand));padding:.5rem var(--rand) .6rem;box-shadow:0 1px 0 rgba(36,79,77,.12)}
  .delen-tafel{width:min(62vw,26rem)}
  .delen-werk{gap:1.2rem}
}
@media (max-width:520px){.delen-keuze{grid-template-columns:1fr}.bord-naam{font-size:19px}}

/* ---------------------------------------------------------------- zaal */
.zaal{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto auto auto;gap:clamp(1rem,2vw,2rem);
  padding:clamp(4rem,9vw,8rem) var(--rand);background:var(--papier)}
.zaal figure{margin:0}
.zaal img,.zaal video{width:100%;height:100%;object-fit:cover;border-radius:.3rem}
.zaal-film{grid-column:1/6;grid-row:1/4;min-height:100%}
.zaal-film video{position:relative;height:100%;min-height:36rem}
.zaal-tekst{grid-column:7/13;grid-row:1;align-self:end}
.zaal-tekst .groot{color:var(--inkt);margin-bottom:1.2rem}
.meraki{font-size:1.1rem;color:var(--salie-d)}
.meraki span{font-family:var(--f-g);font-size:2.2rem;color:var(--inkt);margin-right:.3rem;vertical-align:-.2rem}
.zaal-a{grid-column:6/11;grid-row:2;aspect-ratio:3/2}
.zaal-b{grid-column:8/13;grid-row:3;aspect-ratio:3/2;margin-top:-3rem!important}
.zaal-c{grid-column:11/13;grid-row:2;aspect-ratio:2/3}
@media (max-width:900px){
  .zaal{grid-template-columns:repeat(6,minmax(0,1fr))}
  .zaal-tekst{grid-column:1/7;grid-row:1}
  .zaal-film{grid-column:1/4;grid-row:2/4}
  .zaal-a{grid-column:4/7;grid-row:2}
  .zaal-c{display:none}
  .zaal-b{grid-column:4/7;grid-row:3;margin-top:0!important}
}

/* ---------------------------------------------------------------- groep */
.groep{position:relative;display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:clamp(4rem,8vw,7rem) var(--rand);background:var(--salie);color:#fff;overflow:hidden}
.groep-in{max-width:44rem;position:relative;z-index:1}
.groep .groot{margin-bottom:1rem}
.groep .mascot{width:clamp(8rem,16vw,15rem);height:auto;color:rgba(255,255,255,.9);flex-shrink:0}
@media (max-width:700px){.groep{flex-direction:column;align-items:flex-start}.groep .mascot{width:7rem;align-self:flex-end;margin-top:-1rem}}

/* ---------------------------------------------------------------- bezoek */
.bezoek{padding:clamp(4rem,8vw,7rem) var(--rand);background:var(--papier);color:var(--inkt)}
.bezoek .groot{max-width:22ch;margin-bottom:2rem}
.bezoek-rij{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;margin-bottom:2rem;border-top:2px solid var(--inkt);padding-top:1.5rem}
.bezoek-rij p{margin:0}
.bezoek-rij strong{font-family:var(--f-d);font-weight:600;font-size:1.2rem}
@media (max-width:700px){.bezoek-rij{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- voet */
.voet{background:var(--inkt);color:var(--licht)}
.voet-band{height:clamp(5rem,9vw,8rem);background:url(/img/patroon-groen.webp) center/34rem auto repeat;opacity:.9}
.voet-in{display:grid;grid-template-columns:1.3fr repeat(4,minmax(0,1fr));gap:2rem;padding:clamp(3rem,6vw,5rem) var(--rand) 2rem}
.voet-merk{display:flex;flex-direction:column;gap:1.4rem;color:var(--salie-l)}
.voet-merk .logo-svg{width:min(14rem,100%)}.voet-merk .mascot{width:4.5rem}
.voet-kop{font-family:var(--f-d);font-weight:600;font-size:1rem;letter-spacing:.06em;text-transform:uppercase;color:var(--salie-l);margin-bottom:.6rem}
.voet p{margin:0 0 .6rem;font-size:.98rem}
.voet a{color:#fff}
.voet-mrz{font-family:var(--f-m);font-size:clamp(.55rem,1.1vw,.85rem);letter-spacing:.12em;line-height:1.6;padding:0 var(--rand);color:var(--salie-l);opacity:.55;word-break:break-all;margin:0 0 1.5rem!important}
.voet-onder{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem 1.5rem;padding:1.2rem var(--rand) 1.6rem;border-top:1px solid rgba(255,255,255,.15);font-size:.85rem!important;color:var(--salie-l)}
@media (max-width:1080px){.voet-in{grid-template-columns:repeat(2,minmax(0,1fr))}.voet-merk{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between}}
@media (max-width:520px){.voet-in{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- menu-pagina's */
.menu-kop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:min(70svh,40rem);background:var(--papier)}
.menu-kop-tekst{padding:clamp(2.5rem,6vw,5rem) var(--rand);display:flex;flex-direction:column;justify-content:center;gap:1.2rem}
.menu-kop-beeld{position:relative;overflow:hidden;min-height:18rem}
.menu-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.menu-nu{margin:0;color:var(--salie-d);font-weight:500}
.menu-nu .nu-status::before{content:"";display:inline-block;width:.6rem;height:.6rem;border-radius:50%;background:var(--salie);margin-right:.5rem;vertical-align:.05rem}
.menu-nu .nu-status[data-dienst=dicht]::before{background:var(--rood)}
.menu-tabs{display:flex;flex-wrap:wrap;gap:.5rem}
.menu-tabs a{display:inline-flex;align-items:center;min-height:2.75rem;padding:.4rem 1.1rem;border-radius:999px;border:2px solid var(--inkt);color:var(--inkt);text-decoration:none;font-family:var(--f-d);font-weight:600}
.menu-tabs a[aria-current]{background:var(--inkt);color:var(--licht)}
.menu-kaart{background:var(--inkt);color:var(--licht);padding:clamp(3rem,6vw,5rem) var(--rand);columns:2 30rem;column-gap:clamp(2.5rem,6vw,6rem)}
.menu-groep{break-inside:avoid-column;margin-bottom:3rem;display:inline-block;width:100%}
.menu-groep .boogkop{color:var(--salie-l);margin-bottom:.6rem}
.menu-groep .boogkop svg{width:min(100%,19rem)}
.gerechten{list-style:none;margin:0;padding:0}
.gerecht{padding:.75rem 0;border-bottom:1px solid rgba(255,255,255,.12)}
.gerecht-kop{display:flex;align-items:baseline;gap:.6rem}
.gerecht h4{font-family:var(--f-d);font-weight:600;font-size:1.12rem;line-height:1.25;color:#fff;letter-spacing:.01em}
.gerecht-lijn{flex:1;border-bottom:1px dotted rgba(255,255,255,.3);transform:translateY(-.25rem);min-width:1rem}
.gerecht-prijs{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--salie-l);font-weight:500;text-align:right}
.gerecht-prijs small{display:block;font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;opacity:.7;margin-top:-.15rem}
.gerechten-wijn .gerecht-prijs{min-width:4.6rem}
.gerecht p{margin:.2rem 0 0;font-size:.95rem;line-height:1.45}
.gerecht-en{color:var(--licht)}
.gerecht-nl{color:var(--salie-l);font-style:italic;font-size:.88rem!important}
.gerecht-extra{color:#e8c2b0;font-size:.88rem!important}
.gerecht-tags{font-family:var(--f-m);font-size:.68rem!important;letter-spacing:.04em;text-transform:uppercase;color:var(--salie-l);opacity:.85}
.groep-noot{margin:.8rem 0 0;font-family:var(--f-d);color:var(--salie-l)}
.menu-voet{padding:clamp(3rem,6vw,5rem) var(--rand);background:var(--papier);color:var(--inkt)}
.menu-noten{list-style:none;padding:0;margin:0 0 2rem;display:grid;gap:.4rem;font-family:var(--f-d);font-weight:500}
.menu-voet .knop{margin:0 .6rem .6rem 0}
@media (max-width:900px){.menu-kop{grid-template-columns:1fr}.menu-kop-beeld{min-height:0;aspect-ratio:16/10;order:-1}.menu-kaart{columns:1}}

/* ---------------------------------------------------------------- pdf, reserveren, events, contact */
.sober{padding:clamp(3rem,7vw,6rem) var(--rand);min-height:60svh}
.pdf-lijst{list-style:none;padding:0;margin:2rem 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.pdf-lijst a{display:flex;flex-direction:column;gap:.3rem;padding:1.6rem;border:2px solid var(--inkt);border-radius:.5rem;text-decoration:none;color:var(--inkt)}
.pdf-lijst a:hover{background:var(--inkt);color:var(--licht)}
.pdf-kop{font-family:var(--f-d);font-weight:600;font-size:1.6rem}
@media (max-width:700px){.pdf-lijst{grid-template-columns:1fr}}

.visum{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);padding:clamp(3rem,7vw,6rem) var(--rand);align-items:start}
.visum-tekst{display:flex;flex-direction:column;gap:.4rem}
.visum-tekst p{max-width:34rem;margin:.3rem 0}
.visum-formulier{background:var(--krijt);border-radius:.6rem;padding:1rem;box-shadow:0 2rem 3rem -2rem rgba(15,36,34,.45);border:1px solid rgba(36,79,77,.15)}
.visum-label{margin:0 0 .8rem;font-family:var(--f-m);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--salie-d);border-bottom:1px dashed rgba(36,79,77,.35);padding-bottom:.6rem}
.visum iframe{display:block;width:100%;height:40rem;border:0;border-radius:.3rem;background:#fff}
@media (max-width:900px){.visum{grid-template-columns:1fr}}

.ev-kop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);padding:clamp(3rem,7vw,6rem) var(--rand);align-items:center}
.ev-kop figure{margin:0}.ev-kop img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:.4rem}
.ev-kop .knop{margin:.4rem .5rem 0 0}
.ev-soorten,.ev-stappen{padding:clamp(3rem,6vw,5rem) var(--rand)}
.ev-soorten{background:var(--krijt)}
.ev-soorten .groot,.ev-stappen .groot{color:var(--inkt);margin-bottom:2rem}
.ev-soorten ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem 4rem}
.ev-soorten h3,.ev-stappen h3{font-family:var(--f-d);font-weight:600;font-size:1.4rem;color:var(--inkt)}
.ev-soorten li{border-top:2px solid var(--inkt);padding-top:1rem}
.ev-soorten p,.ev-stappen p{margin:.4rem 0 0;max-width:36rem}
.ev-stappen ol{list-style:none;margin:0 0 2rem;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}
.stap-n{display:grid;place-items:center;width:3rem;height:3rem;border-radius:50%;border:2px solid var(--inkt);font:600 1.3rem var(--f-d);color:var(--inkt);margin-bottom:.8rem}
@media (max-width:900px){.ev-kop{grid-template-columns:1fr}.ev-soorten ul,.ev-stappen ol{grid-template-columns:1fr}}
.ev-form{padding:clamp(3rem,6vw,5rem) var(--rand) clamp(4rem,8vw,7rem);background:var(--inkt)}
.aanvraag{position:relative;max-width:56rem;margin:0 auto;background:var(--krijt);color:var(--diep);border-radius:.6rem;padding:clamp(1.5rem,4vw,3rem);
  background-image:repeating-radial-gradient(circle at 50% 130%,rgba(112,136,113,.07) 0 1px,transparent 1px 8px)}
.aanvraag-kop{border-bottom:1px dashed rgba(36,79,77,.35);padding-bottom:1rem;margin-bottom:1.5rem}
.aanvraag-kop h2{font-family:var(--f-d);font-weight:600;font-size:clamp(1.7rem,3vw,2.4rem);color:var(--inkt)}
.velden{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 1.4rem}
.velden label{display:flex;flex-direction:column;gap:.3rem;font-family:var(--f-m);font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;color:var(--salie-d)}
.velden .breed{grid-column:1/-1}
.velden input,.velden select,.velden textarea{font:1rem var(--f-t);color:var(--diep);background:transparent;border:0;border-bottom:2px solid rgba(36,79,77,.35);padding:.55rem .1rem;min-height:2.75rem;border-radius:0;text-transform:none;letter-spacing:0}
.velden input:focus,.velden select:focus,.velden textarea:focus{outline:none;border-bottom-color:var(--inkt);background:rgba(112,136,113,.08)}
.honing{position:absolute!important;left:-9999px}
.aanvraag-melding{min-height:1.6em;margin:1rem 0;font-weight:500}
.aanvraag-stempel{position:absolute;right:6%;bottom:8%;width:min(14rem,40%);opacity:0;transform:rotate(-14deg) scale(1.6);pointer-events:none}
.aanvraag-stempel.is-geland{opacity:.9;transform:rotate(-14deg) scale(1);transition:transform .18s cubic-bezier(.2,.9,.3,1.2),opacity .1s}
.aanvraag-stempel .stempel{width:100%;height:auto;mix-blend-mode:multiply}
@media (max-width:600px){.velden{grid-template-columns:1fr}}

.ct{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);padding:clamp(3rem,7vw,6rem) var(--rand);align-items:start}
.ct-lijst{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem 2rem;margin:2rem 0}
.ct-lijst div{border-top:2px solid var(--inkt);padding-top:.8rem}
.ct-lijst dt{font-family:var(--f-d);font-weight:600;color:var(--inkt);font-size:1.1rem}
.ct-lijst dd{margin:.3rem 0 0}
.ct-beeld{margin:0}.ct-beeld video{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:.4rem}
@media (max-width:900px){.ct{grid-template-columns:1fr}.ct-beeld video{aspect-ratio:4/5}}
@media (max-width:520px){.ct-lijst{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* checkronde 1: tikdoelen, smalle schermen */
.ev-form{overflow:clip}
.ct-lijst dd a{display:inline-block;padding:.5rem 0}
.kop-logo{display:flex;align-items:center;min-height:2.75rem}
.gerecht h4{min-width:0;overflow-wrap:break-word;hyphens:auto}
@media (max-width:420px){.gerecht-kop{flex-wrap:wrap}.gerecht-lijn{display:none}.gerecht-kop .gerecht-prijs:first-of-type{margin-left:auto}}
.visum-stempel{width:min(13rem,50%);margin-top:2rem;transform:rotate(-9deg);opacity:.9}.visum-stempel .stempel{width:100%;height:auto;mix-blend-mode:multiply}
.velden select{-webkit-appearance:none;appearance:none;height:2.9rem;padding-right:2rem;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23244f4d' stroke-width='2'/%3E%3C/svg%3E") right .3rem center/.8rem no-repeat}
