/* Concepto aprobado: Grabado mexicano. Cargar DESPUÉS de styles.css.
   Alcance deliberado: #mexicana.menu-section. Sin cambios de DOM ni carrito. */
#mexicana.menu-section {
  --mx-paper: #f4e5c8;
  --mx-ink: #291b13;
  --mx-rust: #9b3e23;
  --mx-gold: #d6ac67;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(30px, 4vw, 52px) clamp(16px, 2.5vw, 32px) clamp(24px, 3vw, 36px);
  background: var(--mx-paper);
  color: var(--mx-ink);
  border: 2px solid var(--mx-rust);
  border-radius: 18px 7px 18px 7px;
  box-shadow: inset 0 0 0 4px var(--mx-paper), inset 0 0 0 5px var(--mx-rust), 0 12px 36px #0002;
}
/* Sustituye el adorno difuso anterior sólo en esta categoría. */
#mexicana.menu-section::before {
  content: '';
  position: absolute;
  inset: 9px 14px auto;
  height: 30px;
  z-index: -1;
  background: url('../assets/decor/mx-papel-picado.svg') repeat-x center top / 92px 30px;
  opacity: 1;
  mix-blend-mode: normal;
  pointer-events: none;
}
#mexicana.menu-section::after {
  content: '';
  position: absolute;
  inset: auto 24px 13px;
  height: 7px;
  z-index: -1;
  background: url('../assets/decor/mx-greca.svg') repeat-x center / 80px 7px;
  pointer-events: none;
}
#mexicana .section-head {
  position: relative;
  min-height: 208px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 16px 37% 22px 12px;
  margin: 0 0 8px;
  background: none;
}
#mexicana .section-head::after {
  content: '';
  position: absolute;
  width: 37%;
  inset: 0 0 0 auto;
  background: url('../assets/decor/mx-catrina.webp') no-repeat center bottom / contain;
  pointer-events: none;
}
#mexicana .section-head > .eyebrow {
  color: var(--mx-rust);
  font: 700 .75rem/1.5 var(--font-body, 'Inter', sans-serif);
  letter-spacing: .16em;
  margin: 0 0 10px;
}
#mexicana .section-head h3 {
  font-family: var(--font-display, 'Fraunces', Georgia, serif);
  font-weight: 750;
  font-size: clamp(2rem, 3.9vw, 3.8rem);
  line-height: 1.08;
  letter-spacing: -.035em;
  color: var(--mx-ink);
  margin: 0 0 14px;
  text-wrap: balance;
}
#mexicana .section-head > p {
  font-size: clamp(.9375rem, 1.2vw, 1.0625rem);
  line-height: 1.55;
  color: #4c3425;
  margin: 0;
  max-width: 52ch;
}
#mexicana .product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  position: relative;
}
#mexicana .product-card {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--mx-gold);
  border-radius: 16px 5px 16px 5px;
  background: #241c16;
  color: #fff3dc;
  box-shadow: inset 0 0 0 3px #241c16, inset 0 0 0 4px #a8793c;
  transition: transform 160ms ease, box-shadow 160ms ease;
}
#mexicana .product-card:hover {
  border-color: #e4ba77;
  transform: translateY(-2px);
  box-shadow: inset 0 0 0 3px #241c16, inset 0 0 0 4px #d6ac67, 0 5px 12px #291b1320;
}
#mexicana .product-card__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 22px;
}
#mexicana .product-card__top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  margin: 0 0 12px;
}
#mexicana .product-card__top h4 {
  min-width: 0;
  font: 700 clamp(1.125rem, 1.55vw, 1.375rem)/1.25 var(--font-display, 'Fraunces', Georgia, serif);
  color: #fff3dc;
  margin: 0;
  overflow-wrap: anywhere;
}
#mexicana .product-card__price {
  flex-shrink: 0;
  font: 700 1.0625rem/1.4 var(--font-body, 'Inter', sans-serif);
  font-variant-numeric: tabular-nums;
  color: #edc47d;
  white-space: nowrap;
}
#mexicana .product-card__desc {
  font: 400 .9375rem/1.6 var(--font-body, 'Inter', sans-serif);
  color: #eddfc9;
  margin: 0 0 auto;
  padding-bottom: 22px;
}
#mexicana .product-card__foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-top: auto;
  padding: 0;
  border: 0;
}
#mexicana .product-card__foot > div {
  min-height: 34px;
  max-width: 55%;
  padding-left: 30px;
  background: url('../assets/decor/mx-agave.svg') no-repeat left center / 24px 30px;
}
#mexicana .product-card:nth-child(3n+2) .product-card__foot > div {
  background-image: url('../assets/decor/mx-sol.svg');
}
#mexicana .product-card__foot .badge {
  font-size: .625rem;
  padding: 3px 6px;
  white-space: normal;
}
#mexicana .add-btn {
  min-height: 44px;
  min-width: 108px;
  padding: 10px 18px;
  border: 1px solid #c67b52;
  border-radius: 999px;
  background: #a84225;
  color: #fff9ed;
  font: 600 .9375rem/1.2 var(--font-body, 'Inter', sans-serif);
  cursor: pointer;
  flex-shrink: 0;
  margin-left: auto;
}
#mexicana .add-btn:hover { background: #8d331c; }
#mexicana .add-btn:focus-visible {
  outline: 3px solid #fff3dc;
  outline-offset: 4px;
}
@media (max-width: 1023px) {
  #mexicana .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #mexicana .section-head { padding-right: 35%; min-height: 190px; }
  #mexicana .section-head::after { width: 34%; }
  #mexicana .product-card__top { flex-direction: column; gap: 7px; }
}
@media (max-width: 599px) {
  #mexicana.menu-section { padding: 38px 14px 28px; border-radius: 12px; }
  #mexicana .section-head { padding: 14px 8px 18px; min-height: 0; }
  #mexicana .section-head::after {
    position: static;
    display: block;
    width: min(100%, 250px);
    height: 155px;
    margin: 12px auto -10px;
    background-position: center;
  }
  #mexicana .section-head h3 { font-size: 2.125rem; }
  #mexicana .product-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  #mexicana .product-card__body { padding: 22px; }
  #mexicana .product-card__top { flex-direction: row; gap: 12px; }
  #mexicana .product-card__top h4 { font-size: 1.1875rem; }
  #mexicana .product-card__price { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  #mexicana .product-card, #mexicana .add-btn { transition: none; }
  #mexicana .product-card:hover, #mexicana .add-btn:hover { transform: none; }
}
