/* Suprema — printed-menu editorial. Paper, one red ink, navy from the dining room. */
@font-face{font-family:"Gambetta";src:url(assets/fonts/Gambetta-Semibold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Gambetta";src:url(assets/fonts/Gambetta-Medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Gambetta";src:url(assets/fonts/Gambetta-Italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Gambetta";src:url(assets/fonts/Gambetta-MediumItalic.woff2) format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:"Gambetta";src:url(assets/fonts/Gambetta-SemiboldItalic.woff2) format("woff2");font-weight:600;font-style:italic;font-display:swap}
@font-face{font-family:"Boska";src:url(assets/fonts/Boska-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Boska";src:url(assets/fonts/Boska-BoldItalic.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"Switzer";src:url(assets/fonts/Switzer-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Switzer";src:url(assets/fonts/Switzer-Italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Switzer";src:url(assets/fonts/Switzer-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Switzer";src:url(assets/fonts/Switzer-Semibold.woff2) format("woff2");font-weight:600;font-display:swap}

:root{
  --paper:#F3EEE4; --paper-2:#EBE4D6; --paper-3:#E2D9C8;
  --red:#E3302D;            /* the wordmark's red, a touch deeper so it holds on paper */
  --red-ink:#B8231F;        /* small red text: passes 4.5:1 on paper */
  --navy:#17243F; --navy-2:#22314F;
  --ink:#1B2236; --ink-2:#4A4F5E;
  --brass:#A9843F;
  --rule:1px solid var(--red);
  --serif:"Gambetta",Georgia,"Times New Roman",serif;
  --display:"Boska","Gambetta",Georgia,serif;
  --gold:#C9A45C;
  --sans:"Switzer",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gut:clamp(16px,3.2vw,44px);
  --max:1360px;
  --ease:cubic-bezier(.22,1,.36,1);
  --nav-h:76px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--sans);overflow-x:clip;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .42 0 0 0 0 .34 0 0 0 0 .24 0 0 0 .17 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:12px;top:-60px;z-index:300;background:var(--navy);color:var(--paper);padding:10px 16px;text-decoration:none}
.skip:focus{top:12px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- type ---------- */
.display{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:-.008em;line-height:.9;color:var(--red);margin:0}
.eyebrow{font:italic 500 15px/1.3 var(--serif);color:var(--red-ink);letter-spacing:.02em;margin:0}
.eyebrow b{font-style:normal;font:600 11.5px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;margin-right:.6em}
.lede{font:italic 400 clamp(22px,2.3vw,32px)/1.25 var(--serif);color:var(--ink);margin:0}
/* boxed drop cap, three lines deep: the box starts at the capital tops of line one and sits on the baseline of line three
   (Switzer at line-height 1.6: cap top .485em into the line, third baseline at 4.365em). A real element, because each engine
   sizes a floated ::first-letter differently. */
.dc{float:left;height:3.88em;margin:.485em .5em 0 0;padding:0 .42em;display:flex;align-items:center;justify-content:center;background:var(--navy);color:var(--paper)}
.dc b{font:600 2.9em/normal var(--serif)}
.small-caps{font:600 11.5px/1.5 var(--sans);letter-spacing:.18em;text-transform:uppercase}

/* ---------- buttons ---------- */
.btn{--h:52px;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:var(--h);padding:0 26px;
  font:600 14px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border:1.5px solid var(--red);
  background:var(--red);color:var(--paper);transition:background .26s var(--ease),color .26s var(--ease),transform .26s var(--ease);cursor:pointer}
.btn:hover{background:var(--red-ink);border-color:var(--red-ink)}
.btn:active{transform:translateY(1px)}
.btn.ghost{background:transparent;color:var(--red-ink)}
.btn.ghost:hover{background:var(--red);color:var(--paper);border-color:var(--red)}
.btn.on-dark.ghost{color:var(--paper);border-color:var(--paper)}
.btn.on-dark.ghost:hover{background:var(--paper);color:var(--navy)}
.link{font:italic 500 17px/1.3 var(--serif);color:var(--red-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.link:hover{color:var(--red)}

/* ---------- masthead ---------- */
.topline{border-bottom:var(--rule);font:500 12.5px/1 var(--sans);letter-spacing:.08em;color:var(--ink-2)}
.topline .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:38px}
.topline a{text-decoration:none}
.topline a:hover{color:var(--red-ink)}
.status{display:inline-flex;align-items:center;gap:8px;color:var(--ink)}
.status i{width:8px;height:8px;border-radius:50%;background:var(--brass)}
.status.open i{background:#2F7A4B;box-shadow:0 0 0 3px rgba(47,122,75,.16)}
.status.closed i{background:var(--red)}
.mast{position:sticky;top:0;z-index:100;background:var(--paper);border-bottom:var(--rule)}
.mast::after{content:"";position:absolute;left:0;right:0;bottom:-5px;border-bottom:1px solid var(--red);opacity:.55}
.mast .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:var(--nav-h)}
.mast nav ul{list-style:none;margin:0;padding:0;display:flex;gap:28px}
.mast nav a{font:italic 500 18px/1 var(--serif);color:var(--ink);text-decoration:none;position:relative;padding:14px 0}
.mast nav a::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:1px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .26s var(--ease)}
.mast nav a:hover::after{transform:scaleX(1)}
.brand{display:block;width:clamp(150px,15vw,214px);color:var(--red);line-height:0}
.brand svg{width:100%;height:auto;--logo-tag:var(--paper)}
.mast .ctas{display:flex;justify-content:flex-end;gap:10px}
.mast .btn{--h:44px;padding:0 18px;font-size:12.5px}
.burger{display:none}

/* ---------- hero ---------- */
.hero{padding:clamp(22px,3vw,40px) 0 clamp(36px,4vw,56px)}
.hero .wrap{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(32px,5vw,88px);align-items:center}
.hero-photo{position:relative;margin:0}
.hero-photo .frame{position:relative;border:var(--rule);padding:12px;background:var(--paper)}
.hero-photo .frame::before{content:"";position:absolute;inset:5px;border:1px solid var(--red);opacity:.4;pointer-events:none}
.hero-photo img{height:min(calc(100vh - 38px - var(--nav-h) - 130px),700px);height:min(calc(100svh - 38px - var(--nav-h) - 130px),700px);min-height:420px;width:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 70%}
.hero-photo figcaption{display:flex;justify-content:space-between;margin-top:10px;font:italic 400 14px/1.3 var(--serif);color:var(--ink-2)}
.stamp{position:absolute;width:clamp(118px,11vw,150px);aspect-ratio:1;color:var(--red);transform:rotate(-11deg)}
.stamp svg{width:100%;height:100%}
.hero .stamp{left:clamp(-84px,-5vw,-48px);right:auto;bottom:48px;top:auto;transform:rotate(-8deg)}
.hero-copy{display:flex;flex-direction:column;gap:clamp(18px,2vw,26px)}
.hero h1{font-size:clamp(66px,8.6vw,134px);line-height:.88}
.hero h1 .line{display:block;white-space:nowrap}
.hero h1 span{display:block}
.hero-copy p.sub{max-width:34em;margin:0;color:var(--ink-2)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.proof{display:flex;flex-wrap:wrap;gap:0;margin-top:6px;border-top:var(--rule)}
.proof li{list-style:none;flex:1 1 180px;padding:14px 18px 2px 0;font:400 14px/1.4 var(--sans);color:var(--ink-2)}
.proof li+li{padding-left:18px;border-left:var(--rule)}
.proof strong{display:block;font:600 22px/1.1 var(--serif);color:var(--ink);margin-bottom:4px}
.proof{padding:0;margin-bottom:0}

/* ---------- marquee ---------- */
.marquee{background:var(--red);color:var(--paper);overflow:hidden;border-top:1px solid var(--red-ink);border-bottom:1px solid var(--red-ink)}
.marquee .track{display:flex;width:max-content;animation:roll 38s linear infinite}
.marquee span{font:italic 500 clamp(20px,2vw,28px)/1 var(--serif);padding:18px 0;white-space:nowrap}
.marquee span::after{content:"✦";font-style:normal;font-size:.6em;margin:0 1.2em;vertical-align:.25em}
@keyframes roll{to{transform:translateX(-50%)}}

/* ---------- sections ---------- */
section{position:relative}
.sec{padding:clamp(64px,8vw,120px) 0}
.sec-head{display:grid;grid-template-columns:auto 1fr;gap:clamp(18px,3vw,48px);align-items:end;margin-bottom:clamp(30px,4vw,56px)}
.sec-head .display{font-size:clamp(52px,6.6vw,96px)}
.sec-head p{margin:0;max-width:30em;color:var(--ink-2);padding-bottom:.6em}
.rule-top{border-top:var(--rule)}

/* BYOB */
.byob .wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.35fr) minmax(0,.85fr);gap:clamp(24px,4vw,64px);align-items:center}
.byob .ill{width:100%;max-width:340px;justify-self:center}
.byob .display{font-size:clamp(60px,7.6vw,112px);margin-bottom:.12em}
.byob .body p{margin:0 0 1em;font-size:18px}
.byob .facts{list-style:none;margin:0;padding:0;border-top:var(--rule)}
.byob .facts li{padding:16px 0;border-bottom:var(--rule);font:italic 400 19px/1.3 var(--serif)}
.byob .facts li span{display:block;font:600 11px/1.6 var(--sans);font-style:normal;letter-spacing:.18em;text-transform:uppercase;color:var(--red-ink);margin-bottom:2px}

/* signatures (posters) */
.sigs{background:var(--paper)}
.sig-top{padding-top:clamp(64px,8vw,120px);padding-bottom:clamp(28px,3vw,44px)}
.poster{position:relative;display:flex;flex-direction:column;align-items:center;padding:clamp(70px,7vw,100px) 0 clamp(60px,6vw,90px);
  border-top:var(--rule);overflow:hidden}
.poster:last-child{border-bottom:var(--rule)}
.poster .name{position:relative;z-index:1;margin:0;font-size:var(--fs,12vw);line-height:.86;white-space:nowrap;text-align:center;pointer-events:none;user-select:none}
.poster .row{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,var(--pw,600px)) minmax(0,1fr);align-items:center;gap:clamp(20px,3vw,48px);
  width:100%;max-width:var(--max);padding:0 var(--gut);margin-top:calc(var(--fs,12vw) * -.5)}
.poster .plate{margin:0;position:relative}
.poster .plate img{width:100%}
.poster .plate::after{content:"";position:absolute;left:14%;right:14%;bottom:-3%;height:10%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(40,25,15,.3),transparent);filter:blur(10px);z-index:-1}
.poster .ingr{margin:0;justify-self:end;max-width:230px;text-align:right;font:600 11.5px/1.8 var(--sans);letter-spacing:.17em;text-transform:uppercase;color:var(--ink);text-wrap:balance}
.poster .pull{margin:0;justify-self:start;max-width:240px;font:italic 400 20px/1.3 var(--serif);color:var(--ink);text-wrap:balance}
.poster .pull cite{display:block;margin-top:8px;font:600 11px/1.4 var(--sans);font-style:normal;letter-spacing:.16em;text-transform:uppercase;color:var(--red-ink)}
.poster .tag{position:absolute;z-index:3;top:26px}
.poster .tl{left:max(var(--gut),calc((100% - var(--max)) / 2 + var(--gut)))}
.poster .tr{right:max(var(--gut),calc((100% - var(--max)) / 2 + var(--gut)));text-align:right}
.poster .num{font:italic 500 18px/1 var(--serif);color:var(--red-ink)}
.poster .price{font:600 28px/1 var(--serif);color:var(--ink)}
.poster .price small{display:block;font:400 13px/1.4 var(--sans);color:var(--ink-2);margin-top:4px}

/* menu */
.menu-sec .tabs{display:flex;flex-wrap:wrap;gap:0;border:var(--rule);width:max-content;max-width:100%;margin-bottom:clamp(28px,3.5vw,48px)}
.menu-sec .tabs button{appearance:none;background:transparent;border:0;border-right:var(--rule);padding:14px 22px;min-height:48px;
  font:italic 500 18px/1 var(--serif);color:var(--ink);cursor:pointer}
.menu-sec .tabs button:last-child{border-right:0}
.menu-sec .tabs button[aria-selected="true"]{color:var(--red-ink);box-shadow:inset 0 -3px 0 var(--red);background:var(--paper-2)}
.menu-panel{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(32px,5vw,80px)}
.menu-panel[hidden]{display:none}
.course{break-inside:avoid;margin-bottom:clamp(30px,3.5vw,48px)}
.course h3{display:flex;align-items:baseline;gap:14px;margin:0 0 14px;font:600 13px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--red-ink)}
.course h3::after{content:"";flex:1;border-bottom:var(--rule);transform:translateY(-3px)}
.course h3 em{font:italic 400 15px/1 var(--serif);letter-spacing:0;text-transform:none;color:var(--ink-2)}
.dish{display:grid;grid-template-columns:1fr auto;gap:2px 16px;padding:11px 0;border-bottom:1px dashed rgba(184,35,31,.28)}
.dish h4{margin:0;font:600 20px/1.2 var(--serif);color:var(--ink)}
.dish .p{font:600 18px/1.2 var(--serif);color:var(--ink);white-space:nowrap}
.dish p{grid-column:1 / -1;margin:0;font-size:14.5px;line-height:1.5;color:var(--ink-2)}
.dish .badge{display:inline-block;margin-left:8px;font:italic 500 13px/1 var(--serif);color:var(--red-ink);vertical-align:2px}
.menu-note{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;justify-content:space-between;border-top:var(--rule);padding-top:22px;margin-top:8px;color:var(--ink-2);font-size:15px}

/* lola room */
.lola{background:var(--paper);padding-top:clamp(16px,2vw,32px);padding-bottom:clamp(24px,3vw,40px)}
.lola .grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:var(--rule)}
.lola .panel{background:var(--red);color:var(--paper);padding:clamp(28px,4vw,56px);display:flex;flex-direction:column;gap:20px}
.lola .panel .display{color:var(--paper);font-size:clamp(54px,6.2vw,96px)}
.lola .panel p{margin:0;font-size:18px;max-width:30em}
.lola .panel .eyebrow{color:var(--paper);opacity:.92}
.lola .panel ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.lola .panel li{border:1px solid rgba(243,238,228,.7);padding:7px 12px;font:italic 400 16px/1 var(--serif)}
.lola .photo{margin:0;position:relative;min-height:340px}
.lola .photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lola .photo figcaption{position:absolute;left:14px;bottom:14px;background:var(--paper);padding:6px 10px;font:italic 400 14px/1.2 var(--serif);color:var(--ink)}
.lola form{grid-column:1 / -1;border-top:var(--rule);padding:clamp(24px,3.5vw,48px);display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px 20px;background:var(--paper)}
.lola form .intro{grid-column:1 / span 2;align-self:start}
.lola form .intro h3{margin:0 0 8px;font:600 30px/1.05 var(--serif);color:var(--ink)}
.lola form .intro p{margin:0;color:var(--ink-2);font-size:15px}
.fields{grid-column:3 / -1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px}
.field{display:flex;flex-direction:column;gap:6px}
.field.full{grid-column:1 / -1}
.field label{font:italic 500 15px/1 var(--serif);color:var(--red-ink)}
.field label small{font:400 12px/1 var(--sans);color:var(--ink-2);font-style:normal;margin-left:6px}
.field input,.field select,.field textarea{appearance:none;-webkit-appearance:none;width:100%;min-height:50px;border:1px solid rgba(23,36,63,.35);border-radius:0;
  background:#FBF8F2;padding:12px 14px;font:400 16px/1.3 var(--sans);color:var(--ink)}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23B8231F' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}
.field textarea{min-height:110px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--red);outline-offset:0;border-color:var(--red)}
.field [aria-invalid="true"]{border-color:var(--red)}
.form-foot{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.form-msg{margin:0;font:italic 400 17px/1.4 var(--serif);color:var(--ink)}
.form-msg.err{color:var(--red-ink)}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* story */
.story{background:var(--navy);color:var(--paper)}
.story .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center}
.story figure{margin:0;position:relative}
.story figure{border:1px solid var(--gold);padding:10px;outline:1px solid rgba(201,164,92,.5);outline-offset:-6px}
.story figure img{width:100%;aspect-ratio:1500/1053;object-fit:cover}
.story .display{color:var(--paper);font-size:clamp(58px,6.8vw,104px)}
.story .display em{font-style:italic;color:var(--gold);text-transform:none}
.story p{margin:0 0 1em;font-size:18px;color:rgba(243,238,228,.88);max-width:34em}
.story .dc{background:var(--gold);color:var(--navy)}
.eyebrow.gold{color:var(--gold)}
.story .meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:22px;border-top:1px solid rgba(201,164,92,.55);padding-top:20px}
.story .meta div{font:400 14px/1.4 var(--sans);color:rgba(243,238,228,.75)}
.story .meta strong{display:block;font:600 34px/1 var(--serif);color:var(--paper);margin-bottom:6px}

