/* Jamaica Joe's menu mockups — shared base (tokens and voice match jamaicajoesbar.com) */

@font-face{font-family:'Tondu';src:url('/assets/fonts/tondu-400.woff2') format('woff2');font-weight:400;font-display:swap;}
@font-face{font-family:'Kaushan Script';src:url('/assets/fonts/kaushan-script-400.woff2') format('woff2');font-weight:400;font-display:swap;}
@font-face{font-family:'Inter';src:url('/assets/fonts/inter-variable.woff2') format('woff2');font-weight:100 900;font-display:swap;}

:root{
  --cream:#FAF6EF;
  --cream-soft:#F3EDE1;
  --paper:#FFFCF6;
  --ink:#2E2318;
  --body-c:#5B5248;
  --muted:#8A7F73;
  --line:rgba(46,35,24,.12);
  --teal:#2E9C8E;
  --teal-deep:#257F73;
  --teal-ink:#123F39;
  --gold:#E8912D;
  --gold-deep:#C87A1E;
  --wood:#2A1E14;
  --ice:#5FA8D3;
  --berry:#D9628E;
  --radius:12px;
  --pill:999px;
  --wrap:1240px;
  --gap:clamp(64px,8vw,120px); /* space above the shared site footer */
  --ease:cubic-bezier(.16,1,.3,1);
  --shadow-card:0 20px 30px rgba(46,35,24,.07);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
html,body{overflow-x:hidden;overflow-x:clip;}
body{margin:0;background:var(--cream);color:var(--body-c);
  font:400 1.0625rem/1.65 'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
button,input{font:inherit;color:inherit;}
a{color:var(--teal-deep);}
:focus-visible{outline:3px solid rgba(46,156,142,.55);outline-offset:3px;border-radius:6px;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(20px,4vw,48px);}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

.eyebrow{display:block;font-size:.75rem;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--teal);margin-bottom:.6rem;}
.h-display{font-family:'Tondu',Georgia,serif;font-weight:400;letter-spacing:.015em;color:var(--ink);
  font-size:clamp(2.1rem,3.4vw + .9rem,3.4rem);line-height:1.08;text-transform:uppercase;margin:0;}
.h-display .scr,.scr{font-family:'Kaushan Script',cursive;text-transform:none;color:var(--gold);
  font-size:1.18em;line-height:.72;display:inline-block;transform:rotate(-2deg);letter-spacing:0;}
.lede{max-width:56ch;}

/* pills — same family as the live site */
.pill{display:inline-flex;align-items:center;gap:.65rem;border-radius:var(--pill);cursor:pointer;
  background:var(--teal);color:#fff;font-weight:650;font-size:.9375rem;letter-spacing:.01em;
  padding:.72rem .8rem .72rem 1.35rem;text-decoration:none;border:2px solid var(--teal);
  position:relative;overflow:hidden;transition:background .28s var(--ease),border-color .28s var(--ease);}
.pill::after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;
  background:linear-gradient(105deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.28) 50%,rgba(255,255,255,0) 100%);
  transform:skewX(-18deg);transition:left .5s var(--ease);}
