:root{--cloth:#FFFFFF;--paper:#FFFFFF;--band:#F8EEF2;--ink:#1D1A17;--mute:#5F5852;--line:#E6E0D9;--acc:#85284c;--btn:#85284c;--onbtn:#FFFFFF;--shade:rgba(30,22,18,.10);--e-deep:#3a1b25;--e-dye:#683546;--e-line:#825d68;--e-ink:#fdf2f5;--e-mute:#e9d0d6;--e-acc:#f1c7d3}
/* Look S "Tablecloth": fine dining. The site is a table laid for one evening. Everything sits on one centre axis like
   a place setting; the page is the cloth (pure white or a coloured cloth); photos are plates, round and seen from
   above; facts are typeset like a printed menu (names in true small caps, descriptions in italic). Signature devices:
   the place setting (hero), the course line (the tasting menu), the printed menu card, the place card.
   Faces are self-hosted from @fontsource 5.3.0 (OFL, licences in public/fonts): Libre Caslon Display (S's own display
   face on the factory font shortlist), Spectral + Spectral SC, Hanken Grotesk. Caslon Display has no italic, so quotes
   set in the display size use --qf. Every class of this look starts with s-. */
@font-face{font-family:"Caslon S";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/libre-caslon-display-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Caslon S";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/libre-caslon-display-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Spectral S";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/spectral-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Spectral S";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/spectral-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Spectral S";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/spectral-latin-ext-400-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Spectral S";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/spectral-latin-400-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Spectral SC S";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/spectral-sc-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Spectral SC S";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/spectral-sc-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hanken S";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/hanken-grotesk-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Hanken S";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/hanken-grotesk-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hanken S";font-style:italic;font-weight:100 900;font-display:swap;src:url(fonts/hanken-grotesk-latin-ext-wght-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Hanken S";font-style:italic;font-weight:100 900;font-display:swap;src:url(fonts/hanken-grotesk-latin-wght-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* the voice of each pairing: headline face and weight, the small-caps face, the text face and its size */
body{--hf:"Caslon S",Georgia,serif;--hw:400;--ht:0em;--qf:"Spectral S",Georgia,serif;--sc:"Spectral SC S",Georgia,serif;--scw:500;--tf:"Spectral S",Georgia,serif;--ts:calc(17px*var(--tune-size,1))}
body.s-f-bistro{--hf:"Caslon S",Georgia,serif;--hw:400;--ht:0em;--qf:"Spectral S",Georgia,serif;--sc:"Spectral SC S",Georgia,serif;--scw:500;--tf:"Hanken S",system-ui,sans-serif;--ts:calc(17px*var(--tune-size,1))}
:root{--axis:640px;--hh:80px;--gap:clamp(64px,7vw,96px);--m-accent:var(--acc);--g-max:1180px;--g-pad:clamp(20px,5vw,64px);--g-bg:var(--cloth);--g-paper:var(--cloth);--g-surface:var(--paper);--g-ink:var(--ink);--g-muted:var(--mute);--g-line:var(--line);--g-accent:var(--acc);--g-fd:var(--hf);--g-ft:var(--tf);--g-radius:calc(2px*var(--tune-radius,1));--g-top:0px}

/* ---------- base ---------- */
*{box-sizing:border-box;margin:0}
html{scroll-padding-top:24px}
body{background:var(--cloth);color:var(--ink);font:400 var(--ts)/1.6 var(--tf);-webkit-font-smoothing:antialiased;text-align:center}
a{color:inherit}img{display:block;max-width:100%}
ul,ol{list-style:none;padding:0}
.s-wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,5vw,64px)}
h1,h2,h3{font-synthesis:none;font-family:var(--hf);font-weight:var(--hw);letter-spacing:var(--ht);text-wrap:balance}
h1,h2,h3,p,li,dt,dd,a,b,blockquote,figcaption,summary,label{overflow-wrap:anywhere;hyphens:auto}
h1{font-size:calc(clamp(42px,5.6vw,80px)*var(--tune-size,1));line-height:1.04}
h2{font-size:calc(clamp(32px,3.4vw,48px)*var(--tune-size,1));line-height:1.1}
h3{font-size:calc(22px*var(--tune-size,1));line-height:1.25}
:where(main) p{text-wrap:pretty}
/* the menu typesetting: names in true small caps, descriptions in italic */
.s-sc,.s-links,.s-name,.s-courses h3,.s-carte h3,.s-carte h2,.s-mcards h3,.s-who,.s-sign,.s-role,.s-hours dt,.s-qa dt,.s-ev-price,.s-v-col h3,.s-r-title,.s-flegal,.s-foot-name,.s-reach span,.s-cards h2,.s-roll h2,.s-form label,.s-fold summary{font-family:var(--sc);font-weight:var(--scw);letter-spacing:.06em}
.s-kicker,.s-lede,.s-hd p,.s-courses p,.s-carte p,.s-mc-text,.s-k-text,.s-guests blockquote,.s-qa dd,.s-fold p,.s-cards p,.s-roll p{font-style:italic}
body.s-f-bistro :is(.s-kicker,.s-lede,.s-hd p,.s-courses p,.s-carte p,.s-mc-text,.s-k-text,.s-guests blockquote,.s-qa dd,.s-fold p,.s-cards p,.s-roll p){font-weight:350}
.s-kicker{font-size:calc(clamp(17px,1.4vw,20px)*var(--tune-size,1));color:var(--mute)}
.s-lede{font-size:calc(clamp(19px,1.6vw,22px)*var(--tune-size,1));line-height:1.45;color:var(--mute);max-width:34ch;margin-inline:auto;text-wrap:balance}
.s-sec{padding:var(--gap) 0 0}
.s-hd{max-width:var(--axis);margin:0 auto calc(clamp(32px,3.6vw,48px)*var(--tune-space,1))}
.s-hd p{margin-top:12px;color:var(--soft);font-size:calc(19px*var(--tune-size,1))}
/* a short hairline under every section title: the fold of a menu card */
.s-hd h2::after{content:"";display:block;width:40px;height:1px;margin:20px auto 0;background:var(--acc)}
.s-hd:has(p) h2::after{display:none}

/* ---------- buttons and links ---------- */
.s-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 32px;border:0;border-radius:0;background:var(--btn);color:var(--onbtn);font:var(--scw) calc(17px*var(--tune-size,1))/1.2 var(--sc);letter-spacing:.08em;text-decoration:none;cursor:pointer;transition:background-color .2s ease,color .2s ease}
.s-btn:hover{background:var(--ink);color:var(--cloth)}
.s-link{display:inline-flex;align-items:center;min-height:52px;font-style:italic;font-size:calc(19px*var(--tune-size,1));color:var(--ink);text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:1px;text-underline-offset:6px}
.s-link:hover{text-decoration-thickness:2px}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--acc);outline-offset:4px}
.s-cta{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 32px;margin-top:24px}