/* reviews */
.reviews .quotes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:var(--rule);border-bottom:var(--rule)}
.reviews blockquote{margin:0;padding:clamp(22px,2.6vw,36px) clamp(18px,2vw,28px);border-left:var(--rule);display:flex;flex-direction:column;justify-content:space-between;gap:20px}
.reviews blockquote:first-child{border-left:0}
.reviews blockquote p{margin:0;font:italic 400 clamp(21px,1.9vw,27px)/1.25 var(--serif);color:var(--ink)}
.reviews cite{font:600 11.5px/1.4 var(--sans);font-style:normal;letter-spacing:.18em;text-transform:uppercase;color:var(--red-ink)}
.reviews .score{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px}
.reviews .score strong{font:600 clamp(54px,6vw,92px)/.9 var(--serif);color:var(--red)}
.reviews .score span{color:var(--ink-2)}

/* visit */
.visit .grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;border:var(--rule)}
.visit .col{padding:clamp(24px,3vw,40px);border-left:var(--rule)}
.visit .col:first-child{border-left:0}
.visit h3{margin:0 0 16px;font:600 13px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--red-ink)}
.hours{width:100%;border-collapse:collapse;font-size:16px}
.hours th{text-align:left;font:600 19px/1.2 var(--serif);color:var(--ink);padding:9px 0;border-bottom:1px dashed rgba(184,35,31,.28)}
.hours td{text-align:right;padding:9px 0;border-bottom:1px dashed rgba(184,35,31,.28);color:var(--ink-2)}
.hours td em{display:block;font:italic 400 13.5px/1.2 var(--serif);color:var(--red-ink)}
.hours tr.today th,.hours tr.today td{color:var(--red-ink)}
.visit address{font-style:normal;font:500 21px/1.35 var(--serif);color:var(--ink);margin-bottom:14px}
.visit p{margin:0 0 14px;color:var(--ink-2);font-size:16px}
.visit .ill{width:150px;margin:6px 0 18px}
.visit .tel{display:block;font:600 clamp(28px,2.6vw,36px)/1.1 var(--serif);color:var(--red);text-decoration:none;margin-bottom:6px}
.visit .stack{display:flex;flex-direction:column;gap:10px;align-items:flex-start;margin-top:8px}

