/* Categorías 2026-09: recortes visuales de la lámina original, sin redibujar.
   Fuente 1448 × 1086; ventanas 320 × 320, sin los rótulos incrustados. */
/* hidden crea un contenedor de scroll en body e impide que sticky siga la ventana. */
@supports (overflow: clip) { body { overflow-x: clip; } }

/* Catálogo de productos: la foto debe respirar como una ficha de menú,
   no vivir dentro de una cápsula oscura. */
#ordenar .menu-grid {
  gap: clamp(18px, 2.4vw, 30px);
}
#ordenar {
  background: #fff;
  max-width: none;
}
#ordenar .menu-grid {
  max-width: 1200px;
  margin-inline: auto;
}
#ordenar .menu-card {
  background: #fff;
  color: #171717;
  border: 1px solid #ece9e2;
  border-radius: 22px;
  box-shadow: 0 10px 28px rgba(24, 20, 10, .08);
}
#ordenar .menu-card:hover {
  border-color: rgba(222, 175, 0, .6);
  transform: translateY(-4px);
  box-shadow: 0 18px 38px rgba(24, 20, 10, .13);
}
#ordenar .menu-card-img {
  height: clamp(208px, 21vw, 270px);
  padding: 16px;
  background: #fff;
}
#ordenar .menu-card-img img {
  object-fit: contain;
  object-position: center;
}
#ordenar .menu-card-body { padding: 17px 18px 18px; }
#ordenar .menu-card-name {
  color: #171717;
  font-size: 1.55rem;
  letter-spacing: .7px;
}
#ordenar .menu-card-desc { color: #686868; }
#ordenar .menu-card-footer { border-top: 1px solid #f0eee9; padding-top: 14px; }
#ordenar .menu-card-price { color: #171717; }
#ordenar .menu-card-price span { color: #b48700; }
#ordenar .menu-card-badge { box-shadow: 0 4px 12px rgba(0,0,0,.12); }

/* En móvil se hojean los productos de una familia de izquierda a derecha:
   mantiene el foco en una opción y deja ver la siguiente como pista visual. */
@media (max-width: 1400px), (pointer: coarse), (orientation: portrait) {
  #ordenar .menu-grid { display: block; }
  #ordenar .menu-category.active:not(#cat-promociones) {
    display: flex;
    gap: 13px;
    overflow-x: auto;
    padding: 4px 2px 18px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  #ordenar .menu-category.active:not(#cat-promociones)::-webkit-scrollbar { display: none; }
  #ordenar .menu-category.active:not(#cat-promociones) .menu-card {
    flex: 0 0 min(82vw, 330px);
    scroll-snap-align: start;
  }
  #ordenar .menu-card-img { height: 214px; padding: 12px; }
  #ordenar .menu-card-body { padding: 15px 16px 16px; }
  #ordenar .menu-card-name { font-size: 1.42rem; }
}

/* Fichas compactas de hamburguesas, inspiradas en el patrón de referencia. */
#cat-hamburguesas .menu-card-desc { display: none; }
#cat-refrescos .menu-card-img { background: #fff; }
#cat-refrescos .menu-card-img img { object-fit: contain; padding: 14px; }
#cat-hamburguesas .menu-card-img { height: 184px; padding: 10px; }
#cat-hamburguesas .menu-card-img img { transform: scale(1.42); }
#cat-hamburguesas .menu-card:hover .menu-card-img img { transform: scale(1.5); }
#cat-hamburguesas .menu-card-body { padding: 12px 14px 14px; background: #fff; }
#cat-hamburguesas .menu-card-name { font-size: 1.28rem; }
#cat-hamburguesas .menu-card-footer { margin-top: 10px; padding-top: 10px; }
#cat-hamburguesas .add-btn {
  position: absolute;
  top: 163px;
  right: 16px;
  z-index: 2;
  width: 42px;
  height: 42px;
  padding: 0;
  border-radius: 50%;
  font: 500 1.7rem/1 system-ui, sans-serif;
}
#cat-hamburguesas .add-btn:hover { transform: scale(1.08); }
@media (max-width: 1400px), (pointer: coarse), (orientation: portrait) {
  #cat-hamburguesas.menu-category.active { gap: 10px; }
  #cat-hamburguesas.menu-category.active .menu-card {
    flex-basis: min(47vw, 205px);
    border-radius: 16px;
  }
  #cat-hamburguesas .menu-card-img { height: 132px; padding: 6px; }
  #cat-hamburguesas .menu-card-img img { transform: scale(1.42); }
  #cat-hamburguesas .menu-card-body { padding: 10px 11px 11px; }
  #cat-hamburguesas .menu-card-name { font-size: 1.08rem; }
  #cat-hamburguesas .menu-card-price { font-size: 1.45rem; }
  #cat-hamburguesas .add-btn { top: 112px; right: 11px; width: 36px; height: 36px; font-size: 1.45rem; }
}

