/* Minh Mat: built by Last Page Studio engine 2.0.0. Tokens and fonts from site/design.py. */
@font-face{font-family:"Josefin Sans";font-weight:300;font-style:normal;font-display:swap;src:url(../fonts/josefin-sans-latin-300-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:"Josefin Sans";font-weight:300;font-style:normal;font-display:swap;src:url(../fonts/josefin-sans-vietnamese-300-normal.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Josefin Sans";font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/josefin-sans-latin-600-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:"Josefin Sans";font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/josefin-sans-vietnamese-600-normal.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Source Serif 4";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/source-serif-4-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:"Source Serif 4";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/source-serif-4-vietnamese-400-normal.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Source Serif 4";font-weight:400;font-style:italic;font-display:swap;src:url(../fonts/source-serif-4-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:"Source Serif 4";font-weight:400;font-style:italic;font-display:swap;src:url(../fonts/source-serif-4-vietnamese-400-italic.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
:root{--c-paper:#f3f0e5;--c-ink:#11160f;--c-soft:#3b4538;--c-rule:#c9c6b6;--c-rule-strong:rgba(17,22,15,.35);--c-dark:#11160f;--c-on-dark:#f3f0e5;--c-on-dark-soft:#b9c4b8;--c-rule-dark:#3a463b;--c-accent:#8db39c;--c-accent-ink:#2f5a45;--c-focus:#11160f;--c-focus-dark:#8db39c;--c-btn:#11160f;--c-btn-fg:#f3f0e5;--c-btn-hover:#2f5a45;--c-btn-line:#11160f;--c-btn-dark:#8db39c;--c-btn-dark-fg:#11160f;--c-btn-dark-hover:#f3f0e5;--f-display:"Josefin Sans","Century Gothic","Avenir Next",system-ui,sans-serif;--f-text:"Source Serif 4",Georgia,"Times New Roman",serif;--f-hero:var(--f-text);--t-body:400 18px/1.5 var(--f-text);--h-weight:300;--t-k:600 12px/1.3 var(--f-display);--k-track:.18em;--k-gap:14px;--t-tl:400 16px/1.5 var(--f-text);--t-btn:600 13px/1 var(--f-display);--btn-track:.16em;--btn-bw:1.5px;--btn-h:50px;--btn-px:24px;--btn-ws:nowrap;--gut:20px;--hero-shade:14,17,12;--hero-sub:#e4e0d2;--hero-week:#d8d4c6;--table-glow:#273021;--table-mid:#161c13}
@media (min-width:700px){:root{--gut:40px}}
@media (min-width:1100px){:root{--gut:64px;--t-body:400 20px/1.5 var(--f-text);--t-k:600 13px/1.3 var(--f-display);--t-tl:400 18px/1.5 var(--f-text);--btn-flex:0 0 auto;--btn-min-w:176px}}
/* ---- engine base: the same on every site, every value that gives a site its look comes from the tokens ---- */
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--c-paper);color:var(--c-ink);font:var(--t-body);-webkit-font-smoothing:antialiased;font-variant-numeric:var(--num,lining-nums)}
a{color:inherit;text-underline-offset:4px;text-decoration-thickness:var(--u-thick,auto)}
a:hover{color:var(--c-link-hover,inherit)}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-weight:var(--h-weight,400);text-wrap:balance}
em{font-style:italic}
:focus-visible{outline:var(--focus-w,2px) solid var(--c-focus);outline-offset:3px}
.on-dark :focus-visible{outline-color:var(--c-focus-dark,var(--c-accent))}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip:focus{position:fixed!important;top:8px;left:8px;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal;background:var(--c-ink);color:var(--c-paper);padding:12px 16px;z-index:20}
.wrap{max-width:var(--max,1440px);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.nb{white-space:nowrap}
.today[hidden]{display:none}

/* labels, text links, buttons */
.k{font:var(--t-k);letter-spacing:var(--k-track,.18em);text-transform:uppercase;color:var(--c-k,inherit);margin:0 0 var(--k-gap,12px)}
.k--mark{color:var(--c-mark)}
.tl{display:inline-flex;align-items:center;min-height:44px;font:var(--t-tl);letter-spacing:var(--tl-track,normal);text-transform:var(--tl-case,none);color:var(--c-tl,inherit);text-decoration:underline;text-underline-offset:var(--tl-offset,4px)}
.tl:hover{color:var(--c-tl-hover,inherit)}
.cta{display:flex;flex-wrap:wrap;gap:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;flex:var(--btn-flex,1 1 auto);min-width:var(--btn-min-w,0);min-height:var(--btn-h,50px);padding:0 var(--btn-px,24px);
 font:var(--t-btn);letter-spacing:var(--btn-track,.14em);text-transform:uppercase;text-decoration:none;white-space:var(--btn-ws,normal);
 border:var(--btn-bw,1.5px) solid var(--c-btn);transition:background-color .2s,color .2s,border-color .2s}
.btn--fill{background:var(--c-btn);color:var(--c-btn-fg)}
.btn--fill:hover{background:var(--c-btn-hover);border-color:var(--c-btn-hover);color:var(--c-btn-fg)}
.btn--line{color:var(--c-btn-line,var(--c-btn))}
.btn--line:hover{background:var(--c-btn);color:var(--c-btn-fg)}
/* a dark section turns the buttons round */
.on-dark{--c-btn:var(--c-btn-dark);--c-btn-fg:var(--c-btn-dark-fg);--c-btn-hover:var(--c-btn-dark-hover);--c-btn-line:var(--c-on-dark)}

/* a typed white card with a thin rim line (a menu sheet, a sign, an hours card): rim colour from the tokens */
.card{background:var(--c-card,#fff);color:var(--c-ink);position:relative;box-shadow:0 30px 60px -28px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.06)}
.card::before{content:"";position:absolute;inset:8px;border:1.5px solid var(--c-mark);pointer-events:none}

/* phone folds: <details class="fold" data-open-from="960"> opens and stops folding from that width (core.js) */
.fold>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:12px 16px;cursor:pointer;list-style:none;border:2px solid currentColor;font:var(--t-fold,inherit);letter-spacing:.08em;text-transform:uppercase}
.fold>summary::-webkit-details-marker{display:none}
.fold>summary::after{content:"+";flex:0 0 auto;font-size:1.6em;line-height:1;transition:transform .25s ease}
.fold[open]>summary::after{transform:rotate(45deg)}
.fs-t{flex:1 1 auto}
.fs-n{flex:0 0 auto;letter-spacing:.06em}
@supports selector(::details-content){
 :root{interpolate-size:allow-keywords}
 details.fold::details-content{block-size:0;overflow-y:clip;transition:block-size .3s ease,content-visibility .3s allow-discrete}
 details.fold[open]::details-content{block-size:auto}
}
html.fold-fixed details.fold>summary{display:none}

@keyframes lp-in{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ---- pattern header.bar ---- */
.hdr{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 var(--gut);height:64px;max-width:1440px;margin:0 auto}
.brand{font:600 16px/1 var(--f-display);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.nav{display:flex;align-items:center}
.nav a{font:600 12px/1 var(--f-display);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;min-height:44px;display:inline-flex;align-items:center;padding:0 9px}
.nav a:hover{text-decoration:underline;text-underline-offset:6px}
.nav .hbook{display:none}
.hdr--over{position:absolute;top:0;left:0;right:0;z-index:5;color:var(--c-on-dark)}
.hdr--over :focus-visible{outline-color:var(--c-focus-dark,var(--c-accent))}
@media (min-width:1100px){
 .hdr{height:88px}
 .brand{font-size:18px}
 .nav a{font-size:13px;padding:0 14px}
 .nav .hbook{display:inline-flex;border:1.5px solid var(--c-ink);margin-left:10px;padding:0 20px;min-height:46px}
 .nav .hbook:hover{background:var(--c-ink);color:var(--c-paper);text-decoration:none}
 .hdr--over .hbook{border-color:var(--c-on-dark)}
 .hdr--over .hbook:hover{background:var(--c-on-dark);color:var(--c-ink)}
}
@media (min-width:900px) and (max-height:940px){.hdr--over{height:72px}}
@media (max-width:380px){.brand{font-size:14px;letter-spacing:.16em}.nav a{font-size:11px;padding:0 7px;letter-spacing:.12em}}
@media print{.hdr{display:none}}

/* ---- pattern footer.wordmark ---- */
.ftr{background:var(--c-dark);color:var(--c-on-dark);padding:40px var(--gut) 28px}
.ftr-in{max-width:1312px;margin:0 auto}
.ftr .wm{display:block;min-height:0;font:600 clamp(36px,12.4vw,60px)/1 var(--f-display);letter-spacing:.12em;text-transform:uppercase;color:var(--c-accent);text-decoration:none;margin-bottom:22px;white-space:nowrap}
.ftr ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:0 18px}
.ftr a{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:4px;font-size:16px}
.ftr .meta{font-size:16px;color:var(--c-on-dark-soft);margin-bottom:6px}
@media (min-width:1100px){
 .ftr{padding:56px var(--gut) 32px}
 .ftr-in{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:end}
 .ftr .wm{grid-column:1/8;font-size:clamp(64px,7.2vw,104px);margin:0}
 .ftr-r{grid-column:8/13;justify-self:end;text-align:right}
 .ftr ul{justify-content:flex-end}
 .ftr .meta,.ftr a{font-size:18px}
}
@media print{.ftr{display:none}}

/* ---- pattern hero.fullbleed ---- */
/* three rows: headline / photo / hours + buttons. The photo stops where the bottom row starts, so the hours and the
   buttons always sit on their own dark band and never on the food, at any screen size (Rasmus, 4 Nov 2026) */
.hero--full{position:relative;min-height:100vh;min-height:100svh;display:grid;grid-template-rows:auto minmax(200px,1fr) auto;color:var(--c-on-dark);background:rgb(var(--hero-shade));overflow:hidden}
/* phone: the photo starts under the headline (its top fades out of the dark band above it) */
.hero--full .hero__ph{position:relative;grid-row:2;grid-column:1}
.hero--full .hero__ph picture{position:absolute;inset:0}
.hero--full .hero__ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.hero--full .hero__ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgb(var(--hero-shade)) 0,rgba(var(--hero-shade),.5) 10%,rgba(var(--hero-shade),0) 22%,rgba(var(--hero-shade),0) 72%,rgb(var(--hero-shade)) 100%)}
.hero__top,.hero__bot{position:relative;z-index:2;grid-column:1;width:100%;max-width:1440px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gut);animation:lp-in .3s ease-out both}
.hero__top{grid-row:1;padding-top:76px;padding-bottom:4px}
.hero--full .k{margin-bottom:8px;color:var(--c-accent)}
.hero--full h1{font:400 clamp(27px,7.4vw,34px)/1.12 var(--f-hero,var(--f-display));letter-spacing:-.01em;text-wrap:balance;max-width:17em}
.hero--full .sub{margin-top:6px;font-size:16px;color:var(--hero-sub,var(--c-on-dark))}
.hero__bot{grid-row:3;padding-top:14px;padding-bottom:22px;display:grid;gap:12px}
.hero--full .today{font:600 15px/1.4 var(--f-display);letter-spacing:.04em}
.hero--full .week{font-size:16px;color:var(--hero-week,var(--c-on-dark))}
.hero__hrs .tl{min-height:32px;font-size:15px;color:var(--hero-sub,var(--c-on-dark))}
@media (min-width:900px){
 .hero--full{min-height:min(100svh,1200px);grid-template-rows:auto minmax(260px,1fr) auto}
 /* the photo reaches up behind the menu and the headline (they sit on the room, not the food) */
 .hero--full .hero__ph{grid-row:1 / 3}
 .hero--full .hero__ph img{object-position:50% 0}
 .hero__top{padding-top:104px}
 .hero--full h1{font-size:clamp(30px,2.9vw,46px);max-width:none}
 .hero--full .sub{font-size:19px}
 .hero__bot{grid-template-columns:1fr auto;align-items:end;padding-top:18px;padding-bottom:32px}
 .hero__bot .cta{flex-wrap:nowrap}
 .hero--full .hero__ph::after{background:linear-gradient(180deg,rgba(var(--hero-shade),.9) 0,rgba(var(--hero-shade),.66) 17%,rgba(var(--hero-shade),0) 30%,rgba(var(--hero-shade),0) 80%,rgb(var(--hero-shade)) 100%)}
}
@media (min-width:1100px){
 .hero__top{padding-top:112px}
 .hero--full .today{font-size:18px}
 .hero--full .week{font-size:18px}
 .hero--full .sub{font-size:21px}
}
/* very wide screens blow the photo up, so more of the room's detail lands behind the small top lines: a deeper top shade */
@media (min-width:1700px){
 .hero--full .hero__ph::after{background:linear-gradient(180deg,rgba(var(--hero-shade),.95) 0,rgba(var(--hero-shade),.9) 22%,rgba(var(--hero-shade),0) 38%,rgba(var(--hero-shade),0) 80%,rgb(var(--hero-shade)) 100%)}
}
/* short laptop screens (1280 x 720, 1366 x 768): a slimmer top band so the headline ends above the photo's subject */
@media (min-width:900px) and (max-height:940px){
 .hero__top{padding-top:74px}
 .hero--full .k{margin-bottom:4px}
 .hero--full h1{font-size:32px}
 .hero--full .sub{display:none}
 .hero__bot{padding-top:14px;padding-bottom:22px}
}
/* phones: the two buttons side by side, so the bottom band is shorter */
@media (max-width:480px){
 .hero--full .cta{flex-wrap:nowrap}
 .hero--full .btn{flex:1 1 0;padding:0 8px;font-size:12px;letter-spacing:.08em}
}
@media (max-width:480px) and (max-height:780px){
 .hero__top{padding-top:68px}
 .hero--full h1{font-size:clamp(25px,7vw,29px)}
 .hero--full .sub{display:none}
 .hero__hrs .tl{display:none}
 .hero__bot{gap:8px;padding-top:10px;padding-bottom:16px}
 .hero--full .btn{min-height:46px}
}

/* ---- pattern story.band ---- */
.story{background:var(--c-dark);color:var(--c-on-dark)}
.band{background:var(--c-dark);overflow:hidden}
.band img{width:100%;height:auto}
.st-in{padding:56px var(--gut) 72px;max-width:1440px;margin:0 auto}
.story h2{font:300 clamp(34px,9vw,44px)/1.08 var(--f-display);margin-bottom:24px;text-wrap:balance}
.story h2 em{font:italic 400 1em/1 var(--f-text)}
.story .k{color:var(--c-accent)}
.story p{margin-bottom:18px;max-width:34em}
.mich{margin-top:28px;padding-top:20px;border-top:1px solid var(--c-rule-dark);max-width:34em}
.mich p{margin:0 0 4px;font-size:17px}
.mich a{display:inline-flex;align-items:center;min-height:44px;font:600 12px/1 var(--f-display);letter-spacing:.16em;text-transform:uppercase;text-underline-offset:5px;color:var(--c-accent)}
@media (min-width:1100px){
 .band img{max-width:1500px;margin:0 auto}
 .st-in{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;padding:128px var(--gut) 136px}
 .st-hd{grid-column:1/6}
 .st-tx{grid-column:7/13}
 .story h2{font-size:64px}
 .mich p{font-size:19px}
 .mich a{font-size:13px}
}

/* ---- pattern menu.table ---- */
/* overflow:clip, not hidden: a scroll container here would stop the scroll timeline */
.table{background:radial-gradient(120% 70% at 50% 46%,var(--table-glow) 0,var(--table-mid) 58%,var(--c-dark) 100%);color:var(--c-on-dark);padding:64px var(--gut) 64px;overflow:clip}
.tb-in{max-width:1312px;margin:0 auto}
.table .k{color:var(--c-accent)}
.table h2{font:400 clamp(34px,9vw,44px)/1.08 var(--f-hero,var(--f-display));margin-bottom:12px;text-wrap:balance}
.table h2 em{font-style:italic}
.table .lede{max-width:34ch;color:var(--hero-week,var(--c-on-dark))}
.stage{position:relative;height:clamp(300px,86vw,420px);margin:28px calc(var(--gut) * -1) 8px}
.td{position:absolute;margin:0;z-index:var(--z,1)}
.td img{display:block;width:100%;height:auto;transition:transform .25s ease-out,filter .25s ease-out;filter:drop-shadow(0 18px 18px rgba(0,0,0,.55))}
.td:hover img{transform:translateY(-8px);filter:drop-shadow(0 30px 26px rgba(0,0,0,.6))}
@media (prefers-reduced-motion:no-preference){
 @supports (animation-timeline:view()){
  .td{animation:lp-set-down linear both;animation-timeline:view();animation-range:entry calc(var(--i) * 8%) cover calc(22% + var(--i) * 5%)}
 }
}
/* no fade from nothing: a page captured without scrolling still shows every dish, just not yet set down */
@keyframes lp-set-down{
 0%{opacity:.35;transform:translateY(90px) rotate(-7deg) scale(.92)}
 45%{opacity:1}
 78%{transform:translateY(-10px) rotate(1.2deg) scale(1.01)}
 100%{opacity:1;transform:none}
}
.idx{list-style:none;padding:0;margin-top:20px;border-top:1px solid var(--c-rule-dark)}
.idx li{border-bottom:1px solid var(--c-rule-dark)}
.idx a{display:grid;grid-template-columns:64px 1fr;column-gap:16px;align-items:baseline;padding:20px 0;text-decoration:none}
.idx .c{grid-row:1/4;font:300 52px/.9 var(--f-display);color:var(--c-accent);font-variant-numeric:lining-nums}
.idx .n{font:600 22px/1.15 var(--f-display);text-transform:uppercase;letter-spacing:.12em}
.idx .d{font-size:17px;margin-top:4px}
.idx .nm{font-size:16px;color:var(--c-on-dark-soft);line-height:1.45;margin-top:4px}
.idx a:hover .n{color:var(--c-accent)}
@media (min-width:700px){.stage{height:min(62vw,560px);margin-left:0;margin-right:0}}
@media (min-width:1100px){
 .table{padding:128px var(--gut) 120px}
 .tb-hd{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:end}
 .tb-hd .k{grid-column:1/13}
 .table h2{grid-column:1/7;font-size:64px;margin:0}
 .table .lede{grid-column:8/13;margin:0;max-width:none;font-size:20px}
 .stage{height:min(46vw,640px);margin:24px 0 24px}
 .idx{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:24px}
 .idx li{border:0}
 .idx a{display:flex;flex-direction:column;padding:28px 24px 0 0}
 .idx .c{font-size:88px;margin-bottom:14px}
 .idx .n{font-size:26px}
 .idx .d{font-size:19px;margin-top:8px}
 .idx .nm{font-size:18px;line-height:1.5;margin-top:8px}
}

/* ---- pattern visit.split ---- */
/* shared by visit.split and visitpage.rules */
.visit{background:var(--c-paper);padding:64px var(--gut) 56px}
.vi-in{max-width:1312px;margin:0 auto}
.visit h2,.vpage h1{font:300 clamp(40px,11vw,52px)/1.05 var(--f-display);margin-bottom:24px}
.hrs{list-style:none;padding:0;margin:0 0 24px;border-top:2px solid var(--c-ink)}
.hrs li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:13px 0;border-bottom:1px solid var(--c-rule-strong,var(--c-rule));font-size:18px}
.hrs b{font:600 14px/1.4 var(--f-display);letter-spacing:.14em;text-transform:uppercase}
.hrs span{font-variant-numeric:lining-nums tabular-nums;text-align:right}
.addr{font-style:normal;margin-bottom:20px}
.addr b{display:block;font:600 14px/1.4 var(--f-display);letter-spacing:.14em;text-transform:uppercase;margin-bottom:2px}
.addr a{text-underline-offset:4px}
.vi-cta{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 14px}
.note{font-size:16px;margin-bottom:4px}
@media (min-width:1100px){
 .visit{padding:128px var(--gut) 112px}
 .visit .vi-in{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px}
 .vi-hd{grid-column:1/6}
 .vi-tx{grid-column:7/13}
 .visit h2,.vpage h1{font-size:72px}
 .hrs li{font-size:21px;padding:16px 0}
 .hrs b{font-size:15px}
 .addr{font-size:20px}
 .note{font-size:18px}
}

