:root{
  --parchment:#F2E9DC;
  --green:#24382F;
  --green-deep:#1B2B23;
  --oxblood:#743339;
  --espresso:#241E1A;
  --brass:#B08A55;          /* HAIRLINES ONLY on parchment — 2.64:1, never text */
  --brass-ink:#806237;      /* brass-coloured TEXT on light grounds — 4.69:1 parchment, 5.39:1 cream */
  --brass-lit:#C7A66A;      /* labels ON GREEN — 5.41:1, AA */
  --cream:#FFF9EF;

  --ink-muted:#5C534B;
  --rule:rgba(176,138,85,.45);
  --rule-strong:rgba(36,56,47,.22);
  --rule-green:rgba(199,166,106,.28);

  --display:'Baskervville',ui-serif,Georgia,serif;
  --body:'Work Sans',ui-sans-serif,system-ui,sans-serif;

  --gutter:clamp(1rem,5vw,4.5rem);
  --ease:cubic-bezier(.22,.61,.36,1);
  --dur:.72s;
  --bar:0px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--parchment);color:var(--espresso);
  font-family:var(--body);font-size:clamp(15px,1.02vw,17px);line-height:1.6;
  -webkit-font-smoothing:antialiased;padding-bottom:var(--bar);
  overflow-x:hidden;
}
img{display:block;max-width:100%}
h1,h2,h3{font-family:var(--display);font-weight:400;margin:0;letter-spacing:-.015em}
a{color:inherit}

.skip{position:absolute;left:-9999px}
.skip:focus{left:var(--gutter);top:.5rem;z-index:99;background:var(--cream);
  color:var(--espresso);padding:.7rem 1.1rem;border-radius:2px}

.eyebrow,.label,.pill,.ledger dt,.nav a,.sec-index,.course-note,.hours th{
  font-family:var(--body);text-transform:uppercase;letter-spacing:.14em;
  font-size:.688rem;font-weight:500;
}

/* ---------------- nav ---------------- */
.nav{
  background:var(--green);color:var(--cream);
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.05rem var(--gutter);position:sticky;top:0;z-index:70;
  border-bottom:1px solid var(--rule-green);
}
.wordmark{font-family:var(--display);font-size:clamp(1.15rem,2.4vw,1.32rem);
  letter-spacing:.02em;color:var(--cream);white-space:nowrap;text-decoration:none}
.wordmark em{font-style:italic;color:var(--brass-lit)}
.nav ul{display:flex;gap:1.9rem;list-style:none;margin:0;padding:0}
.nav a{color:var(--cream);text-decoration:none;position:relative;padding-block:.35rem;opacity:.85;
  transition:opacity .25s var(--ease)}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--brass-lit);
  transform:scaleX(0);transform-origin:left;transition:transform .42s var(--ease)}
.nav a:hover,.nav a:focus-visible{opacity:1}
.nav a:hover::after,.nav a:focus-visible::after{transform:scaleX(1)}
/* the wordmark is an <a> but must not inherit the uppercase label register */
.nav a.wordmark{
  font-family:var(--display);text-transform:none;letter-spacing:.02em;
  font-size:clamp(1.15rem,2.4vw,1.32rem);font-weight:400;opacity:1;padding-block:0;
}
.nav a.wordmark::after{display:none}
.nav-meta{font-size:.688rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-lit);white-space:nowrap}

.burger{display:none;background:none;border:1px solid var(--rule-green);border-radius:100px;
  color:var(--cream);padding:.55rem 1rem;font:inherit;font-size:.688rem;text-transform:uppercase;
  letter-spacing:.14em;cursor:pointer;align-items:center;gap:.5rem}
.burger:hover{border-color:var(--brass-lit)}
.burger .bars{display:inline-flex;flex-direction:column;gap:3px;width:14px}
.burger .bars i{height:1px;background:var(--brass-lit);transition:transform .3s var(--ease),opacity .3s var(--ease)}
.burger[aria-expanded="true"] .bars i:nth-child(1){transform:translateY(4px) rotate(45deg)}
.burger[aria-expanded="true"] .bars i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] .bars i:nth-child(3){transform:translateY(-4px) rotate(-45deg)}

.drawer{
  position:fixed;inset:0;z-index:60;background:var(--green-deep);color:var(--cream);
  padding:calc(var(--gutter) + 4.5rem) var(--gutter) var(--gutter);
  display:flex;flex-direction:column;justify-content:space-between;
  transform:translateY(-100%);transition:transform .55s var(--ease);visibility:hidden;
}
.drawer[data-open="true"]{transform:none;visibility:visible}
.drawer ul{list-style:none;margin:0;padding:0}
.drawer li{border-bottom:1px solid var(--rule-green)}
.drawer li a{display:block;padding:1.15rem 0;font-family:var(--display);font-size:2rem;
  text-decoration:none;color:var(--cream)}