.pill:hover{background:var(--teal-deep);border-color:var(--teal-deep);}
.pill:hover::after{left:120%;}
.pill__chip{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:50%;background:rgba(255,255,255,.22);flex:none;}
.pill__chip svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.pill--ghost{background:transparent;color:var(--ink);border-color:rgba(46,35,24,.35);}
.pill--ghost .pill__chip{background:rgba(46,35,24,.12);}
.pill--ghost .pill__chip svg{stroke:var(--ink);}
.pill--ghost:hover{background:rgba(46,35,24,.06);border-color:rgba(46,35,24,.55);}
.pill--light{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.55);color:#fff;backdrop-filter:blur(4px);}
.pill--light .pill__chip{background:rgba(255,255,255,.2);}
.pill--light:hover{background:rgba(255,255,255,.24);border-color:#fff;}

/* ---------- menu page header ---------- */
.mhdr{position:relative;z-index:30;}
.mhdr__in{max-width:var(--wrap);margin:0 auto;padding:14px clamp(20px,4vw,48px);display:flex;align-items:center;gap:1.4rem;}
.mhdr__logo img{width:72px;height:auto;}
.mhdr__nav{display:flex;align-items:center;gap:clamp(1rem,2vw,1.8rem);margin-left:auto;}
.mhdr__nav a{color:var(--ink);text-decoration:none;font-weight:650;font-size:.9375rem;padding:4px 2px;border-bottom:2px solid transparent;
  transition:border-color .25s var(--ease);}
.mhdr__nav a:hover,.mhdr__nav a[aria-current="page"]{border-bottom-color:var(--gold);}
@media (max-width:640px){.mhdr__nav a:not(.pill):not([aria-current]){display:none;}}

/* ---------- search ---------- */
.msearch{position:relative;display:flex;align-items:center;background:var(--paper);border:2px solid rgba(46,35,24,.14);
  border-radius:var(--pill);box-shadow:0 14px 34px rgba(46,35,24,.08);transition:border-color .25s var(--ease),box-shadow .25s var(--ease);}
.msearch:focus-within{border-color:var(--teal);box-shadow:0 14px 34px rgba(46,156,142,.16);}
.msearch__icon{width:22px;height:22px;margin-left:1.2rem;stroke:var(--teal-deep);fill:none;stroke-width:2;flex:none;}
.msearch input{flex:1;min-width:0;border:0;background:transparent;padding:1rem .9rem;font-size:1.05rem;color:var(--ink);outline:none;}
.msearch input::placeholder{color:var(--muted);}
.msearch input::-webkit-search-cancel-button{display:none;}
.msearch__kbd{margin-right:1rem;font:600 .75rem/1 'Inter',sans-serif;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:.35rem .5rem;}
.msearch__clear{display:none;margin-right:.6rem;border:0;background:rgba(46,35,24,.08);width:32px;height:32px;border-radius:50%;cursor:pointer;
  align-items:center;justify-content:center;}
.msearch__clear svg{width:14px;height:14px;stroke:var(--ink);stroke-width:2.2;fill:none;stroke-linecap:round;}
.msearch.has-q .msearch__clear{display:inline-flex;}
.msearch.has-q .msearch__kbd{display:none;}
@media (hover:none){.msearch__kbd{display:none;}}

.mchips{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1rem;}
.mchip{display:inline-flex;align-items:center;gap:.45rem;border:1.5px solid rgba(46,35,24,.18);background:transparent;color:var(--ink);
  border-radius:var(--pill);padding:.45rem .9rem;font-size:.875rem;font-weight:650;cursor:pointer;
  transition:background .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease),transform .2s var(--ease);}
.mchip:hover{border-color:rgba(46,35,24,.4);transform:translateY(-1px);}
.mchip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--cream);}
.mchip i{font-style:normal;font-size:.75rem;opacity:.65;font-weight:600;}
.mchip__dot{width:8px;height:8px;border-radius:50%;flex:none;}

/* ---------- badges ---------- */
.mbadge{display:inline-flex;align-items:center;gap:.3rem;font-size:.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  padding:.22rem .55rem;border-radius:var(--pill);line-height:1.2;white-space:nowrap;}
.mbadge--signature{background:rgba(232,145,45,.15);color:var(--gold-deep);}
.mbadge--frozen{background:rgba(95,168,211,.16);color:#2F6F95;}
.mbadge--na{background:rgba(46,156,142,.14);color:var(--teal-deep);}
.mbadge--texas{background:rgba(46,35,24,.08);color:var(--ink);}
.mbadge--house{background:rgba(46,35,24,.06);color:var(--muted);}
.mbadge--icecream{background:rgba(217,98,142,.14);color:#A63F68;}
.mbadge svg{width:10px;height:10px;fill:currentColor;}

.mprice{font-family:'Tondu',Georgia,serif;color:var(--gold-deep);letter-spacing:.02em;white-space:nowrap;}
.mprice small{font:600 .7em/1 'Inter',system-ui,sans-serif;letter-spacing:.02em;color:var(--muted);text-transform:none;}
mark{background:rgba(232,145,45,.28);color:inherit;border-radius:3px;padding:0 .08em;}

/* empty state */
.mempty{text-align:center;padding:2.4rem 1rem;color:var(--body-c);}
.mempty b{display:block;font-family:'Tondu',Georgia,serif;font-weight:400;text-transform:uppercase;color:var(--ink);font-size:1.4rem;margin-bottom:.3rem;}