/* ── RESET ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--surface-raised);color:#1a1a2e;min-height:100vh}
a{text-decoration:none;color:inherit}
button{font-family:inherit}
img{display:block}

/* ── VARIÁVEIS ── */
:root{
  --red:#EA6A0C;
  --red2:#D35F08;
  --dark:#1a1a2e;
  --surface:#fff;
  --bg:var(--surface-raised);
  --muted:#888;
  --border:#e8e8ec;
  --radius:12px;
  --shadow:0 2px 16px rgba(0,0,0,.07);
  --shadow-hover:0 6px 28px rgba(0,0,0,.13);
  --success:#16a34a;
}

/* ── TOPBAR (overlay sobre o banner) ── */
.topbar{position:absolute;top:0;left:0;right:0;z-index:10;background:transparent}
.topbar-inner{padding:10px 12px;display:flex;align-items:center;justify-content:space-between}
.topbar-logo,.topbar-logo-ph,.topbar-nome{display:none}
.topbar-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.topbar-icon-btn{width:36px;height:36px;border-radius:50%;background:rgba(0,0,0,.35);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem;transition:background .18s}
.topbar-icon-btn:hover{background:rgba(0,0,0,.55)}

/* ── FILTER BAR ── */
.filter-bar{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}
.filter-inner{max-width:1200px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:12px}
.cat-select-wrap{flex:0 0 240px;position:relative}
.cat-select-wrap select{width:100%;appearance:none;-webkit-appearance:none;border:1.5px solid var(--border);border-radius:10px;padding:10px 36px 10px 14px;font-size:.87rem;font-family:inherit;color:var(--dark);background:#fafafa;cursor:pointer;outline:none;transition:border .15s}
.cat-select-wrap select:focus{border-color:var(--red);background:#fff}
.cat-select-wrap::after{content:'\f107';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;right:13px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none;font-size:.8rem}
.search-wrap{flex:1;display:flex;align-items:center;background:#fafafa;border:1.5px solid var(--border);border-radius:10px;padding:0 14px;gap:8px;transition:border .15s,box-shadow .15s}
.search-wrap:focus-within{border-color:var(--red);background:#fff;box-shadow:0 0 0 3px rgba(234,106,12,.12)}
.search-wrap i{color:var(--muted);font-size:.85rem;flex-shrink:0}
.search-wrap input{flex:1;border:none;background:none;padding:10px 0;font-size:.87rem;outline:none;color:var(--dark)}
.search-wrap input::placeholder{color:#bbb}
@media(max-width:540px){
  .filter-inner{flex-direction:column;gap:8px}
  .cat-select-wrap{flex:none;width:100%}
}

/* ── LAYOUT ── */
.main-layout{max-width:1200px;margin:0 auto;padding:20px 20px 100px;display:grid;grid-template-columns:1fr 300px;gap:24px;align-items:start}
@media(max-width:860px){.main-layout{grid-template-columns:1fr;padding:16px 14px 100px}}

/* ── SEÇÃO CATEGORIA ── */
.cat-section{margin-bottom:28px;content-visibility:auto;contain-intrinsic-size:auto 300px}
.section-title{font-size:1rem;font-weight:800;color:var(--dark);letter-spacing:-.3px;margin-bottom:12px;display:flex;align-items:center;gap:10px}
.section-title::after{content:'';flex:1;height:1px;background:var(--border)}

/* ── GRID DE PRODUTOS ── */
.produtos-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:680px){.produtos-grid{grid-template-columns:1fr}}

/* ── CARD PRODUTO (horizontal) ── */
.produto-card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);display:flex;flex-direction:row;overflow:hidden;cursor:pointer;transition:box-shadow .18s,transform .18s;align-items:stretch}
.produto-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}
/* corpo esquerdo */
.card-body{flex:1;padding:12px 10px 10px;display:flex;flex-direction:column;gap:3px;min-width:0}
.card-nome{font-size:.86rem;font-weight:700;color:var(--dark);line-height:1.35}
.card-desc{font-size:.76rem;color:var(--muted);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:1;margin-bottom:6px}
.card-preco{font-size:.9rem;font-weight:800;color:var(--red)}
.btn-card-add{align-self:flex-start;background:#fff;color:var(--red);border:1.5px solid var(--red);border-radius:8px;padding:4px 10px;font-size:.75rem;font-weight:700;cursor:pointer;transition:background .18s,color .18s;white-space:nowrap;margin-top:auto}
.btn-card-add:hover{background:var(--red);color:#fff}
/* imagem direita */
.card-img-wrap{width:96px;min-width:96px;flex-shrink:0;position:relative;overflow:hidden;background:#f0f0f4;align-self:stretch}
.card-img-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.produto-card:hover .card-img-wrap img{transform:scale(1.06)}
.card-img-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:1.8rem;color:#c8c8d0}
.badge-dest{position:absolute;bottom:6px;left:6px;background:var(--red);color:#fff;font-size:.63rem;font-weight:700;padding:2px 7px;border-radius:20px;letter-spacing:.2px}

/* ── CARRINHO ── */
.cart-box{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);position:sticky;top:16px;overflow:hidden}
@media(max-width:860px){.cart-box{display:none}}
.cart-head{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.cart-head h3{font-size:.95rem;font-weight:800;color:var(--dark);display:flex;align-items:center;gap:7px}
.cart-count-badge{background:var(--red);color:#fff;font-size:.68rem;font-weight:700;min-width:20px;height:20px;padding:0 5px;border-radius:10px;display:flex;align-items:center;justify-content:center}
.cart-empty{padding:28px 18px;text-align:center;color:#c0c0cc;font-size:.85rem}
.cart-empty-icon{font-size:2rem;margin-bottom:8px}
.cart-empty p{line-height:1.5}
.cart-items{max-height:300px;overflow-y:auto;padding:6px 0}
.ci{display:flex;align-items:center;gap:10px;padding:8px 16px}
.ci:not(:last-child){border-bottom:1px solid var(--border)}
.ci-info{flex:1;min-width:0}
.ci-nome{font-size:.8rem;font-weight:700;color:var(--dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ci-obs{font-size:.71rem;color:var(--muted);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ci-ctrl{display:flex;align-items:center;gap:4px}
.ci-ctrl button{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--border);background:#fff;cursor:pointer;font-size:.85rem;font-weight:700;color:var(--dark);display:flex;align-items:center;justify-content:center;transition:all .15s;flex-shrink:0}
.ci-ctrl button:hover{border-color:var(--red);color:var(--red)}
.ci-ctrl span{font-size:.82rem;font-weight:700;min-width:16px;text-align:center}
.ci-val{font-size:.8rem;font-weight:700;color:var(--dark);text-align:right;white-space:nowrap;flex-shrink:0}
.cart-bottom{padding:14px 18px;border-top:1px solid var(--border)}
.subtotal-row{display:flex;justify-content:space-between;font-size:.82rem;color:var(--muted);margin-bottom:6px}
.total-row{display:flex;justify-content:space-between;font-size:.95rem;font-weight:800;color:var(--dark);margin-bottom:14px}
.btn-checkout{width:100%;background:var(--red);color:#fff;border:none;border-radius:10px;padding:13px;font-size:.9rem;font-weight:800;cursor:pointer;transition:background .18s,transform .1s;letter-spacing:.1px}
.btn-checkout:hover:not(:disabled){background:var(--red2);transform:scale(.99)}
.btn-checkout:disabled{background:#ddd;color:#aaa;cursor:not-allowed}

/* ── FAB MOBILE ── */
.cart-fab{display:none;position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:var(--dark);color:#fff;border:none;border-radius:50px;padding:13px 22px;font-size:.88rem;font-weight:700;cursor:pointer;box-shadow:0 6px 24px rgba(0,0,0,.3);z-index:200;align-items:center;gap:12px;min-width:220px;justify-content:space-between;transition:transform .2s,box-shadow .2s}
.cart-fab:hover{box-shadow:0 8px 32px rgba(0,0,0,.4)}
@media(max-width:860px){.cart-fab.has-items{display:flex}}
.fab-left{display:flex;align-items:center;gap:8px}
.fab-qty{background:var(--red);border-radius:12px;padding:2px 8px;font-size:.75rem}

/* ── MODAL PRODUTO ── */
.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:300;align-items:flex-end;justify-content:center;backdrop-filter:blur(3px)}
.overlay.open{display:flex}
@media(min-width:600px){.overlay{align-items:center}}
.sheet{background:#fff;width:100%;max-width:500px;border-radius:20px 20px 0 0;max-height:92vh;overflow-y:auto;animation:slideUp .28s ease}
@media(min-width:600px){.sheet{border-radius:20px;animation:fadeUp .22s ease}}
@keyframes slideUp{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes fadeUp{from{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}
.sheet-img{width:100%;height:220px;object-fit:cover}
.sheet-body{padding:22px 22px 28px}
.sheet-nome{font-size:1.25rem;font-weight:800;color:var(--dark);margin-bottom:6px}
.sheet-desc{font-size:.88rem;color:var(--muted);line-height:1.55;margin-bottom:10px}
.sheet-preco{font-size:1.1rem;font-weight:800;color:var(--red);margin-bottom:18px}
.opts-section{margin-bottom:16px}
.opts-title{font-size:.78rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.opt-row{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:10px;border:1.5px solid var(--border);background:#fafafa;cursor:pointer;margin-bottom:6px;transition:border-color .15s,background .15s;gap:8px;user-select:none}
.opt-row:hover{border-color:var(--danger);background:var(--bg-danger)}
.opt-row.selected{border-color:var(--danger);background:var(--bg-danger)}
.opt-row input[type=radio],.opt-row input[type=checkbox]{width:17px;height:17px;accent-color:var(--danger);flex-shrink:0}
.opt-nome{flex:1;font-size:.9rem;font-weight:600;color:var(--dark)}
.opt-preco{font-size:.85rem;font-weight:700;color:var(--danger);white-space:nowrap}
.obs-lbl{font-size:.82rem;font-weight:700;color:var(--dark);margin-bottom:6px;display:block}
.obs-ta{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:10px 12px;font-size:.85rem;resize:none;font-family:inherit;outline:none;margin-bottom:18px;color:var(--dark)}
.obs-ta:focus{border-color:var(--red)}
.qty-row{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.qty-btn{width:38px;height:38px;border-radius:50%;border:2px solid var(--border);background:#fff;cursor:pointer;font-size:1.2rem;font-weight:800;display:flex;align-items:center;justify-content:center;transition:all .15s;line-height:1}
.qty-btn:hover:not(:disabled){border-color:var(--red);color:var(--red)}
.qty-btn:disabled{opacity:.35;cursor:not-allowed}
.qty-val{font-size:1.1rem;font-weight:800;min-width:28px;text-align:center}
.btn-add-final{width:100%;background:var(--red);color:#fff;border:none;border-radius:12px;padding:15px 18px;font-size:1rem;font-weight:800;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:background .18s}
.btn-add-final:hover{background:var(--red2)}
.btn-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.4);border:none;cursor:pointer;color:#fff;font-size:1.1rem;display:flex;align-items:center;justify-content:center;z-index:10;line-height:1}
.sheet-img-wrap{position:relative;display:none}
.sheet-img-wrap.has-img{display:block}

/* ── MODAL CARRINHO MOBILE ── */
.cart-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:300;align-items:flex-end;backdrop-filter:blur(3px)}
.cart-overlay.open{display:flex}
.cart-sheet{background:#fff;width:100%;border-radius:20px 20px 0 0;max-height:85vh;display:flex;flex-direction:column;animation:slideUp .28s ease}
.cart-sheet-head{padding:18px 20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}
.cart-sheet-head h3{font-size:1rem;font-weight:800;color:var(--dark)}
.btn-x{background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--muted);line-height:1;padding:2px}
.cart-sheet-body{flex:1;overflow-y:auto;padding:8px 0}
.cart-sheet-foot{padding:16px 20px;border-top:1px solid var(--border);flex-shrink:0}
.csheet-total{display:flex;justify-content:space-between;font-size:.95rem;font-weight:800;color:var(--dark);margin-bottom:12px}

/* ── MODAL FINALIZAR ── */
.final-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:400;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(3px)}
.final-overlay.open{display:flex}
.final-modal{background:#fff;border-radius:20px;width:100%;max-width:440px;max-height:90vh;overflow-y:auto;padding:26px;animation:fadeUp .22s ease}
.final-modal h3{font-size:1.1rem;font-weight:800;color:var(--dark);margin-bottom:20px}
.fg{margin-bottom:14px}
.fg label{font-size:.82rem;font-weight:700;color:var(--dark);display:block;margin-bottom:6px}
.fg input,.fg select,.fg textarea{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:11px 13px;font-size:.88rem;outline:none;font-family:inherit;color:var(--dark);transition:border .15s}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--red)}
.fg textarea{resize:none}
.resumo-box{background:var(--surface-raised);border-radius:10px;padding:12px 14px;margin-bottom:18px;font-size:.8rem;max-height:140px;overflow-y:auto;line-height:1.8;color:var(--dark)}
.resumo-box .r-item{border-bottom:1px solid var(--border);padding-bottom:4px;margin-bottom:4px}
.resumo-box .r-item:last-child{border:none;margin:0;padding:0}
.resumo-total{font-weight:800;font-size:.88rem;margin-top:6px;color:var(--dark)}
.btn-wa{width:100%;background:#25d366;color:#fff;border:none;border-radius:12px;padding:15px;font-size:.95rem;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .18s;margin-bottom:8px}
.btn-wa:hover{background:#1ebe5a}
.btn-delivery{width:100%;background:#e67e22;color:#fff;border:none;border-radius:12px;padding:15px;font-size:.95rem;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .18s;margin-bottom:8px}
.btn-delivery:hover{background:#d35400}
.btn-cancel2{width:100%;background:#f0f0f4;color:var(--muted);border:none;border-radius:12px;padding:12px;font-size:.88rem;font-weight:600;cursor:pointer;transition:background .15s}
.btn-cancel2:hover{background:#e5e5ea}

/* ── NENHUM RESULTADO ── */
.no-res{display:none;padding:60px 20px;text-align:center;color:#bbb;font-size:.95rem}
.no-res span{font-size:2.5rem;display:block;margin-bottom:12px}

/* ── DRAWER OVERLAY ── */
.drawer-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.52);z-index:500;opacity:0;transition:opacity .25s}
.drawer-overlay.open{display:block;opacity:1}

/* ── DRAWER LATERAL ── */
.drawer{position:fixed;top:0;left:-300px;width:280px;height:100%;background:#fff;z-index:501;transition:left .3s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;box-shadow:4px 0 24px rgba(0,0,0,.22)}
.drawer.open{left:0}
.drawer-header{background:#1a1a1a;padding:28px 20px 22px;display:flex;flex-direction:column;align-items:center;gap:10px;position:relative}
.drawer-logo{width:84px;height:84px;border-radius:50%;object-fit:cover;border:3px solid rgba(255,255,255,.3)}
.drawer-logo-ph{width:84px;height:84px;border-radius:50%;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;font-size:2.2rem;border:3px solid rgba(255,255,255,.3)}
.drawer-nome{color:#fff;font-weight:800;font-size:1rem;text-align:center;line-height:1.3;margin-top:2px}
.drawer-close{position:absolute;top:10px;right:10px;background:rgba(255,255,255,.15);border:none;color:#fff;border-radius:50%;width:32px;height:32px;cursor:pointer;font-size:1.1rem;display:flex;align-items:center;justify-content:center;transition:background .15s}
.drawer-close:hover{background:rgba(255,255,255,.28)}
.drawer-nav{flex:1;padding:6px 0}
.drawer-nav a,.drawer-nav button{display:flex;align-items:center;gap:14px;padding:15px 22px;font-size:.95rem;color:#2d2d2d;text-decoration:none;border:none;background:none;width:100%;cursor:pointer;font-family:inherit;transition:background .15s;text-align:left}
.drawer-nav a:hover,.drawer-nav button:hover{background:var(--surface-raised)}
.drawer-nav hr{border:none;border-top:1px solid #eee;margin:4px 20px}
.drawer-nav .nav-icon{width:26px;text-align:center;font-size:1.15rem;flex-shrink:0}
.drawer-footer{padding:14px 20px;border-top:1px solid #eee;text-align:center;font-size:.75rem;color:#bbb;line-height:1.6}
/* ── LGPD ── */
.lgpd{display:none;position:fixed;bottom:0;left:0;right:0;background:#1a1a2e;color:rgba(255,255,255,.85);padding:12px 20px;font-size:.8rem;z-index:900;justify-content:space-between;align-items:center;gap:14px}
.lgpd.show{display:flex}
.btn-lgpd{background:var(--red);color:#fff;border:none;border-radius:6px;padding:7px 16px;font-size:.8rem;cursor:pointer;white-space:nowrap}
/* ── TOAST ── */
.toast{position:fixed;bottom:80px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--dark);color:#fff;padding:10px 22px;border-radius:10px;font-size:.85rem;font-weight:600;z-index:999;opacity:0;transition:opacity .25s,transform .25s;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
/* ── HERO FULL (banner + card) ── */
.hero-full{position:relative;overflow:hidden;background:var(--dark)}
.hero-full.has-banner{background-size:cover;background-repeat:no-repeat}
.hero-full.has-banner::before{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.05) 0%,rgba(0,0,0,.35) 100%);z-index:2;pointer-events:none}
/* ── HERO BANNER AREA ── */
.hero-wrap{position:relative;width:100%;height:260px;z-index:3;flex-shrink:0;display:block}
/* fallback quando não tem banner */
.hero-full:not(.has-banner){background:linear-gradient(135deg,var(--surface-raised) 0%,var(--surface-raised) 100%)}
/* Topbar fica dentro do hero-wrap */
.hero-wrap .topbar{position:absolute;top:0;left:0;right:0;z-index:10}
/* Logo dentro do banner na parte inferior */
.hero-logo-wrap{position:absolute;top:216px;left:50%;transform:translateX(-50%);z-index:15;display:flex;justify-content:center}
.hero-logo{width:88px;height:88px;border-radius:50%;object-fit:cover;border:4px solid #fff;box-shadow:0 2px 12px rgba(0,0,0,.2);background:#f0f0f4;display:block}
.hero-logo-ph{width:88px;height:88px;border-radius:50%;background:#f0f0f4;border:4px solid #fff;display:flex;align-items:center;justify-content:center;font-size:2.4rem;box-shadow:0 2px 12px rgba(0,0,0,.12)}
/* Seção info abaixo do banner */
.hero-section-wrap{position:relative;z-index:3;padding:0 40px;padding-bottom:24px}
.hero-card{max-width:640px;margin:-16px auto 0;background:rgba(255,255,255,.97);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:62px 48px 24px;text-align:center;border-radius:20px;box-shadow:0 8px 40px rgba(0,0,0,.2);position:relative;z-index:10}
.hero-nome{font-size:1rem;font-weight:800;color:var(--dark);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px}
.hero-info{display:flex;align-items:stretch;justify-content:center;gap:0;border-top:1px solid var(--border);padding-top:12px}
.hero-info-item{flex:1;max-width:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0 16px;font-size:.8rem;color:var(--muted)}
.hero-info-item:not(:last-child){border-right:1px solid var(--border)}
.hero-info-val{font-size:.88rem;font-weight:700;color:var(--dark)}
.hero-info-lbl{font-size:.72rem;color:var(--muted)}
.hero-status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:middle}
.hero-status-dot.aberto{background:var(--success)}
.hero-status-dot.fechado{background:var(--danger)}
@media(max-width:600px){.hero-wrap{height:180px}.hero-logo-wrap{top:144px}.hero-section-wrap{padding:0 16px;padding-bottom:18px}.hero-card{max-width:100%;margin:-16px auto 0;padding:50px 20px 16px;border-radius:16px}.hero-logo{width:72px;height:72px}.hero-logo-ph{width:72px;height:72px;font-size:2rem}.hero-nome{font-size:.88rem}.hero-info-item{padding:0 8px}}
/* ── DELIVERY BANNER ── */
.delivery-banner{display:none}
/* ── ESGOTADO ── */
.produto-card.esgotado{opacity:.55;pointer-events:none;filter:grayscale(.4)}
.badge-esgotado{display:inline-block;background:#888;color:#fff;font-size:.7rem;font-weight:700;padding:3px 10px;border-radius:20px;margin-top:auto;align-self:flex-start;letter-spacing:.3px}
/* ── SOB CONSULTA ── */
.card-preco.sob-consulta{color:var(--muted);font-size:.78rem;font-style:italic;font-weight:600}

/* ═══════════════ REDESIGN 2026 — recado, tabs, mais pedidos, capa, grade/lista ═══════════════ */
/* Recado do lojista */
.menu-recado{max-width:1200px;margin:14px auto 0;padding:0 20px}
.menu-recado .rc-in{background:linear-gradient(135deg,var(--red2),var(--red));color:#fff;border-radius:16px;padding:14px 18px;font-size:.9rem;line-height:1.5;font-weight:500;box-shadow:0 10px 24px -12px rgba(234,106,12,.6)}
@media(max-width:600px){.menu-recado{padding:0 14px}}
/* Pedido mínimo no hero */
.hero-min{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:.8rem;color:var(--muted);font-weight:600}
.hero-min i{color:var(--red)}

/* Filter bar → tabs */
.filter-bar{padding:0}
.filter-inner{flex-direction:column;align-items:stretch;gap:10px;padding:12px 20px 10px}
.menu-tabrow{display:flex;align-items:center;gap:10px}
.menu-tabs{flex:1;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.menu-tabs::-webkit-scrollbar{display:none}
.menu-tab{flex:none;border:1.5px solid var(--border);background:#fff;color:var(--muted);font-family:inherit;font-weight:700;font-size:.82rem;padding:8px 15px;border-radius:50px;cursor:pointer;white-space:nowrap;transition:.15s}
.menu-tab:hover{border-color:var(--red);color:var(--red)}
.menu-tab.on{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 6px 16px -6px rgba(234,106,12,.6)}
.layout-seg{flex:none;display:flex;background:#f1ece6;border-radius:11px;padding:3px;border:1px solid var(--border)}
.layout-seg button{border:none;background:none;cursor:pointer;width:36px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--muted);transition:.15s;font-size:.85rem}
.layout-seg button.on{background:#fff;color:var(--red2);box-shadow:0 2px 6px -2px rgba(0,0,0,.2)}
@media(max-width:540px){.filter-inner{flex-direction:column}}

/* Mais pedidos */
.mais-pedidos{max-width:1200px;margin:18px auto 0;padding:0 20px}
.mp-title{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin:0 2px 11px;display:flex;align-items:center;gap:8px}
.mp-title i{color:var(--red)}
.mp-scroll{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;padding-bottom:6px}
.mp-scroll::-webkit-scrollbar{display:none}
.mp-item{flex:none;width:158px;background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;cursor:pointer;transition:.15s}
.mp-item:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}
.mp-ph{height:108px;background:#f0f0f4;position:relative}
.mp-ph img{width:100%;height:100%;object-fit:cover;display:block}
.mp-ph .mp-noimg{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#c8c8d0;font-size:1.8rem}
.mp-tag{position:absolute;top:7px;left:7px;background:var(--red);color:#fff;font-size:.56rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:3px 6px;border-radius:6px}
.mp-body{padding:9px 11px 11px}
.mp-body h4{margin:0 0 3px;font-size:.82rem;font-weight:700;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--dark)}
.mp-body .pr{font-size:.9rem;font-weight:800;color:var(--red)}
/* PROMOÇÕES: preço riscado + selos de desconto */
.pr-old{font-size:.78em;font-weight:600;color:var(--muted);text-decoration:line-through;margin-right:4px}
.mp-tag.promo{background:var(--success,#16a34a)}
.mp-tag.combo{background:var(--red)}
.menu-combos .mp-title i{color:var(--red)}
.cb-resumo{font-size:.68rem;color:var(--muted);line-height:1.35;margin-bottom:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.badge-promo{background:var(--success,#16a34a)}
.menu-promos .mp-title i{color:var(--success,#16a34a)}
@media(max-width:600px){.mais-pedidos{padding:0 14px}}

/* Cabeçalho de categoria com capa */
.cat-head{border-radius:18px;overflow:hidden;position:relative;margin-bottom:14px;background:var(--red)}
.cat-head .cover{height:118px;background-size:cover;background-position:center;position:relative}
.cat-head .cover::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(120,50,8,.12),rgba(120,50,8,.62))}
.cat-head .ct{position:absolute;left:0;right:0;bottom:0;padding:12px 16px;z-index:2;color:#fff}
.cat-head .ct h3{margin:0;font-size:1.28rem;font-weight:800;letter-spacing:-.01em;text-shadow:0 2px 10px rgba(0,0,0,.5)}
.cat-head .ct p{margin:2px 0 0;font-size:.82rem;opacity:.95;font-weight:500;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.cat-head.plain{background:none;border-radius:0}
.cat-head.plain .ct{position:static;padding:0;color:var(--dark)}
.cat-head.plain .ct{display:flex;align-items:center;gap:10px}
.cat-head.plain .ct::after{content:'';flex:1;height:1px;background:var(--border)}
.cat-head.plain .ct h3{font-size:1.05rem;text-shadow:none;color:var(--dark)}
.cat-head.plain .ct p{display:none}

/* ── LAYOUT GRADE (fotos grandes, cards verticais) ── */
.layout-grade .produtos-grid{grid-template-columns:1fr 1fr;gap:12px}
.layout-grade .produto-card{flex-direction:column-reverse;align-items:stretch}
.layout-grade .card-img-wrap{width:100%;min-width:0;height:140px;align-self:auto}
.layout-grade .card-body{padding:11px 12px 12px}
.layout-grade .btn-card-add{align-self:stretch;text-align:center;padding:8px 10px;margin-top:8px}
.layout-grade .badge-dest{top:8px;bottom:auto}
@media(max-width:400px){.layout-grade .card-img-wrap{height:118px}}

/* ── LAYOUT LISTA (compacto, thumb à direita) ── */
.layout-lista .produtos-grid{grid-template-columns:1fr;gap:0}
.layout-lista .produto-card{flex-direction:row;border-radius:0;border:none;border-bottom:1px solid var(--border);box-shadow:none!important;transform:none!important}
.layout-lista .produto-card:hover{background:#faf6f1}
.layout-lista .card-img-wrap{width:92px;min-width:92px;height:auto;align-self:stretch;border-radius:12px;margin:10px 0 10px 6px;overflow:hidden}
.layout-lista .card-body{padding:12px 8px 12px 4px}

/* ═══════════════ ACABAMENTOS 2026 — hero app + scallop + nav inferior ═══════════════ */
.menu-hero{position:relative;height:152px;background:var(--dark);background-size:cover;background-position:center}
.menu-hero.has-banner::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.34))}
.menu-topbar{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;justify-content:space-between;padding:12px}
.mtb-btn{width:38px;height:38px;border-radius:50%;background:rgba(0,0,0,.42);backdrop-filter:blur(4px);border:none;cursor:pointer;color:#fff;font-size:.95rem;display:flex;align-items:center;justify-content:center;text-decoration:none}
.mtb-btn:hover{background:rgba(0,0,0,.6)}
.mtb-actions{display:flex;gap:8px}
.store-wrap{max-width:1200px;margin:0 auto;padding:0 16px}
.store-card{background:var(--surface);border-radius:20px 20px 0 0;margin-top:-34px;position:relative;z-index:2;padding:0 18px 4px}
.store-card-row{display:flex;gap:13px;align-items:flex-end;transform:translateY(-26px);margin-bottom:-18px}
.store-logo{width:76px;height:76px;border-radius:20px;flex:none;background:#fff;box-shadow:0 8px 22px -6px rgba(0,0,0,.25),0 0 0 4px var(--surface);overflow:hidden;display:flex;align-items:center;justify-content:center}
.store-logo img{width:100%;height:100%;object-fit:cover}
.store-tt{flex:1;min-width:0;padding-bottom:4px}
.store-nome{font-size:1.3rem;font-weight:800;letter-spacing:-.02em;color:var(--dark);margin:0;line-height:1.12}
.store-sub{font-size:.85rem;color:var(--muted);font-weight:600;margin-top:3px}
.store-min{display:inline-flex;align-items:center;color:var(--muted);font-weight:600}
.store-tag{font-size:.8rem;color:var(--muted);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.store-tag i{color:var(--red)}
.store-meta{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;font-size:.82rem;padding-bottom:10px}
.store-meta{gap:8px 16px}
.store-open{display:inline-flex;align-items:center;gap:6px;font-weight:700}
.store-open.on{color:var(--success)}
.store-open.off{color:var(--danger)}
.store-open .dot{width:8px;height:8px;border-radius:50%;background:currentColor}
.store-tel{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-weight:600}
.store-tel i{color:var(--red)}
.store-scallop{height:13px;background:var(--surface);margin:0;
  -webkit-mask:radial-gradient(circle 7px at 11px 13px,transparent 7px,#000 7.5px) -1px 0/22px 13px repeat-x;
  mask:radial-gradient(circle 7px at 11px 13px,transparent 7px,#000 7.5px) -1px 0/22px 13px repeat-x}

/* nav inferior (mobile) */
.menu-bottomnav{display:none;position:fixed;left:0;right:0;bottom:0;z-index:210;background:var(--surface);border-top:1px solid var(--border);padding:6px 0 calc(6px + env(safe-area-inset-bottom));box-shadow:0 -4px 16px rgba(0,0,0,.06)}
@media(max-width:860px){.menu-bottomnav{display:flex}}
.mbn-item{flex:1;background:none;border:none;cursor:pointer;font-family:inherit;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--muted);font-size:.66rem;font-weight:600;padding:4px 0}
.mbn-item.on{color:var(--red)}
.mbn-ic{position:relative;font-size:1.15rem;line-height:1}
.mbn-badge{position:absolute;top:-6px;right:-9px;background:var(--red);color:#fff;font-size:.58rem;font-weight:800;min-width:16px;height:16px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 4px}

/* nav inferior substitui o FAB antigo; espaço p/ conteúdo e LGPD acima da nav */
.cart-fab{display:none!important}
@media(max-width:860px){.main-layout{padding-bottom:82px}.lgpd{bottom:58px}}

/* ═══════════ MODELOS DESKTOP 2026 (só ≥861px; o mobile é igual nos dois) ═══════════ */
.menu-rail{display:none}
.tab-n,.ct-n,.hdr-menu-btn,.store-tipo{display:none}
@media(min-width:861px){
  /* ── Modelo CORTINA (mockup A): sem banner o topo vira a cortina laranja; conteúdo centrado ── */
  /* degradê VERTICAL: a base fica de cor única em qualquer largura — as ondinhas
     do scallop revelam exatamente a mesma cor (diagonal criava degrau de tom) */
  .modelo-cortina .menu-hero:not(.has-banner){background:linear-gradient(180deg,var(--red) 0%,var(--red2) 85%);height:170px}
  /* com banner o hero ganha altura p/ mostrar a arte (1920×400 ficava 62% cortada em 152px) */
  .modelo-cortina .menu-hero.has-banner{height:240px}
  .modelo-cortina .menu-topbar .mtb-btn{background:rgba(0,0,0,.22);color:#fff;border:none}
  /* os dois botões abrem o mesmo drawer — no desktop fica só o hambúrguer */
  .modelo-cortina .menu-topbar .mtb-actions{display:none}
  .modelo-cortina .store-wrap,
  .modelo-cortina .filter-inner,
  .modelo-cortina .menu-recado,
  .modelo-cortina .mais-pedidos,
  .modelo-cortina .main-layout{max-width:1080px}
  /* sombra mais contida — a difusa de 36px "manchava" o creme ao redor do card */
  .modelo-cortina .store-card{border-radius:20px;margin-top:-64px;box-shadow:0 6px 18px -6px rgba(0,0,0,.14);padding:22px 28px 12px}
  .modelo-cortina .store-card-row{transform:none;align-items:center;gap:18px;margin-bottom:0}
  .modelo-cortina .store-logo{width:64px;height:64px;border-radius:16px;box-shadow:0 4px 14px rgba(0,0,0,.12)}
  .modelo-cortina .store-nome{font-size:1.35rem}
  .modelo-cortina .store-meta{margin-left:82px;margin-top:-8px}
  /* busca/abas sobre o fundo creme da página (a faixa branca não existe no mockup) */
  .modelo-cortina .filter-bar{background:var(--bg);border-bottom:none}
  /* ondinha (scallop) na base da cortina, atrás do card — como no mockup */
  .modelo-cortina .menu-hero{overflow:visible}
  /* a ondinha usa ::before para não colidir com o overlay escuro do banner
     (.has-banner::after tem inset:0 — o top:0 herdado jogava a ondinha pro topo) */
  .modelo-cortina .menu-hero::before{content:'';position:absolute;left:0;right:0;top:auto;bottom:-1px;height:26px;background:radial-gradient(circle at 13px -7px, transparent 15px, var(--bg) 16px);background-size:26px 26px;pointer-events:none;z-index:1}
  .modelo-cortina .store-scallop{display:none}
  /* pills Delivery/Retirada à direita do card */
  .modelo-cortina .store-tipo{display:flex;gap:10px;margin-left:auto;flex:none}
  .modelo-cortina .store-tipo button{border:1.5px solid var(--border);background:#fff;color:var(--muted);font-family:inherit;font-weight:700;font-size:.8rem;padding:8px 18px;border-radius:99px;cursor:pointer;transition:.15s}
  .modelo-cortina .store-tipo button:hover{border-color:var(--red);color:var(--red)}
  .modelo-cortina .store-tipo button.on{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 6px 16px -6px rgba(234,106,12,.6)}
  .modelo-cortina .layout-grade .produtos-grid{grid-template-columns:repeat(3,1fr);gap:16px}
  .modelo-cortina .cat-head.plain .ct .ct-n{display:inline;color:var(--muted);font-weight:600;font-size:.78rem}

  /* ── Modelo PAINEL (mockup B): cabeçalho branco com busca, rail de categorias, linhas Goomer ── */
  .modelo-painel .menu-hero{height:0;background:none}
  .modelo-painel .menu-hero .menu-topbar{position:absolute;z-index:20}
  .modelo-painel .menu-topbar .mtb-btn{background:var(--surface);color:var(--dark);border:1px solid var(--border);box-shadow:0 2px 8px rgba(0,0,0,.08)}
  .modelo-painel .store-wrap{max-width:none;padding:0;background:var(--surface);border-bottom:1px solid var(--border)}
  .modelo-painel .store-card{max-width:1150px;margin:0 auto;margin-top:0;border-radius:0;box-shadow:none;padding:16px 24px 10px}
  .modelo-painel .store-logo{width:54px;height:54px;margin-top:0;border-radius:13px}
  .modelo-painel .store-card-row{align-items:center;transform:none;margin-bottom:0;gap:14px}
  .modelo-painel .store-nome{font-size:1.15rem}
  .modelo-painel .store-meta{margin-left:68px;margin-top:-14px;padding-bottom:6px}
  .modelo-painel .store-scallop{display:none}
  /* busca movida pro cabeçalho pelo JS (classe painel-desk no body quando o rail está ativo) */
  .modelo-painel .store-card-row .search-wrap{margin-left:auto;flex:1 1 auto;max-width:420px}
  .painel-desk .filter-bar{display:none}
  /* um só botão de menu no cabeçalho — os dois flutuantes somem (duplicavam a função) */
  .painel-desk .menu-topbar{display:none}
  .painel-desk .hdr-menu-btn{display:flex;align-items:center;justify-content:center;width:42px;height:42px;flex:none;border-radius:50%;border:1px solid var(--border);background:var(--surface);color:var(--dark);cursor:pointer;font-size:1rem;box-shadow:0 2px 8px rgba(0,0,0,.06)}
  .painel-desk .hdr-menu-btn:hover{border-color:var(--red);color:var(--red)}
  .modelo-painel .main-layout{grid-template-columns:210px 1fr 310px;max-width:1150px}
  .modelo-painel .menu-rail{display:block;position:sticky;top:20px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:8px}
  .modelo-painel .menu-rail::before{content:"Categorias";display:block;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);padding:8px 12px 6px}
  /* delivery desabilitado força 1 coluna via style inline — sem colunas, sem rail
     (o JS confere a visibilidade do rail antes de mover abas/busca) */
  .modelo-painel .main-layout[style] .menu-rail{display:none}
  .modelo-painel .menu-rail .menu-tabs{flex-direction:column;overflow:visible;gap:2px}
  .modelo-painel .menu-rail .menu-tab{width:100%;display:flex;align-items:center;gap:8px;text-align:left;border-radius:10px;border:none;background:none;padding:10px 12px;font-weight:600;color:var(--muted)}
  .modelo-painel .menu-rail .menu-tab.on{background:linear-gradient(90deg,rgba(234,106,12,.14),rgba(234,106,12,.05));color:var(--red2)}
  .modelo-painel .menu-rail .tab-n{display:inline;margin-left:auto;font-size:.72rem;font-weight:700;color:var(--muted);opacity:.75}
  .modelo-painel .menu-tabrow:not(:has(.menu-tabs)){justify-content:flex-end}
  /* LISTA = linhas horizontais (foto à esquerda, + redondo à direita), como no mockup;
     GRADE = cards verticais em 2 colunas — o toggle fica na linha do título da 1ª categoria */
  .painel-desk .layout-lista .produtos-grid{grid-template-columns:1fr;gap:12px}
  .painel-desk .layout-lista .produto-card{flex-direction:row-reverse;justify-content:flex-end;border:1px solid var(--border);border-radius:14px;position:relative;padding-right:66px;background:var(--surface);box-shadow:0 2px 8px rgba(0,0,0,.05)!important}
  .painel-desk .layout-lista .card-img-wrap{width:84px;min-width:84px;height:84px;align-self:center;margin:14px 0 14px 14px;border-radius:12px;overflow:hidden}
  .painel-desk .layout-lista .card-body{padding:14px 8px 14px 16px}
  .painel-desk .layout-lista .btn-card-add{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:40px;height:40px;margin:0;padding:0;border-radius:50%;background:var(--red);border-color:var(--red);color:#fff;font-size:0;line-height:0;display:flex;align-items:center;justify-content:center;box-shadow:0 5px 12px rgba(234,106,12,.4)}
  .painel-desk .layout-lista .btn-card-add::before{content:"\f067";font-family:"Font Awesome 6 Free";font-weight:900;font-size:1rem;line-height:1}
  .painel-desk .layout-lista .badge-esgotado{position:absolute;right:14px;top:50%;transform:translateY(-50%)}
  .painel-desk .layout-grade .produtos-grid{grid-template-columns:1fr 1fr;gap:14px}
  /* toggle grade/lista na linha do título (flex: título → linha → toggle; nada de absolute) */
  .painel-desk .cat-head.plain .ct .layout-seg{order:2;margin-left:2px;flex:none}
  .painel-desk .cat-head.plain .ct::after{order:1}
  .painel-desk .cat-head:not(.plain){position:relative}
  .painel-desk .cat-head:not(.plain) .layout-seg{position:absolute;right:12px;top:12px;z-index:3}
}