/* ============================================================
   RIVER DISTRICT MEAT MARKET — built by Kyle Buckner
   Night at the counter: charcoal + oxblood glow, kraft daylight.
   Fraunces (display) · Inter (body) · JetBrains Mono (tickets)
   ============================================================ */

:root{
  --night:#0f0b07;
  --ink:#1b1410;
  --ink-2:#241b14;
  --kraft:#f1e9db;
  --kraft-2:#e7dcc8;
  --cream:#f8f2e4;
  --oxblood:#7a1e1e;
  --oxblood-deep:#5a1414;
  --oxblood-glow:#a33030;
  --oxblood-onDark:#d15b45;
  --brass:#ba8c36;
  --brass-soft:#d4b06a;
  --sage:#5a6a47;
  --rust:#a8441c;
  --line-dark:rgba(241,233,219,.14);
  --line-light:rgba(27,20,16,.16);
  --nav-h:78px;
  --disp:"Fraunces",Georgia,serif;
  --body:"Inter",-apple-system,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  font-family:var(--body);
  font-size:17px;line-height:1.6;
  color:var(--ink);
  background:var(--kraft);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* height:auto keeps width/height ATTRS as aspect-ratio hints (CLS win)
   without distorting imgs whose CSS sets width only (footer badge etc.) */
img{max-width:100%;height:auto;display:block}
a{color:inherit}
::selection{background:var(--oxblood);color:var(--cream)}

h1,h2,h3,.disp{
  font-family:var(--disp);
  font-weight:560;
  line-height:1.05;
  letter-spacing:-.025em;
  font-variation-settings:"SOFT" 30,"opsz" 90;
}
em,.it{font-style:italic;font-variation-settings:"SOFT" 40,"opsz" 100}

/* ---------- utilities ---------- */
.wrap{width:min(1180px,92vw);margin-inline:auto}
.wrap-wide{width:min(1360px,94vw);margin-inline:auto}

.eyebrow{
  font-family:var(--mono);
  font-size:12px;letter-spacing:.22em;text-transform:uppercase;
  font-weight:500;
  display:flex;align-items:center;gap:14px;
}
.eyebrow::before{content:"";width:34px;height:1px;background:currentColor;opacity:.5}
.eyebrow .no{opacity:.55}

.lede{
  font-size:clamp(2.1rem,4.6vw,3.6rem);
  line-height:1.06;
  max-width:20ch;
}
.sub{font-size:1.06rem;color:color-mix(in srgb,currentColor 78%,transparent);max-width:54ch}

.dark{background:var(--ink);color:var(--kraft);position:relative}
.darkest{background:var(--night);color:var(--kraft);position:relative}
.dark a,.darkest a{color:inherit}
.grain::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  opacity:.5;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E");
}
.grain>*{position:relative;z-index:2}

section{padding:clamp(4.5rem,9vw,8rem) 0}

/* reveal-on-scroll */
.rv{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}
/* curtain reveal — clip-path would zero the intersection box, so wipe with a pseudo-element */
.rv-clip{position:relative;--curtain:var(--kraft)}
.dark .rv-clip,.darkest .rv-clip,footer .rv-clip{--curtain:var(--ink)}
.rv-clip::before{
  content:"";position:absolute;inset:0;z-index:4;background:var(--curtain);
  transform:scaleY(1);transform-origin:bottom;
  transition:transform 1.15s cubic-bezier(.16,1,.3,1);transition-delay:var(--d,0s);
}
.rv-clip.in::before{transform:scaleY(0)}
@media (prefers-reduced-motion:reduce){
  .rv,.rv-clip{opacity:1;transform:none;transition:none}
  .rv-clip::before{display:none}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.65rem;
  font-family:var(--mono);font-size:13px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;
  padding:1.05rem 1.7rem;text-decoration:none;
  border:1px solid transparent;cursor:pointer;border-radius:12px;
  transition:background .25s,color .25s,border-color .25s,transform .25s;
}
.btn .ar{transition:transform .25s}
.btn:hover .ar{transform:translateX(4px)}
.btn-red{background:var(--oxblood);color:var(--cream)}
.btn-red:hover{background:var(--oxblood-deep)}
.btn-ghost{border-color:currentColor;background:transparent;color:inherit}
.btn-ghost:hover{background:var(--kraft);color:var(--ink);border-color:var(--kraft)}
.light .btn-ghost:hover,.on-light .btn-ghost:hover{background:var(--ink);color:var(--kraft);border-color:var(--ink)}
.btn-brass{background:var(--brass);color:var(--night)}
.btn-brass:hover{background:var(--brass-soft)}

/* ---------- nav ---------- */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:100;height:var(--nav-h);
  display:flex;align-items:center;
  color:var(--kraft);
  transition:background .35s,box-shadow .35s,backdrop-filter .35s;
}
.nav.solid{background:rgba(15,11,7,.9);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line-dark)}
.nav-in{width:min(1360px,94vw);margin-inline:auto;display:flex;align-items:center;gap:2rem}
.nav-logo{display:flex;align-items:center;gap:.8rem;text-decoration:none}
.nav-logo img{width:46px;height:46px}
.nav-logo b{
  font-family:var(--mono);font-weight:600;font-size:12px;
  letter-spacing:.2em;text-transform:uppercase;line-height:1.5;
}
.nav-links{display:flex;align-items:center;gap:1.6rem;margin-left:auto;list-style:none}
.nav-links>li{position:relative}
.nav-links>li.dd{position:static}  /* mega panel must anchor to the fixed nav, not the li */
.nav-links a{
  font-family:var(--mono);font-size:12px;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  opacity:.85;transition:opacity .2s;padding:.4rem 0;
}
.nav-links a:hover,.nav-links a[aria-current="page"]{opacity:1}
.nav-cta{margin-left:.4rem}
.nav .btn{padding:.8rem 1.25rem}

/* top links: underline draws in from the left */
.nav-links>li>a:not(.nav-status):not(.btn){position:relative}
.nav-links>li>a:not(.nav-status):not(.btn)::before{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:var(--oxblood-glow);
  transform:scaleX(0);transform-origin:0 50%;
  transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.nav-links>li>a:not(.nav-status):not(.btn):hover::before,
.nav-links>li>a[aria-current="page"]::before{transform:scaleX(1)}

/* "More" → full-width mega panel (kitchen-ticket treatment) */
.dd>a::after{
  content:"▾";display:inline-block;margin-left:.5em;font-size:10px;
  transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.dd:hover>a::after,.dd:focus-within>a::after{transform:rotate(-180deg)}
.mega::before{content:"";position:absolute;left:0;right:0;top:-34px;height:34px} /* hover bridge across the gap under the nav link */
.mega{
  position:absolute;left:0;right:0;top:100%;z-index:120;
  background:linear-gradient(180deg,#17110b,#120d08);
  border-top:1px solid rgba(241,233,219,.08);border-bottom:1px solid rgba(241,233,219,.14);
  box-shadow:0 46px 90px rgba(15,11,7,.55);
  opacity:0;visibility:hidden;transform:translateY(-12px);pointer-events:none;
  transition:opacity .28s ease,transform .38s cubic-bezier(.16,1,.3,1),visibility 0s .28s;
}
.dd:hover .mega,.dd:focus-within .mega{
  opacity:1;visibility:visible;transform:none;pointer-events:auto;
  transition:opacity .28s ease,transform .38s cubic-bezier(.16,1,.3,1),visibility 0s;
}
.mega-in{
  width:min(1360px,94vw);margin-inline:auto;
  display:grid;grid-template-columns:1fr 250px;gap:clamp(2rem,5vw,5rem);
  padding:2.1rem 0 2.5rem;
}
.mega-links{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(2rem,4vw,4rem);align-content:start}
.nav-links .mega-links a{
  display:flex;align-items:baseline;gap:.9rem;padding:.62rem 0;
  font-family:var(--disp);font-size:1.42rem;font-weight:500;
  letter-spacing:0;text-transform:none;color:var(--kraft);
  opacity:0;transform:translateY(10px);
  transition:opacity .35s ease,transform .4s cubic-bezier(.16,1,.3,1),color .25s;
}
.dd:hover .mega-links a,.dd:focus-within .mega-links a{opacity:.92;transform:none}
.mega-links a:nth-child(2){transition-delay:.03s}.mega-links a:nth-child(3){transition-delay:.06s}
.mega-links a:nth-child(4){transition-delay:.09s}.mega-links a:nth-child(5){transition-delay:.12s}
.mega-links a:nth-child(6){transition-delay:.15s}
.dd:not(:hover):not(:focus-within) .mega-links a{transition-delay:0s}
.nav-links .mega-links a:hover{opacity:1;color:var(--oxblood-glow)}
.mega-links a .fill{flex:1;border-bottom:2px dotted rgba(241,233,219,.2);transform:translateY(-4px);min-width:24px}
.mega-links a small{
  font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brass-soft);flex:none;
}
.mega-side{border-left:1px dashed rgba(241,233,219,.16);padding-left:clamp(1.4rem,2.5vw,2.4rem);align-self:start}
.nav-links p.mega-status{
  display:flex;align-items:center;gap:.55rem;
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brass-soft);margin-bottom:1rem;
}
.mega-hours{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  line-height:2.1;opacity:.7;margin-bottom:1.1rem;
}
.nav-links .mega-tel{
  display:inline-block;font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.12em;
  color:var(--kraft);border-bottom:2px dotted rgba(241,233,219,.3);padding-bottom:.2rem;
}
.nav-links .mega-tel:hover{color:var(--oxblood-glow)}
@media (prefers-reduced-motion:reduce){
  .mega,.mega-links a,.dd>a::after{transition:none}
  .dd:hover .mega-links a{opacity:.92;transform:none}
}

/* burger + drawer */
.burger{display:none;margin-left:auto;background:none;border:0;color:inherit;cursor:pointer;padding:.5rem;z-index:130}
.burger svg{display:block}
.drawer{
  position:fixed;inset:0;z-index:90;background:var(--night);color:var(--kraft);
  display:flex;flex-direction:column;
  padding:max(9vh,80px) clamp(1.6rem,7vw,3rem) max(2.6vh,1.1rem);
  overflow-y:auto;
  transform:translateY(-102%);visibility:hidden;
  transition:transform .5s cubic-bezier(.7,0,.3,1),visibility 0s .5s;
}
.drawer.open{transform:none;visibility:visible;transition:transform .5s cubic-bezier(.7,0,.3,1),visibility 0s}
.dw-in{width:100%;max-width:560px;margin:0 auto;display:flex;flex-direction:column;flex:1}
p.dw-status{
  display:flex;align-items:center;gap:.55rem;
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brass-soft);margin-bottom:2rem;
}
.dw-head{
  display:flex;align-items:center;gap:.9rem;
  font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;
  color:var(--brass-soft);opacity:.85;margin-bottom:.4rem;
}
.dw-head::after{content:"";flex:1;border-top:1px solid rgba(241,233,219,.14)}
.dw-main{margin-bottom:1.7rem}
.dw-main a{
  font-family:var(--disp);font-size:clamp(1.8rem,6.2vh,2.4rem);line-height:1.15;
  text-decoration:none;padding:.3rem 0;
  display:flex;align-items:baseline;gap:.9rem;
}
.dw-main a .fill{flex:1;border-bottom:2px dotted rgba(241,233,219,.22);transform:translateY(-6px);min-width:28px}
.dw-main a small{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--brass-soft);opacity:.9;flex:none}
.dw-main a:active{color:var(--brass)}
.dw-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:1.6rem}
.dw-grid a{font-family:var(--disp);font-size:1.22rem;text-decoration:none;padding:.42rem 0;opacity:.86}
.dw-grid a:active{opacity:1;color:var(--brass)}
.drawer-cta{margin-top:auto;padding-top:1.8rem;position:relative;z-index:1}
.drawer-cta .btn{display:flex;justify-content:space-between;align-items:center;width:100%;white-space:nowrap;box-sizing:border-box}
.dw-tel{display:block;text-align:center;margin-top:.35rem;padding:.55rem 0;
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  text-decoration:none;opacity:.75}
.dw-hours{text-align:center;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;opacity:.42;margin-top:.1rem}
.drawer .dw-status,.drawer .dw-head,.drawer .dw-main a,.drawer .dw-grid a,.drawer .drawer-cta{
  opacity:0;transform:translateY(14px);
  transition:opacity .25s ease,transform .25s ease;
}
.drawer.open .dw-status,.drawer.open .dw-head,.drawer.open .dw-main a,.drawer.open .dw-grid a,.drawer.open .drawer-cta{
  opacity:1;transform:none;
  transition:opacity .5s ease var(--d,0s),transform .55s cubic-bezier(.22,1,.36,1) var(--d,0s);
}
@media (prefers-reduced-motion:reduce){
  .drawer .dw-status,.drawer .dw-head,.drawer .dw-main a,.drawer .dw-grid a,.drawer .drawer-cta{opacity:1;transform:none;transition:none}
}
@media (max-width:1080px){
  .nav-links{display:none}
  .burger{display:block}
}

/* ---------- ticker ---------- */
.ticker{
  overflow:hidden;background:var(--oxblood);color:var(--cream);
  padding:.9rem 0;border-block:1px solid var(--oxblood-deep);
}
.ticker-track{display:flex;width:max-content;animation:tick 38s linear infinite}
.ticker span{
  font-family:var(--mono);font-size:12.5px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;
  padding-inline:1.4rem;display:flex;align-items:center;gap:2.8rem;
}
.ticker span::after{content:"✕";font-size:9px;opacity:.55}
@keyframes tick{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker-track{animation:none}}

/* ---------- ticket (receipt) motif ---------- */
.tkt{
  background:var(--cream);color:var(--ink);
  border:1px solid var(--line-light);
  position:relative;padding:1.9rem 1.9rem 1.6rem;
}
.tkt::before{
  content:"";position:absolute;inset:auto 0 -1px 0;height:12px;
  background:
    radial-gradient(circle at 8px -4px,transparent 7px,var(--kraft) 7.5px);
  background-size:16px 12px;background-position:bottom;
}
.dark .tkt::before,.darkest .tkt::before{
  background:radial-gradient(circle at 8px -4px,transparent 7px,var(--ink) 7.5px);
  background-size:16px 12px;
}
.tkt-head{
  font-family:var(--mono);font-size:11px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;
  display:flex;justify-content:space-between;gap:1rem;
  padding-bottom:.9rem;margin-bottom:1.1rem;
  border-bottom:1px dashed var(--line-light);
}
.tkt-head .r{opacity:.5}

/* price rows w/ dot leaders */
.li-row{display:flex;align-items:baseline;gap:.7rem;padding:.42rem 0;font-size:.98rem}
.li-row .nm{font-weight:500}
.li-row .nm small{display:block;font-weight:400;font-size:.82rem;opacity:.62;line-height:1.45}
.li-row .fill{flex:1;border-bottom:2px dotted color-mix(in srgb,currentColor 30%,transparent);transform:translateY(-4px);min-width:24px}
.li-row .pr{font-family:var(--mono);font-size:.95rem;font-weight:500;white-space:nowrap}

/* ---------- photo frames ---------- */
.ph{position:relative;overflow:hidden;background:var(--ink-2)}
.ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.ph:hover img{transform:scale(1.045)}
.ph .cap{
  position:absolute;left:0;bottom:0;z-index:2;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--kraft);background:rgba(15,11,7,.78);padding:.5rem .9rem;
}
.ph::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 90px rgba(15,11,7,.22);pointer-events:none}

/* ---------- hero (home) ---------- */
.hero{
  min-height:100svh;position:relative;display:flex;align-items:flex-end;
  color:var(--kraft);background:var(--night);overflow:hidden;
}
.hero-bg{position:absolute;inset:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 30%;animation:kenburns 16s ease-out both}
@keyframes kenburns{from{transform:scale(1.12)}to{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.hero-bg img{animation:none}}
.hero-veil{position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(15,11,7,.42) 0%,rgba(15,11,7,.3) 40%,rgba(15,11,7,.58) 66%,rgba(15,11,7,.93) 100%),
  radial-gradient(ellipse at 22% 18%,rgba(163,48,48,.28),transparent 55%);
}
.hero-in{position:relative;z-index:3;width:min(1360px,94vw);margin-inline:auto;padding:0 0 clamp(3rem,7vh,5.5rem)}
.hero-kicker{margin-bottom:1.4rem;color:var(--brass-soft)}
.hero h1{
  font-size:clamp(3rem,8.6vw,8.2rem);
  line-height:.96;letter-spacing:-.04em;font-weight:500;
}
/* "the rest." gets scratched off — same grease-pencil kill as a scratched ticket line */
.hero h1 .strike{position:relative;display:inline-block;animation:dimrest .5s ease forwards;animation-delay:1.55s}
.hero h1 .strike::after{
  content:"";position:absolute;left:-1%;right:-2%;top:53%;height:.085em;border-radius:.05em;
  background:var(--oxblood-glow);
  transform:scaleX(0) rotate(-1.4deg);transform-origin:0 55%;
  animation:strike .5s cubic-bezier(.7,0,.3,1) forwards;animation-delay:1.55s;
}
@keyframes strike{to{transform:scaleX(1) rotate(-1.4deg)}}
@keyframes dimrest{to{opacity:.68}}
body.introing .hero h1 .strike,body.introing .hero h1 .strike::after{animation-delay:calc(1.55s + 2.15s)}
@media (prefers-reduced-motion:reduce){
  .hero h1 .strike{animation:none;opacity:.68}
  .hero h1 .strike::after{animation:none;transform:scaleX(1) rotate(-1.4deg)}
}
.hero h1 .line{display:block}
.hero h1 .line>span{
  display:block;opacity:0;filter:blur(16px);transform:scale(1.045) translateY(14px);
  transform-origin:0 80%;will-change:transform,filter;
  animation:cine 1.7s cubic-bezier(.16,1,.3,1) forwards;animation-delay:var(--d,0s);
}
@keyframes cine{55%{filter:blur(2px)}100%{opacity:1;filter:blur(0);transform:none}}
@media (prefers-reduced-motion:reduce){.hero h1 .line>span{animation:none;opacity:1;filter:none;transform:none}}
.hero h1 em{color:#d04f44;text-shadow:0 2px 26px rgba(15,11,7,.55)}
.hero-foot{
  margin-top:2.6rem;display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2.6rem;
}
.hero-meta{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;opacity:.75;line-height:2}
.hero-stamp{
  position:absolute;right:clamp(1rem,5vw,4.5rem);bottom:clamp(5.5rem,14vh,8.5rem);z-index:3;
  width:clamp(88px,10vw,132px);opacity:.92;filter:drop-shadow(0 6px 26px rgba(15,11,7,.6));
  will-change:transform;
}
.scroll-cue{
  position:absolute;left:50%;bottom:1.2rem;transform:translateX(-50%);z-index:3;
  font-family:var(--mono);font-size:10px;letter-spacing:.3em;text-transform:uppercase;opacity:.55;
  animation:cue 2.2s ease-in-out infinite;
}
@keyframes cue{50%{transform:translate(-50%,6px)}}

/* ---------- interior page hero ---------- */
.page-hero{
  position:relative;min-height:62svh;display:flex;align-items:flex-end;
  color:var(--kraft);background:var(--night);overflow:hidden;
  padding-top:var(--nav-h);
}
.page-hero .hero-bg img{animation:none;transform:scale(1.06);filter:brightness(1.05) saturate(1.03)}
.page-hero .hero-veil{background:
  linear-gradient(180deg,rgba(15,11,7,.58) 0%,rgba(15,11,7,.08) 34%,rgba(15,11,7,.08) 58%,rgba(15,11,7,.8) 100%),
  linear-gradient(90deg,rgba(15,11,7,.74) 0%,rgba(15,11,7,.4) 46%,rgba(15,11,7,.12) 100%)}
.page-hero .hero-in{padding-bottom:3.2rem}
.page-hero h1{font-size:clamp(2.6rem,6.4vw,5.4rem);line-height:.98;letter-spacing:-.035em;max-width:14ch}
.page-hero .sub{margin-top:1.1rem;color:rgba(241,233,219,.82)}

/* ---------- parallax band ---------- */
.band{position:relative;height:clamp(340px,58vh,560px);overflow:hidden}
.band img{position:absolute;inset:-18% 0;width:100%;height:136%;object-fit:cover;will-change:transform}
.band .band-cap{
  position:absolute;inset:auto auto 1.4rem 50%;transform:translateX(-50%);z-index:2;
  text-align:center;color:var(--cream);width:max-content;max-width:94vw;
  padding:2.4rem 4rem 1rem;box-sizing:border-box;
  background:radial-gradient(ellipse 60% 115% at 50% 100%,rgba(15,11,7,.6) 0%,rgba(15,11,7,.26) 48%,transparent 72%);
}
.band::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,11,7,.3) 0%,rgba(15,11,7,.24) 52%,rgba(15,11,7,.68) 100%);z-index:1}
.band .band-cap .disp{font-size:clamp(1.7rem,3.6vw,2.8rem);text-shadow:0 2px 30px rgba(15,11,7,.65)}