/* footer */
.foot{background:var(--navy);color:var(--paper);padding:clamp(56px,7vw,96px) 0 calc(28px + env(safe-area-inset-bottom))}
.foot .big{width:min(100%,980px);color:var(--red);margin:0 auto clamp(36px,5vw,64px)}
.foot .big svg{--logo-tag:var(--navy)}
.foot .cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;border-top:1px solid rgba(243,238,228,.3);padding-top:28px}
.foot h4{margin:0 0 12px;font:600 11.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.foot ul{list-style:none;margin:0;padding:0}
.foot li{margin:0 0 8px;font-size:15.5px;color:rgba(243,238,228,.86)}
.foot a{text-decoration:none}
.foot a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.foot .legal{margin-top:40px;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;font-size:13px;color:rgba(243,238,228,.6)}

/* illustrations: drawn in, never on everything */
.ill img{width:100%;height:auto}

/* mobile action bar */
.actionbar{display:none}

/* ---------- motion hooks (JS adds .motion) ---------- */
.motion .rise{opacity:0;transform:translateY(24px)}

/* ---------- tablet + phone ---------- */
@media (max-width:1080px){
  .mast nav{display:none}
  .mast .wrap{grid-template-columns:auto 1fr auto}
  .brand{grid-column:1;width:150px}
  .mast .ctas{grid-column:3}
  .burger{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;margin-left:6px;border:var(--rule);background:transparent;color:var(--red-ink);cursor:pointer}
  .burger svg{width:22px;height:22px}
  .byob .wrap{grid-template-columns:1fr 1fr}
  .byob .ill{grid-row:1;grid-column:2;max-width:260px}
  .byob .body{grid-column:1 / -1}
  .byob .facts{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,1fr);gap:0 24px;border-top:0}
  .byob .facts li{border-top:var(--rule)}
  .reviews .quotes{grid-template-columns:1fr 1fr}
  .reviews blockquote:nth-child(3){border-left:0}
  .reviews blockquote:nth-child(n+3){border-top:var(--rule)}
  .visit .grid{grid-template-columns:1fr 1fr}
  .visit .col:nth-child(3){grid-column:1 / -1;border-left:0;border-top:var(--rule)}
  .lola form .intro{grid-column:1 / -1}
  .fields{grid-column:1 / -1}
}
/* tall / narrow: stack the hero (tablet portrait too) */
@media (max-width:1080px) and (orientation:portrait), (max-width:760px){
  .hero .wrap{grid-template-columns:1fr}
  .hero-copy{order:-1}
  .hero-photo{max-width:640px;width:100%;justify-self:center}
  .hero-photo img{width:100%;height:auto;min-height:0}
  .story .wrap{grid-template-columns:1fr}
  .story figure{max-width:620px}
}
@media (max-width:760px){
  :root{--nav-h:64px}
  body{font-size:16px}
  .foot{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
  .topline .addr,.topline a{display:none}
  .topline .wrap{justify-content:center}
  .mast .ctas .btn.ghost{display:none}
  .mast .btn{--h:44px;padding:0 14px}
  .brand{width:124px}
  .hero{padding-top:22px}
  .hero h1{font-size:clamp(50px,15.5vw,84px)}
  .hero-photo img{width:100%;height:auto;min-height:0}
  .hero .stamp{right:4px;top:-5%;width:84px}
  .proof li{flex-basis:100%;padding:12px 0 0;border-left:0}
  .proof li+li{padding-left:0;border-left:0;border-top:1px dashed rgba(184,35,31,.35);margin-top:10px}
  .sec-head{grid-template-columns:1fr}
  .byob .wrap{grid-template-columns:1fr}
  .byob .ill{grid-column:1;grid-row:auto;max-width:200px;justify-self:start}
  .byob .facts{grid-template-columns:1fr}
  .poster{padding:84px 0 56px}
  .poster .row{grid-template-columns:1fr 1fr;grid-template-areas:'plate plate' 'ingr pull';gap:28px 16px;margin-top:calc(var(--fsm,15vw) * -.3)}
  .poster .plate{grid-area:plate;justify-self:center;width:min(86%,var(--pw,600px))}
  .poster .ingr{grid-area:ingr;align-self:start}
  .poster .pull{grid-area:pull;align-self:start}
  .poster .ingr{justify-self:start;text-align:left;max-width:none;font-size:10.5px}
  .poster .pull{font-size:17px;justify-self:end;text-align:right}
  .poster .name{font-size:var(--fsm,15vw);white-space:normal;line-height:.84}
  .poster .tag{top:20px}
  .menu-sec .tabs{width:100%}
  .menu-sec .tabs button{flex:1 1 50%;border-bottom:var(--rule);padding:14px 10px;font-size:17px}
  .menu-sec .tabs button:nth-child(2n){border-right:0}
  .menu-panel{grid-template-columns:1fr}
  .lola .grid{grid-template-columns:1fr}
  .lola .photo{min-height:260px;aspect-ratio:4/3}
  .fields{grid-template-columns:1fr}
  .reviews .quotes{grid-template-columns:1fr}
  .reviews blockquote{border-left:0!important;border-top:var(--rule)}
  .reviews blockquote:first-child{border-top:0}
  .visit .grid{grid-template-columns:1fr}
  .visit .col{border-left:0;border-top:var(--rule)}
  .visit .col:first-child{border-top:0}
  .foot .cols{grid-template-columns:1fr 1fr}
  .actionbar{display:grid;grid-template-columns:1.3fr 1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:150;background:var(--paper);
    border-top:var(--rule);padding:8px 10px calc(8px + env(safe-area-inset-bottom));gap:8px}
  .actionbar .btn{--h:50px;padding:0 8px;font-size:12px;letter-spacing:.1em}
}
/* phone landscape and short screens: no sticky masthead stealing the screen */
@media (max-height:520px) and (orientation:landscape){
  :root{--nav-h:54px}
  .topline{display:none}
  .mast .wrap{grid-template-columns:auto 1fr auto}
  .mast nav{display:none}
  .brand{grid-column:1;width:112px}
  .mast .ctas{grid-column:3}
  .mast .ctas .btn.ghost{display:none}
  .mast .btn{--h:40px;padding:0 14px}
  .burger{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin-left:6px;border:var(--rule);background:transparent;color:var(--red-ink);cursor:pointer}
  .burger svg{width:20px;height:20px}
  .actionbar{display:none}
  .foot{padding-bottom:calc(28px + env(safe-area-inset-bottom))}
}

/* menu overlay (phones/tablets) */
.sheet{position:fixed;inset:0;z-index:250;background:var(--paper);display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  padding:calc(14px + env(safe-area-inset-top)) max(var(--gut),env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(var(--gut),env(safe-area-inset-left));
  transform:translateY(-100%);transition:transform .52s var(--ease);visibility:hidden}
.sheet.open{transform:none;visibility:visible}
.sheet .top{display:flex;justify-content:space-between;align-items:center;border-bottom:var(--rule);padding-bottom:14px}
.sheet .top .brand{width:124px}
.sheet ul{list-style:none;margin:28px 0 0;padding:0}
.sheet li a{display:block;padding:14px 0;border-bottom:var(--rule);font:700 clamp(38px,10vw,56px)/1 var(--display);text-transform:uppercase;color:var(--red);text-decoration:none;letter-spacing:-.005em}
.sheet .btns{margin-top:auto;padding-top:24px;display:grid;gap:10px}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .marquee .track{animation:none}
  .sheet{transition:none}
}

.lola .panel .ill.table{width:min(78%,360px);margin:4px 0 2px;opacity:.95}
.visit .ill.phone{width:150px;margin:0 0 14px}

/* engraving placements */
.menu-sec .sec-head{grid-template-columns:auto auto 1fr}
.menu-sec .head-ill{width:clamp(70px,7vw,104px);align-self:center;transform:rotate(-8deg)}
.takehome{display:grid;grid-template-columns:1.3fr repeat(3,1fr);border:var(--rule);margin-top:clamp(40px,5vw,72px)}
.takehome > *{padding:clamp(20px,2.4vw,32px);border-left:var(--rule);margin:0}
.takehome > :first-child{border-left:0}
.th-head h3{margin:6px 0 10px;font:600 clamp(34px,3.4vw,50px)/.95 var(--serif);text-transform:uppercase;color:var(--red);letter-spacing:-.02em}
.th-head p{margin:0 0 18px;color:var(--ink-2);font-size:15.5px}
.takehome figure{display:flex;flex-direction:column;justify-content:space-between;gap:16px;background:var(--paper-2)}
.takehome figure img{width:78%;max-height:190px;object-fit:contain;margin:auto}
.takehome figcaption{font:400 14px/1.4 var(--sans);color:var(--ink-2);text-align:center}
.takehome figcaption b{display:block;font:600 21px/1.2 var(--serif);color:var(--ink)}
.byob .facts li.has-ill{position:relative;padding-right:84px}
.byob .facts li.has-ill img{position:absolute;right:0;top:50%;width:70px;transform:translateY(-50%)}
.visit .ill.sign{width:150px;margin:0 0 14px}
@media (max-width:1080px){.takehome{grid-template-columns:repeat(3,1fr)}.takehome .th-head{grid-column:1 / -1;border-bottom:var(--rule)}.takehome .th-head + figure{border-left:0}}
@media (max-width:760px){.menu-sec .sec-head{grid-template-columns:1fr}.menu-sec .head-ill{display:none}
  .takehome{grid-template-columns:1fr 1fr}.takehome figure:last-child{grid-column:1 / -1;border-left:0;border-top:var(--rule)}
  .takehome figure:nth-of-type(1){border-left:0}}

/* round 2: hero party link, nav emphasis, frames, page border, masthead, form intro */
.mast nav a.hot{color:var(--red-ink)}
.party-link{align-self:flex-start;font-size:18px}
.party-link::after{content:" →";font-style:normal}
.lola .grid,.visit .grid,.takehome,.hero-photo .frame{outline:1px solid rgba(227,48,45,.45);outline-offset:5px}
.lola .grid,.visit .grid,.takehome{margin-inline:6px}
@media (min-width:1180px){
  body::after{content:"";position:fixed;top:0;bottom:0;left:max(10px,calc(50vw - var(--max) / 2 - 14px));right:max(10px,calc(50vw - var(--max) / 2 - 14px));
    border-left:1px solid rgba(227,48,45,.55);border-right:1px solid rgba(227,48,45,.55);pointer-events:none;z-index:120}
}
.masthead{text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px;margin-bottom:clamp(30px,4vw,52px);
  border-top:var(--rule);border-bottom:var(--rule);padding:clamp(22px,3vw,36px) 0;position:relative}
.masthead::before,.masthead::after{content:"";position:absolute;left:0;right:0;border-top:1px solid rgba(227,48,45,.45)}
.masthead::before{top:4px}.masthead::after{bottom:4px}
.masthead .display{font-size:clamp(64px,9vw,140px)}
.masthead .small-caps{color:var(--red-ink);margin:0}
.masthead .mast-sub{margin:0;max-width:40em;color:var(--ink-2)}
.masthead .head-ill{width:clamp(56px,5vw,78px);transform:rotate(-6deg)}
.menu-sec .tabs{margin-inline:auto}
.note-actions{display:inline-flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.lola form .intro h3.display{font-size:clamp(36px,3.4vw,52px);color:var(--red);margin:0 0 12px}
.intro-quote{margin:22px 0 18px;padding:16px 0 0;border-top:var(--rule)}
.intro-quote p{margin:0;font:italic 400 21px/1.3 var(--serif);color:var(--ink)}
.intro-quote cite{display:block;margin-top:8px;font:600 11px/1.4 var(--sans);font-style:normal;letter-spacing:.16em;text-transform:uppercase;color:var(--red-ink)}
.tel-big{display:inline-block;font:600 30px/1.1 var(--serif);color:var(--red);text-decoration:none;white-space:nowrap}
.hero-photo figcaption span:last-child{font-style:italic;text-align:right}
@media (max-width:760px){
  .hero .stamp{right:4px;left:auto;bottom:auto;top:-5%;transform:rotate(-8deg)}
  .story .meta{grid-template-columns:repeat(3,1fr);gap:12px}.story .meta strong{font-size:26px}
  .story figure img{max-height:460px}
  .hero-photo figcaption{flex-direction:column;gap:4px}.hero-photo figcaption span:last-child{text-align:left}
  .lola .grid,.visit .grid,.takehome{margin-inline:4px}
}
@media (min-width:761px) and (max-width:900px){
  .poster .row{grid-template-columns:1fr 1fr;grid-template-areas:'plate plate' 'ingr pull';gap:28px 24px;margin-top:calc(var(--fs,12vw) * -.4)}
  .poster .plate{grid-area:plate;justify-self:center;width:min(80%,var(--pw,600px))}
  .poster .ingr{grid-area:ingr;justify-self:start;text-align:left;max-width:300px}
  .poster .pull{grid-area:pull;justify-self:end;text-align:right}
}

/* phone fixes (Jean's iPhone, 2026-10-03) */
/* iOS Safari 26 floats its toolbars over the page: paint the strips behind them so content never shows through */
.wrap{padding-left:max(var(--gut),env(safe-area-inset-left));padding-right:max(var(--gut),env(safe-area-inset-right))}
.scrolled .mast::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:220px;background:var(--paper);pointer-events:none}
.actionbar::after{content:"";position:absolute;left:0;right:0;top:100%;height:220px;background:var(--paper);pointer-events:none}
@media (max-height:520px) and (orientation:landscape){
  .sheet .top{padding-bottom:10px}
  .sheet .top .brand{width:104px}
  .sheet ul{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;column-gap:28px}
  .sheet li a{font-size:clamp(26px,8.5vh,38px);padding:10px 0}
  .sheet .btns{grid-template-columns:repeat(3,1fr);padding-top:16px}
  .sheet .btns .btn{--h:46px;font-size:12px;padding:0 10px}
}

.sheet:focus{outline:none}

/* hero: the forkful floats on the paper (white ground multiplies away) */
.hero-photo.fork .frame{border:0;padding:0;background:transparent;outline:0}
.hero-photo.fork .frame::before{display:none}
.hero-photo.fork img{object-fit:contain;object-position:50% 40%}

/* hero film: same paper ground as the page, edges fade into it so there is never a box */
.hero-photo.fork .frame{position:relative}
.hero-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;opacity:0;transition:opacity .52s var(--ease);
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 9%,#000 91%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 6%,#000 84%,transparent 100%);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent 0,#000 9%,#000 91%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 6%,#000 84%,transparent 100%);mask-composite:intersect}
.hero-film.on{opacity:1}
.hero-photo.fork .hero-still{transition:opacity .52s var(--ease)}
.hero-photo.fork.playing .hero-still{opacity:0}

/* ---------- v10: food first ---------- */
/* story: the crew (landscape group photo) */
.story figure img{aspect-ratio:1290/968}

/* from the kitchen: a row of framed prints, scroll / swipe / drag / arrows */
.kitchen{padding:clamp(64px,8vw,112px) 0 clamp(48px,6vw,84px)}
.kit-head{grid-template-columns:auto 1fr auto;margin-bottom:clamp(22px,3vw,40px)}
.kit-ctl{display:flex;gap:10px;padding-bottom:.4em}
.arrow{display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;border:var(--rule);background:var(--paper);color:var(--red-ink);cursor:pointer;
  transition:background .26s var(--ease),color .26s var(--ease),opacity .26s var(--ease)}
.arrow svg{width:22px;height:22px}
.arrow:hover:not(:disabled){background:var(--red);color:var(--paper)}
.arrow:disabled{opacity:.3;cursor:default}
.strip{--edge:max(var(--gut),calc((100vw - var(--max)) / 2 + var(--gut)));overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;
  scroll-padding-inline:var(--edge);scrollbar-width:none;cursor:grab}
.strip::-webkit-scrollbar{display:none}
.strip.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.strip:focus-visible{outline:2px solid var(--red);outline-offset:-2px}
.strip ul{display:flex;align-items:flex-start;gap:clamp(18px,2.4vw,34px);list-style:none;margin:0;padding:8px var(--edge) 10px;width:max-content}
.strip li{scroll-snap-align:start;width:min-content}
.print{appearance:none;display:block;border:0;background:none;padding:0;margin:0;color:inherit;font:inherit;text-align:left;cursor:zoom-in}
.strip.dragging .print{cursor:grabbing}
.print .mat{display:block;border:1px solid var(--red);padding:10px;background:var(--paper);outline:1px solid rgba(227,48,45,.45);outline-offset:4px;overflow:hidden}
.print img{height:clamp(270px,30vw,420px);width:auto;max-width:calc(100vw - 2 * var(--gut) - 22px);object-fit:cover;transition:transform .52s var(--ease)}
.print:hover img{transform:scale(1.035)}
.print:focus-visible{outline:0}
.print:focus-visible .mat{outline:2px solid var(--red);outline-offset:4px}
.print .cap{display:flex;gap:10px;align-items:baseline;margin-top:14px;font:italic 400 19px/1.25 var(--serif);color:var(--ink)}
.print .no{flex:none;font:600 11px/1 var(--sans);font-style:normal;letter-spacing:.16em;text-transform:uppercase;color:var(--red-ink)}
.kit-foot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:clamp(26px,3vw,40px)}

