/* =========================================================================
   Storefront theme — "Order First"

   Dark, high-contrast, conversion-led. Ported from the design prototype
   (food_truck/design-3-bold-order-first.html) and adapted in three ways:

   1. --hot is set per restaurant from its brand colour, inline in the layout.
      The orange below is only the default for a restaurant that has not
      picked one.
   2. --tx3 was #6E6B68 in the prototype, which is 3.4:1 on --card and fails
      WCAG AA for the body text it was used for. Raised to #8A8781 (5.0:1).
      Do not put it back: it is used for dish metadata, not decoration.
   3. Motion is opt-in via body.mt-ready, and every animation is switched off
      under prefers-reduced-motion at the bottom of this file.

   Hand-written, no build step. The Tailwind entry in package.json is a dead
   Breeze leftover and is not used by any storefront page.
   ========================================================================= */

:root{
  --bg:#0C0C0E; --bg2:#141418; --bg3:#1C1C22; --card:#17171C;
  --tx:#F7F5F2; --tx2:#A8A5A0; --tx3:#8A8781;
  --hot:#FF5A1F; --hot2:#FF8A3D; --acid:#FFD84D; --mint:#3DDC97; --line:#2A2A32;
  --disp:"Arial Black","Helvetica Neue",Impact,system-ui,sans-serif;
  --sans:"Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:120px;overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--tx);font-family:var(--sans);line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.c{max-width:1240px;margin:0 auto;padding:0 24px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:16px;top:-60px;background:var(--hot);color:#fff;padding:12px 20px;
  border-radius:10px;z-index:200;font-weight:800;transition:top .15s}
.skip:focus{top:16px}
:focus-visible{outline:3px solid var(--acid);outline-offset:2px}

/* A photo tile. --photo is set inline per dish by App\Support\PlaceholderTile,
   which derives a warm gradient from the dish name so a menu is never a wall of
   grey boxes — nor, as it was before, a wall of eighteen identical orange ones.
   The literal below is only the last resort for a tile rendered without a seed. */
.photo{background:var(--photo,linear-gradient(150deg,#4A2A18,#FF5A1F 60%,#8A2D08));
  background-size:cover;background-position:center;position:relative;overflow:hidden}
.photo::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(12,12,14,.10) 45%,rgba(12,12,14,.55))}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* The initials watermark on a photo-less tile. Decorative and aria-hidden: the
   dish name is already the heading directly beneath it, so reading it twice
   would be noise. Sized off the tile, not the viewport, so the hero's large
   tile and a card's small one both look deliberate. */
.photo .mono{position:absolute;right:-.06em;bottom:-.28em;margin:0;
  font-family:var(--disp);font-size:clamp(64px,42%,150px);line-height:1;letter-spacing:-.06em;
  color:rgba(255,255,255,.14);text-transform:uppercase;pointer-events:none;user-select:none}
.item .photo .mono{font-size:82px}
.heroart .photo .mono{font-size:clamp(120px,20vw,230px);color:rgba(255,255,255,.11)}

/* ---------- LIVE BAR ----------
   Rendered with no state. open-now.js fills in the status against the
   BRANCH's clock, because this page is cached and a baked-in "Open now"
   eventually sends somebody to a closed kitchen. */
.livebar{background:var(--acid);color:#161005;font-weight:800;font-size:13px;letter-spacing:.2px;
  overflow:hidden;white-space:nowrap;position:relative}
.livebar .c{display:flex;align-items:center;gap:14px;padding-top:9px;padding-bottom:9px}
.livebar .sep{opacity:.55}
.livebar .push{margin-left:auto;font-weight:700}
/* Neutral until the script has actually decided, and only then coloured.
   Green-by-default meant a dot that had never been evaluated — no JS, a parse
   error, a missing payload — still claimed the kitchen was open. The dot is a
   status light; an unread one must look unread. */
.dot{width:9px;height:9px;border-radius:50%;background:#8C8C93;flex:0 0 9px}
.dot[data-open="yes"]{background:#0B7A3B}
.dot[data-open="no"]{background:#8A2D08}
/* Only pulse once it means something. */
body.mt-ready .dot[data-open]{animation:blip 1.6s infinite}
@keyframes blip{50%{opacity:.25}}
.livebar::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:38%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg)}
body.mt-ready .livebar::after{animation:barShine 7s ease-in-out 2s infinite}
@keyframes barShine{0%{left:-60%}28%,100%{left:160%}}

/* ---------- NAV ---------- */
header{position:sticky;top:0;z-index:80;background:rgba(12,12,14,.92);backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);transition:box-shadow .35s,background .35s}
header.stuck{box-shadow:0 18px 44px -30px #000,0 1px 0 var(--line);background:rgba(12,12,14,.96)}
header.stuck nav{padding:10px 0}
nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 0;
  transition:padding .35s var(--ease)}
.logo{display:flex;align-items:center;gap:11px;font-weight:900;min-width:0}
.logo .m{width:42px;height:42px;flex:0 0 42px;border-radius:12px;background:var(--hot);color:#fff;
  display:grid;place-items:center;font-family:var(--disp);font-size:17px;transform:rotate(-4deg);
  box-shadow:0 8px 22px -8px var(--hot);transition:transform .5s var(--ease-out)}
.logo:hover .m{transform:rotate(6deg) scale(1.08)}
.logo img{max-height:42px;width:auto;border-radius:10px}
.logo .t{line-height:1.05;min-width:0}
.logo .t b{display:block;font-family:var(--disp);font-size:18px;letter-spacing:-.6px;text-transform:uppercase;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:12rem}
.logo .t span{font-size:9.5px;letter-spacing:2.4px;color:var(--hot);font-weight:800}
.nl{display:flex;gap:22px;font-size:13.5px;font-weight:700;flex-wrap:wrap;justify-content:center}
.nl a{position:relative;transition:color .25s;padding:4px 0}
.nl a::after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:2px;background:var(--hot);
  border-radius:2px;transition:right .32s var(--ease)}
.nl a:hover::after,.nl a[aria-current="page"]::after{right:0}
.nl a:hover,.nl a[aria-current="page"]{color:var(--hot)}
.nav-cta{display:flex;gap:10px;align-items:center;flex:none}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:800;font-size:14px;
  padding:13px 26px;border-radius:12px;border:2px solid transparent;cursor:pointer;transition:.16s;
  white-space:nowrap;font-family:var(--sans);letter-spacing:.2px;min-height:44px;
  position:relative;overflow:hidden;isolation:isolate}
.btn-hot{background:var(--hot);color:#fff;box-shadow:0 10px 26px -10px var(--hot)}
.btn-hot:hover{filter:brightness(1.08);transform:translateY(-2px)}
.btn-acid{background:var(--acid);color:#161005}
.btn-acid:hover{background:#FFE271;transform:translateY(-2px)}
.btn-out{border-color:var(--line);color:var(--tx);background:var(--bg3)}
.btn-out:hover{border-color:var(--hot);color:var(--hot);background:rgba(255,90,31,.08)}
.btn-lg{padding:17px 34px;font-size:15.5px;border-radius:14px}
.btn-hot::after,.btn-acid::after{content:"";position:absolute;top:0;bottom:0;left:-130%;width:50%;z-index:-1;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
  transform:skewX(-18deg);transition:left .75s var(--ease)}
.btn-hot:hover::after,.btn-acid:hover::after{left:170%}
.btn-hot:active,.btn-acid:active{transform:translateY(1px) scale(.98)}
.burger{display:none;background:var(--bg3);border:1px solid var(--line);color:var(--tx);cursor:pointer;
  min-height:44px;min-width:44px;border-radius:12px;place-items:center;padding:0}
.burger__bars{display:block;width:16px;height:2px;background:currentColor;position:relative;margin:0 auto;
  transition:background .2s}
.burger__bars::before,.burger__bars::after{content:"";position:absolute;left:0;width:16px;height:2px;background:currentColor;
  transition:transform .3s var(--ease)}
.burger__bars::before{top:-5px}.burger__bars::after{top:5px}
.burger[aria-expanded="true"] .burger__bars{background:transparent}
.burger[aria-expanded="true"] .burger__bars::before{transform:translateY(5px) rotate(45deg)}
.burger[aria-expanded="true"] .burger__bars::after{transform:translateY(-5px) rotate(-45deg)}

/* Mobile drawer — the nav links collapse rather than disappear. */
.drawer{display:none;border-top:1px solid var(--line);background:var(--bg2);padding:8px 0 12px}
.drawer.open{display:block}
.drawer a{display:block;padding:14px 24px;font-weight:700;border-bottom:1px solid var(--line);
  min-height:44px;box-sizing:border-box;
  transition:background .2s,color .2s,padding-left .25s var(--ease)}
.drawer a:hover{background:rgba(255,90,31,.08);color:var(--hot);padding-left:30px}
.drawer a:last-child{border-bottom:0}

/* ---------- HERO ---------- */
.hero{position:relative;padding:70px 0 84px;overflow:hidden}
.hero::before{content:"";position:absolute;width:720px;height:720px;border-radius:50%;top:-330px;right:-230px;
  background:radial-gradient(circle,rgba(255,90,31,.24),transparent 66%)}
.hero::after{content:"";position:absolute;width:520px;height:520px;border-radius:50%;bottom:-300px;left:-200px;
  background:radial-gradient(circle,rgba(255,216,77,.12),transparent 68%)}
body.mt-ready .hero::before{animation:drift 20s ease-in-out infinite alternate}
body.mt-ready .hero::after{animation:drift 26s ease-in-out -8s infinite alternate}
@keyframes drift{to{transform:translate3d(30px,-24px,0) scale(1.08)}}
.hero .c{position:relative;z-index:1;display:grid;grid-template-columns:1.06fr .94fr;gap:56px;align-items:center}
.sticker{display:inline-flex;align-items:center;gap:8px;background:rgba(255,90,31,.14);
  border:1.5px solid rgba(255,90,31,.42);color:var(--hot2);font-size:11.5px;font-weight:900;
  letter-spacing:1.5px;text-transform:uppercase;padding:7px 15px;border-radius:99px}
h1{font-family:var(--disp);font-size:clamp(40px,7.2vw,86px);line-height:.94;letter-spacing:-2.6px;
  margin:22px 0 20px;text-transform:uppercase;overflow-wrap:break-word}
h1 .hl{color:var(--hot);display:inline-block;position:relative}
h1 .hl::after{content:"";position:absolute;left:-4px;right:-4px;bottom:6px;height:12px;
  background:rgba(255,216,77,.22);z-index:-1;transform-origin:left;transform:scaleX(1)}
body.mt-ready h1 .hl::after{transform:scaleX(0);transition:transform .9s var(--ease-out) .75s}
body.mt-ready h1.in .hl::after,
body.mt-ready .hero h1[data-hero-in].in .hl::after{transform:scaleX(1)}
h1 .out{-webkit-text-stroke:2px var(--tx);color:transparent}
.hero p.sub{font-size:18px;color:var(--tx2);max-width:48ch;margin:0 0 30px}
.herobtns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}
.microrow{display:flex;gap:22px;flex-wrap:wrap;font-size:13px;color:var(--tx2)}
.microrow span{display:flex;align-items:center;gap:7px}
.microrow b{color:var(--tx)}

.heroart{position:relative;height:520px}
.heroart .main{position:absolute;inset:0 0 60px 40px;border-radius:26px;
  box-shadow:0 40px 90px -40px rgba(0,0,0,.9)}
.heroart .chip{position:absolute;background:var(--card);border:1px solid var(--line);border-radius:16px;
  padding:13px 16px;box-shadow:0 20px 50px -22px rgba(0,0,0,.95);display:flex;align-items:center;gap:11px;
  transition:box-shadow .4s;max-width:min(280px,72vw)}
.heroart .chip:hover{box-shadow:0 24px 60px -24px var(--hot)}
.heroart .chip .ic{width:38px;height:38px;flex:0 0 38px;border-radius:11px;display:grid;place-items:center;font-size:18px}
.heroart .chip b{display:block;font-size:14px;line-height:1.2}
.heroart .chip span{font-size:11.5px;color:var(--tx3)}
.chip1{left:-14px;top:52px}
.chip2{right:-6px;top:210px}
.chip3{left:24px;bottom:14px}
body.mt-ready .chip{animation:float 6.5s ease-in-out .95s infinite}
body.mt-ready .chip2{animation-duration:8s;animation-delay:1.4s}
body.mt-ready .chip3{animation-duration:7.2s;animation-delay:1.9s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.spin{position:absolute;right:-18px;top:-16px;width:112px;height:112px;border-radius:50%;background:var(--acid);
  color:#161005;display:grid;place-items:center;text-align:center;font-family:var(--disp);font-size:12px;
  line-height:1.15;text-transform:uppercase;transform:rotate(-12deg) scale(1);
  box-shadow:0 16px 40px -14px rgba(255,216,77,.8)}
.spin b{display:block;font-size:26px;letter-spacing:-1px}
body.mt-ready .spin{transform:rotate(-12deg) scale(.4);opacity:0;
  transition:transform .7s var(--ease-out),opacity .7s var(--ease-out)}
body.mt-ready .spin.in{transform:rotate(-12deg) scale(1);opacity:1;
  animation:spinBreathe 5.5s ease-in-out 1.5s infinite}
@keyframes spinBreathe{0%,100%{transform:rotate(-12deg) scale(1)}50%{transform:rotate(-8deg) scale(1.06)}}

/* ---------- MARQUEE ---------- */
.marq{background:var(--hot);color:#fff;padding:14px 0;overflow:hidden;white-space:nowrap;
  transform:rotate(-1.2deg);margin:-14px 0 0;box-shadow:0 14px 40px -18px var(--hot)}
.marq .t{display:inline-flex;font-family:var(--disp);font-size:18px;letter-spacing:-.4px;text-transform:uppercase}
body.mt-ready .marq .t{animation:mv 26s linear infinite}
.marq:hover .t{animation-play-state:paused}
.marq .t span{padding:0 26px}
.marq .t span::after{content:"★";margin-left:26px;color:var(--acid)}
@keyframes mv{to{transform:translateX(-50%)}}

/* ---------- SECTIONS ---------- */
section{padding:92px 0}
.shead{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:44px;flex-wrap:wrap}
h2{font-family:var(--disp);font-size:clamp(28px,4.6vw,52px);line-height:1;letter-spacing:-1.8px;
  margin:14px 0 0;text-transform:uppercase;overflow-wrap:break-word}
h2 .hl{color:var(--hot)}
.shead p{color:var(--tx2);margin:10px 0 0;max-width:52ch;font-size:15.5px}

/* ---------- ORDER MODES ---------- */
.modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(16rem,100%),1fr));gap:16px}
.mode{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:26px 24px;
  transition:.2s;position:relative;overflow:hidden;display:block;color:inherit;text-decoration:none}
