/* Menu page styles */
.feature__content {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

.feature {
  background: var(--bg);
  color: var(--fg);
  padding: clamp(24px, 6vw, 64px) 0;
}

.menu-headers {
    margin-top: 50px;
    display: flex;
    flex-wrap: nowrap;               
    overflow-x: auto;                
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    padding: 5px;
    box-sizing: border-box;
    width: 100%;
}



.menu-header:hover {
  transform: translateY(-3px);
}

.menu-header:active {
  transform: translateY(0);
}

.rib-footer {
    background-color: black;
    text-align: center;
    color: white;
    margin-bottom: 20px;
    border: 2px solid gold;
    background: #1a1a1a;
    border-radius: 14px;
}

.hidden {
    display: none
}

a.red-button {
  color: white !important;
}

.red-button {
  margin-left: auto;
  padding: 6px 12px;
  border-radius: 8px;
  background-image: linear-gradient(180deg, #c50000, #6a0000 55%, #300000);
  color: #ffffff !important;
  text-decoration: none;
  font-weight: 800;
  font-size: 0.92rem;
  border: 1px solid rgba(63, 12, 12, 0.864);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.35) inset,
    0 6px 14px rgba(0, 0, 0, 0.25);
  transition: transform 120ms ease, filter 120ms ease, box-shadow 160ms ease;
  white-space: nowrap;
  background-size: 100% 100%;
  cursor: pointer;
}

.gold-button {
  margin-left: auto;
  padding: 6px 12px;
  border-radius: 8px;
  background-image: linear-gradient(180deg, #f7e9a8, #d4af37 55%, #b08a1c);
  color: #1a1205;
  text-decoration: none;
  font-weight: 800;
  font-size: 0.92rem;
  border: 1px solid rgba(176, 138, 28, 0.85);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.35) inset,
    0 6px 14px rgba(0, 0, 0, 0.25);
  transition: transform 120ms ease, filter 120ms ease, box-shadow 160ms ease;
  white-space: nowrap;
  background-size: 100% 100%;
  cursor: pointer;
}

@media (min-width: 820px) {
  .feature__content {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
  }
  .menu-headers {
    margin-top: 50px;
    margin-right: 50px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    overflow-x: hidden;
  }
}