/* the slim party band: one line, the whole band is the link */
.party-band{display:block;text-decoration:none;color:var(--ink);background:var(--paper-2);border-top:var(--rule);border-bottom:var(--rule);position:relative}
.party-band::before,.party-band::after{content:"";position:absolute;left:0;right:0;border-top:1px solid rgba(227,48,45,.45)}
.party-band::before{top:4px}.party-band::after{bottom:4px}
.party-band .wrap{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:4px 18px;padding-top:clamp(20px,2.4vw,30px);padding-bottom:clamp(20px,2.4vw,30px);text-align:center}
.pb-ask{font:italic 400 clamp(22px,2.2vw,30px)/1.2 var(--serif)}
.pb-go{font:700 clamp(30px,3.4vw,48px)/1 var(--display);text-transform:uppercase;color:var(--red);letter-spacing:-.005em}
.pb-go::after{content:"→";display:inline-block;margin-left:.3em;font-family:var(--serif);font-weight:500;transition:transform .26s var(--ease)}
.party-band:hover .pb-go::after{transform:translateX(6px)}
.party-band:hover .pb-ask{color:var(--red-ink)}

/* BYOB is now a slimmer band between the menu and the Lola Room */
.byob{padding:clamp(44px,5vw,76px) 0;border-top:var(--rule)}
.byob .display{font-size:clamp(52px,5.8vw,88px)}
.byob .ill{max-width:250px}
.byob .body p{font-size:17px}
.lola{padding-top:0}

/* lightbox: native modal dialog (focus trap, Esc, inert page) */
.lb{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--paper);color:var(--ink);overflow:hidden;
  display:none;flex-direction:column}
.lb[open]{display:flex}
.lb::backdrop{background:rgba(23,36,63,.7)}
.lb-bar{flex:none;display:flex;align-items:center;gap:14px;border-bottom:var(--rule);
  padding:calc(10px + env(safe-area-inset-top)) max(var(--gut),env(safe-area-inset-right)) 10px max(var(--gut),env(safe-area-inset-left))}
.lb-title{margin:0;font:700 clamp(22px,2.4vw,30px)/1 var(--display);text-transform:uppercase;color:var(--red)}
.lb-count{margin:0 auto 0 0;font:italic 400 16px/1 var(--serif);color:var(--ink-2)}
.lb-all{--h:44px;padding:0 16px;font-size:12px}
.lb .lb-x{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border:var(--rule);background:transparent;color:var(--red-ink);cursor:pointer}
.lb .lb-x svg{width:22px;height:22px}
.lb-grid{flex:1;overflow-y:auto;overscroll-behavior:contain;list-style:none;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(42vw,190px),1fr));
  gap:clamp(10px,1.4vw,18px);align-content:start;padding:clamp(14px,2vw,28px) max(var(--gut),env(safe-area-inset-right)) calc(28px + env(safe-area-inset-bottom)) max(var(--gut),env(safe-area-inset-left))}
.lb-grid[hidden]{display:none}
.lb-grid button{appearance:none;display:block;width:100%;padding:6px;border:1px solid var(--red);background:var(--paper);cursor:zoom-in;color:inherit;font:inherit;text-align:left}
.lb-grid img{width:100%;aspect-ratio:1;object-fit:cover;background:var(--paper-2)}
.lb-grid span{display:block;padding:8px 2px 2px;font:italic 400 15px/1.25 var(--serif)}
.lb-one{flex:1;min-height:0;margin:0;position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto;
  padding:clamp(12px,2vw,28px) clamp(16px,6vw,96px) calc(16px + env(safe-area-inset-bottom));touch-action:pan-y pinch-zoom}
.lb-one[hidden]{display:none}
.lb-stage{min-height:0;display:flex;align-items:center;justify-content:center}
.lb-stage img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border:1px solid var(--red);padding:8px;background:var(--paper);user-select:none;-webkit-user-drag:none}
.lb-one figcaption{text-align:center;padding-top:14px;font:italic 400 clamp(18px,1.8vw,22px)/1.3 var(--serif)}
.lb-one .arrow{position:absolute;top:50%;transform:translateY(-50%)}
.lb-prev{left:max(10px,env(safe-area-inset-left))}.lb-next{right:max(10px,env(safe-area-inset-right))}
@media (max-width:760px){
  .kit-head{grid-template-columns:1fr}
  .kit-ctl{display:none}
  .lb-one{padding-inline:12px}
  .lb-one .arrow{top:auto;bottom:calc(8px + env(safe-area-inset-bottom));transform:none;width:46px;height:46px}
  .lb-title{display:none}
}
@media (max-width:1080px){.kit-head{grid-template-columns:1fr auto}.kit-head p{grid-column:1 / -1;grid-row:2}.kit-ctl{grid-row:1;grid-column:2}}
@media (max-width:760px){.kit-head{grid-template-columns:1fr}.kit-head p{grid-row:auto}}
@media (max-height:520px) and (orientation:landscape){.print img{height:min(62vh,300px)}}
@media (prefers-reduced-motion:reduce){.print img,.pb-go::after{transition:none}.print:hover img{transform:none}}
@media (max-width:760px){.lb-one figcaption{padding:12px 56px 0;min-height:58px}}
.lb-all[hidden]{display:none}
.lb-grid{align-items:start}
@media (max-width:760px){
  .print img{max-width:calc(80vw - 22px)}
  .byob .ill{max-width:130px}
  .byob .wrap{gap:18px}
}

