/* ===== Landing de catálogo ===== */
.cat-nav-cart{position:relative;display:inline-flex;align-items:center;gap:.5rem;border:0;cursor:pointer;background:var(--pink-d);color:#fff;padding:.5rem 1.1rem;border-radius:99px;font-family:var(--f-head);font-size:.95rem;box-shadow:0 8px 18px -8px rgba(238,141,166,.9);transition:transform .25s}
.cat-nav-cart:hover{transform:translateY(-2px) scale(1.04)}
.cat-nav-cart svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cat-count{display:grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:99px;background:#fff;color:var(--pink-d);font-weight:800;font-size:.8rem}
.cat-count.bump{animation:bump .4s}
@keyframes bump{40%{transform:scale(1.5)}}

.cat-hero{padding:7rem 0 2rem}
.cat-banner{position:relative;border-radius:40px;overflow:hidden;min-height:340px;display:flex;align-items:flex-end;background:var(--c) center/cover;box-shadow:var(--shadow);border:6px solid #fff}
.cat-banner::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(60,30,40,.78),rgba(60,30,40,.25) 70%,rgba(60,30,40,.05))}
.cat-banner-in{position:relative;padding:2.4rem clamp(1.4rem,4vw,3rem);color:#fff;max-width:640px}
.crumbs{font-size:.92rem;font-weight:700;opacity:.9;margin-bottom:.8rem}
.crumbs a{text-decoration:underline;text-underline-offset:3px}
.cat-banner h1{color:#fff;font-size:clamp(2.4rem,6vw,4rem);margin:.5rem 0 .7rem;text-shadow:0 3px 14px rgba(0,0,0,.3)}
.cat-banner p{font-size:1.1rem;font-weight:600;text-shadow:0 1px 8px rgba(0,0,0,.4)}
.cat-meta{display:inline-block;margin-top:1rem;background:rgba(255,255,255,.92);color:var(--ink);padding:.3rem 1rem;border-radius:99px;font-family:var(--f-head);font-size:.95rem}

.cat-note{max-width:760px;margin:1.6rem auto 0;text-align:center;background:rgba(255,255,255,.85);border:2px dashed var(--pink);border-radius:22px;padding:.9rem 1.3rem;font-weight:600;color:var(--ink-soft)}

.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1.6rem;margin-top:2.5rem}
.prod{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:0 12px 34px -18px rgba(120,70,80,.55);display:flex;flex-direction:column;transition:transform .4s,box-shadow .4s}
.prod:hover{transform:translateY(-8px) rotate(-.6deg);box-shadow:var(--shadow)}
.prod-img{aspect-ratio:1/1;overflow:hidden;background:var(--c)}
.prod-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.prod:hover .prod-img img{transform:scale(1.08)}
.prod-body{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.prod h3{font-size:1.3rem}
.prod p{color:var(--ink-soft);font-size:.95rem;line-height:1.5;flex:1}
.prod select{width:100%;padding:.6rem .9rem;border-radius:14px;border:2px solid var(--pink);background:var(--cream);font-family:var(--f-body);font-weight:700;color:var(--ink)}
.prod-row{display:flex;gap:.6rem;align-items:center;margin-top:.3rem}
.qty{display:flex;align-items:center;border:2px solid var(--pink);border-radius:99px;overflow:hidden;background:var(--cream)}
.qty button{width:34px;height:38px;border:0;background:none;cursor:pointer;font-size:1.2rem;color:var(--ink);font-weight:800}
.qty button:hover{background:var(--pink)}
.qty span{min-width:26px;text-align:center;font-weight:800}
.add{flex:1;border:0;cursor:pointer;padding:.7rem 1rem;border-radius:99px;background:var(--pink-d);color:#fff;font-family:var(--f-head);font-size:1rem;transition:transform .25s,background .25s}
.add:hover{transform:scale(1.04)}
.add.done{background:var(--mint-d)}

/* Otras secciones */
.others{padding:clamp(3.5rem,7vw,6rem) 0}
.others-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.4rem}
.other{position:relative;aspect-ratio:4/3;border-radius:var(--r);overflow:hidden;background:var(--c) center/cover;box-shadow:var(--shadow);display:flex;align-items:flex-end;color:#fff;transition:transform .4s}
.other::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(60,30,40,0) 30%,rgba(60,30,40,.78))}
.other:hover{transform:translateY(-8px) scale(1.02)}
.other-in{position:relative;padding:1.2rem 1.4rem}
.other h3{color:#fff;font-size:1.6rem;text-shadow:0 2px 8px rgba(0,0,0,.4)}
.other span{font-weight:700;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.other b{display:inline-block;margin-top:.5rem;background:#fff;color:var(--ink);padding:.3rem 1rem;border-radius:99px;font-family:var(--f-head);font-weight:500;font-size:.95rem}

/* Carrito */
.drawer-bg{position:fixed;inset:0;z-index:1300;background:rgba(90,64,72,.45);opacity:0;pointer-events:none;transition:opacity .35s}
.drawer-bg.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:1310;width:min(440px,100%);background:var(--cream);transform:translateX(105%);transition:transform .45s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;box-shadow:-20px 0 50px -20px rgba(0,0,0,.35)}
.drawer.open{transform:none}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:1.2rem 1.4rem;background:var(--pink)}
.drawer-head h2{font-size:1.5rem}
.drawer-x{border:0;background:#fff;width:40px;height:40px;border-radius:50%;font-size:1.3rem;cursor:pointer;color:var(--ink)}
.drawer-list{flex:1;overflow:auto;padding:1rem 1.2rem;display:grid;gap:.8rem;align-content:start}
.line{display:grid;grid-template-columns:64px 1fr auto;gap:.8rem;align-items:center;background:#fff;border-radius:18px;padding:.6rem}
.line img{width:64px;height:64px;border-radius:14px;object-fit:cover}
.line h4{font-size:1rem;line-height:1.2}
.line small{color:var(--ink-soft);font-weight:700}
.line .qty{transform:scale(.85);transform-origin:left}
.line-x{border:0;background:none;cursor:pointer;color:var(--ink-soft);font-size:1.1rem}
.drawer-empty{text-align:center;color:var(--ink-soft);padding:3rem 1rem}
.drawer-foot{padding:1rem 1.3rem 1.4rem;background:#fff;display:grid;gap:.6rem;border-radius:26px 26px 0 0;box-shadow:0 -10px 30px -18px rgba(0,0,0,.3)}
.drawer-foot input,.drawer-foot textarea{width:100%;padding:.7rem .9rem;border-radius:14px;border:2px solid var(--pink);font-family:var(--f-body);font-size:.95rem;background:var(--cream);color:var(--ink);resize:none}
.drawer-foot .btn{justify-content:center}
.drawer-total{display:flex;justify-content:space-between;font-family:var(--f-head);font-size:1.1rem}
.link-clear{border:0;background:none;color:var(--ink-soft);text-decoration:underline;cursor:pointer;font-weight:700}
.toast{position:fixed;left:50%;bottom:26px;z-index:1400;transform:translate(-50%,120px);background:var(--ink);color:#fff;padding:.7rem 1.4rem;border-radius:99px;font-weight:700;transition:transform .4s;max-width:90vw}
.toast.show{transform:translate(-50%,0)}

@media (max-width:900px){
  .cat-hero{padding-top:6.2rem}
  .nav-cart-wrap{order:2;margin-left:auto;margin-right:.4rem}
}

/* Carrito flotante (sobre el botón de WhatsApp) */
.cart-float{position:fixed;right:20px;bottom:94px;z-index:1000;width:62px;height:62px;border:0;cursor:pointer;border-radius:50%;background:var(--pink-d);display:grid;place-items:center;box-shadow:0 10px 26px -6px rgba(238,141,166,.9);transition:transform .3s}
.cart-float svg{width:30px;height:30px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cart-float .cat-count{position:absolute;top:-4px;right:-4px;border:3px solid var(--cream)}
.cart-float:hover{transform:scale(1.12) rotate(6deg)}