:root{--bg:#f6efe9;--ink:#7a2218;--line:#7a2218;--on-dark:#f6efe9;--display:"Secular One",Heebo,Arial,sans-serif;--mono:Cousine,"Courier New",monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:4.5rem}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.7 Heebo,Arial,sans-serif}
img{max-width:100%;height:auto;display:block}
a{color:var(--ink)}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.1;margin:0 0 1rem;text-wrap:balance}
h2{font-size:clamp(2.4rem,5vw,3.75rem);letter-spacing:-.02em}
h3{font:400 .95rem/1.4 var(--mono);letter-spacing:.2em;margin:3.5rem 0 .5rem;padding-bottom:.9rem;border-bottom:1px solid var(--line)}
:focus-visible{outline:3px solid #0b57d0;outline-offset:3px}
.hero :focus-visible{outline-color:#ffd54a}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;top:-10rem;right:1rem;z-index:100;background:var(--ink);color:var(--bg);padding:.75rem 1.25rem}
.skip:focus{top:0}
.wrap{max-width:92rem;margin:0 auto;padding:clamp(4rem,9vw,8rem) clamp(1.25rem,3vw,3rem)}
main>.wrap+.wrap,main>.strip+.wrap,main>.dark+.wrap{border-top:1px solid var(--line)}
.label{display:block;font:400 1rem/1.4 var(--mono);letter-spacing:.3em;margin:0 0 1.75rem}
h2.label{font:400 1rem/1.4 var(--mono);letter-spacing:.3em}
.big{font:400 clamp(1.45rem,2.5vw,2.35rem)/1.32 var(--display);letter-spacing:-.01em;margin:0 0 1.6rem}
.note{font:400 .95rem/1.5 var(--mono);margin:1.25rem 0 0}

/* header: transparent over the hero, solid after scroll */
.top{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;gap:2rem;padding:1rem clamp(1.25rem,3vw,3rem);background:transparent;color:var(--on-dark);border-bottom:1px solid transparent;transition:background .3s,border-color .3s,color .3s}
.top.scrolled,.top.solid{background:var(--bg);color:var(--ink);border-bottom-color:var(--line)}
.top.solid{position:sticky;top:0}
.top .brand{display:block;line-height:0;order:3}
.top .brand img{height:2.6rem;width:auto}
.top nav{order:1}
.top ul{display:flex;gap:1.75rem;list-style:none;margin:0;padding:0}
.top nav a{color:inherit;text-decoration:none;font:400 1rem var(--mono);padding:.3rem 0;border-bottom:1px solid transparent}
.top nav a:hover{border-color:currentColor}
.top .btn.small{order:2;margin-inline-start:auto;color:inherit;border-color:currentColor}
.top .btn.small:hover{background:var(--ink);border-color:var(--ink);color:var(--bg)}

.btn{display:inline-block;background:transparent;color:var(--ink);text-decoration:none;font:400 .95rem/1.2 var(--mono);padding:.5rem 1rem;border:1px solid var(--ink);transition:background .2s,color .2s}
.btn:hover{background:var(--ink);color:var(--bg)}
.btn.small{padding:.4rem .85rem}
.cta{display:flex;flex-wrap:wrap;gap:.75rem;margin:2.5rem 0 0}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;color:var(--on-dark);background:#2a1512;overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(30,15,12,.55),rgba(30,15,12,.35) 45%,rgba(30,15,12,.7))}
.hero-in{position:relative;z-index:1;width:100%;display:grid;grid-template-columns:1fr auto;grid-template-rows:1fr auto auto auto;align-items:end;gap:.75rem 2rem;padding:6rem clamp(1.25rem,3vw,3rem) 3rem}
.hero h1{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;line-height:0}
.hero h1 img{width:min(58vw,25rem);height:auto}
.lead{grid-column:1;grid-row:2;font:400 clamp(1.6rem,3.2vw,2.6rem)/1.2 var(--display);margin:0;max-width:24ch}
.sub{grid-column:1;grid-row:3;margin:0;font-size:clamp(1rem,1.3vw,1.15rem);max-width:46ch}
.kicker{grid-column:1;grid-row:4;margin:.5rem 0 0;font:400 .95rem var(--mono);letter-spacing:.2em}
.hero .cta{grid-column:2;grid-row:2/5;margin:0;align-self:end}
.hero .btn{color:var(--on-dark);border-color:var(--on-dark)}
.hero .btn:hover{background:var(--on-dark);color:var(--ink)}

/* about */
#about .cols{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(2rem,7vw,8rem)}
#about .cols .btn{margin-top:.5rem}
#about figure{margin:clamp(3.5rem,7vw,6rem) 0 0}
#about figure img{width:100%;max-height:38rem;object-fit:cover}

/* owner note */
.owner{border-top:1px solid var(--line);padding:clamp(4rem,9vw,8rem) clamp(1.25rem,3vw,3rem)}
.owner-in{max-width:56rem;margin:0 auto}
.owner blockquote{margin:0}
.owner blockquote p{font:400 clamp(1.6rem,3vw,2.7rem)/1.3 var(--display);letter-spacing:-.01em;margin:0 0 1rem}
.owner .sign{font:400 1.05rem var(--mono);letter-spacing:.25em;margin:2rem 0 0}

.split{display:grid;gap:3rem clamp(2rem,6vw,7rem);align-items:start;grid-template-columns:1fr 1fr}
.split iframe{width:100%;height:28rem;border:1px solid var(--line)}
#contact .split-lead,#contact>div>p:not(.cta):not(.label){font:400 clamp(1.3rem,2vw,1.8rem)/1.35 var(--display)}
address{font-style:normal;font-size:1.1rem}
address p{margin:.45rem 0}
address strong{font:400 .9rem var(--mono);letter-spacing:.15em;margin-inline-end:.5rem}

/* hours */
.strip{display:flex;flex-wrap:wrap;gap:1.5rem 5rem;align-items:center;max-width:92rem;margin:0 auto;padding:3.5rem clamp(1.25rem,3vw,3rem);border-top:1px solid var(--line)}
.strip h2{margin:0;font-size:clamp(1.9rem,3.2vw,2.6rem)}
.strip dl{display:flex;flex-wrap:wrap;gap:1.25rem 4rem;margin:0}
.strip dt{font:400 .9rem var(--mono);letter-spacing:.15em}
.strip dd{margin:0;font:400 2.2rem/1.2 var(--display);direction:ltr;text-align:right}
.strip .note{flex-basis:100%;margin:0}

/* menu */
.menu-intro{font-size:1.15rem;max-width:52ch;margin:0}
.tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin:2.25rem 0 0}
.tabs button{font:400 .95rem var(--mono);padding:.55rem 1.1rem;border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.tabs button[aria-selected=true]{background:var(--ink);color:var(--bg)}
.dishes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(2rem,6vw,7rem)}
.dishes li{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:.2rem .6rem;padding:1.3rem 0}
.dishes b{font:400 1.45rem/1.2 var(--display)}
.dishes li::after{content:"";grid-column:2;grid-row:1;border-bottom:1px dotted var(--line);transform:translateY(-.3rem);opacity:.6}
.dishes i{grid-column:3;grid-row:1;font:400 1rem var(--mono);white-space:nowrap}
.dishes p{grid-column:1/-1;margin:0;font-size:1rem;line-height:1.55;max-width:46ch}
.menu-foot{margin:3rem 0 0;font:400 1rem var(--mono)}

/* gallery */
.dark{border-top:1px solid var(--line)}
.gallery-sub{font-size:1.15rem;margin:0}
.grid{list-style:none;margin:2.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(1rem,2.5vw,2.5rem);align-items:start}
.grid li{grid-column:span 4;overflow:hidden}
.grid li:nth-child(1){grid-column:1/6}
.grid li:nth-child(2){grid-column:7/13;margin-top:6rem}
.grid li:nth-child(3){grid-column:2/7}
.grid li:nth-child(4){grid-column:8/12}
.grid li:nth-child(5){grid-column:1/7}
.grid li:nth-child(6){grid-column:7/13;margin-top:4rem}
.grid li:nth-child(7){grid-column:1/5}
.grid li:nth-child(8){grid-column:5/9;margin-top:5rem}
.grid li:nth-child(9){grid-column:9/13}
.grid img{width:100%;transition:transform .6s}
.grid li:hover img{transform:scale(1.03)}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* footer */
.foot{background:var(--bg);color:var(--ink);border-top:1px solid var(--line);padding:4rem clamp(1.25rem,3vw,3rem) 6rem;display:flex;flex-wrap:wrap;align-items:baseline;gap:1rem 3rem;font:400 .95rem/1.6 var(--mono)}
.foot .brand{margin:0;flex:1 1 100%;line-height:0}
.foot .brand img{width:min(60vw,18rem);height:auto}
.foot p{margin:0}
.foot a{color:var(--ink)}
.foot .tag{letter-spacing:.2em}

/* inner pages */
.prose{max-width:48rem;margin-inline:0 auto;padding-inline:clamp(1.25rem,3vw,3rem)}
.prose h1{font-size:clamp(2.6rem,7vw,4.5rem)}
.prose h2{font-size:1.7rem;margin-top:3rem}

/* mobile sticky reservation */
.book-bar{display:none}

/* accessibility toolbar */
.a11y-btn{position:fixed;left:1rem;bottom:1rem;z-index:90;font:700 1rem Heebo,Arial,sans-serif;background:#0b3d91;color:#fff;border:2px solid #fff;border-radius:999px;padding:.7rem 1.2rem;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.a11y-panel{position:fixed;left:1rem;bottom:4.75rem;z-index:90;width:min(19rem,calc(100vw - 2rem));background:#fff;color:#111;border:2px solid #0b3d91;border-radius:.75rem;padding:1rem;box-shadow:0 10px 30px rgba(0,0,0,.35);font-family:Heebo,Arial,sans-serif}
.a11y-panel h2{font:700 1.2rem Heebo,Arial,sans-serif;letter-spacing:0;margin:0 0 .75rem}
.a11y-panel button{display:block;width:100%;text-align:start;font:500 1rem Heebo,Arial,sans-serif;background:#f1f3f6;color:#111;border:2px solid transparent;border-radius:.5rem;padding:.6rem .8rem;margin:.35rem 0;cursor:pointer}
.a11y-panel button[aria-pressed=true]{background:#0b3d91;color:#fff}
.a11y-panel button:focus-visible,.a11y-btn:focus-visible{outline:3px solid #ffb300;outline-offset:2px}
.a11y-panel a{display:block;margin-top:.6rem;color:#0b3d91}
html.a11y-f1{font-size:115%}
html.a11y-f2{font-size:130%}
html.a11y-gray{filter:grayscale(1)}
html.a11y-links a{text-decoration:underline!important;outline:2px solid currentColor;outline-offset:2px}
html.a11y-font *{font-family:Arial,Helvetica,sans-serif!important;letter-spacing:.02em!important}
html.a11y-noanim *,html.a11y-noanim *::before,html.a11y-noanim *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html.a11y-noanim .reveal{opacity:1;transform:none}
html.a11y-contrast{--bg:#000;--ink:#fff;--line:#fff;--on-dark:#fff}
html.a11y-contrast a,html.a11y-contrast .dishes i{color:#ffe600}
html.a11y-contrast .btn,html.a11y-contrast .hero .btn{background:#ffe600;color:#000;border-color:#ffe600}
html.a11y-contrast .hero::after{background:rgba(0,0,0,.82)}
html.a11y-contrast .top{background:#000}
html.a11y-contrast .top .brand img,html.a11y-contrast .foot .brand img{background:#fff;padding:.25rem}

/* videos */
#about .media{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.1fr);gap:clamp(1rem,2.5vw,2.5rem);margin-top:clamp(3.5rem,7vw,6rem);align-items:stretch}
#about .media figure{margin:0}
#about .media img{width:100%;height:100%;max-height:none;object-fit:cover}
video.loop{display:block;width:100%;height:100%;object-fit:cover;background:#2a1512}
#about .media video{aspect-ratio:9/16}
.grid li.vid video{aspect-ratio:7/10}
/* reels */
.reels{list-style:none;margin:2.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.75rem,2vw,1.75rem)}
.reels li{margin:0}
.reels video{aspect-ratio:9/16}
.reels span{display:block;margin-top:.6rem;font:400 .9rem var(--mono);letter-spacing:.15em}
@media (max-width:56rem){.reels{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:62%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.75rem}.reels li{scroll-snap-align:start}}

@media (max-width:56rem){#about .media{grid-template-columns:1fr 1fr}}

@media (max-width:56rem){
.top nav{display:none}
.top .btn.small{margin-inline-start:0}
.top .brand{margin-inline-start:auto}
.split,.dishes,#about .cols{grid-template-columns:1fr}
.hero-in{grid-template-columns:1fr;padding-bottom:6rem}
.hero .cta{grid-column:1;grid-row:5;margin-top:1rem}
.tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.5rem}
.tabs button{flex:none}
.grid{grid-template-columns:1fr 1fr}
.grid li,.grid li:nth-child(n){grid-column:auto;margin-top:0}
.book-bar{display:block;position:fixed;right:1rem;bottom:1rem;z-index:80;background:var(--ink);color:var(--bg);text-decoration:none;font:400 1rem var(--mono);padding:.8rem 1.3rem;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.foot{padding-bottom:7rem}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}.reveal{opacity:1;transform:none}}
/* social icons */
p.social{display:flex;flex-wrap:wrap;gap:.75rem;letter-spacing:0}
p.social a{display:inline-flex;align-items:center;justify-content:center;width:2.9rem;height:2.9rem;border:1px solid currentColor;font-size:1.3rem;text-decoration:none;transition:background .2s,color .2s}
p.social a:hover{background:var(--ink);color:var(--bg)}
html.a11y-font p.social i.fa-brands{font-family:"Font Awesome 6 Brands"!important}
html.a11y-font p.social i.fa-solid{font-family:"Font Awesome 6 Free"!important}
/* hero video (phones) */
.hero-vid{display:none}
@media (max-width:56rem) and (orientation:portrait){.hero .hero-vid{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}}

/* hero triptych (desktop) */
.hero-tri{display:none}
@media (min-width:56.01rem),(orientation:landscape){.hero .hero-tri{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;position:absolute;inset:0;background:#2a1512}.hero-tri video{width:100%;height:100%;object-fit:cover;display:block}}

/* about row v2 */
#about .media{grid-template-columns:repeat(3,minmax(0,1fr))}
#about .media video,#about .media img{aspect-ratio:2/3;height:auto}
@media (max-width:56rem){#about .media{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}}

/* mobile hero fix */
@media (max-width:56rem){
.hero h1{top:30%}
.hero h1 img{width:min(60vw,15rem)}
.hero .cta .btn.ghost{display:none}
.hero-in{padding-bottom:7rem}
}
@media (max-width:56rem) and (max-height:700px){.hero h1{top:24%}.hero h1 img{width:min(48vw,12rem)}}