/* ---------- v10 round 2 (critique 22) ---------- */
/* one heading face: Boska for every section-level head */
.th-head h3{font:700 clamp(40px,4.2vw,64px)/.9 var(--display);letter-spacing:-.005em}
.lola form .intro h3.display{font:700 clamp(40px,4.2vw,64px)/.9 var(--display);text-transform:uppercase;letter-spacing:-.005em}
/* one paper stock */
.menu-sec .tabs button[aria-selected="true"]{background:transparent}
.takehome figure{background:transparent}
/* posters: one ingredient per line; a long name may set on two lines */
.poster .ingr{line-height:1.9}
.poster .name.two span{display:block}
.poster .name.two{line-height:.84}
/* rhythm: no stacked double gaps */
.sig-top{padding-top:clamp(52px,6vw,88px)}
.menu-sec{padding-bottom:clamp(44px,5vw,72px)}
.reviews{padding-bottom:clamp(36px,4vw,56px)}
.visit{padding-top:clamp(52px,6vw,84px)}
/* the party band: a page of the menu inside the rails, not a promo strip */
.pb-wrap{padding-top:clamp(8px,1vw,16px);padding-bottom:clamp(8px,1vw,16px)}
.party-band{display:flex;align-items:center;justify-content:center;gap:clamp(18px,3vw,44px);background:transparent;margin-inline:6px;
  padding:clamp(18px,2.2vw,28px) clamp(16px,3vw,40px)}
