/* Bombocado - cardapio digital
   Mobile-first: estilos base pensados para celular, telas maiores so recebem
   reforcos via @media (min-width: ...). */

:root{
  --ivory:#fefdf9;
  --cream-peach:#f8e5d6;
  --terracotta:#cc6b4e;
  --brown:#785440;
  --brown-dark:#3b2a1f;
  --amber:#d98a34;
  --whatsapp:#25D366;
  --maxw:720px;
}

*, *::before, *::after{ box-sizing:border-box; }

[hidden]{ display:none !important; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--ivory);
  color:var(--brown-dark);
  font-family:'Public Sans', system-ui, sans-serif;
  -webkit-font-smoothing:antialiased;
  line-height:1.45;
  padding-bottom:88px; /* espaco pro botao flutuante do whatsapp nao cobrir conteudo */
}

img{ max-width:100%; display:block; }

a{ color:inherit; }

/* ---------- Cabecalho ---------- */

.site-header{
  display:flex; align-items:center; gap:14px;
  padding:20px 20px 16px;
  background:var(--ivory);
}
.site-logo{
  width:56px; height:56px; border-radius:50%;
  box-shadow:0 2px 10px rgba(59,42,31,.15);
  flex:none;
}
.site-title strong{
  display:block; font-family:'Fraunces', serif; font-weight:700; font-size:22px; color:var(--brown-dark);
}
.site-title span{
  display:block; font-size:13px; color:var(--brown);
}
.site-header a{ display:flex; align-items:center; gap:14px; text-decoration:none; color:inherit; }

/* ---------- Home: hero ---------- */

.home-hero{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:36px 20px 22px;
}
.home-hero .site-logo-lg{
  width:260px; height:auto; margin-bottom:6px;
}
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.home-hero p{ font-family:'Public Sans', sans-serif; font-size:14.5px; color:var(--brown); margin:0; }

/* ---------- Home: navegacao para os 3 cardapios ---------- */

.home-nav{
  display:flex; flex-direction:column; gap:10px;
  padding:6px 20px 30px; max-width:420px; margin:0 auto;
}
.home-nav a{
  display:flex; align-items:center; justify-content:center;
  background:var(--terracotta); color:#fff; text-decoration:none;
  font-family:'Public Sans', sans-serif; font-weight:700; font-size:16px;
  padding:16px 20px; border-radius:999px; box-shadow:0 6px 16px rgba(59,42,31,.16);
  transition:background .15s;
}
.home-nav a:hover{ background:var(--brown); }

/* ---------- Home: carrossel de produtos ---------- */

.home-carousel-wrap{ padding:6px 0 34px; }
.home-carousel-wrap h2{
  font-family:'Fraunces', serif; font-weight:600; font-size:20px; color:var(--brown-dark);
  margin:0 0 14px; padding:0 20px;
}
.home-carousel{
  display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch; padding:0 20px 6px; scrollbar-width:none;
}
.home-carousel::-webkit-scrollbar{ display:none; }
.home-carousel-item{
  flex:0 0 78%; scroll-snap-align:center; border-radius:16px; overflow:hidden;
  position:relative; box-shadow:0 6px 18px rgba(59,42,31,.16);
}
.home-carousel-item img{ width:100%; height:260px; object-fit:cover; display:block; }
.home-carousel-item .caption{
  position:absolute; left:0; right:0; bottom:0;
  background:linear-gradient(to top, rgba(59,42,31,.85), transparent);
  color:#fff; font-weight:600; font-size:14px; padding:30px 14px 12px;
}

/* ---------- Home: bloco de revenda ---------- */

.revenda-block{
  background:var(--brown-dark); color:var(--ivory); text-align:center;
  padding:32px 24px; margin:8px 20px 34px; border-radius:18px;
}
.revenda-block p{
  font-family:'Fraunces', serif; font-size:19px; font-weight:600; margin:0 0 18px; line-height:1.4;
}
.revenda-block a{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--whatsapp); color:#fff; text-decoration:none;
  padding:13px 26px; border-radius:999px; font-weight:700; font-size:15px;
}
.revenda-block a:hover{ opacity:.9; }

/* ---------- Abas de categoria (sticky) ---------- */

