/* Shared site tool navigation — sticky bar under header */
.site-nav{
  position:sticky;
  top:0;
  z-index:800;
  background:rgba(246,243,236,.94);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(0,0,0,.08);
  padding:10px clamp(12px,3vw,36px);
}
.site-nav-inner{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  max-width:1100px;
  margin:0 auto;
}
.site-nav a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  text-decoration:none;
  font-family:var(--font-display, "Inter", system-ui, sans-serif);
  font-size:13px;
  font-weight:700;
  letter-spacing:.02em;
  color:#fff;
  padding:10px 16px;
  border-radius:999px;
  transition:transform .2s ease, opacity .2s ease, box-shadow .2s ease;
  white-space:nowrap;
  box-shadow:0 1px 0 rgba(255,255,255,.12) inset;
}
.site-nav a:hover{
  transform:translateY(-1px);
  opacity:.92;
}
.site-nav a .gq-icon{font-size:15px; line-height:1}
.site-nav a.gq-active,
.site-nav a[aria-current="page"]{
  opacity:.72;
  pointer-events:none;
  box-shadow:0 0 0 2px rgba(0,0,0,.12);
}
/* Hero-embedded variant: not sticky, no bar chrome */
.hero-banner .site-nav,
.hero .site-nav{
  position:static;
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom:0;
  padding:0 0 8px;
  margin:0 0 8px;
}
.hero-banner .site-nav-inner,
.hero .site-nav-inner{
  flex-wrap:wrap;
  justify-content:center;
  width:auto;
  max-width:none;
}

/* ============================================================
   Homepage Ctrip-style sticky tool bar (body[data-nav="ctrip"])
   ============================================================ */
body[data-nav="ctrip"] .site-nav.site-nav--ctrip,
body[data-nav="ctrip"] .site-nav{
  position:sticky;
  top:0;
  z-index:850;
  display:block !important;
  margin:0;
  padding:8px 10px;
  background:rgba(255,253,251,.96);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(0,0,0,.08);
  box-shadow:0 4px 14px rgba(40,20,8,.05);
}
body[data-nav="ctrip"] .site-nav-inner{
  display:flex;
  flex-wrap:nowrap;
  justify-content:space-between;
  align-items:stretch;
  gap:6px;
  max-width:720px;
  margin:0 auto;
  padding:0;
  overflow:visible;
}
body[data-nav="ctrip"] .site-nav a{
  flex:1 1 0;
  min-width:0;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:4px;
  padding:10px 4px 8px;
  border-radius:14px;
  font-size:11px;
  font-weight:800;
  letter-spacing:0;
  line-height:1.15;
  white-space:nowrap;
  box-shadow:0 3px 8px rgba(0,0,0,.14) !important;
  transform:none;
}
body[data-nav="ctrip"] .site-nav a:hover{
  transform:translateY(-1px);
  opacity:1;
}
body[data-nav="ctrip"] .site-nav a:active{
  transform:scale(.96);
  filter:brightness(1.05);
}
body[data-nav="ctrip"] .site-nav a .gq-icon{font-size:20px; line-height:1}
body[data-nav="ctrip"] .site-nav a .gq-text{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}
body[data-nav="ctrip"] .site-nav-tools-btn,
body[data-nav="ctrip"] .site-nav-sheet{
  display:none !important;
}

@media(max-width:700px){
  body[data-nav="ctrip"] .site-nav{
    padding:7px 8px;
  }
  body[data-nav="ctrip"] .site-nav-inner{gap:5px}
  body[data-nav="ctrip"] .site-nav a{
    padding:8px 2px 7px;
    border-radius:12px;
    font-size:9px;
  }
  body[data-nav="ctrip"] .site-nav a .gq-icon{font-size:18px}
}

/* Legacy chrome */
.site-nav-fab,
.site-nav-backdrop,
.bc-cta-nav-rail{
  display:none !important;
}

/* Header trigger + bottom sheet (mobile scheme A) — tool pages */
.site-nav-tools-btn{
  display:none;
  align-items:center;
  justify-content:center;
  gap:5px;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  color:#2a241c;
  border-radius:999px;
  padding:6px 12px;
  font-family:inherit;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  cursor:pointer;
  white-space:nowrap;
  line-height:1.2;
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset;
}
.site-nav-tools-btn:active{transform:scale(.97)}
.site-nav-tools-btn[aria-expanded="true"]{
  background:#2a241c;
  color:#fff;
  border-color:#2a241c;
}
.site-nav-tools-ico{font-size:13px; line-height:1}