/* ---------- header: one row on the centre axis, the menu's links · the name · languages and the reserve button ---------- */
.s-head{position:relative;z-index:3;border-bottom:1px solid var(--line)}
.s-over{position:absolute;top:0;left:0;right:0;background:none;border-bottom-color:color-mix(in srgb,var(--ink) 16%,transparent)}
.s-bar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;min-height:var(--hh)}
.s-name{grid-column:2;grid-row:1;font-size:clamp(20px,2vw,26px);line-height:1.2;letter-spacing:.14em;text-decoration:none;padding:4px 0;white-space:nowrap}
.s-name .brand-logo{margin:0 auto}
.s-nav,.s-menu{grid-column:1;grid-row:1;justify-self:start}
.s-links{display:flex;gap:clamp(20px,2.6vw,36px)}
:where(.s-links) a{display:inline-block;padding:10px 0;font-size:calc(16px*var(--tune-size,1));text-decoration:none;color:var(--ink);background:linear-gradient(var(--acc),var(--acc)) no-repeat 50% 100%/0 1px;transition:background-size .25s ease}
:where(.s-links) a:hover,:where(.s-links) a[aria-current]{background-size:100% 1px}
.s-end{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:clamp(16px,2vw,28px)}
.s-end .langs{letter-spacing:.06em}
.s-book{display:inline-flex;align-items:center;min-height:44px;padding:0 22px;border:1px solid currentColor;color:var(--ink);font:var(--scw) 16px/1 var(--sc);letter-spacing:.08em;text-decoration:none;white-space:nowrap;transition:background-color .2s ease,color .2s ease}
.s-book:hover{background:var(--ink);color:var(--cloth)}
.s-menu{display:none}
.s-menu summary{display:inline-flex;align-items:center;min-height:44px;cursor:pointer;list-style:none;font:var(--scw) calc(16px*var(--tune-size,1))/1 var(--sc);letter-spacing:.08em}
.s-menu summary::-webkit-details-marker{display:none}
.s-m-close,.s-menu[open] .s-m-open{display:none}.s-menu[open] .s-m-close{display:inline}
.s-sheet{position:absolute;z-index:4;left:0;right:0;top:100%;padding:4px clamp(20px,5vw,64px) 20px;background:var(--cloth);border-bottom:1px solid var(--line);box-shadow:0 24px 40px -28px var(--shade)}
.s-sheet li{border-bottom:1px solid var(--line)}
:where(.s-sheet) a{display:flex;align-items:center;justify-content:center;min-height:56px;font:var(--scw) calc(20px*var(--tune-size,1))/1.2 var(--sc);letter-spacing:.06em;text-decoration:none}
.s-sheet .langs{justify-content:center;margin-top:12px;font-size:calc(16px*var(--tune-size,1))}
@media(max-width:960px){:root{--hh:64px}.s-bar{gap:10px}.s-nav,.s-book{display:none}.s-menu{display:block}.s-name{font-size:calc(19px*var(--tune-size,1));letter-spacing:.1em}}

