/* ============================================================
   Maxima Menu — experiência pública (capa cinematográfica + livro 3D)
   maximasoftware.io
   ============================================================ */
:root {
  --verde-escuro: #0e2a20;
  --verde: #1f5a3f;
  --verde-claro: #2e7d56;
  --terracota: #d2622f;
  --dourado: #e9b949;
  --dourado-claro: #f4d27a;
  --creme: #f7f1e3;
  --papel: #fbf6ea;
  --papel-2: #f1e7d2;
  --tinta: #2a2620;
  --tinta-suave: #6b6354;
  --ff-serif: "Playfair Display", Georgia, serif;
  --ff-sans: "Inter", system-ui, -apple-system, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
[hidden] { display: none !important; }
html, body { height: 100%; }
body {
  font-family: var(--ff-sans);
  background: #07150f;
  color: var(--tinta);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}
img { display: block; max-width: 100%; }
button { font-family: inherit; cursor: pointer; }

/* ---------------- Carregando ---------------- */
.loader {
  position: fixed; inset: 0; z-index: 100;
  display: grid; place-items: center;
  background: #07150f; color: var(--dourado);
  transition: opacity .5s ease;
}
.loader { display: flex; flex-direction: column; gap: 1.1rem; }
.loader__logo { width: clamp(160px, 56vw, 230px); height: auto; border-radius: 18px; background: #0a0a0a;
  border: 1px solid #e9b94944; box-shadow: 0 16px 44px #000a; animation: logoIn .9s cubic-bezier(.2,.8,.2,1) both; }
.loader__nome { font-family: var(--ff-serif); font-weight: 700; font-size: 1.1rem; color: var(--creme); opacity: .85; }
.loader__ring {
  width: 40px; height: 40px; border-radius: 50%;
  border: 3px solid #ffffff22; border-top-color: var(--dourado);
  animation: spin 1s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ============================================================
   CAPA CINEMATOGRÁFICA
   ============================================================ */
.cover {
  position: fixed; inset: 0; z-index: 60;
  display: flex; overflow: hidden; text-align: center;
  padding: 1.5rem 1.5rem;
  color: var(--creme);
  background:
    radial-gradient(130% 80% at 50% -10%, #2e7d5666, transparent 55%),
    radial-gradient(100% 70% at 50% 110%, #d2622f33, transparent 55%),
    linear-gradient(160deg, #0e2a20, #07150f 70%);
  transform-origin: center;
  transition: transform 1s cubic-bezier(.7,.0,.2,1), opacity 1s ease;
  perspective: 1400px;
}
/* brilho ambiente que respira */
.cover::before {
  content: ""; position: absolute; inset: -20%;
  background: radial-gradient(closest-side, #e9b94922, transparent 70%);
  animation: glow 7s ease-in-out infinite;
  pointer-events: none;
}
@keyframes glow { 0%,100% { opacity:.55; transform: scale(1); } 50% { opacity:.8; transform: scale(1.05); } }

/* partículas (faíscas de brasa) */
.spark {
  position: absolute; bottom: -10px; width: 4px; height: 4px;
  background: var(--dourado); border-radius: 50%;
  opacity: 0; filter: blur(.3px);
  animation: rise linear infinite;
}
@keyframes rise {
  0% { transform: translateY(0) scale(1); opacity: 0; }
  15% { opacity: .9; }
  100% { transform: translateY(-105vh) scale(.3); opacity: 0; }
}

.cover__bg {
  position: absolute; inset: 0; z-index: 0;
  background-size: cover; background-position: center;
  filter: blur(14px) brightness(.34) saturate(1.1);
  transform: scale(1.12); opacity: .55;
  animation: kenburns 32s ease-in-out infinite alternate;
}
@keyframes kenburns { from { transform: scale(1.1); } to { transform: scale(1.16); } }

.cover__inner { position: relative; z-index: 2; max-width: 540px; margin: auto; }
.cover__logo {
  width: clamp(180px, 58vw, 280px); height: auto; max-height: 34vh; max-height: 34dvh;
  margin: 0 auto 1rem; display: block;
  border-radius: 22px; object-fit: contain; background: #0a0a0a;
  border: 1px solid #e9b94955;
  box-shadow: 0 20px 60px rgba(0,0,0,.6);
  animation: logoIn 1.1s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes logoIn { from { opacity:0; transform: translateY(18px) scale(.85); } to { opacity:1; transform:none; } }

.cover__eyebrow {
  font-size: .78rem; letter-spacing: .42em; text-transform: uppercase;
  color: var(--dourado); margin-bottom: .7rem; padding-left: .42em;
  animation: fadeUp 1s .2s both;
}
.cover__title {
  font-family: var(--ff-serif); font-weight: 800;
  font-size: clamp(2.4rem, 11vw, 4.2rem); line-height: 1.02;
  text-shadow: 0 4px 30px #000a;
  background: linear-gradient(180deg, #fff, var(--dourado-claro));
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: fadeUp 1s .35s both;
}
.cover__divider {
  width: 0; height: 2px; margin: 1.1rem auto;
  background: linear-gradient(90deg, transparent, var(--dourado), transparent);
  animation: grow 1.1s .8s both;
}
@keyframes grow { to { width: 160px; } }
.cover__tagline {
  font-size: 1rem; color: #f7f1e3cc; letter-spacing: .04em;
  animation: fadeUp 1s .55s both;
}
.cover__addr { margin-top: .5rem; font-size: .82rem; opacity: .7; animation: fadeUp 1s .65s both; }

.cover__cta {
  margin-top: 2.2rem;
  display: inline-flex; align-items: center; gap: .6rem;
  padding: .95rem 1.8rem; border-radius: 999px;
  border: 1.5px solid var(--dourado);
  background: linear-gradient(180deg, #e9b94922, #e9b9490a);
  color: var(--dourado-claro); font-weight: 700; font-size: 1rem;
  letter-spacing: .02em; backdrop-filter: blur(4px);
  animation: fadeUp 1s .8s both, pulse 2.4s 2s ease-in-out infinite;
  transition: transform .25s, background .25s;
}
.cover__cta:hover { transform: translateY(-2px); background: #e9b94933; }
.cover__cta:active { transform: scale(.97); }
.cover__cta .chev { animation: bob 1.6s ease-in-out infinite; }
@keyframes pulse { 0%,100%{ box-shadow:0 0 0 0 #e9b94955; } 50%{ box-shadow:0 0 0 14px #e9b94900; } }
@keyframes bob { 0%,100%{ transform: translateX(0);} 50%{ transform: translateX(5px);} }
@keyframes fadeUp { from { opacity:0; transform: translateY(16px);} to { opacity:1; transform:none; } }

.cover.is-opening { transform: rotateX(18deg) scale(1.25); opacity: 0; }

/* ============================================================
   PALCO DO LIVRO
   ============================================================ */
.stage {
  position: fixed; inset: 0; z-index: 40;
  display: none; flex-direction: column; align-items: center;
  background:
    radial-gradient(120% 80% at 50% 0%, #14352713, transparent 60%),
    linear-gradient(160deg, #0e2a20, #07150f);
  padding: env(safe-area-inset-top) 0 0;
}
.stage.is-active { display: flex; animation: stageIn .9s ease both; }
@keyframes stageIn { from { opacity:0; } to { opacity:1; } }

.topbar {
  width: 100%; max-width: 900px;
  display: flex; align-items: center; justify-content: space-between;
  gap: .6rem; padding: .85rem 1.1rem; color: var(--creme);
}
.topbar__title { font-family: var(--ff-serif); font-size: 1.05rem; font-weight: 700;
  flex: 1 1 auto; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 .4rem; }
.topbar__btn {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; gap: .4rem;
  background: #ffffff14; border: 1px solid #ffffff22; color: var(--creme);
  padding: .5rem .8rem; border-radius: 999px; font-size: .82rem; font-weight: 600;
  transition: background .2s; text-decoration: none; white-space: nowrap;
}
.topbar__btn:hover { background: #ffffff26; }
.topbar__btn--wpp { background: linear-gradient(135deg, #25d366, #1da851); border-color: transparent; color: #fff; }
@media (max-width: 480px) { .topbar__btn-tx { display: none; } .topbar__btn { padding: .5rem .65rem; } }

.book-wrap { flex: 1 1 auto; min-height: 0; display: flex; align-items: center; justify-content: center; width: 100%; padding: .4rem .3rem; }
#book { touch-action: pan-y; }

/* ===== folheador próprio (leve, rola, swipe) ===== */
#book.pager {
  position: relative;
  width: min(94vw, 460px);
  height: calc(100vh - 184px);
  height: calc(100dvh - 184px);   /* altura definida -> a página rola de verdade */
  max-height: 760px;
  margin: 0 auto;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 14px 44px rgba(0,0,0,.5);
}
/* alta especificidade p/ vencer .page { position:relative; } */
#book.pager .pager__page { position: absolute; inset: 0; display: flex; flex-direction: column; will-change: transform, opacity; }
#book.pager .pager__page--anim { transition: transform .3s ease, opacity .3s ease; }
#book.pager .page__pad {
  position: static; inset: auto; flex: 1 1 auto; min-height: 0;
  overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding-bottom: 1.6rem;
}
/* título do grupo fixo no topo enquanto rola a lista */
#book.pager .page--group .page__grpttl {
  position: sticky; top: 0; z-index: 2; margin: 0 -2% 0 -2%; padding: .2rem 2% .1rem;
  background: linear-gradient(180deg, var(--papel) 78%, transparent);
}

/* ---- página (folha do cardápio) ---- */
.page {
  position: relative; overflow: hidden;
  background:
    radial-gradient(120% 100% at 0% 0%, #fff8, transparent 40%),
    linear-gradient(180deg, var(--papel), var(--papel-2));
  color: var(--tinta);
  box-shadow: inset 0 0 60px #d8c9a733;
}
.page__pad { position: absolute; inset: 0; padding: 7% 8%; display: flex; flex-direction: column; }
.page::after { /* vinco interno */
  content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 26px;
  background: linear-gradient(90deg, #00000018, transparent);
  pointer-events: none;
}
.page--right::after { left: auto; right: 0; transform: scaleX(-1); }

.page__grpttl {
  font-family: var(--ff-serif); font-weight: 700;
  font-size: clamp(1.3rem, 5.5vw, 1.7rem); color: var(--verde-escuro);
  display: flex; align-items: center; gap: .5rem;
}
.page__grpttl .ic { font-size: 1.3em; }
.page__rule { height: 2px; margin: .5rem 0 1rem;
  background: linear-gradient(90deg, var(--dourado), #d8c9a700); }

.item { display: flex; gap: .7rem; padding: .55rem 0; border-bottom: 1px dashed #c9bb9a88; }
.item:last-child { border-bottom: 0; }
.item__thumb {
  flex: 0 0 56px; width: 56px; height: 56px; border-radius: 10px; overflow: hidden;
  background: linear-gradient(135deg, var(--verde-claro), var(--verde-escuro));
  display: grid; place-items: center; box-shadow: 0 3px 10px #0002;
}
.item__thumb img { width: 100%; height: 100%; object-fit: cover;
  filter: saturate(1.1) contrast(1.05); animation: thumbIn .5s ease both; }
@keyframes thumbIn { from { opacity: .35; transform: scale(1.04); } to { opacity: 1; transform: none; } }
/* vinheta interna: dá profundidade e disfarça fotos de baixa resolução */
.item__thumb::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  box-shadow: inset 0 0 14px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.12); }
.item__thumb .ph { font-size: 1.5rem; filter: drop-shadow(0 1px 2px rgba(0,0,0,.25)); }
/* placeholder (sem foto): leve textura radial pra não ficar chapado */
.item__thumb:not(:has(img)) { background-image:
  radial-gradient(circle at 30% 25%, rgba(255,255,255,.18), transparent 45%),
  linear-gradient(135deg, var(--verde-claro), var(--verde-escuro)); }
.item__body { flex: 1 1 auto; min-width: 0; }
.item__nome { font-weight: 700; font-size: .95rem; line-height: 1.2; }
.item__serve { font-size: .62rem; font-weight: 700; color: var(--terracota);
  background: #d2622f18; padding: .08rem .4rem; border-radius: 999px; margin-left: .35rem; }
.item__desc { font-size: .76rem; color: var(--tinta-suave); margin-top: .15rem; line-height: 1.35; }
.item__preco { font-weight: 800; font-size: .98rem; color: var(--terracota); margin-top: .2rem; }
.item__star { position: absolute; top: 3px; right: 3px; font-size: .8rem; filter: drop-shadow(0 1px 2px #0008); }
.item__thumb { position: relative; }
.item__off { display: inline-block; margin-left: .4rem; font-size: .6rem; font-weight: 800; text-transform: uppercase;
  letter-spacing: .05em; color: #b03f28; background: #b03f2818; padding: .08rem .4rem; border-radius: 999px; vertical-align: middle; }
.item--off .item__nome, .item--off .item__preco { opacity: .5; }
.item--off .item__thumb img { filter: grayscale(.7) opacity(.6); }
.item--dest { background: linear-gradient(90deg, #e9b9490f, transparent); border-radius: 10px; }
.item--dest .item__thumb { box-shadow: 0 0 0 2px var(--dourado), 0 3px 10px #0002; }

.page__num { position: absolute; bottom: 3.2%; left: 0; right: 0; text-align: center;
  font-size: .7rem; color: var(--tinta-suave); font-variant-numeric: tabular-nums; }

/* selo (monograma) chique — estilo "lacre" dourado */
.page__selo {
  position: absolute; top: 5.5%; right: 8%; z-index: 3;
  width: 50px; height: 50px; border-radius: 50%;
  display: grid; place-items: center; transform: rotate(-6deg);
  background:
    radial-gradient(circle at 38% 32%, #f6d889, #e9b949 55%, #c9952a);
  border: 2px solid #fffdf6;
  box-shadow: 0 3px 9px rgba(0,0,0,.28), inset 0 1px 2px #fff8, 0 0 0 1px #c9952a;
}
.page__selo--img {
  background: #0a0a0a; overflow: hidden; border: 2px solid var(--dourado);
  box-shadow: 0 3px 10px rgba(0,0,0,.32), 0 0 0 3px #fffdf6;
}
.page__selo::before { content: ""; position: absolute; inset: 4px; border-radius: 50%; border: 1px dashed rgba(94,60,12,.5); }
.page__selo--img::before { content: none; }
.page__selo-img { width: 100%; height: 100%; object-fit: contain; padding: 3px; }
.page__selo-ini {
  font-family: var(--ff-serif); font-weight: 800; font-size: .82rem; letter-spacing: .5px;
  color: #5e3c0c; text-shadow: 0 1px 0 #fff6;
}
@media (min-width: 560px) { .page__selo { width: 60px; height: 60px; } .page__selo-ini { font-size: .95rem; } }

/* página de rosto (interna) */
.page--title .page__pad { align-items: center; justify-content: center; text-align: center; }
.page--title .big { font-family: var(--ff-serif); font-size: 2.4rem; font-weight: 800; color: var(--verde-escuro); }
.page__logo { width: clamp(180px, 72%, 300px); height: auto; margin: 0 auto 1rem; display: block;
  border-radius: 18px; background: #0a0a0a; border: 1px solid #c9952a55; box-shadow: 0 12px 34px rgba(0,0,0,.3); }
.page--title .sub { color: var(--tinta-suave); margin-top: .5rem; letter-spacing: .2em; text-transform: uppercase; font-size: .72rem; }
.page--title .orn { font-size: 1.6rem; color: var(--dourado); margin: 1rem 0; }

/* página final / agradecimento + marca Maxima */
.page--final .page__pad { align-items: center; justify-content: center; text-align: center; gap: .4rem; }
.page--final .thanks { font-family: var(--ff-serif); font-size: 1.9rem; color: var(--verde-escuro); }
.page--final .addr { font-size: .82rem; color: var(--tinta-suave); margin-top: .3rem; }
.page--final .maxima {
  margin-top: 1.6rem; display: inline-flex; flex-direction: column; align-items: center; gap: .2rem;
  font-size: .72rem; color: var(--tinta-suave);
}
.page--final .maxima b { color: var(--verde); font-size: .9rem; letter-spacing: .03em; }

/* ---- barra inferior ---- */
/* ---- barra de navegação (◀ Voltar · X/N · Próxima ▶) ---- */
.navbar {
  width: 100%; max-width: 900px; display: flex; align-items: center; justify-content: space-between;
  gap: .6rem; padding: .5rem 1.1rem;
}
.navbtn {
  flex: 0 0 auto; background: var(--verde-claro); color: #fff; border: none; border-radius: 11px;
  padding: .68rem 1.15rem; font-weight: 700; font-size: .92rem; cursor: pointer;
  transition: opacity .2s, transform .1s, background .2s; box-shadow: 0 3px 10px rgba(0,0,0,.3);
}
.navbtn:hover:not(:disabled) { background: var(--verde); }
.navbtn:disabled { opacity: .3; cursor: default; box-shadow: none; }
.navbtn:active:not(:disabled) { transform: scale(.96); }
.navbar .pageind { font-size: .85rem; color: #f7f1e3cc; font-variant-numeric: tabular-nums; }

.bottombar {
  width: 100%; max-width: 900px; display: flex; align-items: center; justify-content: space-between;
  padding: .35rem 1.2rem calc(.6rem + env(safe-area-inset-bottom)); color: var(--creme);
}
.pageind { font-size: .78rem; color: #f7f1e3aa; font-variant-numeric: tabular-nums; }
.mini-btn { background: #ffffff14; border: 1px solid #ffffff22; color: var(--creme);
  width: 34px; height: 34px; border-radius: 50%; font-size: .9rem; cursor: pointer; transition: background .2s; }
.mini-btn:hover { background: #ffffff26; }
.fliphint { font-size: .74rem; color: var(--dourado); display: inline-flex; align-items: center; gap: .35rem; }
@media (max-width: 560px) { .fliphint { display: none; } }
.fliphint .h { animation: bob 1.6s ease-in-out infinite; }

/* selo Maxima (rodapé global) */
.maxima-badge {
  text-decoration: none; color: #f7f1e388; font-size: .72rem;
  display: inline-flex; align-items: center; gap: .35rem; transition: color .2s;
}
.maxima-badge:hover { color: var(--dourado); }
.maxima-badge .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--dourado); }

/* ---- botão flutuante WhatsApp ---- */
.fab-wpp {
  position: fixed; right: 1rem; bottom: calc(1.1rem + env(safe-area-inset-bottom)); z-index: 45;
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .8rem 1.1rem; border-radius: 999px; text-decoration: none;
  background: linear-gradient(135deg, #25d366, #1da851); color: #fff; font-weight: 700; font-size: .9rem;
  box-shadow: 0 8px 24px #1da85166, 0 2px 6px #0004;
  animation: fabIn .5s 1.2s both, fabPulse 2.8s 2.4s ease-in-out infinite;
}
.fab-wpp__ic { font-size: 1.15rem; }
.fab-wpp:active { transform: scale(.96); }
@keyframes fabIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
@keyframes fabPulse { 0%,100% { box-shadow: 0 8px 24px #1da85166, 0 0 0 0 #25d36655; } 50% { box-shadow: 0 8px 24px #1da85166, 0 0 0 12px #25d36600; } }
@media (max-width: 420px) { .fab-wpp__tx { display: none; } .fab-wpp { padding: .85rem; } .fab-wpp__ic { font-size: 1.4rem; } }

/* ---- toggle de som (na topbar) ---- */
.sound-toggle {
  background: #ffffff14; border: 1px solid #ffffff22; color: var(--creme);
  width: 38px; height: 38px; border-radius: 50%; font-size: 1rem; cursor: pointer; transition: background .2s;
}
.sound-toggle:hover { background: #ffffff26; }

/* ---- índice de grupos (drawer) ---- */
.index { position: fixed; inset: 0; z-index: 70; display: none; }
.index.is-open { display: block; }
.index__scrim { position: absolute; inset: 0; background: #000a; backdrop-filter: blur(3px); animation: stageIn .3s; }
.index__panel {
  position: absolute; left: 0; right: 0; bottom: 0; max-height: 76vh; overflow-y: auto;
  background: linear-gradient(180deg, var(--papel), var(--papel-2));
  border-radius: 22px 22px 0 0; padding: 1.2rem 1.1rem calc(1.4rem + env(safe-area-inset-bottom));
  box-shadow: 0 -14px 40px #000a; animation: drawerUp .4s cubic-bezier(.2,.8,.2,1);
}
@keyframes drawerUp { from { transform: translateY(100%);} to { transform:none; } }
.index__grab { width: 42px; height: 4px; border-radius: 4px; background: #c9bb9a; margin: 0 auto 1rem; }
.index__ttl { font-family: var(--ff-serif); font-weight: 700; color: var(--verde-escuro); margin-bottom: .8rem; font-size: 1.2rem; }
.index__list { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }
.index__item {
  display: flex; align-items: center; gap: .5rem; text-align: left;
  background: #fff; border: 1px solid #e6dcc4; border-radius: 12px;
  padding: .7rem .8rem; font-size: .86rem; font-weight: 600; color: var(--verde-escuro);
  transition: transform .15s, border-color .15s;
}
.index__item:hover { border-color: var(--dourado); }
.index__item:active { transform: scale(.97); }
.index__item .ic { font-size: 1.2rem; }

@media (min-width: 640px) {
  .item__thumb { flex-basis: 68px; width: 68px; height: 68px; }
}
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001s !important; }
}

/* ============================================================
   Refinos: Destaques do Chef · Detalhe do item · Busca
   ============================================================ */

/* botão de busca na topbar (ícone) */
#btn-busca { padding: .5rem .7rem; }

/* ---- cards de Destaques (foto grande no topo) ---- */
.itens--dest { display: grid; gap: .9rem; }
.item.dest { flex-direction: column; gap: 0; padding: 0; border: 1px solid #e4d7b6; border-radius: 14px;
  overflow: hidden; background: #fffdf7; box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.item.dest .dest__foto { width: 100%; height: 150px; background-size: cover; background-position: center;
  filter: saturate(1.1) contrast(1.05); }
.item.dest .dest__foto--ph { display: grid; place-items: center; font-size: 2.4rem;
  background: linear-gradient(135deg, var(--verde-claro), var(--verde-escuro)); }
.item.dest .dest__body { padding: .7rem .85rem .9rem; }

/* ---- modal de detalhe do item ---- */
.imodal { position: fixed; inset: 0; z-index: 80; display: flex; align-items: center; justify-content: center; padding: 1.1rem; }
.imodal__scrim { position: absolute; inset: 0; background: #000a; backdrop-filter: blur(4px); }
.imodal__card { position: relative; z-index: 1; width: 100%; max-width: 420px; max-height: 88vh; overflow: hidden;
  background: var(--papel); border-radius: 20px; box-shadow: 0 24px 70px #000b; display: flex; flex-direction: column;
  animation: imodalIn .28s cubic-bezier(.2,.8,.2,1); }
@keyframes imodalIn { from { opacity: 0; transform: translateY(18px) scale(.96); } to { opacity: 1; transform: none; } }
.imodal__x { position: absolute; top: .6rem; right: .6rem; z-index: 2; width: 34px; height: 34px; border: none;
  border-radius: 50%; background: #00000055; color: #fff; font-size: 1rem; cursor: pointer; backdrop-filter: blur(3px); }
.imodal__foto { width: 100%; height: 210px; background-size: cover; background-position: center; flex: 0 0 auto; }
.imodal__foto--ph { display: grid; place-items: center; font-size: 3.4rem; background: linear-gradient(135deg, var(--verde-claro), var(--verde-escuro)); }
.imodal__body { padding: 1.1rem 1.2rem 1.3rem; overflow-y: auto; }
.imodal__tags { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .5rem; }
.imodal__tag { font-size: .7rem; font-weight: 700; padding: .15rem .55rem; border-radius: 999px; background: #ece3cf; color: var(--tinta-suave); }
.imodal__tag--dest { background: #fff1cc; color: #9a6a00; }
.imodal__tag--off { background: #f1ddd8; color: #b03f28; }
.imodal__nome { font-family: var(--ff-serif); font-size: 1.5rem; color: var(--verde-escuro); line-height: 1.1; }
.imodal__desc { margin-top: .5rem; color: var(--tinta-suave); font-size: .95rem; line-height: 1.5; }
.imodal__preco { margin-top: .8rem; font-weight: 800; font-size: 1.5rem; color: var(--terracota); }
.imodal__wpp { display: flex; align-items: center; justify-content: center; gap: .4rem; margin-top: 1rem;
  padding: .85rem; border-radius: 12px; background: linear-gradient(135deg, #25d366, #1da851); color: #fff;
  font-weight: 700; text-decoration: none; box-shadow: 0 6px 18px #1da85155; }
.imodal__wpp:active { transform: scale(.98); }

/* ---- busca ---- */
.busca { position: fixed; inset: 0; z-index: 80; display: flex; flex-direction: column; }
.busca__scrim { position: absolute; inset: 0; background: #000a; backdrop-filter: blur(3px); }
.busca__panel { position: relative; z-index: 1; width: 100%; max-width: 560px; margin: 0 auto;
  background: var(--papel); border-radius: 0 0 20px 20px; box-shadow: 0 16px 50px #000a;
  display: flex; flex-direction: column; max-height: 82vh; animation: drawerDown .3s cubic-bezier(.2,.8,.2,1); }
@keyframes drawerDown { from { transform: translateY(-100%); } to { transform: none; } }
.busca__bar { display: flex; gap: .5rem; padding: .9rem 1rem; padding-top: calc(.9rem + env(safe-area-inset-top)); border-bottom: 1px solid #e4d7b6; }
.busca__bar input { flex: 1 1 auto; padding: .75rem .9rem; border: 1.5px solid #dfd3b6; border-radius: 12px; font-size: 1rem; background: #fff; }
.busca__bar input:focus { outline: none; border-color: var(--verde-claro); }
.busca__x { flex: 0 0 auto; width: 44px; border: none; border-radius: 12px; background: #ece3cf; cursor: pointer; font-size: 1rem; }
.busca__res { overflow-y: auto; padding: .4rem .6rem 1rem; }
.busca__item { display: flex; align-items: baseline; gap: .6rem; width: 100%; text-align: left;
  background: none; border: none; border-bottom: 1px solid #ece3cf; padding: .7rem .5rem; cursor: pointer; }
.busca__item:hover { background: #fff7e6; }
.busca__nome { flex: 1 1 auto; font-weight: 600; color: var(--tinta); }
.busca__grp { font-size: .74rem; color: var(--tinta-suave); }
.busca__preco { font-weight: 800; color: var(--terracota); white-space: nowrap; }
.busca__vazio { text-align: center; color: var(--tinta-suave); padding: 1.5rem; }

/* tags do item (público) */
.item__tags { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .35rem; }
.item__tag { font-size: .64rem; font-weight: 700; padding: .12rem .5rem; border-radius: 999px;
  background: #e9b94926; color: #8a6712; white-space: nowrap; }

/* ============================================================
   Comanda (monte seu pedido)
   ============================================================ */
.item__rodape { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-top: .2rem; }
.item__add { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 9px; border: none; cursor: pointer;
  background: linear-gradient(135deg, #2e7d56, #1f5a3f); color: #fff; font-size: 1.2rem; line-height: 1;
  box-shadow: 0 2px 6px rgba(0,0,0,.2); transition: transform .1s; }
.item__add:active { transform: scale(.9); }

/* botão carrinho na topbar */
.topbar__btn--cart { background: linear-gradient(135deg, #25d366, #1da851); border-color: transparent; color: #fff; position: relative; }
.topbar__btn--cart.bump { animation: cartBump .4s ease; }
@keyframes cartBump { 0%,100% { transform: scale(1); } 35% { transform: scale(1.18); } }
.cbadge { display: inline-grid; place-items: center; min-width: 19px; height: 19px; padding: 0 4px; margin-left: .1rem;
  border-radius: 999px; background: #fff; color: #1da851; font-size: .72rem; font-weight: 800; }

/* qtd stepper (reutilizado no modal e na comanda) */
.qtd { display: inline-flex; align-items: center; gap: .2rem; }
.qtd button { width: 30px; height: 30px; border-radius: 8px; border: 1px solid #d8c9a7; background: #fff;
  font-size: 1.15rem; line-height: 1; cursor: pointer; color: var(--verde-escuro); }
.qtd span { min-width: 26px; text-align: center; font-weight: 700; }

/* bloco "adicionar" no modal de detalhe */
.imodal__add { display: flex; align-items: center; gap: .6rem; margin-top: 1rem; }
.imodal__obs { flex: 1 1 auto; min-width: 0; padding: .6rem .7rem; border: 1.5px solid #dfd3b6; border-radius: 10px; background: #fff; font-size: .9rem; }
.imodal__obs:focus { outline: none; border-color: var(--verde-claro); }
.imodal__addbtn { width: 100%; margin-top: .7rem; padding: .9rem; border: none; border-radius: 12px; cursor: pointer;
  background: linear-gradient(135deg, var(--terracota), #e07a4d); color: #fff; font-weight: 800; font-size: 1rem;
  box-shadow: 0 6px 18px #d2622f44; }
.imodal__addbtn:active { transform: scale(.98); }

/* drawer da comanda */
.comanda { position: fixed; inset: 0; z-index: 85; display: flex; justify-content: flex-end; }
.comanda__scrim { position: absolute; inset: 0; background: #000a; backdrop-filter: blur(3px); }
.comanda__panel { position: relative; z-index: 1; width: 100%; max-width: 420px; height: 100%;
  background: var(--papel); display: flex; flex-direction: column; box-shadow: -10px 0 40px #000a;
  animation: comandaIn .3s cubic-bezier(.2,.8,.2,1); }
@keyframes comandaIn { from { transform: translateX(100%); } to { transform: none; } }
.comanda__head { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.2rem;
  padding-top: calc(1rem + env(safe-area-inset-top)); border-bottom: 1px solid #e4d7b6; }
.comanda__head h3 { font-family: var(--ff-serif); color: var(--verde-escuro); font-size: 1.3rem; }
.comanda__x { width: 36px; height: 36px; border: none; border-radius: 50%; background: #ece3cf; cursor: pointer; font-size: 1rem; }
.comanda__itens { flex: 1 1 auto; overflow-y: auto; padding: .8rem 1rem; }
.comanda__vazio { text-align: center; color: var(--tinta-suave); padding: 2.5rem 1rem; line-height: 1.7; }
.citem { background: #fff; border: 1px solid #ece3cf; border-radius: 12px; padding: .7rem .8rem; margin-bottom: .6rem; }
.citem__top { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; }
.citem__nome { font-weight: 700; color: var(--tinta); }
.citem__rm { border: none; background: none; color: #b03f28; font-size: .9rem; cursor: pointer; padding: .1rem .3rem; }
.citem__row { display: flex; align-items: center; justify-content: space-between; margin-top: .5rem; }
.citem__preco { font-weight: 800; color: var(--terracota); }
.citem__obs { width: 100%; margin-top: .5rem; padding: .45rem .6rem; border: 1px solid #e4d7b6; border-radius: 8px; font-size: .82rem; background: #fcfaf3; }
.citem__obs:focus { outline: none; border-color: var(--verde-claro); }
.comanda__rodape { border-top: 1px solid #e4d7b6; padding: .9rem 1.1rem calc(.9rem + env(safe-area-inset-bottom)); background: #fffdf7; }
.comanda__mesa { display: flex; align-items: center; gap: .6rem; font-weight: 700; color: var(--verde-escuro); margin-bottom: .7rem; }
.comanda__mesa input { width: 90px; padding: .55rem .6rem; border: 1.5px solid #dfd3b6; border-radius: 10px; font-size: 1rem; }
.comanda__mesa input.erro { border-color: #c5391f; background: #fdecea; animation: shake .3s; }
@keyframes shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-5px)} 75%{transform:translateX(5px)} }
.comanda__total { display: flex; align-items: center; justify-content: space-between; font-size: 1.1rem; margin-bottom: .8rem; color: var(--tinta); }
.comanda__total b { font-size: 1.5rem; color: var(--terracota); }
.comanda__enviar { display: block; width: 100%; padding: 1rem; border: none; border-radius: 14px; cursor: pointer;
  background: linear-gradient(135deg, #25d366, #1da851); color: #fff; font-weight: 800; font-size: 1.05rem; box-shadow: 0 8px 22px #1da85155; }
.comanda__enviar:active { transform: scale(.99); }
.comanda__limpar { display: block; width: 100%; margin-top: .6rem; padding: .6rem; border: none; background: none;
  color: var(--tinta-suave); font-size: .85rem; cursor: pointer; text-decoration: underline; }