/* ---------- home: case cards ---------- */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:3rem}
.case-card{text-decoration:none;color:inherit;display:flex;flex-direction:column;background:var(--cream);border:1px solid var(--line-light)}
.case-card .ph{aspect-ratio:4/4.6}
.case-card .case-body{padding:1.5rem 1.5rem 1.7rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.case-card h3{font-size:1.55rem}
.case-card p{font-size:.95rem;opacity:.78}
.case-card .case-go{
  margin-top:auto;padding-top:1rem;
  font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--oxblood);display:flex;align-items:center;gap:.5rem;
}
.case-card:hover .case-go .ar{transform:translateX(5px)}
.case-go .ar{transition:transform .25s}

/* ---------- split layouts ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,5rem);align-items:center}
.split .ph{aspect-ratio:4/5}
.split .ph.wide{aspect-ratio:5/4}
.split-body>*+*{margin-top:1.3rem}

/* ---------- stats / facts strip ---------- */
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-dark);border-block:1px solid var(--line-dark)}
.fact{background:var(--ink);padding:2.2rem 2rem}
.fact b{font-family:var(--disp);font-size:2rem;font-weight:500;display:block;line-height:1.1}
.fact span{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;opacity:.6;display:block;margin-top:.5rem}

/* ---------- hours ---------- */
.hours{list-style:none;font-family:var(--mono);font-size:.95rem}
.hours li{display:flex;justify-content:space-between;gap:1.5rem;padding:.8rem 0;border-bottom:1px dashed color-mix(in srgb,currentColor 25%,transparent)}
.hours li.today-hint{color:var(--brass-soft)}
.hours .d{letter-spacing:.14em;text-transform:uppercase;font-size:.85rem}
.hours .closed{opacity:.5}

/* ---------- forms ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.form-grid .full{grid-column:1/-1}
.fld{display:flex;flex-direction:column;gap:.45rem}
.fld label{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;opacity:.8}
.fld label .req{color:var(--oxblood-glow)}
.fld input,.fld textarea,.fld select{
  font-family:var(--body);font-size:1rem;color:inherit;
  background:transparent;
  border:1px solid color-mix(in srgb,currentColor 30%,transparent);
  padding:.9rem 1rem;border-radius:10px;
}
.fld input:focus,.fld textarea:focus,.fld select:focus{outline:2px solid var(--brass);outline-offset:1px}
.fld textarea{min-height:130px;resize:vertical}
.form-note{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;opacity:.65;line-height:1.7}
.sent-card{
  border:1px solid var(--brass);padding:1.6rem 1.8rem;margin-bottom:2rem;
  font-family:var(--mono);font-size:.95rem;display:none;
}
.sent-card b{color:var(--brass-soft)}
.sent-card.show{display:block}

/* ---------- recipe / menu cards ---------- */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}

/* pill tags */
.tag{
  display:inline-block;font-family:var(--mono);font-size:10.5px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;
  padding:.34rem .7rem;border:1px solid color-mix(in srgb,currentColor 35%,transparent);
}
.tag.red{color:var(--rust);border-color:color-mix(in srgb,var(--rust) 50%,transparent)}
.tag.sage{color:var(--sage);border-color:color-mix(in srgb,var(--sage) 55%,transparent)}
.dark .tag.red,.darkest .tag.red{color:var(--brass-soft);border-color:color-mix(in srgb,var(--brass) 55%,transparent)}

/* pull quote */
.pull{
  font-family:var(--disp);font-size:clamp(1.6rem,3.4vw,2.5rem);line-height:1.22;
  font-weight:480;letter-spacing:-.015em;max-width:26ch;
}
.pull em{color:var(--oxblood-glow)}
.on-light .pull em{color:var(--oxblood)}
.pull-src{font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;opacity:.6;margin-top:1.2rem;display:block}

/* ---------- big CTA band ---------- */
.cta-band{text-align:center;position:relative;overflow:hidden}
.cta-band .disp{font-size:clamp(2.4rem,6vw,4.6rem);line-height:1;max-width:16ch;margin-inline:auto}
.cta-band .btn{margin-top:2.4rem}
.cta-tel{
  display:block;font-family:var(--mono);letter-spacing:.14em;
  font-size:clamp(1.2rem,3vw,1.8rem);margin-top:1.8rem;text-decoration:none;color:var(--brass-soft);
}
.cta-tel:hover{color:var(--brass)}

/* ---------- footer ---------- */
footer{background:var(--night);color:var(--kraft);padding:clamp(4rem,8vw,6.5rem) 0 calc(2.4rem + 74px);position:relative}
.foot-tag{
  font-family:var(--disp);font-size:clamp(2rem,5.4vw,4rem);line-height:1.08;letter-spacing:-.03em;
  max-width:17ch;font-weight:500;
}
.foot-tag em{color:var(--oxblood-onDark)}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:2.5rem;margin-top:3.5rem;padding-top:2.6rem;border-top:1px solid var(--line-dark)}
.foot-grid h4{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;opacity:.55;margin-bottom:1rem}
.foot-grid ul{list-style:none}
.foot-grid li{padding:.26rem 0}
.foot-grid a{text-decoration:none;opacity:.82;font-size:.95rem}
.foot-grid a:hover{opacity:1}
.foot-logo{width:88px;margin-bottom:1.2rem;opacity:.9}
.foot-addr{font-style:normal;font-size:.95rem;line-height:1.9;opacity:.82;overflow-wrap:anywhere}
.li-row .pr{overflow-wrap:anywhere}
.li-row .pr a[href^="mailto"]{white-space:normal;overflow-wrap:normal;display:block;text-align:right}
.foot-base{
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;
  margin-top:3rem;padding-top:1.6rem;border-top:1px solid var(--line-dark);
  font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;opacity:.5;
}
.foot-base a{text-decoration:none}

/* ---------- misc ---------- */
.map-frame{border:0;width:100%;height:420px;filter:grayscale(.75) sepia(.14) contrast(1.02);display:block}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.gallery .ph{aspect-ratio:1}
.press-logos{display:flex;gap:2.4rem;flex-wrap:wrap;align-items:center}

.note-flag{
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;
  border:1px dashed color-mix(in srgb,currentColor 40%,transparent);
  padding:.7rem 1rem;opacity:.75;line-height:1.7;
}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .split{grid-template-columns:1fr}
  .split .ph{aspect-ratio:16/10}
  .case-grid,.grid-3{grid-template-columns:1fr 1fr}
  .grid-4{grid-template-columns:1fr 1fr}
  .facts{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body{font-size:16px}
  .foot-grid{grid-template-columns:1fr}
  .case-grid,.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .hero h1{font-size:clamp(2.7rem,13vw,4rem)}
  .hero-stamp{display:none}
  .gallery{grid-template-columns:1fr 1fr}
  .band{height:300px}
}

/* focus visibility */
a:focus-visible,button:focus-visible,.btn:focus-visible{outline:2px solid var(--brass);outline-offset:3px}

/* ============================================================
   ASK THE COUNTER — chat widget
   ============================================================ */
.chat-fab{
  position:fixed;right:1.2rem;bottom:1.2rem;z-index:200;
  display:flex;align-items:center;gap:.7rem;
  background:var(--oxblood);color:var(--cream);border:0;cursor:pointer;
  padding:.85rem 1.25rem .85rem .9rem;border-radius:999px;
  box-shadow:0 10px 34px rgba(15,11,7,.45);
  font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  transition:transform .25s,background .25s,opacity .25s;
}
.chat-fab:hover{transform:translateY(-2px);background:var(--oxblood-deep)}
.chat-fab.hid{opacity:0;transform:translateY(30px);pointer-events:none}
.chat-fab img{width:30px;height:30px}
.chat-fab .fab-dot{position:absolute;top:6px;right:8px;width:9px;height:9px;border-radius:50%;background:var(--brass);border:2px solid var(--oxblood)}

.chat-panel{
  position:fixed;right:1.2rem;bottom:1.2rem;z-index:210;
  width:min(400px,calc(100vw - 1.6rem));height:min(600px,calc(100dvh - 2.4rem));
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--kraft);color:var(--ink);
  border:1px solid rgba(27,20,16,.25);border-radius:18px;
  box-shadow:0 30px 80px rgba(15,11,7,.55);
  opacity:0;visibility:hidden;transform:translateY(14px) scale(.98);transform-origin:bottom right;
  transition:opacity .3s,transform .3s,visibility 0s .3s;
}
.chat-panel.open{opacity:1;visibility:visible;transform:none;transition:opacity .3s,transform .3s,visibility 0s}
@media (prefers-reduced-motion:reduce){.chat-panel,.chat-fab{transition:none}}

.chat-head{
  display:flex;align-items:center;gap:.8rem;
  background:var(--night);color:var(--kraft);padding:.95rem 1.1rem;flex:none;
}
.chat-head img{width:38px;height:38px}
.chat-head .ch-t{line-height:1.25}
.chat-head .ch-t b{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;display:block}
.chat-head .ch-t span{font-size:11.5px;opacity:.65;display:flex;align-items:center;gap:.4rem}
.chat-head .ch-t span::before{content:"";width:7px;height:7px;border-radius:50%;background:#6fae5c}
.chat-x{margin-left:auto;background:none;border:0;color:inherit;cursor:pointer;padding:.4rem;opacity:.7}
.chat-x:hover{opacity:1}

.chat-log{flex:1;overflow-y:auto;padding:1.1rem;display:flex;flex-direction:column;gap:.55rem}
.cb{
  max-width:82%;padding:.65rem .95rem;font-size:.93rem;line-height:1.5;
  border-radius:16px;white-space:pre-line;overflow-wrap:break-word;
}
.cb.bot{background:#e3d8c2;color:var(--ink);align-self:flex-start;border-bottom-left-radius:5px}
.cb.user{background:var(--oxblood);color:var(--cream);align-self:flex-end;border-bottom-right-radius:5px}
.cb.bot a{color:var(--oxblood);font-weight:500}
.cb.enter{animation:cbIn .3s cubic-bezier(.16,1,.3,1) both}
@keyframes cbIn{from{opacity:0;transform:translateY(8px)}}
@media (prefers-reduced-motion:reduce){.cb.enter{animation:none}}

.cb-dots{display:flex;gap:5px;padding:.8rem 1rem;background:#e3d8c2;border-radius:16px;border-bottom-left-radius:5px;align-self:flex-start}
.cb-dots i{width:7px;height:7px;border-radius:50%;background:rgba(27,20,16,.45);animation:cbDot 1.2s infinite}
.cb-dots i:nth-child(2){animation-delay:.15s}
.cb-dots i:nth-child(3){animation-delay:.3s}
@keyframes cbDot{0%,60%,100%{transform:none;opacity:.45}30%{transform:translateY(-4px);opacity:1}}

.chat-chips{display:flex;gap:.5rem;flex-wrap:wrap;padding:.4rem 1.1rem .6rem;flex:none}
.chat-chips button{
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  background:transparent;border:1px solid rgba(27,20,16,.3);color:var(--ink);
  padding:.45rem .75rem;border-radius:999px;cursor:pointer;transition:.2s;
}
.chat-chips button:hover{background:var(--oxblood);border-color:var(--oxblood);color:var(--cream)}

.chat-bar{display:flex;gap:.6rem;padding:.8rem 1.1rem;border-top:1px solid rgba(27,20,16,.15);flex:none;background:var(--cream)}
.chat-bar input{
  flex:1;border:1px solid rgba(27,20,16,.25);background:#fff;
  font-family:var(--body);font-size:16px;padding:.7rem .9rem;border-radius:999px;color:var(--ink);
}
.chat-bar input:focus{outline:2px solid var(--brass)}
.chat-bar button{
  background:var(--oxblood);border:0;color:var(--cream);width:44px;height:44px;border-radius:50%;
  cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none;transition:background .2s;
}
.chat-bar button:hover{background:var(--oxblood-deep)}
.chat-note{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;text-align:center;opacity:.5;padding:0 1rem .7rem;background:var(--cream)}

@media (max-width:480px){
  .chat-panel{right:.8rem;bottom:.8rem;border-radius:16px}
  .chat-fab span{display:none}
  .chat-fab{padding:.7rem}
  .chat-fab img{width:26px;height:26px}
}

body.drawer-open .chat-fab,body.drawer-open .tb-bar,body.drawer-open .tb-toast{opacity:0;pointer-events:none;transition:opacity .3s}
body.drawer-open .nav{background:var(--night)}

/* ============================================================
   LEVEL 2 — materiality, editorial layouts, cinematic moments
   ============================================================ */

/* --- butcher-paper fiber on light sections --- */
.on-light{position:relative}
.on-light::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .05' numOctaves='3' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .47 0 0 0 0 .36 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)'/%3E%3C/svg%3E");
}
.on-light>*{position:relative}

/* --- torn ticket-edge dividers --- */
.tear{position:absolute;left:0;right:0;height:13px;z-index:6;pointer-events:none}
.tear-top{top:-1px}
.tear-btm{bottom:-1px;transform:scaleY(-1)}
.tear-kraft{background:radial-gradient(circle at 9px -4px,transparent 8px,var(--kraft) 8.5px);background-size:18px 13px}
.tear-ink{background:radial-gradient(circle at 9px -4px,transparent 8px,var(--ink) 8.5px);background-size:18px 13px}
.tear-night{background:radial-gradient(circle at 9px -4px,transparent 8px,var(--night) 8.5px);background-size:18px 13px}

/* --- ghost display type --- */
.ghost{
  position:absolute;z-index:0;pointer-events:none;user-select:none;
  font-family:var(--disp);font-weight:600;font-style:italic;
  font-size:clamp(5rem,16vw,15rem);line-height:1;letter-spacing:-.02em;white-space:nowrap;
  color:transparent;-webkit-text-stroke:1.5px rgba(27,20,16,.10);
}
.dark .ghost,.darkest .ghost{-webkit-text-stroke:1.5px rgba(241,233,219,.09)}

/* --- taped photo --- */
.ph-tape{overflow:visible;box-shadow:0 18px 44px rgba(15,11,7,.25)}
.ph-tape img{box-shadow:none}
.ph-tape::before{display:none}
.tape{
  position:absolute;width:118px;height:34px;z-index:6;
  /* opaque enough to read over light photos (white brick made the old
     translucent tape vanish, leaving orphan scraps past the photo edge) */
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.16) 0 2px,transparent 2px 5px),
    linear-gradient(rgba(238,227,203,.96),rgba(222,207,176,.88));
  border-left:1px dashed rgba(120,100,70,.3);border-right:1px dashed rgba(120,100,70,.3);
  box-shadow:0 3px 9px rgba(15,11,7,.3);
}
/* centered on the corner point, 45° — half on the photo, half on the wall */
.tape-tl{top:-17px;left:-59px;transform:rotate(-45deg)}
.tape-tr{top:-17px;right:-59px;transform:rotate(45deg)}
.tilt-l{transform:rotate(-1.6deg)}
.tilt-r{transform:rotate(1.8deg)}

/* --- rotated sticker chips --- */
.sticker{
  position:absolute;z-index:6;display:inline-block;
  font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  background:var(--oxblood);color:var(--cream);padding:.55rem .9rem;
  transform:rotate(-4deg);box-shadow:0 8px 22px rgba(15,11,7,.3);
}
.sticker.brass{background:var(--brass);color:var(--night)}

/* --- stamp mark (inked badge print) --- */
.stampmark{
  position:absolute;z-index:5;pointer-events:none;opacity:.16;
  mix-blend-mode:multiply;transform:rotate(-14deg);
}
.dark .stampmark,.darkest .stampmark{mix-blend-mode:screen;opacity:.12}

/* --- hero ring text around the badge --- */
.hero-stamp{background:transparent}
.stamp-wrap{
  position:absolute;right:clamp(1rem,5vw,4.5rem);bottom:clamp(5.5rem,14vh,8.5rem);z-index:3;
  width:clamp(150px,16vw,232px);aspect-ratio:1;
}
.stamp-wrap .badge{position:absolute;left:19%;top:19%;width:62%;height:62%;filter:drop-shadow(0 6px 26px rgba(15,11,7,.6))}
.stamp-wrap svg{position:absolute;inset:0;animation:ringSpin 26s linear infinite}
.stamp-wrap svg text{
  font-family:var(--mono);font-size:8.4px;font-weight:600;letter-spacing:.32em;
  fill:var(--brass-soft);text-transform:uppercase;
}
@keyframes ringSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.stamp-wrap svg{animation:none}}
@media (max-width:640px){.stamp-wrap{display:none}}

/* --- intro stamp-in --- */
.intro{
  position:fixed;inset:0;z-index:400;background:var(--night);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4rem;
  transition:transform .7s cubic-bezier(.7,0,.2,1);
}
.intro.lift{transform:translateY(-101%)}
.intro img{
  width:120px;opacity:0;transform:scale(2.1) rotate(-10deg);
}
.intro.go img{animation:stampIn .55s cubic-bezier(.2,1.4,.4,1) .15s forwards}
@keyframes stampIn{
  60%{opacity:1;transform:scale(.94) rotate(1deg)}
  100%{opacity:1;transform:scale(1) rotate(0)}
}
.intro p{
  font-family:var(--mono);font-size:11px;letter-spacing:.34em;text-transform:uppercase;
  color:var(--brass-soft);opacity:0;transition:opacity .4s .5s;
}
.intro.go p{opacity:.8}
.intro::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E");
}

/* --- nav: phone + open/closed pill --- */
a.nav-status,.nav-links a.nav-status{
  display:flex;align-items:center;gap:.55rem;
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid var(--line-dark);border-radius:999px;padding:.55rem 1.05rem;
  background:rgba(15,11,7,.42);
  text-decoration:none;opacity:.9;white-space:nowrap;
}
.nav-status i{width:7px;height:7px;border-radius:50%;background:#6fae5c;flex:none}
.nav-status.closed i{background:var(--rust)}
@media (max-width:1280px){.nav-status .st-txt-l{display:none}}

/* --- walk-the-counter interactive list --- */
.cl{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.cl-list{display:flex;flex-direction:column}
.cl-item{
  display:flex;align-items:baseline;gap:1.2rem;text-decoration:none;
  padding:1.15rem .4rem;border-bottom:1px solid var(--line-dark);
  transition:padding .3s, background .3s;position:relative;
}
.cl-item:first-child{border-top:1px solid var(--line-dark)}
.cl-item .no{font-family:var(--mono);font-size:11px;letter-spacing:.18em;opacity:.45;width:2.2rem;flex:none}
.cl-item .nm{
  font-family:var(--disp);font-size:clamp(1.6rem,3.4vw,2.6rem);font-weight:520;
  letter-spacing:-.02em;line-height:1.05;transition:transform .35s cubic-bezier(.16,1,.3,1),color .3s;
}
.cl-item .ds{font-size:.85rem;opacity:.55;margin-left:auto;text-align:right;max-width:180px;line-height:1.45}
.cl-item .go{font-family:var(--mono);font-size:14px;opacity:0;transform:translateX(-8px);transition:.3s;color:var(--brass-soft)}
.cl-item:hover .nm,.cl-item.on .nm{transform:translateX(10px);color:var(--brass-soft)}
.cl-item:hover .go,.cl-item.on .go{opacity:1;transform:none}
.cl-view{position:sticky;top:calc(var(--nav-h) + 2rem)}
.cl-view .frame{position:relative;aspect-ratio:4/4.4;overflow:hidden;background:var(--ink-2)}
.cl-view .frame img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1.06);transition:opacity .55s,transform 1.4s cubic-bezier(.16,1,.3,1);
}
.cl-view .frame img.show{opacity:1;transform:scale(1)}
.cl-view .cl-cap{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  opacity:.55;margin-top:.9rem;display:flex;justify-content:space-between;
}
@media (max-width:960px){
  .cl{grid-template-columns:1fr}
  .cl-view{display:none}
  .cl-item .ds{display:none}
}

