/* BR Saludable — catálogo navegable (/catalogo, /catalogo/{categoría}, /producto/{producto}).
   Usa las variables y componentes de sitio.css (btn, eyebrow, cat-card, buscador). Mobile-first. */

.cg-pagina{padding:104px 0 88px;min-height:72vh;}
@media(min-width:760px){.cg-pagina{padding:128px 0 100px;}}

/* Migas */
.migas ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;font-size:.8rem;color:var(--texto-suave);margin-bottom:22px;}
.migas li{display:flex;align-items:center;gap:6px;min-width:0;}
.migas li+li::before{content:'/';color:var(--crema-3);font-weight:700;}
.migas a{color:var(--verde-700);font-weight:600;}
.migas a:hover{text-decoration:underline;}
.migas [aria-current]{color:var(--texto-suave);max-width:46ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* Cabecera */
.cg-head{display:flex;gap:18px;align-items:flex-start;margin-bottom:26px;}
.cg-head h1{font-size:clamp(1.9rem,6vw,3rem);letter-spacing:-.01em;margin-bottom:8px;}
.cg-head .eyebrow{margin-bottom:8px;}
.cg-sub{color:var(--texto-suave);font-size:.98rem;max-width:620px;}
.cg-ic{flex-shrink:0;width:64px;height:64px;border-radius:20px;background:var(--blanco);border:1px solid var(--crema-3);
  display:flex;align-items:center;justify-content:center;font-size:2rem;box-shadow:0 14px 30px -18px rgba(47,74,43,.35);}
@media(min-width:760px){.cg-ic{width:84px;height:84px;font-size:2.6rem;border-radius:24px;}}

/* Buscador (en el catálogo vive en flujo normal) */
.cg-pagina .buscador{margin:0 0 18px;max-width:640px;display:flex;align-items:center;}

/* Chips de categorías: una fila con scroll horizontal en celular */
.chips{margin:0 -20px 26px;position:relative;}
.chips ul{list-style:none;display:flex;gap:8px;overflow-x:auto;padding:4px 20px 12px;scrollbar-width:thin;
  scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;}
.chips li{flex-shrink:0;scroll-snap-align:start;}
.chip{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:9px 16px;border-radius:40px;
  background:var(--blanco);border:1px solid var(--crema-3);font-size:.86rem;font-weight:600;color:var(--verde-900);
  white-space:nowrap;transition:background .3s var(--ease),border-color .3s,color .3s;}
.chip:hover{border-color:var(--verde-600);}
.chip.activo{background:var(--verde-800);border-color:var(--verde-800);color:var(--crema);}
@media(min-width:760px){.chips{margin:0 0 30px;}.chips ul{flex-wrap:wrap;overflow:visible;padding:0;}}

/* Barra de filtro y orden dentro de la categoría */
.cg-barra{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:18px;}
.cg-filtro{position:relative;flex:1 1 240px;}
.cg-filtro svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--texto-suave);}
.cg-filtro input{width:100%;font:inherit;font-size:.95rem;padding:12px 14px 12px 42px;border-radius:14px;
  border:1.5px solid var(--crema-3);background:var(--blanco);color:var(--texto);}
.cg-filtro input:focus,.cg-orden select:focus{outline:none;border-color:var(--verde-600);box-shadow:0 0 0 4px rgba(79,122,67,.14);}
.cg-orden{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--texto-suave);font-weight:600;}
.cg-orden select{font:inherit;font-size:.92rem;padding:11px 12px;border-radius:14px;border:1.5px solid var(--crema-3);
  background:var(--blanco);color:var(--verde-900);min-height:46px;}
.cg-contador{font-size:.85rem;color:var(--texto-suave);margin:-6px 0 14px;}
.cg-contador[hidden],.cg-vacio[hidden]{display:none;}
.cg-vacio{padding:26px 0;color:var(--texto-suave);}
.cg-vacio a{color:var(--verde-700);font-weight:700;text-decoration:underline;}

/* Grilla de productos */
.pc-grilla{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
@media(min-width:640px){.pc-grilla{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}}
@media(min-width:1020px){.pc-grilla{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;}}
.pc{background:var(--blanco);border:1px solid var(--crema-3);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s;}
.pc[hidden]{display:none;}
@media(hover:hover){.pc:hover{transform:translateY(-4px);box-shadow:0 24px 40px -24px rgba(47,74,43,.38);border-color:var(--verde-600);}}
.pc-media{position:relative;display:block;aspect-ratio:3/4;background:var(--crema-2);overflow:hidden;}
.pc-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease);}
@media(hover:hover){.pc:hover .pc-media img{transform:scale(1.04);}}
.pc-tag{position:absolute;top:10px;left:10px;background:var(--dorado);color:var(--verde-900);font-size:.68rem;font-weight:800;
  letter-spacing:.05em;text-transform:uppercase;padding:5px 10px;border-radius:40px;}
