body.loja{background:#ECEAE4;}
.cat{max-width:620px; margin:0 auto; background:#FAFAF8; min-height:100vh; position:relative; padding-bottom:104px; box-shadow:0 0 0 1px #E3E1DA;}
.cat-head{background:var(--loja); color:var(--loja-txt); padding:18px 16px 20px; background-size:cover; background-position:center; position:relative;}
.cat-head.banner:before{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0.15), rgba(0,0,0,0.6));}
.cat-head.banner{color:#fff; padding-top:70px;}
.cat-head > *{position:relative;}
.cat-head .logo{width:52px; height:52px; border-radius:13px; border:2px solid rgba(255,255,255,0.6); font-size:16px;}
.cat-name{font-size:19px; font-weight:700; margin:0; line-height:1.2;}
.cat-tag{font-size:13px; opacity:0.88; margin:3px 0 0;}
.barra{position:sticky; top:0; z-index:20; background:#FAFAF8; padding:10px 14px 6px; border-bottom:1px solid var(--border);}
.barra .linha{display:flex; gap:8px; align-items:center;}
.barra .busca{flex:1; margin:0;}
.btn-filtro{flex-shrink:0; border:1px solid var(--border); background:#fff; border-radius:11px; padding:10px 12px; font-size:13px; font-weight:600; color:var(--text); cursor:pointer; position:relative;}
.btn-filtro .n{position:absolute; top:-6px; right:-6px; background:var(--loja); color:var(--loja-txt); border-radius:10px; font-size:10.5px; padding:1px 6px;}
.barra .chips{margin-top:8px;}
.loja .chip.on{background:var(--loja); border-color:var(--loja); color:var(--loja-txt);}
.ativos{display:flex; flex-wrap:wrap; gap:6px; align-items:center; padding:10px 14px 0; font-size:12.5px; color:var(--muted);}
.ativo{background:var(--ui-light); color:var(--ui-dark); border:none; border-radius:16px; padding:5px 9px; font-size:12px; cursor:pointer;}
.cat-body{padding:12px 14px;}
.grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
@media(min-width:520px){ .grid.g3{grid-template-columns:1fr 1fr 1fr;} }
.pcard{background:#fff; border:1px solid var(--border); border-radius:14px; overflow:hidden; display:flex; flex-direction:column; position:relative;}
.pcard.fora{opacity:0.55;}
.pimg{aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:22px; background:#EFEDE7; color:#A8A59B; cursor:pointer; overflow:hidden;}
.visual .pimg{aspect-ratio:3/4;}
.pimg img{width:100%; height:100%; object-fit:cover; display:block;}
.pb{padding:9px 10px 10px; display:flex; flex-direction:column; gap:5px; flex:1;}
.pn{font-size:13.5px; font-weight:600; margin:0; line-height:1.3; cursor:pointer;}
.pm{font-size:11.5px; color:var(--muted); margin:0;}
.pp{font-size:14.5px; font-weight:700;}
.pp small{font-weight:500; font-size:11px; color:var(--muted);}
.selo-fora{font-size:11px; font-weight:600; color:var(--danger);}
.add{margin-top:auto; border:none; border-radius:9px; padding:9px 0; font-size:13px; font-weight:600; color:var(--loja-txt); background:var(--loja); cursor:pointer; width:100%;}
.stepper{margin-top:auto; display:flex; align-items:center; justify-content:space-between; border:1.5px solid var(--loja); border-radius:9px; overflow:hidden;}
.stepper button{border:none; background:none; width:38px; height:34px; font-size:18px; cursor:pointer; color:var(--text);}
.stepper span{font-weight:700; font-size:14px;}
.pesos{display:flex; flex-wrap:wrap; gap:5px; margin-top:auto;}
.pesos button{flex:1 0 auto; border:1.5px solid var(--loja); background:#fff; border-radius:8px; padding:6px 7px; font-size:12px; font-weight:600; cursor:pointer; color:var(--text);}
.nocarrinho{font-size:11px; color:var(--ok); font-weight:600;}
.lrow{display:flex; gap:11px; align-items:center; background:#fff; border:1px solid var(--border); border-radius:12px; padding:9px; margin-bottom:7px;}
.lrow.fora{opacity:0.55;}
.lrow .pimg{width:54px; height:54px; border-radius:9px; font-size:14px; flex-shrink:0; aspect-ratio:auto;}
.lrow .acao{flex-shrink:0; width:104px;}
.lrow .acao .add, .lrow .acao .stepper{margin:0;}
.frow{display:flex; gap:12px; background:#fff; border:1px solid var(--border); border-radius:14px; padding:11px; margin-bottom:10px;}
.frow.fora{opacity:0.55;}
.frow .pimg{width:118px; height:118px; border-radius:10px; flex-shrink:0; aspect-ratio:auto;}
.frow ul{margin:2px 0 4px; padding-left:16px; font-size:12px; color:var(--muted); line-height:1.5;}
.frow .pb{padding:0;}
.cartbar{position:fixed; left:0; right:0; bottom:0; z-index:30; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); pointer-events:none;}
.cartbar button{pointer-events:auto; display:flex; width:100%; max-width:596px; margin:0 auto; justify-content:space-between; align-items:center; border:none; border-radius:15px; padding:14px 18px; background:var(--loja); color:var(--loja-txt); font-size:14.5px; font-weight:700; cursor:pointer; box-shadow:0 8px 24px rgba(0,0,0,0.25);}
.tela{padding:14px;}
.voltar{background:none; border:none; font-size:14px; color:var(--muted); cursor:pointer; padding:6px 0 12px;}
.cart-line{display:flex; gap:10px; padding:11px 0; border-bottom:1px solid var(--border); align-items:center;}
.cart-line .pimg{width:46px; height:46px; border-radius:9px; font-size:12px; flex-shrink:0; aspect-ratio:auto; cursor:default;}
.qty{display:flex; align-items:center; gap:7px;}
.qty button{width:30px; height:30px; border-radius:50%; border:1px solid var(--border); background:#fff; font-size:16px; cursor:pointer;}
.total{display:flex; justify-content:space-between; font-size:16px; font-weight:700; padding:14px 0 4px;}
.btn-wa{display:block; width:100%; border:none; cursor:pointer; text-align:center; text-decoration:none; background:var(--wa); color:#fff; border-radius:12px; padding:14px 0; font-size:15px; font-weight:700; margin-top:12px;}
.btn-wa:disabled{opacity:0.6;}
.loja .seg button.on{border-color:var(--loja); color:var(--text); background:#fff; box-shadow:inset 0 0 0 1px var(--loja);}
.folha-fundo{position:fixed; inset:0; background:rgba(0,0,0,0.45); z-index:60; display:flex; align-items:flex-end; justify-content:center;}
.folha{background:#fff; width:100%; max-width:620px; max-height:88vh; overflow-y:auto; border-radius:18px 18px 0 0; padding:16px 16px calc(18px + env(safe-area-inset-bottom));}
.folha h3{font-size:13px; margin:16px 0 8px; color:var(--muted); text-transform:uppercase; letter-spacing:0.04em;}
.bolinha{width:14px; height:14px; border-radius:50%; display:inline-block; vertical-align:-2px; margin-right:5px; border:1px solid rgba(0,0,0,0.15);}
.det{position:fixed; inset:0; z-index:50; background:#FAFAF8; overflow-y:auto;}
.det-in{max-width:620px; margin:0 auto; padding-bottom:110px;}
.det-foto{position:relative; background:#EFEDE7; aspect-ratio:1/1; overflow:hidden; display:flex; align-items:center; justify-content:center; font-size:40px; font-weight:700; color:#A8A59B;}
.visual-det .det-foto{aspect-ratio:3/4;}
.det-foto img{width:100%; height:100%; object-fit:cover; transition:transform 0.18s; cursor:zoom-in;}
.det-foto.zoom img{transform:scale(2.4); cursor:zoom-out; transition:none;}
.det-fechar{position:absolute; top:12px; left:12px; z-index:2; width:38px; height:38px; border-radius:50%; border:none; background:rgba(255,255,255,0.92); font-size:18px; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,0.2);}
.det-dica{position:absolute; bottom:10px; right:10px; background:rgba(0,0,0,0.55); color:#fff; font-size:11px; padding:4px 8px; border-radius:10px;}
.det-corpo{padding:16px;}
.det-acao{position:fixed; left:0; right:0; bottom:0; background:#fff; border-top:1px solid var(--border); padding:10px 14px calc(10px + env(safe-area-inset-bottom)); z-index:51;}
.det-acao > div{max-width:592px; margin:0 auto; display:flex; gap:10px; align-items:center;}
.opc{padding:9px 13px; border-radius:10px; border:1.5px solid var(--border); background:#fff; font-size:13.5px; cursor:pointer; color:var(--text);}
.opc.on{border-color:var(--loja); box-shadow:inset 0 0 0 1px var(--loja); font-weight:600;}
.opc:disabled{opacity:0.35; text-decoration:line-through; cursor:not-allowed;}
.rodape{text-align:center; font-size:11px; color:var(--muted); padding:22px 16px 8px;}
.pausada{max-width:420px; margin:0 auto; text-align:center; padding:90px 24px;}