/* --- giant outline marquee --- */
.marquee-giant{overflow:hidden;padding:1.2rem 0;position:relative}
.mg-track{display:flex;width:max-content;animation:tick 60s linear infinite;gap:0}
.mg-track span{
  font-family:var(--disp);font-style:italic;font-weight:600;
  font-size:clamp(4rem,9vw,8rem);line-height:1;white-space:nowrap;padding-right:5rem;
  color:transparent;-webkit-text-stroke:1.5px rgba(241,233,219,.22);
}
.mg-track span b{
  font-weight:600;color:var(--oxblood-glow);-webkit-text-stroke:0;
}
@media (prefers-reduced-motion:reduce){.mg-track{animation:none}}

/* --- big tel display --- */
.tel-giant{
  font-family:var(--disp);font-weight:560;letter-spacing:-.02em;
  font-size:clamp(2.4rem,7vw,5.4rem);text-decoration:none;display:inline-block;line-height:1.1;
  color:var(--kraft);border-bottom:3px solid var(--oxblood-glow);
  transition:color .25s,border-color .25s;
}
.tel-giant:hover{color:var(--brass-soft);border-color:var(--brass)}

/* --- collage --- */
.collage{position:relative;min-height:520px}
.collage .c-main{width:74%;position:relative;z-index:2}
.collage .c-main .ph{aspect-ratio:4/4.7}
.collage .c-over{
  position:absolute;right:0;bottom:-3rem;width:46%;z-index:3;
}
.collage .c-over .ph{aspect-ratio:1}
@media (max-width:960px){
  .collage{margin-bottom:4rem}
  .collage .c-main{width:88%}
  .collage .c-over{width:54%;bottom:-2.4rem}
}

/* --- facts get ticket treatment --- */
.fact b em{color:var(--oxblood-glow);font-style:italic}

/* hero: bottom fade a touch deeper for marquee overlay */
.hero-marquee{position:absolute;left:0;right:0;bottom:0;z-index:2;opacity:.9}
.hero-sticker{
  position:static;display:inline-block;margin-bottom:1.2rem;
  transform:rotate(-2deg);
}

@media (max-width:960px){.ghost{display:none}}

/* ============================================================
   THE ORDER TICKET — builder (order.html)
   ============================================================ */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tb-grid-hidden>.fld,.tb-grid-hidden>.full{display:none}
form.tb-on{display:block}
#tb{max-width:100%}
.tb-head{margin-bottom:2rem}
.tb-no{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--brass-soft);margin-bottom:.8rem}
.tb-title{font-family:var(--disp);font-size:clamp(1.8rem,4vw,2.6rem);font-weight:540;line-height:1.08;letter-spacing:-.02em}
.tb-sub{font-size:.98rem;opacity:.8;max-width:52ch;margin-top:.8rem}
.tb-beats{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.65;margin-top:1rem}
.tb-mini{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;opacity:.7;margin:.4rem 0 .7rem}
.tb-hint{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;opacity:.6;display:block;margin-top:.5rem;line-height:1.6}
.tb-legend{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;opacity:.65;line-height:1.7;border:1px dashed color-mix(in srgb,currentColor 30%,transparent);padding:.6rem .8rem;margin-bottom:1rem}
.tb-escape{font-family:var(--mono);font-size:11.5px;letter-spacing:.05em;opacity:.8;margin:1.6rem 0 2.4rem}
.tb-escape a{color:var(--brass-soft)}
.tb-plain{background:none;border:0;color:inherit;font:inherit;text-decoration:underline;cursor:pointer;opacity:.85}
.tb-linkout{font-size:.9rem;opacity:.8;border:1px dashed color-mix(in srgb,currentColor 30%,transparent);padding:.9rem 1.1rem;margin-top:1.2rem;line-height:1.65}
.tb-linkout a{color:var(--brass-soft);font-weight:500}

/* departments */
.tb-depts{display:flex;flex-direction:column;border-top:1px solid var(--line-dark)}
.tb-dept{border-bottom:1px solid var(--line-dark);padding:0}
.tb-dept-head{
  display:grid;grid-template-columns:1fr auto;grid-template-areas:"l a" "s a";gap:.15rem 1rem;
  width:100%;text-align:left;background:none;border:0;color:inherit;cursor:pointer;
  padding:1.15rem .3rem;min-height:72px;align-items:center;
}
.tb-dept-label{grid-area:l;font-family:var(--disp);font-size:clamp(1.4rem,3vw,1.9rem);font-weight:530;letter-spacing:-.015em}
.tb-dept-sub{grid-area:s;font-size:.85rem;opacity:.6}
.tb-dept-arrow{grid-area:a;font-family:var(--mono);font-size:1.3rem;opacity:.6}
.tb-dept-head:hover .tb-dept-label{color:var(--brass-soft)}
.tb-dept-body{padding:.4rem .3rem 1.6rem}
.tb-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.7rem}
.tb-item{
  text-align:left;background:rgba(241,233,219,.04);border:1px solid var(--line-dark);
  color:inherit;cursor:pointer;padding:.9rem 1rem;min-height:64px;
  display:flex;flex-direction:column;gap:.25rem;transition:border-color .2s,background .2s;
}
.tb-item b{font-family:var(--body);font-weight:600;font-size:.98rem}
.tb-item span{font-family:var(--mono);font-size:10px;letter-spacing:.05em;opacity:.55;line-height:1.5}
.tb-item:hover{border-color:var(--brass);background:rgba(186,140,54,.08)}

/* inline steppers */
.tb-inline{display:flex;flex-direction:column}
.tb-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0;border-bottom:1px dashed var(--line-dark)}
.tb-row b{font-size:.95rem;font-weight:500;display:block}
.tb-row span{font-family:var(--mono);font-size:10px;opacity:.55;display:block;margin-top:.15rem}
.tb-row input{margin-top:.5rem;width:100%;max-width:280px;background:transparent;border:1px solid color-mix(in srgb,currentColor 30%,transparent);color:inherit;font-family:var(--body);font-size:16px;padding:.5rem .7rem}
.tb-step{display:flex;align-items:center;gap:.5rem;flex:none}
.tb-step button{
  width:44px;height:44px;background:transparent;border:1px solid color-mix(in srgb,currentColor 35%,transparent);
  color:inherit;font-size:1.25rem;cursor:pointer;line-height:1;
}
.tb-step button:hover{border-color:var(--brass);color:var(--brass-soft)}
.tb-step output{font-family:var(--mono);font-size:1rem;font-weight:600;min-width:52px;text-align:center}
.tb-step.big output{min-width:84px}
.tb-addall{margin-top:1.2rem}

/* chips */
.tb-chips{display:flex;flex-wrap:wrap;gap:.55rem}
.tb-chip{
  font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.05em;
  background:transparent;border:1px solid color-mix(in srgb,currentColor 35%,transparent);
  color:inherit;cursor:pointer;padding:.7rem 1rem;min-height:44px;border-radius:11px;
  transition:border-color .15s,background .15s,transform .1s;
}
.tb-chip:active{transform:translateY(1px)}
.tb-chip.on{background:var(--oxblood);border-color:var(--oxblood);color:var(--cream)}
.tb-chip.off{opacity:.4;text-decoration:line-through;cursor:not-allowed}
.tb-day,.tb-time{font-size:11.5px}
.tb-time-custom{margin-top:.6rem;background:transparent;border:1px solid color-mix(in srgb,currentColor 30%,transparent);color:inherit;font-size:16px;padding:.6rem .8rem;width:140px}

/* the paper ticket */
.tb-ticket{margin:2.6rem 0 0;position:relative;max-width:560px}
.tb-lines{list-style:none;margin:0;padding:0}
.tb-line{position:relative;padding:.5rem 0;border-bottom:1px dashed var(--line-light);transition:opacity .5s}
.tb-line .li-row{padding:.1rem 0}
.tb-spec{font-family:var(--mono);font-size:11px;opacity:.65;line-height:1.6;padding-left:.2rem}
.tb-lead{
  position:absolute;top:.4rem;right:4.2rem;font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:.12em;
  color:var(--oxblood);border:1.5px solid var(--oxblood);padding:.15rem .4rem;transform:rotate(-3deg);opacity:.75;pointer-events:none;
}
.tb-line-act{display:flex;gap:1.2rem;margin-top:.3rem}
.tb-line-act button{
  background:none;border:0;cursor:pointer;color:var(--oxblood);
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:.2rem 0;
}
.tb-line.scratched .li-row .nm,.tb-line.scratched .tb-spec{text-decoration:line-through;text-decoration-color:var(--oxblood);text-decoration-thickness:2px}
.tb-line.scratched{opacity:.4}
.tb-empty{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;line-height:2;text-align:center;opacity:.55;padding:1.6rem 0}
.tb-tally{margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--line-light)}
.tb-tally .li-row{padding:.22rem 0;font-size:.92rem}
.tb-tally-note{font-family:var(--mono);font-size:10px;opacity:.6;line-height:1.7;margin-top:.6rem}
.tb-cater{font-size:.88rem;line-height:1.6;border-top:1px dashed var(--line-light);margin-top:.9rem;padding-top:.9rem}
.tb-cater a{color:var(--oxblood);font-weight:500}
.dark .tb-ticket .tb-cater a{color:var(--oxblood)}

/* contact block */
.tb-contact{margin-top:2.4rem;display:flex;flex-direction:column;gap:1.3rem;max-width:560px}
.tb-contact-t{font-size:13px}
.tb-details{font-family:var(--mono);font-size:11px}
.tb-details summary{cursor:pointer;letter-spacing:.08em;text-transform:uppercase;opacity:.65;padding:.4rem 0}
.tb-details textarea{width:100%;min-height:260px;font-family:var(--mono);font-size:11.5px;line-height:1.6;background:rgba(241,233,219,.05);border:1px dashed color-mix(in srgb,currentColor 30%,transparent);color:inherit;padding:1rem}
.tb-send{margin-top:.4rem}

/* sticky bar */
.tb-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:150;
  display:flex;justify-content:space-between;align-items:center;gap:1rem;
  background:var(--kraft);color:var(--ink);border:0;cursor:pointer;
  padding:1rem 1.2rem calc(1rem + env(safe-area-inset-bottom));
  font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  box-shadow:0 -12px 34px rgba(15,11,7,.35);
  transform:translateY(110%);transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.tb-bar::before{
  content:"";position:absolute;top:-12px;left:0;right:0;height:13px;transform:scaleY(-1);
  background:radial-gradient(circle at 9px -4px,transparent 8px,var(--kraft) 8.5px);background-size:18px 13px;
}
.tb-bar.has{transform:none}
.tb-bar-r{opacity:.75;text-transform:none;letter-spacing:.04em}
@media (min-width:701px){.tb-bar{left:1.2rem;right:auto;bottom:1.2rem;max-width:380px;border:1px solid var(--line-light)}.tb-bar::before{display:none}}
body:has(.chat-panel.open) .tb-bar{display:none}

/* composer sheet */
.tb-sheet{
  border:0;padding:0;margin:auto auto 0;width:100%;max-width:640px;
  background:var(--kraft);color:var(--ink);max-height:88dvh;
  box-shadow:0 -30px 80px rgba(15,11,7,.5);
}
.tb-sheet::backdrop{background:rgba(15,11,7,.62);backdrop-filter:blur(3px)}
.tb-sheet-in{max-height:88dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 0 calc(.2rem + env(safe-area-inset-bottom))}
.tb-sheet-in::before{content:"";display:block;flex:0 0 auto;width:64px;height:4px;background:color-mix(in srgb,currentColor 25%,transparent);margin:1.1rem auto 1rem;border-radius:4px}
.tb-preview{padding:0 1.4rem}
.tb-controls{display:flex;flex-direction:column}
.tb-optspane{flex:0 0 auto;display:flex;flex-direction:column;justify-content:flex-start;padding:.1rem 1.4rem .6rem}
.tb-pane{flex:0 0 auto}
.tb-sheet-head b{font-family:var(--disp);font-size:1.6rem;font-weight:540;display:block}
.tb-sheet-head span{font-family:var(--mono);font-size:10.5px;opacity:.6;letter-spacing:.06em}
.tb-f{border:0;margin:1.3rem 0 0;padding:0}
.tb-f legend,.tb-leg{display:block;font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;opacity:.75;margin:0 0 .8rem;padding:0}
.tb-f input[type="text"]{width:100%;background:#fff;border:1px solid rgba(27,20,16,.25);color:inherit;font-family:var(--body);font-size:16px;padding:.8rem .9rem}
.tb-custom{margin-top:.7rem}
.tb-price{font-family:var(--mono);font-size:11px;letter-spacing:.08em;opacity:.65;margin-top:1.2rem;text-transform:uppercase}
/* thickness gauge — a side-view steak: fat cap (i) over meat (b) */
.tb-gauge{display:none;flex-direction:column;align-items:flex-start;margin-top:.8rem}
.tb-gauge.show{display:inline-flex}
.tb-gauge i{display:block;width:54px;height:5px;background:#e8dcc0;border:1px solid rgba(27,20,16,.18);border-bottom:0}
.tb-gauge b{display:block;width:54px;height:16px;background:var(--oxblood);transition:height .3s cubic-bezier(.2,1.2,.4,1)}
.tb-sheet-foot{position:sticky;bottom:0;z-index:6;display:flex;align-items:center;gap:1.2rem;margin:0;background:var(--kraft);border-top:1px solid color-mix(in srgb,currentColor 10%,transparent);padding:.9rem 1.4rem calc(.4rem + env(safe-area-inset-bottom))}
.tb-nevermind{background:none;border:0;color:inherit;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;opacity:.7}
.tb-add{flex:1;justify-content:center}
.tb-nudge{font-family:var(--mono);font-size:11.5px;color:var(--oxblood);letter-spacing:.04em;margin-top:.8rem;line-height:1.6}

/* toast */
.tb-toast{
  position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:300;
  background:var(--night);color:var(--kraft);font-family:var(--mono);font-size:12px;letter-spacing:.05em;
  padding:.8rem 1.2rem;box-shadow:0 14px 40px rgba(15,11,7,.5);max-width:min(480px,90vw);text-align:center;line-height:1.6;
}
.tb-toast a{color:var(--brass-soft)}
.tb-undo{background:none;border:1px solid var(--brass);color:var(--brass-soft);font:inherit;padding:.2rem .7rem;margin-left:.6rem;cursor:pointer;text-transform:uppercase;font-size:10.5px;letter-spacing:.1em}

/* draft banner */
.tb-banner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.8rem}
.tb-banner p{font-family:var(--mono);font-size:12px;letter-spacing:.03em}
.tb-banner div{display:flex;align-items:center;gap:1rem}
.tb-banner .btn{padding:.7rem 1.1rem}

/* the hand-off */
.tb-stamp{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:6;
  color:var(--oxblood);mix-blend-mode:multiply;
}
.tb-stamp svg{width:min(230px,64%);transform:rotate(-8deg);animation:stampIn .45s cubic-bezier(.2,1.4,.4,1) both}
.tb-stamp text{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.3em;fill:currentColor;text-transform:uppercase}
.tb-stamp text.big{font-size:17px;letter-spacing:.18em;font-weight:700}
.tb-ticket.kachunk{animation:kachunk .1s linear 1}
@keyframes kachunk{50%{transform:translate(1px,-2px)}}
.tb-ticket.torn{
  clip-path:polygon(0 0,100% 0,100% 62%,96% 64%,92% 61%,88% 64%,84% 61%,80% 64%,76% 61%,72% 64%,68% 61%,64% 64%,60% 61%,56% 64%,52% 61%,48% 64%,44% 61%,40% 64%,36% 61%,32% 64%,28% 61%,24% 64%,20% 61%,16% 64%,12% 61%,8% 64%,4% 61%,0 64%);
  transform:translateY(-6px) rotate(-.6deg);opacity:.85;transition:transform .3s,opacity .3s;
}
@media (prefers-reduced-motion:reduce){
  .tb-stamp svg{animation:none}
  .tb-ticket.kachunk,.tb-ticket.torn{animation:none;clip-path:none;transform:none;opacity:1}
}

/* sent stub */
.tb-stub{max-width:560px;margin-inline:auto;position:relative;transform:rotate(-.8deg);
  clip-path:polygon(0 0,100% 0,100% 97%,96% 99%,92% 96%,88% 99%,84% 96%,80% 99%,76% 96%,72% 99%,68% 96%,64% 99%,60% 96%,56% 99%,52% 96%,48% 99%,44% 96%,40% 99%,36% 96%,32% 99%,28% 96%,24% 99%,20% 96%,16% 99%,12% 96%,8% 99%,4% 96%,0 99%)}
.tb-stub::before{display:none}
.tb-stub-stamp{
  position:absolute;top:3.1rem;right:1.1rem;color:var(--oxblood);border:3px solid var(--oxblood);
  font-family:var(--mono);font-size:13px;font-weight:700;letter-spacing:.2em;padding:.35rem .8rem;
  transform:rotate(-7deg);opacity:.7;border-radius:3px;
}
.tb-stub a{color:var(--oxblood)}
.dark .tb-stub a,.darkest .tb-stub a{color:var(--oxblood)}

/* dark-section adjustments (order form section is .dark) */
.dark .tb-item,.darkest .tb-item{background:rgba(241,233,219,.04)}
.dark .tb-ticket,.darkest .tb-ticket{color:var(--ink)}
@media (max-width:640px){
  .tb-items{grid-template-columns:1fr 1fr}
  .tb-ticket{margin-top:2rem}
}

/* ============================================================
   MOTION V3 — scroll engine, logo reveal, pinned sequence
   ============================================================ */

/* ---- cross-page transitions (progressive) ---- */
@view-transition{navigation:auto}
@keyframes vt-out{to{opacity:0;transform:translateY(-14px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(14px)}}
::view-transition-old(root){animation:vt-out .28s cubic-bezier(.4,0,1,1) both}
::view-transition-new(root){animation:vt-in .38s cubic-bezier(0,0,.2,1) both}
@media (prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}

/* ---- logo reveal ---- */
.intro2{
  position:fixed;inset:0;z-index:400;background:var(--night);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;
  transition:transform .8s cubic-bezier(.76,0,.18,1);cursor:pointer;
}
.intro2.lift{transform:translateY(-101%)}
.intro2::before{
  content:"";position:absolute;width:min(70vmin,560px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(163,48,48,.32),transparent 62%);
  opacity:0;transform:scale(.6);transition:opacity .9s,transform 1.2s cubic-bezier(.16,1,.3,1);
}
.intro2.glow::before{opacity:1;transform:scale(1)}
.intro2::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E");
}
.i2-mark{position:relative;width:min(46vmin,300px);aspect-ratio:1}
.i2-mark svg{position:absolute;inset:0;overflow:visible}
.i2-mark circle{
  fill:none;stroke:var(--brass-soft);stroke-width:.8;
  stroke-dasharray:1000;stroke-dashoffset:1000;
}
.intro2.go .i2-ring-o{animation:i2draw 1.15s cubic-bezier(.6,0,.2,1) .1s forwards}
.intro2.go .i2-ring-i{animation:i2draw 1.15s cubic-bezier(.6,0,.2,1) .3s forwards}
@keyframes i2draw{to{stroke-dashoffset:0}}
.i2-mark .i2-ringtext{opacity:0;transform-origin:50% 50%}
.intro2.go .i2-ringtext{animation:i2text 1s ease .8s forwards}
@keyframes i2text{from{opacity:0;transform:rotate(-24deg)}to{opacity:1;transform:rotate(0)}}
.i2-ringtext text{
  font-family:var(--mono);font-size:5.5px;font-weight:600;letter-spacing:.42em;
  fill:var(--brass-soft);text-transform:uppercase;
}
.i2-badge{
  position:absolute;left:17%;top:17%;width:66%;height:66%;opacity:0;transform:scale(1.9) rotate(-9deg);
  filter:drop-shadow(0 10px 40px rgba(15,11,7,.8));
}
.intro2.go .i2-badge{animation:i2stamp .5s cubic-bezier(.2,1.4,.4,1) 1.05s forwards}
@keyframes i2stamp{
  55%{opacity:1;transform:scale(.95) rotate(1deg)}
  100%{opacity:1;transform:scale(1) rotate(0)}
}
.i2-kick{
  font-family:var(--mono);font-size:11px;letter-spacing:.44em;text-transform:uppercase;
  color:var(--brass-soft);opacity:0;transform:translateY(10px);
  transition:opacity .6s .2s,transform .6s .2s;
}
.intro2.glow .i2-kick{opacity:.85;transform:none}
.i2-skip{
  position:absolute;bottom:1.6rem;font-family:var(--mono);font-size:9.5px;letter-spacing:.3em;
  text-transform:uppercase;color:var(--kraft);opacity:.35;
}
/* hero lines wait for the intro */
body.introing .hero h1 .line>span{animation-delay:calc(var(--d) + 2.15s)}

/* ---- blur-rise word reveals ---- */
.wr{--wd:0s}
.wr .w{
  display:inline-block;opacity:0;transform:translateY(.55em);filter:blur(7px);
  transition:opacity .7s,transform .7s cubic-bezier(.16,1,.3,1),filter .7s;
  transition-delay:calc(var(--wd) + var(--wi)*.05s);
  will-change:transform,filter;
}
.wr.in .w{opacity:1;transform:none;filter:blur(0)}
@media (prefers-reduced-motion:reduce){.wr .w{opacity:1;transform:none;filter:none;transition:none}}

/* ---- nav hide on scroll down ---- */
.nav{transition:background .35s,box-shadow .35s,backdrop-filter .35s,transform .45s cubic-bezier(.16,1,.3,1)}
.nav.hide{transform:translateY(-100%)}

/* ---- scrub engine targets (JS sets transforms) ---- */
.hero-in,.hero-bg img{will-change:transform}
.ph img{will-change:transform}
.ph img.plx{transform:translateY(var(--plx,0)) scale(1.12)}
.ph:hover img.plx{transform:translateY(var(--plx,0)) scale(1.15)}

/* ---- pinned counter sequence ---- */
.seq{position:relative;background:var(--ink);color:var(--kraft)}
.seq-track{height:520vh;position:relative}
.seq-pane{
  position:sticky;top:0;height:100svh;overflow:hidden;
  display:flex;align-items:center;
}
.seq-in{
  width:min(1360px,94vw);margin-inline:auto;position:relative;z-index:3;
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,5rem);align-items:center;
}
.seq-imgs{position:relative;aspect-ratio:4/4.4;overflow:hidden;background:var(--ink-2);max-height:72svh}
.seq-imgs img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1.08);transition:opacity .6s,transform 1.6s cubic-bezier(.16,1,.3,1);
}
.seq-imgs img.on{opacity:1;transform:scale(1)}
.seq-copy{position:relative;min-height:260px}
.seq-step{
  position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:1rem;
  opacity:0;transform:translateY(26px);filter:blur(6px);
  transition:opacity .5s,transform .6s cubic-bezier(.16,1,.3,1),filter .5s;
  pointer-events:none;
}
.seq-step.on{opacity:1;transform:none;filter:blur(0);pointer-events:auto}
.seq-no{font-family:var(--mono);font-size:12px;letter-spacing:.24em;color:var(--brass-soft)}
.seq-step h3{font-size:clamp(2.2rem,5vw,4rem);font-weight:520;letter-spacing:-.03em;line-height:1}
.seq-step p{font-size:1rem;opacity:.72;max-width:38ch}
.seq-step .seq-go{
  font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brass-soft);text-decoration:none;display:inline-flex;gap:.6rem;margin-top:.4rem;
}
.seq-step .seq-go:hover{color:var(--brass)}
.seq-head{position:absolute;top:calc(var(--nav-h) + 1.2rem);left:0;right:0;z-index:4}
.seq-head .wrap-wide{display:flex;justify-content:space-between;align-items:baseline}
.seq-rail{position:absolute;bottom:2.2rem;left:0;right:0;z-index:4}
.seq-rail .wrap-wide{display:flex;gap:.5rem;align-items:center}
.seq-tick{height:2px;flex:1;background:rgba(241,233,219,.16);position:relative;overflow:hidden}
.seq-tick i{position:absolute;inset:0;background:var(--oxblood-glow);transform:scaleX(0);transform-origin:left;transition:transform .3s linear}
.seq-tick.done i{transform:none}
.seq-count{font-family:var(--mono);font-size:11px;letter-spacing:.2em;opacity:.6;min-width:52px;text-align:right}
@media (max-width:960px){
  .seq-in{grid-template-columns:1fr;gap:1.2rem;align-content:center}
  .seq-imgs{aspect-ratio:4/3;max-height:44svh}
  .seq-copy{min-height:210px}
  .seq-step h3{font-size:clamp(1.9rem,8vw,2.6rem)}
}
@media (prefers-reduced-motion:reduce){
  .seq-track{height:auto}
  .seq-pane{position:static;height:auto;padding:4rem 0}
  .seq-imgs{display:none}
  .seq-copy{min-height:0}
  .seq-step{position:static;opacity:1;transform:none;filter:none;pointer-events:auto;margin-bottom:2.5rem}
}

