.mbar{position:relative}
.mhead{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,72px);align-items:end;max-width:var(--max);margin:0 auto;padding:clamp(16px,3vw,48px) var(--edge) clamp(40px,5vw,72px)}
.mhead h1{font-size:clamp(4.5rem,2rem + 9vw,12rem)}
.mhead .lead{font-size:var(--lead);line-height:1.4;max-width:34ch;margin:18px 0 0}
.mpic{margin:0}
.mpic img{width:100%;aspect-ratio:1/1;object-fit:cover;max-width:640px;margin-left:auto}
.tools{margin-top:clamp(24px,3vw,40px);display:grid;gap:12px;max-width:640px}
.ql{font-weight:500}
#q{font:inherit;font-size:max(16px,var(--body));min-height:56px;padding:0 18px;background:#f6e3da;color:var(--ink);border:0;border-radius:0;box-shadow:inset 0 0 0 2px var(--ink);width:100%}
#q::placeholder{color:#7a5b68}
.filters{display:flex;flex-wrap:wrap;gap:8px}
.filters button{font:inherit;font-size:var(--small);font-weight:500;min-height:48px;padding:0 18px;border:0;border-radius:0;cursor:pointer;background:var(--surface);color:var(--ink);transition:background-color .2s,transform .15s}
.filters button:hover{background:#dcb29f}
.filters button:active{transform:translateY(1px)}
.filters button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.count{min-height:1.5em;color:var(--muted);font-size:var(--small)}

.cats{position:sticky;top:0;z-index:4;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;background:var(--ink);padding:0 var(--edge)}
.cats::-webkit-scrollbar{display:none}
.cats a{flex:none;display:inline-flex;align-items:center;min-height:56px;padding:0 14px;color:var(--field-ink);text-decoration:none;font-weight:500;font-size:var(--small);white-space:nowrap}
.cats a:hover{text-decoration:underline;text-underline-offset:5px}
.cats a.on{background:var(--field-ink);color:var(--ink)}

.mgroups{max-width:var(--max);margin:0 auto;padding:clamp(40px,5vw,80px) var(--edge) 0}
.mgroup{scroll-margin-top:72px;padding-bottom:clamp(56px,6vw,96px);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:clamp(32px,5vw,96px);align-items:start}
.mgroup .gh{position:sticky;top:80px}
.mgroup h2{font-size:clamp(2.6rem,1.6rem + 2.8vw,4.6rem)}
.gnote{margin-top:12px;color:var(--muted);max-width:40ch}
.mgroup .dishes{margin-top:0;gap:22px clamp(28px,3.5vw,64px);max-width:none;grid-template-columns:1fr 1fr}
.dishes li.sub{grid-column:1/-1;display:block;font-weight:500;padding-top:12px;color:var(--ink)}
.nothing{font-size:var(--lead)}
.allergen{max-width:var(--max);margin:0 auto;padding:clamp(40px,5vw,72px) var(--edge);background:var(--surface)}
.allergen h2{font-size:clamp(2.2rem,1.4rem + 2vw,3.6rem);margin-bottom:16px}
.allergen p{max-width:60ch;margin-top:8px}
@media (min-width:1600px){.allergen{max-width:calc(var(--max) - 2 * var(--edge))}}
@media (max-width:999px){
  .mhead{grid-template-columns:1fr}
  .mpic{order:-1;margin:0 calc(var(--edge) * -1)}
  .mpic img{aspect-ratio:16/10;max-width:none}
  .mgroup{grid-template-columns:1fr}
  .mgroup .gh{position:static}
  .mgroup .dishes{margin-top:24px;grid-template-columns:1fr}
}