.drawer li a:hover{color:var(--brass-lit)}
.drawer-foot{color:var(--brass-lit);font-size:.75rem;text-transform:uppercase;letter-spacing:.14em;line-height:2}

@media (max-width:900px){
  .nav ul,.nav-meta{display:none}
  .burger{display:inline-flex}
}

/* ---------------- hero : artist-hero ---------------- */
.hero{
  display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gutter);align-items:center;
  padding:clamp(2.5rem,7vw,6rem) var(--gutter) clamp(3rem,6vw,5rem);
  min-height:clamp(540px,84vh,900px);
}
.hero-copy{grid-column:1/span 6;display:flex;flex-direction:column}
.hero-media{grid-column:7/span 6;margin:0}
.eyebrow{display:flex;align-items:center;gap:.75rem;color:var(--ink-muted);margin-bottom:2rem}
.eyebrow::before{content:"";width:2.25rem;height:1px;background:var(--brass);flex:none}
.hero h1{font-size:clamp(2.7rem,6.1vw,5.4rem);line-height:1.02;max-width:14ch;margin-bottom:1.75rem}
.hero h1 em{font-style:italic;color:var(--oxblood)}
.lead{max-width:46ch;font-size:clamp(1rem,1.18vw,1.16rem);line-height:1.72;
  color:var(--ink-muted);margin:0 0 2.5rem}

.actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:3rem}
.pill{display:inline-flex;align-items:center;gap:.7rem;padding:.92rem 1.65rem;border-radius:100px;
  text-decoration:none;border:1px solid transparent;cursor:pointer;position:relative;
  overflow:hidden;isolation:isolate;font-family:var(--body);
  transition:color .4s var(--ease),border-color .4s var(--ease)}
.pill .arrow{transition:transform .42s var(--ease)}
.pill:hover .arrow,.pill:focus-visible .arrow{transform:translateX(.3rem)}
.pill--solid{background:var(--oxblood);color:var(--cream)}
.pill--solid::before,.pill--line::before{content:"";position:absolute;inset:0;z-index:-1;
  background:var(--green);transform:translateY(101%);transition:transform .48s var(--ease)}
.pill--solid:hover::before,.pill--solid:focus-visible::before,
.pill--line:hover::before,.pill--line:focus-visible::before{transform:translateY(0)}
.pill--line{border-color:var(--rule-strong);color:var(--espresso)}
.pill--line:hover,.pill--line:focus-visible{color:var(--cream);border-color:var(--green)}

.ledger{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;
  border-top:1px solid var(--rule);padding-top:1.5rem;margin:0}
.ledger dt{color:var(--ink-muted);margin-bottom:.45rem}
.ledger dd{margin:0;font-size:.95rem;line-height:1.45}
.ledger a{color:var(--espresso);text-decoration:none;border-bottom:1px solid var(--rule);display:inline-block;padding:.2rem 0;min-height:24px}
.ledger a:hover{border-color:var(--oxblood);color:var(--oxblood)}
.state{display:inline-flex;align-items:center;gap:.4rem;font-size:.7rem;text-transform:uppercase;
  letter-spacing:.12em;color:var(--oxblood);margin-top:.3rem}
.state i{width:5px;height:5px;border-radius:100px;background:var(--oxblood);flex:none}
.state.open{color:#3F5A48}.state.open i{background:#3F5A48}

.plate{position:relative;border-radius:2px;overflow:hidden;aspect-ratio:4/5;background:var(--green)}
.plate img{width:100%;height:100%;object-fit:cover}
.plate figcaption{position:absolute;left:0;right:0;bottom:0;padding:2.5rem 1.5rem 1.15rem;
  background:linear-gradient(to top,rgba(27,43,35,.9),transparent);color:var(--cream);
  font-size:.688rem;text-transform:uppercase;letter-spacing:.14em}

@media (max-width:860px){
  .hero{grid-template-columns:1fr;min-height:0;gap:2.25rem;padding-top:2rem}
  .hero-copy,.hero-media{grid-column:1/-1}
  .hero-media{order:-1}
  .plate{aspect-ratio:3/2}
  .ledger{grid-template-columns:1fr;gap:1.25rem}
  .actions{margin-bottom:2.25rem}
}

/* ---------------- sections ---------------- */
.section{padding:clamp(3rem,7vw,6.5rem) var(--gutter)}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;
  border-bottom:1px solid var(--rule);padding-bottom:1.25rem;margin-bottom:3rem}
