/* ════════════════════════════════════════════════════════════════
   JIANGNAN 江南 — Shanghai-deco, black & antique gold
   Italiana (display) · Spectral (body serif) · Josefin Sans (UI)
   ════════════════════════════════════════════════════════════════ */

:root{
  --ink-0:#060504;            /* intro black            */
  --ink-1:#0b0908;            /* page                   */
  --ink-2:#110e0a;            /* panel                  */
  --ink-3:#17130d;            /* raised panel           */
  --gold:#c8a35e;             /* primary gold           */
  --gold-hi:#e9cf94;          /* lit gold               */
  --gold-lo:#8c7142;          /* bronze                 */
  --gold-12:rgba(200,163,94,.12);
  --gold-22:rgba(200,163,94,.22);
  --gold-40:rgba(200,163,94,.40);
  --gold-60:rgba(216,178,108,.60);
  --cream:#f3ebd9;            /* headlines              */
  --paper:#cfc3ab;            /* body text              */
  --mute:#9b8e74;             /* secondary text         */
  --font-display:"Italiana",serif;
  --font-body:"Spectral",Georgia,serif;
  --font-ui:"Josefin Sans",sans-serif;
  --font-zh:"Noto Serif SC","Songti SC","STSong",serif;
  --ease-out:cubic-bezier(.22,.61,.21,1);
  --ease-cine:cubic-bezier(.77,0,.18,1);
  --pad-x:clamp(1.25rem,5vw,4rem);
  --lacquer-2:var(--ink-2);
  --gold-dim:var(--gold-lo);
  --gold-bright:var(--gold-hi);
  --gold-faint:var(--gold-22);
  --gold-ghost:rgba(200,163,94,.1);
  --porcelain:var(--cream);
  --paper-dim:var(--mute);
  --sans:var(--font-ui);
  --serif:var(--font-body);
  --zh:var(--font-zh);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

html{
  scroll-behavior:smooth;
  scroll-padding-top:84px;
}
body{
  background:var(--ink-1);
  color:var(--paper);
  font-family:var(--font-body);
  font-weight:300;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.is-locked{overflow:hidden;height:100dvh}
body.menu-open{overflow:hidden}

img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
i{font-style:normal}
em{font-style:italic}

::selection{background:rgba(200,163,94,.85);color:#15100a}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:#0a0806}
::-webkit-scrollbar-thumb{background:linear-gradient(#8c7142,#54421f);border:2px solid #0a0806;border-radius:6px}
html{scrollbar-color:#7d6336 #0a0806;scrollbar-width:thin}

:focus-visible{outline:2px solid #dcba6f;outline-offset:3px;border-radius:2px}

/* page background — lacquer depth */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(110% 70% at 50% -10%, rgba(193,148,72,.07), transparent 55%),
    radial-gradient(90% 60% at 50% 115%, rgba(160,116,48,.05), transparent 55%),
    linear-gradient(180deg,#0b0908,#0a0807);
}

/* ── film grain ─────────────────────────────────────────────── */
.grain{
  position:fixed;inset:0;z-index:400;pointer-events:none;
  opacity:.05;mix-blend-mode:overlay;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E") repeat;
  background-size:160px 160px;
}

/* ── shared atoms ───────────────────────────────────────────── */
.vtext{writing-mode:vertical-rl;text-orientation:upright}

.kicker{
  display:flex;align-items:center;justify-content:center;gap:1rem;
  font-family:var(--font-ui);font-size:.68rem;font-weight:400;
  letter-spacing:.34em;text-transform:uppercase;color:var(--mute);
}
.kicker [lang="zh"]{
  font-family:var(--font-zh);font-weight:400;font-size:.82rem;
  letter-spacing:.3em;color:var(--gold);
}
.kicker b{width:34px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-40));flex:none}
.kicker b:last-child{background:linear-gradient(270deg,transparent,var(--gold-40))}

.sec-head{text-align:center;max-width:760px;margin:0 auto}
.sec-title{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(2.1rem,4.6vw,3.5rem);line-height:1.12;
  color:var(--cream);margin-top:1.1rem;
  text-wrap:balance;
}
.sec-lede{
  font-style:italic;color:var(--mute);
  font-size:clamp(1rem,1.6vw,1.12rem);margin-top:.9rem;
}

/* buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  font-family:var(--font-ui);font-size:.72rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;
  padding:1em 1.9em .9em;line-height:1;
  border:1px solid transparent;cursor:pointer;
  transition:transform .35s var(--ease-out),box-shadow .35s,background-color .35s,color .35s,border-color .35s;
  position:relative;overflow:hidden;white-space:nowrap;
}
.btn--gold{
  background:linear-gradient(180deg,#e3c386,#b88f47);
  color:#181208;border-color:#d9b96f;
}
.btn--gold::after{
  content:"";position:absolute;top:0;bottom:0;left:-70%;width:45%;
  background:linear-gradient(105deg,transparent,rgba(255,250,235,.55),transparent);
  transform:skewX(-18deg);transition:left .7s var(--ease-out);
}
.btn--gold:hover{transform:translateY(-2px);box-shadow:0 14px 34px -12px rgba(200,160,80,.55)}
.btn--gold:hover::after{left:130%}
.btn--line{border-color:var(--gold-40);color:var(--gold-hi)}
.btn--line:hover{border-color:var(--gold);background:rgba(200,163,94,.08);transform:translateY(-2px)}
.btn--ghost{color:var(--paper);padding-inline:1.1em}
.btn--ghost svg{width:13px;height:13px;fill:currentColor}
.btn--ghost:hover{color:var(--gold-hi)}

/* double hairline frame with deco corner brackets */
.deco-frame{position:relative;border:1px solid var(--gold-22)}
.deco-frame::after{
  content:"";position:absolute;inset:-9px;pointer-events:none;
  border:1px solid var(--gold-12);
  background:
    linear-gradient(var(--gold-60),var(--gold-60)) 0 0/15px 1px,
    linear-gradient(var(--gold-60),var(--gold-60)) 0 0/1px 15px,
    linear-gradient(var(--gold-60),var(--gold-60)) 100% 0/15px 1px,
    linear-gradient(var(--gold-60),var(--gold-60)) 100% 0/1px 15px,
    linear-gradient(var(--gold-60),var(--gold-60)) 0 100%/15px 1px,
    linear-gradient(var(--gold-60),var(--gold-60)) 0 100%/1px 15px,
    linear-gradient(var(--gold-60),var(--gold-60)) 100% 100%/15px 1px,
    linear-gradient(var(--gold-60),var(--gold-60)) 100% 100%/1px 15px;
  background-repeat:no-repeat;
}

/* scroll reveal */
[data-rv]{
  opacity:0;transform:translateY(26px);
  transition:opacity 1.05s ease var(--d,0s),transform 1.05s var(--ease-out) var(--d,0s);
  will-change:opacity,transform;
}
[data-rv].in{opacity:1;transform:none}

/* ════════════════════════════════════════════════════════════════
   OPENING SEQUENCE
   black → Jiangnan logo appears → lobby blooms in behind it →
   settle into the hero
   ════════════════════════════════════════════════════════════════ */
.intro{
  position:fixed;inset:0;z-index:350;overflow:hidden;
  background:var(--ink-0);
}
.intro.is-p3{
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity 1.3s ease .05s,visibility 0s 1.45s;
}

/* the room stays hidden until after the logo has arrived */
.intro-room{
  position:absolute;inset:0;opacity:0;
  transition:opacity 2.45s cubic-bezier(.35,.2,.25,1);
}
.intro-room img{
  width:100%;height:100%;object-fit:cover;
  filter:brightness(.2) saturate(.72) sepia(.35) hue-rotate(-6deg);
  transform:scale(1.18);
  transition:filter 3.2s cubic-bezier(.35,.2,.25,1),transform 6.5s cubic-bezier(.3,.3,.2,1);
}
.intro.is-p2 .intro-room{opacity:1}
.intro.is-p2 .intro-room img{
  filter:brightness(.62) saturate(.96) sepia(.22) hue-rotate(-6deg);
  transform:scale(1.07);
}
.intro.is-p3 .intro-room img{transform:scale(1.012)}

/* warm light blooming on */
.intro-bloom{
  position:absolute;inset:0;pointer-events:none;opacity:0;
  background:radial-gradient(62% 50% at 50% 36%,rgba(233,198,124,.32),rgba(233,198,124,.05) 55%,transparent 75%);
  mix-blend-mode:screen;
  transition:opacity 2.8s ease .15s;
}
.intro.is-p2 .intro-bloom{opacity:1;animation:bloomBreathe 5.5s ease-in-out 1.8s infinite alternate}
@keyframes bloomBreathe{from{transform:scale(1)}to{transform:scale(1.06)}}

/* chandelier candle flicker */
.intro-candle{
  position:absolute;left:50%;top:14%;width:46vmin;height:34vmin;
  transform:translateX(-50%);pointer-events:none;opacity:0;
  background:radial-gradient(closest-side,rgba(255,219,150,.5),transparent 70%);
  mix-blend-mode:screen;filter:blur(6px);
  transition:opacity 2.4s ease .3s;
}
.intro.is-p2 .intro-candle{opacity:.9;animation:flicker 4.2s linear 1.8s infinite}
@keyframes flicker{
  0%,100%{opacity:.9}42%{opacity:.72}47%{opacity:.95}
  58%{opacity:.8}71%{opacity:.92}84%{opacity:.76}
}

/* smoke */
.intro-smoke,.hero-smoke{
  position:absolute;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(closest-side,rgba(214,182,130,.10),rgba(214,182,130,.035) 55%,transparent 75%);
  filter:blur(34px);border-radius:50%;
}
.intro-smoke{opacity:0;transition:opacity 3.5s ease 1s}
.intro.is-p2 .intro-smoke{opacity:1}
.intro-smoke--a{width:95vmax;height:62vmax;left:-25%;bottom:-38%;animation:smokeA 17s ease-in-out infinite alternate}
.intro-smoke--b{width:80vmax;height:55vmax;right:-30%;bottom:-30%;animation:smokeB 21s ease-in-out infinite alternate}
.intro-smoke--c{width:60vmax;height:45vmax;left:8%;bottom:-20%;animation:smokeA 26s ease-in-out 2s infinite alternate-reverse;opacity:.7}
@keyframes smokeA{
  from{transform:translate3d(-4%,6%,0) rotate(-2deg) scale(1)}
  to{transform:translate3d(6%,-14%,0) rotate(3deg) scale(1.15)}
}
@keyframes smokeB{
  from{transform:translate3d(5%,4%,0) scale(1.05)}
  to{transform:translate3d(-7%,-12%,0) scale(1.2)}
}

/* rising gold dust */
.intro-dust{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity 2s ease .55s}
.intro.is-p2 .intro-dust{opacity:1}
.intro-dust i{
  position:absolute;bottom:-2%;width:3px;height:3px;border-radius:50%;
  background:#ecd29a;box-shadow:0 0 7px 1px rgba(236,210,154,.75);
  animation:dustUp var(--t,12s) linear var(--w,0s) infinite;
  opacity:0;
}
@keyframes dustUp{
  0%{transform:translate3d(0,0,0) scale(.5);opacity:0}
  10%{opacity:.85}
  60%{opacity:.45}
  100%{transform:translate3d(var(--sw,20px),-86vh,0) scale(1.05);opacity:0}
}
.intro-dust i:nth-child(1){left:8%;--t:11s;--w:.2s;--sw:26px}
.intro-dust i:nth-child(2){left:16%;--t:14s;--w:2.1s;--sw:-20px;width:2px;height:2px}
.intro-dust i:nth-child(3){left:23%;--t:10s;--w:1.2s;--sw:14px}
.intro-dust i:nth-child(4){left:30%;--t:15s;--w:.6s;--sw:-30px;width:2px;height:2px}
.intro-dust i:nth-child(5){left:37%;--t:12s;--w:2.8s;--sw:22px}
.intro-dust i:nth-child(6){left:44%;--t:9.5s;--w:1.6s;--sw:-12px}
.intro-dust i:nth-child(7){left:50%;--t:13s;--w:.9s;--sw:30px;width:4px;height:4px}
.intro-dust i:nth-child(8){left:56%;--t:11.5s;--w:2.4s;--sw:-24px}
.intro-dust i:nth-child(9){left:62%;--t:14.5s;--w:.4s;--sw:18px;width:2px;height:2px}
.intro-dust i:nth-child(10){left:68%;--t:10.5s;--w:1.9s;--sw:-16px}
.intro-dust i:nth-child(11){left:74%;--t:12.5s;--w:3.1s;--sw:24px}
.intro-dust i:nth-child(12){left:80%;--t:9s;--w:1.1s;--sw:-22px;width:2px;height:2px}
.intro-dust i:nth-child(13){left:86%;--t:13.5s;--w:2.2s;--sw:16px}
.intro-dust i:nth-child(14){left:92%;--t:11s;--w:.7s;--sw:-26px}
.intro-dust i:nth-child(15){left:12%;--t:16s;--w:3.6s;--sw:34px;width:2px;height:2px}
.intro-dust i:nth-child(16){left:33%;--t:15.5s;--w:4.2s;--sw:-18px}
.intro-dust i:nth-child(17){left:59%;--t:16.5s;--w:3.9s;--sw:20px;width:2px;height:2px}
.intro-dust i:nth-child(18){left:88%;--t:15s;--w:4.6s;--sw:-32px}

/* vignette */
.intro-vignette{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 45%,transparent 40%,rgba(5,4,3,.72) 88%),
             linear-gradient(180deg,rgba(5,4,3,.5),transparent 22%,transparent 70%,rgba(5,4,3,.66));
}

/* the first breath — a lone ember before the room appears */
.intro-spark{
  display:none;
  position:absolute;left:50%;top:50%;width:7px;height:7px;
  transform:translate(-50%,-50%) rotate(45deg);
  background:var(--gold-hi);box-shadow:0 0 18px 3px rgba(233,207,148,.7);
  animation:sparkPulse 1.5s ease-in-out infinite alternate;
  transition:opacity 1s ease;
}
@keyframes sparkPulse{from{opacity:.35;transform:translate(-50%,-50%) rotate(45deg) scale(.7)}to{opacity:1;transform:translate(-50%,-50%) rotate(45deg) scale(1.1)}}

/* logo reveal — first, alone on black */
.intro-logo{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:1.3rem;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity 1.9s ease .12s,visibility 0s;
  text-align:center;padding:0 var(--pad-x);
}
.intro.is-p1 .intro-logo{opacity:1;visibility:visible}
.intro.is-p2 .intro-logo{opacity:.72;visibility:visible;transition:opacity 2.15s ease .25s,visibility 0s}
.intro-logo-type{
  display:grid;justify-items:center;gap:.85rem;
  transform:scale(.95);filter:blur(14px);
  transition:transform 2.45s var(--ease-out) .1s,filter 2.45s ease .1s;
}
.intro-logo-zh{
  font-family:var(--font-zh);font-size:clamp(4.6rem,13vw,8.5rem);
  font-weight:300;letter-spacing:.18em;text-indent:.18em;line-height:.92;
  color:var(--cream);
  text-shadow:0 0 36px rgba(233,207,148,.22),0 0 110px rgba(200,163,94,.16);
}
.intro-logo-en{
  font-family:var(--font-display);font-size:clamp(1.4rem,4vw,2.65rem);
  letter-spacing:.32em;text-indent:.32em;line-height:1;color:var(--gold-hi);
  text-shadow:0 0 34px rgba(200,163,94,.18);
}
.intro.is-p1 .intro-logo-type{transform:scale(1);filter:blur(0)}
.intro.is-p2 .intro-logo-type{transform:scale(.985);filter:blur(.25px)}
.intro-logo-rule{
  width:min(230px,32vw);height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-60),transparent);
  transform:scaleX(0);transition:transform 1.7s var(--ease-out) .8s;
}
.intro.is-p1 .intro-logo-rule{transform:scaleX(1)}
.intro-logo-sub{
  max-width:min(760px,82vw);
  font-family:var(--font-ui);font-weight:300;font-size:clamp(.58rem,1.25vw,.78rem);
  line-height:1.7;letter-spacing:.36em;text-transform:uppercase;color:var(--gold-hi);
  opacity:0;transform:translateY(6px);
  transition:opacity 1.9s ease 1.1s,transform 1.9s var(--ease-out) 1.1s,letter-spacing 2.6s ease 1.1s;
  padding-left:.36em; /* optical centering against tracking */
}
.intro.is-p1 .intro-logo-sub{opacity:.92;transform:none;letter-spacing:.24em}

.intro-skip{
  position:absolute;right:clamp(1.2rem,3vw,2.4rem);bottom:clamp(1.2rem,3vw,2.2rem);
  background:none;border:1px solid var(--gold-22);color:var(--mute);
  font-family:var(--font-ui);font-size:.62rem;font-weight:400;
  letter-spacing:.26em;text-transform:uppercase;
  padding:.8em 1.4em .7em;cursor:pointer;opacity:0;
  transition:opacity .8s ease 1.6s,color .3s,border-color .3s;
}
.intro.is-p1 .intro-skip,.intro.is-p2 .intro-skip{opacity:.75}
.intro-skip:hover{color:var(--gold-hi);border-color:var(--gold-40);opacity:1}

/* ════════════════════════════════════════════════════════════════
   NAVIGATION
   ════════════════════════════════════════════════════════════════ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:200;
  display:flex;align-items:center;gap:clamp(1.2rem,3vw,2.4rem);
  padding:1.05rem clamp(1.25rem,4vw,2.6rem);
  opacity:0;transform:translateY(-12px);
  transition:opacity .9s ease 1s,transform .9s var(--ease-out) 1s,
             background-color .45s ease,border-color .45s ease,padding .35s ease;
  border-bottom:1px solid transparent;
}
body.ready .nav{opacity:1;transform:none}
.nav--solid{
  background:rgba(10,8,6,.88);
  -webkit-backdrop-filter:blur(14px) saturate(1.05);
  backdrop-filter:blur(14px) saturate(1.05);
  border-bottom-color:var(--gold-12);
  padding-block:.62rem;
}
.nav-brand{display:flex;align-items:baseline;gap:.6rem;white-space:nowrap}
.nav-brand-en{
  font-family:var(--font-display);font-size:1.32rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--cream);
}
.nav-brand-zh{
  font-family:var(--font-zh);font-weight:400;font-size:.8rem;color:var(--gold);
  border-left:1px solid var(--gold-22);padding-left:.6rem;letter-spacing:.2em;
  white-space:nowrap;
}
.nav-menu{display:flex;gap:clamp(1.1rem,2.4vw,2rem);margin-inline:auto}
.nav-menu a{
  font-family:var(--font-ui);font-size:.71rem;font-weight:400;
  letter-spacing:.22em;text-transform:uppercase;color:#b5a78b;
  padding:.4em 0;position:relative;transition:color .3s;
}
.nav-menu a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:var(--gold);transform:scaleX(0);transform-origin:right;
  transition:transform .45s var(--ease-out);
}
.nav-menu a:hover,.nav-menu a[aria-current]{color:var(--gold-hi)}
.nav-menu a:hover::after,.nav-menu a[aria-current]::after{transform:scaleX(1);transform-origin:left}
.nav-side{display:flex;align-items:center;gap:1rem}
.nav-phone{
  font-family:var(--font-ui);font-size:.74rem;letter-spacing:.14em;
  color:var(--mute);transition:color .3s;
}
.nav-phone:hover{color:var(--gold-hi)}
.nav-instagram{
  display:grid;place-items:center;width:34px;height:34px;flex:none;
  border:1px solid var(--gold-22);color:var(--gold-hi);
  background:rgba(10,8,6,.2);
  transition:color .3s,border-color .3s,background-color .3s,transform .3s var(--ease-out);
}
.nav-instagram svg{
  width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.55;
  stroke-linecap:round;stroke-linejoin:round;
}
.nav-instagram:hover{
  color:var(--cream);border-color:var(--gold-60);background:rgba(200,163,94,.1);
  transform:translateY(-2px);
}
.nav-reserve{padding:.78em 1.45em .68em;font-size:.66rem}
.nav-burger{
  display:none;flex-direction:column;gap:7px;background:none;border:0;
  padding:10px 4px;cursor:pointer;margin-left:auto;
}
.nav-burger span{width:26px;height:1.5px;background:var(--gold-hi);transition:transform .45s var(--ease-out),opacity .3s;display:block}
body.menu-open .nav-burger span:nth-child(1){transform:translateY(4.25px) rotate(45deg)}
body.menu-open .nav-burger span:nth-child(2){transform:translateY(-4.25px) rotate(-45deg)}

/* mobile sheet */
.mnav{
  position:fixed;inset:0;z-index:150;
  background:rgba(8,6,5,.96);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3rem;
  opacity:0;visibility:hidden;transition:opacity .55s ease,visibility 0s .55s;
}
body.menu-open .mnav{opacity:1;visibility:visible;transition:opacity .55s ease,visibility 0s}
.mnav-links{display:flex;flex-direction:column;align-items:center;gap:1.55rem}
.mnav-links a{
  font-family:var(--font-display);font-size:clamp(1.8rem,7vw,2.5rem);
  letter-spacing:.1em;color:var(--cream);display:flex;align-items:center;gap:1rem;
  opacity:0;transform:translateY(18px);
  transition:opacity .6s ease,transform .6s var(--ease-out),color .3s;
}
.mnav-links a i{font-family:var(--font-zh);font-size:.85rem;color:var(--gold-lo);letter-spacing:0}
.mnav-links a:hover{color:var(--gold-hi)}
body.menu-open .mnav-links a{opacity:1;transform:none}
body.menu-open .mnav-links a:nth-child(1){transition-delay:.12s}
body.menu-open .mnav-links a:nth-child(2){transition-delay:.18s}
body.menu-open .mnav-links a:nth-child(3){transition-delay:.24s}
body.menu-open .mnav-links a:nth-child(4){transition-delay:.3s}
body.menu-open .mnav-links a:nth-child(5){transition-delay:.36s}
.mnav-foot{display:flex;flex-direction:column;align-items:center;gap:1rem;opacity:0;transition:opacity .7s ease .42s}
body.menu-open .mnav-foot{opacity:1}
.mnav-foot p{font-family:var(--font-ui);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.mnav-zh{
  position:absolute;right:clamp(1rem,5vw,2.5rem);bottom:6%;
  font-family:var(--font-zh);font-weight:300;font-size:1.1rem;
  letter-spacing:.6em;color:var(--gold-12);writing-mode:vertical-rl;
}

/* ════════════════════════════════════════════════════════════════
   HERO — the intro settles into this same room
   ════════════════════════════════════════════════════════════════ */
.hero{
  position:relative;min-height:100svh;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;padding:7rem var(--pad-x) 6.5rem;
}
.hero-bg{position:absolute;inset:0}
.hero-img{
  width:100%;height:100%;object-fit:cover;
  filter:brightness(.6) saturate(1.02) sepia(.16) hue-rotate(-6deg);
  transform:scale(1.012);
}
body.ready .hero-img{animation:kenburns 36s ease-in-out 1.2s infinite alternate}
@keyframes kenburns{from{transform:scale(1.012)}to{transform:scale(1.1)}}
.hero-shade{
  position:absolute;inset:0;
  background:
    radial-gradient(95% 80% at 50% 42%,transparent 30%,rgba(7,5,4,.66) 92%),
    linear-gradient(180deg,rgba(7,5,4,.74),rgba(7,5,4,.18) 26%,rgba(7,5,4,.3) 60%,rgba(9,7,5,.94));
}
.hero-glow{
  position:absolute;inset:0;mix-blend-mode:screen;
  background:radial-gradient(55% 42% at 50% 30%,rgba(231,193,118,.17),transparent 70%);
  animation:flicker 7s linear 3s infinite;
}
.hero-smoke--a{width:90vmax;height:58vmax;left:-28%;bottom:-40%;opacity:.5;animation:smokeA 23s ease-in-out infinite alternate}
.hero-smoke--b{width:75vmax;height:50vmax;right:-26%;bottom:-32%;opacity:.4;animation:smokeB 28s ease-in-out 2s infinite alternate}

.hero-frame{position:absolute;inset:clamp(14px,2.2vw,26px);border:1px solid rgba(200,163,94,.15);pointer-events:none}
.hero-frame i{position:absolute;width:20px;height:20px;border-color:var(--gold-60);border-style:solid;border-width:0}
.hero-frame i:nth-child(1){top:-1px;left:-1px;border-top-width:1px;border-left-width:1px}
.hero-frame i:nth-child(2){top:-1px;right:-1px;border-top-width:1px;border-right-width:1px}
.hero-frame i:nth-child(3){bottom:-1px;left:-1px;border-bottom-width:1px;border-left-width:1px}
.hero-frame i:nth-child(4){bottom:-1px;right:-1px;border-bottom-width:1px;border-right-width:1px}

.hero-edge{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  font-family:var(--font-zh);font-weight:300;font-size:.78rem;
  letter-spacing:.55em;color:var(--gold-40);
}
.hero-edge--l{left:clamp(26px,3.4vw,46px)}
.hero-edge--r{right:clamp(26px,3.4vw,46px)}

.hero-core{position:relative;z-index:4;text-align:center;max-width:1000px}
.hero-zh{
  font-family:var(--font-zh);font-weight:300;
  font-size:clamp(1rem,1.9vw,1.3rem);letter-spacing:.72em;
  color:var(--gold-hi);display:flex;align-items:center;justify-content:center;gap:1.3rem;
  padding-left:.72em; /* optical centering */
}
.hero-zh i{width:52px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-40));flex:none}
.hero-zh i:last-child{background:linear-gradient(270deg,transparent,var(--gold-40))}

.hero-en{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(3.2rem,11vw,8.6rem);
  letter-spacing:clamp(.1em,1.4vw,.2em);
  line-height:1.04;color:var(--cream);
  margin:1.2rem 0 0;text-indent:clamp(.1em,1.4vw,.2em); /* balance tracking */
  text-shadow:0 0 60px rgba(222,180,100,.22);
}
.hero-en span{display:inline-block;opacity:0}
body.ready .hero-en span{animation:letterIn 1.05s var(--ease-out) calc(.25s + var(--i)*.075s) both}
@keyframes letterIn{
  0%{opacity:0;transform:translateY(.32em) scale(1.08);filter:blur(12px)}
  62%{opacity:1}
  100%{opacity:1;transform:none;filter:blur(0)}
}

.hero-tag{
  font-size:clamp(1.05rem,2vw,1.32rem);font-style:italic;
  color:var(--paper);margin-top:1.4rem;letter-spacing:.02em;
}
.hero-cta{
  display:flex;justify-content:center;align-items:center;gap:.95rem;
  margin-top:2.4rem;flex-wrap:wrap;
}

.hero-foot{
  position:absolute;left:0;right:0;bottom:clamp(26px,3.4vw,44px);z-index:4;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:1.5rem;
  padding:0 clamp(2.2rem,5vw,4rem);
  font-family:var(--font-ui);font-size:.66rem;font-weight:400;
  letter-spacing:.22em;text-transform:uppercase;color:var(--mute);
}
.hero-foot p:first-child{text-align:left}
.hero-foot p:last-child{text-align:right}
.hero-foot-k{color:var(--gold-lo);margin-right:.9em}
.scroll-cue{display:flex;justify-content:center;padding:0 1rem}
.scroll-cue span{position:relative;width:1px;height:58px;background:linear-gradient(rgba(200,163,94,.55),transparent);display:block}
.scroll-cue span::after{
  content:"";position:absolute;left:-1.5px;top:0;width:4px;height:4px;border-radius:50%;
  background:var(--gold-hi);box-shadow:0 0 8px 1px rgba(233,207,148,.6);
  animation:cueDrop 2.6s cubic-bezier(.45,.05,.55,.95) infinite;
}
@keyframes cueDrop{0%{transform:translateY(-2px);opacity:0}18%{opacity:1}75%{opacity:.8}100%{transform:translateY(54px);opacity:0}}

/* ════════════════════════════════════════════════════════════════
   SIGNATURES — five numbered courses
   ════════════════════════════════════════════════════════════════ */
.courses{padding:clamp(5.5rem,11vw,9.5rem) var(--pad-x);max-width:1280px;margin:0 auto}
.course-list{
  display:flex;flex-direction:column;gap:clamp(5rem,10vw,8.5rem);
  margin-top:clamp(3.5rem,7vw,6rem);
}
.course{
  display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);
  gap:clamp(2.6rem,6vw,5.5rem);align-items:center;
}
.course--flip .course-media{order:2}
.course--flip .course-body{order:1}