.mode:hover{border-color:var(--hot);transform:translateY(-4px)}
.mode .ic{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;font-size:24px;
  margin-bottom:16px;background:rgba(255,90,31,.13);border:1px solid rgba(255,90,31,.3);
  transition:transform .5s var(--ease-out)}
.mode:hover .ic{transform:rotate(-8deg) scale(1.12)}
.mode h3{font-family:var(--disp);font-size:19px;letter-spacing:-.5px;text-transform:uppercase;margin:0 0 8px}
.mode p{font-size:14px;color:var(--tx2);margin:0 0 16px}
.mode .eta{font-size:12px;font-weight:800;color:var(--mint);letter-spacing:.6px;text-transform:uppercase}
.mode.on{border-color:var(--hot);background:linear-gradient(160deg,rgba(255,90,31,.1),transparent 60%),var(--card)}
.mode .flag{position:absolute;top:16px;right:16px;background:var(--acid);color:#161005;font-size:10px;
  font-weight:900;letter-spacing:1px;text-transform:uppercase;padding:5px 11px;border-radius:99px}

/* ---------- MENU ---------- */
.filters{display:flex;gap:9px;overflow-x:auto;padding-bottom:6px;margin-bottom:28px}
.f{flex:0 0 auto;padding:10px 20px;border-radius:99px;border:1.5px solid var(--line);background:var(--bg2);
  font-size:13.5px;font-weight:800;cursor:pointer;color:var(--tx2);white-space:nowrap;min-height:44px;
  transition:transform .2s var(--ease),background .2s,border-color .2s,color .2s}
.f:hover{border-color:var(--hot);color:var(--hot);transform:translateY(-2px)}
.f[aria-pressed="true"],.f.is-on{background:var(--hot);border-color:var(--hot);color:#fff;box-shadow:0 8px 22px -10px var(--hot)}
.f--diet[aria-pressed="true"],.f--diet.is-on,.f--spice[aria-pressed="true"],.f--spice.is-on{
  background:rgba(255,216,77,.12);border-color:var(--acid);color:var(--acid);box-shadow:none}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(268px,100%),1fr));gap:20px}
.item{background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;
  transition:.2s;display:flex;flex-direction:column;position:relative}
.item::before{content:"";position:absolute;inset:-1px;border-radius:20px;pointer-events:none;z-index:2;
  background:linear-gradient(140deg,var(--hot),var(--acid));opacity:0;transition:opacity .4s;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;padding:1.5px}
