/* ─────────────────────────────────────────────────────────────────────────
   Cardápio Vértice — tema "clean / editorial" (out/2026)
   Inspiração: cardápio de espresso em grade, títulos em caixa alta pesada
   entre filetes finos, nome em negrito, preço só com o número em itálico e
   ingredientes em tom terroso. Mesma grade (2 colunas no celular).
   Carregado depois do style.css e do Bootstrap.
   ───────────────────────────────────────────────────────────────────────── */

:root {
  --fundo: #ffffff;
  --tinta: #111111;
  --suave: #6b6b6b;
  --terra: #8a6a45;          /* ingredientes / descrição */
  --verde: #6f8a55;          /* opcional vegano */
  --filete: #111111;

  --f-titulo: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --f-texto: "Archivo", "Helvetica Neue", Arial, sans-serif;
}

* { font-family: var(--f-texto); }
html, body, main, .menu-section, .restaurant-menu { background: var(--fundo) !important; }
body { color: var(--tinta); -webkit-font-smoothing: antialiased; padding-top: 128px; }

main hr, .menu-section hr, body > div > hr { display: none !important; }
.menu-section { padding-top: 0 !important; margin-top: 0 !important; }

/* ── Topo: logo preta em fundo branco; fixa e compacta ao rolar ── */
.menu-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1030;
  height: auto !important;
  padding: 26px 0 22px;
  background: var(--fundo) !important;
  border-bottom: 1px solid transparent;
  transition: padding .25s ease, border-color .25s ease;
}
.menu-header img {
  height: 80px; width: auto; display: block;
  filter: invert(1);                       /* a logo é branca: vira preta */
  transition: height .25s ease;
}
body.rolou .menu-header { padding: 10px 0; border-bottom-color: #e6e6e6; }
body.rolou .menu-header img { height: 34px; }

/* ── Títulos de seção: caixa alta pesada e expandida entre dois filetes ── */
.display-6 {
  font-family: var(--f-titulo) !important;
  font-weight: 900 !important;
  font-stretch: 125%;
  font-variation-settings: "wdth" 125;
  text-transform: uppercase;
  font-size: clamp(1.7rem, 9.2vw, 3.4rem) !important;
  line-height: 1 !important;
  letter-spacing: -0.01em;
  text-align: center;
  margin: 2.6rem 10px 1.4rem !important;
  padding: .55em 0 .5em;
  border-top: 1px solid var(--filete);
  border-bottom: 1px solid var(--filete);
}
main .display-6:first-of-type { margin-top: .4rem !important; }
.display-6 + .fs-6 {
  font-size: .8rem !important; font-style: italic; color: var(--suave);
  text-align: center; padding: 0 16px; margin: -0.6rem auto 1.2rem !important; max-width: 640px;
}
.display-6 + .fs-6 a { color: var(--tinta); font-style: normal; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* ── Grade: 2 colunas no celular, 3 no tablet, 4 no computador ── */
.menu-section-items {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 26px 10px;
  width: 100%; max-width: 1100px;
  margin: 0 auto; padding: 0 10px;
  justify-content: initial !important;
}
@media (min-width: 640px)  { .menu-section-items { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px 16px; padding: 0 16px; } }
@media (min-width: 1000px) { .menu-section-items { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.menu-section-items > .menu-section-item {
  width: auto !important; margin: 0 !important; padding: 0;
  background: transparent; border: 0; border-radius: 0; box-shadow: none;
  display: flex; flex-direction: column;
}
.menu-section-items > .menu-section-item.d-none { display: none !important; }
.menu-section-items:not(:has(> .menu-section-item:not(.d-none) ~ .menu-section-item:not(.d-none))) {
  grid-template-columns: minmax(0, 50%); justify-content: center !important;
}
@media (min-width: 640px) {
  .menu-section-items:not(:has(> .menu-section-item:not(.d-none) ~ .menu-section-item:not(.d-none))) { grid-template-columns: minmax(0, 260px); }
}

/* Fotos: retas, mesmo formato */
.menu-section-item .menu-image { width: 100%; }
.menu-section-item .menu-image img,
.menu-section-item > img {
  width: 100% !important; aspect-ratio: 1 / 1; object-fit: cover;
  border-radius: 0; margin-bottom: 10px !important; background: #efefef; display: block;
}

/* ── Nome e preço (só o número, em itálico) ── */
.menu-section-item-headline {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 2px;
}
.menu-section-item-headline p,
.menu-section-item-headline h5,
.menu-section-item-headline h6 {
  font-size: .98rem !important; font-weight: 700; line-height: 1.2; letter-spacing: -.005em; margin: 0; color: var(--tinta);
}
.menu-section-item-headline span { flex-shrink: 0; }
.text-span, .text-span-vegan {
  background: none !important; color: var(--tinta) !important; padding: 0 !important; border-radius: 0;
  font-size: .95rem !important; font-weight: 400 !important; font-style: italic; white-space: nowrap; margin: 0; line-height: 1.2;
}

/* ── Opcionais: linha discreta em itálico ── */
.menu-section-item-headline-vegan {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 3px 0 0;
}
.menu-section-item-headline-vegan p { font-size: .8rem !important; font-style: italic; margin: 0; color: var(--verde); }
.menu-section-item-headline-vegan .text-span,
.menu-section-item-headline-vegan .text-span-vegan { font-size: .8rem !important; color: var(--verde) !important; }

/* ── Descrição: tom terroso, como os ingredientes da inspiração ── */
.menu-section-item-description,
.menu-section-item- {
  font-size: .8rem !important; line-height: 1.45 !important; color: var(--terra);
  margin: 6px 0 0 !important;
}

/* Métodos de preparo (seção dos coados) */
.card { border-radius: 0; border: 0; box-shadow: none; background: transparent; }
.card-img-top { border-radius: 0; }
.card-title { font-weight: 700; }

/* Preço com mais destaque: maior, mais forte e com um "R$" pequeno na frente */
.menu-section-item-headline .text-span {
  font-size: 1.12rem !important;
  font-weight: 700 !important;
  font-style: italic;
  letter-spacing: -0.01em;
}
.menu-section-item-headline .text-span::before {
  content: "R$ ";
  font-size: .62em;
  font-weight: 500;
  font-style: normal;
  color: var(--suave);
  letter-spacing: .02em;
}
/* opcionais: um passo abaixo do preço principal, mas legíveis */
.menu-section-item-headline-vegan .text-span,
.menu-section-item-headline-vegan .text-span-vegan { font-size: .88rem !important; font-weight: 700 !important; }
.menu-section-item-headline-vegan .text-span::before,
.menu-section-item-headline-vegan .text-span-vegan::before { content: none; }

/* Descrição em tom de preto (um cinza bem escuro, para não brigar com o nome) */
.menu-section-item-description,
.menu-section-item- { color: #2b2b2b !important; }

/* Adicionais/opcionais com mais destaque: faixa leve em verde, texto mais forte */
.menu-section-item-headline-vegan {
  background: #eef3e8;
  padding: 4px 6px;
  margin: 6px 0 2px;
}
.menu-section-item-headline-vegan p {
  font-size: .86rem !important;
  font-weight: 600;
  font-style: normal;
  color: #4d6a36 !important;
}
.menu-section-item-headline-vegan .text-span,
.menu-section-item-headline-vegan .text-span-vegan {
  font-size: .95rem !important;
  font-weight: 800 !important;
  font-style: italic;
  color: #3f5a2b !important;
}
.menu-section-item-headline-vegan { width: 100%; align-self: stretch; box-sizing: border-box; }
.menu-section-item-headline-vegan > span { margin-left: auto; }

/* ═════════ Tema v3: navegação, destaques, selos, detalhe, idioma ═════════
   Identidade: linhas retas em tudo (nenhum canto arredondado). */
:root { --fundo: #f7f5f1; --tinta: #111; --terra: #7a5c3a; }
*, *::before, *::after { border-radius: 0 !important; }

body { padding-top: 172px; font-variant-numeric: tabular-nums; }
.menu-header { display: flex; flex-direction: column; align-items: center; padding: 22px 0 0 !important; }
body.rolou .menu-header { padding: 8px 0 0 !important; }
.menu-header img { height: 76px; }
body.rolou .menu-header img { height: 30px; }

/* Botão de idioma: quadrado, fino, no canto */
.m-lang {
  position: absolute; top: 12px; right: 12px;
  font: 600 .72rem/1 var(--f-texto); letter-spacing: .08em;
  padding: 7px 9px; background: transparent; color: var(--tinta);
  border: 1px solid var(--tinta); cursor: pointer;
}
body.rolou .m-lang { top: 6px; }

/* Barra de categorias fixa */
.m-nav {
  width: 100%; margin-top: 14px;
  display: flex; gap: 0; overflow-x: auto; scrollbar-width: none;
  border-top: 1px solid var(--tinta); border-bottom: 1px solid var(--tinta);
  background: var(--fundo);
}
body.rolou .m-nav { margin-top: 8px; }
.m-nav::-webkit-scrollbar { display: none; }
.m-nav a {
  flex: 0 0 auto; padding: 10px 14px;
  font: 700 .74rem/1 var(--f-texto); letter-spacing: .08em; text-transform: uppercase;
  color: var(--tinta); text-decoration: none; white-space: nowrap;
  border-right: 1px solid #d9d5ce;
}
.m-nav a.ativa { background: var(--tinta); color: var(--fundo); }

/* Subtítulo da seção, em itálico */
.m-sub { font-size: .82rem; font-style: italic; color: #555; text-align: center; margin: -0.7rem 16px 1.3rem; }
.display-6 { scroll-margin-top: 180px; }

/* Descrição no estilo das referências */
.m-ing { display: block; color: #2b2b2b; }
.m-ing strong { font-weight: 700; color: var(--tinta); }
.m-barra { color: #a39c92; }
.m-frase { display: block; margin-top: 3px; font-style: italic; color: var(--terra); }
.menu-section-item-description {
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}

/* Selos: texto pequeno em caixa alta com filete fino, sem cor gritante */
.m-selos { display: flex; flex-wrap: wrap; gap: 4px; margin: 5px 0 2px; }
.m-selo {
  font: 600 .6rem/1 var(--f-texto); letter-spacing: .07em; text-transform: uppercase;
  padding: 3px 5px; border: 1px solid #b9b2a7; color: #5a544b; background: transparent;
}
.m-selo-a18 { border-color: var(--tinta); color: var(--tinta); }
.m-selo-opveg, .m-selo-vg { border-color: #8aa06f; color: #4d6a36; }

/* Produto em destaque: card largo, foto horizontal */
.menu-section-items > .menu-section-item.m-destaque { grid-column: 1 / -1; }
.m-destaque .menu-image img, .m-destaque > img { aspect-ratio: 16 / 10 !important; }
.m-destaque .menu-section-item-headline p, .m-destaque .menu-section-item-headline h5 { font-size: 1.25rem !important; }
.m-destaque .menu-section-item-headline .text-span { font-size: 1.3rem !important; }
.m-destaque .menu-section-item-description { -webkit-line-clamp: 6; font-size: .86rem !important; }
@media (min-width: 640px) { .menu-section-items > .menu-section-item.m-destaque { grid-column: span 2; } }

/* Card clicável */
.menu-section-item[role="button"] { cursor: pointer; }
.menu-section-item[role="button"]:focus-visible { outline: 1px solid var(--tinta); outline-offset: 3px; }

/* Fotos com fade suave */
.m-img { opacity: 0; transition: opacity .45s ease; }
.m-img.carregada { opacity: 1; }

/* Detalhe do produto */
.m-modal { position: fixed; inset: 0; z-index: 2000; display: flex; align-items: flex-end; justify-content: center; }
.m-modal[hidden] { display: none; }
.m-modal-fundo { position: absolute; inset: 0; background: rgba(17, 17, 17, .55); }
.m-modal-caixa {
  position: relative; width: 100%; max-width: 560px; max-height: 92vh; overflow-y: auto;
  background: var(--fundo); border-top: 1px solid var(--tinta);
}
@media (min-width: 640px) { .m-modal { align-items: center; } .m-modal-caixa { border: 1px solid var(--tinta); } }
.m-modal-fechar {
  position: sticky; top: 0; float: right; z-index: 1; margin: 10px;
  font: 600 .72rem/1 var(--f-texto); letter-spacing: .06em; text-transform: uppercase;
  padding: 8px 10px; background: var(--fundo); color: var(--tinta); border: 1px solid var(--tinta); cursor: pointer;
}
.m-modal-corpo img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.m-modal-texto { padding: 16px 16px 26px; }
.m-modal-topo { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--tinta); padding-bottom: 10px; margin-bottom: 10px; }
.m-modal-topo h3 { font: 800 1.35rem/1.15 var(--f-texto); margin: 0; }
.m-modal-preco { font: italic 700 1.35rem/1 var(--f-texto); white-space: nowrap; }
.m-modal-preco::before { content: "R$ "; font-size: .6em; font-weight: 500; font-style: normal; color: #6b6b6b; }
.m-modal-opcao { display: flex; justify-content: space-between; padding: 8px 10px; margin: 8px 0; background: #eef3e8; color: #3f5a2b; font-weight: 600; }
.m-modal-opcao b { font-style: italic; font-weight: 800; }
.m-modal-desc { font-size: .95rem; line-height: 1.5; margin-top: 12px; }
.m-modal-desc .m-ing { display: block; }
body.m-travado { overflow: hidden; }

/* Rodapé: Wi-Fi e aviso */
.m-rodape { margin: 3rem 10px 2rem; padding-top: 1.2rem; border-top: 1px solid var(--tinta); text-align: center; }
.m-wifi { display: inline-grid; gap: 6px; padding: 14px 18px; border: 1px solid var(--tinta); min-width: 240px; }
.m-wifi-titulo { font: 900 1rem/1 var(--f-titulo); font-stretch: 125%; font-variation-settings: "wdth" 125; text-transform: uppercase; letter-spacing: .02em; margin-bottom: 4px; }
.m-wifi div { display: flex; justify-content: space-between; gap: 18px; font-size: .9rem; }
.m-wifi div span { color: #6b6b6b; }
.m-copiar { margin-top: 6px; padding: 8px 10px; border: 1px solid var(--tinta); background: var(--tinta); color: var(--fundo); font: 600 .75rem/1 var(--f-texto); letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.m-aviso { margin-top: 1rem; font-size: .75rem; font-style: italic; color: #6b6b6b; }
/* preenche o buraco que o card largo deixa na grade */
.menu-section-items { grid-auto-flow: row dense; }

/* Ao rolar, a logo some e fica só a barra de categorias */
.menu-header img { transition: height .25s ease, opacity .2s ease, margin .25s ease; }
.m-lang { transition: opacity .2s ease; }
body.rolou .menu-header { padding: 0 !important; box-shadow: none; }
body.rolou .menu-header img { height: 0 !important; opacity: 0; margin: 0 !important; }
body.rolou .m-lang { opacity: 0; pointer-events: none; }
body.rolou .m-nav { margin-top: 0 !important; border-top-color: transparent; }
.display-6 { scroll-margin-top: 56px; }

/* ═════════ Coado da semana: bloco escuro de destaque ═════════ */
.menu-section-items:has(> .m-coado) { grid-template-columns: 1fr !important; padding: 0 10px; }
.menu-section-items > .menu-section-item.m-coado {
  grid-column: 1 / -1; background: #111 !important; color: #f7f5f1; padding: 0 0 18px !important;
  max-width: 720px; width: 100% !important; justify-self: center;
}
/* o texto de apoio genérico some: o bloco já explica tudo */
.display-6 + .fs-6:has(+ .menu-section-items > .m-coado),
.menu-section:has(.m-coado) .display-6 + .fs-6 { display: none !important; }
.m-coado-selo { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid #3a3a3a; }
.m-coado-selo span {
  font: 700 .7rem/1 var(--f-texto); letter-spacing: .18em; text-transform: uppercase; color: #111;
  background: #f7f5f1; padding: 5px 8px;
}
.m-coado-selo::after { content: ""; flex: 1; height: 1px; background: #3a3a3a; }
.m-coado-grid { display: grid; grid-template-columns: 1fr; }
@media (min-width: 560px) { .m-coado-grid { grid-template-columns: 1fr 1fr; } }
.m-coado-foto img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.m-coado-info { padding: 16px 14px 4px; display: flex; flex-direction: column; justify-content: flex-end; }
.m-coado-torra { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: #a8a29a; margin: 0 0 6px; }
.m-coado-nome {
  font: 900 clamp(1.9rem, 10vw, 2.8rem)/.95 var(--f-titulo); font-stretch: 125%; font-variation-settings: "wdth" 125;
  text-transform: uppercase; letter-spacing: -.01em; margin: 0; color: #f7f5f1;
}
.m-coado-notas { font: italic 500 1.25rem/1.3 var(--f-texto); color: #e2c9a6; margin: 10px 0 0; }
.m-coado-preco { display: flex; align-items: baseline; justify-content: space-between; margin-top: 14px; padding-top: 10px; border-top: 1px solid #3a3a3a; }
.m-coado-preco span { font-size: .85rem; letter-spacing: .1em; text-transform: uppercase; color: #a8a29a; }
.m-coado-preco b { font: italic 800 1.8rem/1 var(--f-texto); color: #f7f5f1; }
.m-coado-preco b::before { content: "R$ "; font-size: .5em; font-weight: 500; font-style: normal; color: #a8a29a; }
.m-coado-ficha { display: grid; grid-template-columns: 1fr 1fr; margin: 12px 14px 0; border-top: 1px solid #3a3a3a; }
.m-coado-ficha div { padding: 9px 0; border-bottom: 1px solid #3a3a3a; }
.m-coado-ficha div:nth-child(odd) { border-right: 1px solid #3a3a3a; padding-right: 10px; }
.m-coado-ficha div:nth-child(even) { padding-left: 10px; }
.m-coado-ficha dt { font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: #8f8a83; font-weight: 600; }
.m-coado-ficha dd { margin: 2px 0 0; font-size: .9rem; color: #f7f5f1; font-weight: 600; }
.m-coado-metodos { margin: 16px 14px 0; }
.m-coado-metodos p { font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: #a8a29a; margin: 0 0 8px; font-weight: 600; }
.m-coado-metodos ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
@media (min-width: 560px) { .m-coado-metodos ul { grid-template-columns: repeat(4, 1fr); } }
.m-coado-metodos li { border: 1px solid #5a5650; padding: 9px 10px; }
.m-coado-metodos li b { display: block; font-size: .9rem; color: #f7f5f1; }
.m-coado-metodos li span { display: block; font-size: .74rem; font-style: italic; color: #c9b79d; margin-top: 2px; }
.m-coado-cta { margin: 14px 14px 0; font-size: .82rem; font-style: italic; color: #d8d2c9; }

/* Coado sem foto: o ícone do filtro faz o papel de símbolo */
.m-coado-grid { grid-template-columns: 1fr !important; }
.m-coado-cabeca { display: flex; align-items: center; gap: 14px; }
.m-coado-icone { flex: 0 0 auto; width: 58px; height: 66px; color: #e2c9a6; padding: 8px; border: 1px solid #5a5650; box-sizing: content-box; }
.m-coado-info { padding-top: 18px; }

/* Bloco do coado encostado nas laterais da tela (sem margem) */
.menu-section-items:has(> .m-coado) { padding: 0 !important; max-width: none !important; }
.menu-section-items > .menu-section-item.m-coado { max-width: none !important; justify-self: stretch; }

/* Moldura vintage: filete duplo em volta do ícone */
.m-coado-icone { width: 54px; height: 68px; padding: 9px 10px; border: 1px solid #8a7a63; outline: 1px solid #5a5650; outline-offset: 3px; margin: 4px; }

/* Bloco do coado mais compacto */
.menu-section-items > .menu-section-item.m-coado { padding-bottom: 12px !important; }
.m-coado-selo { padding: 8px 12px; }
.m-coado-selo span { font-size: .62rem; padding: 4px 7px; }
.m-coado-info { padding: 10px 12px 0 !important; }
.m-coado-torra { font-size: .64rem; margin-bottom: 4px; }
.m-coado-nome { font-size: clamp(1.45rem, 7.4vw, 2.1rem) !important; }
.m-coado-notas { font-size: 1.02rem; margin-top: 6px; }
.m-coado-preco { margin-top: 10px; padding-top: 8px; }
.m-coado-preco span { font-size: .75rem; }
.m-coado-preco b { font-size: 1.45rem; }
.m-coado-ficha { margin: 8px 12px 0; }
.m-coado-ficha div { padding: 6px 0; }
.m-coado-ficha dt { font-size: .56rem; }
.m-coado-ficha dd { font-size: .8rem; }
.m-coado-cta { margin: 10px 12px 0; font-size: .76rem; }

/* Outros grãos dentro do bloco do coado */
.m-coado-outros { margin: 12px 12px 0; border-top: 1px solid #3a3a3a; }
.m-coado-outros-titulo { font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; color: #a8a29a; font-weight: 600; margin: 10px 0 2px; }
.m-coado-linha { border-bottom: 1px solid #3a3a3a; }
.m-coado-linha summary {
  list-style: none; cursor: pointer; display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 10px;
  padding: 10px 0;
}
.m-coado-linha summary::-webkit-details-marker { display: none; }
.m-cl-nome { font: 800 .95rem/1.1 var(--f-texto); text-transform: uppercase; letter-spacing: .02em; color: #f7f5f1; }
.m-cl-notas { font-size: .8rem; font-style: italic; color: #e2c9a6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.m-cl-preco { font: italic 800 1.05rem/1 var(--f-texto); color: #f7f5f1; }
.m-cl-preco::before { content: "R$ "; font-size: .62em; font-weight: 500; font-style: normal; color: #a8a29a; }
.m-coado-linha summary::after { content: "+"; grid-column: 3; display: none; }
.m-coado-linha .m-coado-ficha { margin: 0 0 10px; }
.m-coado-linha[open] .m-cl-notas { white-space: normal; }

/* Vários coados: blocos iguais, colados, separados por um filete; selo só no primeiro */
.menu-section-items:has(> .m-coado) { row-gap: 0 !important; }
.m-coado.m-coado-seguinte { border-top: 1px solid #3a3a3a; }
.m-coado.m-coado-seguinte .m-coado-selo { display: none; }
.m-coado:not(.m-coado-ultimo) .m-coado-cta { display: none; }