.course-media{position:relative}
.course-num{
  position:absolute;z-index:3;top:-9%;left:-5%;pointer-events:none;
  font-family:var(--font-zh);font-weight:300;line-height:1;
  font-size:clamp(4.6rem,8.5vw,7.6rem);
  color:transparent;-webkit-text-stroke:1px var(--gold-40);
  text-shadow:0 0 50px rgba(200,163,94,.12);
}
.course--flip .course-num{left:auto;right:-5%}

.course-img{aspect-ratio:4/5;overflow:hidden;background:var(--ink-2)}
.course-img--wide{aspect-ratio:7/5}
.course-img img{
  width:100%;height:100%;object-fit:cover;
  transform:scale(1.03);
  transition:transform 1.5s var(--ease-out),filter 1.5s ease;
  filter:saturate(1.02) brightness(.96);
}
.course-media:hover .course-img img{transform:scale(1.085);filter:saturate(1.08) brightness(1.02)}
.grade-warm{filter:saturate(.92) sepia(.14) brightness(.9)!important}
.course-media:hover .grade-warm{filter:saturate(.98) sepia(.1) brightness(.96)!important}
.course-img-bar{object-position:74% 8%}

.course-inset{
  position:absolute;z-index:4;width:37%;bottom:-11%;right:-7%;
  aspect-ratio:3/4;overflow:hidden;background:var(--ink-2);
  box-shadow:0 34px 70px -22px rgba(0,0,0,.85);
  animation:insetFloat 7s ease-in-out infinite alternate;
}
@keyframes insetFloat{from{transform:translateY(0)}to{transform:translateY(-10px)}}
.course-inset img{width:100%;height:100%;object-fit:cover}