.sec-head h2{font-size:clamp(1.85rem,3.4vw,2.9rem)}
.sec-index{color:var(--brass-ink)}

/* ---------------- menu ---------------- */
.menu{background:var(--green);color:var(--cream)}
.menu .sec-head{border-color:var(--rule-green)}
.menu .sec-head h2{color:var(--cream)}
.menu .sec-index{color:var(--brass-lit)}
.menu-note{color:rgba(255,249,239,.72);max-width:52ch;font-size:.93rem;margin:0 0 3rem}
.menu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1.5rem,4vw,4rem)}
@media (max-width:820px){.menu-grid{grid-template-columns:1fr}}
.course{margin-bottom:3rem}
.course h3{font-size:1.45rem;color:var(--cream);margin-bottom:.35rem}
.course-note{color:var(--brass-lit);margin:0 0 1.35rem}
.course ul{list-style:none;margin:0;padding:0}
.course li{display:grid;grid-template-columns:1fr auto;gap:.35rem 1rem;align-items:baseline;
  padding:.72rem .7rem .72rem 0;border-bottom:1px solid var(--rule-green);
  transition:background .38s var(--ease),padding .38s var(--ease)}
.course li:hover{background:linear-gradient(to right,rgba(116,51,57,.55),rgba(116,51,57,0));padding-left:.7rem}
.dish{font-weight:500;color:var(--cream)}
.v{font-size:.625rem;letter-spacing:.1em;color:var(--brass-lit);
  border:1px solid rgba(199,166,106,.55);border-radius:2px;padding:.1rem .3rem;
  margin-left:.4rem;vertical-align:.12em;white-space:nowrap}
.desc{grid-column:1/2;color:rgba(255,249,239,.66);font-size:.875rem;line-height:1.5}
.price{font-variant-numeric:tabular-nums;font-weight:500;color:var(--cream);
  grid-row:1;grid-column:2;white-space:nowrap}
.allergen{margin-top:1rem;padding:1.5rem;border:1px solid var(--rule-green);border-radius:2px;
  color:rgba(255,249,239,.84);font-size:.875rem;max-width:70ch}

/* ---------------- gallery + lightbox ---------------- */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:.85rem}
@media (max-width:820px){.gallery{grid-template-columns:repeat(2,1fr)}}
.gallery button{
  padding:0;border:0;background:var(--green);border-radius:2px;overflow:hidden;
  aspect-ratio:1;cursor:pointer;position:relative;display:block;width:100%;
}
.gallery img{width:100%;height:100%;object-fit:cover;
  transition:transform .8s var(--ease),filter .5s var(--ease);filter:saturate(.96)}
.gallery button:hover img,.gallery button:focus-visible img{transform:scale(1.045);filter:saturate(1.06)}
.gallery button::after{
  content:"";position:absolute;inset:0;background:rgba(36,56,47,.55);
  opacity:0;transition:opacity .4s var(--ease);
}
.gallery button:hover::after,.gallery button:focus-visible::after{opacity:1}
.gallery .zoom{
  position:absolute;inset:0;display:grid;place-items:center;z-index:2;
  color:var(--cream);font-size:.688rem;text-transform:uppercase;letter-spacing:.14em;
  opacity:0;transition:opacity .4s var(--ease);
}
.gallery button:hover .zoom,.gallery button:focus-visible .zoom{opacity:1}

.lb{position:fixed;inset:0;z-index:80;background:rgba(27,43,35,.97);
  display:none;align-items:center;justify-content:center;padding:clamp(1rem,4vw,3rem)}
.lb[data-open="true"]{display:flex}
.lb figure{margin:0;max-width:min(1100px,100%);max-height:100%;display:flex;
  flex-direction:column;gap:1rem;align-items:center}
.lb img{max-height:76vh;width:auto;max-width:100%;border-radius:2px;object-fit:contain}
.lb figcaption{color:var(--cream);font-size:.75rem;text-transform:uppercase;
  letter-spacing:.14em;text-align:center}
.lb figcaption span{color:var(--brass-lit);display:block;margin-top:.4rem}
.lb-btn{position:absolute;background:rgba(255,249,239,.08);border:1px solid var(--rule-green);
  color:var(--cream);width:48px;height:48px;border-radius:100px;cursor:pointer;
  font-size:1.1rem;line-height:1;display:grid;place-items:center;
  transition:background .3s var(--ease),border-color .3s var(--ease)}