.item:hover{transform:translateY(-5px);border-color:#3A3A46;box-shadow:0 30px 60px -34px #000}
.item:hover::before{opacity:.85}
.item.soldout:hover::before{opacity:0}
.item .badge{transition:transform .35s var(--ease-out)}
.item:hover .badge{transform:translateY(-2px) scale(1.05)}
.item .photo{height:172px}
.item .b{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1}
.item .top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.item h3,.item h4{font-size:16.5px;font-weight:800;margin:0;letter-spacing:-.3px;font-family:var(--sans);text-transform:none}
.item .pr{font-family:var(--disp);font-size:19px;color:var(--acid);letter-spacing:-.6px;white-space:nowrap;
  transition:transform .35s var(--ease-out)}
.item:hover .pr{transform:scale(1.12)}
.item p{font-size:13.3px;color:var(--tx2);margin:7px 0 0;flex:1}
.meta{display:flex;gap:10px;align-items:center;margin-top:14px;font-size:11.5px;color:var(--tx3);
  font-weight:700;flex-wrap:wrap}
.meta .r{color:var(--acid)}
.addgo{margin-top:14px;width:100%;justify-content:center;text-align:center;display:flex}
.addgo.is-busy{opacity:.85;cursor:wait}
.addgo.is-done{background:var(--mint);border-color:var(--mint);color:#06281a;box-shadow:none}
.addgo.is-done:hover{filter:none;transform:none}
.badge{position:absolute;top:12px;left:12px;z-index:2;font-size:10px;font-weight:900;letter-spacing:1.1px;
  text-transform:uppercase;padding:6px 12px;border-radius:99px}
.b-hot{background:var(--hot);color:#fff}
.b-new{background:var(--acid);color:#161005}
.b-out{background:var(--bg3);color:var(--tx2);border:1px solid var(--line)}
.soldout{opacity:.62;filter:grayscale(.55)}

/* Full /menu page shell */
.menu-hero{padding:48px 0 8px}
.menu-hero .shead{margin-bottom:28px}
.menu-tools-bold{margin-bottom:10px}
.menu-search-bold{display:block;margin:0 0 14px}
.menu-search-bold input{width:100%;max-width:28rem;padding:13px 16px;border:1px solid var(--line);
  border-radius:14px;background:var(--bg3);color:var(--tx);font:inherit;font-size:16px}
.menu-search-bold input:focus-visible{outline:2px solid var(--hot);outline-offset:2px;border-color:transparent}
.filters--sticky{
  position:sticky;top:calc(42px + 30px + 2px); /* logo + nav padding + border ≈ sticky header */
  z-index:40;
  background:linear-gradient(180deg,rgba(12,12,14,.96),rgba(12,12,14,.88));
  backdrop-filter:blur(12px);
  padding:12px 0 14px;margin-bottom:8px;
  border-bottom:1px solid transparent;
}
header.stuck ~ main .filters--sticky,
body:has(header.stuck) .filters--sticky{
  top:calc(42px + 20px + 2px);
  border-bottom-color:var(--line)
}
.f--diet.is-on,.f--spice.is-on{border-color:var(--acid);color:var(--acid)}
.menu-block{padding-top:28px;padding-bottom:12px}
.menu-serve{display:inline-flex;margin:0 0 22px;padding:7px 14px;border-radius:999px;
  background:rgba(255,90,31,.12);border:1px solid rgba(255,90,31,.28);color:var(--hot2);
  font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase}
.menu-sect-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin:28px 0 8px}
.menu-sect-head h3{font-family:var(--disp);font-size:clamp(20px,3vw,26px);text-transform:uppercase;
  letter-spacing:-.6px;margin:0;scroll-margin-top:120px}
.menu-sect-head span{font-size:12px;font-weight:800;color:var(--tx3);letter-spacing:1px}
.menu-sect-lead{color:var(--tx2);margin:0 0 18px;max-width:60ch;font-size:14.5px}
.cards--menu{margin-bottom:8px}
.cards--menu .item .photo{height:190px}
.cards--menu .item .photo img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.cards--menu .item:hover .photo img{transform:scale(1.06)}
.cards--menu .meta span{
  padding:4px 8px;border-radius:999px;border:1px solid var(--line);background:var(--bg2)
}
.cards--menu .meta .r{border-color:rgba(255,216,77,.35);background:rgba(255,216,77,.08)}
/* The add row: quantity beside the button rather than above it, so the card
   keeps its height and a grid of dishes stays on one baseline. */
.addgo-form{margin-top:14px;display:flex;gap:10px;align-items:stretch}
.addgo-form .addgo{margin-top:0;flex:1}

.qty{display:flex;align-items:stretch;border:1.5px solid var(--line);border-radius:12px;
  background:var(--bg2);overflow:hidden;flex:0 0 auto}
.qty__input{width:56px;border:0;background:transparent;color:var(--tx);text-align:center;
  font-family:var(--sans);font-size:15px;font-weight:800;padding:0 4px;min-height:44px;
  -moz-appearance:textfield;appearance:textfield}
.qty__input::-webkit-outer-spin-button,
.qty__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.qty__input:focus{outline:none}
.qty:focus-within{border-color:var(--hot)}

/* The −/+ buttons only exist once site-bold.js has added them; without JS the
   number input keeps its own native spinners, which is why the rules above
   strip them only when a stepper is present. */
.qty--stepper .qty__input{width:40px}
.qty__step{border:0;background:transparent;color:var(--tx2);font-size:18px;font-weight:800;
  width:36px;min-height:44px;cursor:pointer;line-height:1;transition:color .15s,background .15s}
.qty__step:hover:not(:disabled){color:var(--hot);background:rgba(255,90,31,.08)}
.qty__step:disabled{opacity:.35;cursor:not-allowed}

@media(max-width:380px){
  .addgo-form{flex-wrap:wrap}
  .addgo-form .addgo{flex:1 1 100%}
}
.addgo-form .addgo{width:100%}
.menu-foot{padding-top:12px;padding-bottom:64px}
.menu-cta-bold{margin-top:28px;padding:22px 24px;border:1px solid var(--line);border-radius:20px;
  background:var(--card);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.menu-cta-bold h3{margin:8px 0 0;font-size:22px;letter-spacing:-.4px}
.menu-cta-bold__btns{display:flex;flex-wrap:wrap;gap:10px}
@media (prefers-reduced-motion:reduce){
  .cards--menu .item:hover .photo img{transform:none}
}
.empty{border:1px dashed var(--line);border-radius:20px;padding:40px 24px;text-align:center;color:var(--tx2)}

/* ---------- COMBO BANNER ---------- */
.combo{background:linear-gradient(112deg,var(--hot),#C43A0C 62%,#7A2306);border-radius:26px;padding:44px 48px;
  display:grid;grid-template-columns:1.2fr .8fr;gap:36px;align-items:center;position:relative;overflow:hidden;
  transition:transform .5s var(--ease)}
.combo:hover{transform:translateY(-5px)}
.combo::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-120px;top:-160px;
  background:rgba(255,216,77,.16)}
.combo h3{font-family:var(--disp);font-size:clamp(26px,3.8vw,44px);line-height:.98;letter-spacing:-1.6px;
  text-transform:uppercase;margin:12px 0 12px;position:relative}
.combo p{color:rgba(255,255,255,.9);margin:0 0 24px;font-size:15.5px;position:relative;max-width:44ch}
.combo .price{position:relative;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.combo .price b{font-family:var(--disp);font-size:clamp(38px,6vw,58px);letter-spacing:-3px;line-height:1}
.combo .price s{color:rgba(255,255,255,.7);font-size:20px}
.combo .price em{font-style:normal;font-size:12px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;
  background:var(--acid);color:#161005;padding:5px 11px;border-radius:99px}

/* ---------- HOW ---------- */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(14rem,100%),1fr));gap:18px;counter-reset:s}
.step{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:26px 22px;position:relative;
  transition:transform .45s var(--ease),border-color .3s}
.step:hover{transform:translateY(-6px);border-color:var(--hot)}
.step::before{counter-increment:s;content:"0" counter(s);position:absolute;top:18px;right:20px;
  font-family:var(--disp);font-size:34px;color:var(--bg3);letter-spacing:-2px;transition:color .35s}
.step:hover::before{color:var(--hot)}
.step .ic{font-size:26px;margin-bottom:12px;display:inline-block;transition:transform .5s var(--ease-out)}
.step:hover .ic{transform:translateY(-4px) rotate(-8deg) scale(1.12)}
.step h3{font-size:16px;font-weight:800;margin:0 0 7px;font-family:var(--sans);text-transform:none;letter-spacing:0}
.step p{font-size:13.5px;color:var(--tx2);margin:0}

/* ---------- REVIEWS ---------- */
.revs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:18px}
.rev{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px;
  display:flex;flex-direction:column;
  transition:transform .45s var(--ease),border-color .3s,box-shadow .45s}
.rev:hover{transform:translateY(-6px);border-color:#3A3A46;box-shadow:0 28px 50px -34px #000}
.rev .st{color:var(--acid);letter-spacing:2px;font-size:14px;margin-bottom:12px}
.rev p{font-size:14.5px;margin:0 0 18px;color:var(--tx);line-height:1.55;flex:1}
.rev .w{display:flex;align-items:center;gap:11px;margin-top:auto}
.rev .av{width:38px;height:38px;border-radius:50%;background:var(--hot);color:#fff;display:grid;
  place-items:center;font-weight:900;font-size:14px;flex:0 0 38px}
.rev .w b{display:block;font-size:13.5px}
.rev .w span{font-size:11.5px;color:var(--tx3)}
.rev__top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px}
.rev__stars{display:flex!important;gap:2px;letter-spacing:0!important;margin-bottom:0!important}
.rev__source{font-size:10px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--tx3);border:1px solid var(--line);border-radius:999px;padding:4px 8px;background:var(--bg3)}
.rev-star{color:#3A3A46;display:inline-block;position:relative;transition:color .3s,transform .4s var(--ease)}
.rev-star.is-on{color:var(--acid)}
.rev-star--partial{color:transparent}
.rev-star__base{color:#3A3A46}
.rev-star__fill{position:absolute;inset:0 auto 0 0;width:var(--fill,50%);overflow:hidden;color:var(--acid)}
.scoreband{display:flex;gap:34px;flex-wrap:wrap;justify-content:center;align-items:center;background:var(--bg2);
  border:1px solid var(--line);border-radius:20px;padding:26px 32px;margin-bottom:34px}
.scoreband__item,.scoreband div{text-align:center;transition:transform .4s var(--ease)}
.scoreband__item:hover,.scoreband div:hover{transform:translateY(-4px)}
.scoreband b{display:block;font-family:var(--disp);font-size:34px;letter-spacing:-1.4px;color:var(--acid)}
.scoreband span{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--tx2);font-weight:800}
.scoreband__stars{display:flex;gap:4px;font-size:18px;width:100%;justify-content:center;margin-top:2px}
.rev-board--bold{
  margin:0 0 36px;padding:28px 30px;border:1px solid var(--line);border-radius:22px;
  background:
    radial-gradient(90% 70% at 10% 0%,rgba(255,90,31,.16),transparent 55%),
    linear-gradient(160deg,var(--card),var(--bg2));
  box-shadow:0 28px 50px -36px #000;
}
.rev-board--bold .rev-board__score{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.rev-board--bold .rev-board__value{font-family:var(--disp);font-size:clamp(52px,8vw,72px);
  letter-spacing:-3px;line-height:.9;color:var(--acid)}
.rev-board--bold .rev-board__of{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;
  color:var(--tx2);font-weight:800}
.rev-board--bold .rev-board__stars{display:flex;gap:4px;font-size:20px}
.rev-board--bold .rev-board__meter{margin:18px 0 14px;height:6px;border-radius:999px;background:var(--bg3);overflow:hidden}
.rev-board--bold .rev-board__meter-fill{display:block;height:100%;border-radius:inherit;
  background:linear-gradient(90deg,var(--hot),var(--acid));transform-origin:left center}
.rev-board--bold .rev-board__count{margin:0;font-size:15px;color:var(--tx)}
.rev-board--bold .rev-board__note{margin:4px 0 0;font-size:12.5px;color:var(--tx3)}
.rev-pager{margin-top:34px}

@keyframes boldMeterIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
body.mt-ready .rev-board[data-reveal]{opacity:0;transform:translateY(18px);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
body.mt-ready .rev-board[data-reveal].in{opacity:1;transform:none}
body.mt-ready .rev-board.in .rev-board__meter-fill{animation:boldMeterIn .85s var(--ease-out) .12s both}

/* ---------- VISIT ---------- */
.visit{background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.vgrid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.hourcard{background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;
  box-shadow:0 22px 48px -28px rgba(0,0,0,.55)}
.hourcard .h{padding:18px 22px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;
  align-items:flex-start;gap:12px;flex-wrap:wrap}
.hourcard__eyebrow{display:block;font-size:11px;letter-spacing:1.6px;text-transform:uppercase;
  color:var(--hot);font-weight:800;margin:0 0 6px}
.hourcard .h b{display:block;font-family:var(--disp);font-size:20px;text-transform:uppercase;letter-spacing:-.5px;
  line-height:1.15}
.pillnow{background:rgba(61,220,151,.14);color:var(--mint);font-size:11px;font-weight:900;letter-spacing:1.2px;
  text-transform:uppercase;padding:6px 13px;border-radius:99px;display:inline-flex;align-items:center;gap:7px}
.pillnow[data-open="no"]{background:rgba(255,90,31,.14);color:var(--hot2)}
.pillnow i{width:7px;height:7px;border-radius:50%;background:currentColor}
body.mt-ready .pillnow i{animation:blip 1.6s infinite}
.hourcard table{width:100%;border-collapse:collapse;margin:0}
.hourcard caption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hourcard th,.hourcard td{padding:12px 22px;border-bottom:1px solid var(--line);font-size:14px;
  color:var(--tx2);text-align:left;font-weight:400;transition:padding-left .3s var(--ease),color .3s}
.hourcard th{color:var(--tx);font-weight:700}
.hourcard td{text-align:right;font-variant-numeric:tabular-nums}
.hourcard tr:last-child th,.hourcard tr:last-child td{border-bottom:0}
.hourcard tr:hover th{color:var(--hot)}
.hourcard tr.is-closed td{font-style:italic;opacity:.7}
.mapd{height:280px;border-radius:20px;border:1px solid var(--line);position:relative;overflow:hidden;
  margin-bottom:16px;background:
  repeating-linear-gradient(0deg,transparent 0 43px,var(--line) 43px 44px),
  repeating-linear-gradient(90deg,transparent 0 43px,var(--line) 43px 44px),var(--bg3)}
.mapd .rd{position:absolute;background:#2F2F3A}
.mapd .pin{position:absolute;left:50%;top:45%;transform:translate(-50%,-100%);text-align:center}
.mapd .pin i{display:block;width:24px;height:24px;border-radius:50% 50% 50% 0;background:var(--hot);
  transform:rotate(-45deg);margin:0 auto 12px;box-shadow:0 0 0 8px rgba(255,90,31,.18)}
body.mt-ready .mapd .pin i{animation:pinDrop .9s var(--ease-out) .25s both}
@keyframes pinDrop{0%{transform:rotate(-45deg) translateY(-50px);opacity:0}
  62%{transform:rotate(-45deg) translateY(7px);opacity:1}
  100%{transform:rotate(-45deg) translateY(0);opacity:1}}
.mapd .pin span{background:var(--tx);color:var(--bg);font-size:11px;font-weight:900;padding:5px 12px;
  border-radius:99px;white-space:nowrap}
.mapd .cap{position:absolute;left:12px;bottom:10px;font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--tx2)}
.contactrow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cc{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 18px}
.cc span{display:block;font-size:10.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--tx2);
  font-weight:800;margin-bottom:5px}
.cc b{font-size:15px}

/* ---------- ALLERGEN NOTICE ----------
   Legally load-bearing (FIR 2011 / Natasha's Law), so it is styled to be read,
   not to be a footnote. */
.allergen-note{border:1px solid rgba(255,216,77,.4);background:rgba(255,216,77,.08);border-radius:16px;
  padding:18px 22px;margin:34px 0 0;font-size:14px}
.allergen-note p{margin:0;color:var(--tx)}

/* ---------- BOOKING ----------
   The only form on the storefront, and the one page where this theme's dark
   palette is a hazard rather than a look: a browser's default input is white
   with black text, so an unstyled field here renders as a bright slab and the
   focus ring vanishes against it. Every control is therefore given an explicit
   background, border and focus state — none of it is decorative.

   Font size on inputs is pinned to 16px: iOS Safari zooms the viewport on any
   focused input below that, and a form that jumps as you tab through it is how
   a booking gets abandoned halfway. */
.bkwrap{max-width:44rem}
.bkgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(11rem,100%),1fr));gap:14px}
.bkf label{display:block;font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;
  color:var(--tx2);margin-bottom:7px}
.bkf input,.bkf select{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:12px;
  background:var(--bg3);color:var(--tx);font-family:inherit;font-size:16px;appearance:none;
  transition:border-color .2s,box-shadow .2s}
.bkf input::placeholder{color:var(--tx3)}
.bkf input:focus-visible,.bkf select:focus-visible{outline:2px solid var(--hot);outline-offset:2px;
  border-color:transparent}
.bkf select{background-image:linear-gradient(45deg,transparent 50%,var(--tx2) 50%),
  linear-gradient(135deg,var(--tx2) 50%,transparent 50%);
  background-position:calc(100% - 19px) 50%,calc(100% - 13px) 50%;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:40px}

.bk-steps{list-style:none;margin:0 0 28px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.bk-steps li{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;
  border:1px solid var(--line);background:var(--bg3);color:var(--tx3);font-size:12.5px;font-weight:800}
.bk-steps li span{display:grid;place-items:center;width:22px;height:22px;border-radius:999px;
  background:var(--card);font-size:11px}
.bk-steps li.is-done{border-color:rgba(255,90,31,.35);color:var(--hot);background:rgba(255,90,31,.08)}
.bk-steps li.is-now{border-color:var(--hot);color:#fff;background:var(--hot)}
.bk-steps li.is-now span{background:rgba(255,255,255,.2)}

.bk-panel{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px 22px 24px;
  margin-bottom:18px}
.bk-panel__head{margin:0 0 16px}
.bk-panel__head h3{margin:8px 0 0;font-size:22px;letter-spacing:-.5px}
.bk-chips{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.bk-chips li{padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--bg3);
  color:var(--tx2);font-size:12px;font-weight:800}
.bk-times{border:0;padding:0;margin:0}
.bk-submit{margin-top:28px;display:grid;gap:10px;justify-items:start}
.bk-empty{padding:22px;border:1px solid var(--line);border-radius:20px;background:var(--card)}
.bk-confirm__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.bk-confirm__cancel{margin-top:24px}

.bkslots{display:grid;grid-template-columns:repeat(auto-fill,minmax(5.4rem,1fr));gap:8px;margin-top:8px}
.bkslot{position:relative}
.bkslot input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.bkslot span{display:block;text-align:center;padding:12px 6px;border:1px solid var(--line);
  border-radius:12px;font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;
  background:var(--bg3);transition:transform .28s var(--ease),border-color .15s,background .15s,box-shadow .28s}
.bkslot:hover input:not(:disabled) + span{transform:translateY(-3px);border-color:#3A3A46;
  box-shadow:0 14px 28px -20px #000}
.bkslot input:checked + span{background:var(--hot);border-color:var(--hot);color:#fff;
  box-shadow:0 14px 30px -14px var(--hot)}
.bkslot input:focus-visible + span{outline:2px solid var(--hot);outline-offset:2px}
.bkslot input:disabled + span{opacity:.45;text-decoration:line-through;cursor:not-allowed;
  background:transparent}

.bkerr{color:#FF8A7A;font-size:14px;font-weight:700;margin:8px 0 0}
.bknote{color:var(--tx2);font-size:14px}
.bkflash{border-radius:14px;padding:16px 18px;margin:0 0 24px;font-size:15px;font-weight:700}
.bkflash.ok{border:1px solid rgba(61,220,151,.45);background:rgba(61,220,151,.1);color:var(--mint)}
.bkflash.bad{border:1px solid rgba(255,138,122,.45);background:rgba(255,138,122,.1);color:#FF8A7A}

.bksum{width:100%;border-collapse:collapse;font-size:15px}
.bksum th,.bksum td{text-align:left;padding:14px 0;border-bottom:1px solid var(--line);vertical-align:top}
.bksum th{color:var(--tx2);font-weight:700;width:9rem}
.bksum tr:last-child th,.bksum tr:last-child td{border-bottom:0}

@keyframes boldSlotIn{
  from{opacity:0;transform:translateY(8px) scale(.92)}
  to{opacity:1;transform:none}
}
body.mt-ready .bk-panel[data-reveal]{opacity:0;transform:translateY(22px) scale(.98);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);
  transition-delay:calc(var(--i,0)*80ms)}
body.mt-ready .bk-panel[data-reveal].in{opacity:1;transform:none}
body.mt-ready .bk-panel.in .bkslot{animation:boldSlotIn .4s var(--ease-out) both;
  animation-delay:calc(.06s + min(var(--s,0),10) * 30ms)}
body.mt-ready .bk-steps[data-reveal]{opacity:0;transform:translateY(14px);
  transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}
body.mt-ready .bk-steps[data-reveal].in{opacity:1;transform:none}

/* ---------- BIG CTA ---------- */
.bigcta{text-align:center;padding:110px 0}
.bigcta h2{font-size:clamp(34px,8vw,96px);letter-spacing:-3px}
.bigcta p{color:var(--tx2);max-width:50ch;margin:18px auto 34px;font-size:16.5px}

/* ---------- FOOTER ---------- */
footer{background:
    radial-gradient(80% 60% at 12% 0%, rgba(255,90,31,.10), transparent 55%),
    linear-gradient(180deg,var(--bg2),#08080A);
  border-top:1px solid var(--line);padding:72px 0 30px;font-size:14px;color:var(--tx2);
  position:relative;overflow:hidden}
footer::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--hot),var(--acid),transparent 70%)}
.fg{display:grid;grid-template-columns:1.75fr 1fr 1fr 1fr;gap:44px 36px;margin-bottom:46px;position:relative}
footer h2{color:var(--tx);font-size:11px;letter-spacing:1.8px;text-transform:uppercase;font-weight:900;
  margin:0 0 16px;font-family:var(--sans)}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin:10px 0;line-height:1.45;max-width:30ch}
footer li a{display:inline-block;transition:transform .3s var(--ease),color .25s}
footer li a:hover{transform:translateX(5px);color:var(--hot)}
.ftr-brand__logo{margin-bottom:16px}
.ftr-brand__logo .t b{color:var(--tx)}
.ftr-blurb{max-width:36ch;margin:0 0 18px;line-height:1.55;color:var(--tx2);font-size:14.5px}
.ftr-quick{display:flex;flex-direction:column;gap:8px;margin:0 0 18px}
.ftr-chip{display:flex;align-items:baseline;gap:10px;padding:10px 12px;border-radius:12px;
  border:1px solid var(--line);background:rgba(255,255,255,.02);transition:border-color .2s,background .2s,transform .25s var(--ease)}
.ftr-chip:hover{border-color:rgba(255,90,31,.45);background:rgba(255,90,31,.06);transform:translateY(-2px)}
.ftr-chip__k{font-size:10px;font-weight:900;letter-spacing:1.4px;text-transform:uppercase;color:var(--hot2);flex:0 0 auto}
.ftr-chip__v{color:var(--tx);font-weight:700;font-size:13.5px;overflow-wrap:anywhere}
.ftr-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.ftr-cta .btn{min-height:42px}
.ftr-count{display:inline-grid;place-items:center;min-width:21px;height:21px;margin-left:8px;
  padding:0 5px;border-radius:50%;background:var(--acid);color:#161005;font-size:11px;font-weight:900}
.ftr-addr{color:var(--tx2)}
.soc{display:flex;gap:9px;margin-top:16px}
.soc a{width:44px;height:44px;border-radius:11px;border:1px solid var(--line);display:grid;place-items:center;
  font-weight:800;transition:transform .35s var(--ease-out),background .25s,border-color .25s}
.soc a:hover{background:var(--hot);border-color:var(--hot);color:#fff;transform:translateY(-4px) rotate(-8deg)}
.fb{border-top:1px solid var(--line);padding-top:22px;display:flex;justify-content:space-between;gap:16px 28px;
  flex-wrap:wrap;font-size:12px;color:var(--tx3);align-items:center;position:relative}
.fb__meta,.fb__credit{display:flex;flex-wrap:wrap;gap:6px 0;align-items:center}
.fb__meta span:not(:last-child)::after,
.fb__credit span:not(:last-child)::after{content:"·";margin:0 10px;opacity:.5}
.fb a{border-bottom:1px solid var(--line);transition:color .25s,border-color .25s;color:inherit}
.fb a:hover{color:var(--hot);border-color:var(--hot)}

/* ---------- STICKY MOBILE BAR ----------
   Hidden on desktop. Body/footer clearance only applies ≤640px where the bar
   is actually shown — otherwise the page ends in a tall empty black strip. */
.stickybar{position:fixed;left:0;right:0;bottom:0;z-index:90;background:rgba(20,20,24,.96);
  backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:12px 16px;display:none;gap:12px;
  align-items:center;transform:translateY(110%);transition:transform .45s var(--ease-out)}
body.scrolled .stickybar{transform:none}
.stickybar .info{flex:1;min-width:0}
.stickybar .info b{display:block;font-size:13.5px}
.stickybar .info span{font-size:11.5px;color:var(--mint);font-weight:700}
.stickybar .btn{flex:0 0 auto;min-height:44px}

/* Toast after AJAX add-to-order */
.cart-toast{position:fixed;left:50%;bottom:24px;z-index:120;transform:translate(-50%,18px);
  max-width:min(28rem,calc(100vw - 32px));padding:12px 18px;border-radius:14px;
  background:var(--card);border:1px solid var(--line);color:var(--tx);font-size:14px;font-weight:700;
  box-shadow:0 18px 40px -20px #000;opacity:0;pointer-events:none;
  transition:opacity .25s var(--ease-out),transform .25s var(--ease-out)}
.cart-toast.is-on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.cart-toast.is-err{border-color:rgba(255,90,31,.55);background:#2a1510}
body.has-stickybar .cart-toast{bottom:88px}
@media(min-width:641px){
  body.has-stickybar .cart-toast{bottom:24px}
}
@media (prefers-reduced-motion:reduce){
  .cart-toast{transition:none}
}

/* ---------- REVEAL ON SCROLL ----------
   Applied by site-bold.js only. Without JS every element stays visible, which
   is why the hidden state lives under .mt-ready rather than on the element. */
body.mt-ready [data-reveal]{opacity:0;transform:translateY(22px);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out),filter .7s var(--ease-out)}
body.mt-ready [data-reveal].in{opacity:1;transform:none;filter:none}
body.mt-ready .cards [data-reveal]{filter:blur(2px);transform:translateY(28px) scale(.98);
  transition-delay:calc(var(--i, 0) * 55ms)}
body.mt-ready .cards [data-reveal].in{filter:blur(0);transform:none}
body.mt-ready .revs [data-reveal]{opacity:0;transform:translateY(28px) scale(.97);filter:blur(2px);
  transition:opacity .75s var(--ease-out),transform .75s var(--ease-out),filter .75s var(--ease-out);
  transition-delay:calc(var(--i, 0) * 70ms)}
body.mt-ready .revs [data-reveal].in{opacity:1;transform:none;filter:none}
body.mt-ready .hourcard[data-reveal]{transform:translateY(28px) scale(.98)}
body.mt-ready .hourcard[data-reveal].in{transform:none}

@keyframes boldStarPop{
  from{opacity:0;transform:scale(.55) translateY(6px)}
  to{opacity:1;transform:none}
}
body.mt-ready .rev.in .rev-star.is-on{
  animation:boldStarPop .5s var(--ease-out) both;
  animation-delay:calc(.1s + var(--s,1) * 50ms)}
body.mt-ready .scoreband.in .rev-star.is-on{
  animation:boldStarPop .45s var(--ease-out) both;
  animation-delay:calc(.08s + var(--s,1) * 40ms)}
body.mt-ready .scoreband[data-reveal]{opacity:0;transform:translateY(18px);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
body.mt-ready .scoreband[data-reveal].in{opacity:1;transform:none}

/* Home hero entrance — only after mt-ready so a failed script never blanks copy */
@keyframes heroIn{
  from{opacity:0;transform:translateY(24px)}
  to{opacity:1;transform:none}
}
@keyframes heroArtIn{
  from{opacity:0;transform:translateY(30px) scale(.96)}
  to{opacity:1;transform:none}
}
body.mt-ready [data-hero-in]{opacity:0;animation:heroIn .8s var(--ease-out) both}
body.mt-ready .hero-copy [data-hero-in]:nth-child(1){animation-delay:.05s}
body.mt-ready .hero-copy [data-hero-in]:nth-child(2){animation-delay:.14s}
body.mt-ready .hero-copy [data-hero-in]:nth-child(3){animation-delay:.24s}
body.mt-ready .hero-copy [data-hero-in]:nth-child(4){animation-delay:.34s}
body.mt-ready .hero-copy [data-hero-in]:nth-child(5){animation-delay:.44s}
body.mt-ready .heroart[data-hero-in]{animation:heroArtIn 1s var(--ease-out) .28s both}
body.mt-ready .herobtns .btn-hot{animation:heroIn .75s var(--ease-out) .4s both, softGlow 2.8s ease-in-out 1.3s infinite}
@keyframes softGlow{
  0%,100%{box-shadow:0 10px 26px -10px var(--hot)}
  50%{box-shadow:0 16px 34px -8px var(--hot)}
}
.bigcta__btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
body.mt-ready .bigcta.in .bigcta__btns .btn{animation:heroIn .65s var(--ease-out) both}
body.mt-ready .bigcta.in .bigcta__btns .btn:nth-child(1){animation-delay:.08s}
body.mt-ready .bigcta.in .bigcta__btns .btn:nth-child(2){animation-delay:.16s}

@media(max-width:1000px){
  .hero .c{grid-template-columns:1fr;gap:44px}
  .heroart{height:400px}
  .modes,.steps{grid-template-columns:1fr 1fr}
  .combo{grid-template-columns:1fr;padding:34px 28px}
  .vgrid{grid-template-columns:1fr}
  .fg{grid-template-columns:1fr 1fr}
  .nl{display:none}
  nav .btn-out{display:none}
  .burger{display:grid}
  .cards{grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr))}
  .shead{align-items:flex-start}
  .hourcard th,.hourcard td{padding:11px 16px}
}
@media(max-width:640px){
  html,body{overflow-x:clip}
  .c{padding:0 16px}
  section{padding:56px 0}
  .modes,.steps,.contactrow{grid-template-columns:1fr}
  .fg{grid-template-columns:1fr}
  footer{padding-top:56px}
  .ftr-cta{flex-direction:column}
  .ftr-cta .btn{width:100%;justify-content:center}
  .livebar .c{gap:10px;font-size:12px;padding-top:8px;padding-bottom:8px;flex-wrap:wrap}
  .livebar .push{display:none}
  .stickybar{display:flex}
  body.has-stickybar{padding-bottom:76px}
  body.has-stickybar footer{padding-bottom:28px}
  body.drawer-open{overflow:hidden}
  /* Keep a compact primary action in the header — drawer alone is not enough. */
  nav .btn-hot{
    display:inline-flex;
    padding:10px 14px;
    font-size:12.5px;
    min-height:44px;
  }
  .nav-cta{gap:8px}
  .logo .t b{max-width:9.5rem;font-size:15px}
  .logo .t span{letter-spacing:1.6px}
  .hero h1{font-size:clamp(34px,11vw,52px);letter-spacing:-1.5px}
  .herobtns{flex-direction:column;align-items:stretch}
  .herobtns .btn{width:100%;justify-content:center}
  .microrow{gap:12px 16px}
  .heroart{height:300px}
  .chip2,.chip3{display:none}
  .spin{width:88px;height:88px;font-size:10px;right:0;top:-8px}
  .spin b{font-size:20px}
  .filters,.filters--sticky{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;top:64px}
  .filters::-webkit-scrollbar,.filters--sticky::-webkit-scrollbar{display:none}
  .filters .f,.filters--sticky .f{min-height:44px}
  .menu-sect-head h3{scroll-margin-top:140px}
  .cards{grid-template-columns:1fr;gap:14px}
  .item .photo{height:190px}
  .bigcta{padding:72px 0}
  .bigcta h2{font-size:clamp(28px,10vw,48px);letter-spacing:-1.5px}
  .bigcta .btn,.bigcta__btns .btn{width:100%;max-width:22rem}
  .hourcard .h{padding:16px}
  .hourcard th,.hourcard td{padding:10px 16px;font-size:13px}
  .mapd{height:220px;border-radius:16px}
  .contactrow{gap:12px}
  .gal{grid-template-columns:1fr 1fr;gap:.5rem}
  /* The checkout's own narrow-screen rules are not here but after the checkout
     section below, because a media query adds no specificity: every rule in
     this block is outranked by the plain .checkout-* rules further down the
     file purely by source order. */
  .field input,.field select,.field textarea,.pcform input,.dayform select,
  .checkout input,.checkout select,.checkout textarea,.cartline__qty input,
  .bkf input,.bkf select,.menu-search-bold input{font-size:16px} /* iOS zoom guard */
  .slots .slot,.bkslot span{flex:1 1 calc(50% - 8px);justify-content:center;min-height:44px}
  .cartline__qty button,.cartline__rm button,.addgo,.btn-hot,.btn-out{min-height:44px}
  .bk-submit .btn,.bk-confirm__actions .btn,.menu-cta-bold__btns .btn,
  .loc-block__actions .btn{width:100%;justify-content:center}
  .bk-confirm__actions,.menu-cta-bold,.menu-cta-bold__btns{flex-direction:column;align-items:stretch}
  .chef-dialog{max-width:calc(100vw - 16px)}
  .chef-dialog__panel{max-height:min(90dvh,640px);overflow:auto;overscroll-behavior:contain}
  .chef-dialog__close{width:44px;height:44px}
  .chef-dialog__media{min-height:160px;max-height:200px}
  .revs{grid-template-columns:1fr}
  .rev-board--bold{padding:22px 18px;margin-bottom:28px}
  .fb{flex-direction:column;align-items:flex-start;gap:8px}
}

/* ---------- CART PAGE ---------- */
.cart-page{padding-top:48px;padding-bottom:72px}
.cart-page__head{align-items:flex-end}
.cart-page__lead{margin:10px 0 0;color:var(--tx2);font-size:15px;max-width:42ch}
.cart-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.75fr);gap:28px;align-items:start;
  margin-top:8px}
.cart-lines{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:8px 22px 10px}
.cart-lines__top{display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:14px 0 8px;border-bottom:1px solid var(--line);margin-bottom:4px}
.cart-lines__title{margin:0;font-size:13px;letter-spacing:1.4px;text-transform:uppercase;font-weight:900;color:var(--tx)}
.cart-clear__btn{background:none;border:0;color:var(--tx3);font:inherit;font-size:13px;font-weight:700;
  cursor:pointer;padding:6px 0;text-decoration:underline;text-underline-offset:3px}
.cart-clear__btn:hover{color:var(--hot)}

.cartline{display:grid;grid-template-columns:72px minmax(0,1fr) auto auto auto;gap:14px 16px;align-items:center;
  padding:18px 0;border-bottom:1px solid var(--line)}
.cartline:last-child{border-bottom:0}
.cartline__photo{width:88px;height:88px;border-radius:16px;flex:none;display:block;
  box-shadow:0 10px 24px -16px #000;border:1px solid var(--line)}
.cartline__photo::after{background:linear-gradient(180deg,transparent 40%,rgba(12,12,14,.35))}
.cartline__photo img{display:block;border-radius:inherit}
.cartline__photo .mono{font-size:28px;opacity:.4;right:4px;bottom:0}

.cartline__name{margin:0;font-weight:800;font-size:16.5px;color:var(--tx)}
.cartline__opts,.cartline__note{margin:.25rem 0 0;font-size:13px;color:var(--tx3)}
.cartline__unit{margin:6px 0 0;font-size:12.5px;color:var(--tx3);font-weight:700}
.cartline__qty{display:inline-flex;gap:0;align-items:center;border:1px solid var(--line);border-radius:12px;
  overflow:hidden;background:var(--bg2)}
.cartline__step{width:40px;height:40px;border:0;background:transparent;color:var(--tx);font:inherit;
  font-size:18px;font-weight:800;cursor:pointer;line-height:1}
.cartline__step:hover{background:rgba(255,90,31,.12);color:var(--hot)}
.cartline__step:disabled{opacity:.4;cursor:wait}
.cartline__qty input{width:3rem;padding:8px 4px;border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);
  background:transparent;color:var(--tx);font:inherit;font-size:15px;font-weight:800;text-align:center;
  -moz-appearance:textfield}
.cartline__qty input::-webkit-outer-spin-button,
.cartline__qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.cartline__qty button[type="submit"]{background:transparent;border:0;border-left:1px solid var(--line);color:var(--tx2);
  padding:8px 12px;cursor:pointer;font:inherit;font-size:12px;font-weight:700}
.cartline__rm button{background:transparent;border:1px solid var(--line);color:var(--tx3);
  border-radius:10px;padding:10px 12px;cursor:pointer;font:inherit;font-size:13px;font-weight:700}
.cartline__rm button:hover{border-color:var(--hot);color:var(--hot)}
.cartline__price{font-family:var(--disp);font-size:18px;font-weight:900;letter-spacing:-.4px;white-space:nowrap;color:var(--tx)}
.cartline.is-busy{opacity:.55;pointer-events:none}

.cart-sum__card{position:sticky;top:100px;padding:24px;border-radius:22px;background:var(--card);
  border:1px solid var(--line);box-shadow:0 24px 50px -36px #000}
.cart-sum__card h3{margin:0 0 14px;font-family:var(--disp);font-size:22px;letter-spacing:-.6px;text-transform:uppercase}
.cart-sum__meta{margin:0 0 16px;font-size:12.5px;font-weight:800;color:var(--mint);letter-spacing:.4px;text-transform:uppercase}
.cart-sum__row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:17px;font-weight:800}
.cart-sum__row strong{font-family:var(--disp);font-size:28px;letter-spacing:-1px}
.cart-sum__hint{margin:10px 0 0;font-size:12.5px;color:var(--tx3);line-height:1.45}
.cart-min{margin:18px 0 0;padding:14px;border-radius:14px;background:rgba(255,90,31,.08);border:1px solid rgba(255,90,31,.28)}
.cart-min[data-ok="1"]{background:rgba(61,220,151,.08);border-color:rgba(61,220,151,.28)}
.cart-min__bar{height:6px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin:0 0 10px}
.cart-min__bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--hot),var(--acid));
  border-radius:99px;transition:width .35s var(--ease-out)}
