:root { --black:#090a0b; --coal:#111315; --panel:#181a1c; --line:#92703c55; --gold:#d0a55d; --gold-light:#f0d08c; --cream:#f2eadb; --muted:#afa595; font-family:"DM Sans",sans-serif; color:var(--cream); background:var(--black); }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html { background:var(--black); }
body { margin:0; min-width:300px; background:var(--black); }
.menu-header { min-height:94px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:8px clamp(20px,5vw,76px); border-bottom:1px solid var(--line); background:#090a0bf2; position:sticky; top:0; z-index:5; backdrop-filter:blur(14px); }
.brand { width:190px; height:76px; display:block; overflow:hidden; text-decoration:none; }
.brand img { width:100%; height:100%; display:block; object-fit:contain; }
.header-note,.eyebrow { color:var(--gold); font-size:10px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
.header-note { display:flex; align-items:center; gap:10px; }.header-note i { width:30px; height:1px; background:var(--gold); }
main { min-height:75vh; }
.menu-hero { min-height:430px; display:grid; align-items:center; padding:60px clamp(20px,8vw,130px) 70px; border-bottom:1px solid var(--line); background:radial-gradient(circle at 18% 45%,#b7873d20 0,transparent 34%),radial-gradient(circle at 88% 25%,#6f4b1922 0,transparent 30%),linear-gradient(135deg,#090a0b,#121416); position:relative; overflow:hidden; }
.menu-hero::after { content:""; position:absolute; inset:0; opacity:.1; pointer-events:none; background-image:linear-gradient(90deg,transparent 49.8%,#d0a55d 50%,transparent 50.2%); background-size:150px 100%; }
.hero-copy { width:min(720px,100%); position:relative; z-index:1; padding-left:clamp(20px,3vw,45px); border-left:1px solid var(--line); }
.menu-hero h1 { margin:15px 0 22px; color:var(--cream); font:600 clamp(55px,7vw,105px)/.82 "Fraunces",serif; letter-spacing:-.045em; text-transform:uppercase; }
.menu-hero h1 em { display:block; color:var(--gold); font-weight:600; text-transform:none; }
.menu-hero p { max-width:470px; margin:0; color:var(--muted); font-size:16px; line-height:1.75; }
.menu-controls { padding:25px clamp(20px,5vw,76px) 0; border-bottom:1px solid #ffffff08; background:#0d0f10f2; position:sticky; top:94px; z-index:4; backdrop-filter:blur(14px); }
.search { height:52px; display:flex; align-items:center; gap:10px; padding:0 16px; border:1px solid var(--line); border-radius:4px; background:var(--panel); }
.search > span { color:var(--gold); font-size:25px; line-height:1; transform:rotate(-15deg); }
.search input { min-width:0; flex:1; border:0; outline:0; background:transparent; color:var(--cream); font:500 15px "DM Sans",sans-serif; }
.search input::placeholder { color:#776f64; }
.category-list { display:flex; gap:8px; padding:15px 0 18px; overflow-x:auto; scrollbar-width:none; }
.category-list::-webkit-scrollbar { display:none; }
.category-list button { flex:0 0 auto; min-height:38px; border:1px solid #68563b; border-radius:3px; padding:0 16px; color:#bfb4a4; background:transparent; font:700 10px "DM Sans",sans-serif; letter-spacing:.07em; text-transform:uppercase; cursor:pointer; }
.category-list button.active { border-color:var(--gold); color:var(--black); background:var(--gold); }
.menu-content { padding:48px clamp(20px,5vw,76px) 100px; background:linear-gradient(180deg,#111315,#090a0b); }
.menu-group + .menu-group { margin-top:72px; }
.group-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:23px; padding-bottom:15px; border-bottom:1px solid var(--line); }
.group-heading h2 { margin:0; color:var(--cream); font:600 clamp(31px,3vw,46px) "Fraunces",serif; letter-spacing:-.02em; }
.group-heading h2::before { content:""; width:36px; height:2px; display:inline-block; margin:0 14px 9px 0; background:var(--gold); }
.group-heading span { color:var(--gold); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.12em; }
.menu-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.menu-item { min-width:0; display:grid; grid-template-columns:142px minmax(0,1fr); min-height:168px; overflow:hidden; border:1px solid #4e402c; border-radius:5px; background:linear-gradient(145deg,#1c1e20,#141617); box-shadow:0 15px 40px #0004; transition:transform .2s,border-color .2s; }
.menu-item:hover { transform:translateY(-3px); border-color:var(--gold); }
.menu-item-media { min-height:168px; border-right:1px solid #4e402c; background:#242321; overflow:hidden; }
.menu-item-media img { width:100%; height:100%; display:block; object-fit:cover; }
.menu-item-media.no-image { display:grid; place-items:center; color:var(--gold); background:#191b1d; font:700 42px "Fraunces",serif; }
.menu-item-copy { min-width:0; display:flex; flex-direction:column; padding:18px 17px; }
.menu-item-copy > span { color:var(--gold); font-size:8px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.menu-item h3 { margin:6px 0 5px; color:var(--cream); font:600 21px/1.1 "Fraunces",serif; }
.menu-item p { margin:0 0 13px; color:#999083; font-size:11px; line-height:1.5; }
.menu-item strong { margin-top:auto; color:var(--gold-light); font-size:16px; }
.menu-status,.empty-menu { min-height:300px; display:grid; place-content:center; justify-items:center; gap:12px; padding:50px 20px; color:var(--muted); background:var(--black); text-align:center; }
.menu-status strong,.empty-menu strong { color:var(--cream); font:600 25px "Fraunces",serif; }
.menu-status button { border:1px solid var(--gold); border-radius:3px; padding:11px 17px; color:var(--black); background:var(--gold); font:700 11px "DM Sans",sans-serif; cursor:pointer; }
.empty-menu span { font-size:13px; }
footer { min-height:90px; display:flex; align-items:center; justify-content:flex-start; padding:10px clamp(20px,5vw,76px); border-top:1px solid var(--line); background:#070809; }
footer img { width:120px; height:68px; display:block; margin-left:35px; object-fit:contain; object-position:center; }
footer p { max-width:430px; margin:0 0 0 auto; color:#a39a8d; font-size:11px; line-height:1.55; letter-spacing:.04em; text-align:right; }
.qr-body { min-height:100vh; display:grid; place-items:center; padding:30px; background:radial-gradient(circle at 50% 20%,#6e4c202e,transparent 32%),#090a0b; }
.qr-card { width:min(560px,100%); padding:36px 42px 42px; border:1px solid var(--line); border-radius:7px; color:var(--cream); background:#111315; text-align:center; box-shadow:0 24px 90px #000b; }
.qr-brand { width:280px; height:190px; display:block; margin:0 auto 10px; }.qr-brand img { width:100%; height:100%; object-fit:contain; }
.qr-card h1 { margin:0 0 8px; color:var(--gold-light); font:600 38px "Fraunces",serif; }.qr-card > p { margin:0 auto 25px; color:var(--muted); line-height:1.6; }
.qr-code { width:min(320px,90%); aspect-ratio:1; display:block; margin:0 auto 22px; padding:12px; border:7px solid var(--gold); border-radius:4px; background:white; }
.qr-address { display:block; color:var(--gold-light); font-size:12px; font-weight:700; letter-spacing:.04em; }
.qr-actions { display:flex; justify-content:center; gap:10px; margin-top:26px; }.qr-actions a,.qr-actions button { border:1px solid #6d5b3e; border-radius:3px; padding:11px 15px; color:var(--cream); background:#1a1c1e; text-decoration:none; font:700 11px "DM Sans",sans-serif; cursor:pointer; }
@media (max-width:1120px) { .menu-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .menu-header { min-height:78px; padding:4px 14px; }.brand { width:145px; height:68px; }.header-note { font-size:8px; }.header-note i { width:18px; }.menu-hero { min-height:350px; padding:45px 22px 55px; }.hero-copy { padding-left:20px; text-align:left; }.menu-controls { top:78px; padding-left:14px; padding-right:14px; }.menu-content { padding-left:14px; padding-right:14px; }.menu-grid { grid-template-columns:1fr; }.menu-item { grid-template-columns:118px minmax(0,1fr); min-height:148px; }.menu-item-media { min-height:148px; }.group-heading h2::before { display:none; } footer { min-height:112px; align-items:flex-start; flex-direction:column; gap:2px; padding:7px 14px 16px; } footer img { width:110px; height:62px; margin-left:17.5px; } footer p { max-width:310px; margin:0; font-size:10px; text-align:left; }.qr-card { padding:25px 18px 30px; }.qr-brand { width:230px; height:155px; } }
@media (max-width:390px) { .menu-item { grid-template-columns:103px minmax(0,1fr); }.menu-item-copy { padding:15px 13px; }.menu-item h3 { font-size:19px; }.menu-hero h1 { font-size:50px; } }
@media print { .qr-body { padding:0; background:white; }.qr-card { border:0; box-shadow:none; }.qr-actions { display:none; } }