.party-band::before{top:4px}.party-band::after{bottom:4px}
.pb-ill{width:clamp(96px,10vw,150px);flex:none;transform:rotate(-4deg)}
.pb-text{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:4px 18px;text-align:center}
.pb-occ{flex-basis:100%;font:600 11px/1.6 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--red-ink);margin-top:6px}
/* lightbox: same double hairline as the strip; captions outside the frame, one line */
.lb-stage img{outline:1px solid rgba(227,48,45,.45);outline-offset:4px}
.lb-grid button{outline:1px solid rgba(227,48,45,.45);outline-offset:3px}
.lb-grid li > span{display:block;padding:10px 2px 0;font:italic 400 15px/1.25 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-ig{font-size:15px;white-space:nowrap}
.lb-order{--h:44px;padding:0 16px;font-size:12px}
@media (max-width:760px){
  .lb-ig{display:none}
  .lb-bar{gap:8px}
  .lb-all,.lb-order{--h:40px;padding:0 10px;font-size:11px;letter-spacing:.08em}
  .lb .lb-x{width:44px;height:44px}
  .party-band{flex-direction:column;gap:10px;margin-inline:4px}
  .pb-ill{width:110px}
}
/* phone hero: food on the first screen (headline, its answer, then the fork) */
@media (max-width:600px){
  .hero .wrap{display:flex;flex-direction:column;gap:16px}
  .hero-copy{display:contents}
  .hero-copy > *{order:4}
  .hero-copy .eyebrow{order:1}
  .hero h1{order:2}
  .hero-copy .lede{order:2;margin-top:-6px}
  .hero-photo{order:3;width:auto;max-width:none;align-self:center}
  .hero-photo img,.hero-photo.fork img{height:min(40vh,400px);height:min(40svh,400px);width:auto;min-height:0;aspect-ratio:4/5}
  .hero-photo figcaption{max-width:calc(min(40vh,400px) * .8);max-width:calc(min(40svh,400px) * .8)}
  .hero .stamp{width:76px;right:-30px;top:-4%}
}

/* ---------- v12: Jean's round (2026-10-03 afternoon) ---------- */
/* party band: navy + gold like the story and footer; ink bands may run full bleed */
.party-band{display:block;margin:0;padding:0;background:var(--navy);color:var(--paper);border-top:1px solid var(--gold);border-bottom:1px solid var(--gold)}
.party-band::before,.party-band::after{border-top-color:rgba(201,164,92,.55)}
.party-band .wrap{display:flex;align-items:center;justify-content:center;gap:clamp(18px,3vw,44px);padding-top:clamp(22px,2.6vw,34px);padding-bottom:clamp(22px,2.6vw,34px)}
.party-band .pb-ill{width:clamp(110px,11vw,170px);opacity:.92}
.party-band .pb-ask{color:var(--gold)}
.party-band .pb-go{color:var(--paper)}
.party-band .pb-occ{color:var(--gold)}
.party-band:hover .pb-ask{color:var(--gold)}
.party-band:hover .pb-go{color:#fff}
.party-band:focus-visible{outline:2px solid var(--gold);outline-offset:-4px}
@media (max-width:760px){.party-band .wrap{flex-direction:column;gap:10px}.party-band .pb-ill{width:120px}}
/* menu: lunch / dinner switch above the tabs */
.service{display:flex;justify-content:center;gap:0;margin:0 auto clamp(18px,2vw,26px);border:var(--rule);width:max-content;max-width:100%;outline:1px solid rgba(227,48,45,.45);outline-offset:4px}
.service button{appearance:none;border:0;background:transparent;cursor:pointer;padding:14px clamp(22px,3vw,40px) 12px;min-height:56px;
  font:700 clamp(26px,2.6vw,36px)/1 var(--display);text-transform:uppercase;color:var(--ink-2);letter-spacing:-.005em;display:flex;flex-direction:column;align-items:center;gap:6px}
.service button + button{border-left:var(--rule)}
.service button small{font:italic 400 14px/1.2 var(--serif);text-transform:none;letter-spacing:0;color:var(--ink-2)}
.service button[aria-pressed="true"]{color:var(--red);box-shadow:inset 0 -3px 0 var(--red)}
.service button[aria-pressed="true"] small{color:var(--red-ink)}
.svc[hidden]{display:none}
@media (max-width:760px){.service{width:100%}.service button{flex:1 1 50%;padding-inline:8px}.service button small{font-size:13px}}
/* the crossed fork and knife stays on phones, smaller */
@media (max-width:760px){.menu-sec .masthead .head-ill{display:block;width:46px}}
/* hero proof links to the Google reviews */
.proof-link{text-decoration:none;color:inherit;display:block}
.proof-link:hover strong,.proof-link:hover{color:var(--red-ink)}
.proof-link{text-decoration:underline;text-decoration-color:rgba(184,35,31,.45);text-underline-offset:4px;text-decoration-thickness:1px}
.proof-link strong{text-decoration:none}
/* reviews: a strip you move yourself, cards framed like the photo prints */
.rev-head{grid-template-columns:auto 1fr auto}
.reviews .score{text-decoration:none;color:inherit}
.reviews .score span em{display:block;font:italic 500 16px/1.3 var(--serif);color:var(--red-ink);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;margin-top:4px}
.reviews .score:hover em{color:var(--red)}
.rev-strip ul{align-items:stretch}
.rev-strip li{width:clamp(270px,28vw,380px);display:flex}
.rev-strip .card{margin:0;flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:24px;border:1px solid var(--red);outline:1px solid rgba(227,48,45,.45);outline-offset:4px;
  background:var(--paper);padding:clamp(22px,2.4vw,32px)}
.rev-strip .card p{margin:0;font:italic 400 clamp(21px,1.9vw,26px)/1.3 var(--serif);color:var(--ink)}
.rev-strip .card cite{font:600 11.5px/1.4 var(--sans);font-style:normal;letter-spacing:.18em;text-transform:uppercase;color:var(--red-ink)}
.rev-strip{cursor:grab}
@media (max-width:1080px){.rev-head{grid-template-columns:1fr auto}.rev-head .score{grid-column:1 / -1;grid-row:2}}
@media (max-width:760px){.rev-head{grid-template-columns:1fr}.rev-strip li{width:80vw}}
/* phone action bar: Book a table is pinned in the header, so the bar carries the other two */
@media (max-width:760px){.actionbar{grid-template-columns:1fr 1fr}}
/* lightbox: no count; the bar spacer + an Instagram tile at the end of the grid */
.lb-gap{flex:1}
.lb-more a{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;aspect-ratio:1;border:1px solid var(--red);outline:1px solid rgba(227,48,45,.45);outline-offset:3px;
  text-decoration:none;color:var(--red);text-align:center;padding:12px;margin:0}
.lb-more b{font:700 clamp(22px,2.2vw,30px)/.95 var(--display);text-transform:uppercase}
.lb-more span{font:italic 400 15px/1.2 var(--serif);color:var(--ink-2)}
.lb-more a:hover{background:var(--red);color:var(--paper)}.lb-more a:hover span{color:var(--paper)}
.party-band .wrap{flex-wrap:nowrap}
@media (max-width:760px){.party-band .wrap{flex-wrap:wrap}}
@media (min-width:761px){.party-band .pb-text{flex:0 0 auto;width:max-content;max-width:calc(100% - 220px)}}
.party-band .pb-text{display:grid;grid-template-columns:auto auto;align-items:baseline;justify-items:center;column-gap:18px;row-gap:4px}
.party-band .pb-occ{grid-column:1 / -1;flex-basis:auto}
@media (max-width:760px){.party-band .pb-text{grid-template-columns:1fr}}
@media (min-width:761px){.party-band .pb-ask{justify-self:end}.party-band .pb-go{justify-self:start}}

/* ---------- v13 ---------- */
/* paper stock: the plain page, with cold-press card stock (our own seamless texture) for the printed sections only,
   the menu and the reviews, so the surface changes every few screens: plain, navy, card stock, red */
.menu-sec,.reviews{background:var(--paper-card,#F5F1E8) url(assets/img/paper.webp?v=58) repeat;background-size:640px 640px;
  border-top:1px solid rgba(184,35,31,.35);border-bottom:1px solid rgba(184,35,31,.35)}
.rev-strip .card{background:transparent}
/* the ticker joins the navy + gold accents (ticker, party band, story, footer) */
.marquee{background:var(--navy);color:var(--paper);border-top:1px solid var(--gold);border-bottom:1px solid var(--gold)}
.marquee span::after{color:var(--gold)}
/* phone landscape hides the bottom bar, so the slim header carries Order pickup too */
@media (max-height:520px) and (orientation:landscape){.mast .ctas .btn.ghost{display:inline-flex}.mast .ctas{gap:8px}}
/* the phone menu lists six sections now */
.sheet li a{padding:11px 0;font-size:clamp(32px,8.6vw,50px)}
@media (max-height:520px) and (orientation:landscape){.sheet ul{grid-template-columns:1fr 1fr 1fr}.sheet li a{font-size:clamp(22px,7vh,32px);padding:8px 0}}

/* ---------- v15: card stock on the menu only; menu type a step stronger for reading over the paper ---------- */
.reviews{background:transparent;border-top:0;border-bottom:0}
.menu-sec .dish p{color:var(--ink);font-weight:500;font-size:15px;line-height:1.5}
.menu-sec .dish h4{font-weight:600;color:#141A2C}
.menu-sec .dish .p{color:#141A2C}
.menu-sec .masthead .mast-sub,.menu-sec .menu-note{color:var(--ink);font-weight:500}
.menu-sec .course h3 em{color:var(--ink)}

/* ---------- v16: reviews as navy plaques with gold, between BYOB and the Lola Room ---------- */
.reviews{padding-top:clamp(56px,6vw,96px);padding-bottom:clamp(56px,6vw,96px)}
.rev-strip .card{background:var(--navy);border-color:var(--gold);outline-color:rgba(201,164,92,.55);gap:18px;justify-content:flex-start}
.rev-strip .card p{color:var(--paper);flex:1}
.rev-strip .card cite{color:var(--gold)}
.rev-strip .stars{color:var(--gold);letter-spacing:.18em;font-size:15px;line-height:1}
.foot .credit a{text-decoration:underline;text-underline-offset:3px}

/* ---------- v17: navy spread (ticker, party band, Lola Room, story, footer), reviews back on paper ---------- */
/* the Lola Room in navy, like the room itself; it now follows the menu */
.lola{padding-top:clamp(52px,6vw,96px);padding-bottom:clamp(44px,5vw,80px)}
.lola .panel{background:var(--navy);justify-content:center}
.lola .panel .eyebrow{color:var(--gold);opacity:1}
.lola .panel .display{color:var(--paper)}
.lola .panel p{color:rgba(243,238,228,.9)}
/* reviews: paper cards, red double hairline, red stars */
.rev-strip .card{background:transparent;border-color:var(--red);outline-color:rgba(227,48,45,.45)}
.rev-strip .card p{color:var(--ink)}
.rev-strip .card cite{color:var(--red-ink)}
.rev-strip .stars{color:var(--red)}
/* lunch / dinner switch: easier to read */
.service button{color:var(--ink)}
.service button small{font:italic 500 16px/1.25 var(--serif);color:var(--ink)}
.service button[aria-pressed="true"] small{color:var(--red-ink)}
@media (max-width:760px){.service button small{font-size:14.5px}}
/* phone hero: the headline block centers over the centered fork; body copy stays left for reading */
@media (max-width:600px){
  .hero-copy .eyebrow,.hero h1,.hero-copy .lede{text-align:center;align-self:center}
}

/* ---------- v21: launch gate pass 1 (Web Interface Guidelines) ---------- */
/* anchors and keyboard focus never land under the sticky header or the phone bar */
html{scroll-padding-top:calc(var(--nav-h) + 20px)}
@media (max-width:760px){html{scroll-padding-bottom:96px}}
/* touch: no double-tap zoom delay, a deliberate tap highlight */
html{-webkit-tap-highlight-color:rgba(227,48,45,.18)}
a,button,input,select,textarea,label{touch-action:manipulation}
/* numbers line up; headings never leave a lonely word */
.dish .p,.hours td,.price,.score strong,.story .meta strong{font-variant-numeric:tabular-nums lining-nums}
h1,h2,h3,.lede{text-wrap:balance}
p,blockquote p{text-wrap:pretty}
/* 44px tap targets on touch screens */
@media (pointer:coarse){
  .foot li a,.foot .credit a,.visit .link,.visit .tel,.tel-big,.menu-note .link,.party-link,.reviews .score em{display:inline-flex;align-items:center;min-height:44px}
  .foot li{margin:0}
  .mast .brand{min-height:44px;display:flex;align-items:center}
}
/* pause control for the looping hero film and ticker */
.motion-toggle{position:absolute;right:8px;bottom:8px;z-index:3;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid rgba(184,35,31,.5);background:rgba(243,238,228,.86);color:var(--red-ink);cursor:pointer;opacity:.55;transition:opacity .26s var(--ease)}
.motion-toggle[hidden]{display:none}
.motion-toggle:hover,.motion-toggle:focus-visible{opacity:1}
.motion-toggle svg{width:16px;height:16px}
.motion-toggle .i-play,.motion-toggle[aria-pressed="true"] .i-pause{display:none}
.motion-toggle[aria-pressed="true"] .i-play{display:block}
.still-motion .marquee .track{animation-play-state:paused}
.marquee:hover .track{animation-play-state:paused}
/* pause control: a quiet glyph in the film's corner, never a box on the paper (44px hit area kept) */
.motion-toggle{border:0;background:transparent;color:var(--ink-2);opacity:.45;right:0;bottom:0}
.motion-toggle svg{width:14px;height:14px}
.motion-toggle:hover,.motion-toggle:focus-visible{opacity:.9;color:var(--red-ink)}

/* ---------- v26: one alignment rule, no page rails ---------- */
/* the fixed edge rails fought every full-bleed piece (navy bands, photo strips); the frames inside sections carry the printed look */
body::after{display:none!important}
/* the stamp sits on the fork photo, not out in the margin */
@media (min-width:601px){.hero .stamp{left:-14px}}
/* section titles and their short intros are centered; long reading text (story, BYOB, Lola Room, form) stays left */
#signatures .sec-head,#kitchen .sec-head,#reviews .sec-head,#visit .sec-head{grid-template-columns:1fr;justify-items:center;text-align:center;gap:14px}
#signatures .sec-head p,#kitchen .sec-head p,#visit .sec-head p{max-width:36em;padding-bottom:0}
#kitchen .kit-head p{grid-column:auto;grid-row:auto}
.rev-head .score{grid-column:auto!important;grid-row:auto!important;justify-content:center}
.rev-head .score span{text-align:left}
/* arrows live under each strip, centered: ‹ See more photos › */
.kit-foot{justify-content:center;gap:12px}
.kit-foot .arrow{display:inline-flex}
.rev-foot{margin-top:clamp(22px,2.6vw,34px)}
/* phone hero: the whole opening block centers over the fork */
@media (max-width:600px){
  .hero-copy p.sub,.hero-copy .party-link{text-align:center;align-self:center}
  .proof{text-align:center}
  .proof li{padding-left:0;padding-right:0}
}
/* desktop: REVIEWS and the 4.6 score share one centered row */
@media (min-width:761px){#reviews .rev-head{display:flex;justify-content:center;align-items:flex-end;gap:clamp(20px,3vw,44px);text-align:left}}

/* ---------- v29: Catherine's round 1 ---------- */
/* party band: the arrow follows "See our party rooms" */
.party-band .pb-go::after{content:none}
.party-band .pb-ask::after{content:" →";font-style:normal}
@media (min-width:761px){.party-band .pb-go{justify-self:end}.party-band .pb-ask{justify-self:start}}
.lola .panel p + p{margin-top:-6px}
/* catering: a printed tray list, same frame as the other cards */
.catering{padding-top:clamp(56px,6vw,96px);padding-bottom:clamp(48px,5vw,84px)}
#catering .sec-head{grid-template-columns:1fr;justify-items:center;text-align:center;gap:14px}
#catering .sec-head p{max-width:36em;padding-bottom:0}
.cat-card{border:var(--rule);outline:1px solid rgba(227,48,45,.45);outline-offset:5px;margin-inline:6px;padding:clamp(24px,3.4vw,48px)}
.cat-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,48px)}
.cat-col h3{display:flex;align-items:baseline;gap:12px;margin:0 0 12px;font:600 13px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--red-ink)}
.cat-col h3::after{content:"";flex:1;border-bottom:var(--rule);transform:translateY(-3px)}
.cat-col ul{list-style:none;margin:0;padding:0}
.cat-col li{padding:9px 0;border-bottom:1px dashed rgba(184,35,31,.28);font:500 18px/1.3 var(--serif);color:var(--ink)}
.cat-platter{margin:clamp(22px,2.6vw,32px) 0 0;padding-top:18px;border-top:var(--rule);text-align:center;font:italic 400 21px/1.3 var(--serif);color:var(--ink)}
.cat-platter b{display:block;font:600 11px/1.6 var(--sans);font-style:normal;letter-spacing:.18em;text-transform:uppercase;color:var(--red-ink);margin-bottom:4px}
.cat-foot{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:6px 18px;margin-top:clamp(24px,3vw,36px);text-align:center}
.cat-foot span{font:italic 400 19px/1.3 var(--serif);color:var(--ink-2)}
@media (max-width:1080px){.cat-cols{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.cat-cols{grid-template-columns:1fr}.cat-card{margin-inline:4px}.cat-foot{flex-direction:column;align-items:center}}

/* ---------- v30: party photos + NFL catering ---------- */
.party-prints{grid-column:1 / -1;border-top:var(--rule);background:var(--paper);padding:clamp(24px,3vw,40px) 0 clamp(18px,2vw,26px)}
.pp-title{margin:0 0 clamp(16px,2vw,24px);text-align:center;font:700 clamp(30px,3.4vw,48px)/.95 var(--display);text-transform:uppercase;color:var(--red);letter-spacing:-.005em}
.party-strip{--edge:clamp(18px,3vw,40px)}
.party-strip .print img,.print.film video{height:clamp(260px,26vw,380px);width:auto;max-width:calc(100vw - 2 * var(--gut) - 22px);object-fit:cover;display:block}
.print.film{margin:0;cursor:default}
.print.film .mat{position:relative}
.pp-foot{margin-top:clamp(14px,1.8vw,22px)}
/* NFL band: two framed prints either side of the line, under the tray list */
.nfl{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:clamp(18px,3vw,44px);margin:clamp(36px,4.4vw,60px) 6px 0}
.nfl-print{margin:0}
.nfl-print img{width:100%;height:auto;aspect-ratio:auto}
.nfl-text{text-align:center}
.nfl-text .display{font-size:clamp(34px,3.8vw,56px);margin-top:10px}
@media (max-width:760px){
  .nfl{grid-template-columns:1fr 1fr;margin-inline:4px}
  .nfl-text{grid-column:1 / -1;grid-row:1}
  .party-prints{padding-inline:0}
}
/* a one-column grid sizes to its widest child; the party strip must not stretch it */
.lola .grid > *{min-width:0}
@media (max-width:760px){.lola .grid{grid-template-columns:minmax(0,1fr)}}
.nfl-print img{aspect-ratio:3/4;width:100%;height:auto;object-fit:cover}
@media (min-width:761px){.nfl-print{max-width:340px;justify-self:center;width:100%}}

/* ---------- v31: one width for every strip; NFL as a caption, not a section ---------- */
/* every photo/review strip stops at the content edge, like the event photos inside their frame */
.kitchen .strip,.rev-strip{--edge:0px;width:min(calc(100% - 2 * var(--gut)), calc(var(--max) - 2 * var(--gut)));margin-inline:auto}
/* BYOB: equal side columns so its text column sits on the page center */
@media (min-width:1081px){.byob .wrap{grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr) minmax(0,.85fr)}}
/* catering card footer: the platter line + a small layered pair of NFL prints */
.cat-foot-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(18px,3vw,40px);margin-top:clamp(22px,2.6vw,32px);padding-top:18px;border-top:var(--rule)}
.cat-foot-row .cat-platter{margin:0;padding:0;border:0;text-align:left}
.nfl-pair{margin:0;display:flex;flex-direction:column;align-items:center;gap:10px}
.nfl-stack{position:relative;display:block;width:210px;height:200px}
.nfl-print{position:absolute;width:120px;margin:0}
.nfl-print img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}
.nfl-print.a{left:0;top:0;transform:rotate(-4deg)}
.nfl-print.b{right:0;top:22px;transform:rotate(3deg)}
.nfl-print .mat{padding:6px}
.nfl-pair figcaption{font:italic 400 16px/1.3 var(--serif);color:var(--ink);text-align:center;max-width:240px}
@media (max-width:560px){.cat-foot-row{grid-template-columns:1fr;justify-items:center}.cat-foot-row .cat-platter{text-align:center}}
#reviews.rule-top{border-top:var(--rule)}
.kitchen .strip,.rev-strip{--edge:6px}

/* ---------- v32 ---------- */
/* photo viewer: the page stays visible, dimmed; clicking it closes the viewer */
.lb{background:rgba(23,36,63,.8)!important;-webkit-backdrop-filter:none;backdrop-filter:none}
.lb::backdrop{background:transparent}
.lb-bar{border-bottom:1px solid rgba(243,238,228,.25)}
.lb-title{color:var(--paper)}
.lb .lb-x,.lb .lb-all{color:var(--paper);border-color:rgba(243,238,228,.7);background:transparent}
.lb .lb-x:hover,.lb .lb-all:hover{background:var(--paper);color:var(--navy)}
.lb-ig{color:var(--paper)}
.lb-one figcaption{color:var(--paper)}
.lb-grid li > span{color:var(--paper)}
.lb-stage img{cursor:default}
.lb-one,.lb-grid{cursor:zoom-out}
.lb-grid button,.lb-one .arrow{cursor:pointer}
/* catering: platter under Salads, the NFL pair under Entrees; no empty footer row */
.cat-col h3.cat-also{margin-top:clamp(22px,2.4vw,30px)}
.cat-col .nfl-pair{margin-top:clamp(22px,2.6vw,32px)}
.nfl-print{appearance:none;border:0;background:none;padding:0;cursor:zoom-in}
.nfl-print .mat{display:block;background:var(--paper)}
/* come by: every column centered like the section head */
.visit .col{text-align:center}
.visit .col h3{text-align:center}
.visit .ill{margin-inline:auto}
.visit .stack{align-items:center}
.hours th{text-align:left}
/* phones: every sideways strip shows ONE item at a time */
@media (max-width:760px){
  .strip{container-type:inline-size;scroll-snap-type:x mandatory}
  .strip ul{gap:12px}
  .strip li{flex:0 0 auto;width:calc(100cqw - 2 * var(--edge));scroll-snap-align:start;scroll-snap-stop:always}
  .kitchen .strip,.rev-strip{--edge:6px}
  .party-strip{--edge:8px}
  .strip .print,.strip .print .mat{display:block;width:100%}
  .strip .print img,.strip .print.film video{width:100%;max-width:none;height:auto;aspect-ratio:4/5;object-fit:cover}
  .rev-strip li{display:flex}
  .rev-strip .card{width:100%}
  /* BYOB: bottle, title and the three facts center like every section; the drop-cap paragraph stays left */
  .byob .ill{justify-self:center}
  .byob .eyebrow,.byob .display{text-align:center}
  .byob .facts li{text-align:center}
  .byob .facts li.has-ill{padding-right:0;padding-top:66px}
  .byob .facts li.has-ill img{left:50%;right:auto;top:8px;transform:translateX(-50%);width:56px}
}
.visit .col .ill{margin-left:auto;margin-right:auto}

/* ---------- v33 ---------- */
.byob .eyebrow b{margin-right:0}
/* footer: centered like the rest of the page */
.foot .cols{text-align:center}
.foot .legal{justify-content:center;text-align:center;gap:10px 28px}
/* the credit link keeps a 44px tap area without pushing its line away from the others */
.foot .credit a{display:inline;min-height:0;padding:12px 4px;margin:-12px -4px}
@media (max-width:760px){.foot .legal{flex-direction:column;align-items:center;gap:10px}}
@media (pointer:coarse){.foot li{min-height:44px;display:flex;align-items:center;justify-content:center}}

/* ---------- v34: catering set in the menu's type (no paper: the texture stays the menu's) ---------- */
.cat-col h3{gap:14px;margin-bottom:14px}
.cat-col li{padding:11px 0;font:600 20px/1.2 var(--serif);color:#141A2C}
.cat-col li .cat-desc{display:block;text-wrap:balance;margin-top:2px;font:500 15px/1.5 var(--sans);color:var(--ink)}
.nfl-pair figcaption{text-wrap:balance}

/* ---------- v39: every shape between a phone held upright and a wide desktop (Jean, iPhone landscape + iPad Pro) ----------
   Two-column layouts only work when both columns are full. Below 1181px wide, and on any landscape phone, BYOB and the
   story stack into ONE centered column like the phone; tablets held upright get the phone's centered hero too. */

/* BYOB: the ice bucket sits ABOVE "We bring", never under the words */
.byob .facts li.has-ill{padding-right:0}
.byob .facts li.has-ill img{position:static;display:block;transform:none;width:64px;height:auto;margin:0 auto 8px}
@media (min-width:1181px){
  .byob .facts li.has-ill{padding-right:84px}
  .byob .facts li.has-ill img{position:absolute;right:0;top:50%;width:70px;margin:0;transform:translateY(-50%)}
}
@media (max-width:1180px){
  .byob .wrap{display:flex;flex-direction:column;align-items:center;gap:clamp(14px,2.2vw,26px)}
  .byob .ill{width:clamp(120px,15vw,180px);max-width:none;margin:0;align-self:center}
  .byob .body{width:100%;max-width:44em}
  .byob .eyebrow,.byob .display{text-align:center}
  .byob .facts{width:100%;max-width:56em;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(16px,3vw,32px);border-top:0}
  .byob .facts li{text-align:center;border-top:var(--rule)}
  .byob .facts li.has-ill{padding-top:16px}
  /* story: photo, then the words, in one centered column */
  .story .wrap{display:flex;flex-direction:column;align-items:center;gap:clamp(24px,3.4vw,40px)}
  .story .wrap > *{width:100%;max-width:680px}
  .story figure{max-width:680px}
  .story figure img{max-height:none}
  /* posters: the side notes go under the plate (the three-across row is too tight here and clipped them) */
  .poster .row{grid-template-columns:1fr 1fr;grid-template-areas:'plate plate' 'ingr pull';gap:24px;margin-top:calc(var(--fs,12vw) * -.4)}
  .poster .plate{grid-area:plate;justify-self:center;width:min(78%,var(--pw,600px))}
  .poster .ingr{grid-area:ingr;justify-self:start;text-align:left;max-width:300px}
  .poster .pull{grid-area:pull;justify-self:end;text-align:right}
  /* a name set on two lines keeps its second line clear of the plate */
  .poster .name.two + .row{margin-top:calc(var(--fs,12vw) * -.12)}
}
@media (max-width:1180px) and (max-height:520px) and (orientation:landscape){
  .story figure img{max-height:62vh;width:auto;margin-inline:auto;display:block}
  .story .wrap > figure{width:fit-content;margin-inline:auto}
}
@media (max-width:760px) and (orientation:portrait){
  .byob .facts{grid-template-columns:1fr;max-width:none}
  .poster .row{margin-top:calc(var(--fsm,15vw) * -.3)}
}

/* hero, tablets held upright: the phone's opening, centered (headline, its answer, the fork, then the details) */
@media (min-width:601px) and (max-width:1180px) and (orientation:portrait){
  .hero .wrap{display:flex;flex-direction:column;align-items:center;gap:18px}
  .hero-copy{display:contents}
  .hero-copy > *{order:4}
  .hero-copy .eyebrow{order:1}
  .hero h1{order:2}
  .hero-copy .lede{order:2;margin-top:-6px}
  .hero-photo{order:3;width:auto;max-width:none;align-self:center}
  .hero-photo img,.hero-photo.fork img{height:min(44vh,560px);height:min(44svh,560px);width:auto;min-height:0;aspect-ratio:4/5}
  .hero-photo figcaption{max-width:calc(min(44vh,560px) * .8);max-width:calc(min(44svh,560px) * .8)}
  .hero-copy .eyebrow,.hero h1,.hero-copy .lede,.hero-copy p.sub,.hero-copy .party-link{text-align:center;align-self:center}
  .hero-copy p.sub{max-width:36em}
  .hero .proof{width:100%;max-width:640px;justify-content:center}
  .proof li{text-align:center;padding-right:18px}
  .hero .stamp{left:auto;right:-40px;bottom:auto;top:-4%}
}

/* reviews, phones: the 4.6 line centers under the heading */
@media (max-width:760px){
  #reviews .rev-head{justify-items:center;text-align:center}
  .reviews .score{justify-content:center;text-align:center}
  .rev-head .score span{text-align:center}
}
/* take some home, phones: three across, so no card sits alone on a row */
@media (max-width:760px){
  .takehome{grid-template-columns:repeat(3,minmax(0,1fr))}
  .takehome > *{padding:14px 8px}
  .takehome .th-head{grid-column:1 / -1;padding:20px}
  .takehome figure:last-child{grid-column:auto;border-top:0;border-left:var(--rule)}
  .takehome figure:nth-of-type(1){border-left:0}
  .takehome figure img{width:90%;max-height:110px}
  .takehome figcaption b{font-size:16px}
  .takehome figcaption{font-size:12px}
}
/* party band: the room list wraps into even lines */
.party-band .pb-occ{text-wrap:balance}

/* the headline comes first in the page (screen readers read it before the photo); wide layouts keep the fork on the left */
.hero .wrap > .hero-photo{order:-1}
@media (max-width:600px), (min-width:601px) and (max-width:1180px) and (orientation:portrait){.hero .wrap > .hero-photo{order:3}}
/* landscape phones (every width): fork beside the words, and the fork never taller than the screen */
@media (max-width:1180px) and (max-height:520px) and (orientation:landscape){
  /* sized to the SMALL viewport (svh): Safari's toolbar hiding on scroll must not grow the fork and shove the words */
  .hero .wrap{display:grid;grid-template-columns:auto minmax(0,560px);justify-content:center;gap:clamp(24px,4vw,56px);align-items:center}
  .hero-copy{display:flex;order:0}
  .hero .wrap > .hero-photo{order:-1;width:calc(min(100vh - 100px,360px) * .8);width:calc(min(100svh - 100px,360px) * .8);max-width:none}
  .hero-photo img,.hero-photo.fork img{width:100%;max-width:none;height:auto;min-height:0;aspect-ratio:4/5}
  .hero h1{font-size:clamp(44px,7.4vw,76px)}
  .hero .stamp{width:60px;left:-8px;right:auto;top:-6px;bottom:auto}
}

/* ---------- v42: Jean on his iPhone in landscape ---------- */
/* private events, below a wide desktop: the words, then the WHOLE dining room photo at its own 4:3 shape (side by side,
   the photo was cropped to a tall sliver: 34-63% of its width showed) */
@media (max-width:1180px){
  .lola .grid{grid-template-columns:minmax(0,1fr)}
  .lola .panel{align-items:center;text-align:center}
  .lola .panel p{max-width:38em;text-align:left}
  .lola .photo{min-height:0;aspect-ratio:1360/1020}
  .lola .photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
}
/* section heads above a full-width row center, like every other head: take some home, plan your party */
@media (max-width:1080px){
  .takehome .th-head{text-align:center}
  .takehome .th-head p{margin-inline:auto;max-width:36em}
}
@media (max-width:1080px){
  .lola form .intro{text-align:center;justify-self:center;max-width:40em}
  .lola form .intro .intro-quote{margin-inline:auto}
}

/* ---------- v43: Jean's calls (2026-10-08 night) ---------- */
/* phones: the bottom bar holds the two money actions (Book a table in red, Order online); Call moves up beside the menu */
.mast .ctas > .btn.call{display:none}
@media (max-width:760px){
  .mast .ctas > .btn{display:none}
  .mast .ctas > .btn.call{display:inline-flex}
}
@media (max-height:520px) and (orientation:landscape){
  .mast .ctas > .btn:not(.call){display:inline-flex}
  .mast .ctas > .btn.call{display:none}
}

/* BYOB facts: one drawing per fact, all in the same box so the three line up (2026-10-08, drawings 13 + 14 approved) */
.byob .facts .fact-ill{display:block;width:auto;height:76px;max-width:100px;object-fit:contain;margin:0 auto 10px}
.byob .facts li{text-align:center}
@media (min-width:1181px){
  .byob .facts li{display:grid;grid-template-columns:72px 1fr;grid-template-rows:auto auto;column-gap:16px;align-items:center;text-align:left}
  .byob .facts .fact-ill{grid-row:1 / 3;height:58px;max-width:72px;margin:0}
  .byob .facts li span{align-self:end}
}

/* ---------- v45: no client photo is ever cropped (Jean) ---------- */
/* private events, desktop: the whole dining room, matted on the navy panel beside the words */
@media (min-width:1181px){
  .lola .grid{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);background:var(--navy)}
  .lola .photo{min-height:0;display:flex;flex-direction:column;justify-content:center;gap:12px;padding:clamp(24px,2.6vw,40px) clamp(24px,2.6vw,40px) clamp(24px,2.6vw,40px) 0}
  .lola .photo img{position:static;width:100%;height:auto;aspect-ratio:1360/1020;object-fit:contain;outline:1px solid rgba(201,164,92,.55);outline-offset:6px}
  .lola .photo figcaption{position:static;align-self:flex-start;background:none;padding:0;margin-top:8px;color:var(--gold)}
}
/* phones: one photo per swipe, the WHOLE photo on its mat (it was cut to a 4:5 box) */
@media (max-width:760px){
  .strip .print img,.strip .print.film video{object-fit:contain;background:var(--paper)}
}
/* the NFL pair and the viewer's grid show whole photos too */
.nfl-print img{aspect-ratio:auto!important;object-fit:contain}
.nfl-stack{height:auto;min-height:200px}
.lb-grid img{object-fit:contain}

/* our story: the head across the top, then photo + timeline beside the story; nothing moves */
.story .story-head .eyebrow{margin-bottom:6px}
.story .story-head{text-align:center}
@media (min-width:1181px){
  .story .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"head head" "fig body" "meta body";gap:clamp(20px,2.4vw,32px) clamp(32px,4vw,64px);align-items:start}
  .story .story-head{grid-area:head;margin-bottom:clamp(4px,1vw,12px)}
  .story .wrap > figure{grid-area:fig;position:static}
  .story .story-body{grid-area:body}
  .story .meta{grid-area:meta;margin-top:0}
}
@media (max-width:1180px){.story .wrap > figure{order:-1}}
/* phones: the frame fits each photo (no empty mat around wide shots); items center on the strip's line */
@media (max-width:760px){
  .strip .print img,.strip .print.film video{aspect-ratio:auto;height:auto;max-height:70svh;object-fit:contain}
  .kitchen .strip ul,.party-strip ul{align-items:center}
}
@media (max-width:760px){
  .strip .print,.strip .print .mat{width:fit-content;max-width:100%;margin-inline:auto}
  .strip .print img,.strip .print.film video{width:auto;max-width:100%;max-height:min(calc(100cqw - 40px),62svh)}
  .strip li{display:flex;justify-content:center}
}
.story .story-head .eyebrow{display:block;text-align:center;justify-content:center}
.story .story-head .eyebrow{max-width:none;margin-inline:auto}