/* Composición final tipo catálogo: una ficha dominante y la siguiente asomándose. */
#ordenar {
  position: relative;
  z-index: 1;
  background: #fff;
}
#ordenar .menu-card {
  border: 1px solid rgba(20, 20, 20, .055);
  border-radius: 28px;
  box-shadow: 0 8px 22px rgba(20, 20, 20, .055);
}
#cat-hamburguesas .menu-card-img {
  height: 184px;
  padding: 10px;
}
#cat-hamburguesas .menu-card-img img { transform: scale(1.42); }
#cat-hamburguesas .menu-card:hover .menu-card-img img { transform: scale(1.5); }
#cat-hamburguesas .menu-card-body { padding: 12px 14px 14px; }
#cat-hamburguesas .menu-card-footer {
  margin-top: 7px;
  padding-top: 7px;
  border-top: 0;
}
#cat-hamburguesas .add-btn {
  top: 163px;
  right: 16px;
  background: #fff;
  color: #191919;
  box-shadow: 0 5px 14px rgba(0, 0, 0, .14);
}
#cat-hamburguesas .add-btn:hover { background: #fff; }
@media (max-width: 1400px), (pointer: coarse), (orientation: portrait) {
  #ordenar { padding-inline: 0; }
  #ordenar .menu-grid { padding-inline: 0; }
  #cat-hamburguesas.menu-category.active {
    gap: 12px;
    padding: 7px 0 22px 12px;
  }
  #cat-hamburguesas.menu-category.active .menu-card {
    flex: 0 0 min(82vw, 360px);
    border-radius: 28px;
  }
  #cat-hamburguesas .menu-card-img { height: 132px; padding: 6px; }
  #cat-hamburguesas .menu-card-img img { transform: scale(1.42); }
  #cat-hamburguesas .menu-card-body { padding: 10px 11px 11px; }
  #cat-hamburguesas .menu-card-name { font-size: 1.08rem; }
  #cat-hamburguesas .menu-card-price { color: #707070; font-size: 1.48rem; }
  #cat-hamburguesas .menu-card-price span { color: #888; }
  #cat-hamburguesas .add-btn { top: 112px; right: 11px; }
}
.menu-hub-shell.menu-hub-light {
  background: #fff;
  color: #181818;
  padding: 16px max(16px, calc((100vw - 1180px) / 2));
  border-bottom: 1px solid #e9e9e9;
  box-shadow: 0 3px 12px rgba(0, 0, 0, .04);
}
.menu-hub-light .category-heading {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 0 4px 10px;
  font-family: system-ui, sans-serif;
}
.category-heading strong { font-size: .93rem; font-weight: 750; }
.category-heading > span { font-size: .68rem; color: #707070; }
.menu-hub-light .categories-carousel {
  position: relative;
  gap: 12px;
  padding: 2px 2px 0;
  overscroll-behavior-x: contain;
  scroll-padding-inline: 2px;
}
.menu-hub-light .category-item {
  flex: 1 0 100px;
  min-width: 100px;
  gap: 6px;
  padding: 0 2px 12px;
  color: #181818;
  border-radius: 8px 8px 0 0;
}
.menu-hub-light .category-item::before { display: none; }
.menu-hub-light .category-item::after {
  content: '';
  position: absolute;
  inset: auto 8px 0;
  height: 4px;
  border-radius: 4px 4px 0 0;
  background: transparent;
}
.menu-hub-light .category-item.active::after { background: #f6bf00; }
.menu-hub-light .category-art {
  display: block;
  width: 78px;
  height: 78px;
  flex: 0 0 auto;
  border-radius: 50%;
  background-image: url('../ICONOS/categorias/lamina.webp');
  background-repeat: no-repeat;
  background-size: 452.5% 339.375%;
  background-position: var(--sprite-x) var(--sprite-y);
  pointer-events: none;
}
.art-ofertas      { --sprite-x: 5.496%;  --sprite-y: 24.021%; }
.art-hamburguesas { --sprite-x: 35.018%; --sprite-y: 24.021%; }
.art-hochos       { --sprite-x: 64.716%; --sprite-y: 24.021%; }
.art-alitas       { --sprite-x: 93.972%; --sprite-y: 24.021%; }
.art-boneless     { --sprite-x: 5.496%;  --sprite-y: 77.285%; }
.art-papas        { --sprite-x: 35.018%; --sprite-y: 77.285%; }
.art-snacks       { --sprite-x: 64.716%; --sprite-y: 77.285%; }
.art-bebidas      { --sprite-x: 93.972%; --sprite-y: 77.285%; }
.menu-hub-light .category-item .category-name {
  color: #303030;
  font-family: system-ui, sans-serif;
  font-size: .76rem;
  font-weight: 550;
  text-transform: none;
  letter-spacing: -.2px;
  line-height: 1.25;
  white-space: nowrap;
}
.menu-hub-light .category-item.active .category-name { color: #111; font-weight: 750; }
.menu-hub-light .category-item:focus-visible { outline: 2px solid #171717; outline-offset: -2px; box-shadow: none; }
.subcategory-nav[hidden],
.subcategory-nav-group[hidden] { display: none !important; }
.subcategory-nav {
  margin: 0 0 12px;
  padding: 10px 0 8px;
  border: 0;
  border-radius: 0;
  background: #fff;
  border-top: 1px solid #ededed;
}
.subcategory-nav::before {
  content: 'ELIGE UNA FAMILIA';
  display: block;
  margin: 0 14px 6px;
  color: #777;
  font: 750 .58rem/1 system-ui, sans-serif;
  letter-spacing: 1.2px;
}
.subcategory-nav-group {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 0 14px 2px;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
  scroll-padding-inline: 2px;
}
.subcategory-nav-group::-webkit-scrollbar { display: none; }
.subcategory-chip {
  flex: 0 0 auto;
  min-height: 32px;
  padding: 6px 11px;
  border: 1px solid #e7e7e7;
  border-radius: 9px;
  background: #f7f7f7;
  color: #555;
  font: 650 .7rem/1 system-ui, sans-serif;
  white-space: nowrap;
  cursor: pointer;
}
.subcategory-chip.active {
  border-color: #ffd000;
  background: #ffd600;
  color: #111;
  box-shadow: none;
}
.subcategory-chip:focus-visible { outline: 2px solid #171717; outline-offset: 2px; }

/* En móvil: dos fichas completas y una pista de la siguiente, sin cortar la sombra. */
@media (max-width: 1400px), (pointer: coarse), (orientation: portrait) {
  #cat-hamburguesas.menu-category.active .menu-card {
    flex: 0 0 min(42vw, 205px);
    border-radius: 22px;
  }
  #cat-hamburguesas .menu-card-img {
    height: 176px;
    padding: 7px;
  }
  #cat-hamburguesas .menu-card-img img { transform: scale(1.42); }
  #cat-hamburguesas .menu-card-body { padding: 10px 12px 12px; }
  #cat-hamburguesas .menu-card-name { font-size: 1.08rem; }
  #cat-hamburguesas .menu-card-footer { margin-top: 1px; }
  #cat-hamburguesas .add-btn { top: 155px; right: 10px; }
  #cat-hamburguesas .menu-card-body { padding-left: 24%; }
  #cat-hamburguesas .menu-card:first-child .menu-card-badge { left: 24%; }
}

/* Ajuste fino: Súper Nova y Burger Pizza necesitan más aire en la foto. */
#cat-hamburguesas .menu-card:nth-child(4) .menu-card-img img,
#cat-hamburguesas .menu-card:nth-child(6) .menu-card-img img { transform: scale(1.18); }
#cat-hamburguesas .menu-card-name { line-height: .95; }
#cat-hamburguesas .menu-card-footer { margin-top: 1px; padding-top: 0; }
@media (max-width: 1400px), (pointer: coarse), (orientation: portrait) {
  #cat-hamburguesas .menu-card:nth-child(4) .menu-card-img img,
  #cat-hamburguesas .menu-card:nth-child(6) .menu-card-img img { transform: scale(1.18); }
  #cat-hamburguesas .menu-card-footer { margin-top: 0; padding-top: 0; }
}
.menu-subcategory-title { display: none; }
.menu-grid[data-menu-group="papas"] .menu-subcategory-title,
.menu-grid[data-menu-group="bebidas"] .menu-subcategory-title,
.menu-grid[data-menu-group="search"] .menu-subcategory-title {
  display: block;
  grid-column: 1 / -1;
  margin: 8px 0 0;
  color: var(--yellow);
  font: 700 1.25rem 'Barlow Condensed', sans-serif;
}
@media (max-width: 1400px), (pointer: coarse), (orientation: portrait) {
  .menu-hub-shell.menu-hub-light { padding: 9px 10px 0; }
  .menu-hub-light .category-heading { padding: 0 2px 6px; gap: 8px; }
  .category-heading strong { font-size: .75rem; }
  .category-heading > span { font-size: .6rem; }
  .menu-hub-light .categories-carousel { gap: 6px; }
  .menu-hub-light .category-item { flex: 0 0 94px; min-width: 94px; padding-bottom: 10px; gap: 5px; }
  .menu-hub-light .category-art { width: 64px; height: 64px; }
  .menu-hub-light .category-item .category-name { font-size: .7rem; }
  .menu-hub-shell.has-subcategories .category-heading { display: none; }
  .menu-hub-shell.has-subcategories .category-item { flex-basis: 82px; min-width: 82px; padding-bottom: 7px; }
  .menu-hub-shell.has-subcategories .category-art { width: 54px; height: 54px; }
  .menu-hub-shell.has-subcategories .subcategory-nav { padding-top: 8px; padding-bottom: 7px; }
  .subcategory-chip { min-height: 31px; padding: 6px 11px; font-size: .69rem; }
}

/* Alineación del contenido con el producto: se reduce sólo el aire izquierdo. */
@media (max-width: 1400px), (pointer: coarse), (orientation: portrait) {
  #cat-hamburguesas.menu-category.active .menu-card {
    flex-basis: min(38vw, 205px);
  }
  #cat-hamburguesas .menu-card-img img { transform: translateX(-18%) scale(1.42); }
  #cat-hamburguesas .menu-card:nth-child(4) .menu-card-img img,
  #cat-hamburguesas .menu-card:nth-child(6) .menu-card-img img {
    transform: translateX(-18%) scale(1.18);
  }
  #cat-hamburguesas .menu-card-img img { transform: scale(1.42); }
  #cat-hamburguesas .menu-card:nth-child(4) .menu-card-img img,
  #cat-hamburguesas .menu-card:nth-child(6) .menu-card-img img {
    transform: scale(1.18);
  }
  #cat-hamburguesas .menu-card-body { padding-left: 4%; }
  #cat-hamburguesas .menu-card:first-child .menu-card-badge { left: 4%; }
  #cat-hamburguesas .add-btn { right: 10px; left: auto; top: 155px; }
}

