:root { --ink:#1e2725; --cream:#f5f0e8; --paper:#fffdf8; --green:#163d3e; --gold:#c99719; --muted:#7c7b72; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:Arial,"Noto Sans Thai",Tahoma,sans-serif; }
.topbar { position:absolute; z-index:2; width:100%; display:flex; align-items:flex-start; justify-content:space-between; padding:22px 24px; color:white; }
.wordmark { color:white; text-decoration:none; font-size:1.5rem; font-weight:800; line-height:.65; letter-spacing:-1.8px; transform:rotate(-4deg); }
.wordmark span { padding-left:20px; }
.topbar-link { color:white; font-size:.8rem; font-weight:bold; text-decoration:none; }
.lang-switch { position:fixed; z-index:4; top:14px; right:clamp(14px,4vw,84px); display:flex; gap:2px; padding:4px; border-radius:999px; background:rgba(22,61,62,.88); box-shadow:0 6px 18px rgba(0,0,0,.18); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.lang-switch button { display:inline-flex; align-items:center; gap:6px; padding:7px 11px; border:0; border-radius:999px; background:transparent; color:rgba(255,255,255,.78); font:inherit; font-size:.72rem; font-weight:700; cursor:pointer; }
.lang-switch button svg { width:17px; height:12px; border-radius:2px; box-shadow:0 0 0 .5px rgba(0,0,0,.2), 0 0 0 1px rgba(255,255,255,.14); }
.lang-switch button[aria-pressed="true"] { background:var(--gold); color:var(--ink); }
@media (max-width:739px) { .lang-switch button span { display:none; } .lang-switch button { padding:8px 9px; } }
.hero { min-height:680px; display:flex; align-items:flex-end; padding:36px 24px 96px; color:white; background:linear-gradient(180deg,rgba(5,21,19,.10),rgba(5,21,19,.65)),url('assets/menu-page-1.jpg') center/cover; }
.hero-copy { max-width:500px; }
.eyebrow { margin:0 0 10px; color:var(--gold); font-size:.72rem; font-weight:700; letter-spacing:1.3px; text-transform:uppercase; }
h1,h2,p { margin-top:0; }
h1 { margin-bottom:20px; font-size:clamp(3.25rem,12vw,6.4rem); line-height:.85; letter-spacing:-4px; }
h2 { margin-bottom:18px; font-size:clamp(2.15rem,8vw,4.5rem); letter-spacing:-2.5px; line-height:.94; }
.intro { font-size:1rem; line-height:1.55; }
.button { display:inline-flex; justify-content:center; align-items:center; min-height:48px; padding:0 20px; border-radius:2px; font-size:.84rem; font-weight:700; text-decoration:none; }
.button-light { color:var(--ink); background:var(--paper); margin-top:10px; }
.button-dark { color:white; background:var(--green); }
.quick-actions { display:grid; grid-template-columns:repeat(3,1fr); background:var(--green); }
.quick-actions a { padding:20px 12px; color:white; font-size:.76rem; line-height:1.35; text-decoration:none; border-right:1px solid rgba(255,255,255,.2); }
.quick-actions span { display:block; color:#f2cb59; margin-bottom:4px; font-size:.62rem; }
.menu-section { padding:78px 18px 72px; }
.section-heading { padding:0 6px; }
.category-nav { display:flex; gap:8px; overflow:auto; padding:4px 6px 20px; scrollbar-width:none; }
.category-nav button { flex:0 0 auto; padding:9px 13px; border:1px solid #d6d0c5; border-radius:999px; background:transparent; font:inherit; font-size:.78rem; color:var(--ink); cursor:pointer; }
.category-nav button[aria-selected="true"] { border-color:var(--green); background:var(--green); color:white; }
.menu-groups { display:grid; gap:24px; max-width:1080px; margin:auto; }
.menu-group { overflow:hidden; background:var(--paper); box-shadow:0 8px 28px rgba(44,38,26,.06); }
.category-visual { min-height:220px; padding:20px; color:white; display:flex; align-items:flex-end; background-position:center; background-size:cover; background-color:var(--green); }
.category-visual h3 { margin:0; font-size:1.7rem; letter-spacing:-1px; line-height:1; text-shadow:0 1px 10px rgba(0,0,0,.25); }
.category-visual p { margin:7px 0 0; font-size:.72rem; letter-spacing:1px; }
.items { padding:8px 18px 12px; }
.item { padding:15px 0; border-bottom:1px solid #eae5dc; }
.item:last-child { border-bottom:0; }
.item-name { margin:0 0 4px; font-size:.96rem; font-weight:700; }
.item-meta { margin:0; color:var(--muted); font-size:.7rem; line-height:1.35; }
html[lang="zh"] body { font-family:-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",Arial,sans-serif; }
html[lang="ko"] body { font-family:-apple-system,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",Arial,sans-serif; }
html[lang="ja"] body { font-family:-apple-system,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Noto Sans JP",sans-serif; }
html[lang="zh"] h1, html[lang="ko"] h1, html[lang="ja"] h1 { font-size:clamp(2.75rem,10vw,4.75rem); }
html[lang="zh"] h1, html[lang="zh"] h2 { letter-spacing:-1px; }
html[lang="ko"] h1, html[lang="ko"] h2 { letter-spacing:-1.5px; }
html[lang="ja"] h1, html[lang="ja"] h2 { letter-spacing:-1px; }
html[lang="zh"] .category-visual h3, html[lang="ko"] .category-visual h3, html[lang="ja"] .category-visual h3 { letter-spacing:-.5px; }
.story-card { min-height:520px; display:flex; align-items:flex-end; padding:40px 24px; color:white; background:linear-gradient(180deg,rgba(14,37,35,.04),rgba(14,37,35,.80)),url('assets/menu-page-2.jpg') 20% center/cover; }
.story-card p:not(.eyebrow) { line-height:1.55; }
.visit { padding:78px 24px; background:var(--paper); }
.visit h2 span { color:var(--gold); }
.visit p:not(.eyebrow) { line-height:1.6; font-size:.95rem; }
.visit-links { display:flex; flex-direction:column; align-items:flex-start; gap:18px; margin-top:28px; }
.text-link { color:var(--ink); font-size:.85rem; font-weight:700; text-decoration:none; }
footer { padding:20px; background:var(--green); color:#cbd7d1; text-align:center; font-size:.65rem; letter-spacing:1.4px; }
.sticky-menu { position:fixed; z-index:3; right:16px; bottom:16px; display:flex; gap:20px; align-items:center; padding:13px 15px; border-radius:999px; color:white; background:var(--ink); box-shadow:0 10px 25px rgba(0,0,0,.24); font-size:.8rem; font-weight:bold; text-decoration:none; }
.sticky-menu span { color:#f2cb59; font-size:1rem; }
@media (min-width:740px) { .topbar { padding:32px 6vw; }.hero { min-height:760px; padding:60px 8vw 120px; background-position:center 42%; }.quick-actions { padding:0 7vw; }.quick-actions a { padding:25px 24px; }.menu-section { padding:110px 7vw; }.menu-groups { grid-template-columns:repeat(2,1fr); }.menu-group:first-child { grid-column:span 2; display:grid; grid-template-columns:1fr 1fr; }.menu-group:first-child .category-visual { min-height:440px; }.story-card { min-height:600px; padding:70px 8vw; }.visit { padding:100px 8vw; }.sticky-menu { display:none; } }