.cart-min[data-ok="1"] .cart-min__bar i{background:var(--mint)}
.cart-min__msg{margin:0;font-size:13px;font-weight:700;color:var(--tx);line-height:1.4}
.cart-sum__actions{display:grid;gap:10px;margin-top:20px}
.cart-sum__actions .btn{width:100%;justify-content:center}

.cart-empty{margin-top:8px}
.cart-empty__card{padding:48px 28px;border-radius:22px;border:1px dashed var(--line);background:var(--card);
  text-align:center;max-width:36rem}
.cart-empty__card h3{margin:14px 0 10px;font-family:var(--disp);font-size:clamp(28px,4vw,40px);
  letter-spacing:-1.2px;text-transform:uppercase}
.cart-empty__card p{margin:0 auto 24px;color:var(--tx2);max-width:34ch;line-height:1.55}

.cart-sugg{margin-top:56px}
.cart-sugg__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:16px}
.cart-sugg__item{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;
  display:flex;flex-direction:column}
.cart-sugg__photo{height:140px}
.cart-sugg__photo::after{background:linear-gradient(180deg,transparent 50%,rgba(12,12,14,.45))}
.cart-sugg__photo img{display:block}
.cart-sugg__body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.cart-sugg__body h4{margin:0;font-size:15px;font-weight:800}
.cart-sugg__body span{color:var(--acid);font-weight:800;font-size:14px}
.cart-sugg__body .addgo{margin-top:auto}