/* ---- pattern menupage.rows ---- */
.mhead{padding:24px var(--gut) 8px;max-width:1440px;margin:0 auto}
.mhead .k{color:var(--c-accent-ink)}
.mhead h1{font:300 clamp(44px,12.5vw,56px)/1.02 var(--f-display);letter-spacing:-.01em;margin-bottom:16px}
.mhead .lede{max-width:36em;margin-bottom:24px}
.chips{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}
.chips a{display:flex;justify-content:space-between;align-items:center;min-height:48px;padding:0 14px;border:1.5px solid var(--c-ink);text-decoration:none;font:600 12px/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;transition:background-color .2s,color .2s}
.chips a:hover{background:var(--c-ink);color:var(--c-paper)}
.chips b{font:300 16px/1 var(--f-display)}
.msec{padding:56px var(--gut) 8px;max-width:1440px;margin:0 auto;scroll-margin-top:8px}
.msec-hd h2{font:300 clamp(40px,11vw,52px)/1.05 var(--f-display);margin-bottom:10px}
.msec-hd .how{font-size:17px;margin-bottom:22px;color:var(--c-soft)}
.dishes{border-top:2px solid var(--c-ink)}
.dish{display:grid;grid-template-columns:1fr auto;column-gap:16px;padding:20px 0;border-bottom:1px solid var(--c-rule)}
.dn{grid-column:1;font:600 22px/1.2 var(--f-display);text-transform:uppercase;letter-spacing:.03em}
.gl{grid-column:1;font:italic 400 17px/1.4 var(--f-text);margin-top:3px}
.dd{grid-column:1/3;font-size:17px;line-height:1.5;color:var(--c-soft);margin-top:8px;max-width:60ch}
.price{grid-column:2;grid-row:1;align-self:start;font:300 26px/1.2 var(--f-display);font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.mfoot{background:var(--c-dark);color:var(--c-on-dark);margin-top:64px;padding:48px var(--gut) 56px}
.mf-in{max-width:1312px;margin:0 auto}
.mfoot p{margin-bottom:14px;max-width:36em}
.mfoot .small{font-size:16px;color:var(--c-on-dark-soft)}
.mfoot .links{display:flex;flex-wrap:wrap;gap:0 24px;margin:8px 0 22px}
.mfoot .links a{display:inline-flex;align-items:center;min-height:44px;font:600 12px/1 var(--f-display);letter-spacing:.16em;text-transform:uppercase;text-underline-offset:5px;color:var(--c-accent)}
@media (min-width:700px){.chips{grid-template-columns:repeat(4,1fr)}}
@media (min-width:1100px){
 .mhead{padding:48px var(--gut) 24px;display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px}
 .mhead .k{grid-column:1/13}
 .mhead h1{grid-column:1/13;font-size:clamp(72px,7.4vw,108px)}
 .mhead .lede{grid-column:1/6;font-size:22px}
 .chips{grid-column:1/13;grid-template-columns:repeat(4,max-content);gap:12px}
 .chips a{padding:0 22px;gap:18px;font-size:13px}
 .chips b{font-size:18px}
 .msec{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;padding:112px var(--gut) 8px;align-items:start}
 .msec-hd{grid-column:1/5;position:sticky;top:32px}
 .msec-hd h2{font-size:60px}
 .msec-hd .how{font-size:19px;max-width:15em}
 .dishes{grid-column:5/13}
 .dish{padding:32px 0;column-gap:32px}
 .dn{font-size:31px}
 .gl{font-size:21px;margin-top:4px}
 .dd{font-size:19px;line-height:1.55;margin-top:10px}
 .price{font-size:36px}
 .mfoot{margin-top:96px;padding:80px var(--gut) 88px}
 .mf-in{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px}
 .mf-l{grid-column:1/7}
 .mf-r{grid-column:8/13}
 .mfoot p{font-size:20px}
 .mfoot .small{font-size:18px}
 .mfoot .links a{font-size:13px}
}
@media print{.chips{display:none}}

/* ---- pattern visitpage.rules ---- */
.vpage .vi-in{display:block}
.visit .rules-h{font:300 28px/1.15 var(--f-display);margin:8px 0 18px;text-wrap:balance}
.rules{margin:0 0 24px}
.rules div{padding:15px 0;border-bottom:1px solid var(--c-rule-strong,var(--c-rule))}
.rules div:first-child{border-top:2px solid var(--c-ink)}
.rules dt{font:600 13px/1.3 var(--f-display);letter-spacing:.16em;text-transform:uppercase;margin-bottom:4px}
.rules dd{margin:0;font-size:17px}
.more-links{list-style:none;padding:0;margin:0 0 20px}
.more-links a{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:4px}
@media (min-width:1100px){
 .vpage .vi-in{display:grid}
 .visit .rules-h{font-size:36px;margin:0 0 24px}
 .rules dt{font-size:14px}
 .rules dd{font-size:19px}
}

/* ---- pattern notfound.figure ---- */
.nf{padding:72px var(--gut) 96px;max-width:1440px;margin:0 auto}
.nf h1{font:300 clamp(40px,11vw,64px)/1.05 var(--f-display);margin-bottom:20px}
.nf p{margin-bottom:12px}
.nf-dish{margin:32px 0 0;max-width:420px}
.nf-dish img{filter:drop-shadow(0 18px 18px rgba(0,0,0,.35))}
@media (min-width:1100px){
 .nf{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:center;padding:64px var(--gut) 96px;min-height:70vh}
 .nf-t{grid-column:1/7}
 .nf-dish{grid-column:8/13;width:min(100%,520px);margin:0 0 0 auto}
 .nf p{font-size:20px}
}

/* ---- motion: calm ---- */
:root{--lp-reveal-dur-block:1s;--lp-reveal-dur-image:1.1s;--rv-dist:14px;--rv-stagger:.09s;--rv-ease:cubic-bezier(.22,.61,.36,1)}
/* ---- engine motion kit (Rasmus 3 Nov: the restaurangag.se feeling, blocks arrive as you scroll) ----
   .rv       a block fades up into place when it scrolls into view; style="--rv-i:n" staggers it inside its group
   .rv-img   a picture fades in and settles from a slight zoom
   .px       a photo band that moves slower than the page (parallax; CSS scroll-driven, no script)
   Hidden only when the script runs (html.js, set in <head>, taken back after 2.5 s if site.js never loads) and only when
   the visitor has not asked for less motion. Never put .rv on an element that has its own transform: wrap it. */
@media (prefers-reduced-motion:no-preference){
 html.js .rv{opacity:0;transform:translate3d(0,var(--rv-dist,14px),0);
  transition:opacity var(--lp-reveal-dur-block) var(--rv-ease),transform var(--lp-reveal-dur-block) var(--rv-ease);
  transition-delay:calc(var(--rv-i,0) * var(--rv-stagger,.08s))}
 html.js .rv.in{opacity:1;transform:none}
 html.js .rv-img img{opacity:0;transform:scale(1.04);
  transition:opacity var(--lp-reveal-dur-image) var(--rv-ease),transform calc(var(--lp-reveal-dur-image) * 1.6) var(--rv-ease)}
 html.js .rv-img.in img{opacity:1;transform:none}
 @supports (animation-timeline:view()){
  .px{overflow:clip}
  .px img{animation:lp-px linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
 }
}
@keyframes lp-px{from{transform:translate3d(0,calc(var(--px,5%) * -1),0) scale(var(--px-scale,1.12))}to{transform:translate3d(0,var(--px,5%),0) scale(var(--px-scale,1.12))}}
@media print{html.js .rv,html.js .rv-img img{opacity:1!important;transform:none!important}}

/* ---- this site only (site/extra.css) ---- */
/* Minh Mat only: geometry that belongs to these photos */
body.home{background:var(--c-dark)}
/* where each cut-out dish stands on the table (menu.table) */
.td--pot{width:44%;left:2%;top:2%}
.td--noodle{width:47%;right:1%;top:0}
.td--bowl{width:62%;left:10%;bottom:0;--z:3}
.td--leaf{width:31%;right:3%;bottom:4%;--z:2}
@media (min-width:700px){
 .td--pot{width:34%;left:4%;top:4%}
 .td--noodle{width:37%;right:6%;top:0}
 .td--bowl{width:46%;left:22%;bottom:0}
 .td--leaf{width:23%;right:4%;bottom:6%}
}
@media (min-width:1100px){
 .td--pot{width:30%;left:2%;top:6%}
 .td--noodle{width:31%;right:9%;top:0}
 .td--bowl{width:40%;left:26%;bottom:0}
 .td--leaf{width:19%;right:1%;bottom:2%}
}
@media print{body,.mpage{background:#fff}}

