/* =========================================================
   Moon — menu block
   Shared by the landing-page section and menu.html.
   Same type system as the rest of the site; its own paper palette
   so it does not inherit the drink-of-the-moment colours.
   ========================================================= */

.menu-block{
  --paper:#f7f1e6;
  --paper-2:#efe6d6;
  --ink:#121212;
  --ink-soft:#5c5c5c;
  --rule:rgba(18,18,18,.15);
  --gold:#6e6e6e;

  position:relative;z-index:20;
  overflow-x:clip;              /* the sticky bar bleeds full-width; clip keeps sticky alive */
  background:linear-gradient(178deg,var(--paper) 0%,var(--paper-2) 100%);
  color:var(--ink);
  font-family:'Lora',Georgia,serif;
  padding:clamp(52px,7vw,110px) clamp(20px,5vw,80px) clamp(40px,5vw,80px);
}
.menu-block::before{                 /* same grain as the hero, for continuity */
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.3;
  background-image:url("assets/grain.svg");
  mix-blend-mode:multiply;
}
.menu-inner{position:relative;max-width:1100px;margin:0 auto}

/* ---------- section intro ---------- */
.menu-intro{text-align:center;margin-bottom:clamp(26px,3.5vw,52px)}
.menu-eyebrow{
  margin:0 0 .9em;font-family:'Inter',sans-serif;
  font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);
}
.menu-intro h2{
  margin:0;font-family:'Bodoni Moda',Didot,Georgia,serif;font-weight:700;
  font-size:clamp(36px,6vw,86px);line-height:.94;text-transform:uppercase;letter-spacing:-.01em;
}
.menu-intro p{
  margin:1em auto 0;max-width:46ch;
  font-size:clamp(13px,1.05vw,15.5px);line-height:1.65;color:var(--ink-soft);
}

/* ---------- search ---------- */
.m-search{
  margin:0 auto clamp(30px,4vw,58px);max-width:640px;
}
.m-search.is-sticky{
  position:sticky;top:0;z-index:9;max-width:none;
  margin:0 -100vw clamp(30px,4vw,58px);
  padding:clamp(12px,1.6vw,20px) 100vw;
  background:linear-gradient(to bottom,var(--paper) 72%,rgba(247,241,230,0));
}
.m-search.is-sticky .m-field{max-width:640px;margin-inline:auto}
.m-field{
  position:relative;display:flex;align-items:center;gap:12px;
  padding:.85em 1.1em;border-radius:100px;
  background:rgba(255,255,255,.72);
  border:1px solid var(--rule);
  box-shadow:0 10px 30px rgba(18,18,18,.07);
  transition:border-color .3s,box-shadow .3s,background .3s;
}
.m-field:focus-within{
  border-color:rgba(18,18,18,.45);
  box-shadow:0 12px 34px rgba(18,18,18,.12);
  background:#fff;
}
.m-ico{width:18px;height:18px;flex:none;fill:none;stroke:var(--gold);stroke-width:1.7;stroke-linecap:round}
.m-field input{
  flex:1;min-width:0;border:0;background:none;outline:none;color:var(--ink);
  font-family:'Inter',sans-serif;font-size:14px;letter-spacing:.01em;
}
.m-field input::placeholder{color:var(--ink-soft);opacity:.62}
.m-field input::-webkit-search-cancel-button{display:none}
.m-clear{
  flex:none;width:26px;height:26px;display:grid;place-items:center;cursor:pointer;
  border:0;border-radius:50%;background:rgba(18,18,18,.08);color:var(--ink);
  transition:background .25s,transform .25s;
}
.m-clear[hidden]{display:none}
.m-clear svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.m-clear:hover{background:rgba(18,18,18,.18);transform:rotate(90deg)}
.m-count{
  margin:.85em 0 0;text-align:center;
  font-family:'Inter',sans-serif;font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-soft);opacity:.65;
}

/* ---------- sections ---------- */
.m-section{margin-bottom:clamp(40px,5vw,84px)}
.m-section[hidden]{display:none}
.m-section-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;
  padding-bottom:.7em;margin-bottom:clamp(18px,2vw,32px);
  border-bottom:1px solid var(--rule);
}
.m-section-head h2{
  margin:0;font-family:'Bodoni Moda',Didot,Georgia,serif;font-weight:700;
  font-size:clamp(26px,3.4vw,46px);line-height:1;text-transform:uppercase;letter-spacing:.01em;
}
.m-cols{display:grid;grid-template-columns:repeat(3,minmax(72px,88px));gap:0;text-align:right}
.m-cols span{display:block;font-family:'Inter',sans-serif;line-height:1.3}
.m-cols b{display:block;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:600}
.m-cols i{display:block;font-style:normal;font-size:9px;letter-spacing:.14em;opacity:.55}