/* ---------- v47: Jean's calls ---------- */
/* header: Instagram + Facebook icons beside the buttons, a phone icon on Call */
.mast .social{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;color:var(--red-ink);text-decoration:none;border-radius:2px}
.mast .social svg{width:22px;height:22px}
.mast .social:hover{color:var(--red)}
.mast .btn.call svg{width:16px;height:16px;flex:none}
@media (max-width:760px){
  .mast .ctas{gap:2px;align-items:center}
  .mast .social{width:40px}
  .mast .social svg{width:21px;height:21px}
  .mast .btn.call{padding:0 12px;gap:7px;margin-left:4px}
}
@media (max-width:400px){.brand{width:112px}.mast .social{width:38px}.mast .btn.call{padding:0 10px}}
/* the party form's send button sits centered under the form */
.form-foot{justify-content:center;flex-direction:column;text-align:center}
.form-foot .form-msg{max-width:40em}
@media (max-width:389px){.mast .brand{width:100px}.mast .ctas{margin-left:6px}}
@media (min-width:1081px){.lola form .form-foot{grid-column:3 / -1}}
/* both money actions solid: Book a table in red, Order online in navy (Jean, 2026-10-08) */
.btn.order{background:var(--navy);border-color:var(--navy);color:var(--paper)}
.btn.order:hover{background:var(--navy-2);border-color:var(--navy-2);color:var(--paper)}
/* gate pass 1: the icon links keep a full 44px tap target wherever the header has room */
@media (min-width:375px) and (max-width:760px){.mast .social{width:44px}}
/* phones: a shorter photo band, so wide photos nearly fill it (less empty mat above and below); tall ones narrow, never crop */
@media (max-width:760px){.strip .print img,.strip .print.film video{max-height:min(calc((100cqw - 40px) * .82),56svh)}}
/* Safari < 16 has no container units: the phone strips fall back to viewport math (Codex r4) */
@supports not (width:1cqw){
  @media (max-width:760px){
    .strip li{width:calc(100vw - 2 * var(--gut) - 2 * var(--edge) - 12px)}
    .strip .print img,.strip .print.film video{max-height:min(calc((100vw - 2 * var(--gut) - 52px) * .82),56vh)}
  }
}
/* private events opens like the story: a gold first letter on the navy panel (Jean, 2026-10-08) */
.lola .panel .dc{background:var(--gold);color:var(--navy)}
.lola .panel p.dropcap{display:flow-root}

/* ---------- v56: foldable cover screens + the smallest phones ---------- */
/* under 360px (Galaxy S small, original iPhone SE, Z Fold covers) Call shows just its icon; the word stays for screen readers */
@media (max-width:359px){
  .mast .btn.call{width:44px;padding:0;margin-left:2px}
  .mast .btn.call .call-word{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .mast .social{width:36px}
  .mast .brand{width:92px}
}
/* under 300px (first Galaxy Fold covers): the social icons step aside (they are in the footer) */
@media (max-width:299px){.mast .social{display:none}.mast .brand{width:96px}}
/* the #16 stamp never pokes past a narrow screen */
@media (max-width:374px){.hero .stamp{right:0}}
/* under 340px (Galaxy Fold covers): poster notes stack centered under the plate instead of two skinny columns */
@media (max-width:339px){
  .poster .row{grid-template-columns:1fr;grid-template-areas:'plate' 'ingr' 'pull';gap:16px}
  .poster .ingr,.poster .pull{justify-self:center;text-align:center;max-width:none}
}
@media (max-width:339px){
  .hours td{white-space:nowrap;font-size:13.5px}
  .hours th{font-size:15px}
  .visit .col{padding-inline:14px}
  .foot .cols{grid-template-columns:1fr}
}