.menu-showcase {
  background: #0e0b09;
  position: relative;
  overflow: hidden;
}

.menu-showcase::before {
  content: "RACHAROS";
  position: absolute;
  right: -0.04em;
  top: -0.19em;
  color: rgba(255,255,255,.018);
  font: 600 clamp(7rem,18vw,20rem)/1 Georgia, serif;
  letter-spacing: -.05em;
  pointer-events: none;
}

.menu-showcase-head {
  max-width: 1280px;
  margin: 0 auto 48px;
  display: grid;
  grid-template-columns: minmax(300px,.9fr) minmax(320px,.68fr);
  justify-content: space-between;
  align-items: end;
  gap: clamp(40px,8vw,130px);
  position: relative;
  z-index: 1;
}

.menu-showcase-head h2 {
  margin: 0;
  font: 400 clamp(2.8rem,4.7vw,5.2rem)/1.16 var(--serif);
}

.menu-showcase-head > p {
  margin: 0 0 10px;
  padding-left: 24px;
  border-left: 1px solid var(--red);
  color: var(--muted);
}

.menu-gallery {
  max-width: 1280px;
  min-height: 760px;
  margin: auto;
  display: grid;
  grid-template-columns: 1.18fr .82fr .82fr;
  grid-template-rows: 1.04fr .96fr;
  gap: 10px;
}

.menu-tile {
  min-height: 0;
  margin: 0;
  position: relative;
  overflow: hidden;
  background: #18120e;
}

.menu-tile-main { grid-row: 1 / 3; }
.menu-tile-hotpot { grid-column: 2 / 4; }

.menu-tile::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg,rgba(5,3,2,.92) 0%,rgba(5,3,2,.08) 53%,transparent 72%);
  transition: background .45s ease;
}

.menu-tile img {
  transition: transform .8s ease, filter .8s ease;
}

.menu-tile:hover img { transform: scale(1.045); }
.menu-tile:hover::after { background: linear-gradient(0deg,rgba(5,3,2,.96) 0%,rgba(5,3,2,.16) 58%,transparent 78%); }
.menu-tile-main img { object-position: center center; }
.menu-tile-broth img { object-position: center 62%; }
.menu-tile-hotpot img { object-position: center 56%; }
.menu-tile-premium img { object-position: center 59%; }

.menu-tile figcaption {
  position: absolute;
  z-index: 2;
  left: clamp(20px,2.3vw,34px);
  right: 20px;
  bottom: clamp(18px,2.4vw,32px);
  display: grid;
}

.menu-tile figcaption span {
  color: var(--gold);
  font: 400 .72rem/1 Georgia,serif;
  letter-spacing: .12em;
  margin-bottom: 8px;
}

.menu-tile figcaption strong {
  font: 400 clamp(1.35rem,2.1vw,2.45rem)/1.2 var(--serif);
}

.menu-tile figcaption small {
  color: #c7beb3;
  font-size: .8rem;
  margin-top: 3px;
}

.menu-categories {
  max-width: 1280px;
  margin: 12px auto 0;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.menu-categories > span {
  padding: 20px 24px;
  border-right: 1px solid var(--line);
  color: #eee5d9;
  font-size: 1rem;
}

.menu-categories > span:last-child { border-right: 0; }
.menu-categories small { color: #91877c; }

.products-coming {
  min-height: 670px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  overflow: hidden;
  padding: 80px clamp(24px,7vw,112px);
  background: #000;
}

.products-coming > img { position: absolute; inset: 0; object-position: center center; }
.products-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,rgba(0,0,0,.02) 0%,rgba(0,0,0,.08) 46%,rgba(0,0,0,.78) 68%,#000 100%),linear-gradient(0deg,rgba(0,0,0,.42),transparent 48%);
}

.products-copy {
  width: min(510px,43vw);
  position: relative;
  z-index: 2;
}

.coming-badge {
  display: inline-flex;
  margin: 5px 0 22px;
  padding: 7px 13px;
  border: 1px solid var(--gold);
  color: var(--gold-2);
  font: 600 .7rem/1 var(--sans);
  letter-spacing: .17em;
}

.products-copy h2 {
  margin: 0 0 22px;
  font: 400 clamp(3rem,5vw,5.7rem)/1.13 var(--serif);
}

.products-copy > p:last-child {
  max-width: 440px;
  margin: 0;
  color: #d4cbc0;
  font-size: 1.02rem;
}

@media (max-width: 1120px) and (min-width: 901px) {
  .topbar nav { gap: 13px; font-size: .78rem; }
  .nav-cta { padding-left: 14px; padding-right: 14px; }
}

@media (max-width: 900px) {
  .menu-showcase-head { grid-template-columns: 1fr; gap: 24px; }
  .menu-showcase-head > p { max-width: 620px; }
  .menu-gallery { min-height: 920px; grid-template-columns: 1fr 1fr; grid-template-rows: 1.15fr .85fr .85fr; }
  .menu-tile-main { grid-column: 1 / 3; grid-row: 1; }
  .menu-tile-hotpot { grid-column: 1 / 3; grid-row: 3; }
  .products-coming { min-height: 720px; align-items: flex-end; justify-content: flex-start; }
  .products-coming > img { object-position: center center; }
  .products-shade { background: linear-gradient(0deg,#000 4%,rgba(0,0,0,.93) 37%,rgba(0,0,0,.08) 78%); }
  .products-copy { width: min(620px,100%); }
}

@media (max-width: 620px) {
  .menu-showcase-head { margin-bottom: 34px; }
  .menu-showcase-head h2 { font-size: 2.75rem; }
  .menu-gallery { min-height: 0; display: grid; grid-template-columns: 1fr; grid-template-rows: none; gap: 8px; }
  .menu-tile, .menu-tile-main, .menu-tile-hotpot { grid-column: auto; grid-row: auto; min-height: 310px; }
  .menu-tile-main { min-height: 390px; }
  .menu-categories { grid-template-columns: 1fr; }
  .menu-categories > span { border-right: 0; border-bottom: 1px solid var(--line); }
  .menu-categories > span:last-child { border-bottom: 0; }
  .products-coming { min-height: 700px; padding-bottom: 66px; }
  .products-copy h2 { font-size: 3rem; }
}