.m-group{margin-bottom:clamp(20px,2.4vw,38px)}
.m-group[hidden]{display:none}
.m-group-title{
  margin:0 0 .95em;font-family:'Inter',sans-serif;font-weight:600;
  font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);
}
.m-list{display:flex;flex-direction:column;gap:.15em}

/* ---------- item ---------- */
.m-item{padding:.5em 0}
.m-item[hidden]{display:none}
.m-item-head{display:flex;align-items:baseline;gap:10px}
.m-name{
  font-size:clamp(14px,1.15vw,17px);font-weight:500;line-height:1.35;
}
.m-leader{
  flex:1;min-width:14px;height:1px;transform:translateY(-.25em);
  background-image:radial-gradient(circle,var(--rule) 1px,transparent 1px);
  background-size:5px 1px;background-repeat:repeat-x;background-position:0 50%;
}
.m-price{
  font-family:'Bodoni Moda',Didot,serif;font-weight:700;
  font-size:clamp(14px,1.2vw,18px);font-variant-numeric:tabular-nums;white-space:nowrap;
}
.m-sizes{display:grid;grid-template-columns:repeat(3,minmax(72px,88px));text-align:right}
.m-size{
  font-family:'Bodoni Moda',Didot,serif;font-weight:700;
  font-size:clamp(13px,1.1vw,17px);font-variant-numeric:tabular-nums;
}
.m-size.is-empty{opacity:.22;font-weight:400}
.m-size-solo{grid-column:3}
.m-desc{
  margin:.3em 0 0;max-width:62ch;
  font-family:'Inter',sans-serif;font-size:clamp(11.5px,.88vw,13px);line-height:1.6;
  color:var(--ink-soft);opacity:.9;
}

/* while a search is running, drop the group titles that survived alone */
.is-filtered .m-item{padding:.42em 0}

.m-empty{
  margin:0;padding:2.4em 0;text-align:center;
  font-size:clamp(14px,1.2vw,17px);color:var(--ink-soft);
}
.m-empty[hidden]{display:none}

.m-note{
  margin:clamp(24px,3vw,48px) 0 0;padding-top:clamp(18px,2vw,30px);
  border-top:1px solid var(--rule);text-align:center;
  font-family:'Inter',sans-serif;font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-soft);opacity:.7;
}

/* ---------- full-menu call to action ---------- */
.menu-cta{
  display:inline-flex;align-items:center;gap:.7em;
  padding:1em 1.9em;border-radius:100px;text-decoration:none;
  background:#121212;color:#f8f2e8;
  font-family:'Inter',sans-serif;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  transition:transform .3s cubic-bezier(.16,1,.3,1),background .3s;
}
.menu-cta:hover{transform:translateY(-2px);background:#2b2b2b}
.menu-cta span{transition:transform .3s cubic-bezier(.16,1,.3,1)}
.menu-cta:hover span{transform:translateX(4px)}
.menu-cta-wrap{text-align:center;margin-top:clamp(26px,3vw,48px)}

/* ---------- standalone page shell ---------- */
.page{background:#f7f1e6;min-height:100svh}
.page-bar{
  position:sticky;top:0;z-index:30;
  display:flex;align-items:center;justify-content:space-between;
  padding:clamp(14px,1.8vw,24px) clamp(20px,5vw,80px);
  background:rgba(247,241,230,.86);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(18,18,18,.1);
  font-family:'Inter',system-ui,sans-serif;
}
.page-bar .wordmark{color:#121212}
.page-bar .nav a{color:#121212}
.page .m-search.is-sticky{top:clamp(52px,6.4vw,74px)}

@media (max-width:720px){
  .m-section-head{align-items:flex-start;flex-direction:column;gap:12px}
  .m-cols{grid-template-columns:repeat(3,minmax(58px,1fr));width:100%;gap:0}
  .m-sizes{grid-template-columns:repeat(3,minmax(58px,1fr))}
  .m-item-head{flex-wrap:wrap}
  .m-name{flex:1 1 auto;min-width:60%}
  .m-leader{display:none}
  .m-sizes{flex:1 1 100%;margin-top:.35em;text-align:left;
           grid-template-columns:repeat(3,minmax(0,1fr))}
  .m-size{text-align:left;font-size:14px}
  .m-size::before{
    content:attr(data-size);display:block;
    font-family:'Inter',sans-serif;font-size:8.5px;letter-spacing:.16em;
    text-transform:uppercase;font-weight:600;opacity:.5;margin-bottom:.2em;
  }
  .m-size-solo{grid-column:1}
  .menu-foot-inner{justify-content:center;text-align:center}
}