/* legacy commerce helpers still used by checkout */
.notice{padding:14px 16px;border-radius:12px;background:var(--bg3);border:1px solid var(--line);margin:0 0 18px;color:var(--tx2)}
.notice--warn{border-color:var(--hot);color:var(--tx);background:rgba(255,90,31,.08)}
.notice strong{color:var(--tx)}
.muted{color:var(--tx2);font-size:14px}
.muted.small,.small{font-size:12.5px;color:var(--tx3)}
.empty{color:var(--tx2);margin:0 0 18px}

.carttot{display:flex;justify-content:space-between;align-items:baseline;margin:22px 0 12px;
  font-size:18px;font-weight:800}

.checkout-split{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.78fr);gap:28px;align-items:start}
.checkout__form h2,.checkout__sum h2{font-family:var(--disp);font-size:22px;text-transform:uppercase;
  letter-spacing:-.6px;margin:28px 0 14px}
.checkout__form h2:first-child{margin-top:0}

.checkout-page{padding:48px 0 80px}
/* Re-pricing. Only what the server is about to restate goes quiet — the money,
   and the controls that change it. Dimming all nine panels on a tip tap made a
   working checkout look broken, and greyed out the address the customer was
   halfway through typing. */
.checkout-page.is-quoting .co-sum-card,
.checkout-page.is-quoting .tips,
.checkout-page.is-quoting .co-pay{opacity:.55;transition:opacity .12s ease}
.checkout-page.is-quoting .tips,
.checkout-page.is-quoting .day-chips,
.checkout-page.is-quoting .pcform,
.checkout-page.is-quoting .co-pay{pointer-events:none}
/* A line that says the total is being recalculated, on the card showing it.
   Purely a state light: it needs no layout, so it cannot shift one. */
.co-sum-card::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;border-radius:22px 22px 0 0;
  background:linear-gradient(90deg,transparent,var(--hot),transparent);background-size:220% 100%;
  background-position:100% 0;opacity:0;transition:opacity .15s}
.checkout-page.is-quoting .co-sum-card::before{opacity:1;animation:coScan 1.1s linear infinite}
/* Slides the gradient, not the box — a transform here would run out past the
   card's rounded corner and there is nothing clipping it. */
@keyframes coScan{from{background-position:100% 0}to{background-position:-120% 0}}
@media (prefers-reduced-motion:reduce){
  .checkout-page.is-quoting .co-sum-card::before{animation:none;background:var(--hot)}
}

.checkout-page__head{align-items:flex-end}
.checkout-page__lead{margin:10px 0 0;color:var(--tx2);font-size:15px}
.checkout-steps{list-style:none;margin:0 0 28px;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.checkout-steps li{display:inline-flex;align-items:center;gap:7px;
  padding:8px 15px;border-radius:999px;border:1px solid var(--line);font-size:12px;
  font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--tx3);background:var(--bg2);
  transition:color .2s,border-color .2s,background .2s,opacity .2s}
/* A marker per state, so the rail is readable without relying on colour alone. */
.checkout-steps li.is-done{border-color:rgba(61,220,151,.35);color:var(--mint);background:rgba(61,220,151,.08)}
.checkout-steps li.is-done::before{content:"✓";font-size:11px;font-weight:900;line-height:1}
.checkout-steps li.is-now{border-color:var(--hot);color:#fff;background:var(--hot);
  box-shadow:0 10px 24px -14px var(--hot)}
