:root{--cream:#f6efe2;--cream2:#ece2cf;--peat:#231a17;--berry:#7d2b41;--berry-d:#5e1e30;--mute:#5d5048;--line:rgba(35,26,23,.18);--display:'Zilla Slab',Georgia,serif;--body:'Karla',system-ui,sans-serif;--mono:'DM Mono',ui-monospace,monospace}
html{scroll-behavior:smooth;scroll-padding-top:120px}
body{font-family:var(--body);font-size:1.08rem;line-height:1.65;color:var(--peat);background:var(--cream);overflow-x:clip}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:1.05;letter-spacing:-.01em}
h1{font-size:clamp(2.5rem,5vw,4.3rem);text-transform:uppercase}
h2{font-size:clamp(2.2rem,4.6vw,3.6rem);text-transform:uppercase}
h3{font-size:1.5rem}
a{color:var(--berry)}
img{max-width:100%;height:auto;display:block}
section{padding:96px 0}
.eyebrow{font-family:var(--mono);font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--berry);margin-bottom:.9rem}
.btn{font-family:var(--mono);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;border-radius:0;padding:.85rem 1.7rem;font-weight:500}
.btn-berry{background:var(--berry);border:2px solid var(--berry);color:#fff}
.btn-berry:hover{background:var(--berry-d);border-color:var(--berry-d);color:#fff}
.btn-line{border:2px solid var(--peat);color:var(--peat);background:transparent}
.btn-line:hover{background:var(--peat);color:var(--cream)}
.on-dark{background:var(--peat);color:var(--cream)}
.on-dark .eyebrow{color:#e0a3b3}
.on-dark a{color:#f0c3cf}
.on-berry{background:var(--berry);color:#fff}
.on-berry .eyebrow{color:#f3c9d4}

/* signature: cranberries afloat */
.berries{height:34px;background:radial-gradient(circle at 17px 17px,var(--berry) 0 11px,transparent 12px) 0 0/46px 34px repeat-x;opacity:.9}
.berries.alt{background-image:radial-gradient(circle at 17px 17px,#e0a3b3 0 11px,transparent 12px);background-position:12px 0}
.berries.sm{height:20px;background-size:28px 20px;background-image:radial-gradient(circle at 10px 10px,var(--berry) 0 6px,transparent 7px)}

/* nav (c): centered logo above links */
.navbar{background:var(--cream);border-bottom:3px solid var(--berry);padding:.7rem 0}
.navbar .container{flex-direction:column}
.navbar-brand{margin:0 auto;display:flex;align-items:center;gap:.9rem}
.navbar-brand img{height:56px;width:auto}
.brand-name{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:1.5rem;color:var(--peat);letter-spacing:.02em;line-height:1}
.brand-name small{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.22em;font-weight:400;color:var(--berry);margin-top:.25rem}
.navbar-toggler{position:absolute;right:12px;top:18px;border:2px solid var(--peat);border-radius:0}
.navbar.navbar-expand-lg .navbar-collapse{justify-content:center;width:100%}
.navbar .nav-link{font-family:var(--mono);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--peat);padding:.7rem 1.1rem}
.navbar .nav-link:hover{color:var(--berry)}
.navbar .nav-cta{background:var(--berry);color:#fff;margin-left:.6rem}
.navbar .nav-cta:hover{background:var(--berry-d);color:#fff}

/* hero: photo mosaic */
.hero{padding:56px 0 72px;position:relative}
.hero h1{color:var(--berry);margin-bottom:1.2rem}
.hero .lead{font-size:1.25rem;max-width:30rem;color:var(--mute)}
.hero .hours-chip{display:inline-block;margin-top:1.6rem;font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;border-top:1px solid var(--line);padding-top:.9rem}
.mosaic{display:grid;grid-template-columns:1.3fr 1fr;grid-template-rows:1fr 1fr;gap:12px;aspect-ratio:1/1}
.mosaic img{width:100%;height:100%;object-fit:cover;border:4px solid var(--cream);outline:2px solid var(--berry)}
.mosaic .big{grid-row:1/3}

/* menu */
.menu-nav{gap:.5rem;flex-wrap:wrap;margin:2rem 0 2.5rem}
.menu-nav .nav-link{font-family:var(--mono);font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);border:1px solid rgba(246,239,226,.4);border-radius:0;padding:.6rem 1.1rem}
.menu-nav .nav-link.active{background:var(--berry);border-color:var(--berry);color:#fff}
.menu-note{font-size:.92rem;opacity:.75;max-width:52rem}
.dish{display:flex;gap:1rem;align-items:baseline;padding:1.05rem 0;border-bottom:1px dashed rgba(246,239,226,.28)}
.dish h4{font-size:1.25rem;margin:0}
.dish p{margin:.2rem 0 0;font-size:.95rem;opacity:.8}
.dish .name{flex:1}
.dish .price{font-family:var(--mono);font-weight:500;color:#f3c9d4;white-space:nowrap;font-size:1rem;text-align:right}
.menu-photo{border:4px solid var(--cream);outline:2px solid var(--berry);aspect-ratio:4/5;object-fit:cover;width:100%}

/* bites strip */
.strip{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 18px;-webkit-overflow-scrolling:touch}
.strip figure{margin:0;flex:0 0 min(78vw,340px);scroll-snap-align:start}
.strip img{width:100%;aspect-ratio:1/1;object-fit:cover;border:4px solid var(--cream);outline:2px solid var(--berry)}
.strip figcaption{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;margin-top:.7rem;color:var(--mute)}

/* vue */
.vue-img{width:100%;aspect-ratio:6/5;object-fit:cover;border:4px solid #fff;outline:2px solid rgba(255,255,255,.5)}
.pill{display:inline-block;font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;border:1px solid rgba(255,255,255,.55);padding:.4rem .8rem;margin:0 .4rem .5rem 0}
.arch{border-radius:999px 999px 0 0;aspect-ratio:3/4;object-fit:cover;width:100%;border:4px solid var(--cream);outline:2px solid var(--berry)}

/* about */
.about-img{width:100%;aspect-ratio:16/10;object-fit:cover;border:4px solid var(--cream);outline:2px solid var(--berry)}

/* visit */
.hours{width:100%;max-width:26rem;font-family:var(--mono);font-size:.92rem}
.hours td{padding:.55rem 0;border-bottom:1px solid var(--line)}
.hours td:last-child{text-align:right}
.map{border:4px solid var(--cream);outline:2px solid var(--berry);width:100%;height:100%;min-height:360px}

footer{background:var(--peat);color:var(--cream);padding:56px 0 40px}
footer a{color:#f0c3cf}
footer .chip{display:inline-block;background:var(--cream);padding:6px}
footer .chip img{height:60px;width:auto}
.social a{font-family:var(--mono);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;margin-right:1.2rem}

@media(max-width:991px){
 section{padding:64px 0}
 .navbar .nav-cta{margin:.5rem 0 0}
 .navbar .nav-link{text-align:center}
 .brand-name{font-size:1.2rem}
 .brand-name small{display:none}
 .navbar-brand img{height:46px}
 .navbar-brand{margin:0 auto 0 0;padding-right:56px}
}
@media(max-width:575px){.dish{flex-wrap:wrap}.mosaic{aspect-ratio:auto;grid-template-columns:1fr 1fr;grid-template-rows:auto auto}.mosaic .big{grid-column:1/3;grid-row:auto;aspect-ratio:1/1}.mosaic img:not(.big){aspect-ratio:1/1}}