/* Las ofertas comparten el mismo borde amarillo de la oferta destacada. */
#cat-promociones .promo-card,
#cat-promociones .promo-card:hover,
#cat-promociones .promo-card.recommended {
  border-color: rgba(255, 214, 0, .82);
}
#cat-promociones .promo-card:not(.recommended) {
  box-shadow: 0 0 0 1px rgba(255, 214, 0, .12), 0 14px 40px rgba(0, 0, 0, .18);
}

/* Prueba catálogo compacto: hamburguesas en dos columnas, sin carrusel. */
@media (max-width: 1400px), (pointer: coarse), (orientation: portrait) {
  #cat-hamburguesas.menu-category.active {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    height: auto !important;
    min-height: 0 !important;
    align-content: start;
    gap: 1px;
    overflow: visible;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    padding: 0 0 14px;
    scroll-snap-type: none;
  }
  #cat-hamburguesas.menu-category.active .menu-card {
    min-width: 0;
    width: auto;
    flex: none;
    border: 0;
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
    transform: none;
    min-height: 0;
  }
  #cat-hamburguesas .menu-card-img {
    height: 45vw;
    min-height: 158px;
    padding: 0;
  }
  #cat-hamburguesas .menu-card-img img,
  #cat-hamburguesas .menu-card:nth-child(4) .menu-card-img img,
  #cat-hamburguesas .menu-card:nth-child(6) .menu-card-img img {
    transform: scale(1.38);
  }
  #cat-hamburguesas .menu-card-body {
    min-height: 68px;
    padding: 9px 12px 10px;
  }
  #cat-hamburguesas .menu-card-name {
    font-size: 1.08rem;
    letter-spacing: .45px;
  }
  #cat-hamburguesas .menu-card-price {
    font-size: 1.45rem;
  }
  #cat-hamburguesas .menu-card-footer {
    margin-top: 5px;
  }
  #cat-hamburguesas .add-btn {
    top: calc(45vw - 25px);
    right: 10px;
    width: 42px;
    height: 42px;
    font-size: 1.65rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
  }
  #cat-hamburguesas .menu-card-badge {
    top: 10px;
    left: 10px;
    padding: 6px 8px;
    border-radius: 4px;
    font-size: .58rem;
  }
}