.course-body{position:relative;max-width:50ch}
.course-no{
  font-family:var(--font-ui);font-size:.66rem;font-weight:400;
  letter-spacing:.32em;text-transform:uppercase;color:var(--gold-lo);
}
.course-no::after{
  content:"";display:block;width:58px;height:1px;
  background:linear-gradient(90deg,var(--gold-40),transparent);
  margin-top:1.1rem;
}
.course-name{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.9rem,3.4vw,2.85rem);line-height:1.1;
  color:var(--cream);margin-top:1.2rem;
}
.course-name [lang="zh"]{
  display:inline-block;font-family:var(--font-zh);font-weight:300;
  font-size:.4em;color:var(--gold);letter-spacing:.32em;
  margin-left:1rem;vertical-align:.25em;
}
.course-desc{margin-top:1.2rem;font-size:1.04rem;line-height:1.85}
.course-price{
  margin-top:1.5rem;display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;
}
.course-price b{
  font-family:var(--font-ui);font-weight:500;font-size:1.05rem;
  letter-spacing:.1em;color:var(--gold-hi);
}
.course-price b::after{content:"◆";font-size:.5em;color:var(--gold-40);margin-left:1rem;vertical-align:.25em}
.course-price span{font-style:italic;color:var(--mute);font-size:.92rem}