.lb-btn:hover{background:var(--oxblood);border-color:var(--oxblood)}
.lb-close{top:clamp(1rem,3vw,2rem);right:clamp(1rem,3vw,2rem)}
.lb-prev{left:clamp(.5rem,2vw,2rem);top:50%;transform:translateY(-50%)}
.lb-next{right:clamp(.5rem,2vw,2rem);top:50%;transform:translateY(-50%)}
@media (max-width:600px){
  .lb-prev{left:1rem;top:auto;bottom:1.25rem;transform:none}
  .lb-next{right:1rem;top:auto;bottom:1.25rem;transform:none}
  .lb img{max-height:62vh}
}

/* ---------------- visit ---------------- */
.visit-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
@media (max-width:820px){.visit-grid{grid-template-columns:1fr}}
.hours{width:100%;border-collapse:collapse;margin-bottom:2rem}
.hours th{text-align:left;color:var(--ink-muted);font-weight:500;padding:.65rem 0;
  border-bottom:1px solid var(--rule);width:50%}
.hours td{text-align:right;padding:.65rem 0;border-bottom:1px solid var(--rule);
  font-variant-numeric:tabular-nums}
.hours tr[data-today] th,.hours tr[data-today] td{color:var(--oxblood);font-weight:500}
.find p{margin:0 0 .5rem}
.card{background:var(--cream);border-radius:2px;padding:clamp(1.5rem,3vw,2.25rem);
  border:1px solid var(--rule)}
.field{margin-bottom:1.15rem}
.field label{display:block;font-size:.688rem;text-transform:uppercase;letter-spacing:.14em;
  color:var(--ink-muted);margin-bottom:.5rem;font-weight:500}
.field input,.field textarea{
  width:100%;font:inherit;font-size:.95rem;color:var(--espresso);background:transparent;
  border:1px solid var(--rule-strong);border-radius:2px;padding:.8rem .9rem;
  transition:border-color .3s var(--ease)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--oxblood)}
.field textarea{min-height:120px;resize:vertical}
.form-note{font-size:.78rem;color:var(--ink-muted);margin:.25rem 0 1.25rem}

/* ---------------- sticky mobile action row ---------------- */
.actionbar{
  position:fixed;left:0;right:0;bottom:0;z-index:50;display:none;
  background:var(--green-deep);border-top:1px solid var(--rule-green);
  padding-bottom:env(safe-area-inset-bottom);
}
.actionbar ul{display:grid;grid-template-columns:repeat(3,1fr);list-style:none;margin:0;padding:0}
.actionbar a{display:block;text-align:center;padding:.95rem .4rem;color:var(--cream);
  text-decoration:none;font-size:.688rem;text-transform:uppercase;letter-spacing:.12em}
.actionbar li+li{border-left:1px solid var(--rule-green)}
.actionbar a:active{background:var(--oxblood)}
@media (max-width:860px){
  .actionbar{display:block}
  body{--bar:52px}
}

/* ---------------- footer ---------------- */
footer{background:var(--green);color:rgba(255,249,239,.78);
  padding:clamp(2.5rem,5vw,4rem) var(--gutter);font-size:.85rem}
footer .wordmark{font-size:1.6rem;display:inline-block;margin-bottom:1rem}
footer a{color:var(--brass-lit)}
.foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:2rem;margin-bottom:2rem}
.foot-grid h3{font-size:.688rem;text-transform:uppercase;letter-spacing:.14em;
  font-family:var(--body);font-weight:500;color:var(--brass-lit);margin-bottom:.75rem}
.foot-grid ul{list-style:none;margin:0;padding:0}
.foot-grid li a{display:inline-block;padding:.35rem 0;min-height:24px}
.foot-grid a{text-decoration:none;color:rgba(255,249,239,.78)}
.foot-grid a:hover{color:var(--brass-lit)}
.disclosure{margin-top:1rem;padding-top:1.5rem;border-top:1px solid var(--rule-green);
  color:rgba(255,249,239,.62);max-width:78ch;font-size:.8rem}

.rv{opacity:0;transform:translateY(14px);
  transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  .rv{opacity:1;transform:none}
}
:focus-visible{outline:2px solid var(--oxblood);outline-offset:3px}
.menu :focus-visible,.drawer :focus-visible,.lb :focus-visible,.actionbar :focus-visible{outline-color:var(--brass-lit)}

/* discreet route back to the SR7 case study, in the footer disclosure */
.case-link{display:inline-block;margin-top:.6rem;color:var(--brass-lit);
  text-decoration:none;border-bottom:1px solid rgba(199,166,106,.4);padding-bottom:1px}
.case-link:hover{color:var(--cream);border-color:var(--cream)}
#form-status a{color:var(--oxblood)}