/* ---- composer sheet slide-up ---- */
.tb-sheet[open]{animation:sheetUp .45s cubic-bezier(.16,1,.3,1)}
.tb-sheet::backdrop{animation:bdIn .4s ease}
@keyframes sheetUp{from{transform:translateY(60px);opacity:.4}}
@keyframes bdIn{from{opacity:0}}
@media (prefers-reduced-motion:reduce){.tb-sheet[open],.tb-sheet::backdrop{animation:none}}

/* chat fab entrance */
.chat-fab{animation:fabIn .7s cubic-bezier(.2,1.3,.4,1) 1.2s both}
@keyframes fabIn{from{opacity:0;transform:translateY(24px) scale(.8)}}
@media (prefers-reduced-motion:reduce){.chat-fab{animation:none}}

/* ============================================================
   HIGH-END PASS — paper ticket order flow, global refinement
   ============================================================ */

/* the hidden attribute must always win (fixes duplicated day/time fields) */
[hidden]{display:none!important}

/* ---- global material refinement ---- */
.tkt{
  background:linear-gradient(178deg,#faf5e9 0%,#f4edda 100%);
  box-shadow:0 18px 44px rgba(15,11,7,.28),0 2px 8px rgba(15,11,7,.14);
  border:0;
}
.on-light .tkt{box-shadow:0 14px 34px rgba(27,20,16,.14),0 2px 6px rgba(27,20,16,.08)}
.ph::after{
  inset:10px;border:1px solid rgba(241,233,219,.32);
  box-shadow:inset 0 0 80px rgba(15,11,7,.22);
}
/* taped photos: no inset hairline, no vignette shadow — they read as crop/shadow artifacts against the tape */
.ph-tape::after{display:none}
.btn-red{box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 26px rgba(90,20,20,.28)}
.btn-red:hover{transform:translateY(-1px)}
.btn-red:active{transform:translateY(0)}

/* ---- order builder: two-column composition ---- */
@media (min-width:1000px){
  #tb{
    display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
    grid-template-areas:"head head" "modes modes" "banner banner" "depts ticket" "linkout ticket" "escape ticket";
    grid-template-rows:auto auto auto auto auto 1fr;
    column-gap:clamp(2.5rem,4vw,4.5rem);align-items:start;
  }
  .tb-head{grid-area:head}
  .tb-modes{grid-area:modes}
  .tb-banner-slot{grid-area:banner}
  .tb-depts{grid-area:depts}
  #tb>.tb-linkout{grid-area:linkout}
  #tb>.tb-escape{grid-area:escape}
  .tb-ticket{
    grid-area:ticket;align-self:start;
    position:sticky;top:calc(var(--nav-h) + 1.6rem);
    margin-top:0;
  }
}
.tb-head{margin-bottom:2.6rem}
.tb-title{font-size:clamp(2rem,4.6vw,3.2rem)}

/* dept heads: numbered, circled arrow, brass sweep */
.tb-depts{counter-reset:dept}
.tb-dept{counter-increment:dept}
.tb-dept-head{grid-template-columns:auto 1fr auto;grid-template-areas:"n l a" "n s a";column-gap:1.1rem;position:relative}
.tb-dept-head::before{
  content:counter(dept,decimal-leading-zero);grid-area:n;
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--brass-soft);
  opacity:.7;padding-top:.5rem;align-self:start;
}
.tb-dept-head::after{
  content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;
  background:var(--brass);transform:scaleX(0);transform-origin:left;
  transition:transform .45s cubic-bezier(.16,1,.3,1);
}
.tb-dept-head:hover::after{transform:scaleX(1)}
.tb-dept-arrow{
  width:38px;height:38px;border:1px solid var(--line-dark);border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:1rem;opacity:.8;
  transition:border-color .25s,color .25s,transform .35s;
}
.tb-dept-head:hover .tb-dept-arrow{border-color:var(--brass);color:var(--brass-soft)}
.tb-dept-head[aria-expanded="true"] .tb-dept-arrow{transform:rotate(45deg);border-color:var(--brass);color:var(--brass-soft)}
.tb-item{border-radius:12px}
.tb-item span{color:var(--brass-soft);opacity:.7}

/* ---- the paper ticket, made real ---- */
.tb-ticket{
  max-width:none;
  transform:rotate(-.4deg);
  padding-bottom:2.2rem;
}
.tb-ticket::after{
  content:"";position:absolute;top:14px;right:16px;width:72px;height:72px;
  background:url("../img/logo-ink.png") center/contain no-repeat;
  opacity:.09;transform:rotate(11deg);pointer-events:none;
}
.tb-tape{
  position:absolute;top:-14px;left:50%;transform:translateX(-50%) rotate(-1.5deg);
  width:120px;height:30px;background:rgba(232,222,200,.55);
  box-shadow:0 2px 6px rgba(15,11,7,.18);pointer-events:none;
}
.tb-empty{padding:2.2rem 0 2.6rem}
.tb-lines,.tb-tally,.tb-empty{position:relative;z-index:2}

/* contact written on the paper */
.tb-contact{
  margin:1.6rem 0 0;display:flex;flex-direction:column;gap:1.15rem;max-width:none;
  color:var(--ink);position:relative;z-index:2;
}
.tb-contact .fld label{color:var(--ink);opacity:.75}
.tb-contact .fld input,.tb-contact .fld textarea{
  background:transparent;border:0;border-bottom:2px dotted rgba(27,20,16,.4);
  border-radius:0;padding:.55rem .1rem;font-size:16px;color:var(--ink);
}
.tb-contact .fld input:focus,.tb-contact .fld textarea:focus{
  outline:none;border-bottom:2px solid var(--oxblood);
}
.tb-contact .fld textarea{min-height:64px;border:1px dashed rgba(27,20,16,.3);padding:.7rem .8rem}
.tb-contact .tb-hint{color:rgba(27,20,16,.55)}
.tb-contact .tb-chip{border-color:rgba(27,20,16,.3);color:var(--ink)}
.tb-contact .tb-chip.on{background:var(--oxblood);border-color:var(--oxblood);color:var(--cream)}
.tb-contact .tb-chip.off{color:rgba(27,20,16,.5)}
.tb-contact .tb-time-custom{border-color:rgba(27,20,16,.3);color:var(--ink)}
.tb-row2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
@media (max-width:560px){.tb-row2{grid-template-columns:1fr}}
.tb-details{color:var(--ink)}
.tb-details textarea{background:rgba(27,20,16,.04);border-color:rgba(27,20,16,.25);color:var(--ink)}
.tb-send .btn{width:100%;justify-content:center}
.tb-send .form-note{color:rgba(27,20,16,.6);text-align:center}

/* sheet: premium top corners + eyebrow rhythm */
.tb-sheet{border-radius:20px 20px 0 0}
@media (min-width:641px){.tb-sheet{border-radius:16px;margin-bottom:auto;margin-top:auto}}
.tb-sheet-head{padding-bottom:.4rem;border-bottom:1px dashed rgba(27,20,16,.2);margin-bottom:.4rem}

/* ============================================================
   V4 — hero ticker at the fold + stacked card deck
   ============================================================ */

/* ticker rides the hero bottom edge */
.hero{padding:0}                                  /* global section padding was inflating the hero past the fold */
.page-hero{padding:0;padding-top:var(--nav-h)}
.hero-ticker{position:absolute;left:0;right:0;bottom:0;z-index:4}
.hero .hero-in{padding-bottom:calc(clamp(2.2rem,5vh,4rem) + 58px)}
.hero h1{font-size:clamp(2.5rem,min(7.8vw,13svh),7.4rem)}   /* headline scales with viewport height too — hero must fit the fold; sized so the italic line stays whole */
.stamp-wrap{bottom:calc(clamp(5.5rem,14vh,8.5rem) + 26px)}

/* ---- the deck ---- */
.seq-pane{flex-direction:column;justify-content:center;gap:0}
.seq-deck{
  position:relative;width:min(1240px,92vw);margin-inline:auto;
  height:min(70svh,620px);
}
.seq-card{
  position:absolute;inset:0;display:grid;grid-template-columns:1.02fr .98fr;
  background:linear-gradient(155deg,#2a2016 0%,#1d150e 55%,#171009 100%);
  border:1px solid rgba(241,233,219,.11);border-radius:10px;overflow:hidden;
  box-shadow:0 -8px 24px rgba(0,0,0,.25),0 42px 90px rgba(0,0,0,.55);
  will-change:transform;
}
.seq-card::before{
  content:"";position:absolute;inset:12px;border-radius:6px;pointer-events:none;z-index:3;
  padding:1px;background:linear-gradient(150deg,rgba(212,176,106,.5),rgba(163,48,48,.32) 45%,rgba(212,176,106,.08) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
}
.seq-card::after{ /* dimmer for cards sliding underneath */
  content:"";position:absolute;inset:0;background:var(--night);
  opacity:var(--dim,0);pointer-events:none;z-index:5;border-radius:10px;
}
.sc-media{position:relative;overflow:hidden}
.sc-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.06)}
.sc-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 50%,rgba(52,12,12,.62) 100%)}
.sc-body{
  position:relative;display:flex;flex-direction:column;justify-content:center;gap:1.05rem;
  padding:clamp(1.8rem,4vw,4rem);
  background:radial-gradient(130% 100% at 82% 2%, rgba(178,54,54,.55), transparent 62%), linear-gradient(150deg, #6a1a1a 0%, #4a1010 58%, #2c0909 100%);
}
.sc-body .seq-no{color:var(--brass-soft)}
.sc-body .seq-no::before{content:"";display:inline-block;width:16px;height:1px;vertical-align:middle;margin-right:.6rem;background:var(--brass-soft);box-shadow:0 0 8px rgba(212,176,106,.5)}
.sc-body h3,.sc-body p,.seq-card .seq-go{color:var(--cream)}
.seq-card:hover .sc-ghost{color:rgba(248,242,228,.13);-webkit-text-stroke-color:rgba(248,242,228,.8)}
.seq-card:hover .seq-go span{transform:translateX(4px)}
.seq-go span{display:inline-block;transition:transform .25s ease}
.sc-ghost{
  position:absolute;right:1.4rem;top:.15rem;z-index:0;pointer-events:none;user-select:none;
  font-family:var(--disp);font-style:italic;font-weight:600;line-height:1;
  font-size:clamp(6.6rem,12.5vw,12rem);
  color:rgba(248,242,228,.05);
  -webkit-text-stroke:1.4px rgba(248,242,228,.5);
  filter:drop-shadow(0 6px 22px rgba(0,0,0,.35));
  transition:color .4s ease,-webkit-text-stroke-color .4s ease;
}
.sc-body>*{position:relative;z-index:1}
.sc-body h3{font-size:clamp(2rem,4.2vw,3.4rem);font-weight:530;letter-spacing:-.03em;line-height:1}
.sc-body p{font-size:1rem;opacity:.72;max-width:36ch}
@media (max-width:960px){
  /* keep the whole pinned card in the band ABOVE the fixed call-bar so its
     title + CTA never sit too low / under the bar as cards stack */
  .seq-pane{justify-content:flex-start;padding-top:calc(var(--nav-h) + 3.4rem);padding-bottom:calc(56px + env(safe-area-inset-bottom) + .6rem)}
  .seq-head{margin-bottom:.9rem}
  .seq-deck{height:min(62svh,540px)}
  .seq-card{grid-template-columns:1fr;grid-template-rows:.7fr 1.3fr}  /* smaller photo, bigger red text body */
  .sc-media::after{background:linear-gradient(180deg,transparent 42%,rgba(29,21,14,.7) 100%)}
  .sc-ghost{font-size:4.4rem;top:.5rem;bottom:auto;right:1.1rem}
  .sc-body{justify-content:center;gap:.7rem;padding:1.3rem clamp(1.4rem,5vw,2rem)}
  .sc-body h3{font-size:clamp(1.7rem,7vw,2.3rem)}
  .sc-body .seq-no{font-size:11px}
  .sc-body p{font-size:.95rem;max-width:34ch}
  .seq-card .seq-go{margin-top:.2rem}
}
@media (prefers-reduced-motion:reduce){
  .seq-deck{height:auto;display:flex;flex-direction:column;gap:1.5rem}
  .seq-card{position:static;transform:none!important}
  .seq-card::after{display:none}
}
.seq-tick i{transition:none} /* scrubbed directly — no smoothing lag */

/* ---- cinematic hero film sequence (HOME hero only — page heroes keep their single visible image) ---- */
.hero .hero-bg img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;
  opacity:0;transition:opacity 1.4s ease;animation:none;
}
.hero .hero-bg img.on{opacity:1}
.hero .hero-bg img.kb-on{animation:kbA 9s ease-out both}
.hero .hero-bg img.kb-on.kb-b{animation-name:kbB}
.hero .hero-bg img.kb-on.kb-c{animation-name:kbC}
@keyframes kbA{from{transform:scale(1.14) translate(1.4%,1%)}to{transform:scale(1.02) translate(0,0)}}
@keyframes kbB{from{transform:scale(1.04) translate(-1%,0)}to{transform:scale(1.15) translate(1%,-1%)}}
@keyframes kbC{from{transform:scale(1.15) translate(0,-1.2%)}to{transform:scale(1.03) translate(-.8%,.6%)}}
@media (prefers-reduced-motion:reduce){.hero .hero-bg img.kb-on{animation:none}}
.hero-slidebar{
  position:absolute;left:0;right:0;bottom:58px;z-index:4;
  width:min(1360px,94vw);margin-inline:auto;
  display:flex;align-items:center;justify-content:space-between;gap:2rem;
  padding-bottom:.8rem;pointer-events:none;
}
.hs-cap{
  font-family:var(--mono);font-size:10px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--kraft);opacity:.66;transition:opacity .5s;
}
.hs-cap.swap{opacity:0}
.hs-dots{display:flex;gap:.45rem}
.hs-dots i{width:26px;height:2px;background:rgba(241,233,219,.25);transition:background .4s}
.hs-dots i.on{background:var(--oxblood-glow)}
@media (max-width:640px){.hero-slidebar{bottom:52px}.hs-cap{letter-spacing:.14em;white-space:nowrap}}

