:root {
  --cream: #f6f0e7;
  --paper: #fffdf9;
  --ink: #211b19;
  --muted: #756b65;
  --wine: #652f39;
  --wine-dark: #432027;
  --teal: #2e6670;
  --gold: #c29a62;
  --line: #e2d8cc;
  --serif: "DM Serif Display", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: var(--sans); font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 100; padding: 10px 15px; color: white; background: var(--wine); transform: translateY(-150%); }
.skip-link:focus { transform: none; }

.menu-header { position: absolute; top: 0; left: 0; z-index: 20; display: grid; width: 100%; height: 76px; padding: 10px max(18px, env(safe-area-inset-left)); grid-template-columns: 44px 1fr 44px; align-items: center; color: white; }
.menu-header a:not(.menu-logo) { display: grid; width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; background: rgba(30,20,18,.18); backdrop-filter: blur(8px); place-items: center; }
.menu-header svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.menu-logo { width: 158px; height: 52px; margin: auto; }
.menu-logo img { width: 100%; height: 100%; object-fit: contain; }

.menu-hero { position: relative; display: flex; min-height: 455px; overflow: hidden; color: white; align-items: flex-end; }
.menu-hero > img, .hero-overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
.menu-hero > img { object-fit: cover; object-position: 57% center; }
.hero-overlay { background: linear-gradient(180deg, rgba(24,15,14,.18), rgba(25,16,15,.28) 35%, rgba(25,16,15,.9) 100%); }
.hero-content { position: relative; z-index: 1; width: 100%; max-width: 720px; margin: 0 auto; padding: 100px 22px 35px; }
.eyebrow { display: block; margin-bottom: 7px; color: var(--wine); font-size: .67rem; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.hero-content .eyebrow { color: #ead2b5; }
.hero-content h1 { margin: 0; font-family: var(--serif); font-size: clamp(3rem, 15vw, 4.6rem); font-weight: 400; line-height: .96; letter-spacing: -.035em; }
.hero-content > p { max-width: 350px; margin: 15px 0 18px; color: rgba(255,255,255,.86); font-size: .94rem; }
.open-status { display: inline-flex; gap: 8px; padding: 7px 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 30px; background: rgba(17,12,11,.25); align-items: center; backdrop-filter: blur(8px); font-size: .7rem; }
.open-status span { width: 7px; height: 7px; border-radius: 50%; background: #83c796; box-shadow: 0 0 0 4px rgba(131,199,150,.15); }
.open-status.is-closed span { background: #d99b92; box-shadow: 0 0 0 4px rgba(217,155,146,.15); }

.menu-tools { position: sticky; top: 0; z-index: 15; padding: 14px 0 11px; border-bottom: 1px solid rgba(101,47,57,.09); background: rgba(246,240,231,.94); backdrop-filter: blur(16px); }
.search-wrap { position: relative; width: calc(100% - 36px); max-width: 684px; margin: 0 auto 11px; }
.search-wrap > svg { position: absolute; top: 50%; left: 15px; width: 19px; fill: none; stroke: var(--muted); stroke-width: 1.8; transform: translateY(-50%); }
.search-wrap input { width: 100%; height: 48px; padding: 0 43px; border: 1px solid var(--line); border-radius: 16px; outline: 0; color: var(--ink); background: var(--paper); font-size: .88rem; transition: border-color .2s, box-shadow .2s; }
.search-wrap input:focus { border-color: var(--wine); box-shadow: 0 0 0 3px rgba(101,47,57,.09); }
.search-wrap input::placeholder { color: #978d87; }
.clear-search { position: absolute; top: 50%; right: 9px; width: 32px; height: 32px; border: 0; border-radius: 50%; color: var(--muted); background: #eee6dc; cursor: pointer; transform: translateY(-50%); }
.category-tabs { display: flex; gap: 7px; max-width: 720px; margin: auto; padding: 0 18px 3px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
.category-tabs::-webkit-scrollbar, .featured-track::-webkit-scrollbar { display: none; }
.category-tab { display: flex; flex: 0 0 auto; gap: 7px; height: 37px; padding: 0 13px; border: 1px solid var(--line); border-radius: 30px; background: transparent; cursor: pointer; align-items: center; scroll-snap-align: start; font-size: .76rem; font-weight: 600; }
.category-tab span { color: var(--muted); font-size: .63rem; }
.category-tab.is-active { border-color: var(--wine); color: white; background: var(--wine); }
.category-tab.is-active span { color: #ead8d5; }

.featured, .menu-list { max-width: 720px; margin: auto; }
.featured { padding: 42px 0 48px; overflow: hidden; }
.section-heading, .list-intro { display: flex; padding: 0 20px; align-items: flex-end; justify-content: space-between; }
.section-heading h2, .list-intro h2, .visit-card h2 { margin: 0; font-family: var(--serif); font-size: 2.05rem; font-weight: 400; line-height: 1; letter-spacing: -.02em; }
.section-heading > span { padding-bottom: 3px; color: var(--muted); font-size: .68rem; }
.featured-track { display: flex; gap: 12px; margin-top: 18px; padding: 0 20px 4px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x mandatory; }
.featured-card { position: relative; flex: 0 0 72%; height: 260px; overflow: hidden; border-radius: 22px; color: white; background: #321e1a; box-shadow: 0 12px 30px rgba(50,32,26,.13); scroll-snap-align: center; }
.featured-card > img { width: 100%; height: 100%; object-fit: cover; }
.featured-card::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, transparent 34%, rgba(27,17,15,.88)); }
.featured-card > div { position: absolute; right: 17px; bottom: 16px; left: 17px; z-index: 1; }
.featured-card span { color: #dec4a4; font-size: .62rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.featured-card h3 { margin: 3px 0 7px; font-family: var(--serif); font-size: 1.55rem; font-weight: 400; line-height: 1; }
.featured-card strong { font-size: .75rem; }

.menu-list { padding: 43px 0 55px; border-radius: 28px 28px 0 0; background: var(--paper); }
.list-intro { margin-bottom: 29px; }
.result-count { padding-bottom: 3px; color: var(--muted); font-size: .7rem; }
.menu-group { scroll-margin-top: 128px; }
.menu-group + .menu-group { margin-top: 47px; }
.menu-group > header { display: flex; gap: 13px; margin: 0 20px 4px; padding-bottom: 15px; border-bottom: 2px solid var(--ink); align-items: center; }
.group-icon { display: grid; flex: 0 0 40px; width: 40px; height: 40px; border-radius: 13px; color: white; background: var(--wine); place-items: center; font-family: var(--serif); font-size: 1.05rem; }
.menu-group:nth-child(even) .group-icon { background: var(--teal); }
.menu-group > header h3 { margin: 0 0 1px; font-family: var(--serif); font-size: 1.48rem; font-weight: 400; line-height: 1; }
.menu-group > header p { margin: 0; color: var(--muted); font-size: .68rem; }
.items { padding: 0 20px; }
.menu-item { display: flex; gap: 18px; min-height: 92px; padding: 18px 0; border-bottom: 1px solid var(--line); justify-content: space-between; transition: opacity .18s, transform .18s; }
.menu-item > div { min-width: 0; }
.menu-item h4 { margin: 0; font-family: var(--serif); font-size: 1.09rem; font-weight: 400; line-height: 1.24; }
.menu-item h4 > span { color: var(--muted); font-family: var(--sans); font-size: .64rem; font-weight: 600; white-space: nowrap; }
.menu-item p { max-width: 440px; margin: 6px 0 0; color: var(--muted); font-size: .72rem; line-height: 1.52; }
.menu-item > strong { flex: 0 0 auto; padding-top: 2px; color: var(--wine); font-size: .78rem; white-space: nowrap; }
.menu-item strong small { font-size: .56rem; font-weight: 600; }
.item-title { display: flex; flex-wrap: wrap; gap: 6px 9px; align-items: center; }
.item-title > span { padding: 3px 7px; border-radius: 20px; color: var(--wine); background: #f0e0dc; font-size: .52rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.is-special .item-title > span { color: #275d65; background: #dfeeed; }
.compact-items .menu-item { min-height: 62px; align-items: center; }
.menu-item.is-hidden, .menu-group.is-hidden { display: none; }
.menu-item.is-entering { opacity: 0; transform: translateY(6px); }

.empty-state { padding: 55px 28px 35px; text-align: center; }
.empty-state > span { display: block; margin-bottom: 13px; font-size: 2rem; }
.empty-state h3 { margin: 0 0 5px; font-family: var(--serif); font-size: 1.55rem; font-weight: 400; }
.empty-state p { margin: 0 0 19px; color: var(--muted); font-size: .8rem; }
.empty-state button { padding: 10px 17px; border: 0; border-radius: 30px; color: white; background: var(--wine); cursor: pointer; font-size: .76rem; font-weight: 600; }

.visit-card { max-width: 680px; margin: 34px 18px; padding: 35px 27px; overflow: hidden; border-radius: 25px; color: white; background: var(--wine); }
.visit-card .eyebrow { color: #d8b991; }
.visit-card h2 { font-size: 2.25rem; }
.visit-card > p { margin: 16px 0 22px; color: #dfcdcf; font-size: .78rem; }
.visit-card > div { display: flex; flex-wrap: wrap; gap: 9px; }
.visit-card a { display: flex; gap: 17px; padding: 10px 14px; border: 1px solid rgba(255,255,255,.35); border-radius: 30px; align-items: center; font-size: .71rem; font-weight: 600; }

footer { padding: 35px 20px calc(85px + env(safe-area-inset-bottom)); color: #a99e98; background: #211c1b; text-align: center; font-size: .65rem; }
footer img { width: 148px; height: 50px; margin: 0 auto 14px; object-fit: contain; }
footer p { margin: 5px 0; }
.floating-action { position: fixed; right: 18px; bottom: calc(17px + env(safe-area-inset-bottom)); z-index: 25; display: grid; width: 53px; height: 53px; border: 3px solid var(--paper); border-radius: 50%; color: white; background: #25d366; box-shadow: 0 8px 25px rgba(20,40,25,.28); place-items: center; }
.floating-action svg { width: 25px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.floating-action svg path:last-child { fill: currentColor; stroke: none; }

a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid #65bec4; outline-offset: 3px; }
@media (min-width: 560px) {
  .featured-card { flex-basis: 47%; }
  .visit-card { margin-inline: auto; }
}
@media (min-width: 800px) {
  .menu-hero { min-height: 530px; }
  .hero-content { padding-inline: 0; }
  .menu-tools { padding-top: 17px; }
  .search-wrap { width: 100%; }
  .category-tabs { padding-inline: 0; }
  .featured, .menu-list { max-width: 900px; }
  .featured-card { flex-basis: 31%; }
  .menu-list { padding-inline: 36px; }
  .menu-group > header, .items { margin-inline: 0; padding-inline: 0; }
  .items { display: grid; grid-template-columns: 1fr 1fr; column-gap: 42px; }
  .menu-item { min-height: 112px; }
  .compact-items .menu-item { min-height: 66px; }
  .visit-card { max-width: 828px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: .01ms !important; } }