.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}}

/* Compact product shortcuts, retaining all eight categories and readable titles. */
@media(max-width:900px){
 .home-page .home-jump{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-columns:auto;gap:10px}
 .home-page .home-jump a{min-width:0;min-height:86px;padding:12px;display:flex;flex-direction:column;justify-content:center;gap:5px}
 .home-page .home-jump strong{font-size:14px;line-height:1.35;white-space:normal;overflow-wrap:break-word}
 .home-page .home-jump span{font-size:12px;line-height:1.45;margin:0}
}
@media(min-width:600px) and (max-width:900px){.home-page .home-jump{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Touch feedback stays on brand without leaving desktop hover styles stuck. */
.gallery-page .lightbox figure>img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.home-jump a,.home-nav a,.nav-toggle,.nav-group__toggle,.lightbox button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.home-jump a:focus-visible,.nav-toggle:focus-visible,.lightbox button:focus-visible{outline:2px solid #a4623f;outline-offset:3px}
.nav-toggle:active,.lightbox button:active{filter:brightness(.92)}
@media(hover:none){
 .home-page .home-jump a:hover{background:#fff;transform:none}
 .home-page .home-jump a:active{background:#f3e3d5;border-color:#c9a98f}
 .home-nav a.nav-seasonal:not([aria-current="page"]):hover,.home-header .home-nav a.nav-gallery:not([aria-current="page"]):hover{background:transparent}
 .home-button:hover{transform:none}
 .home-button:active{transform:scale(.985)}
}
