/* --- MODIFIED MOBILE NAV RULES --- */
nav {
  justify-content: space-between; /* Hamburger on one side, nav-links potentially on the other if not absolute */
  height: 60px; /* Fixed height for mobile nav bar */
  padding-right: 1em; /* Add some padding to the right for the hamburger */
}

.nav-links {
  display: none; /* Hidden by default */
  flex-direction: column;
  align-items: flex-end; /* Align links to the right */
  position: absolute;
  top: 60px; /* Position below the nav bar */
  right: 0;
  width: 70%; /* Adjust as needed */
  background: #000;
  z-index: 1000;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5); /* Add shadow for better visibility */
}

.nav-links.show {
  display: flex !important; /* Important to override display: none */
}

.nav-links a {
  display: block;
  width: 100%;
  padding: 1em;
  border-bottom: 1px solid #FFD700;
  border-left: none; /* Remove left border on mobile */
  text-align: right;
  font-size: 1em;
}

.hamburger {
  display: block; /* Show hamburger on mobile */
  position: relative; /* Keep it in the flow of the nav bar */
  top: auto;
  right: auto;
}

/* 単品・ドリンクメニューのカテゴリーを1列にする */
.section-box-grid {
  grid-template-columns: 1fr; /* 1列表示 */
}

.section-box-grid .menu-category {
  width: 95%; /* スマホではほぼ全幅に */
  max-width: none; /* 最大幅の制限を解除 */
  min-width: unset; /* 最低幅も解除 */
}

.menu-items-list li {
  font-size: 1em;
}

.menu-items-list li .price {
  font-size: 1em;
}

.menu-items-list li .description {
  font-size: 0.8em;
}

.course-section-drink-info {
  font-size: 1em;
  padding: 1em 1.5em;
  max-width: 95%;
}

.feature-item:first-child { /* 1. 厳選された最高級の肉 */
  grid-column: auto;
  max-width: 100%;
}

.commitment-closing-text {
  padding: 1em;
  font-size: 1em;
}

/* コースのボックスも1列にする */
.course-box-wrapper {
  flex-direction: column; /* 縦並びにする */
  align-items: center; /* 中央揃えにする */
}

.course-box {
  width: 95%; /* スマホの画面幅に合わせて調整 */
  max-width: 400px; /* ある程度の最大幅を設定 */
}

/* お店の雰囲気のカードも1列にする */
.atmosphere-grid .atmosphere-card {
  width: 95%; /* スマホで1列にする */
  max-width: none; /* 最大幅の制限を解除 */
}

/* ドリンクのリスト（飲み放題情報）も1列にする */
.drink-list {
  grid-template-columns: 1fr; /* 1列表示 */
}