/* Menu chooser, category tiles, one-category pages, sauces & sides, À la carte theme. */
.sec-label { margin: 22px 4px 12px; font-size: 13px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: var(--orange); }

/* ---------- chooser: Fast Food or À la carte ---------- */
.theme-chooser { background: var(--cream); }
.chooser { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; padding: calc(10px + var(--safe-top)) 16px calc(28px + var(--safe-bottom)); max-width: 560px; margin: 0 auto; }
.ch-top { display: flex; justify-content: space-between; align-items: center; }
.ch-head { text-align: center; margin: 18px 0 22px; animation: rise .5s cubic-bezier(.2,.8,.2,1); }
.ch-head img { width: min(210px, 60vw); height: auto; margin: 0 auto 14px; }
.foot img { height: auto; }
.ch-city { margin: 0; font-size: 13px; font-weight: 900; letter-spacing: .2em; text-transform: uppercase; color: var(--orange); }
.ch-head h1 { margin: 4px 0 0; font-size: 28px; font-weight: 900; color: var(--green); letter-spacing: -.01em; }
.ch-list { display: grid; gap: 16px; animation: rise .6s cubic-bezier(.2,.8,.2,1); }
.ch-card {
  position: relative; overflow: hidden; display: flex; align-items: center; gap: 16px; text-decoration: none;
  border-radius: 24px; padding: 26px 20px; min-height: 150px; box-shadow: var(--shadow); transition: transform .18s;
}
.ch-card:active { transform: scale(.985); }
.ch-ico { width: 64px; height: 64px; flex: none; display: grid; place-items: center; border-radius: 50%; position: relative; z-index: 1; }
.ch-ico svg { width: 38px; height: 38px; }
.ch-txt { flex: 1; min-width: 0; position: relative; z-index: 1; }
.ch-txt strong { display: block; line-height: 1.05; }
.ch-txt small { display: block; margin-top: 6px; font-size: 14px; line-height: 1.35; }
.ch-go { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; flex: none; position: relative; z-index: 1; }
.ch-go svg { width: 22px; height: 22px; }
.ch-ff { background: var(--green); color: #fff; }
.ch-ff .ch-stripe { position: absolute; left: -20%; right: -20%; bottom: 20px; height: 18px; background: var(--orange); transform: rotate(-7deg); }
.ch-ff .ch-ico { background: var(--orange); color: #fff; }
.ch-ff strong { font-weight: 900; font-size: 32px; text-transform: uppercase; letter-spacing: -.02em; }
.ch-ff small { color: rgba(255,255,255,.88); font-weight: 600; }
.ch-ff .ch-go { background: #fff; color: var(--green); }
.ch-ac { background: #fdfcf9; color: #1a1a1a; box-shadow: 0 1px 2px rgba(0,0,0,.05), 0 14px 34px -18px rgba(0,0,0,.35); }
.ch-ac .ch-frame { position: absolute; inset: 8px; border: 1px solid rgba(26,26,26,.55); border-radius: 18px; pointer-events: none; }
.ch-ac .ch-frame::after { content: ''; position: absolute; inset: 3px; border: 1px solid rgba(26,26,26,.16); border-radius: 15px; }
.ch-ac .ch-ico { border: 1px solid rgba(26,26,26,.6); color: #1a1a1a; }
.ch-ac strong { font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; font-weight: 500; font-size: 40px; }
.ch-ac small { font-family: 'Jost', var(--font); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: #555; }
.ch-ac .ch-go { border: 1px solid #1a1a1a; color: #1a1a1a; }

/* ---------- category tiles ---------- */
.tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (min-width: 760px) { .tiles { grid-template-columns: repeat(3, 1fr); gap: 16px; } }
.tile {
  position: relative; display: block; overflow: hidden; border-radius: 22px; aspect-ratio: 4 / 5;
  background: var(--green); color: #fff; text-decoration: none; box-shadow: var(--shadow); transition: transform .18s;
}
.tile:first-child { grid-column: 1 / -1; aspect-ratio: 16 / 10; }
@media (min-width: 760px) { .tile:first-child { grid-column: auto; aspect-ratio: 4 / 5; } }
.tile:active { transform: scale(.98); }
.tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
@media (hover: hover) { .tile:hover img { transform: scale(1.05); } }
.tile::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,36,29,0) 35%, rgba(20,36,29,.9) 100%); }
.tile-txt { position: absolute; left: 14px; right: 52px; bottom: 14px; z-index: 1; }
.tile-txt strong { display: block; font-size: 20px; font-weight: 900; line-height: 1.05; text-transform: uppercase; letter-spacing: -.01em; }
.tile:first-child .tile-txt strong { font-size: 30px; }
.tile-txt small { display: block; margin-top: 4px; font-size: 11.5px; font-weight: 800; color: var(--orange-2); text-transform: uppercase; letter-spacing: .08em; }
.tile-go { position: absolute; right: 12px; bottom: 12px; z-index: 1; width: 36px; height: 36px; border-radius: 50%; background: var(--orange); display: grid; place-items: center; }
.tile-go svg { width: 18px; height: 18px; }

/* ---------- one-category page ---------- */
.cat-page { min-height: 60vh; }
.cat-page .cat-head { padding-top: 20px; }
.catnav { margin-top: 0; }
.catnav .chip-all { display: grid; place-items: center; padding: 0; width: 40px; }
.catnav .chip-all svg { width: 18px; height: 18px; }
.pager { display: flex; justify-content: space-between; gap: 10px; margin: 28px 0 6px; }
.pager a {
  display: flex; align-items: center; gap: 10px; text-decoration: none; background: var(--paper); border-radius: 18px;
  padding: 13px 14px; box-shadow: var(--shadow); color: var(--green); font-weight: 900; max-width: 48%; min-width: 0;
}
.pager a span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pager small { display: none; }
.pager svg { width: 20px; height: 20px; flex: none; color: var(--orange); }
.pg-next { margin-left: auto; }

/* ---------- sauces & sides as proper cards ---------- */
.xgroup { margin-top: 22px; }
.cat-page .cat-head + .xgroup { margin-top: 4px; }
.xg-title { margin: 0 4px 12px; font-size: 14px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; color: var(--green); display: flex; align-items: center; gap: 10px; }
.xg-title::after { content: ''; flex: 1; height: 2px; background: var(--line); }
.xgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (min-width: 640px) { .xgrid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1000px) { .xgrid { grid-template-columns: repeat(5, 1fr); } }
.xcard { background: var(--paper); border-radius: 20px; padding: 16px 12px; text-align: center; box-shadow: var(--shadow); }
.ximg { width: 100%; max-width: 128px; aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: var(--cream-2); margin: 0 auto 10px; display: grid; place-items: center; box-shadow: 0 8px 18px -10px rgba(0,0,0,.45); }
.ximg img { width: 100%; height: 100%; object-fit: cover; }
.ximg .xdot svg { width: 40px; height: 40px; color: var(--green); }
.xcard b { display: block; font-size: 15px; font-weight: 900; color: var(--green); line-height: 1.2; }
.xcard em { display: inline-block; margin-top: 8px; font-style: normal; font-weight: 900; font-size: 15px; color: #fff; background: var(--orange); padding: 4px 12px; border-radius: 999px; }
.xcard em.incl { background: var(--cream); color: var(--green); font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; }
.foot-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }

/* =====================================================================
   À la carte — quiet, formal, black & ivory (like the printed card)
   ===================================================================== */
.theme-alacarte {
  --ac-ink: #1a1a1a; --ac-muted: #5e5a54; --ac-line: rgba(26,26,26,.18); --ac-bg: #fbfaf6;
  --serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif; --caps: 'Jost', 'Nunito', sans-serif;
  background: var(--ac-bg); color: var(--ac-ink);
}
.theme-alacarte .topbar { background: rgba(251,250,246,.94); border-bottom: 1px solid var(--ac-line); }
.theme-alacarte .iconbtn { background: transparent; border: 1px solid var(--ac-line); color: var(--ac-ink); }
.theme-alacarte .lang { background: transparent; box-shadow: inset 0 0 0 1px var(--ac-line); }
.theme-alacarte .lang button { color: var(--ac-ink); font-family: var(--caps); font-weight: 500; letter-spacing: .12em; }
.theme-alacarte .lang button.on { background: var(--ac-ink); color: #fff; }
.theme-alacarte .menu { max-width: 720px; }

.ac-rule { display: flex; align-items: center; justify-content: center; gap: 12px; color: var(--ac-ink); }
.ac-rule::before, .ac-rule::after { content: ''; height: 1px; width: 90px; background: var(--ac-ink); }
.ac-rule svg { width: 12px; height: 12px; }
.ac-hero { text-align: center; padding: 30px 20px 6px; }
.ac-hero h1, .ac-title { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 54px; line-height: 1; margin: 14px 0 8px; color: var(--ac-ink); }
.ac-hero p { margin: 0; font-family: var(--caps); font-size: 11px; letter-spacing: .3em; text-transform: uppercase; color: var(--ac-muted); }
.theme-alacarte .sec-label { font-family: var(--caps); font-weight: 500; color: var(--ac-muted); text-align: center; letter-spacing: .3em; font-size: 11px; }

.theme-alacarte .tiles { grid-template-columns: 1fr; gap: 10px; }
.theme-alacarte .tile, .theme-alacarte .tile:first-child {
  aspect-ratio: auto; min-height: 96px; background: #fff; color: var(--ac-ink); border-radius: 2px;
  border: 1px solid var(--ac-ink); box-shadow: none; outline: 1px solid var(--ac-line); outline-offset: -6px; grid-column: auto;
}
.theme-alacarte .tile img { opacity: .14; filter: grayscale(1); }
.theme-alacarte .tile::after { display: none; }
.theme-alacarte .tile-txt { position: relative; left: 0; right: 0; bottom: 0; text-align: center; padding: 24px 16px; }
.theme-alacarte .tile-txt strong { font-family: var(--serif); font-weight: 500; font-size: 26px; letter-spacing: .14em; }
.theme-alacarte .tile-txt small { font-family: var(--caps); font-weight: 400; color: var(--ac-muted); letter-spacing: .25em; }

.theme-alacarte .catnav { background: rgba(251,250,246,.94); border-bottom: 1px solid var(--ac-line); }
.theme-alacarte .catnav a { background: transparent; box-shadow: inset 0 0 0 1px var(--ac-line); border-radius: 2px; font-family: var(--caps); font-weight: 400; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--ac-ink); }
.theme-alacarte .catnav a.on { background: var(--ac-ink); color: #fff; }

.ac-sheet {
  position: relative; margin: 18px 4px 0; padding: 36px 20px 32px; text-align: center; background: #fff;
  border: 1px solid var(--ac-ink); outline: 1px solid var(--ac-line); outline-offset: -7px;
}
.ac-cat { margin: 4px 0 0; font-family: var(--caps); font-size: 12px; letter-spacing: .34em; text-transform: uppercase; color: var(--ac-ink); }
.ac-tag { margin: 6px 0 0; font-family: var(--serif); font-style: italic; font-size: 17px; color: var(--ac-muted); }
.dishes { margin-top: 28px; }
.dish { padding: 4px; cursor: pointer; border-radius: 4px; transition: background .2s; }
@media (hover: hover) { .dish:hover { background: #faf8f3; } }
.dish h3 { margin: 0; font-family: var(--serif); font-weight: 500; font-size: 23px; letter-spacing: .16em; text-transform: uppercase; line-height: 1.2; }
.dish p { margin: 6px auto 0; max-width: 460px; font-family: var(--serif); font-style: italic; font-size: 18.5px; line-height: 1.4; color: var(--ac-muted); }
.dish-img { width: 100%; max-width: 420px; aspect-ratio: 3 / 2; margin: 0 auto 14px; overflow: hidden; border-radius: 2px; }
.dish-img img { width: 100%; height: 100%; object-fit: cover; }
.ac-price { display: inline-block; margin-top: 8px; font-family: var(--caps); font-size: 14px; letter-spacing: .14em; color: var(--ac-ink); }
.ac-sold { display: inline-block; margin-top: 8px; font-family: var(--caps); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; border: 1px solid var(--ac-ink); padding: 3px 8px; }
.dish.sold h3, .dish.sold p { opacity: .45; }
.ac-badge { display: block; margin-top: 6px; font-family: var(--caps); font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--ac-muted); }
.ac-var { list-style: none; padding: 0; margin: 10px auto 0; max-width: 360px; font-family: var(--serif); font-size: 17px; }
.ac-var li { display: flex; justify-content: space-between; gap: 10px; border-bottom: 1px dotted var(--ac-line); padding: 4px 0; }
.ac-var em { font-style: normal; font-family: var(--caps); font-size: 13px; letter-spacing: .1em; }
.ac-sep { color: var(--ac-ink); padding: 14px 0; display: grid; place-items: center; }
.ac-sep svg { width: 8px; height: 8px; }
.ac-end { margin-top: 30px; }
.ac-end p { margin: 10px 0 0; font-family: var(--serif); font-style: italic; font-size: 25px; }

.theme-alacarte .note { background: transparent; color: var(--ac-ink); border: 1px solid var(--ac-line); border-radius: 2px; text-align: left; }
.theme-alacarte .note::before { display: none; }
.theme-alacarte .note-txt small { color: var(--ac-muted); font-family: var(--serif); font-style: italic; font-size: 15px; font-weight: 400; }
.theme-alacarte .note-txt strong { font-family: var(--caps); font-weight: 500; font-size: 14px; letter-spacing: .2em; }
.theme-alacarte .note-price { background: transparent; color: var(--ac-ink); transform: none; font-family: var(--caps); font-weight: 500; font-size: 15px; border: 1px solid var(--ac-ink); border-radius: 2px; }
.theme-alacarte .xg-title { font-family: var(--caps); font-weight: 500; color: var(--ac-ink); justify-content: center; letter-spacing: .26em; font-size: 12px; }
.theme-alacarte .xg-title::after { display: none; }
.theme-alacarte .xcard { box-shadow: none; border: 1px solid var(--ac-line); border-radius: 2px; background: #fff; }
.theme-alacarte .xcard b { font-family: var(--serif); font-weight: 600; color: var(--ac-ink); font-size: 17px; }
.theme-alacarte .xcard em, .theme-alacarte .xcard em.incl { background: transparent; color: var(--ac-ink); font-family: var(--caps); font-weight: 500; }

.theme-alacarte .pager a { background: #fff; box-shadow: none; border: 1px solid var(--ac-line); border-radius: 2px; color: var(--ac-ink); font-family: var(--serif); font-weight: 600; font-size: 17px; }
.theme-alacarte .pager svg { color: var(--ac-ink); }

.theme-alacarte .foot { background: var(--ac-bg); color: var(--ac-muted); border-top: 1px solid var(--ac-line); }
.theme-alacarte .foot::before { display: none; }
.theme-alacarte .foot img { width: 150px; }
.theme-alacarte .foot-info { color: var(--ac-ink); }
.theme-alacarte .ghost { border-color: var(--ac-ink); color: var(--ac-ink); border-radius: 2px; font-family: var(--caps); font-weight: 400; letter-spacing: .14em; text-transform: uppercase; font-size: 12px; }

.sheet-noimg { height: 56px; }
.theme-alacarte .sheet-card { background: #fff; }
.theme-alacarte .sheet-body { text-align: center; padding-bottom: 16px; }
.theme-alacarte .sheet-body h3 { font-family: var(--serif); font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--ac-ink); }
.theme-alacarte .sheet-body p { font-family: var(--serif); font-style: italic; font-size: 19px; color: var(--ac-muted); }
.theme-alacarte .sheet-body .tag { background: transparent; color: var(--ac-muted); box-shadow: none; font-family: var(--caps); font-weight: 400; letter-spacing: .24em; }
.theme-alacarte .pbadge.big { background: transparent; color: var(--ac-ink); box-shadow: none; border: 1px solid var(--ac-ink); border-radius: 2px; font-family: var(--caps); font-weight: 500; font-size: 18px; letter-spacing: .1em; }
.theme-alacarte .sheet-x { background: #fff; border: 1px solid var(--ac-line); }
.ask { font-family: var(--caps); font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--ac-muted); }
.theme-alacarte .vtable li { background: #faf8f3; border-radius: 2px; }
.theme-alacarte .vtable b { color: var(--ac-ink); }
.theme-alacarte .vtable em { color: var(--ac-ink); font-family: var(--caps); font-weight: 500; }
.theme-alacarte .noimg { background: #f3f0ea; }
.theme-alacarte .soon { border-color: var(--ac-line); }