.checkout-steps li.is-now::before{content:"";width:7px;height:7px;border-radius:50%;background:#fff;flex:0 0 7px}
.checkout-steps li.is-muted{opacity:.45}

.co-panel{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:22px 22px 20px;
  margin:0 0 16px}
.co-panel__head{margin:0 0 16px}
.co-kicker{display:block;font-size:11px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--hot2);margin:0 0 6px}
.co-panel__head h3{margin:0;font-family:var(--disp);font-size:clamp(22px,3vw,28px);letter-spacing:-.8px;
  text-transform:uppercase}

/*
  Checkout panel headings only. Nine panels each shouting at 28px left the page
  with no hierarchy: the thing being decided, the page title and the total all
  read as equally loud. Stepped down here so the two figures that matter — the
  "CHECKOUT" heading and the total — are the loudest things on the screen.

  Scoped to .checkout-page: the order-status page shares .co-panel and is not
  what was asked for.
*/
.checkout-page .co-panel{padding:20px 22px 18px;transition:border-color .25s var(--ease)}
.checkout-page .co-panel__head{margin:0 0 14px}
.checkout-page .co-panel__head h3{font-size:19px;letter-spacing:-.2px}
.checkout-page .co-kicker{margin:0 0 4px}
/* The panel you are typing in comes forward. Nothing moves — only the edge. */
.checkout-page .co-panel:focus-within{border-color:rgba(255,90,31,.5)}

/*
  Says a field was filled in from the account. Quieter than a .notice — this is
  not a warning, and a green banner over every signed-in checkout would be. It
  earns its line by making the prefill noticed: a customer who does not realise
  the address came from their account is the one who posts dinner to an old flat.
*/
.co-prefill{display:flex;align-items:flex-start;gap:9px;margin:0 0 16px;
  font-size:12.5px;font-weight:600;color:var(--tx2);line-height:1.5}
.co-prefill__ic{flex:0 0 17px;width:17px;height:17px;border-radius:50%;
  background:rgba(61,220,151,.14);color:var(--mint);display:grid;place-items:center;
  font-size:10px;font-weight:900;margin-top:1px}
.co-panel--pickup{background:linear-gradient(160deg,rgba(255,90,31,.08),transparent 55%),var(--card)}
.co-pickup{margin:0;display:grid;gap:4px;color:var(--tx2);font-size:14.5px}
.co-pickup strong{color:var(--tx);font-size:16px}
.co-pickup__eta{color:var(--mint);font-weight:800;font-size:12.5px;letter-spacing:.4px;text-transform:uppercase;
  margin-top:6px}

.fulfil-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:0}
.fulfil-card{display:grid;gap:4px;justify-items:start;text-align:left;padding:16px;border-radius:16px;
  border:1px solid var(--line);background:var(--bg2);color:var(--tx);cursor:pointer;font:inherit;
  transition:border-color .2s,background .2s,transform .2s}
.fulfil-card:hover{border-color:var(--hot);transform:translateY(-2px)}
.fulfil-card.is-on{border-color:var(--hot);background:rgba(255,90,31,.12);box-shadow:0 0 0 1px var(--hot)}
.fulfil-card__ic{font-size:22px;line-height:1}
.fulfil-card__title{font-weight:900;font-size:15px}
.fulfil-card__hint{font-size:12.5px;color:var(--tx3);font-weight:600}

.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.field{margin:0 0 14px}
.field label{display:block;font-size:13px;font-weight:700;margin:0 0 6px;color:var(--tx2)}
.field input,.field select,.pcform input,.dayform select,
.checkout input:not([type="radio"]):not([type="checkbox"]),
.checkout select,.checkout textarea{
  width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--line);
  background:var(--bg2);color:var(--tx);font:inherit;font-size:16px;box-sizing:border-box}
.field input:focus-visible,.pcform input:focus-visible,.checkout input:focus-visible,
.checkout select:focus-visible,.checkout textarea:focus-visible{
  outline:2px solid var(--hot);outline-offset:2px;border-color:transparent}
.hint{margin:6px 0 0;font-size:12.5px;color:var(--tx3)}
.opt-lbl{font-weight:500;color:var(--tx3)}
.notice--ok{border-color:rgba(61,220,151,.35);background:rgba(61,220,151,.08);color:var(--tx)}

.fulfil{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px}
.fulfil__btn{padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:var(--bg2);
  color:var(--tx);font:inherit;font-weight:700;cursor:pointer}
.fulfil__btn.is-on{background:var(--hot);border-color:var(--hot);color:#fff}
.pcform__row,.dayform__row{display:flex;gap:10px;align-items:stretch}
.pcform__row input,.dayform__row select{flex:1}
.dayform__row .btn,.pcform__row .btn{flex:0 0 auto;align-self:stretch;white-space:nowrap}
.dayform label,.pcform label{display:block;font-size:13px;font-weight:700;margin:0 0 6px;color:var(--tx2)}

.day-chips{display:flex;flex-wrap:wrap;gap:8px}
.day-chip{display:grid;gap:2px;min-width:5.5rem;padding:12px 14px;border-radius:14px;border:1px solid var(--line);
  background:var(--bg2);color:var(--tx);cursor:pointer;font:inherit;text-align:left;transition:.2s}
.day-chip b{font-size:14px;font-weight:900}
.day-chip span{font-size:12px;color:var(--tx3);font-weight:700}
.day-chip:hover{border-color:var(--hot)}
.day-chip.is-on{border-color:var(--hot);background:rgba(255,90,31,.14)}
.day-chip.is-on span{color:var(--hot2)}

.slots{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.slot{display:inline-flex;align-items:center;justify-content:center;gap:0;padding:12px 16px;border-radius:12px;
  border:1px solid var(--line);background:var(--bg2);cursor:pointer;color:var(--tx);
  font-weight:800;font-size:14px;min-height:44px;min-width:5.5rem;transition:border-color .2s,background .2s,color .2s;
  position:relative}
.slot input[type="radio"]{position:absolute;opacity:0;pointer-events:none}
.slot span{color:inherit}
.slot:hover{border-color:var(--hot);color:var(--hot)}
.slot.is-on,.slot:has(input:checked){border-color:var(--hot);background:var(--hot);color:#fff;
  box-shadow:0 10px 24px -12px var(--hot)}

.co-pay{margin:8px 0 0;padding:8px 0 0}
.co-pay .btn--pay{width:100%;justify-content:center}
.co-pay__hint{text-align:center;margin-top:12px}

.co-sum-card{position:sticky;top:100px;padding:22px;border-radius:22px;background:var(--card);
  border:1px solid var(--line);box-shadow:0 24px 50px -36px #000}
.co-sum-card__top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 16px}
.co-sum-card__top h3{margin:0;font-family:var(--disp);font-size:22px;letter-spacing:-.6px;text-transform:uppercase}
.co-sum-card__top a{font-size:13px;font-weight:800;color:var(--acid)}
.co-sum-card__top a:hover{color:var(--hot)}
.co-sum-lines{display:grid;gap:12px;margin:0 0 16px;padding:0 0 16px;border-bottom:1px solid var(--line)}
.co-sum-line{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:10px;align-items:center}
.co-sum-line__photo{width:48px;height:48px;border-radius:12px;border:1px solid var(--line)}
.co-sum-line__photo::after{background:linear-gradient(180deg,transparent 45%,rgba(12,12,14,.3))}
.co-sum-line__main{min-width:0}
.co-sum-line__main b{display:block;font-size:13.5px;font-weight:800;line-height:1.3}
.co-sum-line__main span{display:block;font-size:12px;color:var(--tx3);margin-top:2px}
.co-sum-line strong{font-size:13.5px;font-weight:900;white-space:nowrap}
.co-sum-totals{display:grid;gap:2px}
.co-sum-meta{margin:12px 0 0;font-size:12px;font-weight:800;color:var(--mint);letter-spacing:.4px;
  text-transform:uppercase}
/*
  A big order used to push the total off the bottom of a card pinned to the top
  of the screen, so the one figure the card exists to show was the one you could
  not reach. The card is now capped to the viewport and the item list is what
  gives way — totals, VAT line and trust note stay put.
*/
@media(min-width:901px){
  .checkout-page .co-sum-card{display:flex;flex-direction:column;max-height:calc(100vh - 124px)}
  .checkout-page .co-sum-lines{overflow-y:auto;min-height:0;scrollbar-width:thin;
    scrollbar-color:var(--line) transparent;overscroll-behavior:contain}
  .checkout-page .co-sum-lines::-webkit-scrollbar{width:6px}
  .checkout-page .co-sum-lines::-webkit-scrollbar-thumb{background:var(--line);border-radius:999px}
}

/* A discount is the one line here worth reading as good news. */
.sumline--save{color:var(--mint)}
.sumline--save span:last-child{font-weight:800}
/* What the customer is actually agreeing to, set apart from the arithmetic
   above it rather than sitting flush against the last fee. */
.co-sum-totals .sumline--total{margin-top:8px;padding-top:16px;border-top:1px solid var(--line);
  align-items:baseline}
.co-sum-trust{display:flex;align-items:center;gap:8px;margin:16px 0 0;padding-top:14px;
  border-top:1px dashed var(--line);font-size:12px;font-weight:700;color:var(--tx3)}
.co-sum-trust svg{flex:0 0 14px;color:var(--mint)}

/*
  Allergens. Previously a bare checkbox grid written in inline styles — the one
  block on a page of pills and chips that looked unstyled, sitting under the
  question most worth answering carefully.

  The tick is drawn with an adjacent-sibling selector rather than :has(), so the
  chosen state is still visible in a browser without it; :has() only adds the
  filled pill on top.
*/
.allergens{border:0;padding:0;margin:0 0 18px;min-width:0}
.allergens__legend{padding:0;margin:0 0 10px;font-size:13px;font-weight:700;color:var(--tx2)}
.allergen-grid{display:flex;flex-wrap:wrap;gap:8px}
.allergen{position:relative;display:inline-flex;align-items:center;gap:9px;min-height:44px;
  padding:8px 15px 8px 13px;border-radius:999px;border:1px solid var(--line);background:var(--bg2);
  font-size:13px;font-weight:700;color:var(--tx2);cursor:pointer;
  transition:border-color .18s,background .18s,color .18s}
.allergen:hover{border-color:var(--hot);color:var(--tx)}
.allergen input{position:absolute;opacity:0;pointer-events:none}
.allergen__box{flex:0 0 17px;width:17px;height:17px;border-radius:6px;border:1.5px solid var(--line);
  background:var(--bg3);display:grid;place-items:center;transition:background .18s,border-color .18s}
.allergen__box::after{content:"";width:9px;height:9px;border-radius:2px;background:#fff;
  transform:scale(0);transition:transform .16s var(--ease-out)}
.allergen input:checked ~ .allergen__box{background:var(--hot);border-color:var(--hot)}
.allergen input:checked ~ .allergen__box::after{transform:scale(1)}
.allergen:has(input:checked){border-color:var(--hot);background:rgba(255,90,31,.13);color:var(--tx)}
.allergen:has(input:focus-visible){outline:3px solid var(--acid);outline-offset:2px}

.btn--pay{width:100%;justify-content:center;margin-top:8px}
.checkout__sum{position:sticky;top:100px;padding:0;border-radius:0;background:transparent;border:0}
.sumline{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);
  font-size:14px}
.sumline--total{border-bottom:0;font-size:17px;padding-top:14px}
.sumline--total strong{font-family:var(--disp);font-size:26px;letter-spacing:-1px}
.sumline__opts{margin:-4px 0 8px;font-size:12.5px;color:var(--tx3)}

.track{list-style:none;margin:0 0 24px;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.track__step{padding:8px 14px;border-radius:999px;border:1px solid var(--line);color:var(--tx3);font-size:13px;font-weight:700}
.track__step.is-done{border-color:var(--mint);color:var(--mint)}
.track__step.is-now{border-color:var(--hot);color:var(--hot);background:rgba(255,90,31,.1)}

/* ---------- ORDER STATUS ---------- */
.order-page{padding:48px 0 80px}
.order-page__head{align-items:flex-end}
.order-page__lead{margin:10px 0 0;color:var(--tx2);font-size:15px}
.order-hero{position:relative;overflow:hidden;border-radius:24px;padding:32px 28px;margin:0 0 28px;
  border:1px solid var(--line);background:var(--card)}
.order-hero--live{background:
  radial-gradient(90% 80% at 100% 0%, rgba(255,90,31,.18), transparent 55%),
  linear-gradient(160deg,var(--card),var(--bg2))}
.order-hero--done{background:
  radial-gradient(90% 80% at 100% 0%, rgba(61,220,151,.16), transparent 55%),
  linear-gradient(160deg,var(--card),var(--bg2));border-color:rgba(61,220,151,.28)}
.order-hero--warn{background:rgba(255,90,31,.08);border-color:rgba(255,90,31,.35)}
.order-hero__pulse{position:absolute;width:220px;height:220px;border-radius:50%;right:-60px;top:-80px;
  background:radial-gradient(circle,rgba(255,90,31,.35),transparent 68%);pointer-events:none;
  animation:orderPulse 3.2s ease-in-out infinite}
.order-hero--done .order-hero__pulse{background:radial-gradient(circle,rgba(61,220,151,.3),transparent 68%)}
.order-hero__badge{display:inline-flex;padding:6px 12px;border-radius:999px;font-size:11px;font-weight:900;
  letter-spacing:1.4px;text-transform:uppercase;background:rgba(255,90,31,.14);color:var(--hot2);
  border:1px solid rgba(255,90,31,.35)}
.order-hero--done .order-hero__badge{background:rgba(61,220,151,.12);color:var(--mint);
  border-color:rgba(61,220,151,.35)}
.order-hero h3{margin:14px 0 8px;font-family:var(--disp);font-size:clamp(28px,5vw,44px);
  letter-spacing:-1.4px;text-transform:uppercase;line-height:1}
.order-hero p{margin:0 0 18px;color:var(--tx2);max-width:42ch;font-size:15px}
.order-hero.is-bump h3{animation:orderStatusPop .55s var(--ease-out)}

.otrack{list-style:none;margin:0 0 36px;padding:18px 8px 8px;display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));gap:0;position:relative;
  background:var(--card);border:1px solid var(--line);border-radius:22px}
