.home-header { gap:12px; }
.home-header > .home-nav { order:1; }
.home-header > .nav-toggle { order:3; }
.language-switch { order:2; flex:none; display:inline-flex; align-items:center; padding:3px; gap:2px; border:1px solid var(--line); border-radius:999px; position:relative; isolation:isolate; }
.language-switch::before { content:""; position:absolute; z-index:0; top:3px; bottom:3px; left:3px; width:36px; border-radius:999px; background:#f3e3d5; box-shadow:0 1px 2px #6e2c1d10; pointer-events:none; transform:translateX(0); transition:transform .28s cubic-bezier(.22,.8,.24,1); }
.language-switch:has(a[data-language="en"][aria-current="page"]), .language-switch:has(a[data-language="en"][data-language-pending]) { --language-pill-shift:38px; }
.language-switch:has(a[data-language="vi"][aria-current="page"]), .language-switch:has(a[data-language="vi"][data-language-pending]) { --language-pill-shift:0px; }
.language-switch::before { transform:translateX(var(--language-pill-shift,0px)); }
.language-switch a { position:relative; z-index:1; display:grid; place-items:center; min-width:36px; min-height:30px; padding:2px 8px; border:1px solid transparent; border-radius:999px; text-decoration:none; font:800 11px/1 var(--sans); color:var(--muted); touch-action:manipulation; -webkit-tap-highlight-color:transparent; background:transparent; transition:background-color .15s,color .2s,border-color .15s; }
@media(hover:hover) and (pointer:fine) { .language-switch a:not([aria-current="page"]):hover { background:var(--cream); color:var(--brown); } }
.language-switch a[aria-current="page"] { background:transparent; color:var(--brown); border-color:transparent; box-shadow:none; }
.language-switch a:active { background:#e4c9b2; color:var(--brown); }
.language-switch a[data-language-pending] { border-color:var(--brown); background:#f3e3d5; color:var(--brown); }
.language-switch a:focus-visible { outline:2px solid var(--brown); outline-offset:3px; }
.language-switch { position:relative; }
.language-switch[aria-busy] a { cursor:progress; }
.language-switch__status { position:absolute; top:calc(100% + 8px); right:0; width:230px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--paper); color:var(--brown); box-shadow:var(--shadow); font:600 12px/1.5 var(--sans); }
.language-switch__status:empty { display:none; }
@media(prefers-reduced-motion:reduce) { .language-switch::before, .language-switch a { transition:none; } }
@media(min-width:901px) and (max-width:1279px) { .home-header .home-nav a.nav-phone { display:none; } .home-header .home-brand small { display:none; } .home-header .home-nav > a { padding-inline:8px; } }
@media(max-width:900px) { .language-switch { margin-left:auto; } .home-header .home-brand { min-width:0; } }
@media(max-width:480px) { .home-header .home-brand small { display:none; } .home-header { gap:8px; } }

.home-nav a.nav-seasonal{border:1px solid transparent;background:transparent;color:var(--brown)}.home-nav a.nav-seasonal:hover{background:var(--cream)}.home-nav a.nav-seasonal[aria-current="page"]{background:#f3e3d5;color:var(--brown);border-color:transparent}@media(min-width:901px) and (max-width:1439px){.home-header .home-nav a.nav-phone,.home-header .home-brand small{display:none}}@media(min-width:901px) and (max-width:1100px){.home-header{gap:8px}.home-header .home-brand__name{font-size:1.35rem}.home-header .home-nav{gap:1px}.home-header .home-nav a{font-size:12px;padding-inline:7px}.home-header .home-nav .nav-gallery small{display:none}}

.home-header .home-nav a.nav-gallery{border-color:var(--line);background:transparent;box-shadow:none}.home-header .home-nav a.nav-gallery:hover{background:var(--cream);border-color:var(--line)}.home-header .home-nav a.nav-gallery[aria-current="page"]{background:#f3e3d5;border-color:var(--line);color:var(--brown)}

/* One header size on every public route and at every scroll position. */
.home-header,.home-header.is-scrolled{--header-now:var(--header)}
.home-header .home-brand,.home-header.is-scrolled .home-brand{flex-shrink:0;transform:none}
.home-header .nav-toggle{flex:0 0 44px}
@media(max-width:380px){.home-header .home-brand{gap:8px}.home-header .home-brand img,.home-header.is-scrolled .home-brand img{width:40px;height:40px}.home-header .home-brand__name,.home-header.is-scrolled .home-brand__name{font-size:1.4rem}}