/* ════════════════════════════════════════════════════════════════
   STORY
   ════════════════════════════════════════════════════════════════ */
.story{
  position:relative;margin-top:clamp(2rem,5vw,3rem);
  padding:clamp(5.5rem,11vw,9rem) var(--pad-x);
  background:
    radial-gradient(70% 55% at 78% 18%,rgba(199,153,74,.07),transparent 60%),
    linear-gradient(180deg,#0d0b08,#0b0907);
  border-top:1px solid rgba(200,163,94,.09);
  border-bottom:1px solid rgba(200,163,94,.09);
}
.story-grid{
  max-width:1240px;margin:0 auto;display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  gap:clamp(3rem,7vw,6rem);align-items:center;
}
.story-media{position:relative;max-width:460px;justify-self:end;width:100%}
.story-img{aspect-ratio:3/4;overflow:hidden}
.story-img img{width:100%;height:100%;object-fit:cover;filter:brightness(.94) saturate(1.04)}
.story-poem{
  position:absolute;top:7%;right:-3.2rem;display:flex;gap:1.3rem;
  font-family:var(--font-zh);font-weight:300;font-size:.95rem;
  letter-spacing:.5em;color:var(--gold-40);
}
.story-copy .kicker{justify-content:flex-start}
.story-copy .sec-title{text-align:left;margin-top:1.2rem}
.story-text{margin-top:1.6rem;display:grid;gap:1.1rem;max-width:58ch}
.story-text em{color:var(--gold-hi);font-style:italic}
.story-credo{
  margin-top:.25rem;padding:.85rem 0 0 1.15rem;
  border-left:1px solid var(--gold-40);
  font-family:var(--font-ui);font-size:.72rem;font-weight:400;
  letter-spacing:.24em;text-transform:uppercase;line-height:1.75;
  color:var(--gold-hi);
}
.story-facts{
  display:flex;gap:clamp(1.6rem,3.5vw,3rem);margin-top:2.2rem;flex-wrap:wrap;
}
.story-facts li{border-left:1px solid var(--gold-22);padding-left:1.15rem}
.story-facts b{
  display:block;font-family:var(--font-display);font-weight:400;
  font-size:1.85rem;color:var(--gold-hi);line-height:1.1;
}
.story-facts span{
  font-family:var(--font-ui);font-size:.64rem;font-weight:400;
  letter-spacing:.2em;text-transform:uppercase;color:var(--mute);
}
.story-seal{display:flex;align-items:center;gap:1.1rem;margin-top:2.4rem}
.story-seal-mark{
  width:56px;height:56px;display:grid;place-items:center;
  font-family:var(--font-zh);font-weight:400;font-size:1.15rem;letter-spacing:.18em;
  color:var(--gold-hi);border:1px solid var(--gold-40);
  transform:none;padding-left:.18em;
  background:rgba(200,163,94,.05);
}
.story-seal-text{font-style:italic;color:var(--mute);font-size:.95rem;line-height:1.5}
.story-seal-text i{font-size:.85em}

/* ════════════════════════════════════════════════════════════════
   CARTE
   ════════════════════════════════════════════════════════════════ */
.carte{padding:clamp(5.5rem,11vw,9.5rem) var(--pad-x);max-width:1150px;margin:0 auto}
.carte-card{
  margin-top:clamp(3rem,6vw,4.5rem);
  background:linear-gradient(180deg,#15110b,#0d0a07);
  padding:clamp(1.8rem,4.5vw,3.8rem);
  box-shadow:0 40px 90px -40px rgba(0,0,0,.8);
}
.carte-fret{
  height:12px;margin-bottom:clamp(1.8rem,4vw,2.8rem);opacity:.5;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='M0 12 V2 H10 V7 H5 V12 H14' fill='none' stroke='%23c8a35e' stroke-width='1'/%3E%3C/svg%3E") repeat-x;
  background-size:12px 12px;
}
.carte-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.4rem,5vw,4.5rem)}
.carte-col:last-child{border-left:1px solid var(--gold-12);padding-left:clamp(2.4rem,5vw,4.5rem)}
.carte-group + .carte-group{margin-top:clamp(2.2rem,4vw,3.2rem)}
.carte-cat{
  display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--font-ui);font-weight:500;font-size:.78rem;
  letter-spacing:.3em;text-transform:uppercase;color:var(--gold-hi);
  border-bottom:1px solid var(--gold-22);padding-bottom:.75em;margin-bottom:.9em;
}
.carte-cat [lang="zh"]{
  font-family:var(--font-zh);font-weight:300;font-size:.85rem;
  letter-spacing:.3em;color:var(--gold-40);
}
.carte-list li{display:flex;align-items:baseline;gap:.7em;padding:.54em 0}
.ci-name{color:#e6dcc5;font-size:1.02rem}
.ci-name i{
  font-family:var(--font-zh);font-weight:300;font-size:.74rem;
  color:rgba(200,163,94,.55);margin-left:.65em;letter-spacing:.1em;
}
.ci-dots{flex:1;border-bottom:1px dotted rgba(200,163,94,.3);transform:translateY(-.34em);min-width:1.5em}
.ci-price{
  font-family:var(--font-ui);font-weight:400;font-size:.92rem;
  letter-spacing:.06em;color:var(--gold-hi);
}
.carte-list li:hover .ci-name{color:var(--cream)}
.carte-list li:hover .ci-price{color:#f3dfa8}
.ci-name,.ci-price{transition:color .35s}
.carte-note{
  text-align:center;font-style:italic;color:var(--mute);
  margin-top:clamp(2rem,4vw,2.8rem);font-size:.98rem;
}
.carte-note a{color:var(--gold-hi);border-bottom:1px solid var(--gold-40);transition:border-color .3s,color .3s}
.carte-note a:hover{color:var(--cream);border-color:var(--gold-hi)}

/* ════════════════════════════════════════════════════════════════
   V1 MERGE — SIGNATURE DISHES + TABBED MENU
   ════════════════════════════════════════════════════════════════ */
.kicker-diamond{
  width:4px;height:4px;background:var(--gold-dim);transform:rotate(45deg);flex:none;
}
.kicker-zh{
  font-family:var(--font-zh);font-size:.92rem;letter-spacing:.5em;text-indent:.5em;color:var(--gold-dim);
}
.rv{
  opacity:0;transform:translateY(22px);filter:blur(5px);
  transition:opacity .72s var(--ease-out) var(--d,0s),
             transform .72s var(--ease-out) var(--d,0s),
             filter .72s var(--ease-out) var(--d,0s);
  will-change:opacity,transform,filter;
}
.rv.in,.rv.in-view{opacity:1;transform:none;filter:blur(0)}

.frame{position:relative;overflow:hidden;background:var(--ink-3)}
.frame img{
  width:100%;height:100%;object-fit:cover;
  transform:scale(1.12);
  transition:transform 1.5s var(--ease-out) .08s,filter .8s;
}
.in .frame img,.in-view .frame img,.frame.in img,.frame.in-view img{transform:scale(1)}
.frame::after{
  content:"";position:absolute;inset:0 0 -34px;z-index:3;
  background:linear-gradient(160deg,#0e0b08,#1b1409);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0 H100 V92 C88 97 76 89 62 93 C46 98 34 90 20 94 C12 96 6 93 0 95 Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0 H100 V92 C88 97 76 89 62 93 C46 98 34 90 20 94 C12 96 6 93 0 95 Z'/%3E%3C/svg%3E");
  -webkit-mask-size:100% 100%;mask-size:100% 100%;
  transform:scaleY(1);transform-origin:top;
  transition:transform .82s var(--ease-cine) .02s;
}
.in .frame::after,.in-view .frame::after,.frame.in::after,.frame.in-view::after{transform:scaleY(0)}

.deco-corners{position:relative}
.deco-corners::before{
  content:"";position:absolute;inset:12px;pointer-events:none;z-index:4;opacity:.85;
  background:
    linear-gradient(var(--gold) 0 0) left  0 top    0 / 26px 1px,
    linear-gradient(var(--gold) 0 0) left  0 top    0 / 1px 26px,
    linear-gradient(var(--gold) 0 0) right 0 top    0 / 26px 1px,
    linear-gradient(var(--gold) 0 0) right 0 top    0 / 1px 26px,
    linear-gradient(var(--gold) 0 0) left  0 bottom 0 / 26px 1px,
    linear-gradient(var(--gold) 0 0) left  0 bottom 0 / 1px 26px,
    linear-gradient(var(--gold) 0 0) right 0 bottom 0 / 26px 1px,
    linear-gradient(var(--gold) 0 0) right 0 bottom 0 / 1px 26px;
  background-repeat:no-repeat;
  transition:inset .6s var(--ease-out);
}
.img-cine{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(7,6,5,.2),transparent 28% 64%,rgba(7,6,5,.48)),
    radial-gradient(125% 95% at 50% 38%,transparent 54%,rgba(7,6,5,.46));
}
.img-goldgrade{
  filter:sepia(.5) saturate(.68) hue-rotate(-9deg) brightness(.82) contrast(1.12);
  object-position:50% 72%;
}
.img-cocktail{
  width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 50%;
  filter:sepia(.14) saturate(.96) hue-rotate(-5deg) brightness(.92) contrast(1.08);
}
.frame .img-cocktail{transform:none}
#panel-bar .menu-visual{aspect-ratio:2/3;max-width:360px}

.signatures{
  padding:clamp(4.2rem,9vh,6.5rem) var(--pad-x) clamp(7rem,14vh,10rem);
  background:
    radial-gradient(70% 50% at 85% 8%,rgba(140,74,34,.07),transparent 60%),
    var(--ink-2);
}
.dish-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:clamp(3.3rem,7vh,5.4rem) clamp(2.6rem,5vw,5.5rem);
  max-width:1280px;margin:clamp(2.4rem,5vw,4.6rem) auto 0;
}
.dish{position:relative}
.dish:nth-child(even){margin-top:clamp(4rem,10vh,8rem);margin-bottom:calc(clamp(4rem,10vh,8rem) * -1)}
.dish-media{aspect-ratio:4/5;will-change:transform;transition:translate .9s var(--ease-out)}
.dish-c .dish-media,.dish-d .dish-media{aspect-ratio:4/3.4}
.dish-char{
  position:absolute;top:-1rem;right:.25rem;z-index:5;pointer-events:none;
  font-family:var(--font-zh);font-weight:200;font-size:clamp(1.65rem,2.8vw,2.35rem);line-height:1;
  color:rgba(233,211,160,.2);mix-blend-mode:screen;
  text-shadow:0 2px 30px rgba(0,0,0,.6);
  transition:color .6s,transform .9s var(--ease-out);
}
.dish-body{padding:1.9rem .2rem 0;max-width:34rem}
.dish-no{
  display:flex;align-items:center;gap:1rem;
  font-family:var(--font-ui);font-weight:400;font-size:.64rem;
  letter-spacing:.36em;text-transform:uppercase;color:var(--gold-lo);
}
.dish-no::before{content:"";width:30px;height:1px;background:var(--gold-lo)}
.dish-name{
  font-family:var(--font-display);font-size:clamp(1.8rem,2.7vw,2.4rem);
  font-weight:400;color:var(--cream);letter-spacing:.02em;line-height:1.2;margin-top:1rem;
}
.dish-name-zh{
  display:inline-block;font-family:var(--font-zh);font-weight:300;
  font-size:.92rem;letter-spacing:.3em;color:var(--gold-lo);
  margin-left:1.1rem;transform:translateY(-.35em);
}
.dish-desc{margin-top:1.05rem;font-size:1.04rem;line-height:1.8;color:var(--paper)}
.dish-price{display:flex;align-items:baseline;gap:1.1rem;margin-top:1.4rem}
.dish-price b{
  font-family:var(--font-ui);font-weight:500;font-size:1.1rem;
  letter-spacing:.06em;color:var(--gold-hi);
}
.dish-price span{font-style:italic;font-size:.92rem;color:var(--mute)}
.dish:hover .dish-media{translate:0 -6px}
.dish:hover .dish-media img{transform:scale(1.05)}
.dish:hover .deco-corners::before{inset:20px}
.dish:hover .dish-char{color:rgba(233,211,160,.36);transform:translateY(-5px)}

.menu{
  padding:clamp(4.5rem,10vh,7rem) var(--pad-x) clamp(5rem,11vh,7.5rem);
  max-width:1240px;margin:0 auto;
}
.menu-new{
  display:grid;grid-template-columns:minmax(0,1.08fr) minmax(330px,.92fr);
  gap:clamp(2.4rem,5vw,5rem);align-items:center;
  max-width:1180px;margin:clamp(3.5rem,7vw,5.5rem) auto 0;
  padding-block:clamp(1.2rem,2.5vw,2rem);
  border-top:1px solid rgba(200,163,94,.13);
  border-bottom:1px solid rgba(200,163,94,.13);
}
.menu-new-media{aspect-ratio:1.34/1;overflow:hidden;background:var(--ink-3)}
.menu-new-media img{
  width:100%;height:100%;object-fit:cover;object-position:50% 52%;
  filter:brightness(.88) saturate(.86) sepia(.1);
  transition:transform 1.1s var(--ease-out),filter .8s ease;
}
.menu-new:hover .menu-new-media img{transform:scale(1.035);filter:brightness(.95) saturate(.92) sepia(.06)}
.menu-new-media figcaption{
  position:absolute;z-index:4;left:1.35rem;bottom:1.2rem;
  display:flex;align-items:center;gap:.7rem;
  font-family:var(--font-zh);font-size:.76rem;letter-spacing:.34em;color:var(--gold-hi);
}
.menu-new-media figcaption span{
  font-family:var(--font-ui);font-size:.53rem;font-weight:600;letter-spacing:.22em;
  border:1px solid var(--gold-40);padding:.48em .65em .38em;color:var(--cream);
}
.menu-new-copy{padding-right:clamp(.2rem,2vw,1.2rem)}
.menu-new-kicker{
  font-family:var(--font-ui);font-size:.62rem;font-weight:500;
  letter-spacing:.28em;text-transform:uppercase;color:var(--mute);
}
.menu-new-kicker [lang="zh"]{
  font-family:var(--font-zh);font-size:.75rem;font-weight:300;
  letter-spacing:.3em;color:var(--gold);margin-right:.75rem;
}
.menu-new-copy h3{
  margin-top:1rem;font-family:var(--font-display);font-size:clamp(2rem,3.8vw,3.35rem);
  font-weight:400;line-height:1.08;color:var(--cream);text-wrap:balance;
}
.menu-new-zh{
  margin-top:.65rem;font-family:var(--font-zh);font-size:.92rem;font-weight:300;
  letter-spacing:.3em;color:var(--gold-lo);
}
.menu-new-lede{
  max-width:560px;margin-top:1.25rem;font-size:1rem;line-height:1.75;
  color:var(--paper);
}
.menu-new-price{display:flex;align-items:baseline;gap:1rem;margin-top:1.25rem}
.menu-new-price b{
  font-family:var(--font-ui);font-size:1.2rem;font-weight:500;letter-spacing:.08em;color:var(--gold-hi);
}
.menu-new-price span{
  font-family:var(--font-ui);font-size:.56rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--mute);
}
.menu-new-also{
  display:grid;grid-template-columns:1fr 1fr;margin-top:1.75rem;padding-top:1.35rem;
  border-top:1px solid rgba(200,163,94,.16);
}
.menu-new-also article{padding-right:1.2rem}
.menu-new-also article+article{padding-left:1.2rem;padding-right:0;border-left:1px solid rgba(200,163,94,.13)}
.menu-new-also article p{display:flex;align-items:baseline;justify-content:space-between;gap:.8rem}
.menu-new-also article p span{font-size:.88rem;line-height:1.35;color:var(--cream)}
.menu-new-also article p b{
  flex:none;font-family:var(--font-ui);font-size:.72rem;font-weight:500;color:var(--gold-hi);
}
.menu-new-also article i{
  display:block;margin-top:.38rem;font-family:var(--font-zh);font-size:.66rem;
  font-style:normal;font-weight:300;letter-spacing:.2em;color:var(--gold-lo);
}
.menu-new-also article small{display:block;margin-top:.55rem;font-size:.75rem;line-height:1.5;color:var(--mute)}
.menu-tabs-shell{
  position:relative;max-width:1180px;
  margin:clamp(2.2rem,5vw,3.6rem) auto 3.6rem;
}
.menu-tabs{
  display:flex;justify-content:center;flex-wrap:wrap;
  border-bottom:1px solid rgba(200,163,94,.14);
}
.menu-tabs-more{display:none}
.menu-tab{
  position:relative;display:grid;justify-items:center;gap:.3rem;
  appearance:none;border:0;background:transparent;cursor:pointer;
  padding:.9rem clamp(.7rem,1.5vw,1.55rem) 1.05rem;
  font-family:var(--font-ui);font-weight:400;font-size:.74rem;
  letter-spacing:.26em;text-transform:uppercase;color:var(--mute);
  transition:color .45s;
}
.menu-tab i{
  font-family:var(--font-zh);font-style:normal;font-size:.72rem;
  letter-spacing:.34em;text-indent:.34em;color:inherit;opacity:.6;
}
.menu-tab::after{
  content:"";position:absolute;left:18%;right:18%;bottom:-1px;height:1px;
  background:var(--gold);transform:scaleX(0);transition:transform .55s var(--ease-out);
}
.menu-tab:hover{color:var(--paper)}
.menu-tab.is-active{color:var(--gold-hi)}
.menu-tab.is-active::after{transform:scaleX(1)}
.menu-stage{display:grid;max-width:1180px;margin:0 auto}
.menu-panel{
  grid-area:1/1;
  display:grid;grid-template-columns:minmax(280px,420px) 1fr;
  gap:clamp(2.4rem,5vw,5rem);align-items:center;
  opacity:0;visibility:hidden;transform:translateY(16px);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out),visibility 0s .7s;
}
.menu-panel.is-active{
  opacity:1;visibility:visible;transform:none;
  transition:opacity .7s var(--ease-out) .15s,transform .7s var(--ease-out) .15s,visibility 0s;
}
.menu-visual{aspect-ratio:4/5;margin-left:1.6rem}
@media (min-width:981px){
  .menu-visual img{object-fit:contain}
  #panel-bar .menu-visual{aspect-ratio:4/5;max-width:none}
}
.menu-visual figcaption{
  position:absolute;left:-2.7rem;top:50%;transform:translateY(-50%);z-index:5;
  font-family:var(--font-zh);font-size:.78rem;font-weight:300;color:rgba(200,163,94,.5);
}
.menu-list{align-self:center}
.menu-list li{
  display:flex;align-items:baseline;gap:1rem;
  padding:1.18rem .2rem;border-bottom:1px solid rgba(200,163,94,.07);
}
.menu-panel.is-active .menu-list li{animation:liIn .7s var(--ease-out) both}
.menu-panel.is-active .menu-list li:nth-child(1){animation-delay:.22s}
.menu-panel.is-active .menu-list li:nth-child(2){animation-delay:.3s}
.menu-panel.is-active .menu-list li:nth-child(3){animation-delay:.38s}
.menu-panel.is-active .menu-list li:nth-child(4){animation-delay:.46s}
.menu-panel.is-active .menu-list li:nth-child(5){animation-delay:.54s}
@keyframes liIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.mi-name{font-weight:400;font-size:1.24rem;color:var(--cream);transition:color .4s}
.mi-sub{
  display:block;margin-top:.28rem;
  font-family:var(--font-body);font-size:.86rem;line-height:1.45;
  color:var(--mute);letter-spacing:.02em;
}
.mi-name i{
  font-family:var(--font-zh);font-style:normal;font-weight:300;font-size:.78rem;
  letter-spacing:.22em;color:var(--gold-lo);margin-left:.8rem;white-space:nowrap;
}
.mi-new{
  display:inline-block;vertical-align:.18em;margin-left:.7rem;padding:.35em .55em .26em;
  border:1px solid var(--gold-40);font-family:var(--font-ui);font-size:.46rem;
  font-style:normal;font-weight:600;line-height:1;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-hi);
}
.mi-dots{flex:1;min-width:30px;border-bottom:1px dotted rgba(200,163,94,.3);transform:translateY(-5px);transition:border-color .4s}
.mi-price{font-family:var(--font-ui);font-weight:500;font-size:1rem;color:var(--gold-hi);white-space:nowrap}
.mi-price::before{content:"$";font-size:.72em;margin-right:.1em;color:var(--gold-lo)}
.mi-price.mi-market::before{content:""}
.menu-list li:hover .mi-name{color:#fff4dc}
.menu-list li:hover .mi-dots{border-color:rgba(200,163,94,.65)}
.menu-note{
  text-align:center;margin-top:3.4rem;
  font-family:var(--font-ui);font-weight:300;font-size:.66rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--mute);
}
.menu-note span{display:block}
.menu-note-dietary{
  margin:.7rem 0;color:var(--cream-dim);
  font-family:var(--font-serif);font-size:.88rem;letter-spacing:0;text-transform:none;
}
.menu-note a{color:var(--gold-hi);border-bottom:1px solid rgba(200,163,94,.3);padding-bottom:2px;transition:color .4s}
.menu-note a:hover{color:var(--cream)}
.menu-remote{
  display:flex;flex-direction:column;align-items:center;gap:.65rem;
  margin-top:1.45rem;font-family:var(--font-ui);
}
.menu-remote a{
  display:inline-flex;align-items:center;justify-content:center;
  max-width:min(100%,520px);min-height:42px;padding:.92rem 1.45rem .82rem;
  border:1px solid rgba(200,163,94,.38);
  color:var(--gold-hi);font-size:.68rem;font-weight:600;
  line-height:1.35;text-align:center;letter-spacing:.18em;text-transform:uppercase;
  background:linear-gradient(135deg,rgba(200,163,94,.12),rgba(200,163,94,.03));
  box-shadow:inset 0 0 0 1px rgba(255,244,214,.04);
  transition:color .35s,border-color .35s,box-shadow .35s,transform .35s var(--ease-out);
}
.menu-remote a:hover{
  color:var(--cream);border-color:rgba(233,200,120,.72);
  box-shadow:0 14px 34px rgba(0,0,0,.24),inset 0 0 0 1px rgba(255,244,214,.08);
  transform:translateY(-1px);
}
.menu-remote span{
  max-width:520px;color:#8d8169;font-size:.68rem;line-height:1.55;
  letter-spacing:.08em;text-transform:uppercase;
}