.tabs{
  position:sticky; top:0; z-index:20;
  display:flex; gap:8px;
  padding:10px 16px;
  background:var(--ivory);
  border-bottom:1px solid rgba(59,42,31,.1);
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.tabs::-webkit-scrollbar{ display:none; }
.tab-btn{
  flex:none;
  font-family:'Public Sans', sans-serif; font-weight:700; font-size:15px;
  padding:11px 20px; border-radius:999px; border:none; cursor:pointer;
  background:var(--cream-peach); color:var(--brown-dark);
  transition:background .15s, color .15s;
}
.tab-btn[aria-selected="true"]{
  background:var(--terracotta); color:#fff;
}

/* ---------- Pill "pedido minimo" ---------- */

.pedido-minimo-wrap{ display:flex; justify-content:center; padding:20px 16px 6px; }
.pedido-minimo{
  background:var(--terracotta); color:#fff; font-weight:700; font-size:14.5px;
  padding:11px 22px; border-radius:999px; text-align:center;
  box-shadow:0 6px 16px rgba(59,42,31,.16);
}

/* ---------- Categoria / secoes ---------- */

.category-panel{ padding:8px 16px 28px; }
.category-panel[hidden]{ display:none; }

.section-block{
  border:none; border-bottom:1px solid rgba(59,42,31,.12);
  margin:0; padding:0 0 6px;
}
.section-block:last-of-type{ border-bottom:none; }

.section-title{
  font-family:'Fraunces', serif; font-weight:600; font-size:19px; color:var(--brown-dark);
  margin:0; padding:18px 2px 10px;
}

.section-note{
  font-style:italic; color:var(--brown); font-size:14px; line-height:1.7;
  margin:0 0 14px; padding:0 2px;
}

/* ---------- Blocos de destaque (Ficha tecnica / Adicionais) ---------- */

.info-highlight{
  background:var(--cream-peach); border-radius:14px;
  padding:2px 16px 16px; margin:14px 0 20px;
}
.info-highlight .section-title{ padding-left:2px; padding-right:2px; }
.tag-group{ display:flex; flex-wrap:wrap; gap:8px; padding:2px 0; }
.tag-chip{
  display:inline-flex; align-items:center; gap:6px;
  background:#fff; color:var(--brown-dark); border:1px solid rgba(204,107,78,.35);
  border-radius:999px; padding:8px 14px; font-size:13px; font-weight:600; line-height:1.3;
}
.tag-chip strong{ color:var(--terracotta); font-weight:700; }

ul.items{ list-style:none; margin:0 0 16px; padding:0; }
.item{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 10px;
  padding:10px 2px; border-bottom:1px dashed rgba(59,42,31,.1);
}
.item:last-child{ border-bottom:none; }
.item .name{ font-weight:600; font-size:15.5px; color:var(--brown-dark); flex:1 1 auto; min-width:0; }
.item .badge{
  background:var(--amber); color:#fff; font-size:11px; font-weight:700;
  padding:2px 8px; border-radius:999px; margin-left:6px;
}
.item .sub{ display:block; font-style:italic; font-weight:400; font-size:12.5px; color:var(--brown); margin-top:2px; }
.item .price{
  font-weight:700; font-size:15.5px; color:var(--terracotta); white-space:nowrap; margin-left:auto;
}

.item.featured{
  background:var(--brown-dark); color:var(--ivory);
  border-radius:14px; padding:14px 16px; margin-bottom:8px; border-bottom:none;
}
.item.featured .name{ color:#fff; }
.item.featured .price{ color:var(--amber); }

.flat-rate{
  display:flex; justify-content:space-between; align-items:baseline; gap:10px;
  background:var(--cream-peach); border-radius:14px; padding:14px 18px; margin:6px 0 12px;
}
.flat-rate .name{ font-family:'Fraunces', serif; font-weight:600; font-size:16px; }
.flat-rate .price{ font-weight:700; color:var(--terracotta); font-size:16px; white-space:nowrap; }

/* ---------- Botao flutuante do WhatsApp ---------- */

.whatsapp-float{
  position:fixed; right:16px; bottom:16px; z-index:30;
  display:flex; align-items:center; gap:10px;
  background:var(--whatsapp); color:#fff; text-decoration:none;
  padding:14px 18px; border-radius:999px; font-weight:700; font-size:14.5px;
  box-shadow:0 10px 24px rgba(0,0,0,.25);
}
.whatsapp-float svg{ width:20px; height:20px; flex:none; }

/* ---------- Rodape ---------- */

footer.site-footer{
  background:var(--brown-dark); color:var(--cream-peach);
  text-align:center; padding:18px 20px 20px; font-size:12px; line-height:1.55; margin-top:12px;
}
footer.site-footer .brand{
  color:#fff; font-family:'Fraunces', serif; font-weight:600; font-size:14px; display:block; margin-bottom:4px;
}

/* ---------- Telas maiores ---------- */

@media (min-width: 768px){
  .site-header, .tabs, .pedido-minimo-wrap, .category-panel{
    max-width:var(--maxw); margin-left:auto; margin-right:auto;
  }
  .site-title strong{ font-size:26px; }
  ul.items{ display:grid; grid-template-columns:1fr 1fr; gap:0 32px; }
  .item{ border-bottom:1px dashed rgba(59,42,31,.1); }

  .home-hero .site-logo-lg{ width:310px; }
  .home-nav{ flex-direction:row; max-width:var(--maxw); flex-wrap:wrap; }
  .home-nav a{ flex:1 1 auto; }
  .home-carousel-item{ flex-basis:340px; }
  .home-carousel-wrap h2, .home-carousel{ max-width:var(--maxw); margin-left:auto; margin-right:auto; }
  .home-carousel-wrap h2{ padding:0; }
  .home-carousel{ padding:0 0 6px; }
  .revenda-block{ max-width:var(--maxw); margin-left:auto; margin-right:auto; }
}

@media (min-width: 1024px){
  :root{ --maxw:880px; }
}