.otrack::before{content:"";position:absolute;left:12%;right:12%;top:42px;height:3px;border-radius:99px;
  background:var(--line);z-index:0}
.otrack__step{position:relative;z-index:1;display:grid;justify-items:center;gap:10px;padding:8px 6px 16px;
  text-align:center;opacity:0;transform:translateY(14px);
  animation:orderStepIn .55s var(--ease-out) forwards;animation-delay:calc(.08s + var(--i,0) * .1s)}
.otrack__dot{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  background:var(--bg2);border:2px solid var(--line);transition:transform .35s var(--ease-out),
  border-color .3s,background .3s,box-shadow .35s}
.otrack__ic{font-size:18px;line-height:1;filter:grayscale(.4);opacity:.7;transition:.3s}
.otrack__label{font-size:12.5px;font-weight:800;color:var(--tx3);letter-spacing:.2px;max-width:9ch}
.otrack__step.is-done .otrack__dot{border-color:var(--mint);background:rgba(61,220,151,.12)}
.otrack__step.is-done .otrack__ic{filter:none;opacity:1}
.otrack__step.is-done .otrack__label{color:var(--mint)}
.otrack__step.is-now .otrack__dot{border-color:var(--hot);background:var(--hot);color:#fff;
  box-shadow:0 0 0 8px rgba(255,90,31,.16);animation:orderNowGlow 1.8s ease-in-out infinite}
.otrack__step.is-now .otrack__ic{filter:none;opacity:1}
.otrack__step.is-now .otrack__label{color:var(--tx)}
.otrack__step.is-now.is-pop .otrack__dot{animation:orderNowPop .6s var(--ease-out), orderNowGlow 1.8s ease-in-out .6s infinite}

.order-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.7fr);gap:20px;align-items:start}
.order-where{margin:0;display:grid;gap:4px;color:var(--tx2);font-size:14.5px}
.order-where strong{color:var(--tx);font-size:16px}
.order-when-pill{display:inline-flex;margin:14px 0 0;padding:8px 12px;border-radius:999px;
  background:rgba(255,216,77,.1);border:1px solid rgba(255,216,77,.3);color:var(--acid);
  font-size:12.5px;font-weight:800}
.order-lines{display:grid;gap:12px}
.order-line{display:grid;grid-template-columns:2.5rem minmax(0,1fr) auto;gap:10px;align-items:start;
  padding-bottom:12px;border-bottom:1px solid var(--line)}
.order-line:last-child{border-bottom:0;padding-bottom:0}
.order-line__qty{font-weight:900;color:var(--acid);font-variant-numeric:tabular-nums}
.order-line__main b{display:block;font-size:14.5px}
.order-line__main span{display:block;margin-top:3px;font-size:12.5px;color:var(--tx3)}
.order-line strong{font-size:14px;font-weight:900;white-space:nowrap}
.order-meta{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.order-meta li{display:flex;justify-content:space-between;gap:12px;padding-bottom:10px;
  border-bottom:1px solid var(--line);font-size:13.5px}
.order-meta li:last-child{border-bottom:0;padding-bottom:0}
.order-meta span{color:var(--tx3);font-weight:700}
.order-meta b{color:var(--tx);font-weight:800;text-align:right}
.order-note{margin:16px 0 0;padding:12px 14px;border-radius:14px;background:var(--bg2);border:1px solid var(--line);
  display:grid;gap:4px}
.order-note strong{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--hot2)}
.order-note span{color:var(--tx2);font-size:14px}
.order-help{margin:16px 0 0;font-size:13.5px;color:var(--tx2);line-height:1.5}
.order-help a{color:var(--acid);font-weight:800;border-bottom:1px solid rgba(255,216,77,.35)}
.order-side__actions{margin-top:18px;display:grid}
.order-side__actions .btn{width:100%;justify-content:center}

@keyframes orderPulse{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.18);opacity:1}}
@keyframes orderStepIn{to{opacity:1;transform:none}}
@keyframes orderNowGlow{0%,100%{box-shadow:0 0 0 6px rgba(255,90,31,.12)}50%{box-shadow:0 0 0 12px rgba(255,90,31,.2)}}
@keyframes orderNowPop{0%{transform:scale(.7)}55%{transform:scale(1.18)}100%{transform:scale(1)}}
@keyframes orderStatusPop{0%{opacity:.4;transform:translateY(8px)}100%{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  .order-hero__pulse,.otrack__step,.otrack__step.is-now .otrack__dot,.order-hero.is-bump h3{animation:none!important}
  .otrack__step{opacity:1;transform:none}
}
@media(max-width:900px){
  .order-grid{grid-template-columns:1fr}
  .otrack{grid-template-columns:1fr 1fr;gap:8px 0;padding-top:14px}
  .otrack::before{display:none}
  .otrack__label{max-width:none}
}
@media(max-width:520px){
  .otrack{grid-template-columns:1fr}
  .otrack__step{grid-template-columns:52px minmax(0,1fr);justify-items:start;text-align:left;padding:10px 14px}
}

.gal{display:grid;gap:clamp(.5rem,1.5vw,1rem);grid-template-columns:repeat(auto-fill,minmax(min(18rem,45%),1fr))}
.gal__item{margin:0;background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.gal__item:hover{transform:translateY(-.3rem);box-shadow:0 18px 40px -24px rgba(0,0,0,.7)}
.gal__item img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .7s var(--ease)}
.gal__item:hover img{transform:scale(1.06)}

.nav__cart{position:relative;overflow:visible}
.btn.nav__cart{overflow:visible} /* badge sits outside the pill; .btn clips by default */
.nav__count{position:absolute;top:-8px;right:-8px;z-index:3;display:inline-flex;align-items:center;justify-content:center;
  min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--acid);color:#161005;
  font-size:11px;font-weight:900;line-height:1;margin:0;box-sizing:border-box;
  box-shadow:0 0 0 2px var(--bg);transition:transform .25s var(--ease-out)}
.nav__count.bump{animation:cartBump .55s cubic-bezier(.16,1,.3,1)}
@keyframes cartBump{0%{transform:scale(1)}35%{transform:scale(1.55)}100%{transform:scale(1)}}

@media(max-width:900px){
  .checkout-split{grid-template-columns:1fr}
  .checkout__sum{position:static}
  /* relative, not static: the re-pricing line is absolutely positioned inside
     this card and would otherwise anchor to whatever is positioned above it. */
  .co-sum-card{position:relative;top:auto}
  /* One column puts the summary under a long form, so the customer types out
     name, address, day and time before ever seeing what it costs. Ordered
     first instead: what you are buying, then the details, then the pay bar. */
  .checkout-page .checkout__sum{order:-1;margin-bottom:4px}
  .checkout-split{gap:18px}
  .field-grid{grid-template-columns:1fr}
  .cart-layout{grid-template-columns:1fr}
  .cart-sum__card{position:static}
  .cartline{grid-template-columns:64px minmax(0,1fr) auto;
    grid-template-areas:"photo main price" "photo qty rm"}
  .cartline__photo{grid-area:photo;width:72px;height:72px}
  .cartline__main{grid-area:main}
  .cartline__price{grid-area:price;align-self:start}
  .cartline__qty{grid-area:qty}
  .cartline__rm{grid-area:rm;justify-self:end}
}

/*
  Checkout on a phone. Kept down here, after the .checkout-* rules it overrides:
  the file's main narrow-screen block sits above them, and a media query adds no
  specificity — only source order would have decided it, the wrong way round.
*/
@media(max-width:640px){
  .checkout-page{padding:32px 0 40px}
  .checkout-page .co-panel{padding:18px 16px 16px;border-radius:18px}
  .checkout-page .co-sum-card{border-radius:18px;padding:18px 16px}
  .checkout-steps{gap:6px;margin-bottom:22px}
  .checkout-steps li{padding:7px 12px;font-size:11px;letter-spacing:.4px}
  .allergen{font-size:12.5px;padding:8px 13px 8px 11px}

  /*
    The site-wide bar reads "N items in your order — Continue to checkout" and
    is pinned over every page. On the checkout it invites you to go where you
    already are, and it covered the pay button. The pay bar below is what a
    checkout wants in that spot.
  */
  body:has(.checkout-page) .stickybar{display:none}
  body:has(.checkout-page).has-stickybar{padding-bottom:0}
  body:has(.checkout-page).has-stickybar footer{padding-bottom:28px}

  /*
    The price and the way to pay it, kept on screen through a form long enough
    to scroll. It is the same button in the same form — sticky, not a fixed copy
    of it — so there is still one submit on the page and the figure on it is
    still the one the server wrote. Being last in the form, it comes to rest in
    place at the end rather than hovering over the footer.
  */
  .checkout-page .co-pay{position:sticky;bottom:0;z-index:80;margin:18px -16px 0;
    padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));
    background:rgba(20,20,24,.96);backdrop-filter:blur(14px);border-top:1px solid var(--line)}
  .checkout-page .co-pay__hint{margin-top:8px;font-size:11px;line-height:1.45}
}

@media (prefers-reduced-motion:reduce){
  .gal__item:hover,.gal__item:hover img{transform:none}
}

/* Motion is a garnish. Somebody who has asked their OS to stop it gets a
   completely static page, including the marquee and the reveal. */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  body.mt-ready [data-reveal],
  body.mt-ready [data-hero-in],
  body.mt-ready .heroart[data-hero-in]{opacity:1!important;transform:none!important;filter:none!important}
  body.mt-ready .spin,body.mt-ready .spin.in{opacity:1!important;transform:rotate(-12deg)!important}
  body.mt-ready h1 .hl::after{transform:scaleX(1)!important}
  .marq{transform:none}
  .stickybar{transform:none!important}
}

/* ---------- Team / chef profiles ---------- */
.team-cards .item{padding:0}
.team-item__link{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}
.team-item__photo{height:240px!important}
.team-item__mono{position:absolute;inset:0;display:grid;place-items:center;font-size:96px;opacity:.35}
.team-item__role{color:var(--hot)!important;font-weight:700;margin-top:6px!important}
.team-meta{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 12px}
.team-meta li{font-size:12.5px;color:var(--tx3)}
.team-tags{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.team-tags li{padding:4px 10px;border-radius:999px;border:1px solid var(--line);background:var(--bg3);
  color:var(--tx2);font-size:11.5px;font-weight:700}
.team-tags--lg li{font-size:13px;padding:6px 12px}
.team-item__cta{margin-top:auto;padding-top:14px;font-size:13px;font-weight:800;color:var(--acid);letter-spacing:.02em}

.chef-facts{list-style:none;margin:18px 0 22px;padding:0;display:grid;gap:12px}
.chef-facts li{display:grid;gap:2px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.chef-facts li:last-child{border-bottom:0;padding-bottom:0}
.chef-facts__label{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--tx3);font-weight:800}

.chef-dialog{border:0;padding:0;max-width:min(720px,calc(100vw - 24px));width:100%;background:transparent;color:inherit}
.chef-dialog::backdrop{background:rgba(0,0,0,.72)}
.chef-dialog__panel{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);background:var(--card);
  border:1px solid var(--line);border-radius:20px;overflow:hidden;position:relative}