/* ---- the game layer: punch card, print-in, ready glow ---- */
.tb-beats{display:flex;flex-wrap:wrap;align-items:baseline;row-gap:.3rem}
.tb-beats span{transition:color .3s;white-space:nowrap}
.tb-beats i{font-style:normal;opacity:.4;margin:0 .55rem}
.tb-beats span.done{color:var(--brass-soft)}
.tb-beats span.done::before{content:"✓ ";font-weight:700}

.tb-punch{
  display:flex;justify-content:space-between;gap:.4rem;
  padding:.75rem .2rem .85rem;margin-bottom:.4rem;
  border-bottom:1px dashed var(--line-light);position:relative;z-index:2;
}
.pc-hole{display:flex;flex-direction:column;align-items:center;gap:.4rem;flex:1}
.pc-hole i{
  width:26px;height:26px;border-radius:50%;
  border:2px dashed rgba(27,20,16,.3);background:transparent;
  transition:border-color .25s;
}
.pc-hole b{
  font-family:var(--mono);font-size:8.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:rgba(27,20,16,.5);
}
.pc-hole.done i{
  border:2px solid var(--oxblood);
  background:radial-gradient(circle at 50% 45%,var(--night) 0 42%,var(--oxblood) 46% 100%);
  box-shadow:inset 0 2px 4px rgba(0,0,0,.5);
}
.pc-hole.done b{color:var(--oxblood)}
.pc-hole.pop i{animation:punchPop .45s cubic-bezier(.2,1.5,.4,1)}
@keyframes punchPop{
  0%{transform:scale(.4)}
  55%{transform:scale(1.25) rotate(8deg)}
  100%{transform:scale(1)}
}
@media (prefers-reduced-motion:reduce){.pc-hole.pop i{animation:none}}

/* line prints in like a receipt feed */
.tb-line.printed{animation:printIn .5s cubic-bezier(.16,1,.3,1)}
@keyframes printIn{
  from{opacity:0;transform:translateY(-9px) rotate(-.6deg)}
  60%{opacity:1;transform:translateY(1px) rotate(.15deg)}
  to{transform:none}
}
.tb-ticket.advance{animation:tAdvance .22s ease-out}
@keyframes tAdvance{40%{transform:rotate(-.4deg) translateY(2px)}to{transform:rotate(-.4deg)}}
@media (prefers-reduced-motion:reduce){.tb-line.printed,.tb-ticket.advance{animation:none}}

/* good haul sticker slaps the ticket corner */
.tb-haul{
  left:auto;right:1.6rem;top:-.7rem;transform:rotate(-8deg);z-index:6;pointer-events:none;
  animation:haulIn .5s cubic-bezier(.2,1.5,.4,1) both;
}
@keyframes haulIn{from{opacity:0;transform:rotate(-8deg) scale(1.8)}to{opacity:1;transform:rotate(-8deg) scale(1)}}
@media (prefers-reduced-motion:reduce){.tb-haul{animation:none}}

/* send button wakes up when the card is fully punched */
.tb-send .btn.ready{animation:readyPulse 2.6s ease-in-out infinite}
@keyframes readyPulse{
  0%,100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 26px rgba(90,20,20,.28)}
  50%{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 10px 34px rgba(122,30,30,.55),0 0 0 5px rgba(186,140,54,.18)}
}
@media (prefers-reduced-motion:reduce){.tb-send .btn.ready{animation:none}}

/* ============================================================
   V6 — lunch/counter fork, delivery, merch, catering builder
   ============================================================ */

/* mode fork cards */
.tb-modes{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-bottom:2.4rem;grid-column:1/-1}
.tb-mode{
  position:relative;overflow:hidden;border-radius:10px;border:1px solid rgba(241,233,219,.14);
  background-size:cover;background-position:center;min-height:210px;cursor:pointer;
  display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:.35rem;
  padding:1.5rem 1.6rem;text-align:left;color:var(--kraft);
  box-shadow:0 24px 60px rgba(0,0,0,.45);
  transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s;
}
.tb-mode::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(15,11,7,.18) 0%,rgba(15,11,7,.82) 78%);
  transition:background .3s;
}
.tb-mode::after{
  content:"";position:absolute;inset:10px;border:1px solid rgba(186,140,54,.35);border-radius:6px;pointer-events:none;
}
.tb-mode:hover{transform:translateY(-4px);box-shadow:0 34px 74px rgba(0,0,0,.6)}
.tb-mode>*{position:relative;z-index:2}
.tm-k{font-family:var(--mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--brass-soft)}
.tm-t{font-family:var(--disp);font-size:clamp(1.6rem,3vw,2.3rem);font-weight:540;letter-spacing:-.02em;line-height:1}
.tm-s{font-size:.9rem;opacity:.82;max-width:34ch;line-height:1.5}
.tm-go{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--oxblood-glow);margin-top:.4rem}
.tb-mode:hover .tm-go{color:var(--brass-soft)}
@media (max-width:760px){.tb-modes{grid-template-columns:1fr}.tb-mode{min-height:150px}}

/* fulfillment choice on the paper */
.tb-fulfill{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.tb-fo{
  text-align:left;background:transparent;border:2px dashed rgba(27,20,16,.3);border-radius:6px;
  padding:.85rem 1rem;cursor:pointer;color:var(--ink);transition:border-color .2s,background .2s;
}
.tb-fo b{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;display:block}
.tb-fo span{font-size:.82rem;opacity:.65;display:block;margin-top:.2rem;line-height:1.4}
.tb-fo.on{border:2px solid var(--oxblood);background:rgba(122,30,30,.07)}
.tb-fo.on b{color:var(--oxblood)}
@media (max-width:480px){.tb-fulfill{grid-template-columns:1fr}}

/* readability pass on the counters */
.tb-dept-sub{font-size:.92rem;opacity:.68}
.tb-item{min-height:76px;padding:1.05rem 2.5rem 1.05rem 1.1rem;position:relative}
.tb-item b{font-size:1.04rem}
.tb-item span{font-size:10.5px;letter-spacing:.06em}
.tb-item::after{
  content:"＋";position:absolute;right:.9rem;top:.9rem;
  font-family:var(--mono);font-size:.95rem;color:var(--brass-soft);opacity:.55;transition:opacity .2s,transform .2s;
}
.tb-item:hover::after{opacity:1;transform:scale(1.15)}
.tb-chip{font-size:12.5px}

/* ---- catering spread builder (reuses ticket design language) ---- */
.cb-coverage{margin-top:.9rem;position:relative;z-index:2}
.cb-cov-t{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(27,20,16,.6);display:flex;justify-content:space-between;margin-bottom:.45rem}
.cb-cov-bar{height:10px;border:1px solid rgba(27,20,16,.3);border-radius:99px;overflow:hidden;background:rgba(27,20,16,.05)}
.cb-cov-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--oxblood),var(--oxblood-glow));transition:width .6s cubic-bezier(.16,1,.3,1)}
.cb-cov-bar.full i{background:linear-gradient(90deg,#4d6b3c,#5a7a46)}
.cb-cov-note{font-family:var(--mono);font-size:9.5px;color:rgba(27,20,16,.5);margin-top:.4rem;line-height:1.6}
.cb-magic{
  display:inline-flex;align-items:center;gap:.6rem;margin-top:.6rem;
  background:var(--brass);color:var(--night);border:0;cursor:pointer;border-radius:3px;
  font-family:var(--mono);font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  padding:.85rem 1.2rem;box-shadow:0 8px 22px rgba(186,140,54,.3);
  transition:transform .25s,box-shadow .25s;
}
.cb-magic:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(186,140,54,.42)}
@media (min-width:1000px){
  #tb:has(.cb-q){grid-template-areas:"head head" "q paper";grid-template-rows:auto 1fr}
  #tb>.cb-q{grid-area:q}
  #cb-paper.tb-ticket{grid-area:paper}
}
.cb-q .tb-dept:last-of-type{border-bottom:0}
.kb-credit a{display:inline-flex;align-items:center;gap:.45rem;text-decoration:none}
.kb-credit img{height:20px;width:auto;opacity:.85;display:inline-block}
.kb-credit a:hover img{opacity:1}

/* ============================================================
   MOBILE AUDIT FIXES (expert-team pass)
   ============================================================ */
/* 1 · contact overflow: long values may wrap on small screens */
.split>*{min-width:0}
@media (max-width:640px){
  .li-row .pr{white-space:nowrap;text-align:right;max-width:210px}
  .li-row .pr a[href^="mailto"]{max-width:none;white-space:normal;overflow-wrap:anywhere}
}
/* 2 · chat FAB rides above the sticky ticket bar on phones */
@media (max-width:700px){
  body:has(.tb-bar.has) .chat-fab{bottom:calc(76px + env(safe-area-inset-bottom))}
}
/* 4/22 · FAB clear of hero dots + safe-area + compact on small phones */
.chat-fab,.chat-panel{bottom:calc(1.2rem + env(safe-area-inset-bottom))}
@media (max-width:640px){
  .hs-dots{margin-right:64px}
}
@media (max-width:480px){
  .chat-fab{padding:.7rem;right:.75rem}
  .chat-fab img{width:26px;height:26px}
}
/* ---- MOBILE AUDIT ROUND 2 (expert-team pass, 390/360) ---- */
/* (chatbot FAB stays fully visible at all times — per Tommy/Kyle; no scroll fade) */
/* flagship red counter deck — center cards higher so CTA clears the call-bar */
@media (max-width:760px){
  .sc-body{justify-content:center;padding-top:0}
  .sc-body p{max-width:32ch}
}
/* light ticket cards: right safe-gutter so quantities clear the FAB band */
@media (max-width:560px){
  .on-light .tkt{padding-right:3.2rem}
  /* reviews: on 1-col mobile the grid-filler CTA sits right above the black CTA band — drop the duplicate */
  .rv-card-cta{display:none}
}
/* 44px tap target for the hamburger without changing the icon size */
@media (max-width:960px){
  .burger{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}
}
/* keep the hero eyebrow on one clean line on small phones (no orphaned 'EST. 2025') */
@media (max-width:560px){
  .hero-kicker{font-size:10.5px;letter-spacing:.14em;gap:10px}
  .hero-kicker::before{width:24px}
}
/* order composer: tel number keeps edge breathing room at 360 */
@media (max-width:430px){
  .cta-tel{font-size:clamp(1.05rem,4.6vw,1.3rem);letter-spacing:.1em;padding:.55rem .5rem;margin:-.55rem -.5rem}
}
/* specials: Facebook embed loads on kraft (not a white slab) and shorter on phones */
@media (max-width:760px){
  .fb-frame iframe{height:460px;background:#f1e7d2}
}
/* 5 · drawer fits short screens + scroll fade */
@media (max-height:900px){
  .dw-main a{font-size:clamp(1.5rem,5.4vh,2rem);padding:.24rem 0}
  p.dw-status{margin-bottom:1.4rem}
  .dw-main{margin-bottom:1.3rem}
}
.drawer::after{content:"";position:sticky;bottom:-6vh;display:block;height:56px;flex:none;
  background:linear-gradient(transparent,var(--night));margin-top:-56px;pointer-events:none}
/* 7 · toast never covers the open chat */
body:has(.chat-panel.open) .tb-toast{display:none}
/* 8 · occasion free-text styled like the worksheet */
.tb-occ-other{display:block;width:100%;max-width:340px;min-height:44px;background:rgba(241,233,219,.05);
  border:1px solid color-mix(in srgb,currentColor 35%,transparent);color:inherit;
  font-family:var(--body);font-size:16px;padding:.6rem .8rem}
.tb-occ-other:focus{outline:none;border-color:var(--brass)}
/* 9 · exact-text preview keeps its 40-column mono layout */
.tb-contact .tb-details .fld textarea,.tb-contact .tb-details textarea{
  font-family:var(--mono);font-size:11.5px;line-height:1.6;min-height:260px}
/* 10/11 · deck rail above cards; header visible on mobile */
.seq-rail{z-index:20}
/* lift the deck progress rail clear of the fixed mobile call-bar so it's visible the whole scrub */
@media (max-width:1080px){.seq-rail{bottom:calc(56px + env(safe-area-inset-bottom) + 1rem)}}
@media (max-width:640px){.seq-rail .wrap-wide{padding-right:4.5rem}}
@media (max-width:960px){.seq-head{position:static;margin-bottom:1.2rem}}
/* 12 · hero type legibility over bright slides */
.hero h1,.hero-kicker{text-shadow:0 2px 24px rgba(15,11,7,.55)}
/* 13 · band captions legible over light photos */
@media (max-width:640px){
  .band::before{background:rgba(15,11,7,.55)}
  .band-cap .eyebrow{white-space:nowrap;font-size:10.5px}
}
.band .band-cap .eyebrow,.band .band-cap .disp{text-shadow:0 1px 14px rgba(15,11,7,.85)}
/* 19 · send button never sheds its arrow */
.tb-send .btn{display:block;text-align:center}
.tb-send .btn .ar{display:inline;margin-left:.4rem}
/* 20 · sticky bar stays one line each side */
.tb-bar-l{white-space:nowrap}
.tb-bar-r{text-align:right}
/* 23/24 · tap-target growth (visual position unchanged) */
.foot-grid a:not(.btn),.foot-addr a{display:inline-block;padding:.4rem 0;margin:-.4rem 0}
.foot-base a{display:inline-block;padding:.5rem 0}
.foot-base .kb-credit a{display:inline-flex}
.form-note a[href^="tel:"],.tb-hint a[href^="tel:"],.tb-escape a{display:inline-block;padding:.5rem .25rem;margin:-.5rem -.25rem}
.cta-tel{padding:.55rem 1rem;margin:-.55rem -1rem}
.tb-line-act button{padding:.75rem .5rem;margin:-.55rem 0}
.tb-nevermind{padding:1rem .8rem;margin:-.8rem 0}
.tb-plain{display:inline-block;padding:.6rem 0}
.seq-card .seq-go{padding:.55rem 0;margin:-.55rem 0}
.chat-chips button{padding:.65rem .85rem}
.chat-x{padding:.65rem}
/* 25 · micro-type floor */
.pc-hole b{font-size:10px}
.tb-lead{font-size:10px}
.chat-note{font-size:11px}
.cb-cov-note,.cb-cov-t,.tb-tally-note,.tb-row span{font-size:10.5px}
.hs-cap{font-size:11px}
.ph .cap{font-size:11.5px}
.foot-base{font-size:11.5px}
.tb-hint{font-size:11px}
/* 3 · composer nudge lives with the pinned foot */
.tb-sheet-foot{flex-wrap:wrap}
.tb-sheet-foot .tb-nudge{flex-basis:100%;margin:.6rem 0 0}
/* 5b · short phones: the whole drawer must fit without scrolling */
@media (max-height:800px){
  .drawer{padding-top:max(9vh,80px);padding-bottom:2vh}
  p.dw-status{margin-bottom:1rem}
  .dw-main a{font-size:clamp(1.2rem,4.4vh,1.6rem);padding:.18rem 0}
  .dw-main a .fill{transform:translateY(-4px)}
  .dw-main{margin-bottom:1rem}
  .dw-grid a{font-size:1.05rem;padding:.32rem 0}
  .drawer-cta{padding-top:.9rem}
  .drawer-cta .btn{padding:.85rem 1.3rem}
  .dw-tel{margin-top:.1rem;padding:.4rem 0}
  .dw-hours{display:none}
}

/* ============================================================
   V6 — the specials board (big, loud, chalk-adjacent)
   ============================================================ */
.board{
  position:relative;margin-top:2.8rem;color:var(--kraft);
  background:#150e09;border:1px solid rgba(241,233,219,.14);
  padding:clamp(1.8rem,4.5vw,3.6rem);
  box-shadow:0 34px 80px rgba(15,11,7,.5);
}
.board::before{content:"";position:absolute;inset:9px;border:1px dashed rgba(241,233,219,.16);pointer-events:none}
.board-tag{
  position:absolute;top:-15px;left:clamp(1.6rem,4vw,3.2rem);z-index:1;
  background:var(--oxblood);color:var(--cream);
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  padding:.55rem 1rem;transform:rotate(-1.8deg);
  box-shadow:0 8px 22px rgba(15,11,7,.5);
}
.bd-hero{display:flex;align-items:center;gap:1.4rem 2.6rem;flex-wrap:wrap;padding:.6rem 0 1.9rem}
.bd-hero-l{max-width:34rem}
.bd-hero h3{font-family:var(--disp);font-size:clamp(2.4rem,5.2vw,4rem);line-height:1.02;font-weight:500;letter-spacing:-.02em;margin:.55rem 0 .8rem}
.bd-hero h3 em{color:var(--oxblood-glow)}
.bd-sub{font-size:.98rem;line-height:1.7;opacity:.78;max-width:30rem}
.bd-price{position:relative;margin-left:auto;font-family:var(--disp);font-size:clamp(2.8rem,6vw,4.6rem);font-weight:500;padding:.4em .7em}
.bd-price svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.bd-price ellipse{
  fill:none;stroke:var(--oxblood-glow);stroke-width:3.2;stroke-linecap:round;
  stroke-dasharray:100;stroke-dashoffset:100;
}
.board.in .bd-price ellipse{stroke-dashoffset:5;transition:stroke-dashoffset 1.1s cubic-bezier(.6,0,.3,1) .55s}
.bd-rows{border-top:1px dashed rgba(241,233,219,.2);padding-top:1.1rem}
.bd-row{display:flex;align-items:baseline;gap:1.1rem;padding:.68rem 0}
.bd-row .nm{font-family:var(--disp);font-size:clamp(1.3rem,2.4vw,1.75rem);font-weight:500;line-height:1.2}
.bd-row .nm small{display:block;font-family:var(--body);font-size:.86rem;font-weight:400;opacity:.6;line-height:1.5;margin-top:.15rem}
.bd-row .fill{flex:1;border-bottom:2px dotted rgba(241,233,219,.22);transform:translateY(-5px);min-width:30px}
.bd-row .pr{font-family:var(--mono);font-size:1.05rem;font-weight:600;color:var(--brass-soft);white-space:nowrap}
@media (max-width:640px){
  .bd-price{margin-left:0;padding:.3em .6em}
  .bd-row{gap:.8rem}
}
@media (prefers-reduced-motion:reduce){.bd-price ellipse{stroke-dashoffset:5;transition:none}}

/* ---- press pull-quotes (reviews + home band) ---- */
.pullq{position:relative;margin:3.4rem 0 0;max-width:56rem;padding-left:clamp(1.6rem,4vw,3rem)}
.pullq::before{
  content:"\201C";position:absolute;left:-.06em;top:-.28em;
  font-family:var(--disp);font-style:italic;font-weight:500;
  font-size:clamp(4.4rem,9vw,7.5rem);line-height:1;color:var(--oxblood);opacity:.85;
}
.pullq .q{
  font-family:var(--disp);font-weight:500;letter-spacing:-.015em;
  font-size:clamp(1.65rem,3.4vw,2.8rem);line-height:1.16;
}
.pullq .q em{color:var(--oxblood)}
.pullq figcaption{
  margin-top:1.2rem;display:flex;align-items:center;gap:1rem;
  font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
}
.pullq figcaption::before{content:"";width:44px;border-top:2px solid var(--oxblood);flex:none}
.pullq .when{opacity:.55}
.pq-r{margin-left:auto}
.pq-dark .q em{color:var(--oxblood-glow)}
.pq-dark::before{color:var(--oxblood-glow)}
.pq-dark figcaption::before{border-color:var(--oxblood-glow)}
.quote-band .pullq{margin-inline:auto;padding-left:0}
.quote-band .pullq::before{position:static;display:block;margin:0 auto -0.35em}
.quote-band .pullq figcaption{justify-content:center}

/* ---- seafood: rules of the ice ---- */
.rules{margin-top:2.6rem;border-bottom:1px dashed rgba(241,233,219,.18)}
.rule{display:flex;gap:clamp(1.2rem,3.4vw,2.8rem);align-items:baseline;padding:1.7rem 0;border-top:1px dashed rgba(241,233,219,.18)}
.rule .no{font-family:var(--mono);font-size:clamp(1.7rem,3.6vw,2.7rem);font-weight:600;color:var(--oxblood-glow);flex:none}
.rule p{font-family:var(--disp);font-size:clamp(1.45rem,2.9vw,2.35rem);font-weight:500;line-height:1.15;letter-spacing:-.015em}
.rule p em{color:var(--brass-soft)}

/* ============================================================
   V7 — expert-panel fixes: a11y, mobile call bar, skip link
   ============================================================ */
/* skip link: hidden until focused */
.skip-link{
  position:fixed;top:10px;left:10px;z-index:300;
  background:var(--oxblood);color:var(--cream);
  font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  padding:.8rem 1.2rem;text-decoration:none;
  transform:translateY(-200%);transition:transform .2s;
}
.skip-link:focus-visible{transform:none}
/* focus ring must survive light sections (brass fails 3:1 on kraft) */
.on-light :focus-visible,.on-light a:focus-visible,.on-light button:focus-visible{outline:3px solid var(--oxblood);outline-offset:2px}
/* required-field marks + display italics on dark: brighter oxblood for contrast */
.dark .req,.darkest .req,.grain .req{color:#d05252}
/* prices must never split mid-number on phones */
@media (max-width:640px){
  .li-row .pr{overflow-wrap:normal}
}
/* persistent mobile call/order bar (not on order.html — the ticket bar owns that slot) */
.call-bar{display:none}
@media (max-width:1080px){
  .call-bar{
    position:fixed;left:0;right:0;bottom:0;z-index:80;
    display:flex;gap:1px;background:var(--line-dark);
    border-top:1px solid var(--line-dark);
    padding-bottom:env(safe-area-inset-bottom);
  }
  .call-bar a{
    flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;
    padding:1.05rem .5rem;text-decoration:none;
    font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
    background:var(--night);color:var(--kraft);
  }
  .call-bar a.cb-order{background:var(--oxblood);color:var(--cream);padding-right:1.1rem}
  body:has(.call-bar) .chat-fab{bottom:calc(56px + env(safe-area-inset-bottom) + 14px)}
  body:has(.call-bar) footer{padding-bottom:calc(56px + env(safe-area-inset-bottom) + 2rem)}
  body.drawer-open .call-bar{opacity:0;pointer-events:none;transition:opacity .3s}
}

/* ============================================================
   V8 — contact page: the counter note
   ============================================================ */
.cnote{max-width:none;transform:rotate(-.35deg);overflow:visible}
.cnote::after{
  content:"";position:absolute;top:14px;right:16px;width:64px;height:64px;
  background:url("../img/logo-ink.png") center/contain no-repeat;
  opacity:.09;transform:rotate(11deg);pointer-events:none;
}
.cnote>*{position:relative;z-index:2}
.cnote .tb-tape{z-index:4}
.cn-punch{
  display:flex;justify-content:space-between;gap:.4rem;
  padding:.1rem .2rem .95rem;margin-bottom:1.2rem;
  border-bottom:1px dashed var(--line-light);
}
.cn-lbl{
  font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(27,20,16,.55);margin:0 0 .65rem;
}
.cn-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}
.cn-chip{
  font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  padding:12px 14px;background:transparent;border:1.5px solid rgba(27,20,16,.35);
  color:var(--ink);cursor:pointer;transition:border-color .2s,background .2s,color .2s,transform .2s;
}
.cn-chip:hover{border-color:var(--oxblood);color:var(--oxblood)}
.cn-chip.on{background:var(--oxblood);border-color:var(--oxblood);color:var(--cream);transform:rotate(-1.2deg)}
.cn-row2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
@media (max-width:560px){.cn-row2{grid-template-columns:1fr}}
.cnote .fld{margin-bottom:1.2rem}
.cnote .fld label{color:var(--ink);opacity:.72}
.cnote .req{color:var(--oxblood)}
.cnote .fld input{
  background:transparent;border:0;border-bottom:2px dotted rgba(27,20,16,.4);
  border-radius:0;padding:.55rem .1rem;font-size:16px;color:var(--ink);width:100%;
}
.cnote .fld input:focus{outline:none;border-bottom:2px solid var(--oxblood)}
.cnote .fld textarea{
  width:100%;background:repeating-linear-gradient(transparent 0 27px,rgba(27,20,16,.16) 27px 28px);
  background-attachment:local;
  border:0;border-bottom:2px dotted rgba(27,20,16,.4);border-radius:0;
  color:var(--ink);font-size:16px;line-height:28px;padding:0 .1rem .4rem;min-height:118px;resize:vertical;
}
.cnote .fld textarea:focus{outline:none;border-bottom:2px solid var(--oxblood)}
.cnote .fld input::placeholder,.cnote .fld textarea::placeholder{color:rgba(27,20,16,.38)}
.cn-send{margin-top:1.5rem}
.cn-send .btn{width:100%;justify-content:center}
.cn-send .btn.ready{animation:readyPulse 2.6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.cn-send .btn.ready{animation:none}}
.cn-note{color:rgba(27,20,16,.55);text-align:center;margin-top:.75rem}
.cn-stamp{
  display:none;position:absolute;top:42%;left:50%;z-index:6;pointer-events:none;opacity:0;
  transform:translate(-50%,-50%) rotate(-12deg) scale(2.1);
  font-family:var(--mono);font-weight:700;font-size:clamp(1.9rem,4.6vw,2.7rem);
  letter-spacing:.24em;text-indent:.24em;color:var(--oxblood);
  border:5px solid var(--oxblood);border-radius:8px;padding:.35rem 1.1rem;
  mix-blend-mode:multiply;
}
.cnote.stamped .cn-stamp{display:block;animation:cnSlam .5s cubic-bezier(.2,1.4,.3,1) forwards}
@keyframes cnSlam{
  0%{opacity:0;transform:translate(-50%,-50%) rotate(-12deg) scale(2.1)}
  60%{opacity:1;transform:translate(-50%,-50%) rotate(-8deg) scale(.94)}
  100%{opacity:.92;transform:translate(-50%,-50%) rotate(-8deg) scale(1)}
}
.cnote.stamped{animation:cnKachunk .2s ease-out .14s}
@keyframes cnKachunk{40%{transform:rotate(-.35deg) translateY(3px)}to{transform:rotate(-.35deg)}}
@media (prefers-reduced-motion:reduce){
  .cnote.stamped .cn-stamp{animation:none;opacity:.92;transform:translate(-50%,-50%) rotate(-8deg) scale(1)}
  .cnote.stamped{animation:none}
}

/* ============================================================
   V9 — panel batch: holiday board, bundles, calculator, FAQ,
   crew lunch, review funnel, casino section
   ============================================================ */

/* holiday banner — kraft toast, bottom center */
.holiday-bar{
  position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:80;
  display:flex;align-items:center;gap:.9rem;max-width:min(94vw,720px);
  background:linear-gradient(178deg,#faf5e9,#f1e7d2);color:var(--ink);
  padding:.65rem .8rem .65rem 1rem;box-shadow:0 14px 40px rgba(15,11,7,.45),0 2px 8px rgba(15,11,7,.25);
  border-left:4px solid var(--oxblood);
}
.holiday-bar .hb-tag{
  font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cream);background:var(--oxblood);padding:.3rem .5rem;white-space:nowrap;transform:rotate(-2deg);
}
.holiday-bar .hb-txt{font-size:.86rem;line-height:1.3}
.holiday-bar a{
  font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--oxblood);text-decoration:none;border-bottom:2px solid var(--oxblood);white-space:nowrap;padding-bottom:1px;
}
.holiday-bar button{
  background:none;border:0;color:rgba(27,20,16,.55);font-size:20px;line-height:1;cursor:pointer;
  padding:8px 10px;margin:-8px -6px -8px -4px;
}
@media (max-width:700px){
  .holiday-bar{bottom:64px;flex-wrap:wrap;gap:.5rem .8rem;padding-right:2.4rem}
  .holiday-bar button{position:absolute;top:4px;right:2px}
  body.drawer-open .holiday-bar{display:none}
}

/* holiday ledger on meats.html */
#holiday-board .tkt{max-width:640px}
.hb-row .nm{display:flex;flex-direction:column;gap:.15rem}
.hb-row .hb-spec{font-family:var(--mono);font-size:10px;letter-spacing:.04em;color:rgba(27,20,16,.55);text-transform:none}
.hb-row .hb-res{
  font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--oxblood);text-decoration:none;border-bottom:2px solid var(--oxblood);white-space:nowrap;
}
.hb-deadline{
  display:inline-block;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--oxblood);border:2px solid var(--oxblood);padding:.35rem .6rem;transform:rotate(-1.6deg);margin-top:1rem;
}

