:root {
  --olive:#344337;
  --cream:#f7f3eb;
  --terracotta:#a6533a;
  --ink:#272b25;
  --muted:#77796e;
  --paper:#fffdf8;
  --line:#ded8cb;
  --serif:"Playfair Display",Georgia,serif;
  --sans:"DM Sans",Arial,sans-serif;
  --shadow:0 24px 70px #171b1830;
  color-scheme:light
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:122px;
  overflow-x:clip
}
body {
  overflow-x:clip
}
body {
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font:400 15px/1.6 var(--sans);
  -webkit-font-smoothing:antialiased
}
body.modal-open {
  overflow:hidden
}
a {
  color:inherit
}
button,input,select {
  font:inherit
}
button {
  color:inherit
}
.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
}
.skip-link {
  position:fixed;
  top:8px;
  left:8px;
  z-index:100;
  background:var(--paper);
  padding:12px 18px;
  transform:translateY(-160%);
  border-radius:3px
}
.skip-link:focus {
  transform:none
}
:focus-visible {
  outline:3px solid var(--terracotta);
  outline-offset:3px
}
.site-header {
  min-height:680px;
  padding:24px clamp(20px,7vw,100px) 0;
  background:var(--olive);
  color:#f9f5e9;
  position:relative;
  display:flex;
  align-items:center;
  flex-direction:column;
  overflow:hidden
}
.site-header:before,.site-header:after {
  content:"";
  position:absolute;
  border:1px solid #f9f5e919;
  border-radius:50%;
  width:560px;
  height:560px;
  pointer-events:none
}
.site-header:before {
  top:-375px;
  left:-220px
}
.site-header:after {
  bottom:-445px;
  right:-170px
}
.header-tools {
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  position:relative;
  z-index:1
}
.eyebrow,.detail-label {
  font-size:10px;
  letter-spacing:.19em;
  text-transform:uppercase;
  font-weight:600
}
.header-tools .eyebrow {
  color:#e2d8bf
}
.tool-actions {
  display:flex;
  gap:8px;
  align-items:center
}
.tool-actions select,.icon-button {
  height:42px;
  border:1px solid #ffffff44;
  background:transparent;
  color:#fff;
  border-radius:2px;
  padding:0 12px
}
.tool-actions select {
  font-size:12px;
  min-width:88px
}
.tool-actions option {
  color:var(--ink)
}
.icon-button {
  width:42px;
  padding:0;
  font-size:18px;
  cursor:pointer
}
.brand {
  margin-top:61px;
  text-align:center;
  text-decoration:none;
  position:relative;
  z-index:1
}
.brand-mark {
  font:600 19px var(--serif);
  letter-spacing:.13em;
  color:var(--terracotta);
  display:block
}
.brand-mark span {
  color:#d8c8a8;
  font-size:13px;
  padding:0 3px
}
.brand-name {
  display:block;
  font:500 clamp(33px,6vw,60px)/1.15 var(--serif);
  letter-spacing:-.025em;
  margin-top:8px
}
.tagline {
  font:italic 17px var(--serif);
  color:#e5ddcd;
  margin:15px 0 0
}
.header-rule {
  display:flex;
  gap:16px;
  align-items:center;
  width:min(280px,55vw);
  margin:34px 0 30px;
  color:#d9c8a6
}
.header-rule>span:not(.rule-ornament) {
  height:1px;
  flex:1;
  background:#f8f4e94a
}
.rule-ornament {
  font-size:15px
}
.restaurant-details {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  width:min(760px,100%);
  text-align:center;
  position:relative;
  z-index:1
}
.detail-block {
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:0 18px;
  font-size:13px
}
.detail-block+.detail-block {
  border-left:1px solid #ffffff30
}
.detail-label {
  color:#c7c8b7;
  font-size:9px;
  margin-bottom:5px
}
.detail-block a {
  text-decoration:none
}
.text-link {
  color:#dfb39f;
  font-size:12px
}
.text-link:hover {
  text-decoration:underline
}
.open-status {
  font-size:11px;
  color:#c8d3bd
}
.open-status.closed {
  color:#e6b3a1
}
.header-bottom {
  position:absolute;
  bottom:0;
  left:clamp(20px,7vw,100px);
  right:clamp(20px,7vw,100px);
  height:56px;
  border-top:1px solid #ffffff32;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:10px;
  letter-spacing:.09em;
  color:#d0d0c1;
  text-transform:uppercase
}
.scroll-cue {
  font-size:19px;
  color:#dfb39f
}
main {
  max-width:1120px;
  margin:auto;
  padding:0 clamp(20px,6vw,80px)
}
.menu-intro {
  text-align:center;
  padding:80px 16px 37px
}
.menu-intro .eyebrow {
  color:var(--terracotta)
}
.menu-intro h1 {
  font:500 clamp(39px,6vw,62px)/1.13 var(--serif);
  letter-spacing:-.03em;
  margin:14px 0 17px
}
.menu-intro h1 em {
  font-weight:400;
  color:var(--olive)
}
.intro-copy {
  max-width:530px;
  margin:0 auto;
  color:var(--muted);
  font-size:14px
}
.menu-controls {
  max-width:730px;
  margin:34px auto 32px
}
.search-wrap {
  display:flex;
  align-items:center;
  height:50px;
  border-bottom:1px solid var(--line);
  gap:12px
}
.search-icon {
  font-size:27px;
  color:var(--terracotta);
  line-height:1;
  transform:rotate(-20deg)
}
.search-wrap input {
  border:0;
  outline:0;
  background:transparent;
  color:var(--ink);
  flex:1;
  min-width:0;
  height:100%;
  font-size:14px
}
.search-wrap input::placeholder {
  color:#99978e
}
.clear-search {
  border:0;
  background:none;
  font-size:23px;
  width:44px;
  height:44px;
  cursor:pointer;
  color:var(--muted)
}
.filter-chips {
  display:flex;
  gap:8px;
  justify-content:center;
  flex-wrap:wrap;
  padding-top:17px
}
.filter-chip {
  background:transparent;
  border:1px solid var(--line);
  border-radius:50px;
  padding:7px 14px;
  min-height:38px;
  font-size:11px;
  cursor:pointer;
  transition:background .2s,color .2s,border-color .2s
}
.filter-chip:hover,.filter-chip[aria-pressed=true] {
  background:var(--olive);
  color:#fff;
  border-color:var(--olive)
}
.category-nav {
  position:sticky;
  top:0;
  z-index:5;
  background:var(--cream);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  margin:0 calc(clamp(20px,6vw,80px)*-1);
  padding:0 clamp(15px,6vw,80px);
  overflow-x:auto;
  scrollbar-width:none
}
.category-nav::-webkit-scrollbar {
  display:none
}
.category-nav>div {
  display:flex;
  justify-content:center;
  min-width:max-content;
  gap:clamp(20px,4vw,52px)
}
.category-link {
  position:relative;
  display:block;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:10px;
  font-weight:600;
  color:var(--muted);
  padding:17px 2px;
  min-height:50px;
  transition:color .18s
}
.category-link:after {
  content:"";
  height:2px;
  background:var(--terracotta);
  position:absolute;
  bottom:-1px;
  left:0;
  right:100%;
  transition:right .2s
}
.category-link.active {
  color:var(--olive)
}
.category-link.active:after {
  right:0
}
.menu-sections {
  padding:24px 0 82px
}
.menu-section {
  padding:41px 0 30px;
  scroll-margin-top:112px
}
.section-heading {
  text-align:center;
  margin-bottom:23px
}
.section-heading .eyebrow {
  color:var(--terracotta)
}
.section-heading h2 {
  font:500 36px/1.15 var(--serif);
  margin:5px 0 6px
}
.section-heading p {
  margin:0;
  color:var(--muted);
  font:italic 14px var(--serif)
}
.item-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:54px;
  row-gap:0
}
.menu-item {
  min-width:0;
  display:grid;
  grid-template-columns:60px minmax(0,1fr) auto;
  align-items:start;
  gap:13px;
  padding:18px 0 18px;
  border-bottom:1px solid var(--line);
  cursor:pointer;
  transition:opacity .2s,transform .2s
}
.menu-item:hover .item-name {
  color:var(--terracotta)
}
.menu-item:focus-visible {
  outline-offset:2px
}
.item-thumb {
  width:60px;
  height:60px;
  border-radius:50%;
  overflow:hidden;
  background:linear-gradient(145deg,#d9bd8a,#8d6244);
  display:grid;
  place-items:center;
  color:#fff7e8;
  font:500 20px var(--serif);
  flex-shrink:0
}
.item-thumb img {
  width:100%;
  height:100%;
  object-fit:cover
}
.item-copy {
  min-width:0
}
.item-heading-line {
  display:flex;
  align-items:baseline;
  gap:7px;
  min-width:0
}
.item-name {
  font:500 17px/1.2 var(--serif);
  transition:color .2s
}
.leader {
  border-bottom:1px dotted #aaa392;
  flex:1;
  min-width:7px;
  transform:translateY(-4px)
}
.item-price {
  font-size:13px;
  font-weight:600;
  white-space:nowrap
}
.item-description {
  font-size:11px;
  color:var(--muted);
  margin:6px 0 0;
  line-height:1.5
}
.item-meta {
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin-top:8px
}
.tag {
  font-size:8px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--olive);
  background:#34433712;
  padding:3px 6px;
  border-radius:2px
}
.tag.spicy {
  color:#99452f;
  background:#b85f4317
}
.tag.chefPick {
  color:#8b6133;
  background:#c69c5e20
}
.tag.new {
  color:#596d70;
  background:#596d7017
}
.no-results {
  text-align:center;
  padding:65px 20px 95px
}
.no-results-icon {
  font-size:38px;
  color:var(--terracotta)
}
.no-results h2 {
  font:500 28px var(--serif);
  margin:6px
}
.no-results p {
  color:var(--muted)
}
.text-button {
  border:0;
  background:none;
  color:var(--terracotta);
  text-decoration:underline;
  padding:10px;
  cursor:pointer
}
.site-footer {
  background:var(--olive);
  color:#f7f3eb;
  text-align:center;
  padding:50px clamp(20px,6vw,80px) 20px
}
.footer-brand {
  font:500 15px var(--serif);
  letter-spacing:.03em
}
.footer-brand .brand-mark {
  margin-bottom:8px
}
.site-footer>p {
  max-width:570px;
  margin:19px auto;
  color:#d7d7ca;
  font-size:11px;
  line-height:1.7
}
.footer-bottom {
  max-width:960px;
  border-top:1px solid #ffffff30;
  padding-top:15px;
  margin:32px auto 0;
  display:flex;
  justify-content:space-between;
  font-size:10px;
  color:#d7d7ca
}
.footer-bottom a {
  color:#e1b09b;
  text-decoration:none
}
.back-top {
  position:fixed;
  z-index:6;
  bottom:20px;
  right:20px;
  width:46px;
  height:46px;
  border-radius:50%;
  border:1px solid var(--line);
  background:var(--paper);
  color:var(--olive);
  font-size:20px;
  box-shadow:0 5px 20px #0002;
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:.2s
}
.back-top.visible {
  opacity:1;
  visibility:visible;
  transform:none
}
.item-dialog {
  border:0;
  padding:0;
  background:transparent;
  width:min(530px,100%);
  max-width:none;
  max-height:min(88dvh,820px);
  overflow:visible;
  color:var(--ink)
}
.item-dialog::backdrop {
  background:#171c18a8;
  backdrop-filter:blur(3px)
}
.dialog-panel {
  max-height:min(88dvh,820px);
  overflow:auto;
  background:var(--paper);
  position:relative;
  box-shadow:var(--shadow);
  border-radius:5px;
  transform:translateY(18px);
  transition:transform .25s
}
.item-dialog[open] .dialog-panel {
  transform:translateY(0)
}
.dialog-close {
  position:absolute;
  z-index:2;
  top:12px;
  right:12px;
  border:0;
  border-radius:50%;
  width:42px;
  height:42px;
  background:#fffdf0e8;
  font-size:25px;
  cursor:pointer
}
.dialog-image {
  height:220px;
  background:linear-gradient(145deg,#d9bd8a,#8d6244);
  background-size:cover;
  background-position:center
}
.dialog-image.placeholder {
  background-image:radial-gradient(ellipse at 25% 25%,#e7c990 0,transparent 38%),radial-gradient(ellipse at 78% 74%,#725b43 0,transparent 43%),linear-gradient(135deg,#ab7750,#445443)
}
.dialog-content {
  padding:26px 34px 32px
}
.dialog-content .eyebrow {
  color:var(--terracotta)
}
.dialog-content h2 {
  font:500 34px/1.15 var(--serif);
  margin:8px 0
}
.dialog-description {
  color:var(--muted);
  font-size:14px
}
.dialog-tags {
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin:15px 0
}
.allergens-block {
  border-top:1px solid var(--line);
  padding-top:14px;
  margin-top:20px
}
.allergens-block p {
  font-size:12px;
  color:var(--muted);
  margin:5px 0
}
.dialog-variants {
  margin-top:18px
}
.variant-row {
  display:flex;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
  padding:8px 0;
  font-size:13px
}
.dialog-price {
  font:500 22px var(--serif);
  color:var(--terracotta);
  text-align:right;
  margin-top:14px
}
.noscript {
  padding:20px;
  text-align:center
}
.dark-mode {
  --cream:#202821;
  --paper:#2a342c;
  --ink:#f1ebdf;
  --muted:#c0bdae;
  --line:#465047;
  --olive:#303e33;
  color-scheme:dark
}
.dark-mode .menu-intro h1 em {
  color:#d4dccd
}
.dark-mode .filter-chip[aria-pressed=true],.dark-mode .filter-chip:hover {
  background:#e8e1d2;
  color:#233027;
  border-color:#e8e1d2
}
.dark-mode .tag {
  background:#dfe9dc20;
  color:#dbe4d5
}
.dark-mode .site-header {
  background:#29382d
}
.dark-mode .site-footer {
  background:#29382d
}
.dark-mode .item-thumb {
  filter:saturate(.8)
}
@media(max-width:700px) {
  html {
    scroll-padding-top:108px
  }
  .site-header {
    min-height:620px;
    padding:16px 20px 0
  }
  .header-tools .eyebrow {
    font-size:8px;
    letter-spacing:.12em
  }
  .brand {
    margin-top:68px
  }
  .brand-name {
    font-size:43px
  }
  .tagline {
    font-size:15px;
    max-width:310px
  }
  .restaurant-details {
    grid-template-columns:1fr;
    gap:0;
    max-width:300px
  }
  .detail-block {
    padding:10px 0;
    font-size:12px
  }
  .detail-block+.detail-block {
    border-left:0;
    border-top:1px solid #ffffff30
  }
  .detail-label {
    margin-bottom:1px
  }
  .header-rule {
    margin:24px 0
  }
  .header-bottom {
    font-size:8px;
    letter-spacing:.04em
  }
  .menu-intro {
    padding:58px 0 22px
  }
  .menu-intro h1 {
    font-size:43px
  }
  .intro-copy {
    font-size:13px
  }
  .menu-controls {
    margin:24px auto 23px
  }
  .filter-chips {
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow:auto;
    margin:0 -20px;
    padding:14px 20px 6px;
    scrollbar-width:none
  }
  .filter-chips::-webkit-scrollbar {
    display:none
  }
  .filter-chip {
    white-space:nowrap;
    min-height:42px
  }
  .category-nav {
    margin:0 -20px;
    padding:0 20px
  }
  .category-nav>div {
    justify-content:flex-start;
    gap:28px
  }
  .category-link {
    font-size:9px;
    padding:16px 1px
  }
  .menu-sections {
    padding:12px 0 58px
  }
  .menu-section {
    padding:34px 0 18px
  }
  .section-heading {
    margin-bottom:14px
  }
  .section-heading h2 {
    font-size:32px
  }
  .item-list {
    grid-template-columns:1fr;
    column-gap:0
  }
  .menu-item {
    grid-template-columns:50px minmax(0,1fr) auto;
    gap:11px;
    padding:15px 0
  }
  .item-thumb {
    width:50px;
    height:50px
  }
  .item-name {
    font-size:16px
  }
  .item-description {
    font-size:11px
  }
  .item-price {
    font-size:12px
  }
  .site-footer {
    padding-top:40px
  }
  .footer-bottom {
    gap:10px;
    align-items:center
  }
  .footer-bottom span {
    max-width:65%;
    text-align:left
  }
  .item-dialog {
    position:fixed;
    inset:auto 0 0;
    width:100%;
    max-height:90dvh;
    margin:0
  }
  .dialog-panel {
    border-radius:14px 14px 0 0;
    max-height:90dvh;
    transform:translateY(100%)
  }
  .item-dialog[open] .dialog-panel {
    transform:translateY(0)
  }
  .dialog-image {
    height:200px
  }
  .dialog-content {
    padding:23px 24px calc(26px + env(safe-area-inset-bottom))
  }
  .dialog-content h2 {
    font-size:30px
  }
}
@media(max-width:380px) {
  .site-header {
    min-height:600px
  }
  .brand-name {
    font-size:37px
  }
  .header-tools .eyebrow {
    max-width:125px;
    line-height:1.4
  }
  .item-thumb {
    width:44px;
    height:44px
  }
  .menu-item {
    grid-template-columns:44px minmax(0,1fr) auto;
    gap:9px
  }
  .item-name {
    font-size:15px
  }
  .item-price {
    font-size:11px
  }
  .footer-bottom {
    font-size:9px
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important
  }
}
@media print {
  .site-header {
    min-height:0;
    background:#fff;
    color:#222;
    padding:0 0 12px
  }
  .site-header:before,.site-header:after,.header-tools,.header-bottom,.header-rule,.menu-controls,.category-nav,.back-top,.dialog-close,.item-dialog {
    display:none!important
  }
  .brand {
    margin:0
  }
  .brand-mark {
    font-size:12px
  }
  .brand-name {
    font-size:30px;
    color:#222
  }
  .tagline {
    color:#444;
    font-size:12px;
    margin:3px
  }
  .restaurant-details {
    margin-top:12px;
    color:#222
  }
  .detail-label {
    color:#444
  }
  .text-link {
    color:#333
  }
  .menu-intro {
    padding:18px 0 10px
  }
  .menu-intro h1 {
    font-size:25px;
    margin:3px
  }
  .intro-copy {
    font-size:10px
  }
  .menu-sections {
    padding:0
  }
  .menu-section {
    padding:12px 0;
    break-inside:avoid
  }
  .section-heading {
    margin-bottom:4px
  }
  .section-heading h2 {
    font-size:20px
  }
  .section-heading p {
    font-size:10px
  }
  .item-list {
    grid-template-columns:repeat(2,1fr);
    column-gap:26px
  }
  .menu-item {
    grid-template-columns:minmax(0,1fr) auto;
    padding:6px 0;
    gap:8px
  }
  .item-thumb,.item-meta {
    display:none
  }
  .item-name {
    font-size:12px
  }
  .item-description {
    font-size:9px;
    margin-top:2px
  }
  .item-price {
    font-size:10px
  }
  .site-footer {
    background:#fff;
    color:#222;
    padding:10px 0
  }
  .site-footer>p {
    color:#333;
    font-size:8px;
    margin:4px auto
  }
  .footer-brand,.footer-bottom {
    display:none
  }
  body {
    background:#fff;
    color:#222;
    font-size:10px
  }
}
@media(max-width:700px) {
  .site-header {
    min-height:760px
  }
}
@media(max-width:380px) {
  .site-header {
    min-height:740px
  }
}
.dark-mode {
  --terracotta:#e0a080
}
@media print {
  .item-thumb-wrap {
    display:none!important
  }
}
