/* ============================================================
   OLAFF — QR Menü (mobil öncelikli). Tokens style.css'ten gelir.
   ============================================================ */
.menu-body{ background:var(--ink); }

/* Sticky top bar */
.menu-head{
  position:sticky; top:0; z-index:40;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px var(--pad);
  background:rgba(11,11,12,.9); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.menu-head svg{ height:22px; color:var(--paper); }
.menu-head a.back{
  font-family:var(--f-display); font-size:.74rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--muted); display:inline-flex; align-items:center; gap:8px;
}
.menu-head a.back:hover{ color:var(--accent); }

/* Intro */
.menu-intro{ padding:34px var(--pad) 8px; max-width:var(--maxw); margin-inline:auto; text-align:center; }
.menu-intro .eyebrow{ justify-content:center; margin-bottom:16px; }
.menu-intro h1{ font-family:var(--f-display); font-size:clamp(2rem,7vw,3rem); font-weight:600; }
.menu-intro h1 em{ color:var(--accent); font-style:normal; }
.menu-intro p{ color:var(--muted); margin-top:12px; font-size:.95rem; }

/* Category pills (sticky) */
.cat-nav{
  position:sticky; top:51px; z-index:35;
  display:flex; gap:8px; overflow-x:auto; scrollbar-width:none;
  padding:14px var(--pad); background:rgba(11,11,12,.92); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.cat-nav::-webkit-scrollbar{ display:none; }
.cat-nav button{
  flex:0 0 auto; padding:.55em 1.05em; border-radius:2px;
  font-family:var(--f-display); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); border:1px solid var(--line); white-space:nowrap;
  transition:.2s var(--ease);
}
.cat-nav button:hover{ color:var(--paper); border-color:var(--faint); }
.cat-nav button.active{ color:#fff; background:var(--accent); border-color:var(--accent); }

/* Menu content */
.menu-wrap{ max-width:760px; margin-inline:auto; padding:8px var(--pad) 80px; }
.menu-cat{ padding-top:40px; scroll-margin-top:120px; }
.menu-cat__title{
  font-family:var(--f-display); font-size:1.5rem; font-weight:600;
  display:flex; align-items:center; gap:14px; margin-bottom:6px;
}
.menu-cat__title::after{ content:""; flex:1; height:1px; background:var(--line); }
.menu-cat__title .dot{ width:9px; height:9px; background:var(--accent); border-radius:50%; flex:0 0 auto; }

.m-item{ display:flex; gap:12px; align-items:baseline; padding:16px 0; border-bottom:1px solid var(--line); }
.m-item__main{ flex:1; min-width:0; }
.m-item__top{ display:flex; align-items:baseline; gap:10px; }
.m-item__name{ font-family:var(--f-display); font-weight:500; font-size:1.05rem; color:var(--paper); }
.m-item__lead{ flex:1; border-bottom:1px dotted var(--faint); transform:translateY(-4px); min-width:16px; }
.m-item__price{ font-family:var(--f-display); font-weight:600; color:var(--accent); white-space:nowrap; }
.m-item__price.empty{ color:var(--faint); }
.m-item__desc{ color:var(--muted); font-size:.88rem; margin-top:4px; }
.m-item__tag{
  display:inline-block; margin-top:8px; font-family:var(--f-display);
  font-size:.62rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); border:1px solid var(--accent); border-radius:2px; padding:2px 7px;
}

.menu-foot{ text-align:center; padding:30px var(--pad) 50px; color:var(--faint); border-top:1px solid var(--line); }
.menu-foot a:hover{ color:var(--accent); }

@media (prefers-reduced-motion:reduce){ *{ scroll-behavior:auto !important; } }