/* ---------- the evening cloth: the hero's deep cloth in the palette's hue, the linen photo dyed into it ---------- */
.s-eve,.s-over{--cloth:var(--e-deep);--paper:var(--e-deep);--ink:var(--e-ink);--mute:var(--e-mute);--acc:var(--e-acc);--line:var(--e-line);--btn:var(--e-acc);--onbtn:var(--e-deep);--shade:rgba(0,0,0,.4);color:var(--ink)}
:root,.s-eve{--soft:color-mix(in srgb,var(--mute) 62%,var(--ink))}
.s-eve{position:relative;overflow:clip;background:var(--e-deep)}
.s-cloth{position:absolute;inset:0;background:var(--e-dye)}
.s-cloth img{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply}
:where(.s-eve>:not(.s-cloth)){position:relative}

/* ---------- plates (round photos, seen from above) ---------- */
.s-plate{position:relative;display:block;aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--paper);box-shadow:0 0 0 1px var(--line),0 24px 40px -24px var(--shade)}
.s-plate img{width:100%;height:100%;object-fit:cover;scale:1.06}
.s-plate.s-empty{background:var(--paper);box-shadow:0 0 0 1px var(--line)}
.s-plate.s-empty::after{content:"";position:absolute;inset:22%;border-radius:50%;box-shadow:0 0 0 1px var(--line)}
.s-eve .s-plate{box-shadow:0 0 0 1px rgba(255,255,255,.08),0 48px 90px -36px rgba(0,0,0,.7),0 12px 24px -12px rgba(0,0,0,.4)}

/* ---------- hero "setting": one large plate served on the evening cloth ---------- */
/* the title across the top, the plate on the centre axis running off the fold; the sentence and the button stand where
   the knife and fork would lie, left and right of the plate */
.s-setting{--d:clamp(320px,52vw,760px);padding-top:calc(calc(var(--hh) + clamp(28px,3.4vw,52px))*var(--tune-space,1))}
.s-setting .s-wrap{max-width:1440px}
.s-set{display:grid;grid-template-columns:minmax(0,1fr) var(--d) minmax(0,1fr);grid-template-areas:"hd hd hd" "l dish r";column-gap:clamp(24px,2.4vw,32px)}
.s-set-hd{grid-area:hd}
.s-setting h1{margin-top:10px;font-size:calc(clamp(44px,7.6vw,112px)*var(--tune-size,1));line-height:.95}
.s-setting .s-lede{grid-area:l;justify-self:end;align-self:start;max-width:15em;margin:calc(clamp(96px,10vw,150px)*var(--tune-space,1)) 0 0;text-align:right;font-size:calc(clamp(19px,1.5vw,21px)*var(--tune-size,1))}
.s-setting .s-cta{grid-area:r;flex-direction:column;align-items:flex-start;justify-content:flex-start;align-self:start;gap:4px;margin-top:calc(clamp(84px,9vw,138px)*var(--tune-space,1))}
.s-dish{grid-area:dish;margin:calc(clamp(28px,3vw,40px)*var(--tune-space,1)) 0 calc(var(--d) * -.3)}
@media(max-width:1200px){
  .s-setting{--d:min(118vw,640px)}
  .s-set{grid-template-columns:minmax(0,1fr);grid-template-areas:"hd" "l" "r" "dish"}
  .s-setting .s-lede{justify-self:center;max-width:30ch;margin-top:18px;text-align:center}
  .s-setting .s-cta{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;justify-self:center;gap:0 24px;margin-top:18px}
  .s-dish{width:var(--d);justify-self:center;margin-top:24px}
}