.pc-tag-agotado{background:var(--verde-900);color:var(--crema);}
.pc-agotado .pc-media{filter:grayscale(.5);opacity:.8;}
.pc-body{padding:12px 12px 14px;display:flex;flex-direction:column;gap:6px;flex:1;}
@media(min-width:640px){.pc-body{padding:16px 16px 18px;}}
.pc-cat{font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--dorado);}
.pc-nombre{font-family:var(--cm-text);font-size:.9rem;font-weight:600;line-height:1.3;color:var(--verde-900);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
@media(min-width:640px){.pc-nombre{font-size:.96rem;}}
.pc-nombre a:hover{color:var(--verde-600);}
.pc-pie{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding-top:6px;}
.pc-precio{font-family:var(--cm-display);font-weight:500;font-weight:700;font-size:1.12rem;color:var(--verde-800);}
.pc-confirmar{font-size:.76rem;color:var(--texto-suave);font-weight:600;}
.pc-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 14px;border-radius:40px;
  border:0;cursor:pointer;font:inherit;font-size:.8rem;font-weight:700;background:var(--verde-700);color:var(--blanco);
  transition:background .3s var(--ease),transform .3s var(--ease);}
.pc-btn svg{width:16px;height:16px;}
.pc-btn:hover{background:var(--verde-800);}
.pc-btn:active{transform:scale(.96);}
.pc-btn.ok{background:var(--dorado);color:var(--verde-900);}
.pc-btn-ghost{background:transparent;color:var(--verde-700);border:1.5px solid var(--verde-700);}
.pc-btn-ghost:hover{background:var(--verde-700);color:var(--blanco);}
.pc-btn:focus-visible,.chip:focus-visible,.qty-btn:focus-visible{outline:2px solid var(--dorado);outline-offset:2px;}
@media(max-width:400px){.pc-pie{flex-direction:column;align-items:stretch;}.pc-btn{width:100%;}}

/* Sin foto: hoja de la marca + ícono de la categoría (nunca una imagen rota) */
.ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(120% 90% at 30% 20%,var(--blanco) 0%,var(--crema-2) 55%,var(--crema-3) 100%);}
.ph-hoja{position:absolute;width:74%;height:74%;opacity:.13;transform:rotate(-18deg);}
.ph-hoja path{fill:var(--verde-700);}
.ph-hoja .ph-vena{fill:none;stroke:var(--crema);stroke-width:2;}
.ph-ic{position:relative;font-size:clamp(2.2rem,9vw,3.2rem);filter:saturate(.85);}

/* Volver / acciones al pie */
.cg-volver{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px;}
@media(max-width:560px){.cg-volver .btn{width:100%;justify-content:center;}}
.cg-sin-resultados{background:var(--blanco);border:1px solid var(--crema-3);border-radius:var(--radius);padding:34px 24px;
  display:flex;flex-direction:column;align-items:flex-start;gap:12px;}
.cg-sin-titulo{font-family:var(--cm-display);font-weight:500;font-size:1.4rem;color:var(--verde-900);font-weight:600;}
.cg-sin-resultados p{color:var(--texto-suave);}
.cg-cats{margin-top:6px;}

/* Ficha de producto */
.ficha{display:grid;grid-template-columns:1fr;gap:24px;align-items:start;}
@media(min-width:860px){.ficha{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;}}
.ficha-media{position:relative;aspect-ratio:3/4;border-radius:24px;overflow:hidden;background:var(--crema-2);
  border:6px solid var(--blanco);box-shadow:0 34px 60px -34px rgba(36,58,31,.45);}
.ficha-media img{width:100%;height:100%;object-fit:cover;}
.ficha-media .ph-ic{font-size:clamp(4rem,18vw,7rem);}
.ficha-info{display:flex;flex-direction:column;gap:14px;}
.ficha-cat{align-self:flex-start;font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--dorado);}
.ficha-cat:hover{text-decoration:underline;}
.ficha-info h1{font-size:clamp(1.8rem,5.4vw,2.8rem);letter-spacing:-.01em;}
.ficha-desc{color:var(--texto-suave);font-size:1.02rem;}
.ficha-precio strong{font-family:var(--cm-display);font-weight:500;font-size:2.2rem;color:var(--verde-800);}
.ficha-confirmar{font-family:var(--cm-display);font-weight:500;font-size:1.5rem;color:var(--verde-800);font-weight:600;}
.ficha-nota{color:var(--texto-suave);font-size:.9rem;margin-top:4px;}
.ficha-stock{font-size:.85rem;font-weight:700;color:var(--coral);}
.ficha-agotado{font-weight:700;color:var(--coral);}
.ficha-compra{display:flex;flex-wrap:wrap;gap:12px;align-items:center;}
.ficha-agregar{flex:1 1 220px;justify-content:center;}
.ficha-ver-carrito{font-size:.88rem;font-weight:700;color:var(--verde-700);align-self:flex-start;}
.ficha-ver-carrito:hover{text-decoration:underline;}
.qty{display:flex;align-items:center;gap:2px;background:var(--blanco);border:1.5px solid var(--crema-3);border-radius:40px;padding:4px;}
.qty-btn{width:44px;height:44px;border-radius:50%;border:0;background:transparent;color:var(--verde-800);font-size:1.3rem;cursor:pointer;}
.qty-btn:hover{background:var(--crema-2);}
.ficha-num{width:44px;text-align:center;border:0;background:transparent;font:inherit;font-weight:700;font-size:1.05rem;color:var(--verde-900);
  -moz-appearance:textfield;appearance:textfield;}
