/* Colour and materials drawn from Commune's awning, mural, timber and indigo fabric. */
:root{--cream:#f5eddc;--paper:#fcf8ef;--ink:#29271f;--green:#2e4e61;--rust:#8e482e;--quiet:#635e53;--line:#d6cbb5;--ochre:#e6b650;--indigo:#2e4e61;--ink-deep:#16222a;--kicker-dark:#f3c872;--section-y:clamp(40px,4.4vw,60px);--seam:9px;--seam-line:#b99448;--ribbon:var(--ochre) url('assets/commune-border.svg') center/40px 12px repeat-x;--h2-section:clamp(2.3rem,4.4vw,4.4rem);--h2-sub:clamp(2rem,3.2vw,3.2rem);
/* One surface set for every card, tile and panel on both pages; one spacing scale inside sections. */
--tile:#fffdf7;--tile-line:#dbcfb5;--radius:3px;--tile-gap:14px;--gap-l:clamp(34px,3.2vw,44px);--gap-m:clamp(22px,2.4vw,30px);--gap-s:16px}
.section-label{margin-bottom:16px}
.preview{background:var(--indigo)}
.brand{display:block;width:120px;height:120px;flex:0 0 120px;line-height:0;color:var(--indigo)}
.brand-logo{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.footer-brand{display:block;width:120px;height:120px;line-height:0}
.footer-brand img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.header-art{height:58px;min-width:140px;max-width:360px;flex:1 1 360px;background:url('assets/commune-header.svg?v=12') center/contain no-repeat;margin-inline:auto}
.site-header::after{content:'';display:block;height:var(--seam);background:var(--ribbon);border-top:1px solid var(--seam-line)}
.header-inner{gap:28px;min-height:128px}
.header-inner .site-nav{margin-left:0;flex:none;gap:24px}
.header-inner .lang-switch{background:#e6b65024}
.header-inner .lang-switch:hover{background:var(--green)}
.site-header{border-bottom:0}
.site-nav a{font-size:13px}
.lang-switch{font-size:12px}
@media(max-width:1050px){.brand{width:112px;height:112px;flex-basis:112px}}
@media(max-width:430px){.brand{width:78px;height:78px;flex-basis:78px}.footer-brand{width:88px;height:88px}}
.hero .button{background:var(--ochre);border-color:var(--ochre);color:var(--ink)}
.hero .button:hover{background:#f4cc78;border-color:#f4cc78}
.hero .section-label{color:var(--kicker-dark)}
/* The masthead ribbon (not a paper gap) separates the two full-bleed photographs; see .coworking-section::after. */
.hero.wrap{border-bottom:0}
.hero::after{background:linear-gradient(90deg,#16222adc 0%,#16222a8a 43%,#16222a10 85%)}
.home-intro.wrap{position:relative;width:100%;max-width:none;background:#ead39e;border:0;grid-template-columns:1fr 2.1fr;padding:76px max(40px,calc((100vw - 1320px)/2)) 90px;gap:6%}
.home-intro::after{content:'';position:absolute;z-index:1;top:0;left:0;width:100%;height:var(--seam);background:var(--ribbon);border-top:1px solid var(--seam-line);pointer-events:none}
.home-intro .section-label{color:#67472e}
.home-intro h2{font-size:var(--h2-section)}
.home-intro p{color:#4c422d;max-width:55ch}
.home-intro .arrow-link{color:#293d41;font-size:14px}
.home-intro.wrap{grid-template-columns:minmax(0,300px) minmax(0,1fr);align-items:center;gap:clamp(32px,5vw,72px);padding-top:calc(var(--section-y) + var(--seam));padding-bottom:var(--section-y)}
.intro-feature{min-width:0;max-width:300px}
/* Product photographs on the ochre bands sit in the round frame of the tree seal. */
.intro-feature img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:50%;box-shadow:0 0 0 6px var(--paper)}
.space-section{position:relative;isolation:isolate;display:flex;align-items:center;min-height:560px;padding:calc(var(--section-y) + var(--seam)) 0 var(--section-y);background:var(--ink-deep);color:var(--paper);overflow:hidden}
.space-backdrop,.menu-backdrop{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.space-backdrop{object-position:50% 44%}
.space-section::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#16222af2,#16222ac4 32%,#16222a1a 75%)}
.space-heading{display:block;width:min(460px,48%);margin:0;padding:0}
.space-heading .section-label{color:var(--kicker-dark)}
.space-heading h2{margin:0 0 20px;font-size:var(--h2-section)}
.space-heading p{font-size:17px;color:#f2eadb;max-width:35ch;line-height:1.8}
.space-caption{position:absolute;bottom:24px;right:max(40px,calc((100vw - 1320px)/2));margin:0;padding:8px 14px;background:#24291ee6;color:#f7efdf;font-size:12px}
.gallery-section{position:relative;background:var(--cream);padding:calc(var(--section-y) + var(--seam)) 0 var(--section-y)}
.gallery-heading{margin-bottom:25px}
.gallery-heading h2{margin:0}
.gallery-heading p{color:var(--quiet);font-size:16px}
.gallery-photo figcaption{font-size:12px;padding-top:12px}
.visit-section{position:relative;background:var(--indigo)}
.visit-details h3,.visit-section .section-label{color:var(--kicker-dark)}
.visit-details p,.visit-details address,.visit-details a{font-size:16px}
.visit-details small{color:#e0e6e4;font-size:12px}
.visit-map{border-top:1px solid #adc0c14d;padding-top:30px}
.visit-map iframe{border:7px solid #e8d8b4}
.site-footer{position:relative;background:var(--ink-deep);padding-top:50px}
.site-footer::before{content:'';position:absolute;top:0;left:0;right:0;height:var(--seam);background:var(--ribbon);border-top:1px solid var(--seam-line)}
.footer-links{font-size:13px}.footer-grid small{font-size:11px}
/* Menu opening: a real table at Commune, followed by a quiet printed-menu surface. */
.menu-hero.wrap{position:relative;isolation:isolate;display:flex;align-items:end;width:100%;max-width:none;min-height:440px;padding:68px 0;border:0;overflow:hidden;background:#302e26;color:var(--paper)}
.menu-backdrop{object-position:center 56%}
.menu-hero::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#1b251fdb,#1b251f55),linear-gradient(90deg,#1b251fa1,transparent 80%)}
.menu-hero-content{display:flex;align-items:end;justify-content:space-between;gap:40px}
.menu-hero .section-label{color:#f8cd7f}
.menu-hero h1{font-size:clamp(5.3rem,8.5vw,9rem);margin-top:20px;letter-spacing:-.04em}
.menu-hero-intro{color:#fff7e7;font:400 clamp(1.5rem,2.6vw,2.15rem)/1.4 var(--serif);max-width:19ch;margin:0 0 7px}
.menu-body{position:relative;padding-top:calc(var(--section-y) + var(--seam));padding-bottom:calc(var(--section-y) + var(--seam));background:var(--cream)}
.menu-body::before{content:'';position:absolute;top:0;left:0;width:100%;height:var(--seam);background:var(--ribbon);border-top:1px solid var(--seam-line);pointer-events:none}
/* Menu top matter: notice, then book button beside the jump links, then one rule above the list. */
.menu-body>.wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:24px;align-items:center}
.menu-body>.wrap>*{grid-column:1/-1}
.menu-body>.wrap>.menu-jumps{grid-column:1;grid-row:2}
.menu-body>.wrap>.book-launch{grid-column:2;grid-row:2;margin:0}
@media(max-width:760px){.menu-body>.wrap{grid-template-columns:minmax(0,1fr)}.menu-body>.wrap>.menu-jumps,.menu-body>.wrap>.book-launch{grid-column:1;grid-row:auto}.menu-body>.wrap>.book-launch{margin:0 0 16px}}
.menu-introduction .draft-notice{margin:0 0 20px;border-left-color:var(--indigo);padding-block:0;font-size:13px;max-width:none}
.draft-notice strong{color:var(--indigo)}
.menu-jumps{padding:0;border:0}
.menu-jumps a{border-color:#b9c3c6;background:var(--paper);color:var(--indigo)}
@media(min-width:761px){.menu-jumps a{min-height:42px;padding:8px 14px;font-size:13px}}
.menu-jumps a:hover{background:var(--indigo);border-color:var(--indigo);color:var(--paper)}
.menu-category{padding-bottom:calc(var(--section-y) - 16px)}
.menu-category+.menu-category{padding-top:16px}
.menu-category-heading{border-bottom-color:#b7a16c;margin-bottom:28px}
.menu-category-heading h2{font-size:var(--h2-sub)}
.menu-category-heading span{color:#775133}
.menu-awaiting{background:#f2e9d7;border-color:#bc914d}
.menu-grid{max-width:none;margin-top:var(--gap-l);padding-top:0;border-top:0}
.coffee-intro p{font-size:15px}
.coffee-group-heading{position:relative;align-items:center;gap:25px;border-color:#c0bea9}
/* Group titles arrive in the printed menu's capitals; one small tracked serif tier for every group. */
.menu-grid .coffee-group-heading h3{color:var(--indigo);font:400 clamp(1.3rem,1.7vw,1.6rem)/1.2 var(--serif);letter-spacing:.06em;text-transform:uppercase}
.coffee-image{background:#f4eee2}
.coffee-copy{padding-top:19px}
.coffee-name-price{align-items:flex-start}
.coffee-name-price h4{padding-top:1px}
.coffee-price{text-align:right;line-height:1.4}
.usd-equivalent{display:block;font:400 12px/1.5 var(--sans);color:var(--quiet);white-space:nowrap;letter-spacing:0;margin-top:2px;font-variant-numeric:tabular-nums}
.coffee-variants .coffee-variant{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.coffee-variants strong{text-align:right;line-height:1.4}
.coffee-variants .usd-equivalent{font-size:12px;font-weight:400;color:var(--quiet)}
.coffee-extra{background:var(--paper);border:1px solid var(--line);padding:14px 18px}
.coffee-extra strong{display:flex;gap:12px;align-items:baseline}
.coffee-extra .usd-equivalent{display:inline}
.menu-footnote{max-width:none;font-size:12px}
.currency-note{display:block;margin-top:10px;max-width:100ch;font-size:12px;line-height:1.7}
.currency-note a{text-decoration:underline;text-underline-offset:3px}
.menu-visit{position:relative;isolation:isolate;overflow:hidden;padding:var(--section-y) 0;background:var(--indigo)}
.visit-section .visit-map iframe{border:4px solid var(--tile-line)}
.menu-visit::before{content:'';position:absolute;inset:0;z-index:-2;background:url('assets/photos/google-01.jpg') center 55%/cover}
.menu-visit::after{content:'';position:absolute;inset:0;z-index:-1;background:#2e4e61eb}
.menu-visit .section-label{color:var(--kicker-dark)}
.menu-visit a{background:var(--ochre);border-color:var(--ochre);color:var(--ink);min-height:48px}
@media(max-width:1050px){.home-intro.wrap{padding-inline:28px;grid-template-columns:minmax(0,240px) minmax(0,1fr)}.space-heading{width:48%}.menu-hero-content{gap:24px}.menu-hero-intro{max-width:17ch}}
@media(max-width:760px){.site-nav a{font-size:12px}.lang-switch{font-size:11px}.space-section{align-items:end}.space-heading{width:100%;max-width:460px}.space-heading p{font-size:16px}.space-section::after{background:linear-gradient(0deg,#16222af5 0%,#16222ad9 35%,#16222a44 75%)}.space-backdrop{object-position:60% center}.space-caption{right:18px;bottom:16px;font-size:11px}.menu-hero.wrap{min-height:390px;padding:55px 0 40px}.menu-hero-content{display:block}.menu-hero h1{font-size:clamp(4.6rem,11vw,7rem)}.menu-hero-intro{max-width:29ch;margin:26px 0 0;font-size:24px}.menu-hero::after{background:linear-gradient(0deg,#1b251ff0,#1b251f44)}.menu-backdrop{object-position:62% center}.menu-introduction .draft-notice{font-size:12px}.coffee-price{text-align:left}.coffee-variants strong{text-align:right}.coffee-extra{gap:20px}.coffee-extra strong{display:block}.coffee-extra .usd-equivalent{display:block}.hero::after{background:linear-gradient(90deg,#16222ad9,#16222a4d),linear-gradient(0deg,#16222a55,transparent)}}
@media(max-width:430px){.home-intro.wrap{padding-inline:20px}.space-heading h2{max-width:11ch}.coffee-group-heading{gap:12px}.menu-grid .coffee-group-heading h3{font-size:1.2rem}.coffee-price{font-size:16px}.coffee-extra{font-size:15px;justify-content:space-between}.menu-hero.wrap{min-height:380px}.menu-hero h1{font-size:4.4rem}.menu-hero-intro{font-size:22px}.visit-map iframe{border-width:4px}.visit-details p,.visit-details address,.visit-details a{font-size:15px}}

/* Compact header and section spacing for the bilingual copy pass. */
@media(max-width:1100px){.header-art{max-width:200px;min-width:60px}.header-inner{gap:20px}.header-inner .site-nav{gap:20px}}
@media(max-width:900px){.header-art{display:none}.header-inner .site-nav{margin-left:auto}}
@media(max-width:760px){.header-inner{min-height:72px}.header-inner .site-nav{margin-left:0}.home-intro.wrap{display:grid;grid-template-columns:150px minmax(0,1fr);gap:22px;padding:calc(var(--section-y) + var(--seam)) 24px var(--section-y)}.home-intro h2{margin-top:0}.home-intro p{font-size:15px}.visit-details{margin-top:28px}.space-section{min-height:480px}.space-heading h2{max-width:none}}
@media(max-width:520px){.home-intro.wrap{display:block;padding:calc(var(--section-y) + var(--seam)) 20px var(--section-y)}.intro-feature{max-width:160px;margin:0 0 24px}.header-inner{gap:10px}}

html[lang=vi]{--serif:'Noto Serif','Times New Roman',serif}
@media(max-width:760px){.header-inner .site-nav{gap:0}}

/* Coworking copy and section edges; supplied room imagery is composed below. */
#coworking{scroll-margin-top:110px}
.coworking-section{background:var(--indigo);color:var(--paper);padding:48px 0 52px}
.coworking-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:7%;align-items:center}
.coworking-section .section-label{color:var(--kicker-dark)}
.coworking-section h2{margin:0}
.coworking-copy>p{font-size:18px;line-height:1.65;margin:0 0 13px;max-width:42ch}
.coworking-copy>p+p{font-size:14px;color:#d9e0dd}
.coworking-actions{display:flex;align-items:center;flex-wrap:wrap;gap:25px;margin-top:22px}
.coworking-actions .button{background:var(--ochre);border-color:var(--ochre);color:var(--ink)}
.coworking-actions .button:hover{background:#f4cc78}
.coworking-actions .arrow-link{font-size:13px}
/* The menu opens with drinks rather than an empty room. */
.menu-hero.wrap{min-height:0;padding:32px 0;background:#ead39e;color:var(--ink)}
.menu-hero::after{display:none}
.menu-hero-content{align-items:center;gap:30px}
.menu-hero .section-label{color:#67472e}
.menu-hero h1{font-size:clamp(4.5rem,7.5vw,7.5rem);margin:15px 0 16px}
.menu-hero-intro{color:var(--indigo);font-size:clamp(1.25rem,2vw,1.75rem);max-width:26ch;margin:0}
.menu-drink-art{display:flex;width:44%;max-width:480px;flex:none;align-items:center;gap:0}
.menu-drink-art img{width:52%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:50%;box-shadow:0 0 0 6px var(--paper)}
.menu-drink-art img+img{margin-left:-4%;transform:translateY(10px)}
@media(max-width:1100px){.header-art{min-width:35px}.header-inner .site-nav{gap:15px}}
@media(max-width:760px){#coworking{scroll-margin-top:155px}.coworking-section{padding:34px 0 38px}.coworking-grid{display:block}.coworking-section h2{margin-bottom:24px}.coworking-copy>p{font-size:16px}.menu-hero.wrap{padding:24px 0}.menu-hero-content{display:flex;gap:12px}.menu-hero h1{font-size:clamp(3.8rem,9vw,5.5rem)}.menu-hero-intro{font-size:18px}.menu-drink-art{width:43%}.header-inner .site-nav{gap:0}}

/* Retain the full brand at the top; compact the sticky masthead while reading. */
.site-header .header-inner,.site-header .brand,.site-header .header-art,.site-header::after,.footer-brand{transition:min-height .2s ease,height .2s ease,width .2s ease,flex-basis .2s ease,gap .2s ease,opacity .2s ease}
.site-header.is-compact .header-inner{min-height:64px;gap:18px}
.site-header.is-compact .brand{width:54px;height:54px;flex-basis:54px}
.site-header.is-compact .header-art{height:34px;max-width:260px}
.site-header.is-compact::after{height:5px}
.footer-brand{width:52px;height:52px}
@media(max-width:1050px){.site-header.is-compact .header-inner{min-height:60px;gap:12px}.site-header.is-compact .brand{width:48px;height:48px;flex-basis:48px}}
@media(max-width:760px){.site-header.is-compact .header-inner{min-height:56px;padding-block:6px;gap:10px}.site-header.is-compact .brand{width:44px;height:44px;flex-basis:44px}.site-header.is-compact .header-art{height:28px}.site-header.is-compact .language-picker summary{min-height:40px;padding-block:7px}.site-header.is-compact .nav-toggle{height:40px}.footer-brand{width:44px;height:44px}}
@media(max-width:430px){.site-header.is-compact .header-inner{min-height:52px;padding-block:4px;gap:8px}.site-header.is-compact .brand{width:40px;height:40px;flex-basis:40px}.site-header.is-compact .language-picker summary{min-height:38px;padding-inline:7px}.footer-brand{width:40px;height:40px}}
@media(prefers-reduced-motion:reduce){.site-header .header-inner,.site-header .brand,.site-header .header-art,.site-header::after,.footer-brand{transition:none}}
@media(max-width:520px){.menu-hero-content{display:block;position:relative}.menu-hero h1{font-size:4.5rem}.menu-hero-intro{max-width:15ch}.menu-drink-art{position:absolute;right:-4px;bottom:-6px;width:40%;max-width:150px;pointer-events:none}.menu-drink-art img:first-child{display:none}.menu-drink-art img+img{width:100%;margin:0;transform:none}.menu-hero-content>div:first-child{position:relative;z-index:1;max-width:64%}.menu-hero .section-label{font-size:9px;letter-spacing:.1em}.coworking-section .section-label{font-size:10px}.coworking-actions{gap:20px}.footer-links{flex-wrap:wrap}}

/* Let the photo sequence follow the mural without a visible filler headline. */
.gallery-heading{margin-bottom:0}
.gallery-heading .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Decorative coconut and beans sit behind the copy, low on the outer edge. */
.home-intro.wrap{overflow:hidden;isolation:isolate}
.home-intro.wrap::before{content:'';position:absolute;z-index:-1;right:-35px;bottom:-50px;width:720px;height:480px;background:url('assets/decoration/coconut-coffee-background.webp') center/contain no-repeat;opacity:.28;pointer-events:none}
.intro-feature,.home-intro.wrap>div{position:relative;z-index:1}
/* Place useful visit information beside the interactive map. */
.visit-section{padding:calc(var(--section-y) + var(--seam)) 0 var(--section-y)}
.visit-grid{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:48px;align-items:start}
.visit-info h2{font:400 var(--h2-sub)/1.15 var(--serif);letter-spacing:-.03em;margin:0 0 25px}
.visit-details{display:block;margin:0;padding:0}
.visit-details>div+div{margin-top:22px}
.visit-details h3{margin:0 0 7px}
.visit-details address{font-size:19px;line-height:1.6;margin-bottom:10px}
.visit-details p{margin-bottom:18px}
.visit-details small{max-width:38ch;margin-top:7px}
.visit-map{width:100%;margin:0;padding:0;border:0}
.visit-map iframe{height:365px;border-width:4px}
.map-directions{margin-top:10px;font-size:13px;min-height:40px}
/* A compact closing strip, with naturally wrapping navigation and notice. */
.site-footer{padding:27px 0 22px}
.footer-grid{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 25px}
.footer-links{flex-wrap:wrap;gap:10px 18px;margin:0;line-height:1.5}
.footer-grid small{flex:0 1 auto;max-width:48ch;margin:0;padding:0;border:0;font-size:11px;line-height:1.5}
@media(max-width:1050px){.visit-grid{gap:28px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.visit-map iframe{height:365px}}
@media(max-width:760px){.home-intro.wrap::before{right:-20px;bottom:-8px;width:330px;height:220px;opacity:.2}.visit-grid{display:grid;grid-template-columns:1fr;gap:25px}.visit-info h2{margin-bottom:22px}.visit-details address{font-size:18px}.visit-map iframe{height:300px}.footer-grid{gap:12px}.footer-grid small{max-width:none}.site-footer{padding:25px 0 22px}}

/* Edited photograph of the supplied room; copy stays left of the worker. */
.coworking-section{position:relative;isolation:isolate;min-height:550px;padding:44px 0;overflow:hidden}
.coworking-backdrop{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.coworking-section::after{content:'';position:absolute;z-index:1;top:0;left:0;right:0;height:var(--seam);background:var(--ribbon);border-top:1px solid var(--seam-line);pointer-events:none}
.coworking-section::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#2e4e61f5 0%,#2e4e61e8 34%,#2e4e6190 48%,#2e4e6120 65%,transparent 80%);pointer-events:none}
.coworking-grid{display:block;position:relative}
.coworking-grid>div{width:min(48%,540px)}
.coworking-section h2{margin:0 0 24px;font-size:var(--h2-section)}
.coworking-copy>p{font-size:17px}
.coworking-copy>p+p{font-size:14px}
.coworking-actions{gap:20px}
@media(max-width:1050px){.coworking-section{min-height:500px;padding:36px 0}.coworking-grid>div{width:52%;max-width:460px}.coworking-backdrop{object-position:63% 55%}}
@media(max-width:760px){.coworking-section{min-height:0;padding:0}.coworking-backdrop{position:static;height:auto;aspect-ratio:3/2;object-fit:cover}.coworking-section::before{display:none}.coworking-grid{padding-block:30px}.coworking-grid>div{width:100%;max-width:none}.coworking-section h2{margin-bottom:22px}.coworking-copy>p{font-size:16px}.coworking-actions{gap:20px;margin-top:20px}}

/* 15 Oct 2026 design pass — menu surfaces, category bands and the site-wide seam.
   One separator everywhere: a 9px ochre ribbon with a 1px line above it, at every join between two sections on both pages.
   Home: header|hero (.site-header::after) · hero|coworking (.coworking-section::after) · coworking|intro (.home-intro::after) ·
   intro|mural (.space-section::before) · mural|gallery (.gallery-section::before) · gallery|Visit (.visit-section::before) · Visit|footer (.site-footer::before).
   Menu: header|hero · hero|list (.menu-body::before) · list|each category band (.menu-category::after) · band|list (.menu-category-heading::after) ·
   list|Visit (.menu-body::after) · Visit|footer. */
.space-section::before,.gallery-section::before,.visit-section::before,.menu-body::after,.menu-category::after,.menu-category-heading::after{content:'';position:absolute;z-index:1;top:0;left:0;right:0;height:var(--seam);background:var(--ribbon);border-top:1px solid var(--seam-line);pointer-events:none}
.menu-body::after,.menu-category-heading::after{top:auto;bottom:0}
.space-section::before{z-index:0}
.menu-body{overflow-x:clip;background:var(--cream)}
.menu-category{position:relative;isolation:isolate;padding-top:0;padding-bottom:var(--section-y)}
.menu-category+.menu-category{padding-top:0}
.menu-category:last-child{padding-bottom:var(--section-y)}
.menu-category::before{content:'';position:absolute;z-index:-2;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:var(--cream)}
#lunch::before{background-color:var(--paper)}
.menu-category-heading{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:clamp(190px,15vw,260px);width:100vw;margin:0 0 var(--gap-l) calc(50% - 50vw);padding:calc(28px + var(--seam)) calc(50vw - 50%) calc(30px + var(--seam));box-sizing:border-box;border:0;color:var(--paper);background:var(--ink-deep) center/cover no-repeat}
.menu-category-heading::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(22,34,42,.88) 0%,rgba(22,34,42,.6) 48%,rgba(22,34,42,.22) 100%),linear-gradient(0deg,rgba(22,34,42,.55),transparent 55%)}
.menu-category-heading h2{font-size:var(--h2-section);color:var(--paper);margin:0;text-shadow:0 1px 2px rgba(0,0,0,.25)}
.menu-category-heading span{color:var(--kicker-dark)}
#breakfast .menu-category-heading{background-image:url('assets/photos/corner-09.jpeg');background-position:38% 30%}
#lunch .menu-category-heading{background-image:url('assets/photos/mural-warm-v7.jpg');background-position:center 40%}
#drinks .menu-category-heading{background-image:url('assets/photos/google-04.jpg');background-position:center 45%}
.menu-introduction .draft-notice{background:var(--tile);border:1px solid var(--tile-line);padding:12px 16px;border-radius:var(--radius)}
.menu-jumps a{border-radius:var(--radius)}
/* The list is the densest page on the site, so it gets a wider column on large monitors (header and hero widen with it on this page). */
@media(min-width:1600px){body[data-page=menu] .wrap:not(.menu-hero){width:min(calc(100% - 96px),1440px)}}
@media(max-width:760px){.menu-category-heading{min-height:170px;padding:calc(22px + var(--seam)) calc(50vw - 50%) calc(22px + var(--seam))}}