/* ---------- hero "menu": the evening's courses set straight on the cloth between two plates that run off the edges ---------- */
.s-hmenu{--p:clamp(320px,46vw,720px);display:grid;align-items:center;min-height:clamp(640px,100svh,940px);padding:calc(var(--hh) + 32px) 0 calc(56px*var(--tune-space,1))}
.s-hm-side{position:absolute;top:calc(50% + var(--hh) / 2 - var(--p) / 2);width:var(--p)}
.s-hm-l{left:calc(var(--p) * -.4)}
.s-hm-r{right:calc(var(--p) * -.4)}
.s-hm-body{z-index:1;width:100%;max-width:calc(100vw - var(--p) * 1.2 - 32px)}
.s-hmenu h1{margin-top:10px;font-size:calc(clamp(44px,6.4vw,100px)*var(--tune-size,1));line-height:.95}
.s-hmenu .s-lede{margin-top:22px;font-size:calc(19px*var(--tune-size,1))}
.s-hmenu .s-cta{margin-top:28px}
@media(max-width:1000px){
  .s-hmenu{--p:min(64vw,420px);display:block;min-height:0;padding:calc(var(--hh) + var(--p) + 16px) 0 calc(48px*var(--tune-space,1))}
  .s-hm-side{top:calc(var(--hh) + 8px)}
  .s-hm-l{left:calc(var(--p) * -.22)}.s-hm-r{right:calc(var(--p) * -.22)}
  .s-hm-body{max-width:none}
}
@media(max-width:600px){.s-hmenu .s-lede{display:none}.s-hmenu .s-cta{margin-top:22px}}

/* ---------- cards (paper standing on the cloth) ---------- */
.s-card{position:relative;background:var(--paper);box-shadow:0 1px 0 var(--line),0 30px 60px -36px var(--shade),0 0 0 1px color-mix(in srgb,var(--line) 60%,transparent)}
/* the place card: a folded card, the crease a third of the way down */
.s-place{--crease:26px;max-width:560px;margin:0 auto;padding:calc(calc(var(--crease) + clamp(32px,3.4vw,44px))*var(--tune-space,1)) clamp(24px,4vw,56px) calc(clamp(36px,4vw,48px)*var(--tune-space,1));background:linear-gradient(to bottom,color-mix(in srgb,var(--line) 45%,var(--paper)) 0,color-mix(in srgb,var(--line) 12%,var(--paper)) var(--crease),var(--paper) var(--crease))}
.s-place::before{content:"";position:absolute;left:0;right:0;top:var(--crease);height:1px;background:var(--line)}
.s-place h2{font-size:calc(clamp(30px,3vw,42px)*var(--tune-size,1))}
.s-place>p{margin-top:14px;color:var(--mute);font-style:italic}
.s-place .s-btn{margin-top:28px}

/* ---------- the course line: the tasting menu ---------- */
.s-courses{--cp:clamp(90px,9vw,176px);position:relative;max-width:clamp(880px,62vw,1240px);margin:0 auto;display:grid;gap:clamp(18px,2.4vw,28px)}
.s-courses::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;margin-left:-.5px;background:var(--line)}
.s-course{position:relative;display:grid;grid-template-columns:minmax(0,1fr) var(--cp) minmax(0,1fr);align-items:center;column-gap:clamp(24px,3.6vw,64px)}
.s-c-plate{grid-column:2;grid-row:1;width:var(--cp)}
/* a course served without a photo: a small dot on the axis */
.s-c-dot{grid-column:2;grid-row:1;justify-self:center;width:9px;height:9px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 8px var(--cloth)}
.s-plain .s-c-text{padding-block:12px}
.s-c-text{grid-row:1;grid-column:1;text-align:right}
.s-course:nth-child(even) .s-c-text{grid-column:3;text-align:left}
.s-courses h3{font-family:var(--sc);font-size:calc(clamp(22px,1.6vw,30px)*var(--tune-size,1))}
.s-courses p{margin-top:4px;color:var(--soft);font-size:calc(clamp(18px,1.2vw,22px)*var(--tune-size,1));line-height:1.45}
.s-ev-price{margin-top:calc(clamp(36px,4vw,52px)*var(--tune-space,1));font-size:calc(20px*var(--tune-size,1));color:var(--acc)}
@media(max-width:720px){
  .s-courses::before{left:48px}
  .s-course,.s-course:nth-child(even){grid-template-columns:96px minmax(0,1fr);column-gap:22px}
  .s-c-plate{grid-column:1;width:96px}
  .s-c-dot{grid-column:1}
  .s-c-text,.s-course:nth-child(even) .s-c-text{grid-column:2;text-align:left}
}

