*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg: #0c0a09;
  --bg-card: #1c1917;
  --border: #2a2523;
  --primary: #DA2535;
  --primary-glow: rgba(218,37,53,.3);
  --accent: #ff4d00;
  --green: #22c55e;
  --text: #fafaf9;
  --text-dim: #a8a29e;
  --text-muted: #78716c;
  --radius: 16px;
}
body { font-family:'Poppins',sans-serif; background:var(--bg); color:var(--text); min-height:100vh; -webkit-font-smoothing:antialiased; }
a { text-decoration:none; color:inherit; }

/* ===== HEADER ===== */
.site-header { position:fixed; top:0; left:0; right:0; z-index:300; background:rgba(12,10,9,.92); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-bottom:1px solid var(--border); }
.site-header .nav { height:3.5rem; display:flex; align-items:center; justify-content:space-between; max-width:1200px; margin:0 auto; padding:0 1.25rem; }
.site-header .logo { font-weight:800; font-size:1.05rem; color:var(--text); }
.site-header .logo:hover { color:var(--primary); }
.header-right { display:flex; align-items:center; gap:1.5rem; }
.header-link { color:var(--text-dim); font-size:.85rem; font-weight:600; }
.header-link:hover { color:var(--primary); }
.header-cart { position:relative; font-size:1.6rem; color:var(--text); cursor:pointer; }
.header-cart:hover { color:var(--primary); }
.header-cart-badge { position:absolute; top:-5px; right:-8px; background:var(--primary); color:#fff; min-width:18px; height:18px; border-radius:50%; font-size:.6rem; font-weight:800; display:flex; align-items:center; justify-content:center; }
@media(max-width:640px) { .header-links { display:none; } }

/* ===== HERO ===== */
.hero { position:relative; padding:4.5rem 1.5rem 2rem; text-align:center; overflow:hidden; margin-top:3.5rem; }
.hero::before { content:''; position:absolute; top:-40%; left:50%; transform:translateX(-50%); width:600px; height:600px; background:radial-gradient(circle,rgba(218,37,53,.12) 0%,transparent 70%); pointer-events:none; }
.hero-badge { display:inline-flex; align-items:center; gap:.4rem; background:rgba(218,37,53,.1); border:1px solid rgba(218,37,53,.2); color:var(--primary); padding:.4rem 1rem; border-radius:50px; font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:1px; margin-bottom:1rem; }
.hero h1 { font-size:2.2rem; font-weight:900; line-height:1.1; margin-bottom:.5rem; background:linear-gradient(135deg,#fff,#d4d4d4); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero p { color:var(--text-muted); font-size:.88rem; max-width:420px; margin:0 auto 1.5rem; line-height:1.5; }
.hero-search { max-width:440px; margin:0 auto; position:relative; }
.hero-search input { width:100%; padding:.9rem 1rem .9rem 3.2rem; background:var(--bg-card); border:1.5px solid var(--border); border-radius:50px; color:var(--text); font-family:inherit; font-size:.9rem; outline:none; transition:all .3s; }
.hero-search input:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-glow); }
.hero-search input::placeholder { color:var(--text-muted); }
.hero-search > i { position:absolute; left:1.2rem; top:50%; transform:translateY(-50%); color:var(--text-muted); font-size:1.2rem; }
@media(min-width:640px) { .hero h1 { font-size:2.8rem; } }
@media(min-width:1024px) { .hero h1 { font-size:3.2rem; } .hero { padding:5rem 2rem 2.5rem; } }

/* ===== TABS ===== */
.tabs-wrap { position:sticky; top:3.5rem; z-index:100; background:rgba(12,10,9,.88); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-bottom:1px solid var(--border); padding:.75rem 1rem; }
.tabs { display:flex; gap:.5rem; max-width:800px; margin:0 auto; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; flex-wrap:nowrap; scroll-snap-type:x mandatory; padding-bottom:2px; }
.tabs::-webkit-scrollbar { display:none; }
.tab { display:flex; align-items:center; gap:.4rem; padding:.6rem 1.2rem; background:transparent; border:1.5px solid var(--border); border-radius:50px; color:var(--text-dim); font-family:inherit; font-size:.82rem; font-weight:600; cursor:pointer; white-space:nowrap; transition:all .25s; flex-shrink:0; -webkit-tap-highlight-color:transparent; scroll-snap-align:start; }
.tab:hover { border-color:var(--text-muted); color:var(--text); }
.tab.active { background:var(--primary); border-color:var(--primary); color:#fff; box-shadow:0 4px 15px var(--primary-glow); }
.tab .cnt { background:rgba(255,255,255,.15); padding:.1rem .5rem; border-radius:20px; font-size:.68rem; }
.tab.active .cnt { background:rgba(255,255,255,.25); }

/* ===== CONTENT ===== */
.content { max-width:1200px; margin:0 auto; padding:1.5rem 1rem 7rem; }

/* ===== SECTION ===== */
.sec { margin-bottom:2.5rem; display:none; }
.sec.active { display:block; }
.sec-head { display:flex; align-items:center; gap:.6rem; margin-bottom:1.25rem; padding-bottom:.75rem; border-bottom:1px solid var(--border); }
.sec-head i { font-size:1.4rem; color:var(--primary); }
.sec-head h2 { font-size:1.2rem; font-weight:800; }
.sec-head .sec-cnt { margin-left:auto; font-size:.75rem; color:var(--text-muted); background:var(--bg-card); padding:.2rem .7rem; border-radius:20px; border:1px solid var(--border); }

/* ===== GRID ===== */
.grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.85rem; }
@media(min-width:640px) { .grid { grid-template-columns:repeat(3,1fr); gap:1rem; } }
@media(min-width:1024px) { .grid { grid-template-columns:repeat(4,1fr); gap:1.25rem; } .content { padding:2rem 2rem 7rem; } }
@media(min-width:1400px) { .grid { grid-template-columns:repeat(5,1fr); } }

/* ===== CARD (mesmo visual da index) ===== */
.cd-card {
  position:relative; background:var(--bg-card); border:1px solid var(--border);
  border-radius:var(--radius); overflow:hidden; cursor:pointer;
  transition:all .3s cubic-bezier(.4,0,.2,1);
  text-align:center; padding:1.5rem 1rem 2.5rem;
  box-shadow:0 2px 6px rgba(65,11,16,.15);
}
.cd-card:hover { transform:translateY(-5px); border-color:rgba(218,37,53,.4); box-shadow:0 8px 30px rgba(0,0,0,.4); }
.cd-card img { width:150px; max-height:120px; object-fit:contain; margin-bottom:.5rem; transition:transform .4s; }
.cd-card:hover img { transform:scale(1.08) rotate(-2deg); }
.cd-card-name { font-size:.88rem; font-weight:700; color:var(--text); margin-bottom:.25rem; }
.cd-card-desc { font-size:.68rem; color:var(--text-muted); margin-bottom:.5rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:1.8rem; }
.cd-card-price { font-size:1.1rem; font-weight:800; color:var(--green); }
.cd-card-price small { font-size:.6em; font-weight:400; display:block; color:var(--text-muted); }
.cd-card-btn {
  position:absolute; bottom:0; right:0; width:42px; height:42px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--primary),var(--accent));
  border:none; border-radius:var(--radius) 0 var(--radius) 0;
  color:#fff; font-size:1.2rem; cursor:pointer;
  box-shadow:-3px -3px 12px var(--primary-glow); z-index:2;
}
.cd-card-btn:hover { background:linear-gradient(135deg,var(--accent),var(--primary)); }
@keyframes pulse { 0%{transform:scale(1)} 50%{transform:scale(1.2)} 100%{transform:scale(1)} }
.cd-card-btn.pop { animation:pulse .3s ease; }

