.menu-selection { margin-top: 64px; }
.menu-selection h3 { margin: 0 0 24px; font-family: var(--serif); font-size: clamp(2.6rem, 4vw, 4rem); font-weight: 500; letter-spacing: -.04em; line-height: 1.1; }
.menu-categories { display: flex; flex-wrap: wrap; gap: 8px 32px; margin-bottom: 32px; }
.menu-categories a { display: inline-flex; align-items: center; min-height: 44px; color: var(--white); text-decoration: underline; text-decoration-color: rgba(255,255,255,.35); text-underline-offset: 7px; transition: text-decoration-color 220ms var(--ease); }
.menu-categories a:hover { text-decoration-color: var(--orange); }
.menu-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 64px; }
.menu-entry { min-height: 112px; display: grid; grid-template-columns: 104px minmax(0, 1fr) auto; align-items: center; gap: 20px; padding: 16px 0; border-top: 1px solid rgba(255,255,255,.25); color: var(--white); text-decoration: none; transition: color 220ms var(--ease); }
.menu-entry:not(:has(.menu-entry-photo)) { grid-template-columns: minmax(0, 1fr) auto; }
.menu-entry-photo { width: 104px; height: 80px; object-fit: cover; border-radius: 0; }
.menu-entry strong { font-family: var(--serif); font-size: clamp(1.35rem, 2vw, 1.8rem); line-height: 1.2; font-weight: 500; }
.menu-entry-price { flex-shrink: 0; font-variant-numeric: tabular-nums; }
.menu-entry-price small { font-size: .8rem; color: #d8d2c7; }
.menu-entry:hover { color: #f2a48c; }
.menu-photo-credit { margin: 20px 0 0; font-size: .8rem; color: #d8d2c7; }
.menu-photo-credit a { text-underline-offset: 4px; }
.photo-credits-list { list-style: none; padding: 0; margin: 48px 0 0; }
.photo-credits-list li { padding: 24px 0; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.photo-credits-list h2 { font-family: var(--serif); font-size: 1.7rem; }
.photo-credits-list p { max-width: 75ch; }
@media (max-width: 860px) {
  .menu-list { grid-template-columns: 1fr; }
  .menu-selection { margin-top: 44px; }
  .menu-categories { column-gap: 24px; }
  .menu-entry { gap: 12px; grid-template-columns: 76px minmax(0, 1fr); }
  .menu-entry-photo { width: 76px; height: 64px; grid-row: span 2; }
  .menu-entry strong { align-self: end; }
  .menu-entry-price { grid-column: 2; align-self: start; }
  .menu-entry:not(:has(.menu-entry-photo)) .menu-entry-price { grid-column: auto; }
}