/* ---------- offers: the printed menu card, or one tall card per menu ---------- */
.s-band{margin-top:var(--gap);padding-bottom:calc(clamp(72px,8vw,112px)*var(--tune-space,1));background:var(--band)}
.s-carte{max-width:560px;margin:0 auto;padding:calc(clamp(36px,4vw,56px)*var(--tune-space,1)) clamp(24px,4vw,56px)}
.s-carte li+li{margin-top:28px;padding-top:28px;background:linear-gradient(var(--line),var(--line)) no-repeat 50% 0/32px 1px}
.s-carte h3,.s-carte h2{font-size:calc(23px*var(--tune-size,1));line-height:1.25}
.s-carte p{margin-top:4px;color:var(--mute);font-size:calc(18px*var(--tune-size,1));line-height:1.45}
.s-carte .s-price,.s-meta{margin-top:8px;font-style:normal;color:var(--acc);font-size:calc(18px*var(--tune-size,1));font-variant-numeric:oldstyle-nums}
.s-meta{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 24px}
.s-meta span+span{color:var(--mute);font-style:italic}
.s-meta .s-price{margin:0}
.s-more{margin-top:28px}
.s-mcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(20px,2.4vw,32px);max-width:1040px;margin:0 auto}
.s-mcards li{display:flex;flex-direction:column;align-items:center;padding:calc(clamp(32px,3vw,44px)*var(--tune-space,1)) clamp(22px,2.4vw,32px)}
.s-mcards h3{font-size:calc(23px*var(--tune-size,1))}
.s-mcards h3::after{content:"";display:block;width:32px;height:1px;margin:18px auto 0;background:var(--line)}
.s-mc-text{margin-top:18px;color:var(--soft);font-size:calc(17px*var(--tune-size,1));line-height:1.5;flex:1}
.s-mc-foot{margin-top:24px;display:grid;gap:2px;align-content:start;min-height:62px}
.s-mc-foot .s-price{color:var(--acc);font-size:calc(20px*var(--tune-size,1));font-variant-numeric:oldstyle-nums}
.s-mc-foot span+span{color:var(--mute);font-style:italic;font-size:calc(16px*var(--tune-size,1))}
/* the lead menu: twice as wide, with a plate */
.s-lead{grid-template-columns:minmax(0,2fr) minmax(0,1fr);max-width:1080px}
.s-lead.s-n3 li:first-child{grid-row:span 2}
.s-lead li:first-child{justify-content:center}
.s-lead li:first-child h3{font-size:calc(clamp(28px,2.6vw,36px)*var(--tune-size,1))}
.s-lead li:first-child .s-mc-text{flex:none;max-width:34ch;font-size:calc(19px*var(--tune-size,1))}
.s-mc-plate{width:clamp(160px,18vw,240px);margin-bottom:28px}
@media(max-width:760px){.s-lead{grid-template-columns:minmax(0,1fr)}.s-lead.s-n3 li:first-child{grid-row:auto}}

/* ---------- from the kitchen: a wide photo with the place card standing on its lower edge ---------- */
.s-kitchen{margin-top:var(--gap)}
.s-k-photo{height:clamp(280px,42vw,560px);overflow:hidden}
.s-k-photo img{width:100%;height:100%;object-fit:cover}
.s-k-card{margin-top:clamp(-140px,-9vw,-72px)}
.s-k-text{margin-top:16px!important;font-size:calc(clamp(19px,1.6vw,21px)*var(--tune-size,1));line-height:1.55;color:var(--ink)!important}
.s-place>p.s-sign{margin-top:20px;font-size:calc(17px*var(--tune-size,1));font-style:normal;color:var(--acc)}

/* ---------- plates on the table (when there is no shared gallery): a symmetric row, the largest in the middle ---------- */
.s-plates{display:flex;justify-content:center;align-items:center;gap:clamp(14px,2.2vw,32px)}
.s-plates li{flex:none;width:clamp(96px,12vw,170px)}
.s-plates li:nth-child(2),.s-plates li:nth-child(4){width:clamp(120px,15vw,210px)}
.s-plates li:nth-child(3){width:clamp(150px,19vw,260px)}
.s-plates.s-n3 li:nth-child(2){width:clamp(150px,19vw,260px)}
.s-plates.s-n4 li:nth-child(2),.s-plates.s-n4 li:nth-child(3){width:clamp(130px,16vw,230px)}
@media(max-width:600px){.s-plates{flex-wrap:wrap;gap:16px}.s-plates li,.s-plates li:nth-child(n){width:calc(50% - 8px)}.s-plates.s-n5 li:nth-child(3),.s-plates.s-n3 li:nth-child(1){order:-1;width:64%}}
.s-gal{margin-top:var(--gap)}

/* ---------- guest book ---------- */
.s-one{max-width:760px;margin:0 auto}
.s-one blockquote{font-family:var(--qf);font-weight:400;font-size:calc(clamp(26px,2.8vw,38px)*var(--tune-size,1));line-height:1.3}
.s-who{margin-top:20px;font-size:calc(16px*var(--tune-size,1));color:var(--mute)}
.s-sample{margin-left:12px;padding:1px 10px;border:1px solid var(--line);font-size:calc(14px*var(--tune-size,1))}
.s-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:1080px;margin:0 auto}
.s-trio li{display:flex;flex-direction:column;justify-content:space-between;padding:0 clamp(18px,2.6vw,40px)}
.s-trio li+li{border-left:1px solid var(--line)}
.s-trio blockquote{font-size:calc(20px*var(--tune-size,1));line-height:1.5}
@media(max-width:760px){.s-trio{grid-template-columns:1fr;gap:36px}.s-trio li+li{border-left:0;padding-top:36px;background:linear-gradient(var(--line),var(--line)) no-repeat 50% 0/32px 1px}}

