/*
 * CARDÁPIO PÚBLICO — estilos (copiados dos designs aprovados em referencias/design-cardapio)
 *
 * As cores e fontes de cada estabelecimento chegam por variáveis CSS
 * (--cor-principal, --cor-fundo, --cor-destaque, --fonte-titulo...),
 * definidas no <head> de cada página a partir do banco de dados.
 * Os tons neutros (bege das bordas, marrom dos textos) são fixos do modelo.
 */

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--cor-fundo); }
a { color: inherit; text-decoration: none; }
a:hover { opacity: .95; }
img { max-width: 100%; }
button { font: inherit; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Coluna do cardápio: largura de celular, centralizada no computador */
.pagina {
  width: 100%;
  max-width: 480px;
  min-height: 100vh;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  font-family: var(--fonte-texto);
  color: #2b1a1d;
  background: var(--cor-fundo);
}
.titulo-fonte { font-family: var(--fonte-titulo); font-weight: 400; }
.detalhe-fonte { font-family: var(--fonte-detalhe); font-weight: 700; }

/* ===================================================================
   NEON (A dourado · B laranja · C magenta)
   =================================================================== */
.neon, .neon-soft { transition: transform .15s ease, box-shadow .2s ease; }
.neon:active, .neon-soft:active { transform: scale(.98); }
@media (prefers-reduced-motion: reduce) { .pulse { animation: none !important; } }

/* A · dourado/âmbar */
.nA .neon { border: 2px solid #FFC24D; color: #FFF3D6; text-shadow: 0 0 6px rgba(255,194,77,.85), 0 0 16px rgba(255,194,77,.45); box-shadow: 0 0 4px rgba(255,194,77,.9), 0 0 14px rgba(255,194,77,.5), 0 0 30px rgba(255,194,77,.25), inset 0 0 10px rgba(255,194,77,.3); }
.nA .pulse { animation: pulseA 2.4s ease-in-out infinite; }
.nA .neon:active { animation: none; box-shadow: 0 0 8px #FFC24D, 0 0 28px rgba(255,194,77,.95), 0 0 64px rgba(255,194,77,.6), inset 0 0 18px rgba(255,194,77,.6); }
.nA .neon-soft { border-color: #FFC24D !important; text-shadow: 0 0 8px rgba(255,194,77,.45); box-shadow: 0 0 6px rgba(255,194,77,.6), 0 0 18px rgba(255,194,77,.3); }
.nA .neon-soft:active { box-shadow: 0 0 10px rgba(255,194,77,.95), 0 0 30px rgba(255,194,77,.55); }
.nA .neon-soft svg { filter: drop-shadow(0 0 3px rgba(255,194,77,.8)); }
@keyframes pulseA { 0%,100% { box-shadow: 0 0 4px rgba(255,194,77,.9), 0 0 14px rgba(255,194,77,.5), 0 0 30px rgba(255,194,77,.25), inset 0 0 10px rgba(255,194,77,.3); } 50% { box-shadow: 0 0 6px #FFC24D, 0 0 24px rgba(255,194,77,.75), 0 0 50px rgba(255,194,77,.45), inset 0 0 14px rgba(255,194,77,.45); } }

/* B · laranja */
.nB .neon { border: 2px solid #FF7A1A; color: #FFECDD; box-shadow: 0 0 4px rgba(255,122,26,.9), 0 0 14px rgba(255,122,26,.5), 0 0 30px rgba(255,122,26,.25), inset 0 0 10px rgba(255,122,26,.3); }
.nB .pulse { animation: pulseB 2.4s ease-in-out infinite; }
.nB .neon:active { animation: none; box-shadow: 0 0 8px #FF7A1A, 0 0 28px rgba(255,122,26,.95), 0 0 64px rgba(255,122,26,.6), inset 0 0 18px rgba(255,122,26,.6); }
.nB .neon-soft { border-color: #FF7A1A !important; text-shadow: 0 0 8px rgba(255,122,26,.4); box-shadow: 0 0 6px rgba(255,122,26,.55), 0 0 18px rgba(255,122,26,.28); }
.nB .neon-soft:active { box-shadow: 0 0 10px rgba(255,122,26,.95), 0 0 30px rgba(255,122,26,.55); }
.nB .neon-soft svg { filter: drop-shadow(0 0 3px rgba(255,122,26,.75)); }
@keyframes pulseB { 0%,100% { box-shadow: 0 0 4px rgba(255,122,26,.9), 0 0 14px rgba(255,122,26,.5), 0 0 30px rgba(255,122,26,.25), inset 0 0 10px rgba(255,122,26,.3); } 50% { box-shadow: 0 0 6px #FF7A1A, 0 0 24px rgba(255,122,26,.75), 0 0 50px rgba(255,122,26,.45), inset 0 0 14px rgba(255,122,26,.45); } }

/* C · magenta */
.nC .neon { border: 2px solid #FF3DB4; color: #FFE6F5; text-shadow: 0 0 6px rgba(255,61,180,.85), 0 0 16px rgba(255,61,180,.45); box-shadow: 0 0 4px rgba(255,61,180,.9), 0 0 14px rgba(255,61,180,.5), 0 0 30px rgba(255,61,180,.25), inset 0 0 10px rgba(255,61,180,.3); }
.nC .pulse { animation: pulseC 2.4s ease-in-out infinite; }
.nC .neon:active { animation: none; box-shadow: 0 0 8px #FF3DB4, 0 0 28px rgba(255,61,180,.95), 0 0 64px rgba(255,61,180,.6), inset 0 0 18px rgba(255,61,180,.6); }
.nC .neon-soft { border-color: #FF3DB4 !important; text-shadow: 0 0 8px rgba(255,61,180,.35); box-shadow: 0 0 6px rgba(255,61,180,.5), 0 0 18px rgba(255,61,180,.25); }
.nC .neon-soft:active { box-shadow: 0 0 10px rgba(255,61,180,.95), 0 0 30px rgba(255,61,180,.55); }
.nC .neon-soft svg { filter: drop-shadow(0 0 3px rgba(255,61,180,.7)); }
@keyframes pulseC { 0%,100% { box-shadow: 0 0 4px rgba(255,61,180,.9), 0 0 14px rgba(255,61,180,.5), 0 0 30px rgba(255,61,180,.25), inset 0 0 10px rgba(255,61,180,.3); } 50% { box-shadow: 0 0 6px #FF3DB4, 0 0 24px rgba(255,61,180,.75), 0 0 50px rgba(255,61,180,.45), inset 0 0 14px rgba(255,61,180,.45); } }

/* Botão neon principal (Ver Cardápio) */
.botao-neon {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  height: 64px; border-radius: 16px;
  background: var(--cor-principal);
  font-family: var(--fonte-titulo); font-size: 30px; letter-spacing: 2px;
}

/* ===================================================================
   FAIXA DO ANUNCIANTE (topo)
   =================================================================== */
.faixa {
  display: flex; align-items: center; gap: 10px;
  height: 52px; padding: 0 12px;
  background: var(--faixa-fundo); color: var(--faixa-texto);
  border-bottom: 3px solid var(--faixa-destaque);
  font-family: Montserrat, sans-serif;
}
/* Área da faixa: guarda 1 a 4 anúncios empilhados (carrossel) */
.faixa-area { position: relative; height: 52px; overflow: hidden; flex: none; }
.faixa-area-grande { height: 64px; }
.faixa-fixa { position: sticky; top: 0; z-index: 5; }
.faixa-area .faixa { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .45s ease, visibility .45s; }
.faixa-area .faixa.faixa-atual { opacity: 1; visibility: visible; }
@media (prefers-reduced-motion: reduce) { .faixa-area .faixa { transition: none; } }
.faixa .faixa-logo { flex: none; width: 40px; height: 40px; object-fit: contain; }
/* Estilo "imagem pronta": a imagem ocupa a faixa inteira */
.faixa-imagem { padding: 0; border-bottom: 0; background: #222; }
.faixa-imagem img { width: 100%; height: 100%; object-fit: cover; display: block; }
.faixa-pontos {
  position: absolute; left: 50%; bottom: 6px; transform: translateX(-50%); z-index: 2;
  display: flex; gap: 5px; padding: 3px 6px; border-radius: 999px; background: rgba(0,0,0,.28); pointer-events: none;
}
.faixa-pontos i { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.55); transition: background .3s, width .3s; }
.faixa-pontos i.atual { background: #fff; width: 14px; border-radius: 3px; }
.faixa-frase {
  flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-size: 12px; font-weight: 800; letter-spacing: .2px; text-transform: uppercase;
}
.faixa-frase mark {
  background: var(--faixa-destaque); color: var(--faixa-marca-texto);
  padding: 1px 5px; border-radius: 3px;
}
.faixa svg { flex: none; }

/* Versão maior, na entrada */
.faixa-grande { height: 64px; gap: 12px; padding: 0 14px; }
.faixa-grande .faixa-logo { width: 50px; height: 50px; }
.faixa-grande .faixa-frase {
  display: flex; flex-direction: column; gap: 3px;
  white-space: normal; font-size: 15px; line-height: 1.1; letter-spacing: .3px;
}
.faixa-grande .faixa-frase mark { padding: 1px 6px; }
.faixa-lado { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.faixa-lado span { font-size: 9px; letter-spacing: 1px; text-transform: uppercase; opacity: .85; }

/* ===================================================================
   ENTRADA
   =================================================================== */
.capa { position: relative; height: 540px; overflow: hidden; background: #3a2a22; }
.capa > img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: 38% center;
}
.capa-sombra {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(var(--sombra-rgb),.5) 0%, rgba(var(--sombra-rgb),.74) 55%, rgba(var(--sombra-rgb),.92) 100%);
}
.capa-conteudo {
  position: relative; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px;
  padding: 32px 28px 48px; text-align: center;
}
.logo-grande {
  width: 176px; height: 176px; border-radius: 50%;
  background: var(--cor-fundo); border: 3px solid var(--cor-destaque);
  box-shadow: 0 0 0 6px rgba(246,238,223,.18), 0 12px 32px rgba(0,0,0,.35);
  display: flex; align-items: center; justify-content: center;
}
.logo-grande img { width: 122px; height: auto; }
.linha-ano { display: flex; align-items: center; gap: 12px; }
.linha-ano i { width: 40px; height: 1px; background: var(--cor-destaque); }
.linha-ano span { font-family: var(--fonte-titulo); font-size: 30px; letter-spacing: 4px; color: var(--cor-destaque-claro); }
.boas-vindas {
  margin: 0; max-width: 324px;
  font-family: var(--fonte-detalhe); font-size: 30px; line-height: 1.2; font-weight: 700; color: #FBF4E6;
}

.selos-entrada {
  display: flex; flex-wrap: wrap; gap: 10px 8px; justify-content: center;
  margin-top: -26px; position: relative; padding: 0 8px;
}
.selo-pilula {
  display: flex; align-items: center; gap: 8px; white-space: nowrap;
  min-height: 44px; padding: 6px 14px; border-radius: 999px;
  background: #FFFDF8; border: 1.5px solid var(--cor-destaque);
  box-shadow: 0 6px 16px rgba(60,20,25,.15);
  font-size: 12px; font-weight: 700; color: var(--cor-principal); text-align: left;
}
.selo-pilula svg { flex: none; }
.selo-pilula.longo { white-space: normal; }

.botoes-entrada {
  flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 14px;
  padding: 36px 20px 40px;
}
.grade-botoes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.grade-botoes > :last-child:nth-child(odd) { grid-column: 1 / -1; }
.botao-claro {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  height: 56px; padding: 0 12px; border-radius: 14px; text-align: center;
  background: #FFFDF8; border: 1.5px solid #E3D3B8;
  color: var(--cor-principal); font-size: 14px; font-weight: 700;
}
.botao-claro svg { flex: none; }

/* ===================================================================
   RODAPÉ COM CONTATOS (entrada e Nossa História)
   =================================================================== */
.rodape-contato {
  margin-top: auto; background: var(--cor-principal); color: #F3E7D3;
  padding: 28px 22px 24px; display: flex; flex-direction: column; gap: 16px;
}
.rodape-titulo { display: flex; align-items: center; gap: 10px; }
.rodape-titulo span { font-family: var(--fonte-titulo); font-size: 24px; letter-spacing: 2px; color: var(--cor-destaque-claro); }
.rodape-titulo i { flex: 1; height: 1px; background: var(--cor-destaque-claro); opacity: .4; }
.rodape-item { display: flex; gap: 12px; align-items: center; font-size: 14px; min-height: 24px; }
.rodape-item.endereco { align-items: flex-start; line-height: 1.5; }
.rodape-item svg { flex: none; color: var(--cor-destaque-claro); }
.rodape-item.endereco svg { margin-top: 2px; }
.rodape-item small { font-size: 14px; opacity: .8; }
.rodape-assinatura {
  border-top: 1px solid rgba(243,231,211,.2); padding-top: 14px;
  display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center;
}
.rodape-assinatura > span { font-size: 11px; color: rgba(243,231,211,.75); }
.rodape-assinatura strong { color: #F3E7D3; }
.pilulas-xtv { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.pilula-xtv {
  display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 14px;
  border-radius: 999px; border: 1px solid rgba(232,199,122,.5);
  font-size: 12px; font-weight: 600; color: #F3E7D3;
}
.pilula-xtv svg { flex: none; }

/* ===================================================================
   CABEÇALHO COMPACTO (cardápio e Nossa História)
   =================================================================== */
.cabecalho {
  display: flex; align-items: center; gap: 12px; padding: 12px 16px;
  background: var(--cor-principal); color: #FBF4E6;
}
.botao-voltar {
  flex: none; width: 44px; height: 44px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.1);
}
.logo-pequeno {
  flex: none; width: 52px; height: 52px; border-radius: 50%;
  background: var(--cor-fundo); border: 2px solid var(--cor-destaque);
  display: flex; align-items: center; justify-content: center;
}
.logo-pequeno img { width: 36px; height: auto; }
.cabecalho-textos { display: flex; flex-direction: column; min-width: 0; }
.cabecalho-nome { font-family: var(--fonte-titulo); font-size: 26px; letter-spacing: 1.5px; line-height: 1; }
.cabecalho-sub { font-size: 11px; letter-spacing: .5px; color: var(--cor-destaque-claro); }

/* ===================================================================
   CARDÁPIO
   =================================================================== */
.busca-area { padding: 14px 16px 6px; background: var(--cor-fundo); }
.busca-caixa {
  display: flex; align-items: center; gap: 10px; height: 52px; padding: 0 8px 0 16px;
  border-radius: 14px; background: #FFFDF8; border: 1.5px solid #E3D3B8;
  box-shadow: 0 2px 6px rgba(60,20,25,.06); color: var(--cor-principal);
}
.busca-caixa svg { flex: none; }
.busca-caixa input {
  flex: 1; min-width: 0; height: 44px; border: 0; background: transparent;
  font-family: var(--fonte-texto); font-size: 16px; color: #2b1a1d;
}
.busca-caixa input::placeholder { color: #7a6a64; }
.busca-caixa input:focus { outline: 2px solid var(--cor-destaque); outline-offset: 1px; }
.busca-caixa input::-webkit-search-cancel-button { display: none; }
.busca-limpar {
  flex: none; width: 40px; height: 40px; border: 0; border-radius: 10px;
  background: #F1E5D2; color: var(--cor-principal);
  display: flex; align-items: center; justify-content: center; cursor: pointer;
}

.sem-faixa { --altura-faixa: 0px; }
.chips {
  position: sticky; top: var(--altura-faixa, 52px); z-index: 4;
  display: flex; gap: 8px; overflow-x: auto; padding: 14px 16px 16px;
  background: var(--cor-fundo); border-bottom: 1px solid #E3D3B8;
  scrollbar-width: none;
}
.chips::-webkit-scrollbar { display: none; }
.chip {
  flex: none; display: flex; align-items: center; height: 40px; padding: 0 16px;
  border-radius: 999px; font-size: 13px; white-space: nowrap;
  transition: box-shadow .2s ease, transform .15s ease;
}
.chip:active { transform: scale(.97); }
.chip-off { background: transparent; color: #6b5a55; border: 1.5px solid #E3D3B8; font-weight: 600; }
.chip-on { color: #2A0812; font-weight: 800; }
.nA .chip-on { background: #FFC24D; border: 1.5px solid #FFC24D; text-shadow: 0 0 6px rgba(255,236,190,.6); box-shadow: 0 0 6px rgba(255,194,77,.9), 0 0 18px rgba(255,194,77,.55), 0 0 34px rgba(255,194,77,.25); }
.nA .chip-on:active { box-shadow: 0 0 10px #FFC24D, 0 0 28px rgba(255,194,77,.85), 0 0 50px rgba(255,194,77,.45); }
.nB .chip-on { background: #FF8A33; border: 1.5px solid #FF8A33; text-shadow: 0 0 6px rgba(255,220,190,.6); box-shadow: 0 0 6px rgba(255,122,26,.9), 0 0 18px rgba(255,122,26,.55), 0 0 34px rgba(255,122,26,.25); }
.nB .chip-on:active { box-shadow: 0 0 10px #FF7A1A, 0 0 28px rgba(255,122,26,.85), 0 0 50px rgba(255,122,26,.45); }
.nC .chip-on { background: #FF6AC9; border: 1.5px solid #FF6AC9; text-shadow: 0 0 6px rgba(255,220,240,.6); box-shadow: 0 0 6px rgba(255,61,180,.9), 0 0 18px rgba(255,61,180,.55), 0 0 34px rgba(255,61,180,.25); }
.nC .chip-on:active { box-shadow: 0 0 10px #FF3DB4, 0 0 28px rgba(255,61,180,.85), 0 0 50px rgba(255,61,180,.45); }

.resultado-busca { margin: 14px 16px 0; font-size: 13px; color: #6b5a55; }
.nada-encontrado {
  margin: 24px 16px; padding: 28px 20px; border-radius: 16px;
  background: #FFFDF8; border: 1.5px dashed #E3D3B8; text-align: center;
  display: flex; flex-direction: column; gap: 6px;
}
.nada-encontrado strong { font-family: var(--fonte-titulo); font-weight: 400; font-size: 26px; letter-spacing: 1px; color: var(--cor-principal); }
.nada-encontrado span { font-size: 14px; color: #6b5a55; }

.categoria { padding: 22px 16px 6px; scroll-margin-top: 120px; }
/* A foto segue o formato original da imagem (sem cortar o produto).
   Fotos muito altas param em 320px; fotos muito baixas ganham no mínimo 120px. */
.categoria-foto {
  position: relative; width: 100%; height: auto; aspect-ratio: 16 / 9;
  min-height: 120px; max-height: 320px; border-radius: 18px; overflow: hidden;
  background-color: #8a5a3a;
  background-image: repeating-linear-gradient(135deg, rgba(255,255,255,.08) 0 14px, rgba(255,255,255,0) 14px 28px);
}
.categoria-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.categoria-foto::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(var(--sombra-rgb),0) 55%, rgba(var(--sombra-rgb),.35) 100%);
}
.titulo-linhas { display: flex; align-items: center; gap: 12px; }
.titulo-linhas i { flex: 1; height: 2px; background: var(--cor-destaque); opacity: .55; }
.categoria .titulo-linhas { margin: 16px 0 4px; }
.categoria h2 {
  margin: 0; font-family: var(--fonte-titulo); font-weight: 400; font-size: 40px;
  letter-spacing: 2px; line-height: 1; color: var(--cor-principal); text-align: center;
}
.categoria-sub {
  margin: 0 0 8px; text-align: center;
  font-family: var(--fonte-detalhe); font-size: 20px; font-weight: 700; color: var(--cor-destaque-escuro);
}
.produtos { display: flex; flex-direction: column; }
.produto {
  display: flex; align-items: center; gap: 12px; width: 100%;
  min-height: 56px; padding: 12px 4px; border: 0; border-bottom: 1px dashed #DCCBAE;
  background: transparent; text-align: left; cursor: pointer; color: inherit;
}
.produto:active { background: #F1E5D2; }
/* Foto quadrada ao lado do produto (ou o ícone da categoria, enquanto não houver foto) */
.produto-foto {
  flex: none; width: 76px; height: 76px; border-radius: 14px; overflow: hidden;
  border: 1.5px solid #E3D3B8; background: #FFFDF8; box-shadow: 0 2px 6px rgba(60,20,25,.08);
  display: flex; align-items: center; justify-content: center;
}
.produto-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.produto-foto.sem-foto {
  color: var(--cor-destaque);
  background: radial-gradient(circle at 50% 40%, #FFFDF8 0%, #F6EEDF 100%);
}
.produto.esgotado .produto-foto img { filter: grayscale(1); }
@media (max-width: 340px) { .produto-foto { width: 64px; height: 64px; } }
.produto.esgotado { opacity: .6; }
.produto-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.produto-nome-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.produto-nome { font-size: 15px; font-weight: 700; color: #2b1a1d; }
.produto-desc {
  font-size: 13px; font-style: italic; line-height: 1.4; color: #6b5a55;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.produto-cod { font-size: 10px; letter-spacing: .5px; color: #7a6a64; }
.produto-precos { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; text-align: right; }
.preco-bloco { display: flex; flex-direction: column; align-items: flex-end; }
.preco-rotulo { font-size: 11px; color: #6b5a55; }
.preco { font-size: 16px; font-weight: 700; white-space: nowrap; color: var(--cor-principal); }
.esgotado .preco { color: #6b5a55; text-decoration: line-through; }
.preco-unidade { font-size: 11px; font-weight: 600; color: #6b5a55; }

.etiqueta {
  font-size: 10px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase;
  padding: 3px 7px; border-radius: 6px;
}
.etiqueta-encomenda { border: 1.5px solid #8A6420; color: #6E4E14; background: #FBF1DA; }
.etiqueta-esgotado { background: #4a3a37; color: #fff; }

.proxima-area { padding: 18px 16px 4px; }
.proxima {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%;
  min-height: 56px; padding: 0 18px; border-radius: 16px;
  background: #FFFDF8; border: 1.5px solid var(--cor-destaque); color: var(--cor-principal);
  cursor: pointer; text-align: left;
}
.proxima-textos { display: flex; flex-direction: column; gap: 1px; }
.proxima-textos small { font-size: 11px; letter-spacing: 1px; text-transform: uppercase; color: #6b5a55; }
.proxima-textos strong { font-family: var(--fonte-titulo); font-weight: 400; font-size: 24px; letter-spacing: 1.5px; line-height: 1.05; }

/* Card de anúncio no fim do cardápio (modelo XTV Mídias) */
.card-anuncio-area { padding: 18px 16px 4px; }
.card-anuncio {
  display: flex; flex-direction: column; border-radius: 18px; overflow: hidden;
  background: #F3ECE0; border: 1.5px solid #E2D2B6; box-shadow: 0 6px 18px rgba(20,23,31,.12);
  font-family: Montserrat, sans-serif;
}
.card-anuncio-topo { display: flex; align-items: center; gap: 12px; padding: 14px 14px 12px; }
.card-anuncio-topo img { flex: none; width: 116px; height: auto; }
.card-anuncio-topo div { display: flex; flex-direction: column; gap: 2px; }
.card-anuncio-chamada { font-size: 12px; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: #2a2f3a; }
.card-anuncio-titulo { font-size: 22px; font-weight: 800; line-height: 1.05; color: #14171F; }
.card-anuncio-base { display: flex; flex-direction: column; gap: 10px; padding: 12px 14px 14px; background: #0E1420; color: #fff; }
.card-anuncio-frase { font-size: 12px; font-weight: 700; letter-spacing: .3px; }
.card-anuncio-frase mark { background: none; color: #F26A2E; }
.card-anuncio-botoes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.card-anuncio-botoes > :only-child { grid-column: 1 / -1; }
.card-anuncio-botoes a {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 44px; padding: 0 12px; border-radius: 999px;
  font-size: 12px; font-weight: 700; white-space: nowrap; color: #fff;
}
.card-anuncio-botoes .cheio { background: #E8501E; }
.card-anuncio-botoes .vazado { border: 1.5px solid rgba(255,255,255,.5); }
.card-anuncio-imagem img { display: block; width: 100%; height: auto; }
.rotulo-anuncio { margin: 6px 4px 0; font-size: 10px; letter-spacing: 1px; text-transform: uppercase; color: #7a6a64; text-align: right; }

/* ===================================================================
   DETALHE DO PRODUTO
   =================================================================== */
.detalhe { padding: 16px 16px 28px; display: flex; flex-direction: column; gap: 16px; }
.detalhe-voltar {
  align-self: flex-start; display: flex; align-items: center; gap: 6px;
  height: 44px; padding: 0 16px 0 10px; border-radius: 12px;
  background: #FFFDF8; border: 1.5px solid #E3D3B8; color: var(--cor-principal);
  font-size: 14px; font-weight: 700; cursor: pointer;
}
.detalhe-faixa {
  position: relative; display: flex; align-items: center; gap: 16px; padding: 18px;
  border-radius: 18px; background: var(--cor-principal); color: #FBF4E6; overflow: hidden;
}
.detalhe-icone {
  flex: none; width: 76px; height: 76px; border-radius: 50%;
  background: rgba(251,244,230,.08); border: 2px solid var(--cor-destaque);
  box-shadow: 0 0 0 5px rgba(232,199,122,.12);
  display: flex; align-items: center; justify-content: center; color: var(--cor-destaque-claro);
}
.detalhe-categoria { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.detalhe-categoria small { font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--cor-destaque-claro); }
.detalhe-categoria span { font-family: var(--fonte-detalhe); font-size: 22px; font-weight: 700; line-height: 1.15; color: #FBF4E6; }
.detalhe-foto { width: 100%; max-height: 260px; object-fit: cover; border-radius: 18px; display: block; }
.detalhe-corpo { display: flex; flex-direction: column; gap: 10px; }
.detalhe-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.detalhe-topo h1 {
  margin: 0; font-family: var(--fonte-titulo); font-weight: 400; font-size: 38px;
  letter-spacing: 1.5px; line-height: 1; color: var(--cor-principal);
}
.detalhe-precos { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; padding-top: 2px; }
.detalhe-precos .preco-rotulo { font-size: 12px; }
.detalhe-precos .preco { font-size: 24px; font-weight: 800; }
.detalhe-precos .preco-unidade { font-size: 12px; }
.detalhe.esgotado .preco { color: #6b5a55; text-decoration: line-through; }
.detalhe-etiquetas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.detalhe-etiquetas .produto-cod { font-size: 11px; }
.detalhe-carinho { display: flex; align-items: center; gap: 10px; margin: 2px 0; }
.detalhe-carinho i { width: 28px; height: 2px; background: var(--cor-destaque); }
.detalhe-carinho span { font-family: var(--fonte-detalhe); font-size: 20px; font-weight: 700; color: var(--cor-destaque-escuro); }
.ingredientes {
  display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 16px;
  background: #FFFDF8; border: 1.5px solid #E3D3B8;
}
.ingredientes > span { font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: #6b5a55; }
.ingredientes-lista { display: flex; flex-wrap: wrap; gap: 8px; }
.ingredientes-lista span {
  display: flex; align-items: center; min-height: 32px; padding: 0 12px; border-radius: 999px;
  background: #F6EEDF; border: 1.5px solid #E3D3B8;
  font-size: 13px; font-weight: 600; color: var(--cor-principal);
}
.descricao-frase {
  margin: 0; padding: 16px; border-radius: 16px; background: #FFFDF8; border: 1.5px solid #E3D3B8;
  font-size: 15px; font-style: italic; line-height: 1.55; color: #4e3d3a;
}
.detalhe .botao-neon { height: 56px; font-size: 24px; cursor: pointer; width: 100%; }

/* Rodapé simples do cardápio */
.rodape-cardapio {
  margin-top: auto; padding: 32px 20px 28px;
  display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center;
  border-top: 1px solid #E3D3B8;
}
.rodape-cardapio .obrigado { font-family: var(--fonte-detalhe); font-size: 22px; font-weight: 700; color: var(--cor-principal); }
.rodape-cardapio > span { font-size: 12px; color: #6b5a55; }
.rodape-cardapio strong { color: var(--cor-principal); }
.rodape-cardapio .pilulas-xtv { margin: 2px 0 4px; }
.rodape-cardapio .pilula-xtv { border-color: #E3D3B8; background: #FFFDF8; color: var(--cor-principal); }

/* ===================================================================
   NOSSA HISTÓRIA
   =================================================================== */
.historia-foto { position: relative; height: 230px; overflow: hidden; background: #8a5a3a; }
.historia-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.historia-foto::after {
  content: ""; position: absolute; inset: 0 0 -1px 0;
  background: linear-gradient(180deg, rgba(var(--sombra-rgb),0) 45%, var(--cor-fundo) 100%);
}
.historia-titulo {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  margin-top: -34px; position: relative; padding: 0 20px 8px; text-align: center;
}
.selo-ano {
  display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 16px; border-radius: 999px;
  background: var(--cor-principal); border: 1.5px solid var(--cor-destaque);
  box-shadow: 0 6px 16px rgba(60,20,25,.2);
  font-family: var(--fonte-titulo); font-size: 20px; letter-spacing: 3px; color: var(--cor-destaque-claro);
}
.historia-titulo h1 {
  margin: 0; font-family: var(--fonte-titulo); font-weight: 400; font-size: 52px;
  letter-spacing: 2px; line-height: 1; color: var(--cor-principal);
}
.historia-titulo .titulo-linhas { width: 100%; }
.historia-titulo .titulo-linhas span { font-family: var(--fonte-detalhe); font-size: 22px; font-weight: 700; color: var(--cor-destaque-escuro); }

.linha-tempo { display: flex; flex-direction: column; gap: 22px; padding: 18px 20px 8px 20px; }
.bloco { display: flex; gap: 14px; }
.bloco-marca { flex: none; display: flex; flex-direction: column; align-items: center; width: 14px; }
.bloco-marca b {
  width: 14px; height: 14px; border-radius: 50%; background: var(--cor-destaque);
  border: 3px solid #FBF4E6; box-shadow: 0 0 0 1.5px var(--cor-destaque); margin-top: 5px;
}
.bloco-marca i { flex: 1; width: 2px; background: var(--cor-destaque); opacity: .4; margin-top: 6px; }
.bloco-texto { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.bloco-texto h2 {
  margin: 0; font-family: var(--fonte-titulo); font-weight: 400; font-size: 26px;
  letter-spacing: 1.5px; line-height: 1.05; color: var(--cor-principal);
}
.bloco-texto p { margin: 0; font-size: 15px; line-height: 1.65; color: #3b2a2a; }

.destaques { padding: 26px 16px 8px; display: flex; flex-direction: column; gap: 14px; }
.destaques h2 {
  margin: 0; font-family: var(--fonte-titulo); font-weight: 400; font-size: 34px;
  letter-spacing: 2px; line-height: 1; color: var(--cor-principal);
}
.destaques-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.destaque {
  display: flex; flex-direction: column; border-radius: 16px; overflow: hidden;
  background: #FFFDF8; border: 1.5px solid #E3D3B8; box-shadow: 0 4px 12px rgba(60,20,25,.08);
}
.destaque img { width: 100%; height: 120px; object-fit: cover; display: block; background: #8a5a3a; }
.destaque div { display: flex; flex-direction: column; padding: 10px 12px 12px; }
.destaque strong { font-family: var(--fonte-titulo); font-weight: 400; font-size: 24px; letter-spacing: 1px; line-height: 1.05; color: var(--cor-principal); }
.destaque span { font-family: var(--fonte-detalhe); font-size: 18px; font-weight: 700; color: var(--cor-destaque-escuro); }

.selos-historia { display: flex; flex-direction: column; gap: 10px; padding: 22px 16px 8px; }
.selo-cartao {
  display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 10px 16px;
  border-radius: 16px; background: #FFFDF8; border: 1.5px solid var(--cor-destaque);
  font-size: 14px; font-weight: 700; color: var(--cor-principal);
}
.selo-cartao svg { flex: none; }
.historia-acao { padding: 26px 20px 36px; }

/* Página "cardápio indisponível" */
.indisponivel { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 40px 24px; text-align: center; }
.indisponivel h1 { margin: 0; font-family: var(--fonte-titulo); font-weight: 400; font-size: 40px; letter-spacing: 1.5px; line-height: 1; color: var(--cor-principal); }
.indisponivel p { margin: 0; font-size: 15px; line-height: 1.6; color: #6b5a55; }

/* Link da Política de Privacidade nos rodapés */
.link-privacidade { min-height: 44px; display: inline-flex; align-items: center; font-size: 12px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.rodape-assinatura .link-privacidade { color: rgba(243,231,211,.8); }
.rodape-cardapio .link-privacidade { color: #6b5a55; margin-top: -6px; }