/* ════════════════════════════════════════════════════════════════
   REVIEWS
   ════════════════════════════════════════════════════════════════ */
.reviews{
  position:relative;overflow:hidden;
  padding:clamp(5rem,9vw,7.5rem) 0 clamp(5.5rem,9vw,7.8rem);
  border-top:1px solid var(--gold-12);
  background:
    radial-gradient(circle at 50% 0%,rgba(200,163,94,.08),transparent 34rem),
    linear-gradient(180deg,#0a0807,#080706);
}
.review-marquee{
  --review-gap:clamp(1rem,2vw,1.35rem);
  margin-top:clamp(2.6rem,5vw,4rem);
  cursor:pointer;outline:none;user-select:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
}
.review-track{
  display:flex;width:max-content;gap:0;
  transform:translate3d(0,0,0);
  will-change:transform;
}
.review-marquee:focus-visible{
  outline:1px solid rgba(233,200,120,.62);
  outline-offset:8px;
}
.review-group{display:flex;gap:var(--review-gap);padding-right:var(--review-gap)}
.review-card{
  flex:0 0 clamp(290px,34vw,460px);
  min-height:212px;padding:1.55rem 1.55rem 1.3rem;
  border:1px solid rgba(200,163,94,.22);
  background:
    linear-gradient(135deg,rgba(255,244,214,.045),rgba(200,163,94,.025)),
    rgba(16,12,9,.82);
  box-shadow:0 24px 60px rgba(0,0,0,.32),inset 0 0 0 1px rgba(255,244,214,.03);
}
.review-card p{
  color:var(--paper);font-size:clamp(.98rem,1.22vw,1.1rem);
  line-height:1.58;text-wrap:pretty;
}
.review-card span{
  display:block;margin-top:1.2rem;
  font-family:var(--font-ui);font-size:.75rem;letter-spacing:.18em;
  text-transform:uppercase;color:#bda36d;
}
.review-feedback{
  margin:clamp(1.8rem,3vw,2.4rem) auto 0;
  max-width:min(620px,calc(100% - var(--pad-x) * 2));
  text-align:center;font-family:var(--font-ui);
  font-size:.68rem;line-height:1.7;letter-spacing:.18em;
  text-transform:uppercase;color:#8d8169;
}
.review-feedback--desktop a{
  color:var(--gold-hi);
  border-bottom:1px solid rgba(200,163,94,.34);
  padding-bottom:.16em;transition:color .35s,border-color .35s,text-shadow .35s;
}
.review-feedback--desktop a:hover{
  color:var(--cream);border-color:rgba(233,200,120,.72);
  text-shadow:0 0 28px rgba(233,200,120,.36);
}
.review-feedback--mobile{display:none}
.review-feedback>p{
  margin:0 0 1rem;font-size:.68rem;line-height:1.6;
  letter-spacing:.18em;text-transform:uppercase;
}
.review-feedback-actions{
  display:flex;justify-content:center;gap:1rem;
}
.review-feedback-actions a{
  display:grid;gap:.32rem;min-width:250px;padding:.9rem 1.2rem .82rem;
  border:1px solid rgba(200,163,94,.28);
  background:rgba(200,163,94,.025);
  transition:color .35s,border-color .35s,background-color .35s,transform .35s var(--ease-out);
}
.review-feedback-actions span{
  color:#8d8169;font-size:.58rem;line-height:1.3;
  letter-spacing:.18em;text-transform:uppercase;
}
.review-feedback-actions b{
  color:var(--gold-hi);font-size:.72rem;font-weight:400;
  line-height:1.35;letter-spacing:.08em;text-transform:none;
}
.review-feedback-actions a:hover{
  border-color:rgba(233,200,120,.68);background:rgba(200,163,94,.06);
  transform:translateY(-1px);
}

/* ════════════════════════════════════════════════════════════════
   RESERVE
   ════════════════════════════════════════════════════════════════ */
.reserve{position:relative;padding:clamp(6rem,12vw,10rem) var(--pad-x);overflow:hidden}
.reserve-bg{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(50% 60% at 50% 45%,rgba(212,166,86,.1),transparent 70%),
    radial-gradient(80% 50% at 50% 110%,rgba(160,116,48,.07),transparent 60%);
}
.reserve-card{
  position:relative;max-width:780px;margin:0 auto;text-align:center;
  border:1px solid var(--gold-22);padding:clamp(2.6rem,6vw,4.6rem) clamp(1.6rem,5vw,4rem);
  background:rgba(11,9,7,.72);
}
.reserve-card::after{
  content:"";position:absolute;inset:8px;border:1px solid var(--gold-12);pointer-events:none;
}
.reserve-title{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(2.1rem,5vw,3.3rem);color:var(--cream);margin-top:1.1rem;
}
.reserve-lede{max-width:54ch;margin:1.1rem auto 0;color:var(--paper);font-size:1.02rem}
.reserve-tel{
  display:inline-block;font-family:var(--font-display);
  font-size:clamp(2.3rem,6.5vw,4.4rem);letter-spacing:.05em;line-height:1.1;
  color:var(--gold-hi);margin-top:1.8rem;
  text-shadow:0 0 50px rgba(222,180,100,.3);
  border-bottom:1px solid transparent;
  transition:color .35s,text-shadow .35s,border-color .35s;
}
.reserve-tel:hover{color:#f6e3b0;text-shadow:0 0 70px rgba(233,200,120,.55);border-color:var(--gold-40)}
.reserve-sub{
  margin-top:1.3rem;font-family:var(--font-ui);font-size:.66rem;
  letter-spacing:.26em;text-transform:uppercase;color:var(--mute);
}

/* ════════════════════════════════════════════════════════════════
   VISIT
   ════════════════════════════════════════════════════════════════ */
.visit{padding:clamp(4.5rem,9vw,7.5rem) var(--pad-x) clamp(5.5rem,10vw,8.5rem);max-width:1240px;margin:0 auto}
.visit-grid{
  display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:clamp(2.2rem,4.5vw,3.6rem);margin-top:clamp(3rem,6vw,4.5rem);align-items:stretch;
}
.visit-info{background:linear-gradient(180deg,#120e0a,#0d0a08);padding:clamp(1.8rem,4vw,2.8rem)}
.visit-k{
  font-family:var(--font-ui);font-size:.64rem;font-weight:400;
  letter-spacing:.3em;text-transform:uppercase;color:var(--gold-lo);
  margin-bottom:.55em;
}
.visit-k [lang="zh"]{font-family:var(--font-zh);font-size:.78rem;color:var(--gold-40);margin-left:.6em;letter-spacing:.25em}
.visit-k:not(:first-child){margin-top:1.9em}
.visit-address{font-size:1.3rem;color:var(--cream);line-height:1.45}
.visit-address a{display:inline-block;color:inherit;transition:color .3s,text-shadow .3s}
.visit-address a:hover{color:#f6e3b0;text-shadow:0 0 34px rgba(233,200,120,.38)}
.visit-address span{display:block;font-size:.95rem;font-style:italic;color:var(--mute);margin-top:.3em}
.visit-tel a{
  font-family:var(--font-display);font-size:1.9rem;color:var(--gold-hi);
  letter-spacing:.04em;transition:color .3s,text-shadow .3s;
}
.visit-tel a:hover{color:#f6e3b0;text-shadow:0 0 40px rgba(233,200,120,.5)}
.visit-contact{
  display:flex;flex-wrap:wrap;align-items:center;gap:.45rem .7rem;
  font-size:.98rem;line-height:1.6;overflow-wrap:anywhere;
}
.visit-contact a{color:var(--gold-hi);transition:color .3s,text-shadow .3s}
.visit-contact a:hover{color:#f6e3b0;text-shadow:0 0 30px rgba(233,200,120,.42)}
.visit-contact span{color:var(--gold-40)}
.visit-hours li{
  display:flex;justify-content:space-between;align-items:baseline;gap:1.5rem;
  padding:.62em 0;border-bottom:1px dashed rgba(200,163,94,.16);
}
.visit-hours li span{font-size:1rem;color:var(--paper)}
.visit-hours li b{
  font-family:var(--font-ui);font-weight:400;font-size:.8rem;
  letter-spacing:.1em;color:var(--gold-hi);white-space:nowrap;
}
.visit-hours li.is-today span{color:var(--cream)}
.visit-hours li.is-today span::after{content:" · today";font-style:italic;color:var(--gold-hi)}
.visit-hours li.is-today b{color:#f3dfa8}
.visit-cta{display:flex;gap:.9rem;margin-top:2rem;flex-wrap:wrap}
.visit-note{margin-top:1.5rem;font-size:.92rem;font-style:italic;color:var(--mute);line-height:1.7}
.visit-map{position:relative;min-height:440px;background:var(--ink-2)}
.visit-map iframe{
  position:absolute;inset:0;width:100%;height:100%;border:0;
  filter:invert(.9) hue-rotate(185deg) saturate(.32) brightness(.92) contrast(1.08);
}
.visit-map::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  box-shadow:inset 0 0 90px rgba(5,4,3,.65);
}

/* ════════════════════════════════════════════════════════════════
   FOOTER
   ════════════════════════════════════════════════════════════════ */
.footer{border-top:1px solid var(--gold-12);padding:3.4rem var(--pad-x) 2.4rem;background:#0a0807}
.footer-rule{display:flex;align-items:center;justify-content:center;gap:1.1rem;margin-bottom:2.6rem}
.footer-rule span{width:84px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-40))}
.footer-rule span:last-child{background:linear-gradient(270deg,transparent,var(--gold-40))}
.footer-rule b{color:var(--gold-40);font-size:.55rem}
.footer-grid{
  max-width:1240px;margin:0 auto;display:grid;
  grid-template-columns:1fr auto 1fr;gap:2.5rem;align-items:start;
}
.footer-brand{display:flex;flex-direction:column;gap:.45rem}
.footer-en{font-family:var(--font-display);font-size:1.5rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cream)}
.footer-zh{font-family:var(--font-zh);font-size:.85rem;letter-spacing:.45em;color:var(--gold)}
.footer-tag{font-family:var(--font-ui);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-top:.4rem}
.footer-nav{display:flex;flex-direction:column;gap:.7rem;align-items:center}
.footer-nav a{
  font-family:var(--font-ui);font-size:.7rem;letter-spacing:.22em;
  text-transform:uppercase;color:#b5a78b;
  background:linear-gradient(var(--gold),var(--gold)) left bottom/0% 1px no-repeat;
  padding-bottom:.25em;transition:color .3s,background-size .45s var(--ease-out);
}
.footer-nav a:hover{color:var(--gold-hi);background-size:100% 1px}
.footer-find{text-align:right;font-size:.95rem;line-height:2;color:var(--paper)}
.footer-find a{color:var(--gold-hi)}
.footer-find a:hover{color:#f6e3b0}
.footer-base{
  text-align:center;margin-top:2.8rem;font-family:var(--font-ui);
  font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);
}
.footer-base [lang="zh"]{font-family:var(--font-zh);color:var(--mute);letter-spacing:.3em;margin-right:.5em}

/* ════════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════════ */
@media (max-width:1180px){
  .hero-edge{display:none}
  .story-poem{right:.7rem;color:rgba(200,163,94,.3)}
  .menu-visual{margin-left:0}
  .menu-visual figcaption{left:auto;right:1rem;color:rgba(241,233,215,.55)}
}
@media (max-width:980px){
  .nav-menu,.nav-phone{display:none}
  .nav-burger{display:flex}
  .nav-side{margin-left:auto;gap:.65rem}
  .nav-reserve{order:1}
  .nav-instagram{order:2}
  .nav-burger{margin-left:0;flex:none}

  .hero-frame{border-top-color:transparent}
  .hero-frame::before{
    content:"";position:absolute;left:-1px;right:-1px;top:54px;height:1px;
    background:rgba(200,163,94,.15);
  }
  .hero-frame i:nth-child(1),.hero-frame i:nth-child(2){top:54px}

  .dish-grid{grid-template-columns:1fr;gap:3.6rem}
  .dish:nth-child(even){margin-top:0;margin-bottom:0}
  .dish-c .dish-media,.dish-d .dish-media{aspect-ratio:4/3}

  .menu-new{grid-template-columns:1fr;gap:2.4rem}
  .menu-new-media{aspect-ratio:16/10}
  .menu-new-copy{max-width:680px;padding:0 0 1.2rem}
  .menu-tabs-shell{margin-bottom:2.8rem}
  .menu-panel{grid-template-columns:1fr;gap:2.4rem}
  .menu-visual{max-width:420px;width:100%;margin:0 auto;aspect-ratio:4/3.2}
  .menu-visual .img-goldgrade{object-position:50% 58%}

  .course,.course--flip{grid-template-columns:1fr}
  .course--flip .course-media{order:0}
  .course--flip .course-body{order:1}
  .course-media{max-width:560px}
  .course-img{aspect-ratio:5/4}
  .course-img--wide{aspect-ratio:16/10}
  .course-num{top:auto;bottom:-7%;left:auto;right:-2%;font-size:4.6rem}
  .course--flip .course-num{right:-2%}
  .course-inset{width:34%;bottom:-9%;right:4%}

  .story-grid{grid-template-columns:1fr}
  .story-media{justify-self:start;max-width:480px}
  .story-copy .sec-title{margin-top:1.2rem}

  .carte-cols{grid-template-columns:1fr}
  .carte-col:last-child{border-left:0;padding-left:0;margin-top:clamp(2.2rem,4vw,3.2rem)}

  .visit-grid{grid-template-columns:1fr}
  .visit-map{min-height:380px}

  .footer-grid{grid-template-columns:1fr;justify-items:center;text-align:center;gap:2.2rem}
  .footer-brand{align-items:center}
  .footer-find{text-align:center}
}
@media (max-width:600px){
  html{scroll-padding-top:70px}
  .nav{gap:.55rem;padding:.75rem .85rem}
  .nav-brand{gap:.45rem;align-items:center}
  .nav-brand-en{font-size:1.12rem;letter-spacing:.13em}
  .nav-brand-zh{font-size:.58rem;line-height:1;letter-spacing:.08em;padding-left:.45rem}
  .nav-side{gap:.45rem}
  .nav-instagram{width:32px;height:32px}
  .nav-instagram svg{width:16px;height:16px}
  .nav-reserve{padding:.74em 1.05em .66em;font-size:.58rem}
  .nav-burger{padding:8px 0}
  .nav-burger span{width:25px}
  .hero{padding:6.5rem 1.25rem 7.5rem}
  .hero-cta{flex-direction:column;width:min(320px,86vw);margin-inline:auto}
  .hero-cta .btn{width:100%}
  .hero-foot{grid-template-columns:1fr;justify-items:center;gap:.7rem;text-align:center}
  .hero-foot p:first-child,.hero-foot p:last-child{text-align:center}
  .scroll-cue{display:none}
  .hero-zh{letter-spacing:.5em;padding-left:.5em}
  .signatures{padding-top:3.8rem}
  .dish-char{font-size:1.8rem;right:.6rem;top:-.7rem;color:rgba(233,211,160,.16)}
  .dish-body{padding-top:1.45rem}
  .dish-name-zh{display:block;margin:.45rem 0 0;transform:none;font-size:.82rem}
  .dish-desc{font-size:1rem}
  .dish-price{display:grid;gap:.35rem}
  .menu-new{margin-top:3.2rem;gap:2rem;padding-top:1rem}
  .menu-new-media{aspect-ratio:4/3}
  .menu-new-copy h3{font-size:2.05rem}
  .menu-new-lede{font-size:.94rem;line-height:1.68}
  .menu-new-also{grid-template-columns:1fr;gap:1.15rem}
  .menu-new-also article{padding-right:0}
  .menu-new-also article+article{
    padding:1.15rem 0 0;border-left:0;border-top:1px solid rgba(200,163,94,.13);
  }
  .menu-new-media figcaption{left:1rem;bottom:.9rem}
  .menu-tabs-shell{
    margin-inline:calc(var(--pad-x) * -1);
  }
  .menu-tabs{
    justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;
    padding-left:var(--pad-x);padding-right:calc(var(--pad-x) + 2.8rem);
    scrollbar-width:none;
    scroll-snap-type:x proximity;scroll-padding-inline:var(--pad-x);
  }
  .menu-tabs::-webkit-scrollbar{display:none}
  .menu-tab{flex:0 0 auto;padding:.8rem .9rem .95rem;font-size:.64rem;scroll-snap-align:start}
  .menu-tabs-shell.has-overflow .menu-tabs-more{
    position:absolute;z-index:3;right:0;top:0;bottom:1px;width:3.4rem;
    display:grid;place-items:center;padding-left:.75rem;pointer-events:none;
    color:var(--gold-hi);
    background:linear-gradient(90deg,rgba(10,8,6,0),rgba(10,8,6,.94) 52%,var(--ink-1));
    transition:opacity .28s ease;
  }
  .menu-tabs-shell.is-at-end .menu-tabs-more{opacity:0}
  .menu-tabs-more svg{
    width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;
    stroke-linecap:round;stroke-linejoin:round;
    animation:menuTabsCue 1.5s ease-in-out infinite;
  }
  @keyframes menuTabsCue{50%{transform:translateX(4px)}}
  .menu-remote a{width:100%;font-size:.6rem;letter-spacing:.13em}
  .menu-remote span{font-size:.6rem;letter-spacing:.06em}
  .review-feedback--desktop{display:none}
  .review-feedback--mobile{
    display:block;
    max-width:calc(100% - 2.5rem);margin-top:2rem;
    letter-spacing:0;text-transform:none;
  }
  .review-feedback>p{
    margin-bottom:.85rem;font-size:.62rem;letter-spacing:.14em;
  }
  .review-feedback-actions{display:grid;gap:.7rem}
  .review-feedback-actions a{
    min-width:0;width:100%;padding:.82rem 1rem .76rem;
  }
  .review-feedback-actions span{font-size:.55rem;letter-spacing:.15em}
  .review-feedback-actions b{font-size:.7rem;overflow-wrap:anywhere}
  .menu-visual figcaption{font-size:.68rem;right:.65rem;color:rgba(241,233,215,.38)}
  .menu-list li{display:grid;grid-template-columns:1fr auto;gap:.45rem 1rem}
  .mi-dots{display:none}
  .mi-name i{display:block;margin:.28rem 0 0;font-size:.72rem}
  .course-body{max-width:none}
  .course-name [lang="zh"]{margin-left:.7rem}
  .story-poem{display:none}
  .reserve-card{padding:2.4rem 1.4rem}
  .visit-hours li{flex-direction:column;gap:.15rem;align-items:flex-start}
  .intro-logo-sub{font-size:.56rem;letter-spacing:.18em;max-width:84vw;padding-left:.18em}
  .intro.is-p1 .intro-logo-sub{letter-spacing:.13em}
}

@media (max-width:360px){
  .nav{padding-inline:.7rem;gap:.45rem}
  .nav-brand-en{font-size:1rem;letter-spacing:.1em}
  .nav-brand-zh{display:none}
  .nav-reserve{padding-inline:.9em}
}

/* ════════════════════════════════════════════════════════════════
   REDUCED MOTION
   ════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .intro{display:none}
  body.is-locked{overflow:auto;height:auto}
  [data-rv],.rv,.hero-en span{opacity:1!important;transform:none!important;filter:none!important}
  .nav{opacity:1;transform:none}
}
