:root{--green:#1f4d1c;--green2:#3c7d2a;--gold:#e8b32b;--cream:#fbf5e4;--ink:#1d1a14;--chili:#c8321e}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{font-family:'Figtree',sans-serif;color:var(--ink);background:var(--cream)}
h1,h2,h3,.display{font-family:'DM Serif Display',serif;font-weight:400;letter-spacing:-.01em}
.navbar{background:var(--green);border-bottom:3px solid var(--gold)}
.navbar-brand{color:var(--cream)!important;font-family:'DM Serif Display',serif;font-size:1.4rem;display:flex;align-items:center;gap:.6rem}
.navbar-brand img{width:38px;height:38px;border-radius:50%}
.nav-link{color:#f3ecd2!important;font-weight:600}.nav-link:hover{color:var(--gold)!important}
.navbar-toggler{border-color:var(--gold)}.navbar-toggler-icon{filter:invert(1)}
.btn-order{background:var(--gold);color:var(--ink);font-weight:800;border:2px solid var(--ink);border-radius:999px;padding:.6rem 1.5rem;box-shadow:3px 3px 0 var(--ink)}
.btn-order:hover{background:#f5c94a;color:var(--ink);transform:translate(-1px,-1px)}
.btn-line{border:2px solid var(--cream);color:var(--cream);font-weight:700;border-radius:999px;padding:.6rem 1.5rem}
.btn-line:hover{background:var(--cream);color:var(--green)}
.hero{background:var(--green);color:var(--cream);padding:3.2rem 0 3.5rem;position:relative;overflow:hidden}
.hero h1{font-size:clamp(2.6rem,6vw,4.6rem);line-height:1.02}
.hero h1 em{color:var(--gold);font-style:italic}
.hero .lead{max-width:34rem;color:#e8e2c6}
.hero-photo{width:100%;aspect-ratio:1242/600;object-fit:cover;object-position:35% 50%;border-radius:8px;border:4px solid var(--gold);max-height:min(66vh,480px);transform:rotate(1.2deg)}
.stub{display:inline-block;background:var(--cream);color:var(--ink);border:2px dashed var(--green);padding:.4rem 1rem;border-radius:6px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.82rem;margin-bottom:1rem}
.stub b{color:var(--chili)}
section{padding:4.5rem 0}
.kicker{text-transform:uppercase;letter-spacing:.14em;font-weight:800;color:var(--green2);font-size:.8rem}
h2{font-size:clamp(2rem,4vw,3rem)}
.cat{background:#fff;border:2px solid var(--ink);border-radius:10px;overflow:hidden;height:100%;box-shadow:5px 5px 0 var(--green)}
.cat img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.cat div{padding:1rem 1.2rem}.cat h3{font-size:1.5rem;margin:0 0 .3rem}.cat p{margin:0;font-size:.95rem}
.feature{background:var(--gold)}
.feature img{width:100%;border:3px solid var(--ink);border-radius:8px;aspect-ratio:4/3;object-fit:cover}
.viet{font-style:italic;color:var(--green)}
.band{background:var(--green);color:var(--cream)}
.tile img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:8px;border:3px solid var(--gold);display:block}
.tile h3{font-size:1.4rem;margin:.8rem 0 .3rem;color:var(--gold)}.tile p{font-size:.95rem;color:#e8e2c6}
.coffee{background:#2a1c12 url(img/coffee.webp) center/cover;color:var(--cream)}
.coffee .box{background:rgba(42,28,18,.78);padding:2rem;border-left:5px solid var(--gold);max-width:34rem}
.catering img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:8px;border:3px solid var(--ink)}
.hours li{display:flex;justify-content:space-between;border-bottom:1px dotted #8a8466;padding:.35rem 0}
.contact{background:#fff}
.map{width:100%;height:340px;border:2px solid var(--ink);border-radius:8px}
footer{background:var(--ink);color:#cfc9b0;padding:2rem 0;font-size:.9rem}
footer a{color:var(--gold)}footer img{width:56px;border-radius:50%}
@media(max-width:767px){section{padding:3rem 0}.hero{padding:2rem 0}.hero-photo{transform:none;margin-top:1rem}}