/* Pizza tags */
.pizza-tags { display:flex; gap:.25rem; flex-wrap:wrap; margin-top:.4rem; margin-bottom:.4rem; justify-content:center; }
.ptag { background:rgba(218,37,53,.07); border:1px solid rgba(218,37,53,.12); color:var(--text-dim); padding:.12rem .4rem; border-radius:5px; font-size:.58rem; font-weight:600; }
.ptag b { color:var(--green); font-weight:700; }

/* ===== FLOATING CART ===== */
.float-cart { position:fixed; bottom:1.5rem; left:50%; transform:translateX(-50%) translateY(100px); background:linear-gradient(135deg,var(--primary),var(--accent)); color:#fff; border:none; border-radius:50px; padding:.85rem 2rem; font-family:inherit; font-size:.9rem; font-weight:700; cursor:pointer; display:flex; align-items:center; gap:.75rem; box-shadow:0 8px 30px var(--primary-glow),0 2px 10px rgba(0,0,0,.3); z-index:200; transition:transform .4s cubic-bezier(.4,0,.2,1); -webkit-tap-highlight-color:transparent; }
.float-cart.show { transform:translateX(-50%) translateY(0); }
.float-cart:hover { box-shadow:0 12px 40px var(--primary-glow); }
.float-cart .fc-badge { background:#fff; color:var(--primary); min-width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.8rem; font-weight:800; }

/* ===== EMPTY ===== */
.empty { text-align:center; padding:3rem 1rem; color:var(--text-muted); }
.empty i { font-size:3rem; display:block; margin-bottom:.5rem; color:var(--border); }

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar { width:5px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--border); border-radius:3px; }

/* ===== CART PANEL ===== */
.cart-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.6); backdrop-filter:blur(4px); z-index:998; }
.cart-overlay.open { display:block; }
.cart-panel { position:fixed; top:0; right:-100%; width:100%; max-width:420px; height:100vh; height:100dvh; background:#1a1a1a; z-index:999; display:flex; flex-direction:column; transition:right .35s cubic-bezier(.4,0,.2,1); box-shadow:-8px 0 30px rgba(0,0,0,.5); }
.cart-panel.open { right:0; }
.cp-header { display:flex; align-items:center; justify-content:space-between; padding:1.25rem 1.5rem; background:linear-gradient(135deg,var(--primary),var(--accent)); flex-shrink:0; }
.cp-header h3 { font-size:1.1rem; font-weight:700; color:#fff; display:flex; align-items:center; gap:.5rem; }
.cp-close { background:rgba(255,255,255,.15); border:none; color:#fff; width:36px; height:36px; border-radius:50%; font-size:1.4rem; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.cp-close:hover { background:rgba(255,255,255,.3); }
.cp-body { flex:1; overflow-y:auto; padding:1rem 1.25rem; }
.cp-empty { text-align:center; padding:3rem 1rem; color:#666; }
.cp-empty i { font-size:3rem; display:block; margin-bottom:.5rem; }
.cp-item { background:#242424; border-radius:12px; padding:1rem; margin-bottom:.75rem; border:1px solid #2e2e2e; }
.cp-item-top { display:flex; justify-content:space-between; margin-bottom:.5rem; }
.cp-item-name { font-size:.9rem; font-weight:600; color:#fff; }
.cp-item-price { font-size:.8rem; color:#999; }
.cp-item-bot { display:flex; justify-content:space-between; align-items:center; }
.cp-item-sub { font-size:1rem; font-weight:700; color:var(--green); }
.cp-qty { display:flex; align-items:center; background:#1a1a1a; border-radius:8px; border:1px solid #333; overflow:hidden; }
.cp-qty button { width:32px; height:32px; border:none; background:transparent; color:#fff; font-size:1rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.cp-qty button:hover { background:#333; }
.cp-qty span { min-width:32px; text-align:center; font-weight:600; font-size:.9rem; color:#fff; }
.cp-del { width:32px; height:32px; border:none; background:rgba(231,76,60,.1); color:#e74c3c; border-radius:8px; cursor:pointer; display:flex; align-items:center; justify-content:center; margin-left:.5rem; font-size:1rem; }
.cp-del:hover { background:#e74c3c; color:#fff; }
.cp-footer { flex-shrink:0; padding:1rem 1.25rem; background:#141414; border-top:1px solid #2a2a2a; padding-bottom:calc(1rem + env(safe-area-inset-bottom,0px)); }
.cp-total { display:flex; justify-content:space-between; align-items:center; padding:.75rem 0; border-top:1px dashed #333; margin-bottom:.75rem; }
.cp-total span { color:#999; text-transform:uppercase; font-weight:600; font-size:.85rem; }
.cp-total strong { font-size:1.4rem; color:var(--green); }
.cp-checkout { width:100%; padding:.9rem; background:linear-gradient(135deg,#25D366,#128C7E); border:none; border-radius:12px; font-family:inherit; font-size:1rem; color:#fff; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:.5rem; text-transform:uppercase; letter-spacing:.5px; transition:transform .2s; }
.cp-checkout:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(37,211,102,.3); }
.cp-checkout i { font-size:1.3rem; }

/* ===== PRODUCT MODAL (lanche/bebida) ===== */
.pm-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.7); backdrop-filter:blur(6px); z-index:1000; align-items:center; justify-content:center; padding:1rem; }
.pm-overlay.open { display:flex; }
.pm-modal { background:var(--bg-card); border:1px solid var(--border); border-radius:20px; max-width:440px; width:100%; max-height:90vh; overflow-y:auto; position:relative; animation:pmIn .3s ease; }
@keyframes pmIn { from{opacity:0;transform:scale(.92) translateY(20px)} to{opacity:1;transform:scale(1) translateY(0)} }
.pm-close { position:absolute; top:1rem; right:1rem; width:36px; height:36px; border-radius:50%; background:rgba(0,0,0,.5); backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,.1); color:#fff; font-size:1.4rem; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:5; transition:all .2s; }
.pm-close:hover { background:var(--primary); border-color:var(--primary); }
.pm-img { position:relative; width:100%; height:220px; display:flex; align-items:center; justify-content:center; background:linear-gradient(180deg,rgba(218,37,53,.08) 0%,transparent 100%); border-radius:20px 20px 0 0; overflow:hidden; }
.pm-img img { max-width:85%; max-height:85%; object-fit:contain; filter:drop-shadow(0 12px 24px rgba(0,0,0,.4)); }
.pm-img .pm-tag { position:absolute; top:1rem; left:1rem; background:var(--primary); color:#fff; padding:.25rem .7rem; border-radius:8px; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.5px; }
.pm-body { padding:1.5rem; }
.pm-cat { font-size:.7rem; font-weight:600; color:var(--primary); text-transform:uppercase; letter-spacing:1px; margin-bottom:.35rem; }
.pm-name { font-size:1.35rem; font-weight:800; color:var(--text); margin-bottom:.5rem; line-height:1.2; }
.pm-desc { font-size:.85rem; color:var(--text-dim); line-height:1.6; margin-bottom:1.25rem; }
.pm-divider { height:1px; background:var(--border); margin-bottom:1.25rem; }
.pm-footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.pm-qty { display:flex; align-items:center; background:var(--bg); border-radius:10px; border:1px solid var(--border); overflow:hidden; }
.pm-qty button { width:38px; height:38px; border:none; background:transparent; color:var(--text); font-size:1.1rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.pm-qty button:hover { background:rgba(218,37,53,.15); }
.pm-qty span { min-width:32px; text-align:center; font-weight:700; font-size:.95rem; color:var(--text); }
.pm-price { font-size:1.5rem; font-weight:800; color:var(--green); }
.pm-price small { display:block; font-size:.65rem; font-weight:500; color:var(--text-muted); }
.pm-add { display:flex; align-items:center; gap:.5rem; padding:.8rem 1.5rem; background:linear-gradient(135deg,var(--primary),var(--accent)); border:none; border-radius:12px; color:#fff; font-family:inherit; font-size:.9rem; font-weight:700; cursor:pointer; transition:all .25s; }
.pm-add:hover { transform:translateY(-2px); box-shadow:0 6px 20px var(--primary-glow); }
.pm-add i { font-size:1.2rem; }
@media(min-width:640px) { .pm-img { height:260px; } }

/* ===== PIZZA MODAL (step-by-step) ===== */
.pz-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.7); backdrop-filter:blur(6px); z-index:1000; align-items:flex-end; justify-content:center; }
.pz-overlay.open { display:flex; }
@media(min-width:640px) { .pz-overlay { align-items:center; padding:1rem; } }
.pz-modal { background:var(--bg-card); border:1px solid var(--border); border-radius:20px 20px 0 0; width:100%; max-width:500px; max-height:92vh; display:flex; flex-direction:column; animation:pzIn .3s ease; }
@media(min-width:640px) { .pz-modal { border-radius:20px; max-height:88vh; } }
@keyframes pzIn { from{opacity:0;transform:translateY(40px)} to{opacity:1;transform:translateY(0)} }
.pz-header { display:flex; align-items:center; gap:.75rem; padding:1.25rem 1.5rem; border-bottom:1px solid var(--border); flex-shrink:0; }
.pz-header img { width:50px; height:50px; border-radius:10px; object-fit:cover; }
.pz-header-info h3 { font-size:1rem; font-weight:800; }
.pz-header-info p { font-size:.75rem; color:var(--text-muted); }
.pz-close { margin-left:auto; width:32px; height:32px; border-radius:50%; background:rgba(255,255,255,.08); border:none; color:var(--text-dim); font-size:1.2rem; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.pz-close:hover { background:var(--primary); color:#fff; }
.pz-body { flex:1; overflow-y:auto; padding:1rem 1.5rem; }
.pz-step { margin-bottom:1.25rem; display:none; }
.pz-step.visible { display:block; }
.pz-step-title { display:flex; align-items:center; gap:.5rem; font-size:.85rem; font-weight:700; margin-bottom:.6rem; color:var(--text); }
.pz-step-num { width:22px; height:22px; border-radius:50%; background:var(--primary); color:#fff; font-size:.7rem; font-weight:800; display:flex; align-items:center; justify-content:center; }
.pz-step-hint { margin-left:auto; font-size:.7rem; font-weight:500; color:var(--text-muted); }
.pz-options { display:flex; flex-direction:column; gap:.4rem; }
.pz-opt { display:flex; align-items:center; gap:.75rem; padding:.7rem .85rem; background:var(--bg); border:1.5px solid var(--border); border-radius:10px; cursor:pointer; transition:all .2s; }
.pz-opt:hover { border-color:var(--text-muted); }
.pz-opt.selected { border-color:var(--primary); background:rgba(218,37,53,.08); }
.pz-opt-radio { width:18px; height:18px; border-radius:50%; border:2px solid var(--border); flex-shrink:0; display:flex; align-items:center; justify-content:center; transition:all .2s; }
.pz-opt.selected .pz-opt-radio { border-color:var(--primary); }
.pz-opt.selected .pz-opt-radio::after { content:''; width:8px; height:8px; border-radius:50%; background:var(--primary); }
.pz-opt-check { width:18px; height:18px; border-radius:5px; border:2px solid var(--border); flex-shrink:0; display:flex; align-items:center; justify-content:center; transition:all .2s; }
.pz-opt.selected .pz-opt-check { border-color:var(--primary); background:var(--primary); }
.pz-opt.selected .pz-opt-check::after { content:'✓'; color:#fff; font-size:.7rem; font-weight:800; }
.pz-opt-info { flex:1; }
.pz-opt-name { font-size:.82rem; font-weight:600; color:var(--text); }
.pz-opt-detail { font-size:.7rem; color:var(--text-muted); }
.pz-opt-price { font-size:.8rem; font-weight:700; color:var(--green); white-space:nowrap; }
.pz-opt-price.free { color:var(--text-muted); }
.pz-opt.disabled { opacity:.35; pointer-events:none; }
.pz-flavors { display:grid; grid-template-columns:1fr; gap:.4rem; }
.pz-flavor { display:flex; align-items:center; gap:.6rem; padding:.6rem .75rem; background:var(--bg); border:1.5px solid var(--border); border-radius:10px; cursor:pointer; transition:all .2s; }
.pz-flavor:hover { border-color:var(--text-muted); }
.pz-flavor.selected { border-color:var(--primary); background:rgba(218,37,53,.08); }
.pz-flavor.disabled { opacity:.35; pointer-events:none; }
.pz-flavor img { width:36px; height:36px; border-radius:8px; object-fit:cover; }
.pz-flavor-info { flex:1; }
.pz-flavor-name { font-size:.8rem; font-weight:600; }
.pz-flavor-price { font-size:.72rem; color:var(--green); font-weight:600; }
.pz-notes { width:100%; padding:.65rem .85rem; background:var(--bg); border:1.5px solid var(--border); border-radius:10px; color:var(--text); font-family:inherit; font-size:.82rem; resize:none; outline:none; }
.pz-notes:focus { border-color:var(--primary); }
.pz-footer { flex-shrink:0; padding:1rem 1.5rem; border-top:1px solid var(--border); background:var(--bg); padding-bottom:calc(1rem + env(safe-area-inset-bottom,0px)); }
.pz-summary { display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.pz-total-label { font-size:.75rem; color:var(--text-muted); }
.pz-total-price { font-size:1.3rem; font-weight:800; color:var(--green); }
.pz-add-btn { flex:1; padding:.75rem 1rem; background:linear-gradient(135deg,var(--primary),var(--accent)); border:none; border-radius:12px; color:#fff; font-family:inherit; font-size:.9rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:.5rem; transition:all .25s; }
.pz-add-btn:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 6px 20px var(--primary-glow); }
.pz-add-btn:disabled { opacity:.4; cursor:not-allowed; }