/* ═══ QR-меню — мобільний, швидкий ═══ */
:root {
  --bg: #0d0a08; --card: #1b1511; --gold: #c9a227; --gold-hi: #e3c463;
  --text: #e9e2d6; --dim: #9b8f7e; --line: rgba(201,162,39,.16);
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: var(--bg); color: var(--text); font-family: var(--sans); line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }

.mtop { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; background: rgba(13,10,8,.96); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.mlogo { font-family: var(--serif); font-size: 1.15rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
.mlang { appearance: none; background: none; border: 1px solid var(--line); color: var(--text);
  font-size: .76rem; letter-spacing: .12em; padding: 7px 11px; cursor: pointer; }

.mwrap { max-width: 640px; margin: 0 auto; padding: 30px 18px 50px; }
h1 { font-family: var(--serif); font-weight: 400; font-size: 2.3rem; text-align: center; color: var(--text); letter-spacing: .02em; }
.msub { text-align: center; font-size: .82rem; color: var(--dim); margin: 6px 0 26px; }

.chips { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 14px; margin-bottom: 20px; scrollbar-width: none; }
.chips::-webkit-scrollbar { display: none; }
.chip { flex-shrink: 0; background: none; border: 1px solid var(--line); color: var(--dim);
  font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; padding: 9px 18px; cursor: pointer; transition: all .25s; font-family: var(--sans); }
.chip.active, .chip:hover { background: var(--gold); color: var(--bg); border-color: var(--gold); }

.dishes { display: grid; gap: 3px; }
.dish { background: var(--card); padding: 18px; }
.dish-top { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin-bottom: 5px; }
.dish h3 { font-family: var(--serif); font-weight: 500; font-size: 1.18rem; color: var(--text); line-height: 1.25; }
.dish-p { font-family: var(--serif); font-size: 1.1rem; color: var(--gold); white-space: nowrap; }
.dish-d { font-size: .84rem; color: var(--dim); line-height: 1.5; }

.mnote { margin-top: 26px; padding: 15px 18px; border-left: 2px solid var(--gold); background: rgba(201,162,39,.06); font-size: .78rem; color: var(--dim); }
.mfull { text-align: center; font-size: .78rem; color: var(--dim); margin-top: 18px; font-style: italic; }
.mback { display: block; text-align: center; margin-top: 26px; font-size: .74rem; letter-spacing: .18em;
  text-transform: uppercase; color: var(--gold); border-top: 1px solid var(--line); padding-top: 20px; }

@media (max-width: 400px) {
  h1 { font-size: 1.9rem; }
  .dish { padding: 15px; }
}
