/* Estilos de tienda (del prototipo tienda.html) */
.shop{display:grid;grid-template-columns:260px minmax(0,1fr);gap:48px;padding-top:36px;padding-bottom:110px}
.filters{position:sticky;top:100px;align-self:start;max-height:calc(100vh - 120px);overflow-y:auto;padding-right:6px}
.fgroup{border-top:1px solid var(--linea);padding:18px 0}
.fgroup:first-child{border-top:0;padding-top:0}
.fgroup h3{font-family:Jost;font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#9a9a9a;margin-bottom:12px}
.opt{display:grid;grid-template-columns:18px 1fr auto;gap:10px;align-items:start;padding:7px 0;cursor:pointer;font-size:15px}
.opt input{accent-color:var(--rojo);width:16px;height:16px;margin-top:3px}
.opt small{display:block;color:var(--texto-2);font-size:13px;line-height:1.35}
.opt .n{color:#6b6b6b;font-size:13px;font-variant-numeric:tabular-nums;margin-top:2px}
.opt .dot{display:inline-block;margin-right:6px;vertical-align:1px}
.sub{padding-left:28px}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.toolbar .count{color:var(--texto-2);font-size:15px}
.toolbar .count b{color:#fff;font-weight:500}
.active{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.active button{font:14px Jost;background:#151515;color:#fff;border:1px solid #333;border-radius:16px;padding:5px 10px 5px 12px;cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.active button::after{content:"×";color:#999;font-size:16px;line-height:1}
.active .clear{background:none;border:0;color:var(--texto-2);text-decoration:underline;padding:5px 0}
.active .clear::after{content:none}
select.sort{background:#111;color:#fff;border:1px solid var(--linea);border-radius:var(--radio);font:15px Jost;padding:9px 12px}
.ph .lead .hint{font-size:14px;margin-top:10px}
.ph .lead .hint a{color:var(--blanco);text-decoration:none;border-bottom:1px solid var(--rojo)}
.fbtn{display:none}
.grp + .grp{margin-top:64px}
.grph{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;border-bottom:2px solid #fff;padding-bottom:12px;margin-bottom:24px;flex-wrap:wrap}
.grph h2{font-size:37.4px;display:flex;align-items:center;gap:12px}
.grph h2 .dot{width:11px;height:11px}
.grph h2 span{font-family:Jost;font-size:15px;color:#888;letter-spacing:0;margin-left:4px}
.grph p{color:var(--texto-2);font-size:15px;max-width:48ch}
.empty{color:var(--texto-2);padding:40px 0}
@media (max-width:960px){
  .shop{grid-template-columns:1fr;gap:0;padding-top:16px}
  .filters{position:fixed;inset:auto 0 0 0;top:auto;max-height:82vh;background:#0b0b0b;border-top:1px solid #333;border-radius:14px 14px 0 0;padding:22px 16px 90px;z-index:45;transform:translateY(105%);transition:transform .3s cubic-bezier(.2,.7,.2,1)}
  .filters.open{transform:none}
  .fclose{position:sticky;bottom:0}
  .fbtn{display:inline-flex}
  .toolbar{position:sticky;top:64px;background:#000;z-index:20;padding:10px 0;margin:0 -16px 18px;padding-left:16px;padding-right:16px;border-bottom:1px solid var(--linea)}
}
@media (min-width:641px) and (max-width:960px){
  .toolbar{margin:0 -32px 18px;padding-left:32px;padding-right:32px}
}