/* ---------- visit: opening hours and address, typeset like the back of the menu ---------- */
.s-v-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));max-width:820px;margin:0 auto}
.s-v-col{padding:0 clamp(20px,3vw,48px)}
.s-v-col+.s-v-col{border-left:1px solid var(--line)}
.s-v-col h3{font-size:calc(19px*var(--tune-size,1));color:var(--acc);margin-bottom:18px}
.s-hours{display:grid;gap:12px;font-size:calc(19px*var(--tune-size,1))}
.s-hours dt{font-size:calc(17px*var(--tune-size,1))}
.s-hours dd{font-style:italic;color:var(--mute);font-variant-numeric:oldstyle-nums}
address{display:grid;gap:2px;font-style:normal;font-size:calc(19px*var(--tune-size,1));line-height:1.5}
:where(address) a{text-decoration:none;font-variant-numeric:oldstyle-nums}:where(address) a:hover{text-decoration:underline}
@media(max-width:700px){.s-v-col+.s-v-col{border-left:0;margin-top:calc(40px*var(--tune-space,1));padding-top:calc(40px*var(--tune-space,1));background:linear-gradient(var(--line),var(--line)) no-repeat 50% 0/32px 1px}}
/* week chart (hours "week"): thin bars on hairlines, days in small caps */
.wk{display:grid;grid-template-columns:3em minmax(0,1fr) auto;column-gap:14px;max-width:360px;margin:0 auto;text-align:left}
.wk ol{grid-column:1/-1;display:grid;grid-template-columns:subgrid}
.wk li{grid-column:1/-1;display:grid;grid-template-columns:subgrid;align-items:center;min-height:36px;border-bottom:1px solid var(--line);font-size:calc(16px*var(--tune-size,1))}
.wk-n{font-family:var(--sc);font-weight:var(--scw);letter-spacing:.06em}
.wk-bar{position:relative;height:6px}
.wk-bar i{position:absolute;top:0;bottom:0;border-radius:calc(3px*var(--tune-radius,1));background:var(--acc)}
.wk-t{text-align:right;white-space:nowrap;font-style:italic;color:var(--mute);font-variant-numeric:oldstyle-nums}
.wk li.off{color:var(--mute)}
.wk-scale{grid-column:2;display:flex;justify-content:space-between;margin:8px 0 0;font-size:calc(14px*var(--tune-size,1));color:var(--mute)}

/* ---------- closing ---------- */
.s-close-band{margin-top:0;padding:calc(clamp(72px,9vw,120px)*var(--tune-space,1)) 0 calc(clamp(64px,7vw,96px)*var(--tune-space,1));background:var(--e-dye);border-top:1px solid var(--e-line)}
.s-close-band h2{font-size:calc(clamp(36px,4.6vw,60px)*var(--tune-size,1))}
.s-close-band p{margin:14px auto 0;max-width:36ch;font-style:italic;font-size:calc(20px*var(--tune-size,1));color:var(--ink)}
.s-close-band .s-btn{margin-top:32px;min-height:64px;padding:0 52px;font-size:calc(20px*var(--tune-size,1))}
main:has(.s-close-band)+.s-foot{margin-top:0}
/* visit: a dark band; one plate runs off the left edge, the address and the hours stand beside it as short lines */
.s-visit{margin-top:var(--gap);padding:calc(clamp(72px,8vw,112px)*var(--tune-space,1)) 0;text-align:center}
.s-visit .s-hd h2{color:var(--ink)}
.s-v-plate{position:absolute;top:50%;left:calc(var(--vp) * -.3);width:var(--vp);translate:0 -50%}
.s-visit{--vp:clamp(300px,36vw,520px)}
.s-v-in{max-width:none;padding-left:calc(var(--vp) * .7 + 24px)}
address{justify-items:center}
.s-v-line{font-size:calc(clamp(22px,2.2vw,28px)*var(--tune-size,1))}
.s-v-hours{display:grid;gap:4px;margin-top:14px;font-style:italic;font-size:calc(20px*var(--tune-size,1));font-variant-numeric:oldstyle-nums;color:var(--ink)}
.s-v-reach{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 24px;margin-top:14px;font-size:calc(18px*var(--tune-size,1))}
@media(max-width:900px){
  .s-v-plate{position:relative;top:auto;left:50%;translate:-50% 0;margin:0 0 28px}
  .s-visit{--vp:min(70vw,320px)}
  .s-v-in{padding-left:var(--g-pad)}
}