/* recipe → ticket deep-link CTA */
.rcp-cta{
  display:flex;align-items:center;gap:.5rem;margin-top:1rem;
  font-size:.85rem;color:var(--ink);text-decoration:none;
}
.rcp-cta .rc-tag{
  font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cream);background:var(--oxblood);padding:.28rem .5rem;transform:rotate(-1.6deg);white-space:nowrap;
}
.rcp-cta .ar{color:var(--oxblood);transition:transform .2s}
.rcp-cta:hover .ar{transform:translateX(4px)}

/* facebook feed in a kraft taped frame */
.fb-frame{
  position:relative;background:linear-gradient(178deg,#faf5e9,#f1e7d2);
  padding:1.1rem;box-shadow:0 18px 44px rgba(15,11,7,.28),0 2px 8px rgba(15,11,7,.14);
  transform:rotate(.4deg);
}
.fb-frame iframe{width:100%;height:620px;border:0;display:block;background:#fff}
.fb-fallback{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;color:rgba(27,20,16,.6);margin-top:.7rem;text-align:center}
.fb-fallback a{color:var(--oxblood)}

/* first-timer index cards */
.ft-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1.6rem;margin-top:2.6rem}
.ft-card{
  position:relative;background:linear-gradient(178deg,#faf5e9,#f2e9d6);color:var(--ink);
  padding:1.7rem 1.4rem 1.4rem;box-shadow:0 14px 34px rgba(15,11,7,.4),0 2px 6px rgba(15,11,7,.2);
  background-image:repeating-linear-gradient(transparent 0 25px,rgba(122,30,30,.12) 25px 26px),linear-gradient(178deg,#faf5e9,#f2e9d6);
}
.ft-card.tilt-l{transform:rotate(-1.3deg)}
.ft-card.tilt-r{transform:rotate(1.1deg)}
.ft-card .tape{top:-13px;left:50%;transform:translateX(-50%) rotate(-2deg)}
.ft-card b{font-family:var(--disp,inherit);font-size:1.12rem;line-height:1.25;display:block;font-weight:600}
.ft-card p{font-family:var(--mono);font-size:11px;letter-spacing:.03em;color:rgba(27,20,16,.65);margin-top:.55rem;line-height:1.55}

/* butcher-math worksheet */
.cm input[type="range"]{
  width:100%;margin:.2rem 0 1rem;accent-color:var(--oxblood);height:28px;
}
.cm-answer{
  min-height:64px;margin:0 0 1.2rem;padding:.8rem .2rem;
  border-top:1px dashed var(--line-light);border-bottom:1px dashed var(--line-light);
  display:flex;align-items:center;
}
.cm-answer span{
  font-family:var(--mono);font-size:.95rem;font-weight:600;line-height:1.55;color:var(--oxblood);
}
.cm .btn{width:100%;justify-content:center}
.cm .cn-chips{margin-bottom:1.2rem}

/* FAQ — ticket rows that open */
.faq-list{max-width:760px;margin:2.4rem auto 0}
.faq-t{
  background:linear-gradient(178deg,#faf5e9,#f4edda);color:var(--ink);
  box-shadow:0 10px 26px rgba(15,11,7,.16),0 1px 4px rgba(15,11,7,.1);
  margin-bottom:.9rem;padding:0 1.4rem;border-radius:14px;border:1px solid rgba(186,140,54,.16);
  transition:transform .18s ease,box-shadow .18s ease;
}
.faq-t:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(15,11,7,.2)}
.faq-t[open]{box-shadow:0 16px 36px rgba(15,11,7,.2)}
.faq-t summary{
  list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:1.05rem 0;font-weight:600;font-size:1.02rem;
}
.faq-t summary::-webkit-details-marker{display:none}
.faq-t .fx{
  font-family:var(--mono);font-size:18px;color:var(--oxblood);flex:none;
  width:28px;height:28px;border:1.5px solid rgba(122,30,30,.5);border-radius:50%;
  display:flex;align-items:center;justify-content:center;transition:transform .25s;
}
.faq-t[open] .fx{transform:rotate(45deg)}
.faq-t p{
  padding:0 0 1.2rem;font-size:.95rem;line-height:1.7;color:rgba(27,20,16,.8);
  border-top:1px dashed var(--line-light);padding-top:1rem;
}

/* ============================================================
   V10 — Order Online (Square prepay). Native page; uses site chrome.
   ============================================================ */
.oo-testbar{background:var(--brass);color:var(--night);font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-align:center;padding:.5rem}
.oo-layout{display:grid;grid-template-columns:1fr;gap:2rem;padding:2.6rem 0 5rem}
@media(min-width:900px){.oo-layout{grid-template-columns:1fr 360px;align-items:start}}
.oo-group{font-size:1.6rem;margin:2rem 0 .3rem}
.oo-group:first-child{margin-top:0}
.oo-sub{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--oxblood);margin:1.6rem 0 .6rem;padding-bottom:.4rem;border-bottom:1px dashed var(--line-light)}
.oo-item{display:flex;gap:1rem;align-items:center;padding:.75rem 0;border-bottom:1px solid var(--line-light)}
.oo-info{flex:1;min-width:0}
.oo-nm{font-weight:600}
.oo-d{font-size:.82rem;opacity:.68;margin-top:.1rem}
.oo-pr{font-family:var(--mono);font-size:.85rem;font-weight:600;white-space:nowrap}
.oo-add{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--night);color:var(--cream);border:0;padding:.6rem .9rem;cursor:pointer;border-radius:9px;transition:background .15s;min-height:40px}
.oo-add:hover{background:var(--oxblood)}
.oo-empty{font-size:.9rem;opacity:.6;padding:1rem 0}
.oo-cart{background:linear-gradient(178deg,#faf5e9,#f4edda);box-shadow:0 16px 40px rgba(15,11,7,.18);padding:1.4rem;position:sticky;top:1.2rem}
.oo-cart h2{font-size:1.3rem;margin-bottom:.2rem}
.oo-ci{padding:.6rem 0;border-bottom:1px dashed var(--line-light)}
.oo-ci-top{display:flex;gap:.6rem;align-items:baseline}
.oo-ci-nm{flex:1;font-weight:600;font-size:.92rem}
.oo-ci-pr{font-family:var(--mono);font-size:.8rem}
.oo-qty{display:flex;align-items:center;gap:.5rem;margin-top:.35rem}
.oo-qty button{width:30px;height:30px;border:1px solid var(--line-light);background:#fff;font-size:15px;cursor:pointer;border-radius:9px;line-height:1;color:var(--ink)}
.oo-qty span{font-family:var(--mono);font-size:.85rem;min-width:1.2rem;text-align:center}
.oo-ci-note{width:100%;margin-top:.4rem;font-size:.8rem;border:0;border-bottom:1px dotted var(--line-light);background:transparent;padding:.3rem 0;font-family:inherit;color:var(--ink)}
.oo-ci-note:focus{outline:none;border-bottom:1px solid var(--oxblood)}
.oo-tot{display:flex;justify-content:space-between;font-family:var(--mono);font-weight:600;margin:1rem 0;padding-top:.8rem;border-top:2px solid var(--ink)}
.oo-fld{margin-top:.7rem}
.oo-fld label{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;opacity:.7;margin-bottom:.25rem}
.oo-fld input{width:100%;padding:.7rem;border:1px solid var(--line-light);border-radius:10px;font-size:16px;font-family:inherit;background:#fff;color:var(--ink)}
.oo-fld input:focus{outline:none;border-color:var(--oxblood)}
#oo-card{margin-top:.9rem;min-height:44px}
.oo-pay{width:100%;margin-top:1rem;background:var(--oxblood);color:var(--cream);border:0;padding:1rem;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;border-radius:12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 8px 20px rgba(90,20,20,.25);min-height:48px}
.oo-pay:disabled{opacity:.5;cursor:not-allowed}
.oo-note{font-size:.72rem;opacity:.6;margin-top:.7rem;text-align:center;line-height:1.5}
.oo-err{font-size:.85rem;margin-top:.7rem;padding:.6rem;border-radius:4px;display:none;background:rgba(122,30,30,.1);color:var(--oxblood)}
.oo-done{display:none;background:linear-gradient(178deg,#faf5e9,#f4edda);box-shadow:0 16px 40px rgba(15,11,7,.18);padding:2rem;text-align:center}
.oo-done h3{font-size:1.7rem;color:var(--oxblood);font-family:Fraunces,serif}
.oo-done .oo-stamp{display:inline-block;font-family:var(--mono);font-weight:700;letter-spacing:.2em;color:var(--oxblood);border:3px solid var(--oxblood);border-radius:6px;padding:.3rem .9rem;transform:rotate(-4deg);margin-bottom:1rem;text-transform:uppercase;font-size:12px}
.oo-groupnote{font-size:.86rem;opacity:.72;max-width:60ch;margin:-.1rem 0 .4rem}
.oo-per{font-family:var(--mono);font-size:.7rem;opacity:.6;font-weight:500}
.oo-ci-nm .oo-per{opacity:.85;color:var(--oxblood)}

/* ============================================================
   V11 — ticket builder Square checkout (card slot, two-band total, PAID)
   ============================================================ */
.tb-cardslot{margin-top:1.3rem}
#tb-card{margin-top:.6rem;min-height:44px;background:#fff;border:1px solid var(--line-light);border-radius:6px;padding:1px 10px}
.tb-band-pay .nm,.tb-band-pay .pr{font-family:var(--mono);font-weight:700;color:var(--oxblood);letter-spacing:.03em}
.tb-band-pay .pr{font-size:1.05rem}
.tb-band-settle .nm,.tb-band-settle .pr{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;opacity:.6;text-transform:uppercase}
.tb-stamp.tb-stamp-paid{color:var(--oxblood-glow)}
.tb-stub-paid .tb-stub-stamp{color:var(--oxblood)}

/* ============================================================
   V12 — build-a-sandwich visual (v3: generated painterly image layers)
   ============================================================ */
.tb-sammy{ width:100%; margin:0; padding:.2rem 0 0; overflow:visible; display:block; }
.tb-sammy-stage{ position:relative; height:clamp(138px,20dvh,180px); width:100%; display:flex; align-items:center; justify-content:center; overflow:visible; background:radial-gradient(56% 46% at 50% 82%, rgba(80,45,20,.06), transparent 72%); transition:height .3s; }
/* collapse the empty preview void before any bread is picked so chips sit higher */
.tb-sammy:not(.has-layers) .tb-sammy-stage{ height:clamp(92px,12dvh,116px); }
.tb-sammy-hint{ font-size:13px; }
.tb-sammy-scaler{ transform-origin:50% 50%; will-change:transform; display:flex; }
.tb-sammy-hint{ position:absolute; inset:0; margin:0; display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:11.5px; letter-spacing:.05em; color:rgba(27,20,16,.5); text-align:center; }
.tb-sammy-hint[hidden]{ display:none; }
.tb-sammy-stack{ position:relative; width:250px; max-width:90%; display:flex; flex-direction:column; align-items:center; transform-origin:50% 100%; will-change:transform; }

/* build-your-own category tabs — one group at a time keeps the sandwich big */
.tb-tabs{ display:flex; gap:6px; padding:.65rem 1.4rem .55rem; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity; scroll-padding-inline:1.4rem; -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22px,#000 calc(100% - 22px),transparent 100%); mask-image:linear-gradient(90deg,transparent 0,#000 22px,#000 calc(100% - 22px),transparent 100%); }
.tb-tabs::-webkit-scrollbar{ display:none; }
.tb-tab{ flex:0 0 auto; scroll-snap-align:center; display:flex; align-items:center; gap:.35rem; font-family:var(--mono); font-size:12.5px; letter-spacing:.02em; color:inherit; padding:.5rem .85rem; border:1px solid color-mix(in srgb,currentColor 22%,transparent); border-radius:999px; background:transparent; cursor:pointer; transition:background .15s,border-color .15s; }
.tb-tab .tb-tab-n{ font-size:8.5px; opacity:.5; }
.tb-tab .tb-tab-mk{ color:#3f8a44; font-size:11px; font-weight:700; }
.tb-tab.act{ background:var(--oxblood); color:var(--cream); border-color:var(--oxblood); }
.tb-tab.act .tb-tab-n{ opacity:.7; }
.tb-tab.act .tb-tab-mk{ color:#bfe3c0; }
.tb-tab:focus-visible{ outline:2px solid var(--brass-soft); outline-offset:2px; }
.tb-pane[hidden]{ display:none; }
.tb-pane .tb-f{ margin-top:.2rem; }
.sl{ position:relative; width:100%; line-height:0; }
.sl > img{ display:block; width:100%; height:auto; -webkit-user-drag:none; filter:drop-shadow(0 4px 3px rgba(40,20,15,.22)); }

/* ===== DROP-IN: fall, squash on impact, settle ===== */
.sl.in{ animation:sl-drop .55s cubic-bezier(.34,1.56,.64,1) both; }
@keyframes sl-drop{
  0%  { opacity:0; transform:translateY(-55px) scaleY(1.10) scaleX(.97); }
  35% { opacity:1; }
  58% { opacity:1; transform:translateY(0) scaleY(.84) scaleX(1.05); }
  78% { transform:translateY(0) scaleY(1.04) scaleX(.99); }
  100%{ transform:translateY(0) scaleY(1) scaleX(1); }
}
.tb-sammy-stack:has(.sl-btop.in){ animation:pile-pack .55s cubic-bezier(.34,1.4,.6,1) both; }
@keyframes pile-pack{ 0%{transform:scaleY(1);} 35%{transform:scaleY(.955);} 70%{transform:scaleY(1.015);} 100%{transform:scaleY(1);} }

/* ===== IDLE breathe ===== */
@keyframes sammy-breathe{ 0%,100%{transform:scale(1) rotate(-.35deg);} 50%{transform:scale(1.006) rotate(.35deg);} }

/* ===== FX: steam wisps + sparkle glints ===== */
.tb-sammy-fx{ position:absolute; inset:0; pointer-events:none; z-index:99; overflow:visible; }
.tb-sammy-fx i{ position:absolute; top:0; width:12px; height:28px; border-radius:60% 60% 50% 50%; background:linear-gradient(to top, rgba(255,250,240,0), rgba(255,250,240,.5)); filter:blur(3px); opacity:0; animation:steam 3.8s ease-in-out infinite; }
.tb-sammy-fx i:nth-child(1){ left:34%; animation-delay:0s; }
.tb-sammy-fx i:nth-child(2){ left:50%; animation-delay:1.3s; }
.tb-sammy-fx i:nth-child(3){ left:63%; animation-delay:2.5s; }
@keyframes steam{ 0%{opacity:0; transform:translate(0,6px) scaleY(.7);} 22%{opacity:.45;} 70%{opacity:.28;} 100%{opacity:0; transform:translate(6px,-24px) scaleY(1.25);} }
.tb-sammy-fx b{ position:absolute; width:7px; height:7px; border-radius:1px; background:radial-gradient(circle,#fff 0%,rgba(255,255,255,.9) 35%,rgba(255,255,255,0) 70%); opacity:0; transform:scale(0) rotate(45deg); animation:glint 3.2s ease-in-out infinite; }
.tb-sammy-fx b:nth-child(4){ left:24%; top:14%; animation-delay:.5s; }
.tb-sammy-fx b:nth-child(5){ left:72%; top:9%;  animation-delay:1.6s; }
.tb-sammy-fx b:nth-child(6){ left:46%; top:20%; animation-delay:2.4s; }
.tb-sammy-fx b:nth-child(7){ left:60%; top:26%; animation-delay:3.2s; }
@keyframes glint{ 0%{opacity:0; transform:scale(0) rotate(0);} 7%{opacity:1; transform:scale(1) rotate(45deg);} 16%{opacity:0; transform:scale(.2) rotate(90deg);} 100%{opacity:0; transform:scale(0) rotate(90deg);} }

/* ===== REDUCED MOTION ===== */
@media (prefers-reduced-motion: reduce){
  .tb-sammy,.tb-sammy-stack,.sl,.sl.in,.tb-sammy-stack:has(.sl-btop.in){ animation:none !important; }
  .sl{ opacity:1 !important; transform:none !important; }
  .tb-sammy-fx{ display:none; }
}

/* ============================================================
   Build-Your-Own hero card (dominant lunch CTA in the order builder)
   ============================================================ */
.tb-byo{
  display:flex; align-items:center; gap:1.1rem; width:100%; text-align:left;
  background:linear-gradient(135deg, var(--oxblood), #641c1c 85%); color:var(--cream);
  border:1px solid rgba(241,233,219,.10); border-radius:18px; padding:1.05rem 1.2rem; margin:0 0 1.5rem;
  cursor:pointer; box-shadow:0 16px 34px rgba(45,12,12,.32); position:relative; overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease; font:inherit;
}
.tb-byo::after{ content:""; position:absolute; inset:0; background:radial-gradient(120% 90% at 88% 12%, rgba(214,167,74,.16), transparent 60%); pointer-events:none; }
.tb-byo:hover{ transform:translateY(-2px); box-shadow:0 22px 42px rgba(45,12,12,.4); }
.tb-byo:focus-visible{ outline:2px solid var(--brass-soft); outline-offset:3px; }
.tb-byo-art{ flex:0 0 auto; width:108px; align-self:stretch; display:flex; align-items:center; }
.tb-byo-art img{ display:block; width:100%; height:auto; filter:drop-shadow(0 7px 9px rgba(0,0,0,.34)); }
.tb-byo-copy{ display:flex; flex-direction:column; gap:.3rem; position:relative; z-index:1; }
.tb-byo-kick{ font-family:var(--mono); font-size:10.5px; letter-spacing:.15em; text-transform:uppercase; color:var(--brass-soft); }
.tb-byo-h{ font-family:var(--disp); font-size:1.55rem; font-weight:560; line-height:1.03; }
.tb-byo-p{ font-size:.86rem; opacity:.9; line-height:1.42; }
.tb-byo-go{ margin-top:.4rem; font-family:var(--mono); font-size:12px; letter-spacing:.02em; font-weight:600; color:#fff; }
@media (max-width:430px){
  .tb-byo{ gap:.8rem; padding:.85rem .9rem; }
  .tb-byo-art{ width:82px; }
  .tb-byo-h{ font-size:1.24rem; }
  .tb-byo-p{ font-size:.8rem; }
}
@media (prefers-reduced-motion:reduce){ .tb-byo{ transition:none; } .tb-byo:hover{ transform:none; } }

/* ============================================================
   Build-Your-Own showcase — its own section under the order hero
   ============================================================ */
.byo-band{ background:linear-gradient(180deg,#f3ead9,#ece2cf); padding:clamp(2.8rem,7vw,5.5rem) 0; border-bottom:1px solid rgba(0,0,0,.06); }
.byo-wrap{ display:grid; grid-template-columns:1.12fr .88fr; gap:clamp(1.4rem,4vw,3.4rem); align-items:center; }
.byo-title{ font-family:var(--disp); font-size:clamp(2.2rem,6vw,3.6rem); line-height:1.02; font-weight:560; margin:.4rem 0 0; }
.byo-lede{ font-size:clamp(1rem,2vw,1.16rem); line-height:1.6; color:rgba(27,20,16,.78); margin:1rem 0 1.3rem; max-width:44ch; }
.byo-chips{ list-style:none; display:flex; flex-wrap:wrap; gap:.5rem; padding:0; margin:0 0 1.7rem; }
.byo-chips li{ font-family:var(--mono); font-size:11.5px; letter-spacing:.05em; text-transform:uppercase; padding:.42rem .8rem; border:1px solid rgba(123,34,34,.28); border-radius:999px; color:var(--oxblood); }
.byo-cta{ font-size:1.02rem; }
.byo-art img{ display:block; width:100%; max-width:430px; aspect-ratio:4/5; object-fit:cover; border-radius:18px; box-shadow:0 26px 54px rgba(40,20,15,.34); margin:0 auto; }
@media (max-width:760px){
  .byo-wrap{ grid-template-columns:1fr; text-align:center; }
  .byo-art{ order:-1; }
  .byo-art img{ max-width:320px; }
  .byo-lede{ margin-left:auto; margin-right:auto; }
  .byo-chips{ justify-content:center; }
}

/* ============================================================
   Step-by-step build flow + softer, more modern rounding
   ============================================================ */
.tb-stepnav{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1rem; }
.tb-stepnav .tb-next{ margin-left:auto; padding:.95rem 1.5rem; border-radius:12px; }
.tb-back{ background:transparent; border:none; color:inherit; font-family:var(--mono); font-size:12.5px; letter-spacing:.03em; opacity:.65; cursor:pointer; padding:.7rem .3rem; }
.tb-back:hover{ opacity:1; }
.tb-step-lead{ font-family:var(--mono); font-size:12px; letter-spacing:.04em; color:rgba(27,20,16,.55); margin:.2rem 0 1rem; }
/* keep the in-flow Next button from being trapped under the sticky commit foot */
.tb-optspane{ padding-bottom:calc(80px + env(safe-area-inset-bottom)); }
.tb-tab .tb-tab-mk{ margin-left:.1rem; }
/* soften remaining square corners for a modern feel */
.tb-step button{ border-radius:10px; }
.tb-mode{ border-radius:16px; overflow:hidden; }
.tb-note,.tb-who,.tb-custom,.tb-time-custom{ border-radius:10px; }
.tb-sheet{ border-radius:22px 22px 0 0; }
.sent-card,.oo-cart,.oo-done,.tb-banner,.call-bar{ border-radius:14px; }
.tb-dept{ border-radius:14px; overflow:hidden; }

/* ============================================================
   Premium builder buttons — clean equal-width grid + tactile cards
   ============================================================ */
.tb-optspane .tb-chips{ display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:.6rem; }
.tb-optspane .tb-chip{
  display:flex; align-items:center; justify-content:center; text-align:center;
  font-size:13px; letter-spacing:.02em; padding:.9rem .7rem; min-height:54px; border-radius:14px;
  background:rgba(255,255,255,.42); border:1px solid color-mix(in srgb,currentColor 18%,transparent);
  box-shadow:0 1px 0 rgba(255,255,255,.55) inset;
  transition:border-color .15s,background .15s,transform .08s,box-shadow .15s;
}
.tb-optspane .tb-chip:hover{ background:rgba(255,255,255,.72); border-color:color-mix(in srgb,var(--oxblood) 38%,transparent); }
.tb-optspane .tb-chip:active{ transform:translateY(1px); }
.tb-optspane .tb-chip.on{ background:var(--oxblood); border-color:var(--oxblood); color:var(--cream); box-shadow:0 6px 16px rgba(90,20,20,.3); }

/* ============================================================
   Hero Google-review highlight — under the headline
   ============================================================ */
.hero-rev{
  display:inline-flex; align-items:center; gap:.7rem; width:max-content;
  margin:1.5rem 0 .3rem; padding:.5rem .9rem .5rem .7rem;
  text-decoration:none; color:var(--cream);
  background:rgba(20,14,10,.34); border:1px solid rgba(212,176,106,.28); border-radius:999px;
  backdrop-filter:blur(4px); transition:border-color .25s, background .25s, transform .25s;
}
.hero-rev:hover{ border-color:rgba(212,176,106,.55); background:rgba(20,14,10,.48); transform:translateY(-1px); }
.hr-stars{ color:var(--brass-soft); letter-spacing:.14em; font-size:14px; text-shadow:0 0 12px rgba(212,176,106,.45); }
.hr-score{ font-family:var(--disp); font-size:1.15rem; font-weight:600; line-height:1; }
.hr-txt{ font-family:var(--mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; opacity:.72; }
@media (max-width:560px){ .hr-txt{ display:none; } }

/* ============================================================
   Reviews page — legit rating summary + Google/Facebook review cards
   ============================================================ */
.rv-summary{ display:flex; align-items:center; gap:clamp(1.2rem,3vw,2.4rem); margin-top:2.4rem; padding:clamp(1.4rem,3vw,2rem) clamp(1.6rem,3.5vw,2.6rem); background:#fff; border:1px solid rgba(27,20,16,.1); border-radius:18px; box-shadow:0 14px 34px rgba(40,20,15,.08); max-width:660px; }
.rvs-score{ font-family:var(--disp); font-size:clamp(3rem,7vw,4.4rem); font-weight:600; line-height:.9; color:var(--ink); }
.rvs-score span{ font-size:.36em; opacity:.4; font-weight:400; }
.rvs-meta{ display:flex; flex-direction:column; gap:.4rem; }
.rvs-stars{ color:var(--brass); font-size:1.35rem; letter-spacing:.1em; }
.rvs-count{ font-size:.92rem; opacity:.72; }
.rvs-links a{ font-family:var(--mono); font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:var(--oxblood); text-decoration:none; font-weight:600; }
.rvs-links a:hover{ text-decoration:underline; }
.rv-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.2rem; margin-top:2.6rem; }
.rv-card{ background:#fff; border:1px solid rgba(27,20,16,.09); border-radius:16px; padding:1.5rem 1.6rem; box-shadow:0 10px 26px rgba(40,20,15,.06); display:flex; flex-direction:column; gap:.9rem; transition:transform .2s, box-shadow .2s; }
.rv-card:hover{ transform:translateY(-3px); box-shadow:0 18px 40px rgba(40,20,15,.1); }
.rv-top{ display:flex; align-items:center; gap:.8rem; }
.rv-av{ flex:0 0 auto; width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--c,#7a1e1e); color:#fff; font-family:var(--disp); font-size:1.25rem; font-weight:600; }
.rv-who{ display:flex; flex-direction:column; gap:.15rem; margin-right:auto; }
.rv-name{ font-weight:600; font-size:1rem; color:var(--ink); }
.rv-stars{ color:var(--brass); font-size:.85rem; letter-spacing:.08em; }
.rv-src{ flex:0 0 auto; width:24px; height:24px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--disp); font-weight:700; font-size:14px; color:#fff; background:#4285F4; }
.rv-src[title*="Facebook"]{ background:#1877F2; }
.rv-text{ font-size:.98rem; line-height:1.6; color:rgba(27,20,16,.85); }
.rv-date{ font-family:var(--mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; opacity:.45; }
@media (max-width:560px){ .rv-summary{ flex-direction:column; align-items:flex-start; } }

/* Reviews — leave-a-review CTA card (fills the grid, matches the brand) */
.rv-card-cta{
  text-decoration:none; justify-content:center; align-items:flex-start; gap:.55rem;
  background:linear-gradient(150deg, #7a1e1e 0%, #571414 60%, #3d0e0e 100%);
  border:1px solid rgba(212,176,106,.28); color:var(--cream);
}
.rv-card-cta:hover{ transform:translateY(-3px); box-shadow:0 20px 44px rgba(90,20,20,.34); }
.rvc-mark{ color:var(--brass-soft); font-size:1.4rem; letter-spacing:.1em; }
.rvc-h{ font-family:var(--disp); font-size:1.5rem; font-weight:560; line-height:1.1; }
.rvc-p{ font-size:.95rem; line-height:1.55; opacity:.82; }
.rvc-go{ margin-top:.3rem; font-family:var(--mono); font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:var(--brass-soft); font-weight:600; }
/* subtle quote-mark lift on the review cards */
.rv-card{ position:relative; overflow:hidden; }
.rv-card:not(.rv-card-cta)::before{ content:"\201C"; position:absolute; top:-.9rem; right:1rem; font-family:var(--disp); font-size:4.6rem; color:rgba(186,140,54,.13); line-height:1; pointer-events:none; }

/* footer credit: KB logo only, clean */
.kb-credit a{gap:.5rem}
.kb-credit img{height:26px;width:auto;opacity:.9}
.kb-credit a:hover img{opacity:1}
/* the fast "on my way" pickup option stands out */
.tb-time.tb-asap{border-color:color-mix(in srgb,var(--oxblood-glow) 70%,transparent)}

/* footer credit alignment: keep "Site by" + KB logo on one centered line */
.kb-credit{display:inline-flex;align-items:center;gap:.5rem;line-height:1}
.kb-credit img{height:20px}

/* ============================================================
   MERCH SCRATCH-TICKET pop-up (homepage) — ticket-promo.js
   ============================================================ */
body.mt-lock{overflow:hidden}
.mt-overlay{
  position:fixed;inset:0;z-index:400;display:flex;align-items:center;justify-content:center;
  padding:1.4rem;background:rgba(9,6,4,.62);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
  opacity:0;transition:opacity .34s ease;
}
.mt-overlay.in{opacity:1}
.mt-card{
  position:relative;width:min(370px,100%);color:var(--ink);
  background:linear-gradient(180deg,#faf4e7,#f1e7d2);
  border-radius:20px;box-shadow:0 40px 90px rgba(9,6,4,.6),0 0 0 1px rgba(120,80,30,.18);
  transform:translateY(22px) scale(.96);opacity:0;transition:transform .42s cubic-bezier(.16,1,.3,1),opacity .42s;
  overflow:hidden;
}
.mt-overlay.in .mt-card{transform:none;opacity:1}
.mt-x{
  position:absolute;top:.55rem;right:.7rem;z-index:4;width:34px;height:34px;border:0;cursor:pointer;
  background:transparent;color:rgba(27,20,16,.5);font-size:26px;line-height:1;border-radius:50%;
}
.mt-x:hover{color:var(--ink);background:rgba(27,20,16,.07)}
.mt-top{text-align:center;padding:1.35rem 1.5rem .85rem}
.mt-badge{width:40px;height:40px;object-fit:contain;filter:drop-shadow(0 3px 8px rgba(0,0,0,.25))}
.mt-eyebrow{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--oxblood);margin:.7rem 0 .4rem}
.mt-head{font-family:var(--disp);font-size:1.58rem;line-height:1.04;font-weight:560;letter-spacing:-.02em}
.mt-sub{font-family:var(--mono);font-size:11.5px;letter-spacing:.02em;color:rgba(27,20,16,.6);margin-top:.5rem}
.mt-sub[hidden]{display:none}
/* torn perforation between stub + prize */
.mt-perf{position:relative;height:16px;margin:0}
.mt-perf::before{content:"";position:absolute;top:50%;left:18px;right:18px;border-top:2px dashed rgba(120,80,30,.4)}
.mt-perf::after{content:"";position:absolute;top:50%;left:-11px;right:-11px;height:22px;transform:translateY(-50%);
  background:radial-gradient(circle 11px at 0 50%,#1b1410 0 11px,transparent 11px) left/50% 100% no-repeat,
             radial-gradient(circle 11px at 100% 50%,#1b1410 0 11px,transparent 11px) right/50% 100% no-repeat;}
.mt-bottom{padding:.2rem 1.5rem 1.25rem;text-align:center}
.mt-prizewrap{position:relative;border-radius:14px;overflow:hidden;background:#2c0909;
  background:radial-gradient(120% 100% at 80% 0,rgba(178,54,54,.5),transparent 60%),linear-gradient(150deg,#6a1a1a,#4a1010 60%,#2c0909);
  box-shadow:inset 0 0 0 1px rgba(212,176,106,.28);min-height:118px;display:flex}
.mt-prize{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem;padding:1.1rem .8rem;color:var(--cream)}
.mt-amt{font-family:var(--disp);font-style:italic;font-weight:600;font-size:2.4rem;line-height:1;color:#f6ddb0;text-shadow:0 2px 14px rgba(0,0,0,.35)}
.mt-lbl{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.28em;color:var(--cream)}
.mt-bonus{margin-top:.6rem;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.05em;line-height:1.35;color:#f6ddb0;background:rgba(0,0,0,.2);border:1px solid rgba(246,221,176,.38);border-radius:999px;padding:.35rem .85rem;max-width:28ch}
.mt-code{margin-top:.55rem;border:1px dashed rgba(246,221,176,.55);background:rgba(0,0,0,.18);color:#f6ddb0;
  font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.16em;padding:.4rem .8rem;border-radius:8px;cursor:pointer;position:relative}
.mt-code i{position:absolute;left:0;right:0;bottom:-1.15rem;font-style:normal;font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(248,242,228,.5)}
.mt-code.copied{color:#eaffea;border-color:#8fce8f}
.mt-code.copied i{color:#8fce8f}
.mt-code.copied i::after{content:" · copied"}
.mt-scratch{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair;touch-action:none;
  transition:opacity .45s ease;border-radius:14px}
.mt-scratch.mt-cleared{opacity:0}
.mt-won .mt-prize{animation:mt-pop .5s cubic-bezier(.16,1,.3,1)}
@keyframes mt-pop{0%{transform:scale(.9)}55%{transform:scale(1.04)}100%{transform:scale(1)}}
.mt-fine{font-family:var(--mono);font-size:10.5px;line-height:1.5;letter-spacing:.02em;color:rgba(27,20,16,.58);margin:.9rem auto 1rem;max-width:30ch}
.mt-cta{display:flex;width:100%;justify-content:center;align-items:center;gap:.5rem;background:var(--oxblood);color:var(--cream);text-decoration:none;border:0;cursor:pointer;
  font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  padding:.95rem 1.6rem;border-radius:11px;transition:background .2s,transform .2s}
.mt-cta:hover{background:var(--oxblood-deep);transform:translateY(-1px)}
.mt-cta:disabled{opacity:.6;cursor:default;transform:none}
.mt-cta span{transition:transform .2s}.mt-cta:hover span{transform:translateX(3px)}
.mt-skip{display:block;margin:.85rem auto 0;background:none;border:0;cursor:pointer;
  font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:rgba(27,20,16,.45);text-decoration:underline}
.mt-skip:hover{color:var(--ink)}
/* Counter Club: claim form + done state */
.mt-claim{display:flex;flex-direction:column;gap:.6rem;margin-top:1.1rem;text-align:left}
.mt-claim-lead{font-family:var(--body);font-size:.92rem;line-height:1.45;color:rgba(27,20,16,.72);text-align:center;margin:0 auto .2rem;max-width:34ch}
.mt-in{width:100%;padding:.68rem .85rem;font-family:var(--body);font-size:16px;color:var(--ink);background:#fff;border:1px solid var(--kraft-2);border-radius:10px;transition:border-color .2s,box-shadow .2s}
.mt-in::placeholder{color:rgba(27,20,16,.4)}
.mt-in:focus{outline:none;border-color:var(--oxblood);box-shadow:0 0 0 3px rgba(122,30,30,.12)}
.mt-err{font-family:var(--body);font-size:.88rem;color:var(--oxblood);background:rgba(122,30,30,.07);
  border:1px solid rgba(122,30,30,.25);border-radius:9px;padding:.55rem .7rem;margin:.1rem 0 0;text-align:left}
.mt-claim .mt-cta{margin-top:.2rem}
.mt-claim .mt-fine{margin:.4rem auto 0}
.mt-done{text-align:center;margin-top:1.1rem;animation:mt-pop .5s cubic-bezier(.16,1,.3,1)}
.mt-done-h{font-family:var(--disp);font-size:1.5rem;font-weight:560;color:var(--ink);line-height:1.05}
.mt-done-sub{font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:rgba(27,20,16,.55);margin:.5rem 0 .7rem}
.mt-done .mt-code{display:inline-block;color:var(--oxblood);border-color:rgba(122,30,30,.45);background:rgba(122,30,30,.06)}
.mt-done .mt-code i{color:rgba(27,20,16,.45)}
.mt-done .mt-fine{margin:1rem auto 0}
@media (prefers-reduced-motion:reduce){
  .mt-overlay,.mt-card,.mt-scratch{transition:none}
  .mt-won .mt-prize,.mt-done{animation:none}
}

/* ============================================================
   Weekly lunch lineup (specials page) + custom catering callout
   ============================================================ */
.lunch-week{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.lunch-day{ position:relative; display:flex; flex-direction:column; gap:.35rem; padding:1.5rem 1.3rem 1.4rem; background:var(--cream); border:1px solid var(--kraft-2); border-radius:14px; border-top:3px solid var(--oxblood); box-shadow:0 10px 30px rgba(40,20,15,.06); transition:transform .3s,box-shadow .3s; }
.lunch-day:hover{ transform:translateY(-4px); box-shadow:0 18px 40px rgba(40,20,15,.12); }
.ld-day{ font-family:var(--mono); font-size:11.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--oxblood); }
.ld-dish{ font-family:var(--disp); font-size:1.5rem; font-weight:560; line-height:1.02; color:var(--ink); margin-top:.2rem; }
.ld-incl{ font-size:.85rem; color:rgba(27,20,16,.6); line-height:1.4; flex:1 1 auto; }
.ld-price{ font-family:var(--mono); font-size:1.15rem; font-weight:700; color:var(--oxblood); margin-top:.7rem; }
@media (max-width:860px){ .lunch-week{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:460px){ .lunch-week{ grid-template-columns:1fr; } }

.cater-custom{ display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:center; margin-top:2.6rem; padding:2rem 2.2rem; text-decoration:none; color:var(--cream); border-radius:16px; position:relative; overflow:hidden; background:linear-gradient(150deg,#6a1a1a,#4a1010 70%,#3a0d0d); box-shadow:0 20px 50px rgba(40,12,12,.28); transition:transform .3s,box-shadow .3s; }
.cater-custom::before{ content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(120% 100% at 90% 0,rgba(212,176,106,.14),transparent 55%); }
.cater-custom:hover{ transform:translateY(-3px); box-shadow:0 26px 60px rgba(40,12,12,.4); }
.cater-custom>*{ position:relative; z-index:1; }
.cc-eyebrow{ font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--brass-soft); margin-bottom:.6rem; }
.cater-custom h3{ font-family:var(--disp); font-size:clamp(1.5rem,2.6vw,2rem); font-weight:560; line-height:1.05; margin-bottom:.7rem; color:var(--cream); }
.cc-copy p{ font-size:1rem; line-height:1.55; color:rgba(248,242,228,.82); max-width:52ch; margin:0; }
.cc-call{ display:flex; flex-direction:column; align-items:flex-end; text-align:right; gap:.15rem; flex-shrink:0; }
.cc-call-lbl{ font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--brass-soft); }
.cc-call-num{ font-family:var(--disp); font-size:clamp(1.4rem,2.4vw,1.8rem); font-weight:600; color:var(--cream); }
.cc-call-ar{ font-family:var(--mono); color:var(--brass-soft); transition:transform .25s; }
.cater-custom:hover .cc-call-ar{ transform:translateX(4px); }
@media (max-width:640px){
  .cater-custom{ grid-template-columns:1fr; gap:1.1rem; padding:1.6rem 1.4rem; }
  .cc-call{ flex-direction:row; align-items:baseline; justify-content:space-between; text-align:left; width:100%; gap:.6rem; border-top:1px solid rgba(212,176,106,.25); padding-top:1rem; }
}

/* ============================================================
   V12 — welcome code (Counter Club scratch card) on the ticket
   ============================================================ */
.tb-codefld{margin-top:1.1rem}
.tb-codefld input{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase}
.tb-codefld input::placeholder{letter-spacing:.04em;text-transform:none}
.tb-codefld.tb-code-ok input{border-color:var(--brass);background:rgba(176,141,87,.06)}
.tb-codefld.tb-code-ok .tb-code-msg{color:var(--oxblood);opacity:.9}
.tb-band-code .nm,.tb-band-code .pr{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--brass);font-weight:700}

/* Delivery is on the board but not open yet — visible, plainly not selectable. */
.tb-fo-soon{opacity:.55;cursor:not-allowed;position:relative}
.tb-fo-soon:hover{border-color:var(--line-light)}
.tb-fo-soon span{font-style:italic}

/* ============================================================
   THE PRINT — the paid/received ticket feeding out of the till.
   The receipt unrolls, its lines land one by one, then the stamp
   comes down. Reduced motion gets the finished receipt at once.
   ============================================================ */
.tb-stub.tb-print{
  transform-origin:top center;
  clip-path:polygon(0 0,100% 0,100% 0,0 0);
  transform:rotate(-.8deg) translateY(-8px);
  transition:clip-path .85s cubic-bezier(.22,.75,.25,1), transform .85s cubic-bezier(.22,.75,.25,1);
}
.tb-stub.tb-print.tb-printed{
  transform:rotate(-.8deg) translateY(0);
  clip-path:polygon(0 0,100% 0,100% 97%,96% 99%,92% 96%,88% 99%,84% 96%,80% 99%,76% 96%,72% 99%,68% 96%,64% 99%,60% 96%,56% 99%,52% 96%,48% 99%,44% 96%,40% 99%,36% 96%,32% 99%,28% 96%,24% 99%,20% 96%,16% 99%,12% 96%,8% 99%,4% 96%,0 99%);
}
.tb-stub.tb-print .tb-line{opacity:0;transform:translateY(6px);
  transition:opacity .4s ease var(--line,0ms), transform .4s cubic-bezier(.22,.8,.3,1) var(--line,0ms)}
.tb-stub.tb-printed .tb-line{opacity:1;transform:none}

/* the stamp lands last, off-square, with a thump */
.tb-stub.tb-print .tb-stub-stamp{opacity:0;transform:rotate(-24deg) scale(2.1)}
.tb-stub.tb-stamped .tb-stub-stamp{
  opacity:.72;transform:rotate(-7deg) scale(1);
  transition:opacity .16s ease, transform .32s cubic-bezier(.2,1.7,.4,1);
}
.tb-stub.tb-stamped{animation:tb-thump .22s ease .06s 1}
@keyframes tb-thump{40%{transform:rotate(-.8deg) translateY(2px) scale(.996)}}

.tb-mute{
  margin-left:.9rem;background:none;border:0;cursor:pointer;font-family:var(--mono);font-size:11px;
  letter-spacing:.12em;text-transform:uppercase;color:rgba(27,20,16,.45);text-decoration:underline;
}
.tb-mute:hover{color:var(--oxblood)}
.dark .tb-stub .tb-mute,.darkest .tb-stub .tb-mute{color:rgba(27,20,16,.45)}
.dark .tb-stub .tb-mute:hover,.darkest .tb-stub .tb-mute:hover{color:var(--oxblood)}

@media (prefers-reduced-motion:reduce){
  .tb-stub.tb-print,.tb-stub.tb-print .tb-line,.tb-stub.tb-print .tb-stub-stamp{transition:none;animation:none}
  .tb-stub.tb-print{transform:rotate(-.8deg)}
}

/* ============================================================
   COUNTER CLUB — the locked sneak peek. Shows people it's a
   scratch card before they hand over a name, with a couple of
   streaks already taken off the foil.
   ============================================================ */
.mt-teaser{margin:.7rem 0 .9rem;text-align:center}
.mt-teaser-card{
  position:relative;height:74px;border-radius:11px;overflow:hidden;
  background:linear-gradient(140deg,#6a1a1a,#4a1010 58%,#2c0909);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.12rem;
  box-shadow:inset 0 0 0 1px rgba(241,233,219,.14);
}
.mt-teaser-mark{position:relative;z-index:3;width:30px;height:30px;object-fit:contain;
  opacity:.26;mix-blend-mode:multiply;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.45))}   /* struck into the foil, not printed under it */
/* The foil. Brushed brass with a soft sheen, and two streaks taken off it at a
   coin's angle. The streaks are feathered, not cut — a hard-edged mask made the
   card beneath show as black diagonal bars and read like a broken image. */
.mt-foil{
  position:absolute;inset:0;
  background:
    /* fine brushed grain, barely there */
    repeating-linear-gradient(115deg,rgba(255,255,255,.055) 0 1px,rgba(0,0,0,.045) 1px 2.5px),
    /* the sheen travelling across the panel */
    linear-gradient(115deg,rgba(255,255,255,0) 18%,rgba(255,255,255,.42) 34%,rgba(255,255,255,.06) 47%,
                    rgba(255,255,255,0) 58%,rgba(255,255,255,.22) 76%,rgba(255,255,255,0) 88%),
    /* the brass itself */
    linear-gradient(118deg,#d8be8c 0%,#b99a63 32%,#cbb07d 52%,#a9894f 74%,#c9ad78 100%);
  --streaks:linear-gradient(115deg,#000 0 21.4%,rgba(0,0,0,.6) 22%,rgba(0,0,0,.66) 23.1%,#000 23.8% 38%,
            rgba(0,0,0,.78) 38.6%,#000 39.3% 57.5%,rgba(0,0,0,.58) 58.2%,rgba(0,0,0,.63) 59.5%,
            #000 60.3% 79%,rgba(0,0,0,.8) 79.6%,#000 80.4% 100%);
  -webkit-mask-image:var(--streaks);mask-image:var(--streaks);
}
/* shavings along the streaks, so it reads as scratched rather than wiped */
.mt-teaser-card::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(1.7px 1.7px at 28% 24%,rgba(233,213,172,.85),transparent 62%),
    radial-gradient(1.3px 1.3px at 31% 63%,rgba(233,213,172,.7),transparent 62%),
    radial-gradient(1.9px 1.9px at 62% 38%,rgba(233,213,172,.8),transparent 62%),
    radial-gradient(1.2px 1.2px at 65% 72%,rgba(233,213,172,.62),transparent 62%),
    radial-gradient(1.5px 1.5px at 34% 41%,rgba(233,213,172,.55),transparent 62%);
}
.mt-teaser-lock{
  position:absolute;right:.5rem;bottom:.45rem;font-family:var(--mono);font-size:8.5px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:#2c0909;background:rgba(246,234,214,.92);
  border-radius:99px;padding:.22rem .55rem;
}
@media (prefers-reduced-motion:no-preference){
  /* one slow catch of the light, so it reads as foil without fidgeting */
  .mt-foil{animation:mt-sheen 6s ease-in-out infinite}
  @keyframes mt-sheen{0%,100%{filter:brightness(1)}48%{filter:brightness(1.1)}}
}

/* ============================================================
   PHONE PASS — the hero and the footer base.
   On a phone the hero photo fills the whole screen behind the
   headline, so the copy needs its own ground to sit on rather
   than fighting marbling for contrast.
   ============================================================ */
@media (max-width:720px){
  /* the picture steps back so the words can be read */
  .hero-bg img{filter:brightness(.82) saturate(.95)}
  .hero-veil{
    background:
      linear-gradient(180deg,rgba(15,11,7,.58) 0%,rgba(15,11,7,.34) 26%,rgba(15,11,7,.72) 58%,rgba(15,11,7,.97) 100%),
      radial-gradient(120% 60% at 50% 100%,rgba(15,11,7,.85),transparent 70%);
  }
  .hero-in{padding-bottom:2.2rem}
  .hero h1{font-size:clamp(2.6rem,10.4vw,3.6rem);line-height:1.0;letter-spacing:-.035em}
  .hero h1,.hero-kicker{text-shadow:0 2px 18px rgba(15,11,7,.8),0 1px 3px rgba(15,11,7,.7)}
  .hero-kicker{margin-bottom:1rem}

  /* buttons go full width and stack, so neither is a thumb-stretch */
  .hero-foot{display:flex;flex-direction:column;align-items:stretch;gap:.6rem}
  .hero-foot .btn{width:100%;justify-content:center;text-align:center}
  .hero-rev{margin-bottom:1rem}

  /* address + hours read as one quiet block under the buttons */
  .hero-meta{margin-top:1.1rem;line-height:1.7;opacity:.85}
}

/* the closing line of the footer, centred and given room */
@media (max-width:720px){
  .foot-base{
    flex-direction:column;align-items:center;text-align:center;gap:.9rem;
    margin-top:2.4rem;padding-top:1.4rem;opacity:.62;line-height:1.6;
  }
  .foot-base > span{display:block}
  .foot-base .kb-credit{
    display:inline-flex;align-items:center;gap:.5rem;margin-top:.2rem;
    padding-top:.9rem;border-top:1px solid var(--line-dark);width:100%;justify-content:center;
  }
  .foot-base a{padding:.25rem 0}
}

/* why a sandwich costs more than the menu price — shown as it's built, never at the register */
.tb-why{flex-basis:100%;margin:0 0 .5rem;font-family:var(--mono);font-size:11px;letter-spacing:.04em;
  color:var(--oxblood);opacity:.85;text-align:left}

/* ============================================================
   THE CONFIRMATION SCREEN
   A sent ticket gets the page to itself: the marketing above it
   is gone before first paint, so there's no flash of the hero
   and no scroll-jump down to the receipt.
   ============================================================ */
html.tkt-done .page-hero,
html.tkt-done .byo-band,
html.tkt-done .on-light,
html.tkt-done .cta-band,
html.tkt-done #tb,
html.tkt-done .tb-bar{display:none!important}
html.tkt-done #order-form{min-height:100svh;display:flex;align-items:center;padding-top:6rem;padding-bottom:4rem}
html.tkt-done #order-form > .wrap,
html.tkt-done #order-form > .container{width:100%}
html.tkt-done .split,
html.tkt-done .form-grid{display:block!important}
/* the copy beside the form is for people still ordering, not for someone who just did */
html.tkt-done #order-form .split > *:not(.split-r):not(:has(.tb-stub)){display:none}

/* 86'd — the counter has marked it gone for today. Still listed, plainly not
   orderable, so nobody wonders whether the shop forgot it. */
.tb-item.sold-out{opacity:.5;cursor:not-allowed;position:relative}
.tb-item.sold-out b{text-decoration:line-through;text-decoration-thickness:1px}
.tb-item.sold-out span{color:var(--oxblood);font-style:italic}

/* ordering switched off at the counter */
.tb-paused{display:block;background:#5c1513;color:#f7f1e6;border:1px solid #a02a22;
  border-radius:10px;padding:1rem 1.15rem;margin:0 0 1.25rem}
.tb-paused b{display:block;font-size:1.05rem;margin-bottom:.3rem}
.tb-paused span{display:block;font-size:.93rem;opacity:.92;line-height:1.5}
.tb-paused a{color:#e8c46a;text-decoration:underline}
.ordering-paused #tb .tb-item,.ordering-paused #tb .tb-dept{opacity:.5;pointer-events:none}

/* ORDERING PAUSED — the builder, the cart and the send form are out of reach
   in the markup, not just dimmed, so nobody starts something they can't finish. */
.ordering-closed #order-form,
.ordering-closed #tb,
.ordering-closed .byo-band .byo-cta,
.ordering-closed .oo-layout,
.ordering-closed .oo-testbar{display:none !important}
.closed-band{background:var(--cream,#f7f1e6);padding:3.2rem 0 3rem;border-bottom:1px solid rgba(35,20,19,.12)}
.closed-in{max-width:44rem}
.closed-kick{font:600 .78rem/1 var(--mono,ui-monospace,monospace);letter-spacing:.14em;text-transform:uppercase;
  color:var(--oxblood,#5c1513);opacity:.75;margin:0 0 .5rem}
.closed-h{font-family:var(--display,Fraunces,Georgia,serif);font-size:clamp(2rem,5vw,3rem);line-height:1.05;margin:0 0 .7rem;color:var(--ink,#231413)}
.closed-sub{font-size:1.05rem;line-height:1.6;color:var(--ink,#231413);opacity:.85;margin:0 0 1.4rem;max-width:36rem}
.closed-foot{display:flex;flex-wrap:wrap;gap:.7rem;margin-bottom:1.1rem}
.closed-hours{font:.85rem/1.5 var(--mono,ui-monospace,monospace);color:var(--ink,#231413);opacity:.6;margin:0}

/* test mode: impossible to be in it by accident and not notice */
.tb-testbar{position:sticky;top:0;z-index:9999;background:#b45309;color:#fff;
  font:600 .8rem/1.4 var(--mono,ui-monospace,monospace);letter-spacing:.04em;
  text-align:center;padding:.5rem .9rem}