.ficha-num::-webkit-outer-spin-button,.ficha-num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.ficha-num:focus{outline:2px solid var(--dorado);border-radius:8px;}
.ficha-datos{list-style:none;display:flex;flex-direction:column;gap:10px;margin-top:8px;padding-top:18px;border-top:1px solid var(--crema-3);
  font-size:.92rem;color:var(--texto-suave);}
.ficha-datos a{color:var(--verde-700);font-weight:600;text-decoration:underline;}

.relacionados{margin-top:64px;}
.rel-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:18px;}
.rel-head h2{font-size:clamp(1.4rem,4vw,2rem);}
.rel-head a{font-weight:700;color:var(--verde-700);font-size:.9rem;}

@media(prefers-reduced-motion:reduce){
  .pc,.pc-media img,.pc-btn,.chip{transition:none;}
  .pc:hover,.pc:hover .pc-media img{transform:none;}
}
@media(max-width:559px){.cg-ic{width:52px;height:52px;font-size:1.6rem;border-radius:16px;}.cg-head{gap:14px;}}

/* ===== Marketplace (14/10): una grilla, categorías como filtro múltiple ===== */
.mk-controles{position:relative;}
.chip-n{font-size:.72rem;font-weight:700;opacity:.62;margin-left:2px;}
.chip.activo .chip-n{opacity:.85;}
.mk-contador{flex:1;min-width:200px;font-size:.92rem;font-weight:600;color:var(--verde-900);margin:0;}
.mk-limpiar{font-size:.85rem;font-weight:700;color:var(--verde-700);text-decoration:underline;text-underline-offset:3px;}
.mk-limpiar[hidden]{display:none;}
.mk-mas{display:flex;justify-content:center;margin:30px 0 10px;}
.mk-mas .btn[hidden]{display:none;}
.pc[hidden]{display:none;}
/* Imagen ILUSTRATIVA de categoría: siempre rotulada (arriba a la derecha: en las fotos la mitad
   superior es pared lisa y no tapa el producto; a la izquierda van Sin stock/Destacado). */
.pc-media img.ilustrativa{filter:saturate(.92);}
.pc-ilus,.ficha-media .pc-ilus{
  position:absolute;right:8px;top:8px;z-index:1;pointer-events:none;
  background:rgba(36,58,31,.78);color:var(--crema);font-size:.62rem;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;padding:4px 8px;border-radius:20px;backdrop-filter:blur(2px);
}
.ficha-media{position:relative;}
.ficha-media .pc-ilus{font-size:.72rem;right:14px;top:14px;padding:6px 11px;}

/* Layout marketplace: celular = buscador, fila de chips deslizable, grilla.
   Escritorio = barra lateral fija con las categorías + buscador y grilla a la derecha. */
.mk-lado-titulo{display:none;}
@media(min-width:1024px){
  .mk{display:grid;grid-template-columns:268px minmax(0,1fr);grid-template-areas:"lado buscar" "lado main";column-gap:36px;align-items:start;}
  .mk-buscar{grid-area:buscar;}
  .mk-lado{grid-area:lado;position:sticky;top:96px;max-height:calc(100vh - 120px);overflow-y:auto;
    padding:4px 6px 12px 0;scrollbar-width:thin;}
  .mk-main{grid-area:main;min-width:0;}
  .mk-lado-titulo{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dorado);
    font-weight:700;margin:6px 0 12px;}
  .mk-lado .chips{margin:0;}
  .mk-lado .chips ul{flex-direction:column;overflow:visible;padding:0;gap:6px;}
  .mk-lado .chip{width:100%;justify-content:flex-start;min-height:40px;padding:8px 12px;border-radius:14px;font-size:.86rem;
    white-space:normal;line-height:1.25;text-align:left;}
  .mk-lado .chip > span[aria-hidden]{flex-shrink:0;}
  .mk-lado .chip .chip-n{margin-left:auto;padding-left:8px;flex-shrink:0;}
  .mk-buscar .buscador{margin-top:0;max-width:none;}
}
@media(min-width:760px) and (max-width:1023px){
  .mk .chips ul{flex-wrap:nowrap;overflow-x:auto;padding:4px 0 12px;}
}
.cg-sin-resultados[hidden],.mk [hidden]{display:none !important;}
.ficha-media .tapa{padding:32px}
.ficha-media .tapa-tit{font-size:clamp(1.8rem,4vw,2.8rem)}
.ficha-media .tapa-ecg{width:120px}
.cg-pagina,.pagina-interna{padding-top:calc(var(--cab-alto) + 48px)}