.site-nav-sheet{
  position:fixed;
  inset:0;
  z-index:1000;
  visibility:hidden;
  pointer-events:none;
}
body.site-nav-sheet-open .site-nav-sheet{
  visibility:visible;
  pointer-events:auto;
}
.site-nav-sheet-scrim{
  position:absolute;
  inset:0;
  border:0;
  margin:0;
  padding:0;
  background:rgba(20,16,10,.36);
  -webkit-backdrop-filter:blur(2px);
  backdrop-filter:blur(2px);
  cursor:pointer;
  opacity:0;
  transition:opacity .2s ease;
}
body.site-nav-sheet-open .site-nav-sheet-scrim{opacity:1}
.site-nav-sheet-panel{
  position:absolute;
  left:0; right:0; bottom:0;
  max-height:min(78vh, 560px);
  padding:10px 14px calc(14px + env(safe-area-inset-bottom, 0px));
  background:#fffdfb;
  border-radius:22px 22px 0 0;
  border:1px solid rgba(0,0,0,.08);
  border-bottom:0;
  box-shadow:0 -12px 36px rgba(40,20,8,.16);
  display:flex;
  flex-direction:column;
  gap:10px;
  transform:translateY(108%);
  transition:transform .24s cubic-bezier(.22,.8,.28,1);
}
body.site-nav-sheet-open .site-nav-sheet-panel{
  transform:translateY(0);
}
.site-nav-sheet-handle{
  width:36px;
  height:4px;
  border-radius:999px;
  background:rgba(0,0,0,.12);
  margin:2px auto 0;
}
.site-nav-sheet-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 2px;
}
.site-nav-sheet-title{
  margin:0;
  font-family:var(--font-display, "Inter", system-ui, sans-serif);
  font-size:16px;
  font-weight:800;
  color:#1a1a1a;
}
.site-nav-sheet-close{
  width:34px;
  height:34px;
  border:0;
  border-radius:10px;
  background:rgba(0,0,0,.05);
  color:#444;
  font-size:20px;
  line-height:1;
  cursor:pointer;
}
.site-nav-sheet-body{
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  padding-bottom:4px;
}

@media(max-width:700px){
  body:not([data-nav="ctrip"]) .site-nav{
    display:none !important;
  }
  body.site-nav-sheet-open{
    overflow:hidden;
  }
  body:not([data-nav="ctrip"]) .site-nav-tools-btn{display:inline-flex}
  .topbar .right-top{
    flex-direction:row;
    align-items:center;
    gap:8px;
  }
  .topbar{z-index:900}

  .site-nav-sheet .site-nav{
    display:block !important;
    position:static !important;
    background:transparent;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    border:0;
    padding:0;
    margin:0;
    box-shadow:none;
  }
  .site-nav-sheet .site-nav-inner{
    display:flex;
    flex-direction:column;
    flex-wrap:nowrap;
    align-items:stretch;
    gap:8px;
    max-width:none;
    margin:0;
    padding:0;
  }
  .site-nav-sheet .site-nav a{
    width:100%;
    justify-content:flex-start;
    gap:10px;
    padding:14px 16px;
    border-radius:14px;
    font-size:15px;
    white-space:normal;
    box-shadow:0 2px 8px rgba(0,0,0,.12);
    transform:none;
  }
  .site-nav-sheet .site-nav a:hover{
    transform:none;
    opacity:1;
  }
  .site-nav-sheet .site-nav a:active{
    transform:scale(.985);
    filter:brightness(1.05);
  }
  .site-nav-sheet .site-nav a .gq-icon{font-size:18px}
  .site-nav-sheet .site-nav a .gq-text{
    display:inline;
    overflow:visible;
    max-width:none;
  }
  .site-nav-sheet .site-nav a.gq-active,
  .site-nav-sheet .site-nav a[aria-current="page"]{
    opacity:1;
    pointer-events:none;
    filter:saturate(.6) brightness(.92);
    box-shadow:0 0 0 2px rgba(255,255,255,.85) inset, 0 2px 8px rgba(0,0,0,.12);
  }
}

@media(min-width:701px){
  body:not([data-nav="ctrip"]) .site-nav-tools-btn,
  body:not([data-nav="ctrip"]) .site-nav-sheet{display:none !important}
  .site-nav-tools-btn,
  .site-nav-sheet{display:none !important}
}