/* ---------- inner pages ---------- */
.s-ph{padding:calc(clamp(48px,6vw,88px)*var(--tune-space,1)) 0 0}
.s-ph .s-lede{margin-top:16px}
.s-wide{margin-top:calc(clamp(40px,5vw,64px)*var(--tune-space,1));height:clamp(220px,32vw,440px);overflow:hidden}
.s-wide img{width:100%;height:100%;object-fit:cover}
.s-detail{padding-top:0}
.s-carte-full{max-width:720px;margin-top:clamp(-96px,-6vw,-48px)}
.s-carte-full h2{font-size:calc(26px*var(--tune-size,1))}
.s-carte-full p{font-size:calc(19px*var(--tune-size,1))}
.s-carte-full .s-hours{max-width:360px;margin:12px auto 0}
.s-qa{display:grid;gap:32px;max-width:var(--axis);margin:0 auto}
.s-qa dt{font-size:calc(20px*var(--tune-size,1))}
.s-qa dd{margin-top:6px;color:var(--mute)}
.s-fold{max-width:var(--axis);margin:0 auto;border-top:1px solid var(--line)}
.s-fold details{border-bottom:1px solid var(--line)}
.s-fold summary{display:flex;justify-content:center;align-items:center;gap:14px;min-height:64px;padding:12px 0;font-size:calc(19px*var(--tune-size,1));cursor:pointer;list-style:none}
.s-fold summary::-webkit-details-marker{display:none}
.s-fold summary::after{content:"";flex:none;width:9px;height:9px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;rotate:45deg;translate:0 -3px;transition:rotate .2s ease}
.s-fold details[open] summary::after{rotate:225deg;translate:0 3px}
.s-fold p{padding:0 0 24px;color:var(--mute)}
.s-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:clamp(20px,2.4vw,32px);max-width:1040px;margin:0 auto}
.s-cards.s-n1{max-width:560px}.s-cards.s-n2{max-width:760px}
.s-cards li{display:grid}
.s-cards .s-place{width:100%;padding-top:calc(clamp(40px,4vw,52px)*var(--tune-space,1))}
.s-cards h2,.s-roll h2{font-size:calc(24px*var(--tune-size,1));line-height:1.25}
.s-place>p.s-role,.s-role{margin-top:6px;color:var(--acc);font-size:calc(16px*var(--tune-size,1));font-style:normal}
.s-cards p:not(.s-role),.s-roll p:not(.s-role){margin-top:14px;color:var(--mute);font-size:calc(17px*var(--tune-size,1));line-height:1.5}
.s-roll{display:grid;gap:44px;max-width:var(--axis);margin:0 auto}
.s-roll li+li{padding-top:calc(44px*var(--tune-space,1));background:linear-gradient(var(--line),var(--line)) no-repeat 50% 0/32px 1px}
.s-form{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px;max-width:720px;margin:0 auto;padding:clamp(28px,4vw,48px);text-align:left}
.s-form label{grid-column:span 3;display:grid;gap:8px;font-size:calc(15px*var(--tune-size,1));color:var(--mute)}
.s-form .s-third{grid-column:span 2}
.s-form .s-wide-f{grid-column:1/-1}
.s-form input,.s-form select,.s-form textarea{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--line);border-radius:0;background:var(--cloth);color:var(--ink);font:400 calc(17px*var(--tune-size,1))/1.4 var(--tf);letter-spacing:0}
.s-f-end{display:grid;justify-items:center;gap:14px;text-align:center}
.s-f-end p{font-size:calc(15px*var(--tune-size,1));color:var(--mute);font-style:italic}
@media(max-width:600px){.s-form label,.s-form .s-third{grid-column:1/-1}}
.s-reach{display:grid;max-width:560px;margin:0 auto;padding:12px clamp(20px,4vw,40px)}
:where(.s-reach) a{display:grid;gap:2px;padding:20px 0;text-decoration:none}
:where(.s-reach) a+a{border-top:1px solid var(--line)}
.s-reach span{font-size:calc(15px*var(--tune-size,1));color:var(--acc)}
.s-reach b{font:var(--hw) calc(clamp(22px,2.4vw,30px)*var(--tune-size,1))/1.25 var(--hf);overflow-wrap:anywhere}
.s-r-hours{max-width:360px;margin:calc(40px*var(--tune-space,1)) auto 0}
.s-r-title{margin-top:calc(48px*var(--tune-space,1));font-size:calc(19px*var(--tune-size,1));color:var(--acc)}.s-r-title+.s-r-hours{margin-top:18px}

