/* =========================================================
   Gui's Burger — Menu page
   Built on the Ember palette + article chrome (article.css).
   ========================================================= */

/* ---- menu hero ---- */
.menu-hero{
  max-width:900px; margin:0 auto; padding:clamp(56px,10vh,118px) var(--pad) 0;
  text-align:center; display:flex; flex-direction:column; align-items:center;
}
.menu-kicker{ font-size:11px; letter-spacing:.34em; text-transform:uppercase; color:var(--gold); margin:0; }
.menu-title{
  font-family:var(--display); font-weight:200;
  font-size:clamp(54px,9vw,124px); line-height:.9; letter-spacing:-.01em; margin:16px 0 0;
}
.menu-dek{ max-width:42ch; font-size:clamp(16px,1.6vw,20px); line-height:1.6; opacity:.82; margin:22px 0 0; text-wrap:pretty; }
.menu-served{
  margin:clamp(30px,5vh,48px) 0 0; padding:13px 26px;
  border:1px solid rgba(194,164,107,.3); border-radius:999px;
  font-family:var(--display); font-weight:400; font-size:13px; letter-spacing:.22em; text-transform:uppercase; color:var(--gold);
}

/* ---- menu body ---- */
.menu-wrap{ max-width:920px; margin:0 auto; padding:clamp(44px,7vh,80px) var(--pad) clamp(60px,10vh,120px); }

.menu-section + .menu-section{ margin-top:clamp(56px,9vh,104px); }
.menu-section-head{
  display:flex; align-items:baseline; gap:18px; margin:0 0 clamp(28px,4vh,44px);
}
.menu-section-head h2{
  font-family:var(--display); font-weight:300; font-size:clamp(22px,3vw,34px);
  letter-spacing:.16em; text-transform:uppercase; color:var(--cream); margin:0; white-space:nowrap;
}
.menu-section-head .rule{ flex:1; height:1px; background:rgba(194,164,107,.28); }
.menu-section-head .jp{ font-family:var(--jp); font-size:13px; letter-spacing:.1em; color:var(--gold); opacity:.85; white-space:nowrap; }

/* ---- burger item ---- */
.burger{ padding:clamp(26px,3.4vw,38px) 0; border-top:1px solid rgba(194,164,107,.16); }
.burger:first-child{ border-top:none; padding-top:0; }
.burger-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:clamp(20px,4vw,56px); }
.burger-id{ flex:1 1 auto; min-width:0; }
.burger-farm{
  font-family:var(--display); font-weight:500; font-size:12px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold); margin:0 0 8px;
}
.burger-name{
  font-family:var(--display); font-weight:300; font-size:clamp(30px,4.4vw,52px);
  line-height:1; letter-spacing:-.005em; margin:0;
}
.burger-prices{ flex:0 0 auto; display:flex; flex-direction:column; gap:8px; text-align:right; padding-top:6px; }
.price{ display:flex; align-items:baseline; justify-content:flex-end; gap:14px; white-space:nowrap; }
.price-label{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; opacity:.6; }
.price-val{ font-family:var(--display); font-weight:400; font-size:clamp(19px,2.2vw,24px); color:var(--gold); min-width:4.4em; text-align:right; }

.burger-desc{ max-width:60ch; font-size:clamp(15px,1.2vw,17px); line-height:1.7; opacity:.9; margin:18px 0 0; text-wrap:pretty; }
.burger-jp{ font-family:var(--jp); font-size:13px; line-height:1.85; opacity:.5; margin:10px 0 0; max-width:62ch; }

/* ---- add-ons ---- */
.addons{
  display:flex; flex-wrap:wrap; gap:12px 14px; margin:clamp(26px,4vh,40px) 0 0;
  padding:clamp(22px,3vw,30px); background:var(--char-2);
  border:1px solid rgba(194,164,107,.16); border-radius:4px;
}
.addons-label{ width:100%; font-size:10px; letter-spacing:.28em; text-transform:uppercase; color:var(--gold); margin:0 0 4px; }
.addon{ display:inline-flex; align-items:baseline; gap:10px; font-family:var(--display); font-weight:300; font-size:clamp(17px,1.8vw,21px); }
.addon + .addon{ padding-left:14px; border-left:1px solid rgba(194,164,107,.2); }
.addon .plus{ color:var(--gold); }

/* ---- drinks grid ---- */
.drinks{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(28px,4vw,52px); }
.drink-group h3{
  font-family:var(--display); font-weight:400; font-size:13px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--gold); margin:0 0 18px; padding-bottom:12px; border-bottom:1px solid rgba(194,164,107,.2);
}
.drink-list{ list-style:none; margin:0; padding:0; }
.drink-list li{
  display:flex; align-items:baseline; justify-content:space-between; gap:14px;
  padding:9px 0; font-size:15px;
}
.drink-list .dot{ flex:1; border-bottom:1px dotted rgba(230,221,218,.22); transform:translateY(-4px); margin:0 4px; }
.drink-list .d-name{ opacity:.9; }
.drink-list .d-price{ font-family:var(--display); font-weight:400; color:var(--gold); white-space:nowrap; }

/* ---- end cta ---- */
.menu-cta{
  display:flex; flex-wrap:wrap; gap:14px; justify-content:center; align-items:center;
  margin-top:clamp(54px,8vh,96px); padding-top:clamp(40px,6vh,64px);
  border-top:1px solid rgba(194,164,107,.16); text-align:center;
}
.menu-cta-note{ width:100%; font-size:13px; letter-spacing:.04em; opacity:.55; margin:0 0 6px; }
.menu-tax{ text-align:center; font-size:12px; letter-spacing:.06em; opacity:.45; margin:clamp(30px,4vh,42px) 0 0; }

@media (max-width:680px){
  .drinks{ grid-template-columns:1fr; gap:clamp(30px,6vh,40px); }
  .burger-top{ flex-direction:column; gap:16px; }
  .burger-prices{ flex-direction:row; gap:22px; text-align:left; padding-top:0; }
  .price{ flex-direction:column; align-items:flex-start; gap:2px; }
  .price-val{ min-width:0; text-align:left; }
  .menu-section-head{ gap:12px; }
  .menu-section-head .jp{ display:none; }
}