/* Copia literal del formato visual de Hamburguesas en las demás categorías. */
#ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-desc { display: none; }
#ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-img { height: 184px; padding: 10px; }
#ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-img img { transform: scale(1.42); }
#ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card:hover .menu-card-img img { transform: scale(1.5); }
#ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-body { padding: 12px 14px 14px; background: #fff; }
#ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-name { font-size: 1.28rem; line-height: .95; }
#ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-footer { margin-top: 1px; padding-top: 0; border-top: 0; }
#ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .add-btn {
  position: absolute;
  top: 163px;
  right: 16px;
  z-index: 2;
  width: 42px;
  height: 42px;
  padding: 0;
  border-radius: 50%;
  background: #fff;
  color: #191919;
  box-shadow: 0 5px 14px rgba(0, 0, 0, .14);
  font: 500 1.7rem/1 system-ui, sans-serif;
}
#ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .add-btn:hover { transform: scale(1.08); background: #fff; }

@media (max-width: 1400px), (pointer: coarse), (orientation: portrait) {
  #ordenar .menu-category.active:not(#cat-promociones):not(#cat-hamburguesas) { gap: 12px; padding: 7px 0 22px 12px; }
  #ordenar .menu-category.active:not(#cat-promociones):not(#cat-hamburguesas) .menu-card { flex: 0 0 min(38vw, 205px); border-radius: 22px; }
  #ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-img { height: 176px; padding: 7px; }
  #ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-img img { transform: scale(1.42); }
  #ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-body { padding: 10px 12px 12px 4%; }
  #ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-name { font-size: 1.08rem; }
  #ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-price { color: #707070; font-size: 1.48rem; }
  #ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-price span { color: #888; }
  #ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card-footer { margin-top: 0; padding-top: 0; }
  #ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .add-btn { top: 155px; right: 10px; left: auto; width: 36px; height: 36px; font-size: 1.45rem; }
  #ordenar .menu-category:not(#cat-promociones):not(#cat-hamburguesas) .menu-card:first-child .menu-card-badge { left: 4%; }
}