/* ---------- footer ---------- */
.s-foot{margin-top:calc(clamp(80px,8vw,112px)*var(--tune-space,1));padding:calc(48px*var(--tune-space,1)) 0 calc(40px*var(--tune-space,1));border-top:1px solid var(--line);font-size:calc(16px*var(--tune-size,1));color:var(--mute)}
.s-foot .s-wrap{display:grid;justify-items:center;gap:10px}
.s-foot-name{font-size:calc(22px*var(--tune-size,1));letter-spacing:.14em;color:var(--ink)}
.s-foot-reach{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 28px}
:where(.s-foot) a{text-decoration:none}:where(.s-foot) a:hover,:where(.s-foot) a[aria-current]{text-decoration:underline}
.s-flegal{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 28px;margin-top:8px;font-size:calc(15px*var(--tune-size,1))}
.s-foot .langs{justify-content:center;margin-top:4px}
.s-fict{font-size:calc(14px*var(--tune-size,1));font-style:italic}

/* ---------- Basic motion: hover only (no scripts) ---------- */
@media (hover:hover){.s-mcards li,.s-cards .s-place{transition:translate .3s ease}.s-mcards li:hover{translate:0 -4px}}

/* ---------- Advanced: the plates are served as the course line comes into view ---------- */
@media (prefers-reduced-motion:no-preference){
  .m-js .s-courses>li .s-c-plate{transition:scale .7s cubic-bezier(.2,.7,.2,1),rotate .9s cubic-bezier(.2,.7,.2,1)}
  .m-js .s-courses>li:not(.m-in) .s-c-plate{scale:.82;rotate:-24deg}
  .m-js .s-plates>li:not(.m-in){rotate:-30deg}
  .m-js .s-plates>li{transition:opacity .7s ease,translate .7s ease,rotate 1.1s cubic-bezier(.2,.7,.2,1)}
}

/* Advanced hero moment, "service" (wow layer; .m-js = an Advanced page with its scripts running, see
   engine/shared/wow.js). Setting: the cloth settles, the plate is served: it rises from below the fold and turns into
   place, then the title, the sentence and the button are read in. Menu: the plates turn in from the page edges while the
   cloth settles, and the courses appear one by one, as if read aloud. Afterwards the plate leans toward the pointer
   (data-tilt) and the side plates drift away from it (data-depth). The headline does not rise word by word: the plate is
   the moment. Transform and opacity only; reduced motion or no scripts: still. */
@media (prefers-reduced-motion:no-preference){
.m-js [data-wow] h1 .m-w>span{animation:none}
.m-js .s-eve .s-cloth{animation:s-settle 1.8s cubic-bezier(.2,.7,.2,1) backwards}
.m-js .s-setting .s-dish .s-plate{animation:s-serve 1.5s cubic-bezier(.2,.7,.2,1) .15s backwards}
.m-js .s-setting .s-dish{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.m-js .s-setting .s-set-hd{animation:s-read .9s ease .35s backwards}
.m-js .s-setting .s-lede{animation:s-read .9s ease .9s backwards}
.m-js .s-setting .s-cta{animation:s-read .9s ease 1s backwards}
.m-js .s-hmenu [data-depth]{transition:translate 1.1s cubic-bezier(.2,.7,.2,1)}
.m-js .s-hmenu .s-hm-l .s-plate{animation:s-pl 1.4s cubic-bezier(.2,.7,.2,1) .1s backwards}
.m-js .s-hmenu .s-hm-r .s-plate{animation:s-pr 1.4s cubic-bezier(.2,.7,.2,1) .2s backwards}
.m-js .s-hmenu h1{animation:s-read .9s ease .3s backwards}
.m-js .s-hmenu .s-lede,.m-js .s-hmenu .s-cta{animation:s-read .8s ease .7s backwards}
@keyframes s-settle{from{scale:1.08}}
@keyframes s-serve{from{opacity:0;translate:0 24%;rotate:-32deg}}
@keyframes s-pl{from{opacity:0;translate:-56px 0;rotate:-40deg}}
@keyframes s-pr{from{opacity:0;translate:56px 0;rotate:40deg}}
@keyframes s-read{from{opacity:0;translate:0 6px}}
}

/* long shop names on small screens (html.name-long / name-xl from engine/shared/site.ts; qa tests "Loodgietersbedrijf Jansen") */
@media(max-width:600px){html.name-long .s-end .langs{display:none}html.name-long .s-name{grid-column:1/-1;grid-row:1;justify-self:center;max-width:calc(100% - 150px);text-align:center;font-size:calc(15px*var(--tune-size,1));letter-spacing:.06em;line-height:1.2}html.name-long .s-menu{grid-row:1;position:relative;z-index:1}html.name-xl .s-name{font-size:calc(13px*var(--tune-size,1));letter-spacing:.04em}}
@media(min-width:961px) and (max-width:1200px){html.name-long .s-name{font-size:calc(17px*var(--tune-size,1));letter-spacing:.08em}}