:root {
  --leaf: #1f4d3a;
  --leaf-dark: #122c22;
  --leaf-light: #3d7a5c;
  --cream: #f4f1ea;
  --sand: #ebe6dc;
  --earth: #1f4d3a;
  --gold: #b0893e;
  --clay: #1f4d3a;
  --ink: #1c1915;
  --muted: #6b645a;
  --white: #fffcf7;
  --line: #e4ddd2;
  --brand: #1f4d3a;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: "Outfit", Nunito, system-ui, sans-serif;
  padding-bottom: 4.75rem;
}
body.has-bag { padding-bottom: 9.2rem; }
@media (min-width: 768px) { body { padding-bottom: 0; } }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; font-size: 16px; }
button { cursor: pointer; border: none; background: none; }
::selection { background: var(--leaf); color: #fff; }
h1, h2, h3, .sec-title, .brand-name {
  font-family: Fraunces, Georgia, serif;
  font-weight: 650;
}

.wrap { max-width: 42rem; margin: 0 auto; padding: 0 1rem 2rem; }
@media (min-width: 768px) { .wrap { max-width: 56rem; padding-bottom: 3rem; } }

.card-shadow { box-shadow: 0 10px 30px rgb(18 44 34 / .06); }
.rounded-full { border-radius: 999px; }
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px; padding: .9rem 1.35rem; font-weight: 700;
  letter-spacing: .02em;
}
.btn-leaf { background: var(--leaf); color: #fff; }
.btn-white { background: #fff; color: var(--leaf); border: 1px solid var(--line); }
.btn-sm { padding: .65rem 1rem; font-size: .875rem; }
.chip { border-radius: 999px; background: #e7f0ea; color: var(--leaf); padding: .2rem .65rem; font-size: .7rem; font-weight: 800; text-transform: uppercase; }

header.site { position: sticky; top: 0; z-index: 40; background: var(--leaf-dark); color: #f6f1e6; }
header.site.scrolled { box-shadow: 0 8px 24px rgb(18 44 34 / .28); }
.topbar { display: none; }
.ifood-top, .top-bar, .brand-bar {
  max-width: 56rem; margin: 0 auto;
  display: flex; align-items: center; gap: .65rem;
  padding: .85rem 1rem .55rem;
}
.brand-lockup {
  display: flex; align-items: center; gap: .6rem; flex: 1; min-width: 0; color: #f6f1e6;
}
.brand-lockup img {
  width: 2.4rem; height: 2.4rem; border-radius: .7rem; object-fit: cover;
  background: #fff; clip-path: inset(4% round 18%);
}
.brand-lockup strong { display: block; font-size: 1.05rem; line-height: 1.1; }
.brand-lockup small { display: block; font-size: .68rem; opacity: .72; font-family: Outfit, sans-serif; }
.brand-mini img {
  width: 2.35rem; height: 2.35rem; border-radius: .7rem; object-fit: cover;
  background: var(--brand); clip-path: inset(5% round 20%);
}
.addr { display: none; }
.nav { display: none; }
.brand { display: flex; align-items: center; gap: .5rem; }
.brand img {
  width: 2.2rem; height: 2.2rem; border-radius: .55rem;
  object-fit: cover; background: var(--brand);
  clip-path: inset(5.5% round 20%);
}
.brand strong { display: block; font-size: .85rem; line-height: 1.1; }
.brand small { font-size: .7rem; color: var(--muted); }
.icon-btn {
  width: 2.45rem; height: 2.45rem; border-radius: 999px; background: rgb(255 255 255 / .12);
  display: flex; align-items: center; justify-content: center; position: relative; color: #f6f1e6;
}
.badge {
  position: absolute; top: -.15rem; right: -.15rem;
  min-width: 1.1rem; height: 1.1rem; border-radius: 999px;
  background: var(--gold); color: #1c1915; font-size: .65rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center; padding: 0 .25rem;
}
.menu-overlay, .menu-toggle, .nav-links { display: none !important; }
.header-search { max-width: 56rem; margin: 0 auto; padding: 0 1rem .9rem; }
.search-pill {
  display: flex; align-items: center; gap: .6rem;
  background: rgb(255 255 255 / .12); border-radius: 999px; padding: .7rem 1rem; color: rgb(246 241 230 / .75);
}
body:not([data-page="inicio"]) .search-pill {
  background: var(--sand); color: var(--muted);
}
.search-pill input {
  flex: 1; border: 0; background: transparent; outline: none; min-width: 0; color: inherit;
}
body[data-page="cardapio"] header.site,
body[data-page="item"] header.site,
body[data-page="sacola"] header.site,
body[data-page="pedidos"] header.site { background: var(--leaf-dark); }
body[data-page="cardapio"] .header-search,
body[data-page="item"] .header-search,
body[data-page="sacola"] .header-search,
body[data-page="pedidos"] .header-search { display: none; }
body[data-page="cardapio"] .cat-chips { top: 4.1rem; }
body[data-page="item"] .cartbar { display: none !important; }

.store-hero { margin: 0 -1rem 1rem; }
.store-cover { height: 11rem; overflow: hidden; background: var(--leaf-dark); }
.store-cover img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; filter: saturate(1.05); }
.store-info {
  background: var(--white); margin: -1.6rem 0 0; position: relative;
  border-radius: 1.25rem 1.25rem 0 0; padding: 1.15rem 0 .25rem;
}
.store-info img.logo { display: none; }
.store-info h1 { margin: 0; font-size: 1.55rem; }
.store-meta { display: flex; flex-wrap: wrap; gap: .35rem .75rem; margin-top: .35rem; font-size: .78rem; color: var(--muted); }
.store-meta b { color: var(--ink); }
.store-meta .star { color: var(--gold); }

.sec-title { font-size: 1.35rem; margin: 1.4rem 0 .85rem; }

.banners { display: none; }
.banner { display: none; }

.cat-circles { display: flex; gap: .45rem; overflow-x: auto; padding: .15rem 0 .7rem; }
.cat-circle {
  flex: 0 0 auto; width: auto; text-align: center;
  background: var(--white); border-radius: 999px; padding: .45rem .85rem .45rem .45rem;
  display: flex; align-items: center; gap: .5rem; border: 1px solid var(--line);
}
.cat-circle img {
  width: 2rem; height: 2rem; border-radius: 999px; object-fit: cover; object-position: center 32%;
  background: var(--sand); border: 0;
}
.cat-circle p { margin: 0; font-size: .78rem; font-weight: 700; line-height: 1.2; font-family: Outfit, sans-serif; }

.store-card { display: none; }

.dish-list {
  display: grid; grid-template-columns: 1fr 1fr; gap: .7rem;
  background: transparent; border-radius: 0; overflow: visible; align-items: stretch;
}
@media (min-width: 768px) {
  .dish-list { grid-template-columns: repeat(3, 1fr); gap: .9rem; }
}
.menu-sec { margin: 1.25rem 0; }
.menu-sec h2 { font-size: 1.35rem; margin: 0 0 .75rem; padding: 0; }
.dish {
  position: relative;
  display: flex; flex-direction: column; gap: 0; padding: 0; border: 0;
  background: var(--white); align-items: stretch; border-radius: 1rem; overflow: hidden;
  box-shadow: 0 8px 22px rgb(18 44 34 / .06); height: 100%; min-width: 0;
}
.dish:last-child { border-bottom: 0; }
.dish-media {
  position: relative; z-index: 2; width: 100%; aspect-ratio: 1 / 1;
  flex-shrink: 0; background: var(--sand);
}
.dish-media a { display: block; width: 100%; height: 100%; }
.dish-media img {
  width: 100%; height: 100%; object-fit: cover; object-position: center;
  border-radius: 0; background: var(--sand);
}
.dish-media .add {
  position: absolute; right: .4rem; bottom: .4rem; z-index: 3;
  width: 2.1rem; height: 2.1rem; border-radius: 999px;
  background: var(--leaf); color: #fff; font-size: 1.25rem; font-weight: 700; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 14px rgb(18 44 34 / .28);
}
.dish-info {
  flex: 1; min-width: 0; display: flex; flex-direction: column;
  padding: .55rem .65rem .7rem;
}
.dish-info h3 {
  margin: 0; font-size: .82rem; font-weight: 650; line-height: 1.3;
  font-family: Outfit, sans-serif;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; min-height: 2.15em;
}
.dish .desc { display: none; }
.dish .kcal { display: none; }
.dish .price {
  font-weight: 800; margin: auto 0 0; padding-top: .4rem;
  font-size: .88rem; font-family: Outfit, sans-serif; color: var(--leaf);
}
.old { font-size: .72rem; color: var(--muted); text-decoration: line-through; margin-right: .3rem; font-weight: 600; }
.tag {
  position: absolute; left: .4rem; top: .4rem; z-index: 3;
  background: var(--gold); color: #1c1915; font-size: .62rem; font-weight: 800;
  text-transform: uppercase; padding: .18rem .45rem; border-radius: 999px;
}
.product-card { display: none; }

.cat-chips {
  display: flex; gap: .4rem; overflow-x: auto; padding: .75rem 0;
  background: var(--cream); position: sticky; top: 4.1rem; z-index: 20;
  margin: 0 -1rem; padding-left: 1rem; padding-right: 1rem;
  border-bottom: 0;
}
.filter {
  white-space: nowrap; border-radius: 999px; padding: .45rem .9rem;
  background: var(--white); font-size: .82rem; font-weight: 700; color: var(--ink);
  border: 1px solid var(--line);
}
.filter.on { background: var(--leaf); color: #fff; border-color: var(--leaf); }

.reviews { display: flex; gap: .75rem; overflow-x: auto; padding-bottom: .35rem; }
.review { min-width: 15rem; background: var(--white); border-radius: 1.1rem; padding: 1rem; }
.stars { color: var(--gold); letter-spacing: .05em; }
.review q { display: block; margin: .5rem 0; font-size: .85rem; color: var(--muted); }
.review b { font-size: .8rem; }

.info-box { display: grid; gap: 1rem; background: var(--white); border-radius: 1.2rem; padding: 1.1rem; margin-top: 1.25rem; }
@media (min-width: 768px) { .info-box { grid-template-columns: 1fr 1fr; } }
.note { background: #e7f0ea; color: var(--leaf-dark); border-radius: .8rem; padding: .55rem .75rem; font-size: .82rem; }
.zone { display: flex; justify-content: space-between; background: var(--sand); border-radius: .7rem; padding: .5rem .75rem; font-size: .85rem; margin: .35rem 0; }

.cover-home {
  margin: 0 -1rem 1.1rem; position: relative; height: 15.5rem; overflow: hidden;
  background: var(--leaf-dark); color: #fff;
}
.cover-home img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; }
.cover-home .pad {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgb(18 44 34 / .15), rgb(18 44 34 / .72));
  display: flex; flex-direction: column; justify-content: flex-end; padding: 1.2rem 1rem 1.3rem;
}
.cover-home h1 { margin: 0 0 .35rem; font-size: 1.7rem; line-height: 1.15; }
.cover-home p { margin: 0 0 .9rem; opacity: .92; max-width: 18rem; }
.deliver-line {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  background: var(--white); border-radius: 999px; padding: .55rem .6rem .55rem 1rem;
  margin: -.55rem 0 1rem; position: relative; z-index: 2;
  box-shadow: 0 8px 20px rgb(18 44 34 / .08); font-size: .82rem;
}
.deliver-line b { display: block; font-size: .78rem; }
.deliver-line span { color: var(--muted); font-size: .72rem; }

footer.site { display: none; }
@media (min-width: 768px) {
  footer.site { display: block; margin-top: 2.5rem; border-top: 1px solid var(--line); background: var(--white); }
}
.footer-grid { max-width: 56rem; margin: 0 auto; padding: 2rem 1rem; display: grid; gap: 1.5rem; }
@media (min-width: 768px) { .footer-grid { grid-template-columns: 1fr 1fr 1fr; } }
.muted { color: var(--muted); font-size: .875rem; }
.copy { border-top: 1px solid var(--line); padding: 1rem; text-align: center; font-size: .75rem; color: var(--muted); }

.tabbar {
  position: fixed; left: .7rem; right: .7rem; bottom: .7rem; z-index: 45;
  height: 3.7rem; background: var(--leaf-dark); color: #c9d6cf;
  display: grid; grid-template-columns: repeat(4, 1fr);
  padding-bottom: 0; border: 0; border-radius: 1.25rem;
  box-shadow: 0 12px 30px rgb(18 44 34 / .35);
}
.tabbar a {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .15rem;
  font-size: .62rem; font-weight: 700; color: #9db0a6;
}
.tabbar a.on { color: #fff; }
.tabbar svg { width: 20px; height: 20px; }
@media (min-width: 768px) { .tabbar { display: none; } }

.wa { display: none; }
.cartbar {
  position: fixed; left: .9rem; right: .9rem; bottom: 5.1rem; z-index: 44;
  background: var(--leaf); color: #fff; border-radius: 999px;
  padding: .8rem 1.1rem; display: none; align-items: center; justify-content: space-between;
  font-weight: 800; box-shadow: 0 10px 24px rgb(18 44 34 / .28);
}
.cartbar.show { display: flex; }
.cartbar .bag { display: flex; align-items: center; gap: .5rem; }
.cartbar .count {
  background: var(--gold); color: #1c1915; min-width: 1.4rem; height: 1.4rem; border-radius: 999px;
  display: grid; place-items: center; font-size: .75rem;
}
@media (min-width: 768px) {
  .cartbar { left: auto; right: 1.5rem; bottom: 1.5rem; width: 22rem; }
}

.dish-list:has(.cart-item),
.bag-list {
  display: block;
  background: var(--white);
  border-radius: 1.1rem;
  overflow: hidden;
  box-shadow: 0 8px 22px rgb(18 44 34 / .06);
}
.field { width: 100%; border-radius: .85rem; background: var(--sand); border: 0; padding: .85rem 1rem; outline: none; }
.card { background: #fff; border-radius: .75rem; padding: 1.1rem; }
.grid-2 { display: grid; gap: .75rem; }
@media (min-width: 640px) { .grid-2 { grid-template-columns: 1fr 1fr; } }
.checkout { display: grid; gap: 1.25rem; padding-top: .5rem; }
@media (min-width: 768px) { .checkout { grid-template-columns: 1.2fr .8fr; } }
.seg { display: flex; gap: .5rem; flex-wrap: wrap; }
.seg button, .pay button { flex: 1; border-radius: .5rem; padding: .75rem; background: var(--sand); font-size: .85rem; font-weight: 700; }
.seg button.on, .pay button.on { background: var(--leaf); color: #fff; }
.pay { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.sticky { position: sticky; top: 6rem; height: fit-content; }
.line { display: flex; justify-content: space-between; gap: .5rem; font-size: .875rem; margin: .35rem 0; }
.err { color: #dc2626; font-size: .875rem; }

.item-sheet { background: #fff; margin: 0 -1rem; }
.item-cover { position: relative; height: 16rem; background: var(--sand); }
.item-cover img { width: 100%; height: 100%; object-fit: cover; object-position: center 32%; }
.back-fab {
  position: absolute; left: .75rem; top: .75rem;
  width: 2.25rem; height: 2.25rem; border-radius: 999px; background: #fff;
  display: grid; place-items: center; font-size: 1.1rem; box-shadow: 0 2px 8px rgb(0 0 0 / .12);
}
.item-body { padding: 1.1rem 1rem 7rem; }
.item-body h1 { margin: .2rem 0 .5rem; font-size: 1.35rem; }
.item-cta {
  position: fixed; left: .7rem; right: .7rem; bottom: 5.1rem; z-index: 30;
  background: #fff; border: 1px solid var(--line); border-radius: 1.15rem;
  display: flex; gap: .75rem; align-items: center; padding: .7rem .85rem;
  box-shadow: 0 10px 24px rgb(18 44 34 / .12);
}
@media (min-width: 768px) {
  .item-cta { position: static; border: 0; padding: 1rem 0 0; }
  .item-body { padding-bottom: 1.5rem; }
  .item-sheet { margin: 0; border-radius: .75rem; overflow: hidden; }
}
.item-cta .btn { flex: 1; }
.qty { display: flex; align-items: center; gap: .35rem; background: var(--sand); border-radius: .5rem; padding: .2rem; }
.qty button { width: 2rem; height: 2rem; border-radius: .4rem; background: #fff; font-weight: 800; }

.cart-item { display: flex; gap: .75rem; background: #fff; padding: 1rem; border-bottom: 1px solid var(--line); }
.cart-item img { width: 4.25rem; height: 4.25rem; border-radius: .5rem; object-fit: cover; object-position: center 32%; flex-shrink: 0; }
.empty-bag { text-align: center; padding: 4rem 1rem; background: #fff; border-radius: .75rem; margin-top: 1rem; }
.empty-bag p { margin: 0 0 1rem; }

.section { margin: 1.25rem 0; }
.kicker { font-size: .7rem; font-weight: 800; color: var(--leaf); margin: 0; }
.grid-cards { background: transparent; border-radius: 0; overflow: visible; }
.grid-cards .dish { display: flex; flex-direction: column; }

.search { width: 100%; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.animate-fade { animation: fadeUp .45s ease both; }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { scrollbar-width: none; }

@media print {
  .no-print, .tabbar, .cartbar, .item-cta, .wa-float { display: none !important; }
  body { background: #fff !important; padding: 0; }
}

.btn-clay { background: var(--leaf); color: #fff; border-radius: .5rem; padding: .85rem 1.4rem; font-weight: 800; }
.hero-home { display: none; }
.fav-mini { display: none; }
.wa-float { display: none !important; }
.track li.now { color: var(--leaf); font-weight: 800; }
.cat-circle small { display: block; font-size: .62rem; color: var(--muted); font-weight: 700; }
.fav-mini, .fav-fab {
  position: absolute; left: .3rem; bottom: .3rem;
  width: 1.85rem; height: 1.85rem; border-radius: 999px;
  background: #fff; color: var(--clay); font-size: .95rem;
  box-shadow: 0 2px 8px rgb(0 0 0 / .12); z-index: 2;
}
.fav-mini.on, .fav-fab.on { color: #fff; background: var(--clay); }
.addon-list { display: grid; gap: .45rem; margin-top: .6rem; }
.addon {
  display: flex; gap: .6rem; align-items: center;
  background: var(--cream); border-radius: .85rem; padding: .75rem .9rem;
}
.addon b { margin-left: auto; color: var(--leaf); }
.toast-pop {
  position: fixed; left: 50%; bottom: 5.4rem; transform: translateX(-50%) translateY(12px);
  background: var(--leaf-dark); color: #fff; padding: .7rem 1rem; border-radius: 999px;
  font-size: .85rem; font-weight: 700; opacity: 0; pointer-events: none; z-index: 80;
  transition: .25s ease;
}
.toast-pop.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.steps { display: flex; gap: .4rem; overflow-x: auto; }
.steps button { flex: 1; min-width: 7rem; border-radius: 999px; padding: .55rem .7rem; background: var(--sand); font-size: .78rem; font-weight: 800; }
.steps button.on { background: var(--leaf); color: #fff; }
.addr-picks { display: grid; gap: .5rem; margin-top: 1rem; }
.addr-pick { text-align: left; background: var(--cream); border-radius: .9rem; padding: .8rem 1rem; border: 2px solid transparent; }
.addr-pick.on { border-color: var(--leaf); }
.addr-pick span { display: block; color: var(--muted); font-size: .8rem; }
.pix-box { background: #eef8f1; border-radius: .9rem; padding: .9rem 1rem; margin-top: .9rem; }
.confirm-box { text-align: center; max-width: 28rem; margin: 1.5rem auto; }
.order-n { font-size: 2rem; font-weight: 800; color: var(--leaf); margin: .4rem 0; }
.track { list-style: none; padding: 0; margin: 1.25rem 0; }
.track li { display: flex; gap: .7rem; align-items: center; padding: .4rem 0; color: var(--muted); }
.track li span { width: 1.4rem; text-align: center; }
.track li.done { color: var(--leaf); font-weight: 700; }
.track li.now { color: var(--clay); font-weight: 800; }
.auth-card { background: #fff; border-radius: 1.1rem; padding: 1.4rem; max-width: 26rem; margin: 1.5rem auto; box-shadow: 0 10px 30px rgb(58 42 28 / .08); }
.auth-card .field { margin-top: .65rem; }
.points-pill { background: #fff3e6; color: var(--earth); border-radius: 999px; padding: .55rem 1rem; font-size: .88rem; display: inline-block; }
.coupon-row { display: flex; justify-content: space-between; padding: .7rem 0; border-bottom: 1px solid var(--line); }
.form-group { margin: .65rem 0; }
.form-group label { display: block; font-size: .78rem; font-weight: 700; margin-bottom: .3rem; }
.check { display: flex; gap: .5rem; align-items: center; font-size: .9rem; }
.wa-float {
  position: fixed; right: .9rem; bottom: 8.4rem; z-index: 46;
  width: 3.3rem; height: 3.3rem; border-radius: 999px;
  background: #25d366; color: #fff; display: grid; place-items: center;
  box-shadow: 0 8px 20px rgb(37 211 102 / .4);
}
@media (min-width: 768px) { .wa-float { bottom: 1.5rem; } }
.skeleton { background: linear-gradient(90deg, #eee, #f7f7f7, #eee); background-size: 200% 100%; animation: sk 1.2s infinite; border-radius: .75rem; height: 5rem; }
@keyframes sk { to { background-position: -200% 0; } }
.review-box { margin-top: 1rem; background: var(--cream); border-radius: .9rem; padding: .9rem; }
.stars-pick button { font-size: 1.4rem; color: var(--gold); }