.chef-dialog__close{position:absolute;top:10px;right:10px;z-index:2;width:36px;height:36px;border-radius:999px;
  border:1px solid var(--line);background:var(--bg3);color:var(--tx);font-size:22px;line-height:1;cursor:pointer}
.chef-dialog__media{min-height:260px;position:relative}
.chef-dialog__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.chef-dialog__body{padding:28px 24px 26px}
.chef-dialog__body h2{font-size:28px;margin:10px 0 4px;letter-spacing:-.6px}
.chef-dialog__role,.chef-profile__role{margin:0;color:var(--hot);font-weight:700}

.chef-profile{padding:48px 0 72px}
.chef-profile__back{margin:0 0 22px}
.chef-profile__back a{color:var(--tx3);text-decoration:none;font-weight:700;font-size:14px}
.chef-profile__back a:hover{color:var(--acid)}
.chef-profile__grid{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:start}
.chef-profile__photo{border-radius:20px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/5;position:relative;min-height:280px}
.chef-profile__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.chef-profile__main h1{font-size:clamp(34px,5vw,52px);margin:10px 0 6px;letter-spacing:-1.4px}
.chef-profile__block{margin-top:28px}
.chef-profile__block h3{margin:0 0 12px;font-size:15px;text-transform:uppercase;letter-spacing:.08em;color:var(--tx3)}

@media (max-width:760px){
  .chef-dialog__panel,.chef-profile__grid{grid-template-columns:1fr}
  .chef-dialog__media{min-height:180px;max-height:220px}
  .chef-profile__photo{max-width:360px}
}

/* ---------- Locations page ---------- */
.loc-page .loc-block{margin-bottom:48px;scroll-margin-top:96px}
.loc-page .loc-block:last-child{margin-bottom:0}
.loc-jump{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px}
.loc-jump a{font-size:12.5px;font-weight:800;text-decoration:none;padding:8px 14px;border-radius:999px;
  border:1px solid var(--line);color:var(--tx2);background:var(--bg3);
  transition:transform .3s var(--ease),border-color .25s,color .25s,background .25s}
.loc-jump a:hover{transform:translateY(-2px);border-color:var(--hot);color:var(--hot);background:rgba(255,90,31,.08)}
.loc-block__actions{padding:18px 22px;display:flex;gap:10px;flex-wrap:wrap}
.loc-block__actions .btn{flex:1;justify-content:center;min-width:8rem}

.omap--bold{margin:0 0 16px;border-radius:20px;border:1px solid var(--line);overflow:hidden;
  position:relative;background:var(--bg3);min-height:280px}
.omap--bold .omap__frame{display:block;width:100%;height:280px;border:0;filter:saturate(.92) contrast(1.05)}
.omap--bold .omap__fallback{position:relative;height:280px;
  background:
    repeating-linear-gradient(0deg,transparent 0 43px,var(--line) 43px 44px),
    repeating-linear-gradient(90deg,transparent 0 43px,var(--line) 43px 44px),var(--bg3)}
.omap--bold .omap__grid{display:none}
.omap--bold .omap__road{position:absolute;background:#2F2F3A}
.omap--bold .omap__road--h{left:0;right:0;top:55%;height:14px}
.omap--bold .omap__road--v{top:0;bottom:0;left:46%;width:11px}
.omap--bold .omap__pin{position:absolute;left:50%;top:45%;transform:translate(-50%,-100%);text-align:center;
  width:auto;height:auto;border-radius:0;background:transparent;box-shadow:none}
.omap--bold .omap__pin i{display:block;width:24px;height:24px;border-radius:50% 50% 50% 0;background:var(--hot);
  transform:rotate(-45deg);margin:0 auto 12px;box-shadow:0 0 0 8px rgba(255,90,31,.18)}
.omap--bold .omap__city{position:absolute;left:12px;bottom:10px;font-size:9.5px;letter-spacing:1.5px;
  text-transform:uppercase;color:var(--tx2);background:transparent;border:0;padding:0;font-weight:800}
.omap--bold .omap__cap{position:absolute;right:12px;bottom:10px;margin:0;z-index:2}
.omap--bold .omap__link{display:inline-flex;padding:7px 12px;border-radius:999px;background:var(--tx);
  color:var(--bg);font-size:11px;font-weight:900;text-decoration:none;letter-spacing:.04em;
  transition:transform .3s var(--ease),background .25s}
.omap--bold .omap__link:hover{transform:translateY(-2px);background:var(--hot);color:#fff}

body.mt-ready .omap[data-reveal]{opacity:0;transform:translateY(22px) scale(.98);
  transition:opacity .75s var(--ease-out),transform .75s var(--ease-out)}
body.mt-ready .omap[data-reveal].in{opacity:1;transform:none}
body.mt-ready .omap.in.is-fallback .omap__pin i{animation:pinDrop .9s var(--ease-out) .25s both}
body.mt-ready .loc-block .hourcard[data-reveal]{transition-delay:.08s}
body.mt-ready .loc-jump[data-reveal]{transition-delay:0s}

@media (max-width:700px){
  .omap--bold,.omap--bold .omap__frame,.omap--bold .omap__fallback{min-height:220px;height:220px}
  .loc-block__actions{flex-direction:column}
  .loc-block__actions .btn{width:100%;flex:none}
}

.rev__reply{margin:14px 0 0;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg3)}
.rev__reply b{display:block;font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:var(--tx3);margin-bottom:6px}
.rev__reply p{margin:0;color:var(--tx2);font-size:14px;line-height:1.45}
.filters .f{color:var(--tx)}
.filters .f.is-on,.f--diet.is-on,.f--spice.is-on{color:var(--acid);border-color:var(--acid);background:rgba(255,216,77,.1)}

/* ---------- DISCOUNT CODE + UPSELL ----------
   Lives in the basket summary card. The "saving" row is the only green in the
   theme, deliberately: it is the one number a customer scans for. */
.cart-sum__row--save{color:var(--mint)}
.cart-sum__row--save strong{color:var(--mint)}
.cart-sum__row--total{border-top:1px solid var(--line);padding-top:10px;margin-top:2px}
.promo{margin:16px 0 4px}
.promo__form{display:flex;gap:8px}
.promo__form input{flex:1;min-width:0;background:var(--bg2);border:1.5px solid var(--line);
  border-radius:11px;padding:12px 14px;color:var(--tx);font:inherit;font-size:14px;
  text-transform:uppercase;letter-spacing:.06em;min-height:44px}
.promo__form input::placeholder{text-transform:none;letter-spacing:0;color:var(--tx2)}
.promo__form input:focus{border-color:var(--hot);outline:none}
.promo__form .btn{padding:12px 18px}
.promo__applied{display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:rgba(61,220,151,.1);border:1px solid rgba(61,220,151,.32);border-radius:12px;
  padding:12px 14px;font-size:13.5px}
.promo__applied b{color:var(--mint);letter-spacing:.04em}
.promo__remove{background:none;border:0;color:var(--tx2);font:inherit;font-size:12.5px;
  text-decoration:underline;cursor:pointer;padding:6px;min-height:44px}
.promo__remove:hover{color:var(--hot)}
.promo__error{color:var(--hot2);font-size:13px;margin:8px 0 0}
.promo__nudge{background:rgba(255,216,77,.1);border:1px solid rgba(255,216,77,.3);
  border-radius:12px;padding:11px 14px;font-size:13px;color:var(--acid);margin:12px 0 0;font-weight:700}

/* ---------- TIPS ---------- */
.tips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.tip-btn{flex:1 1 0;min-width:74px;min-height:44px;background:var(--bg2);border:1.5px solid var(--line);
  border-radius:11px;color:var(--tx2);font:inherit;font-weight:800;font-size:13.5px;cursor:pointer;
  transition:border-color .2s,color .2s,background .2s;padding:10px 8px}
.tip-btn:hover{border-color:var(--hot);color:var(--hot)}
.tip-btn[aria-pressed="true"]{background:var(--hot);border-color:var(--hot);color:#fff}
.tip-btn small{display:block;font-weight:600;font-size:11px;opacity:.85}
.tip-custom{margin-top:8px;display:flex;gap:8px;align-items:center}
.tip-custom input{width:120px;background:var(--bg2);border:1.5px solid var(--line);border-radius:11px;
  padding:11px 12px;color:var(--tx);font:inherit;min-height:44px}
.tip-custom input:focus{border-color:var(--hot);outline:none}

/* ---------- ACCOUNT ---------- */
.acct{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;align-items:start}
.acct-nav{display:flex;flex-direction:column;gap:4px;position:sticky;top:96px}
.acct-nav a{padding:12px 14px;border-radius:11px;font-weight:700;font-size:14px;color:var(--tx2);
  transition:background .2s,color .2s}
.acct-nav a:hover{background:var(--card);color:var(--tx)}
.acct-nav a[aria-current="page"]{background:var(--hot);color:#fff}
.acct-nav form{margin-top:10px}
.acct-nav button{width:100%;text-align:left;background:none;border:0;color:var(--tx2);font:inherit;
  font-weight:700;font-size:14px;padding:12px 14px;border-radius:11px;cursor:pointer;min-height:44px}
.acct-nav button:hover{background:var(--card);color:var(--hot)}
.acct-card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px}
.acct-card + .acct-card{margin-top:18px}
.acct-card h3{margin:0 0 6px;font-size:17px;font-weight:800;letter-spacing:-.3px}
.acct-card p.muted{color:var(--tx2);font-size:14px;margin:0 0 16px}
.acct-order{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:flex-start;
  padding:18px 0;border-bottom:1px solid var(--line)}
.acct-order:last-child{border-bottom:0}
.acct-order__what b{display:block;font-size:15px}
.acct-order__what span{font-size:13px;color:var(--tx2)}
.acct-order__do{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.acct-status{font-size:10.5px;font-weight:900;letter-spacing:1px;text-transform:uppercase;
  padding:5px 11px;border-radius:99px;background:var(--bg3);color:var(--tx2)}
.acct-status[data-live="1"]{background:rgba(61,220,151,.14);color:var(--mint)}
.field{display:block;margin-bottom:14px}
.field span{display:block;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:var(--tx2);margin-bottom:6px}
.field input,.field textarea{width:100%;background:var(--bg2);border:1.5px solid var(--line);
  border-radius:11px;padding:12px 14px;color:var(--tx);font:inherit;font-size:15px;min-height:44px}
.field input:focus,.field textarea:focus{border-color:var(--hot);outline:none}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-error{color:var(--hot2);font-size:13px;margin:-8px 0 12px}
.auth-wrap{max-width:26rem;margin:0 auto}
.auth-wrap .acct-card{padding:28px}
.auth-alt{text-align:center;margin:18px 0 0;font-size:14px;color:var(--tx2)}
.auth-alt a{color:var(--hot);font-weight:700}
@media(max-width:820px){
  .acct{grid-template-columns:1fr;gap:20px}
  .acct-nav{position:static;flex-direction:row;flex-wrap:wrap}
  .acct-nav a,.acct-nav button{width:auto}
  .field-row{grid-template-columns:1fr}
}

/* Server-side menu filter state — the line that says what is being shown and
   how to get back out. Only rendered when a ?q= or ?diet= is in play. */
.menu-tools-bold__state{margin:10px 0 0;font-size:13.5px;color:var(--tx2)}
.menu-tools-bold__state a{color:var(--hot);font-weight:700;text-decoration:underline}
.filters a.f{display:inline-flex;align-items:center;text-decoration:none}
.filters a.f.is-on{background:var(--hot);border-color:var(--hot);color:#fff}
/* A held code that currently earns nothing. Amber, not green — it is not a
   saving, it is something the customer probably wants to know about. */
.promo__applied--stuck{background:rgba(255,216,77,.08);border-color:rgba(255,216,77,.32)}
.promo__applied--stuck b{color:var(--acid)}