*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --laranja:#F3741F; --laranja-escuro:#D85E10; --preto:#1A1A1A; --cinza:#6B6B6B;
  --cinza-claro:#F4F4F4; --branco:#fff; --whats:#25D366;
  --sombra:0 8px 24px rgba(0,0,0,.08); --raio:14px; --container:1180px;
}
html{scroll-behavior:smooth}
body{font-family:'Montserrat',system-ui,sans-serif;color:var(--preto);background:#fafafa;line-height:1.5}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
button{font-family:inherit;cursor:pointer}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 20px}

/* HEADER */
.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);backdrop-filter:blur(8px);box-shadow:0 2px 12px rgba(0,0,0,.06)}
.header__inner{display:flex;align-items:center;justify-content:space-between;height:70px}
.header__actions{display:flex;align-items:center;gap:14px}
.voltar-site{font-weight:700;font-size:.88rem;color:var(--preto);white-space:nowrap}
.voltar-site:hover{color:var(--laranja)}
.brand__logo{height:42px;width:auto}
.cart-btn{position:relative;display:inline-flex;align-items:center;gap:8px;background:var(--laranja);color:#fff;border:none;border-radius:50px;padding:11px 20px;font-weight:700;font-size:.95rem;box-shadow:0 6px 16px rgba(243,116,31,.35);transition:background .2s,transform .2s}
.cart-btn:hover{background:var(--laranja-escuro);transform:translateY(-1px)}
.cart-btn__count{background:#fff;color:var(--laranja);border-radius:50px;min-width:22px;height:22px;display:grid;place-items:center;font-size:.8rem;font-weight:800;padding:0 6px}

/* HERO */
.cat-hero{background:linear-gradient(135deg,var(--laranja),var(--laranja-escuro));color:#fff;padding:48px 0}
.cat-hero h1{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:900}
.cat-hero p{margin-top:8px;opacity:.95;max-width:640px}

/* CONTROLES */
.controls{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin:28px 0 8px}
.search{flex:1;min-width:240px;display:flex;align-items:center;gap:10px;background:#fff;border:1.5px solid #e3e3e3;border-radius:50px;padding:10px 18px}
.search input{border:none;outline:none;width:100%;font-size:.95rem;font-family:inherit;background:transparent}
.filtros{display:flex;gap:8px;flex-wrap:wrap}
.chip{background:#fff;border:1.5px solid #e3e3e3;border-radius:50px;padding:9px 16px;font-weight:600;font-size:.85rem;color:var(--cinza);transition:.2s}
.chip:hover{border-color:var(--laranja);color:var(--laranja)}
.chip.is-active{background:var(--laranja);border-color:var(--laranja);color:#fff}
.sel{background:#fff;border:1.5px solid #e3e3e3;border-radius:50px;padding:10px 16px;font-family:inherit;font-weight:600;font-size:.85rem;color:var(--preto);cursor:pointer}
.filtros-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:14px}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.result-count{color:var(--cinza);font-size:.88rem;margin:14px 0 18px}
.card__cat{font-size:.68rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--laranja)}
.load-more-wrap{text-align:center;padding:10px 0 70px}
.load-more{background:#fff;border:2px solid var(--laranja);color:var(--laranja);font-weight:800;padding:14px 36px;border-radius:50px;font-size:.95rem;transition:.2s}
.load-more:hover{background:var(--laranja);color:#fff}

/* GRADE */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;padding-bottom:60px}
.card{background:#fff;border:1px solid #eee;border-radius:var(--raio);overflow:hidden;box-shadow:var(--sombra);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
.card__imgwrap{position:relative;background:#fff;padding:14px;cursor:pointer}
.card__img{width:100%;height:190px;object-fit:contain}
.card__marca{position:absolute;top:10px;left:10px;background:var(--laranja);color:#fff;font-size:.68rem;font-weight:800;letter-spacing:1px;padding:3px 9px;border-radius:50px}
.card__estoque{position:absolute;top:10px;right:10px;font-size:.66rem;font-weight:700;padding:3px 9px;border-radius:50px}
.card__estoque.in{background:#e7f7ee;color:#1a9e57}
.card__estoque.out{background:#f0f0f0;color:#888}
.card__body{padding:6px 16px 16px;display:flex;flex-direction:column;flex:1}
.card__nome{font-size:1rem;font-weight:800;color:var(--preto);min-height:2.6em;cursor:pointer}
.card__specs{list-style:none;margin:10px 0;display:flex;flex-direction:column;gap:3px}
.card__specs li{font-size:.8rem;color:var(--cinza)}
.card__specs b{color:var(--preto)}
.card__btns{display:flex;gap:8px;margin-top:auto;padding-top:12px}
.card__add{flex:1;background:var(--laranja);color:#fff;border:none;border-radius:10px;padding:11px;font-weight:700;font-size:.85rem;transition:background .2s}
.card__add:hover{background:var(--laranja-escuro)}
.card__add.added{background:var(--whats)}
.card__det{background:#fff;border:1.5px solid #e3e3e3;border-radius:10px;padding:11px 14px;font-weight:700;font-size:.85rem;color:var(--preto)}
.card__det:hover{border-color:var(--laranja);color:var(--laranja)}
.vazio{text-align:center;color:var(--cinza);padding:50px 0;font-size:1.1rem}

/* MODAL */
.modal,.cart{position:fixed;inset:0;z-index:100}
.modal__overlay,.cart__overlay{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.modal__box{position:relative;max-width:760px;margin:5vh auto;background:#fff;border-radius:18px;max-height:90vh;overflow:auto;box-shadow:0 30px 80px rgba(0,0,0,.4)}
.modal__close{position:absolute;top:14px;right:14px;background:#f0f0f0;border:none;width:38px;height:38px;border-radius:50%;font-size:1rem;z-index:2}
.modal__content{display:grid;grid-template-columns:1fr 1fr;gap:0}
.modal__img{background:#fff;padding:30px;display:grid;place-items:center}
.modal__img img{max-height:340px;object-fit:contain}
.modal__info{padding:30px 30px 30px 0}
.modal__marca{color:var(--laranja);font-weight:800;letter-spacing:1px;font-size:.8rem}
.modal__nome{font-size:1.5rem;font-weight:900;margin:6px 0 10px}
.modal__desc{color:var(--cinza);font-size:.9rem;margin-bottom:16px}
.modal__preco{font-size:1.8rem;font-weight:900;color:var(--laranja);margin-bottom:16px}
.spec-table{width:100%;border-collapse:collapse;margin-bottom:18px}
.spec-table th,.spec-table td{text-align:left;padding:7px 0;border-bottom:1px solid #eee;font-size:.85rem}
.spec-table th{color:var(--cinza);font-weight:600;width:45%}
.spec-table td{font-weight:700}
.modal__add{width:100%;background:var(--laranja);color:#fff;border:none;border-radius:12px;padding:14px;font-weight:800;font-size:.95rem}
.modal__add:hover{background:var(--laranja-escuro)}

/* CART DRAWER */
.cart__panel{position:absolute;top:0;right:0;height:100%;width:92%;max-width:420px;background:#fff;display:flex;flex-direction:column;box-shadow:-10px 0 40px rgba(0,0,0,.25);animation:slide .25s ease}
@keyframes slide{from{transform:translateX(100%)}to{transform:none}}
.cart__head{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #eee}
.cart__head h2{font-size:1.2rem}
.cart__close{background:#f0f0f0;border:none;width:34px;height:34px;border-radius:50%}
.cart__items{flex:1;overflow:auto;padding:14px 20px}
.cart__empty{text-align:center;color:var(--cinza);padding:40px 0}
.ci{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid #f0f0f0}
.ci__img{width:60px;height:60px;object-fit:contain;background:#fafafa;border-radius:8px}
.ci__info{flex:1;min-width:0}
.ci__nome{font-size:.85rem;font-weight:700}
.ci__preco{color:var(--laranja);font-weight:800;font-size:.9rem}
.ci__qty{display:flex;align-items:center;gap:8px;margin-top:6px}
.ci__qty button{width:26px;height:26px;border:1.5px solid #ddd;background:#fff;border-radius:7px;font-weight:800;line-height:1}
.ci__rm{background:none;border:none;color:#c00;font-size:.78rem;margin-top:4px}
.cart__foot{border-top:1px solid #eee;padding:18px 20px}
.cart__unidade{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.cart__unidade select{flex:1;padding:9px 12px;border:1.5px solid #ddd;border-radius:9px;font-family:inherit;font-weight:600}
.cart__total{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:1.05rem}
.cart__total strong{color:var(--laranja);font-size:1.3rem}
.btn-whats{width:100%;background:var(--whats);color:#fff;border:none;border-radius:12px;padding:15px;font-weight:800;font-size:1rem}
.btn-whats:hover{filter:brightness(.95)}
.btn-whats:disabled{background:#bbb;cursor:not-allowed}
.cart__obs{font-size:.72rem;color:var(--cinza);text-align:center;margin-top:10px}

/* FOOTER */
.cat-footer{background:var(--preto);color:#bbb;padding:34px 0;text-align:center;margin-top:20px}
.cat-footer__logo{height:46px;margin:0 auto 12px}
.cat-footer p{font-size:.85rem}

/* RESPONSIVO */
@media(max-width:1000px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){
  .grid{grid-template-columns:repeat(2,1fr);gap:14px}
  .modal__content{grid-template-columns:1fr}
  .modal__img{padding:20px}
  .modal__info{padding:0 24px 24px}
  .card__btns{flex-direction:column}
}
@media(max-width:430px){.grid{grid-template-columns:1fr 1fr}.card__img{height:140px}.cat-hero{padding:34px 0}}
@media(max-width:520px){
  .voltar-site{font-size:0;}
  .voltar-site::before{content:"←";font-size:1.2rem;font-weight:800}
  .cart-btn span:not(.cart-btn__count){display:none}
  .brand__logo{height:34px}
}