/* Home entrance follows the approved two-brand reference. */
@font-face { font-family:"Bintang Serif"; src:url("/assets/fonts/NotoSerifSC-Home-500.ttf") format("truetype"); font-style:normal; font-weight:500; font-display:swap; }
:root { color-scheme:dark; font-family:Arial,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif; background:#09090b; color:#f3f0e9; -webkit-font-smoothing:antialiased; --home-gold:#e5d49b; --home-muted:#a6a4ab; }
* { box-sizing:border-box; }
body { margin:0; min-height:100svh; }
a { color:inherit; text-decoration:none; -webkit-tap-highlight-color:transparent; }
img { display:block; max-width:100%; height:auto; }
a:focus-visible { outline:2px solid #f8dfa4; outline-offset:5px; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.skip-link { position:absolute; left:20px; top:-100px; padding:12px 18px; background:#282127; z-index:20; }
.skip-link:focus { top:10px; }
.home-wrap { width:calc(100% - 80px); max-width:1200px; margin-inline:auto; }
.home-header { border-block:1px solid #ffffff26; background:#09090b; }
.header-inner { display:flex; justify-content:space-between; align-items:center; gap:24px; min-height:86px; }
.home-wordmark { font-size:23px; font-weight:700; letter-spacing:3.6px; line-height:1.15; white-space:nowrap; }
.home-wordmark small { display:block; margin-top:9px; color:#aeacb3; font-size:10px; font-weight:400; letter-spacing:4px; }
.home-nav { display:flex; align-items:center; gap:30px; color:var(--home-muted); font-size:15px; }
.home-nav a { display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; }
.home-nav a[aria-current="page"],.home-nav a:hover { color:var(--home-gold); }
.home-main { padding-block:30px; }
.venue-entries { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.venue-entry { container-type:inline-size; position:relative; isolation:isolate; display:block; overflow:hidden; min-width:0; border:1px solid #9e7d435e; border-radius:13px; background:#0e0c13; box-shadow:inset 0 0 0 1px #e2bc5e0a; transition:border-color 220ms ease,box-shadow 220ms ease; }
.venue-entry:focus-visible { outline-offset:4px; }
.venue-entry::before { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(90deg,#09090cf5 0%,#0b090de8 27%,#0b090d91 48%,#0b090d08 76%),linear-gradient(0deg,#0b090cba,transparent 39%); }
.venue-art { position:absolute; z-index:-2; max-width:none; object-fit:cover; pointer-events:none; }
.venue-lounge .venue-art { top:-1%; left:25%; width:75%; height:124%; object-position:center top; }
.venue-ktv .venue-art { top:0; left:0; width:122%; height:134%; object-position:65% top; }
.venue-content { padding:22px 28px 18px; }
.venue-tag { display:inline-block; border:1px solid #c6c2d065; background:#0c0c11c9; padding:8px 12px; border-radius:4px; color:#edeaf1; font-size:12px; line-height:1.25; letter-spacing:1.2px; }
.venue-brand { display:flex; align-items:center; height:30cqw; max-height:176px; margin-block:9px 4px; }
.venue-logo { object-fit:contain; object-position:left center; }
.venue-lounge .venue-logo { width:47cqw; height:30cqw; max-height:176px; }
.venue-ktv .venue-logo { width:32cqw; height:29cqw; max-height:170px; }
.venue-content h2 { margin:0 0 11px; font-family:"Bintang Serif","Noto Serif CJK SC","Songti SC","SimSun",serif; font-size:clamp(32px,8cqw,50px); font-weight:500; line-height:1.2; letter-spacing:2px; text-shadow:0 2px 15px #0009; }
.venue-english { display:block; color:#e6d7a7; font-size:11px; letter-spacing:2.4px; line-height:1.5; }
.venue-description { margin:17px 0 16px; color:#e3e0e5; font-size:14px; line-height:1.7; letter-spacing:.2px; }
.venue-enter { position:relative; isolation:isolate; display:flex; align-items:center; justify-content:space-between; gap:20px; width:220px; max-width:100%; min-height:52px; padding:13px 20px; overflow:hidden; border:1px solid #ffe2a0; border-radius:9px; background:linear-gradient(112deg,#be8b37 0%,#e3bc69 24%,#fae6a8 49%,#e6bd67 74%,#c89540 100%); color:#291a08; font-size:16px; font-weight:700; line-height:1.4; letter-spacing:.6px; box-shadow:inset 0 1px 0 #fff2ca,inset 0 -1px 0 #8b641e6b,0 3px 19px #e2b35a45; transition:box-shadow 180ms ease,transform 180ms ease; }
.venue-enter-label,.venue-enter svg { position:relative; z-index:1; }
.venue-enter svg { flex:none; width:12px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; transition:transform 220ms ease; }
.venue-enter::after { content:""; position:absolute; z-index:0; pointer-events:none; top:-70%; left:-50%; width:42%; height:240%; background:linear-gradient(90deg,transparent,#fff8deab,transparent); transform:translateX(-150%) skewX(-24deg); animation:venue-gold-sheen 6.5s ease-in-out infinite; }
.venue-ktv .venue-enter::after { animation-delay:1.1s; }
.venue-entry:focus-visible .venue-enter { box-shadow:inset 0 1px 0 #fff7dc,inset 0 -1px 0 #8b641e6b,0 4px 25px #edbe6469; }
.venue-entry:active .venue-enter { transform:translateY(1px); box-shadow:inset 0 2px 5px #93651c44,0 1px 12px #e2b35a55; }
@keyframes venue-gold-sheen { 0%,8% { transform:translateX(-150%) skewX(-24deg); opacity:0; } 11% { opacity:.65; } 33% { transform:translateX(500%) skewX(-24deg); opacity:.65; } 34%,100% { transform:translateX(500%) skewX(-24deg); opacity:0; } }
.venue-caption { position:absolute; right:13px; bottom:15px; color:#d7cedb; background:#100b168c; border-radius:3px; padding:4px 6px; font-size:9px; letter-spacing:.5px; }
.home-footer { border-top:1px solid #ffffff29; }
.home-contact { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:4px 20px; min-height:66px; padding-block:8px; border-bottom:1px solid #ffffff29; color:var(--home-muted); font-size:12px; }
.home-contact a { display:inline-flex; align-items:center; gap:10px; min-height:44px; color:var(--home-gold); font-size:14px; white-space:nowrap; }
.home-legal { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px 20px; padding-block:24px 28px; color:#828087; font-size:11px; line-height:1.6; }
@media(hover:hover) {
  .venue-entry:hover { border-color:#ddbd7ca3; box-shadow:0 0 24px #ac7a3112; }
  .venue-entry:hover .venue-enter { box-shadow:inset 0 1px 0 #fff7dc,inset 0 -1px 0 #8b641e6b,0 4px 25px #edbe6469; }
  .venue-entry:hover .venue-enter svg { transform:translateX(4px); }
  .home-contact a:hover { color:#fff0c0; }
}
@media(max-width:900px) {
  .home-wrap { width:calc(100% - 48px); max-width:630px; }
  .header-inner { min-height:80px; }
  .home-wordmark { font-size:21px; letter-spacing:3px; }
  .home-wordmark small { font-size:9px; letter-spacing:3.6px; }
  .home-nav { gap:16px; font-size:14px; }
  .venue-entries { grid-template-columns:1fr; gap:18px; }
  .home-main { padding-block:22px; }
}
@media(max-width:540px) {
  .home-wrap { width:calc(100% - 36px); }
  .header-inner { min-height:64px; gap:12px; }
  .home-wordmark { font-size:16px; letter-spacing:2.5px; }
  .home-wordmark small { margin-top:6px; font-size:7px; letter-spacing:2.9px; }
  .home-nav { gap:9px; font-size:12px; }
  .home-nav a { min-width:34px; }
  .home-main { padding-block:14px; }
  .venue-entries { gap:14px; }
  .venue-entry { border-radius:10px; }
  .venue-content { padding:12px 18px 18px; }
  .venue-tag { font-size:11px; padding:6px 9px; letter-spacing:.7px; }
  .venue-brand { height:27cqw; margin-block:7px 4px; }
  .venue-lounge .venue-logo { width:45cqw; height:28cqw; }
  .venue-ktv .venue-logo { width:34cqw; height:27cqw; }
  .venue-content h2 { font-size:clamp(28px,8cqw,35px); letter-spacing:1px; margin-bottom:8px; }
  .venue-english { font-size:10px; letter-spacing:1.8px; }
  .venue-description { font-size:12px; line-height:1.65; margin:12px 0 10px; letter-spacing:0; }
  .venue-enter { width:196px; min-height:48px; padding:11px 16px; gap:16px; font-size:14px; }
  .venue-enter svg { width:10px; height:16px; }
  .venue-caption { right:9px; bottom:12px; font-size:8px; padding:3px 5px; }
  .home-contact { min-height:54px; gap:0 12px; font-size:10px; padding-block:4px; }
  .home-contact a { font-size:11px; gap:7px; }
  .home-legal { display:block; padding-block:16px 22px; font-size:9px; line-height:1.7; }
  .home-legal span { display:block; }
}
@media(max-width:359px) {
  .home-wrap { width:calc(100% - 28px); }
  .home-wordmark { font-size:14px; letter-spacing:2px; }
  .home-wordmark small { font-size:6px; letter-spacing:2.6px; }
  .home-nav { gap:4px; font-size:11px; }
  .venue-content { padding-inline:14px; }
  .venue-tag { font-size:10px; }
  .venue-description { font-size:11px; }
  .venue-english { font-size:9px; letter-spacing:1.4px; }
  .home-contact { padding-block:9px 2px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; } .venue-enter::after { animation:none; opacity:0; } }